:root{--bg: #07080c;--panel: #0d0f16;--panel-2: #11141d;--line: rgba(255,255,255,.07);--line-2: rgba(255,255,255,.12);--txt: #e7e9f0;--txt-dim: #9aa0b4;--txt-faint: #626a82;--accent: #6ea8ff;--accent-2: #8b7dff;--good: #5ad6a8;--mono: "JetBrains Mono", ui-monospace, "SF Mono", Menlo, monospace;--sans: "General Sans", system-ui, -apple-system, sans-serif;--panel-w: 600px}*{box-sizing:border-box;margin:0;padding:0}*{-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;-webkit-tap-highlight-color:transparent}img,a,canvas{-webkit-user-drag:none;user-drag:none}input,textarea,[contenteditable],[contenteditable] *{-webkit-user-select:text;user-select:text}html,body{height:100%;background:var(--bg);color:var(--txt);font-family:var(--sans);-webkit-font-smoothing:antialiased;overflow:hidden}#app{display:grid;grid-template-columns:1fr var(--panel-w);height:100vh;width:100vw}#stage{position:relative;overflow:hidden;background:#000}#gl{display:block;width:100%;height:100%}#stage-hud{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none;padding:20px 24px;display:flex;align-items:flex-start;justify-content:space-between;gap:16px}.hud-logo{display:flex;align-items:center;gap:9px;font-weight:600;font-size:15px;letter-spacing:-.01em;color:#fff;text-shadow:0 1px 12px rgba(0,0,0,.5);background:#0a0c1252;backdrop-filter:blur(14px) saturate(1.2);-webkit-backdrop-filter:blur(14px) saturate(1.2);padding:8px 13px 8px 11px;border-radius:12px;border:1px solid rgba(255,255,255,.1)}.hud-logo svg{color:var(--accent)}.hud-controls{display:flex;gap:8px;pointer-events:auto;flex-wrap:wrap;justify-content:flex-end;max-width:60%}.hud-btn{pointer-events:auto;font-family:var(--sans);font-size:12.5px;font-weight:500;color:var(--txt);background:#0a0c1266;backdrop-filter:blur(14px) saturate(1.2);-webkit-backdrop-filter:blur(14px) saturate(1.2);border:1px solid rgba(255,255,255,.1);padding:8px 13px;border-radius:10px;cursor:pointer;transition:background .15s,border-color .15s,transform .1s}.hud-btn:hover{background:#1e223099;border-color:var(--line-2)}.hud-btn:active{transform:scale(.96)}.hud-btn[aria-pressed=true]{color:var(--accent);border-color:#6ea8ff66}.hud-btn .caret{font-size:10px;opacity:.7;margin-left:2px}.hud-btn .btn-bg-name{font-weight:600}#btn-mouse[data-mode=move]{color:#ffcb7a;border-color:#ffcb7a66}#btn-mouse[data-mode=off]{color:var(--txt-faint);border-color:#ffffff1f}.scene-picker{position:relative;pointer-events:auto}.scene-menu{position:absolute;top:calc(100% + 8px);right:0;width:360px;max-width:min(86vw,360px);background:#0c0e14c7;backdrop-filter:blur(22px) saturate(1.3);-webkit-backdrop-filter:blur(22px) saturate(1.3);border:1px solid rgba(255,255,255,.12);border-radius:14px;padding:12px;box-shadow:0 18px 50px #0000008c,inset 0 1px #ffffff0f;opacity:0;transform:translateY(-6px) scale(.98);transform-origin:top right;pointer-events:none;transition:opacity .16s ease,transform .16s ease;z-index:40}.scene-picker.open .scene-menu{opacity:1;transform:translateY(0) scale(1);pointer-events:auto}.scene-menu-head{font-size:11px;font-weight:600;letter-spacing:.04em;text-transform:uppercase;color:var(--txt-dim, #8b93a7);margin:2px 4px 10px}.scene-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px;max-height:60vh;overflow-y:auto;padding-right:2px}.scene-item{display:flex;flex-direction:column;align-items:stretch;gap:6px;text-align:left;font-family:var(--sans);font-size:12.5px;font-weight:500;color:var(--txt);background:#ffffff08;border:1px solid rgba(255,255,255,.07);border-radius:10px;padding:7px;cursor:pointer;transition:background .13s,border-color .13s,transform .08s}.scene-item:hover{background:#6ea8ff1a;border-color:#6ea8ff4d}.scene-item:active{transform:scale(.97)}.scene-item.active{background:#6ea8ff29;border-color:#6ea8ff8c;color:#fff}.scene-item .scene-thumb{display:block;width:100%;aspect-ratio:96 / 60;height:auto;border-radius:6px;object-fit:cover;background:#0b1220;border:1px solid rgba(255,255,255,.06)}.scene-item .scene-thumb-ph{background:linear-gradient(135deg,#0b1220,#16233f 55%,#1e3a8a)}.scene-item .scene-meta{display:flex;align-items:center;justify-content:space-between;gap:6px;padding:0 2px 1px}.scene-item .scene-name{line-height:1.1}.scene-item .scene-mouse{font-size:10px;color:var(--accent);opacity:.85;font-weight:500;white-space:nowrap}.scene-grid::-webkit-scrollbar{width:8px}.scene-grid::-webkit-scrollbar-thumb{background:#ffffff1f;border-radius:8px}.hud-fps{position:absolute;right:24px;bottom:18px;font-family:var(--mono);font-size:11px;color:var(--txt-faint);background:#0a0c1252;padding:4px 8px;border-radius:7px;pointer-events:none}#gl-error{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;align-items:center;justify-content:center;text-align:center;padding:40px;color:var(--txt-dim);font-size:14px;line-height:1.6;background:var(--bg)}#gl-error[hidden]{display:none}#panel{background:var(--panel);border-left:1px solid var(--line);display:flex;flex-direction:column;height:100vh}.panel-head{padding:20px 20px 16px;border-bottom:1px solid var(--line);flex-shrink:0}.panel-title h1{font-size:16px;font-weight:600;letter-spacing:-.015em}.panel-title p{font-size:12px;color:var(--txt-dim);margin-top:5px;line-height:1.5}.panel-title code{font-family:var(--mono);font-size:11px;color:var(--accent)}.panel-actions{display:flex;gap:8px;margin-top:15px}.action{flex:1;font-family:var(--sans);font-size:13px;font-weight:500;color:var(--txt);background:var(--panel-2);border:1px solid var(--line-2);padding:9px 12px;border-radius:9px;cursor:pointer;transition:background .15s,border-color .15s,transform .1s}.action:hover{background:#161a25;border-color:#fff3}.action:active{transform:scale(.98)}.action.primary{background:linear-gradient(180deg,var(--accent),#5a93f0);color:#08101f;font-weight:600;border-color:transparent}.action.primary:hover{background:linear-gradient(180deg,#82b6ff,var(--accent))}.preset-bar{flex-shrink:0;padding:12px 20px;border-bottom:1px solid var(--line);display:flex;flex-direction:column;gap:8px}.preset-label{font-family:var(--mono);font-size:10px;letter-spacing:.08em;text-transform:uppercase;color:var(--txt-faint)}.preset-row{display:flex;flex-wrap:wrap;gap:6px}.preset-btn{font-family:var(--sans);font-size:12px;font-weight:500;color:var(--txt-dim);background:var(--panel-2);border:1px solid var(--line-2);padding:6px 11px;border-radius:999px;cursor:pointer;transition:background .15s,border-color .15s,color .15s,transform .1s}.preset-btn:hover{background:#161a25;color:var(--txt);border-color:#ffffff38}.preset-btn:active{transform:scale(.96)}.preset-btn.active{color:#08101f;font-weight:600;border-color:transparent;background:linear-gradient(180deg,var(--accent-2),#6f63e6)}#controls{overflow-y:auto;flex:1;padding:4px 0 12px;scrollbar-width:thin;scrollbar-color:rgba(255,255,255,.13) transparent}#controls::-webkit-scrollbar{width:9px}#controls::-webkit-scrollbar-thumb{background:#ffffff1a;border-radius:5px;border:2px solid var(--panel)}.panel-foot{flex-shrink:0;padding:11px 20px;border-top:1px solid var(--line);font-size:11px;color:var(--txt-faint);line-height:1.5}.panel-foot a{color:var(--txt-dim);text-decoration:none;border-bottom:1px solid var(--line-2)}.panel-foot a:hover{color:var(--accent);border-bottom-color:var(--accent)}.group{border-bottom:1px solid var(--line)}.group-head{display:flex;align-items:center;gap:9px;padding:13px 20px;cursor:pointer;-webkit-user-select:none;user-select:none;transition:background .12s}.group-head:hover{background:var(--panel-2)}.group-head .chev{width:14px;height:14px;color:var(--txt-faint);transition:transform .2s ease}.group.collapsed .chev{transform:rotate(-90deg)}.group-head .g-name{font-size:13px;font-weight:600;letter-spacing:-.01em;flex:1}.group-head .g-dot{width:7px;height:7px;border-radius:50%}.group-body{padding:4px 20px 16px;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:22px;row-gap:13px}.group.collapsed .group-body{display:none}.ctrl{display:grid;gap:6px}.ctrl-top{display:flex;align-items:baseline;justify-content:space-between;gap:10px}.ctrl-label{font-size:12px;color:var(--txt-dim);font-weight:500;display:flex;align-items:center;gap:5px;cursor:help}.ctrl-label .conf{font-size:8.5px;font-weight:600;padding:1px 4px;border-radius:4px;text-transform:uppercase;letter-spacing:.03em;line-height:1.4}.conf.confirmed{background:#5ad6a824;color:#6fe0b4}.conf.reverse{background:#6ea8ff24;color:#8ab9ff}.conf.inferred{background:#ffc46e21;color:#ffcb7a}.ctrl-val{font-family:var(--mono);font-size:11.5px;color:var(--txt);background:var(--panel-2);padding:2px 7px;border-radius:6px;border:1px solid var(--line);min-width:52px;text-align:right}.ctrl-val[contenteditable]{outline:none;cursor:text}.ctrl-val[contenteditable]:focus{border-color:var(--accent);color:#fff}input[type=range]{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:100%;height:4px;border-radius:3px;background:linear-gradient(90deg,var(--accent) var(--fill,50%),rgba(255,255,255,.1) var(--fill,50%));cursor:pointer}input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:15px;height:15px;border-radius:50%;background:#fff;border:2px solid #2a3245;box-shadow:0 1px 5px #0006;transition:transform .1s}input[type=range]::-webkit-slider-thumb:hover{transform:scale(1.15)}input[type=range]::-moz-range-thumb{width:15px;height:15px;border-radius:50%;background:#fff;border:2px solid #2a3245;cursor:pointer}.toggle{position:relative;width:38px;height:22px;flex-shrink:0}.toggle input{opacity:0;width:0;height:0;position:absolute}.toggle .track{position:absolute;top:0;right:0;bottom:0;left:0;border-radius:11px;background:#ffffff1f;transition:background .2s;cursor:pointer}.toggle .track:after{content:"";position:absolute;top:3px;left:3px;width:16px;height:16px;border-radius:50%;background:#fff;transition:transform .2s}.toggle input:checked+.track{background:var(--accent)}.toggle input:checked+.track:after{transform:translate(16px)}.color-row{display:flex;align-items:center;gap:9px}.color-swatch{width:30px;height:26px;border-radius:7px;border:1px solid var(--line-2);cursor:pointer;overflow:hidden;flex-shrink:0;position:relative;background-image:linear-gradient(45deg,#333 25%,transparent 25%),linear-gradient(-45deg,#333 25%,transparent 25%),linear-gradient(45deg,transparent 75%,#333 75%),linear-gradient(-45deg,transparent 75%,#333 75%);background-size:8px 8px;background-position:0 0,0 4px,4px -4px,-4px 0}.color-swatch input{opacity:0;width:100%;height:100%;cursor:pointer}.color-swatch .fill{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none}.alpha-mini{flex:1}.row-2{display:grid;grid-template-columns:1fr 1fr;gap:13px}.note{font-size:11px;color:var(--txt-faint);line-height:1.5;margin-top:-2px}.tip{position:fixed;z-index:99;max-width:280px;padding:10px 12px;background:#1a1e2b;border:1px solid var(--line-2);border-radius:9px;font-size:11.5px;line-height:1.55;color:var(--txt);box-shadow:0 8px 30px #00000080;pointer-events:none;opacity:0;transform:translateY(4px);transition:opacity .14s,transform .14s}.tip.show{opacity:1;transform:translateY(0)}.tip .tip-conf{display:block;margin-top:6px;font-size:10px;color:var(--txt-faint)}.toast{position:fixed;bottom:26px;left:calc(50% - var(--panel-w)/2);transform:translate(-50%) translateY(20px);background:var(--good);color:#042418;font-weight:600;font-size:13px;padding:11px 20px;border-radius:11px;box-shadow:0 10px 40px #0006;opacity:0;pointer-events:none;transition:opacity .2s,transform .2s;z-index:100}.toast.show{opacity:1;transform:translate(-50%) translateY(0)}.audit{position:absolute;top:64px;left:16px;z-index:90;width:320px;max-width:calc(100% - 32px);background:#080c14d1;-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);border:1px solid rgba(120,170,255,.22);border-radius:14px;box-shadow:0 14px 50px #00000080;color:#dfe9ff;font-size:12.5px;line-height:1.5;padding:14px 16px}.audit-head{display:flex;flex-direction:column;gap:2px;margin-bottom:10px}.audit-title{font-weight:700;font-size:14px;letter-spacing:.2px;color:#eaf2ff}.audit-sub{font-size:11px;color:#8fa6d0}.audit-body{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:12px;white-space:pre-wrap}.audit-body .verdict-ok{color:#54e6a8;font-weight:700}.audit-body .verdict-bad{color:#ff9e6b;font-weight:700}.audit-body .scene-name{color:#9ec1ff;font-weight:700}.audit-note{margin-top:11px;padding-top:10px;border-top:1px solid rgba(120,170,255,.16);font-size:10.5px;color:#7e93bd;line-height:1.45}@media(max-width:1040px){#app{grid-template-columns:1fr;grid-template-rows:45vh 1fr}#panel{border-left:none;border-top:1px solid var(--line);height:auto}.toast{left:50%}:root{--panel-w: 0px}.group-body{grid-template-columns:1fr}}