:root{color-scheme:light;font-family:Space Grotesk,Helvetica Neue,Arial,sans-serif}*{box-sizing:border-box}body{margin:0;background:#0b0f14;color:#e6f3ff;overflow:hidden}#app{width:100vw;height:100vh;position:relative}#sim-canvas{width:100%;height:100%;display:block;touch-action:none}#controls{position:absolute;top:16px;left:16px;display:flex;gap:12px;align-items:center;padding:10px 14px;background:#0c1018d9;border:1px solid rgba(255,255,255,.1);border-radius:12px;backdrop-filter:blur(8px);z-index:10}#controls label{font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:#e6edf3b3}#controls select,#controls button{appearance:none;border:1px solid rgba(255,255,255,.2);background:#ffffff14;color:inherit;padding:6px 10px;border-radius:8px;font-size:13px;cursor:pointer}#controls button{font-weight:600}#controls select:focus,#controls button:focus{outline:2px solid rgba(86,182,255,.8);outline-offset:2px}.notice-backdrop{position:fixed;inset:0;z-index:10000;background:#06090d9e;display:flex;align-items:center;justify-content:center;backdrop-filter:blur(2px)}.notice-box{width:min(560px,calc(100vw - 48px));max-height:calc(100vh - 96px);overflow-y:auto;background:#171b21;color:#e8eaf0;border:1px solid rgba(255,255,255,.14);border-radius:8px;box-shadow:0 18px 60px #0000008c;padding:20px 22px 18px;font:13px/1.55 Inter,system-ui,sans-serif}.notice-title{font:600 15px system-ui,sans-serif;color:#7ec8ff;margin-bottom:8px}.notice-intro{margin:0 0 12px;opacity:.88}.notice-actions{display:flex;justify-content:flex-end;gap:8px}.notice-btn{padding:7px 16px;border-radius:6px;border:1px solid rgba(255,255,255,.16);background:#ffffff0d;color:#e8eaf0;font:600 12px system-ui,sans-serif;cursor:pointer}.notice-btn:hover{background:#ffffff1a;border-color:#ffffff4d}.notice-btn-primary{background:#00d4ff24;border-color:#00d4ff66;color:#7ec8ff}.notice-btn-primary:hover{background:#00d4ff3d;border-color:#7ec8ff}.feedback-box{width:min(520px,calc(100vw - 48px))}.fb-form{display:flex;flex-direction:column;gap:12px;margin-bottom:12px}.fb-field{display:flex;flex-direction:column;gap:4px}.fb-label{font:600 11px system-ui,sans-serif;letter-spacing:.03em;text-transform:uppercase;opacity:.72}.fb-input{width:100%;box-sizing:border-box;padding:8px 10px;border-radius:6px;border:1px solid rgba(255,255,255,.16);background:#ffffff0d;color:#e8eaf0;font:13px system-ui,sans-serif}.fb-input:focus{outline:none;border-color:#7ec8ff;background:#ffffff14}.fb-input option{background:#171b21;color:#fff}.fb-textarea{resize:vertical;min-height:92px;font-family:system-ui,sans-serif}.fb-input.fb-invalid{border-color:#ff6b6b}.fb-error{min-height:14px;font:11px system-ui,sans-serif;color:#ff8b8b}.fb-status{min-height:18px;margin-bottom:6px;font:12px system-ui,sans-serif}.fb-status.fb-ok{color:#5ad19a}.fb-status.fb-bad{color:#ff8b8b}.fb-privacy{margin:0 0 12px;padding:8px 10px;border-radius:5px;border-left:3px solid #e0a33a;background:#e0a33a1a;font:11.5px/1.5 system-ui,sans-serif}:root{--sh-alpha: .9;--rail-w: 64px;--drawer-w: 300px;--sh-accent: #33c7ff;--sh-accent-rgb: 51, 199, 255;--sh-text: #e6eef8;--sh-muted: rgba(230, 238, 248, .62);--sh-border: rgba(255, 255, 255, .09);--sh-rail-rgb: 8, 12, 18;--sh-drawer-rgb: 12, 17, 25;--sh-header-bg: rgba(255, 255, 255, .03);--sh-surface: rgba(255, 255, 255, .04);--sh-surface-hover: rgba(255, 255, 255, .08);--sh-widget: rgba(255, 255, 255, .08);--sh-widget-hover: rgba(255, 255, 255, .13);--sh-shadow: 0 0 40px rgba(0, 0, 0, .35)}body.sph-light{--sh-accent: #0057e6;--sh-accent-rgb: 0, 87, 230;--sh-text: #16233a;--sh-muted: rgba(22, 35, 58, .62);--sh-border: rgba(0, 20, 60, .1);--sh-rail-rgb: 255, 255, 255;--sh-drawer-rgb: 247, 250, 255;--sh-header-bg: rgba(0, 87, 230, .04);--sh-surface: rgba(0, 30, 90, .035);--sh-surface-hover: rgba(0, 87, 230, .08);--sh-widget: rgba(0, 30, 90, .07);--sh-widget-hover: rgba(0, 30, 90, .12);--sh-shadow: 0 0 30px rgba(0, 40, 120, .12)}body.sph-ocean{--sh-accent: #ffb547;--sh-accent-rgb: 255, 181, 71;--sh-text: #e3f4f4;--sh-muted: rgba(210, 238, 238, .64);--sh-border: rgba(120, 220, 220, .14);--sh-rail-rgb: 3, 26, 33;--sh-drawer-rgb: 5, 36, 45;--sh-header-bg: rgba(120, 220, 220, .05);--sh-surface: rgba(120, 220, 220, .06);--sh-surface-hover: rgba(120, 220, 220, .12);--sh-widget: rgba(120, 220, 220, .1);--sh-widget-hover: rgba(120, 220, 220, .17);--sh-shadow: 0 0 40px rgba(0, 20, 30, .4)}body.sph-ocean #sph-drawer .lil-gui{--string-color: #7fe0c4}#sph-rail{position:fixed;left:0;top:0;z-index:1100;width:var(--rail-w);height:100vh;height:100dvh;display:flex;flex-direction:column;align-items:center;gap:6px;padding:12px 0 0;background:rgba(var(--sh-rail-rgb),var(--sh-alpha));border-right:1px solid var(--sh-border);backdrop-filter:blur(calc(20px * var(--sh-alpha))) saturate(160%);-webkit-backdrop-filter:blur(calc(20px * var(--sh-alpha))) saturate(160%);font-family:Inter,system-ui,-apple-system,Segoe UI,sans-serif;overflow-y:auto;overflow-x:hidden;scrollbar-width:none}#sph-rail::-webkit-scrollbar{display:none}.sph-tab{flex:0 0 auto;width:50px;height:50px;padding:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;background:transparent;border:1px solid transparent;border-radius:12px;color:var(--sh-muted);cursor:pointer;position:relative;transition:background .18s,color .18s,border-color .18s}.sph-tab .material-icons{font-size:22px}.sph-tab-label{font-size:8.5px;font-weight:700;letter-spacing:.04em;text-transform:uppercase}.sph-tab:hover{background:var(--sh-surface-hover);color:var(--sh-text)}.sph-tab.active{color:var(--sh-accent);background:rgba(var(--sh-accent-rgb),.12);border-color:rgba(var(--sh-accent-rgb),.35)}.sph-tab.active:before{content:"";position:absolute;left:-8px;top:12px;bottom:12px;width:3px;border-radius:0 3px 3px 0;background:var(--sh-accent)}.sph-tab:focus-visible,.sph-rail-icon:focus-visible,.sph-drawer-collapse:focus-visible,.sph-demo-card:focus-visible,.sph-secondary-btn:focus-visible{outline:2px solid var(--sh-accent);outline-offset:2px}.sph-rail-bottom{margin-top:auto;padding:12px 0 16px;display:flex;flex-direction:column;align-items:center;gap:10px}.sph-rail-icon{width:38px;height:38px;padding:0;border-radius:10px;display:flex;align-items:center;justify-content:center;background:transparent;border:none;color:var(--sh-muted);cursor:pointer;transition:background .18s,color .18s}.sph-rail-icon:hover{background:var(--sh-surface-hover);color:var(--sh-text)}.sph-rail-icon .material-icons{font-size:21px}.sph-rail-stacked{height:44px;width:50px;flex-direction:column;gap:1px}.sph-rail-stacked .material-icons{font-size:19px}.sph-rail-val{font-size:8.5px;font-weight:700;letter-spacing:.03em;text-transform:uppercase}.sph-rail-logo{display:block;width:34px;height:34px}.sph-rail-logo img{width:100%;height:100%;object-fit:contain;border-radius:7px;display:block}.build-tag{font:9px/1 ui-monospace,SFMono-Regular,Menlo,monospace;color:var(--sh-text);opacity:.35;letter-spacing:.02em;cursor:help;max-width:56px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.build-tag:hover{opacity:.85}#sph-drawer{position:fixed;top:0;left:var(--rail-w);z-index:1000;width:var(--drawer-w);max-width:calc(100vw - var(--rail-w));height:100vh;height:100dvh;display:flex;flex-direction:column;background:rgba(var(--sh-drawer-rgb),var(--sh-alpha));color:var(--sh-text);border-right:1px solid var(--sh-border);box-shadow:var(--sh-shadow);backdrop-filter:blur(calc(24px * var(--sh-alpha))) saturate(160%);-webkit-backdrop-filter:blur(calc(24px * var(--sh-alpha))) saturate(160%);transition:transform .32s cubic-bezier(.4,0,.2,1),visibility .32s,background .25s;font-family:Inter,system-ui,-apple-system,Segoe UI,sans-serif}#sph-drawer.closed{transform:translate(calc(-100% - var(--rail-w)));visibility:hidden}.sph-drawer-header{flex:0 0 auto;display:flex;align-items:center;gap:8px;min-height:60px;padding:10px 10px 10px 18px;background:var(--sh-header-bg);border-bottom:1px solid var(--sh-border)}.sph-drawer-heading{flex:1 1 auto;min-width:0}.sph-drawer-title{font-size:12.5px;font-weight:800;letter-spacing:.09em;text-transform:uppercase;color:var(--sh-accent)}.sph-drawer-subtitle{margin-top:3px;font-size:11px;color:var(--sh-muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.sph-drawer-collapse{flex:0 0 auto;width:32px;height:32px;padding:0;border-radius:8px;display:flex;align-items:center;justify-content:center;background:transparent;border:none;color:var(--sh-muted);cursor:pointer}.sph-drawer-collapse:hover{background:var(--sh-surface-hover);color:var(--sh-accent)}.sph-run-strip{flex:0 0 auto;padding:6px 8px;border-bottom:1px solid var(--sh-border)}.sph-drawer-body{flex:1 1 auto;min-height:0;overflow-y:auto;-webkit-overflow-scrolling:touch;padding:8px 8px calc(env(safe-area-inset-bottom,0px) + 28px);scrollbar-width:thin;scrollbar-color:rgba(var(--sh-accent-rgb),.3) transparent}.sph-drawer-body::-webkit-scrollbar{width:6px}.sph-drawer-body::-webkit-scrollbar-thumb{background:rgba(var(--sh-accent-rgb),.3);border-radius:3px}.sph-panel{display:none}.sph-panel.active{display:block}#sph-drawer .lil-gui{--background-color: transparent;--text-color: var(--sh-text);--title-background-color: transparent;--title-text-color: var(--sh-text);--widget-color: var(--sh-widget);--hover-color: var(--sh-widget-hover);--focus-color: rgba(var(--sh-accent-rgb), .22);--number-color: var(--sh-accent);--string-color: #4fd39a;--font-size: 11.5px;--input-font-size: 11.5px;--font-family: Inter, system-ui, -apple-system, "Segoe UI", sans-serif;--padding: 5px;--spacing: 5px;--widget-height: 22px;--title-height: 32px;--name-width: 44%;--slider-knob-width: 3px;--folder-indent: 8px;--widget-border-radius: 4px}body.sph-light #sph-drawer .lil-gui{--string-color: #0a7a45}#sph-drawer .lil-gui.lil-root{width:100%!important;background:transparent;border:none;box-shadow:none}#sph-drawer .lil-root>.lil-title{display:none}#sph-drawer .lil-root>.lil-children{padding:0}.sph-panel>.lil-gui{margin:0 0 8px;border-radius:8px;background:var(--sh-surface);border:1px solid var(--sh-border);overflow:hidden}.sph-panel>.lil-gui>.lil-title{padding:0 12px;font-size:11px;font-weight:750;letter-spacing:.07em;text-transform:uppercase;border-left:3px solid var(--sh-accent);background:transparent;transition:background .18s,color .18s}.sph-panel>.lil-gui>.lil-title:hover{background:rgba(var(--sh-accent-rgb),.08);color:var(--sh-accent)}.sph-panel>.lil-gui:not(.lil-closed)>.lil-title{color:var(--sh-accent);border-bottom:1px solid var(--sh-border)}.sph-panel>.lil-gui>.lil-children{padding:4px 4px 6px}#sph-drawer .lil-children .lil-gui>.lil-title{margin:4px 0 2px;border-radius:5px;font-weight:650;letter-spacing:.01em;background:var(--sh-surface);border-left:2px solid rgba(var(--sh-accent-rgb),.55)}#sph-drawer .lil-children .lil-gui>.lil-title:hover{background:var(--sh-surface-hover)}#sph-drawer .lil-children .lil-gui>.lil-children{border-left:1px solid var(--sh-border);margin-left:6px}#sph-drawer .lil-controller{border-radius:5px;transition:background .15s}#sph-drawer .lil-controller:hover{background:rgba(var(--sh-accent-rgb),.06)}#sph-drawer .lil-controller.lil-function button{border:1px solid rgba(var(--sh-accent-rgb),.28);border-radius:5px}#sph-drawer .lil-controller.lil-function button:hover{border-color:var(--sh-accent)}#sph-drawer .lil-controller.lil-function .lil-name{font-weight:600}body.sph-light #sph-drawer .lil-controller.lil-option .lil-display{border:1px solid var(--sh-border)}body.sph-light #sph-drawer .lil-controller.lil-option select,body.sph-light #sph-drawer .lil-controller.lil-option select option{background:#fff;color:#111}.sph-run-strip .lil-root>.lil-children{display:grid;grid-template-columns:1fr 1fr;gap:4px}.sph-run-strip .lil-root>.lil-children>.lil-controller:not(.lil-function){grid-column:1 / -1}.sph-note{margin:4px 4px 14px;font-size:12px;line-height:1.5;color:var(--sh-muted)}.sph-section-label{margin:16px 4px 8px;font-size:10px;font-weight:750;letter-spacing:.08em;text-transform:uppercase;color:var(--sh-muted)}.sph-demo-list{display:flex;flex-direction:column;gap:4px}.sph-demo-card{display:flex;align-items:center;gap:10px;width:100%;padding:9px 10px;border-radius:8px;text-align:left;background:var(--sh-surface);border:1px solid var(--sh-border);color:var(--sh-text);font:500 12px/1.3 Inter,system-ui,sans-serif;cursor:pointer;transition:background .15s,border-color .15s,transform .1s}.sph-demo-card>.material-icons:first-child{font-size:18px;color:var(--sh-accent);opacity:.85}.sph-demo-name{flex:1 1 auto;min-width:0}.sph-demo-go{font-size:18px;opacity:0;transition:opacity .15s;color:var(--sh-accent)}.sph-demo-card:hover{background:var(--sh-surface-hover);border-color:rgba(var(--sh-accent-rgb),.4)}.sph-demo-card:hover .sph-demo-go{opacity:1}.sph-demo-card:active{transform:scale(.99)}.sph-demo-card.active{border-color:var(--sh-accent);background:rgba(var(--sh-accent-rgb),.12)}.sph-demo-card.active .sph-demo-go{opacity:1}.sph-doc-link{display:flex;align-items:center;gap:10px;margin:4px 0 18px;padding:11px 12px;border-radius:8px;text-decoration:none;background:rgba(var(--sh-accent-rgb),.12);border:1px solid rgba(var(--sh-accent-rgb),.35);color:var(--sh-text);font:700 11.5px Inter,system-ui,sans-serif;letter-spacing:.04em;text-transform:uppercase;transition:background .18s,border-color .18s}.sph-doc-link>.material-icons:first-child{color:var(--sh-accent);font-size:18px}.sph-doc-link>span:nth-child(2){flex:1 1 auto}.sph-doc-open{font-size:15px;opacity:.6}.sph-doc-link:hover{background:rgba(var(--sh-accent-rgb),.22);border-color:var(--sh-accent)}.sph-guide-h{margin:0 4px 6px;font-size:14px;color:var(--sh-accent)}.sph-keys{display:grid;grid-template-columns:max-content 1fr;gap:6px 12px;margin:0 4px;font-size:11.5px;line-height:1.4}.sph-keys dt{font-weight:650;color:var(--sh-text)}.sph-keys dd{margin:0;color:var(--sh-muted)}.sph-secondary-btn{display:flex;align-items:center;justify-content:center;gap:8px;width:100%;margin-top:20px;padding:9px 12px;border-radius:8px;background:var(--sh-surface);border:1px solid var(--sh-border);color:var(--sh-text);font:600 12px Inter,system-ui,sans-serif;cursor:pointer}.sph-secondary-btn .material-icons{font-size:17px}.sph-secondary-btn:hover{background:var(--sh-surface-hover);border-color:rgba(var(--sh-accent-rgb),.4)}.sph-panel[data-tab=bench]{font-size:11.5px;color:var(--sh-text)}.bench-row{display:flex;align-items:center;justify-content:space-between;gap:8px;margin:0 4px 6px}.bench-row select{padding:5px 8px;border-radius:6px;cursor:pointer;outline:none;background:var(--sh-widget);color:var(--sh-text);border:1px solid rgba(var(--sh-accent-rgb),.35);font:500 11.5px Inter,system-ui,sans-serif}#bench-scene{max-width:64%;text-overflow:ellipsis}.bench-scene-note{margin:0 4px 4px}body.sph-light .bench-row select,body.sph-light .bench-row select option{background:#fff;color:#111}.bench-row select option{background:rgb(var(--sh-drawer-rgb));color:var(--sh-text)}#bench-tests{display:flex;flex-direction:column;margin:0 4px}.bench-test{display:flex;align-items:center;gap:8px;padding:3px 0;cursor:pointer}.bench-test input{accent-color:var(--sh-accent);margin:0}.bench-test small{margin-left:auto;color:var(--sh-muted);font-variant-numeric:tabular-nums}.bench-dim{color:var(--sh-muted)}.bench-note{margin:6px 4px 0;font-size:10.5px;line-height:1.5;color:var(--sh-muted)}.bench-actions{display:flex;gap:6px;margin:10px 0 0}.bench-btn{flex:1;display:flex;align-items:center;justify-content:center;gap:5px;padding:7px 8px;border-radius:7px;cursor:pointer;background:var(--sh-surface);color:var(--sh-text);border:1px solid var(--sh-border);font:700 11px Inter,system-ui,sans-serif}.bench-btn .material-icons{font-size:15px}.bench-btn:hover:not(:disabled){background:var(--sh-surface-hover);border-color:rgba(var(--sh-accent-rgb),.4)}.bench-btn.bench-primary{background:rgba(var(--sh-accent-rgb),.12);color:var(--sh-accent);border-color:rgba(var(--sh-accent-rgb),.55)}.bench-btn.bench-primary:hover:not(:disabled){background:rgba(var(--sh-accent-rgb),.22);border-color:var(--sh-accent)}.bench-btn:disabled{opacity:.35;cursor:default}.bench-btn:focus-visible{outline:2px solid var(--sh-accent);outline-offset:2px}#bench-progress-wrap{height:4px;margin:8px 0 0;border-radius:2px;background:var(--sh-border);overflow:hidden}#bench-progress{height:100%;width:0;background:var(--sh-accent);transition:width .2s linear}#bench-summary .bench-score{margin:0 4px;font:900 26px/1.1 Inter,system-ui,sans-serif;color:var(--sh-accent);font-variant-numeric:tabular-nums}.bench-table-wrap{margin-top:10px;overflow-x:auto}#bench-table{width:100%;border-collapse:collapse;font-size:10.5px;font-variant-numeric:tabular-nums}#bench-table th{text-align:right;font-weight:600;color:var(--sh-muted);padding:3px 4px;border-bottom:1px solid var(--sh-border)}#bench-table td{text-align:right;padding:4px;border-bottom:1px solid var(--sh-border)}#bench-table th:first-child,#bench-table td:first-child{text-align:left;white-space:nowrap}#bench-table tr.running td{color:var(--sh-accent)}#bench-table tr.pending{opacity:.45}#bench-table td.bench-err{text-align:center;color:var(--sh-muted)}#history-controls{position:fixed;top:12px;right:12px;z-index:1000;display:flex;gap:8px}.hist-btn{width:38px;height:38px;padding:0;display:flex;align-items:center;justify-content:center;border-radius:10px;cursor:pointer;background:rgba(var(--sh-drawer-rgb),.72);border:1px solid var(--sh-border);color:var(--sh-text);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);transition:background .18s,border-color .18s,opacity .18s,transform .1s}.hist-btn .material-icons{font-size:21px}.hist-btn:hover:not(:disabled){background:rgba(var(--sh-accent-rgb),.22);border-color:var(--sh-accent)}.hist-btn:active:not(:disabled){transform:scale(.92)}.hist-btn:focus-visible{outline:2px solid var(--sh-accent);outline-offset:2px}.hist-btn:disabled{opacity:.3;cursor:default}#sph-stats{top:8px!important;left:calc(var(--rail-w) + var(--drawer-w) + 8px)!important}body.sph-drawer-closed #sph-stats{left:calc(var(--rail-w) + 8px)!important}@media(max-width:600px){:root{--rail-w: 56px;--drawer-w: calc(100vw - 56px) }.sph-tab{width:46px;height:46px}.sph-tab-label{font-size:7.5px}}@media(prefers-reduced-motion:reduce){#sph-drawer{transition:none}}