/* Operation: Completely Unnecessary — mobile HUD & touch layout studio */
#touch-ui[hidden],#touch-extra[hidden],#touch-layout-editor[hidden],#touch-ui [hidden]{display:none!important}
#touch-ui{position:fixed;inset:0;z-index:12;color:#edfcf1;pointer-events:none;touch-action:none;-webkit-user-select:none;user-select:none;font-family:system-ui,sans-serif}
#touch-ui *{box-sizing:border-box}
#touch-look{position:absolute;top:0;right:0;bottom:0;left:40%;pointer-events:auto;touch-action:none;z-index:0}
#touch-buttons{position:absolute;inset:0;pointer-events:none;z-index:1}
#touch-ui .touch-btn{position:absolute;transform:translate(-50%,-50%) scale(var(--touch-scale,1));transform-origin:center;opacity:var(--touch-alpha,.92);display:flex;align-items:center;justify-content:center;flex-direction:column;gap:1px;width:52px;height:52px;min-height:0;padding:0;margin:0;line-height:1;border:1.5px solid #a2cec6a6;border-radius:15px;background:linear-gradient(145deg,#2a454ccf,#102a34e8);color:#f1fff4;box-shadow:0 4px 20px #06151944,inset 0 1px #ffffff18;backdrop-filter:blur(9px);-webkit-backdrop-filter:blur(9px);pointer-events:auto;touch-action:none;appearance:none;text-shadow:none;cursor:pointer;transition:background .13s,border-color .13s}
#touch-ui .touch-btn.main-action{width:72px;height:72px;border-radius:50%;background:linear-gradient(145deg,#ddf5ad,#b2d78b);color:#1f3a2b;border:2px solid #efffc9;box-shadow:0 3px 18px #b5e39538,0 5px 15px #0005}
#touch-ui .touch-btn.touch-captioned{width:63px;height:51px;border-radius:14px}
#touch-ui .touch-btn[data-layout-id^="equip"]{width:54px;height:49px}
#touch-ui .touch-btn.on,#touch-ui .touch-btn:active,#touch-ui .touch-btn[aria-pressed="true"]{background:linear-gradient(145deg,#e9ffc5,#b6e39e);border-color:#efffc4;color:#1f372f;opacity:1;box-shadow:0 0 0 2px #b5e69c33,0 4px 12px #0003}
#touch-ui .touch-btn .touch-glyph{width:25px;height:25px;display:block;flex:0 0 auto}
#touch-ui .touch-btn.main-action .touch-glyph{width:31px;height:31px;stroke-width:1.7}
#touch-ui .touch-caption{font:800 8px/1.1 system-ui;letter-spacing:1px;white-space:nowrap}
#touch-ui button:focus-visible{outline:3px solid #fff;outline-offset:3px}
#touch-ui #touch-move{position:absolute;transform:translate(-50%,-50%) scale(var(--touch-scale,1));width:clamp(108px,20vh,146px);height:clamp(108px,20vh,146px);border-radius:50%;border:2px solid #b5e3c2a0;background:radial-gradient(circle,#294d57a8,#15313c89);box-shadow:0 6px 25px #071d284d,inset 0 0 26px #071c2266;opacity:var(--touch-alpha,.92);pointer-events:auto;touch-action:none}
#touch-move-ring{position:absolute;inset:22%;border:1.5px dashed #dcf5dc77;border-radius:50%;pointer-events:none}
#touch-stick{position:absolute;left:calc(50% - 23px);top:calc(50% - 23px);width:46px;height:46px;border-radius:50%;border:2px solid #e6ffe1;background:linear-gradient(145deg,#d6f5d7bb,#86b9adbb);box-shadow:0 2px 12px #0007;pointer-events:none}
#touch-extra:not([hidden]){display:grid;grid-template-columns:1fr;gap:5px;position:fixed;z-index:8;overflow-y:auto;overscroll-behavior:contain;padding:7px;border:1px solid #b3d7cc99;border-radius:14px;background:#112d36ee;box-shadow:0 10px 28px #091b25bb;pointer-events:auto;touch-action:pan-y}
#touch-ui .touch-extra-btn{width:100%;min-height:43px;display:flex;align-items:center;gap:10px;margin:0;padding:8px 10px;color:#e9fff0;background:#244550b8;border:1px solid #8baea28a;border-radius:8px;font:650 11px/1.2 system-ui;text-align:left;letter-spacing:.1px;pointer-events:auto;touch-action:manipulation}
#touch-ui .touch-extra-btn .touch-glyph{width:21px;height:21px;flex:0 0 21px}
#touch-help{position:absolute;bottom:calc(8px + env(safe-area-inset-bottom));left:40%;color:#e2ffea;opacity:.6;letter-spacing:1.5px;font:700 9px system-ui;pointer-events:none}
.touch-enabled canvas{touch-action:none}
.touch-enabled #help,.touch-enabled #toolbar,.touch-enabled #reset,.touch-enabled #gun-animations-open{display:none!important}
.touch-enabled #ammo{right:auto;left:10px;top:calc(49px + env(safe-area-inset-top));bottom:auto;max-width:220px;text-align:left;pointer-events:none}
.touch-enabled #ammo strong{font-size:25px}.touch-enabled #ammo span{font-size:13px}.touch-enabled #ammo button{pointer-events:none}
.touch-enabled #brand{top:8px;left:12px}.touch-enabled #brand h1{font-size:16px}.touch-enabled #brand small{font-size:8px}
.touch-enabled #status{display:none}.touch-enabled #armory-prompt{bottom:28%}.touch-enabled #customs-prompt{bottom:32%}
@media (max-height:540px){#touch-ui .touch-btn{width:45px;height:45px;border-radius:12px}#touch-ui .touch-btn.main-action{width:61px;height:61px}#touch-ui .touch-btn.touch-captioned{width:56px;height:46px}#touch-ui .touch-btn[data-layout-id^="equip"]{width:46px;height:43px}#touch-ui #touch-move{width:112px;height:112px}#touch-help{display:none}}
@media (max-width:500px) and (orientation:portrait){#touch-ui .touch-btn{width:45px;height:45px}#touch-ui .touch-btn.main-action{width:63px;height:63px}#touch-ui .touch-btn.touch-captioned{width:44px;height:48px}#touch-ui .touch-btn[data-layout-id^="equip"]{width:48px;height:48px}#touch-ui .touch-btn .touch-glyph{width:22px;height:22px}#touch-ui #touch-move{width:108px;height:108px}#touch-help{display:none}}
@media (pointer:coarse){#customs input[type="color"]{min-height:44px;min-width:58px}#customs input[type="range"]{min-height:30px}}
/* Live, draggable preview with hit-area outlines; still 1:1 with the real HUD. */
#touch-ui.layout-editing{z-index:33}
#touch-ui.layout-editing #touch-look{pointer-events:none}
#touch-ui.layout-editing [data-layout-id]{outline:2px dashed #cde5dcaa;outline-offset:3px;cursor:grab!important}
#touch-ui.layout-editing [data-layout-id].layout-selected{outline:3px solid #ffe8a1;outline-offset:4px;filter:drop-shadow(0 0 8px #e6d79c77)}
#touch-ui.layout-editing #touch-move{outline-offset:3px}
#touch-ui.layout-editing [data-layout-id]:active{cursor:grabbing!important}
#touch-layout-editor{position:fixed;inset:0;z-index:34;pointer-events:none;background:linear-gradient(90deg,#07171966,transparent 65%);font-family:system-ui;color:#edf9f4}
#touch-layout-editor .touch-layout-panel{position:absolute;top:clamp(12px,11vh,82px);left:clamp(8px,2vw,22px);width:min(292px,36vw);max-height:calc(100dvh - 28px);overflow-y:auto;overscroll-behavior:contain;padding:15px 16px;background:#102932f5;border:1px solid #9dbdb6c0;border-radius:18px;box-shadow:0 12px 35px #000a;pointer-events:auto}
#touch-layout-editor header{display:flex;align-items:flex-start;gap:8px;justify-content:space-between}
#touch-layout-editor header small{display:block;color:#a4c6b4;font-size:8px;letter-spacing:1.2px}
#touch-layout-editor h2{margin:4px 0 0;font-size:18px;line-height:1.1;letter-spacing:.1px}
#touch-layout-editor p{font-size:10px;line-height:1.55;color:#bdd2d1;margin:12px 0}
#touch-layout-editor button{width:auto;margin:0;padding:8px 10px;border:1px solid #9eb9aa77;border-radius:9px;background:#2a474e;color:#edf5ea;font:700 11px system-ui}
#touch-layout-editor header button{width:33px;height:33px;display:grid;place-items:center;padding:4px}
#touch-layout-editor .touch-glyph{width:19px;height:19px}
#touch-layout-editor .touch-layout-slot{display:grid;grid-template-columns:repeat(3,1fr);gap:5px}
#touch-layout-editor .touch-layout-slot button{padding:8px 3px}
#touch-layout-editor .touch-layout-slot button.on{background:#d2edac;color:#203829}
#touch-layout-editor .touch-layout-extra{display:flex;align-items:center;gap:6px;font-size:10px;margin:9px 0}
#touch-layout-editor input[type="checkbox"]{accent-color:#d5eb92}
#touch-layout-editor .touch-layout-selected{display:flex;flex-wrap:wrap;align-items:center;gap:5px 8px;padding:8px 10px;margin:8px 0;background:#29444a;border:1px solid #668881;border-radius:9px}
#touch-layout-editor .touch-layout-selected span{font:700 8px system-ui;letter-spacing:1px;color:#c1dbc8}
#touch-layout-editor .touch-layout-selected strong{font-size:11px}
#touch-layout-editor .touch-layout-selected small{font-size:9px;color:#bdd6d0;width:100%}
#touch-layout-editor label[for^="touch-layout"]{display:flex;align-items:center;justify-content:space-between;font-size:10px;font-weight:650;margin:9px 0 0}
#touch-layout-editor output{color:#d5eb92;font-variant-numeric:tabular-nums}
#touch-layout-editor input[type="range"]{width:100%;height:22px;accent-color:#d5eb92;cursor:pointer}
#touch-layout-editor footer{display:flex;justify-content:flex-end;gap:6px;margin-top:8px}
#touch-layout-editor footer button{font-size:10px;padding:9px 8px}
#touch-layout-editor footer button[data-edit="save"]{background:#d5eb92;color:#1d3324;border-color:#d5eb92}
#touch-layout-editor footer button[data-edit="reset"]{margin-right:auto}
#touch-layout-editor .touch-layout-footnote{display:block;font-size:9px;color:#a3bdb9;margin-top:10px;letter-spacing:0}
@media (max-width:750px){#touch-layout-editor .touch-layout-panel{top:8px;left:8px;width:min(235px,42vw);padding:10px 11px;border-radius:12px}#touch-layout-editor h2{font-size:14px}#touch-layout-editor p{margin:6px 0;font-size:9px}#touch-layout-editor .touch-layout-selected{padding:5px 8px}#touch-layout-editor input[type="range"]{height:18px}#touch-layout-editor footer button{font-size:9px;padding:6px}#touch-layout-editor .touch-layout-footnote{font-size:8px}}
@media (max-width:500px) and (orientation:portrait){#touch-layout-editor .touch-layout-panel{width:min(285px,85vw);max-height:43dvh;top:auto;bottom:6px;left:6px}#touch-layout-editor .touch-layout-panel p{display:none}#touch-layout-editor .touch-layout-selected{margin:5px 0}#touch-layout-editor label[for^="touch-layout"]{margin-top:4px}#touch-layout-editor footer{margin-top:3px}#touch-layout-editor .touch-layout-footnote{display:none}}

#touch-layout-editor .touch-layout-header-actions{display:flex;gap:4px;flex:none}
#touch-layout-editor .touch-layout-panel.dock-alt{left:auto;right:clamp(8px,2vw,22px)}
@media(max-width:750px){#touch-layout-editor .touch-layout-panel.dock-alt{right:8px}}
@media(max-width:500px) and (orientation:portrait){#touch-layout-editor .touch-layout-panel.dock-alt{top:6px;bottom:auto;left:6px;right:auto}}

/* Heavy action is available only when the balisong is unfolded. */
#touch-ui .touch-btn.unavailable:not(.layout-selected){filter:grayscale(.8);opacity:.43}