:root{--bg:#000;--glass:#06090ebd;--glass-strong:#06090ee6;--line:#8cbedc38;--amber:#ffb347;--cyan:#6fe3ff;--text:#dbe7f0;--text-dim:#8fa3b3;--font:ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;--mono:ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas, "Liberation Mono", monospace}*{box-sizing:border-box}html,body,#root{background:var(--bg);height:100%;color:var(--text);font-family:var(--font);-webkit-font-smoothing:antialiased;margin:0}body{overflow:hidden}#gargantua-canvas{touch-action:none;cursor:grab;background:#000;width:100%;height:100%;display:block;position:fixed;inset:0}#gargantua-canvas:active{cursor:grabbing}.hud{pointer-events:none;z-index:10;font-size:13px;position:fixed;inset:0}.hud>*{pointer-events:auto}.brand{top:max(14px, env(safe-area-inset-top));left:max(14px, env(safe-area-inset-left));border:1px solid var(--line);background:var(--glass);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);pointer-events:none;border-radius:4px;max-width:min(46vw,520px);padding:10px 14px;position:absolute}.brand-title{letter-spacing:.34em;color:#fff;text-shadow:0 0 18px #ffb34759;margin:0;font-size:22px;font-weight:600}.brand-sub{letter-spacing:.16em;text-transform:uppercase;color:var(--text-dim);margin:2px 0 8px;font-size:11px}.badges{flex-wrap:wrap;gap:6px;display:flex}.badge{font-family:var(--mono);letter-spacing:.08em;border:1px solid var(--line);color:var(--text-dim);white-space:nowrap;border-radius:3px;padding:3px 7px;font-size:10.5px}.badge-quality,.badge-cinema{color:var(--amber);border-color:#ffb34773}.badge-manual{color:var(--cyan);border-color:#6fe3ff73}.badge-paused{color:var(--text-dim)}.debug-banner{border-top:1px solid var(--line);margin-top:8px;padding-top:8px;font-size:11.5px;line-height:1.45}.debug-banner strong{color:var(--cyan);font-family:var(--mono);letter-spacing:.06em;margin-bottom:2px;display:block}.debug-banner span{color:var(--text-dim)}.panel-toggle{top:max(14px, env(safe-area-inset-top));right:max(14px, env(safe-area-inset-right));z-index:3;font-family:var(--mono);letter-spacing:.1em;color:var(--text);background:var(--glass-strong);border:1px solid var(--line);cursor:pointer;border-radius:4px;padding:7px 12px;font-size:11px;position:absolute}.panel-toggle:hover{border-color:var(--amber);color:var(--amber)}.panel{top:calc(max(14px, env(safe-area-inset-top)) + 42px);right:max(14px, env(safe-area-inset-right));background:var(--glass);border:1px solid var(--line);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border-radius:4px;width:316px;max-width:82vw;transition:transform .22s,opacity .22s;position:absolute;bottom:96px}.panel-closed{opacity:0;pointer-events:none;transform:translate(115%)}.panel-scroll{scrollbar-width:thin;height:100%;padding:8px 12px 14px;overflow-y:auto}.group+.group{margin-top:6px}.group-head{width:100%;font-family:var(--mono);letter-spacing:.16em;text-transform:uppercase;color:var(--cyan);border:0;border-bottom:1px solid var(--line);cursor:pointer;background:0 0;justify-content:space-between;padding:7px 2px;font-size:11px;display:flex}.group-body{padding:8px 0 4px}.param+.param{margin-top:7px}.param-head{justify-content:space-between;align-items:baseline;gap:8px;margin-bottom:2px;display:flex}.param-label{color:var(--text);cursor:default;font-size:11.5px}.param-value{font-family:var(--mono);color:var(--amber);font-size:11px}.param-value em{color:var(--text-dim);margin-left:2px;font-style:normal}.param-range{appearance:none;cursor:ew-resize;background:0 0;width:100%;height:16px}.param-range::-webkit-slider-runnable-track{background:#8cbedc47;height:2px}.param-range::-webkit-slider-thumb{-webkit-appearance:none;background:var(--amber);border:0;border-radius:50%;width:11px;height:11px;margin-top:-4.5px}.param-range::-moz-range-track{background:#8cbedc47;height:2px}.param-range::-moz-range-thumb{background:var(--amber);border:0;border-radius:50%;width:11px;height:11px}.wide-button{width:100%;font-family:var(--mono);letter-spacing:.08em;color:#05070a;background:var(--amber);border:1px solid var(--amber);cursor:pointer;border-radius:3px;margin-top:6px;padding:8px;font-size:11px;display:block}.wide-button.ghost{color:var(--text);border-color:var(--line);background:0 0}.wide-button.ghost:hover{color:var(--cyan);border-color:var(--cyan)}.hud-footer{left:max(14px, env(safe-area-inset-left));bottom:max(12px, env(safe-area-inset-bottom));pointer-events:none;max-width:min(64vw,900px);position:absolute}.preset-row{pointer-events:auto;flex-wrap:wrap;gap:6px;display:flex}.preset{color:var(--text);background:var(--glass);border:1px solid var(--line);cursor:pointer;border-radius:3px;align-items:center;gap:6px;padding:6px 10px;font-size:11.5px;display:inline-flex}.preset:hover{border-color:var(--cyan)}.preset-active{color:#05070a;background:var(--amber);border-color:var(--amber)}.preset-index{font-family:var(--mono);opacity:.7;font-size:10px}.legend,.debug-list{color:var(--text-dim);flex-wrap:wrap;gap:4px 12px;margin:8px 0 0;padding:0;font-size:10.5px;list-style:none;display:flex}.legend li,.debug-list li{align-items:center;gap:5px;display:inline-flex}.debug-list li button{color:inherit;cursor:pointer;background:0 0;border:1px solid #0000;border-radius:3px;align-items:center;gap:5px;padding:2px 4px;font-size:10.5px;display:inline-flex}.debug-list li button:hover{color:var(--cyan);border-color:var(--line)}.debug-current button{color:var(--amber);border-color:#ffb34780}kbd{font-family:var(--mono);color:var(--text);border:1px solid var(--line);background:#8cbedc1a;border-radius:3px;padding:1px 5px;font-size:10px}.hud-hint{left:max(14px, env(safe-area-inset-left));bottom:max(12px, env(safe-area-inset-bottom));z-index:10;font-family:var(--mono);color:var(--text-dim);background:var(--glass);border:1px solid var(--line);cursor:pointer;border-radius:3px;padding:6px 10px;font-size:11px;position:fixed}.context-overlay{z-index:40;-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);background:#0000009e;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.context-card{background:var(--glass-strong);text-align:center;border:1px solid #ffb34780;border-radius:5px;max-width:420px;padding:20px 24px}.context-card h2{letter-spacing:.12em;text-transform:uppercase;color:var(--amber);margin:0 0 8px;font-size:15px}.context-card p{color:var(--text);margin:0 0 6px;font-size:12.5px;line-height:1.6}.context-note{font-family:var(--mono);color:var(--text-dim);font-size:11px}@media (max-width:820px),(pointer:coarse){.brand{max-width:calc(100vw - 110px);padding:8px 10px}.brand-title{letter-spacing:.24em;font-size:16px}.brand-sub,.badge{font-size:9.5px}.panel{background:#06090ee6;border-bottom:0;border-left:0;border-right:0;border-radius:8px 8px 0 0;width:100%;max-width:100%;height:62vh;inset:auto 0 0}.panel-closed{opacity:0;transform:translateY(102%)}.panel-toggle{top:max(14px, env(safe-area-inset-top));bottom:auto}.hud-footer{max-width:calc(100vw - 130px);bottom:calc(max(12px, env(safe-area-inset-bottom)) + 40px)}.preset-row{flex-wrap:nowrap;padding-bottom:4px;overflow-x:auto}.preset{flex:none}.legend,.debug-list{max-height:30vh;overflow:hidden}.panel.panel-open~.hud-footer{display:none}}
