:root{color-scheme:dark;--bg: #070a0e;--panel: rgba(18, 24, 32, .88);--border: #2a3646;--text: #edf3fa;--muted: #90a0b4;--accent: #4aa3f0;--ok: #3ecf8e;--warn: #e6b84d;--err: #e85d5d;font-family:Segoe UI,system-ui,sans-serif}*{box-sizing:border-box}html,body{margin:0;height:100%;background:#000;color:var(--text);overflow:hidden}#app{position:relative;width:100%;height:100%}#stage{position:relative;width:100%;height:100%;background:#000;display:flex;align-items:center;justify-content:center}#video{width:100%;height:100%;object-fit:contain;background:#000;pointer-events:none}#touch-layer{position:absolute;inset:0;z-index:1;touch-action:none}#touch-layer.active{cursor:crosshair}#hud{position:absolute;inset:0;z-index:2;pointer-events:none;display:flex;flex-direction:column;justify-content:space-between;padding:max(12px,env(safe-area-inset-top)) 14px max(14px,env(safe-area-inset-bottom))}#hud .top,#hud .bottom,#hud button,#hud .panel{pointer-events:auto}#hud.hidden{opacity:0;transition:opacity .25s ease}#hud:not(.hidden),#hud.show{opacity:1}.top,.bottom{display:flex;flex-wrap:wrap;gap:8px;align-items:center}.panel{background:var(--panel);border:1px solid var(--border);border-radius:12px;padding:10px 12px;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);max-width:min(560px,94vw)}.drag-handle{font-size:.75rem;color:var(--muted);margin:-2px 0 8px;cursor:grab;-webkit-user-select:none;user-select:none;touch-action:none}.drag-handle:active{cursor:grabbing}.pill{display:inline-flex;align-items:center;gap:6px;padding:4px 10px;border-radius:999px;background:#00000073;border:1px solid var(--border);font-size:.85rem}.dot{width:8px;height:8px;border-radius:50%;background:var(--muted)}.dot.ok{background:var(--ok)}.dot.warn{background:var(--warn)}.dot.err{background:var(--err)}label{display:block;font-size:.75rem;color:var(--muted);margin-bottom:4px}input{width:min(420px,72vw);background:#0b1016;border:1px solid var(--border);border-radius:8px;color:var(--text);padding:8px 10px;font:inherit}button{font:inherit;font-weight:600;border:none;border-radius:8px;padding:8px 12px;background:var(--accent);color:#061018;cursor:pointer}button.secondary{background:transparent;color:var(--text);border:1px solid var(--border)}#status{font-size:.9rem}.muted{color:var(--muted);font-size:.82rem}.row{display:flex;flex-wrap:wrap;gap:8px;align-items:end;margin-top:8px}
