:root{--bg:#02040a;--ink:#d9f4ff;--dim:#bee4f58c;--faint:#96d7f529;--accent:#59d8ff;--accent-2:#9ff0ff;--amber:#ffb052;--mono:"JetBrains Mono", "SF Mono", "IBM Plex Mono", ui-monospace, Menlo, Consolas, monospace;--safe-t:env(safe-area-inset-top,0px);--safe-b:env(safe-area-inset-bottom,0px)}*{box-sizing:border-box}html,body{background:var(--bg);height:100%;color:var(--ink);font-family:var(--mono);-webkit-font-smoothing:antialiased;margin:0;overflow:hidden}button{font:inherit;color:inherit;cursor:pointer}#stage{outline:none;width:100%;height:100%;display:block;position:fixed;inset:0}#boot{z-index:50;background:var(--bg);place-items:center;transition:opacity .8s,visibility .8s;display:grid;position:fixed;inset:0}#boot.done{opacity:0;visibility:hidden}.boot-box{text-align:center;width:min(320px,70vw)}.boot-title{letter-spacing:.5em;color:var(--accent-2);margin-bottom:18px;padding-left:.5em;font-size:15px}.boot-bar{background:var(--faint);height:1px;overflow:hidden}.boot-bar i{background:var(--accent);width:40%;height:100%;box-shadow:0 0 12px var(--accent);animation:1.1s ease-in-out infinite boot;display:block}.boot-sub{letter-spacing:.14em;text-transform:uppercase;color:var(--dim);margin-top:14px;font-size:10.5px}@keyframes boot{0%{transform:translate(-100%)}to{transform:translate(250%)}}#labels{pointer-events:none;z-index:3;position:fixed;inset:0;overflow:hidden}.label-lines{width:100%;height:100%;position:absolute;inset:0;overflow:visible}.label-lines polyline{fill:none;stroke:#59d8ffb3;stroke-width:1px}.label-lines circle{fill:var(--accent-2)}.label{will-change:transform, opacity;white-space:nowrap;letter-spacing:.09em;text-transform:uppercase;color:var(--ink);text-shadow:0 0 8px #000,0 0 3px #000,0 0 2px #000;font-size:10.5px;line-height:16px;position:absolute;top:0;left:0}.hud{pointer-events:none;z-index:10;font-size:11px;position:fixed;inset:0}.hud>*{pointer-events:auto;transition:opacity .3s,visibility .3s,transform .3s}.hud.ui-hidden>:not(.ui-reveal):not(.toast){opacity:0;visibility:hidden}.ui-reveal{right:16px;top:calc(16px + var(--safe-t));color:var(--dim);letter-spacing:.12em;text-transform:uppercase;opacity:0;visibility:hidden;background:0 0;border:0;border-radius:6px;padding:6px 10px;font-size:10px;position:absolute}.hud.ui-hidden .ui-reveal{opacity:.4;visibility:visible}.hud.ui-hidden .ui-reveal:hover{opacity:1}.dock,.gesture,.drawer,.pip{-webkit-backdrop-filter:blur(14px);background:#050a12b8;border:1px solid #a0dcf51a}.brand{left:28px;top:calc(26px + var(--safe-t));pointer-events:none;position:absolute}.brand-mark{letter-spacing:.5em;color:#fff;font-size:13px;font-weight:500}.brand-sub{letter-spacing:.14em;color:var(--dim);text-transform:uppercase;margin-top:7px;font-size:10px}.corner{right:22px;top:calc(20px + var(--safe-t));gap:4px;display:flex;position:absolute}.ghost{color:var(--dim);letter-spacing:.12em;text-transform:uppercase;background:0 0;border:0;border-radius:8px;padding:7px 12px;font-size:10.5px;transition:color .15s,background .15s}.ghost:hover,.ghost.on{color:#fff;background:#8cd7f514}.ghost.round{width:30px;padding:7px 0}.dock{left:50%;bottom:calc(22px + var(--safe-b));white-space:nowrap;border-radius:12px;align-items:center;gap:2px;padding:4px;display:flex;position:absolute;transform:translate(-50%)}.dock .div{background:#a0dcf51f;width:1px;height:18px;margin:0 6px}.seg{gap:2px;display:flex}.seg button,.dbtn{color:var(--dim);letter-spacing:.1em;text-transform:uppercase;background:0 0;border:0;border-radius:8px;padding:8px 13px;font-size:10.5px;transition:color .15s,background .15s}.seg button:hover,.dbtn:hover{color:#fff}.seg button.on,.dbtn.on{color:#fff;background:#86deff24}.cam{align-items:center;gap:8px;display:flex}.rec{background:#bee4f566;border-radius:50%;width:6px;height:6px}.cam.on .rec{background:#ff5c6c;box-shadow:0 0 8px #ff5c6c}.cam.busy .rec{background:var(--amber);animation:.8s infinite pulse}@keyframes pulse{50%{opacity:.3}}.gesture{left:24px;bottom:calc(22px + var(--safe-b));border-radius:12px;align-items:center;gap:10px;max-width:300px;padding:7px 14px 7px 8px;display:flex;position:absolute;overflow:hidden}.g-icon{width:28px;height:28px;color:var(--dim);flex:none;place-items:center;transition:color .2s;display:grid}.g-icon svg{width:22px;height:22px}.g-title{letter-spacing:.12em;text-transform:uppercase;color:#fff;font-size:10.5px}.g-sub{color:var(--dim);white-space:nowrap;text-overflow:ellipsis;margin-top:3px;font-size:10px;display:none;overflow:hidden}.gesture.hint .g-sub{display:block}.g-spin{height:1px;position:absolute;bottom:0;left:0;right:0}.g-spin i{background:var(--accent);transform-origin:0;height:100%;display:block;transform:scaleX(0)}.gesture[data-state=single] .g-icon,.gesture[data-state=dual] .g-icon,.gesture[data-state=xr] .g-icon{color:var(--accent)}.gesture[data-state=idle] .g-icon{color:var(--amber)}.hud.no-gesture .gesture{opacity:0;visibility:hidden}.pip{left:24px;bottom:calc(72px + var(--safe-b));aspect-ratio:4/3;border-radius:10px;width:176px;position:absolute;overflow:hidden}.pip video,.pip canvas{object-fit:cover;width:100%;height:100%;position:absolute;inset:0}.pip video{opacity:.45;filter:grayscale(.7);transform:scaleX(-1)}.pip[data-on=false],.hud.no-pip .pip{opacity:.01;pointer-events:none;border:0;width:2px;height:2px}.drawer{right:20px;top:calc(62px + var(--safe-t));width:268px;max-height:calc(100% - 150px - var(--safe-t) - var(--safe-b));scrollbar-width:thin;opacity:0;visibility:hidden;border-radius:14px;padding:14px 16px 16px;position:absolute;overflow-y:auto;transform:translateY(-6px)}.drawer.open{opacity:1;visibility:visible;transform:none}.d-head{justify-content:space-between;align-items:center;margin-bottom:10px;display:flex}.d-head h3{letter-spacing:.2em;text-transform:uppercase;color:#fff;margin:0;font-size:10.5px;font-weight:500}.x{color:var(--dim);background:0 0;border:0;padding:2px 4px;font-size:13px}.x:hover{color:#fff}.d-note{color:var(--dim);margin:-4px 0 10px;font-size:10px}.d-foot{color:var(--dim);letter-spacing:.08em;margin-top:14px;font-size:10px}.parts{margin:0;padding:0;list-style:none}.parts li{color:#d7eef8bf;cursor:pointer;border-radius:7px;padding:7px 8px;font-size:11px;transition:background .12s,color .12s}.parts li:hover{color:#fff;background:#8cd7f512}.parts li.on{color:#fff;background:#86deff24}.link{color:var(--accent);background:0 0;border:0;margin-top:8px;padding:4px 8px;font-size:10.5px}.field{align-items:center;gap:10px;margin:10px 0;display:flex}.field label{width:72px;color:var(--dim);flex:none;font-size:10.5px}.field .seg{background:#8cd7f50d;border-radius:8px;flex:1;padding:2px}.seg.sm button{letter-spacing:.06em;flex:1;padding:5px 0;font-size:9.5px}.switches{border-top:1px solid #a0dcf514;gap:2px;margin-top:12px;padding-top:10px;display:grid}.sw{color:#d7eef8cc;cursor:pointer;justify-content:space-between;align-items:center;padding:6px 0;font-size:11px;display:flex}.sw input{appearance:none;cursor:pointer;background:#a0dcf52e;border-radius:7px;order:2;width:26px;height:14px;margin:0;transition:background .15s;position:relative}.sw input:after{content:"";background:#cfe9f5;border-radius:50%;width:10px;height:10px;transition:transform .15s;position:absolute;top:2px;left:2px}.sw input:checked{background:var(--accent)}.sw input:checked:after{background:#fff;transform:translate(12px)}.wide{color:#fff;letter-spacing:.1em;text-transform:uppercase;background:0 0;border:1px solid #a0dcf529;border-radius:8px;width:100%;margin-top:12px;padding:8px;font-size:10.5px}input[type=range]{appearance:none;background:0 0;flex:1;min-width:0;height:16px;margin:0}input[type=range]::-webkit-slider-runnable-track{background:#a0dcf533;border-radius:2px;height:2px}input[type=range]::-moz-range-track{background:#a0dcf533;height:2px}input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;background:#fff;border:0;border-radius:50%;width:11px;height:11px;margin-top:-4.5px}input[type=range]::-moz-range-thumb{background:#fff;border:0;border-radius:50%;width:11px;height:11px}.toast{left:50%;top:calc(24px + var(--safe-t));opacity:0;-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);letter-spacing:.06em;text-align:center;pointer-events:none;background:#050a12cc;border:1px solid #a0dcf51f;border-radius:10px;max-width:min(520px,90vw);padding:8px 16px;font-size:10.5px;line-height:1.5;position:absolute;transform:translate(-50%,-8px)}.toast.show{opacity:1;transform:translate(-50%)}.help{z-index:30;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);pointer-events:auto;background:#010308b3;place-items:center;display:grid;position:fixed;inset:0}.help[hidden]{display:none}.help-card{background:#060c14f2;border:1px solid #a0dcf51a;border-radius:14px;width:min(780px,94vw);max-height:88vh;padding:18px 24px 22px;overflow:auto}.help-grid{grid-template-columns:1.1fr 1fr;gap:32px;display:grid}.help h4{letter-spacing:.18em;text-transform:uppercase;color:var(--accent);margin:14px 0 8px;font-size:10px;font-weight:500}.gl{color:#d7eef8bf;gap:7px;margin:0;padding:0;line-height:1.5;list-style:none;display:grid}.gl b{color:#fff;font-weight:500}.keys{border-collapse:collapse;width:100%}.keys td{color:#d7eef8bf;padding:3px 0}.keys td:first-child{white-space:nowrap;width:96px}kbd{font-family:var(--mono);color:var(--ink);border:1px solid #a0dcf538;border-radius:4px;padding:1px 5px;font-size:10px}@media (max-width:760px){.help-grid{grid-template-columns:1fr;gap:4px}.dock{bottom:calc(14px + var(--safe-b));max-width:calc(100vw - 20px);overflow-x:auto}.seg button,.dbtn{padding:8px 9px}.gesture{bottom:calc(68px + var(--safe-b));left:12px}.pip{bottom:calc(118px + var(--safe-b));width:140px;left:12px}.brand{left:16px}.drawer{width:auto;left:10px;right:10px}}@media (prefers-reduced-motion:reduce){*{transition-duration:.01ms!important;animation-duration:.01ms!important}}