html,body{color:#eee;background:#000;height:100%;margin:0;font-family:system-ui,-apple-system,Segoe UI,Roboto,sans-serif;overflow:hidden}#stage{background:#000;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}#canvas{width:100%;height:100%;display:block}#paused{color:#fff;opacity:0;pointer-events:none;background:#00000059;border-radius:50%;justify-content:center;align-items:center;width:72px;height:72px;margin:-36px 0 0 -36px;transition:opacity .25s;display:flex;position:absolute;top:50%;left:50%}body.paused #paused{opacity:1}#hint{color:#ffffffeb;letter-spacing:.02em;white-space:nowrap;opacity:0;pointer-events:none;background:#0006;border-radius:16px;padding:7px 14px;font-size:13px;transition:opacity .8s;position:absolute;bottom:7%;left:50%;transform:translate(-50%)}#hint.show{opacity:1}#pausebtn{color:#fff;cursor:pointer;opacity:0;pointer-events:none;background:#00000061;border:none;border-radius:50%;justify-content:center;align-items:center;width:38px;height:38px;transition:opacity .3s;display:flex;position:absolute;bottom:14px;left:14px}body.controls #pausebtn{opacity:1;pointer-events:auto}#pausebtn .i-play,body.paused #pausebtn .i-pause{display:none}body.paused #pausebtn .i-play{display:block}body.playing.controls{cursor:crosshair}body.playing:not(.controls){cursor:none}#overlay{-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);background:#00000080;justify-content:center;align-items:center;transition:opacity .6s;display:flex;position:absolute;inset:0}#overlay.loading:not(.ready){background:#000}#overlay.hidden{opacity:0;pointer-events:none}#overlay .card{text-align:center;max-width:600px;padding:24px}#overlay .title{letter-spacing:.04em;font-size:30px;font-weight:300}#overlay .subtitle{color:#999;letter-spacing:.08em;text-transform:uppercase;margin-top:4px;font-size:14px}#overlay .progress{background:#ffffff26;width:220px;height:2px;margin:26px auto 10px;overflow:hidden}#overlay .bar{background:#fff;width:0;height:100%;transition:width .2s linear}#overlay .status{color:#888;min-height:16px;font-size:12px}#play{color:#fff;cursor:pointer;background:#ffffff14;border:1px solid #ffffff80;border-radius:50%;justify-content:center;align-items:center;width:64px;height:64px;margin:0 auto;transition:background .2s,transform .2s;display:flex}#play:hover{background:#ffffff2e;transform:scale(1.05)}#overlay.ready .progress,#overlay.ready .status{display:none}#overlay.ready #play{display:flex}#overlay .credit{color:#777;margin-top:26px;font-size:11px;line-height:1.5}#overlay .credit a{color:#999}#overlay .keys{color:#555;margin-top:8px;font-size:11px}#hud{color:#0f0;white-space:pre;pointer-events:none;text-shadow:0 0 2px #000;font:11px/1.4 ui-monospace,Consolas,monospace;display:none;position:absolute;top:8px;left:8px}body.debug #hud{display:block}.btn-group{flex-direction:column;align-items:center;gap:8px;margin:8px auto 4px;display:flex}#overlay.ready .btn-group{display:flex}#overlay.ready #play{margin:0 auto}.vr-btn{color:#00e5ff;cursor:pointer;background:#00e5ff1f;border:1px solid #00e5ff73;border-radius:24px;justify-content:center;align-items:center;gap:6px;padding:6px 16px;font-size:12px;font-weight:500;transition:all .25s;display:inline-flex;box-shadow:0 0 16px #00e5ff40}.vr-btn:hover{color:#fff;background:#00e5ff40;border-color:#00e5ffe6;transform:translateY(-1px);box-shadow:0 0 25px #00e5ff80}#quick-vr{color:#00e5ff;cursor:pointer;opacity:0;pointer-events:none;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);background:#00e5ff26;border:1px solid #00e5ff73;border-radius:20px;align-items:center;gap:6px;padding:8px 16px;font-size:13px;transition:opacity .3s,background .2s,box-shadow .2s;display:flex;position:absolute;bottom:14px;right:14px;box-shadow:0 0 10px #00e5ff33}body.controls #quick-vr{opacity:1;pointer-events:auto}#quick-vr:hover{color:#fff;background:#00e5ff4d;box-shadow:0 0 18px #00e5ff66}#vr-live-badge{-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);color:#fff;pointer-events:none;z-index:100;background:#000000a6;border:1px solid #ff3c3c66;border-radius:20px;align-items:center;gap:8px;padding:6px 14px;font-size:13px;font-weight:500;display:none;position:absolute;top:14px;right:14px;box-shadow:0 2px 10px #00000080}#vr-live-badge .dot{background:#ff334b;border-radius:50%;width:8px;height:8px;animation:1.5s ease-in-out infinite vr-blink;box-shadow:0 0 8px #ff334b}@keyframes vr-blink{0%,to{opacity:1;transform:scale(1)}50%{opacity:.3;transform:scale(.85)}}body.in-vr #vr-live-badge{display:flex}body.in-vr #quick-vr,body.in-vr #pausebtn,body.in-vr #hint,body.in-vr #switch-scene-btn{display:none!important}.scene-switcher{grid-template-columns:repeat(2,1fr);gap:8px;width:100%;margin-bottom:10px;display:grid}@media (max-width:480px){.scene-switcher{grid-template-columns:1fr}}.scene-tab-btn{cursor:pointer;text-align:left;color:#bbb;background:#ffffff0d;border:1.5px solid #ffffff26;border-radius:10px;outline:none;flex-direction:column;align-items:flex-start;padding:6px 10px;transition:all .25s;display:flex}.scene-tab-btn:hover{color:#fff;background:#ffffff1a;border-color:#00e5ff80;transform:translateY(-2px);box-shadow:0 4px 16px #0006}.scene-tab-btn.active{color:#fff;background:#00e5ff24;border-color:#00e5ff;box-shadow:0 0 20px #00e5ff59}.scene-tab-btn .tab-badge{text-transform:uppercase;color:#aaa;letter-spacing:.02em;background:#ffffff1f;border-radius:4px;margin-bottom:2px;padding:1px 6px;font-size:10px;font-weight:600}.scene-tab-btn.active .tab-badge{color:#00e5ff;background:#00e5ff47}.scene-tab-btn .tab-title{color:#eee;margin-bottom:1px;font-size:13px;font-weight:600}.scene-tab-btn.active .tab-title{color:#fff;text-shadow:0 0 10px #00e5ff80}.scene-tab-btn .tab-desc{color:#888;font-size:10px}.scene-tab-btn.active .tab-desc{color:#b3f3fc}#switch-scene-btn{-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);color:#eee;cursor:pointer;z-index:50;opacity:0;pointer-events:none;background:#00000080;border:1px solid #ffffff40;border-radius:20px;align-items:center;gap:6px;padding:7px 15px;font-size:13px;font-weight:500;transition:all .25s;display:flex;position:absolute;top:14px;left:14px}body.controls #switch-scene-btn{opacity:1;pointer-events:auto}#switch-scene-btn:hover{color:#fff;background:#00e5ff40;border-color:#00e5ffb3;transform:translateY(-1px);box-shadow:0 0 16px #00e5ff66}#toggle-avatar-btn{-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);color:#eee;cursor:pointer;z-index:50;opacity:0;pointer-events:none;background:#00000080;border:1px solid #ffffff40;border-radius:20px;align-items:center;gap:6px;padding:7px 15px;font-size:13px;font-weight:500;transition:all .25s;display:flex;position:absolute;top:14px;left:130px}body.controls #toggle-avatar-btn{opacity:1;pointer-events:auto}#toggle-avatar-btn.active{color:#0fa;background:#0fa3;border-color:#0fa9;box-shadow:0 0 14px #00ffaa4d}#toggle-avatar-btn:hover{color:#fff;background:#00ffaa4d;border-color:#00ffaad9;transform:translateY(-1px);box-shadow:0 0 18px #00ffaa80}body.in-vr #toggle-avatar-btn{display:none!important}@media (min-width:540px){.scene-switcher{flex-wrap:wrap;justify-content:center;gap:6px;display:flex}.scene-tab-btn{flex:165px;padding:5px 8px}}#avatar-tune-btn{-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);color:#eee;cursor:pointer;z-index:50;opacity:0;pointer-events:none;background:#00000080;border:1px solid #ffffff40;border-radius:20px;align-items:center;gap:6px;padding:7px 14px;font-size:13px;font-weight:500;transition:all .25s;display:flex;position:absolute;top:14px;left:275px}body.controls #avatar-tune-btn,body.has-panel-open #avatar-tune-btn,#avatar-tune-btn.active{opacity:1;pointer-events:auto}#avatar-tune-btn.active,#avatar-tune-btn:hover{color:#00d2ff;background:#00d2ff40;border-color:#00d2ffcc;transform:translateY(-1px);box-shadow:0 0 16px #00d2ff66}body.in-vr #avatar-tune-btn,body.in-vr #avatar-tune-panel{display:none!important}.avatar-tune-panel{-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);z-index:60;color:#eee;background:#0c1118e0;border:1px solid #00d2ff66;border-radius:14px;width:320px;padding:16px;font-size:13px;transition:opacity .25s,transform .25s;position:absolute;top:56px;left:130px;box-shadow:0 12px 36px #0009,0 0 20px #00d2ff26}.avatar-tune-panel.hidden{display:none}.tune-header{border-bottom:1px solid #ffffff1a;justify-content:space-between;align-items:center;margin-bottom:14px;padding-bottom:10px;display:flex}.tune-title{color:#00d2ff;letter-spacing:.3px;font-size:13px;font-weight:600}.tune-close-btn{color:#888;cursor:pointer;background:0 0;border:none;border-radius:4px;padding:2px 6px;font-size:18px;line-height:1;transition:color .2s,background .2s}.tune-close-btn:hover{color:#fff;background:#ffffff1a}.tune-group{margin-bottom:14px}.tune-label-row{justify-content:space-between;align-items:center;margin-bottom:6px;display:flex}.tune-label{color:#aaa;font-size:12px}.tune-val{color:#0fa;background:#00ffaa1f;border-radius:4px;padding:1px 6px;font-family:monospace;font-size:12px;font-weight:600}.tune-control-row{align-items:center;gap:8px;display:flex}.tune-step-btn{color:#ddd;cursor:pointer;white-space:nowrap;background:#ffffff14;border:1px solid #ffffff26;border-radius:6px;padding:4px 8px;font-size:11px;transition:all .2s}.tune-step-btn:hover{color:#fff;background:#00d2ff33;border-color:#00d2ff80}.tune-control-row input[type=range]{appearance:none;background:#ffffff26;border-radius:3px;outline:none;flex:1;height:6px}.tune-control-row input[type=range]::-webkit-slider-thumb{appearance:none;cursor:pointer;background:#00d2ff;border-radius:50%;width:16px;height:16px;transition:transform .15s;box-shadow:0 0 8px #00d2ffcc}.tune-control-row input[type=range]::-webkit-slider-thumb:hover{transform:scale(1.2)}.tune-checkbox-group{margin-top:10px;margin-bottom:16px}.tune-checkbox-label{color:#bbb;cursor:pointer;align-items:center;gap:8px;font-size:12px;display:flex}.tune-actions-row{gap:8px;margin-top:8px;display:flex}.tune-btn{cursor:pointer;border:none;border-radius:8px;flex:1;padding:8px 10px;font-size:12px;font-weight:500;transition:all .2s}.tune-btn-save{color:#fff;background:linear-gradient(135deg,#00b4db,#0083b0);box-shadow:0 4px 12px #00b4db59}.tune-btn-save:hover{transform:translateY(-1px);box-shadow:0 6px 16px #00b4db99}.tune-btn-reset{color:#aaa;background:#ffffff1a;border:1px solid #ffffff26}.tune-btn-reset:hover{color:#fff;background:#ffffff2e}.tune-toast{color:#0fa;text-align:center;background:#00ffaa2e;border:1px solid #0fa6;border-radius:6px;margin-top:10px;padding:6px 10px;font-size:11px;animation:.3s fadeIn}.tune-toast.hidden{display:none}
