:root{color-scheme:dark;--bg:#091521;--ink:#f2f7ff;--muted:#a3b6c7;--accent:#76e3d9;--accent2:#ffc58a;--edge:#2b4354;--panel:#0d1d2b;font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif}*{box-sizing:border-box}html,body{margin:0;width:100%;min-height:100%;background:var(--bg);color:var(--ink)}button,input,select{font:inherit}button{cursor:pointer}button:focus-visible,input:focus-visible,select:focus-visible,canvas:focus-visible{outline:2px solid #84fff2;outline-offset:3px}#app{height:100vh;height:100dvh;display:flex;flex-direction:column;overflow:hidden}.topbar{height:60px;flex:0 0 60px;padding:0 26px;border-bottom:1px solid #294052;background:#091622;display:flex;align-items:center;justify-content:space-between;position:relative;z-index:4}.brand{display:flex;align-items:center;gap:10px;letter-spacing:2px}.brand-mark{color:var(--accent);font-size:32px;line-height:1}.brand strong{display:block;font-size:12px;letter-spacing:2.6px}.brand small{display:block;font-size:8px;letter-spacing:1.6px;margin-top:5px;color:#88a8bb}.top-right{display:flex;align-items:center;gap:35px;font-size:9px;font-weight:700;letter-spacing:1.5px;color:#b5c9d7}.system-indicator span{display:inline-block;background:#63e3b4;width:6px;height:6px;border-radius:50%;margin-right:9px;box-shadow:0 0 8px #63e3b4}.edition{color:#88a0b2}.workspace{flex:1;min-height:0;display:flex}.stage{position:relative;flex:1;min-width:0;min-height:0;overflow:hidden;background:radial-gradient(ellipse at 52% 44%,#1a3343 0%,#101f2f 46%,#07121e 100%)}#scene,#fallback{position:absolute;inset:0;width:100%;height:100%;display:block;touch-action:none}#fallback{display:none}.stage-gradient{position:absolute;inset:0;background:linear-gradient(180deg,rgba(5,15,25,.35) 0%,transparent 25%,transparent 72%,rgba(4,13,23,.55) 100%);pointer-events:none}.stage-head{position:absolute;left:31px;top:27px;max-width:500px;pointer-events:none;text-shadow:0 2px 16px #06131dcc}.eyebrow{font-size:9px;font-weight:800;letter-spacing:2px;color:#83e4d7}.eyebrow i{display:inline-block;width:7px;height:7px;background:#76e3d9;transform:rotate(45deg);margin-right:11px}.stage-head h1{margin:13px 0 8px;font-size:clamp(23px,2.9vw,42px);line-height:1.14;letter-spacing:-1.5px;font-weight:800}.stage-head h1 em{color:#a5cbd4;font-style:normal;font-weight:500}.stage-head p{font-size:12px;line-height:1.55;max-width:365px;color:#d0dfeb;margin:0}.stage-toptools{position:absolute;right:22px;top:22px;display:flex;gap:8px}.stage-toptools button{color:#eaf9ff;background:#13293abb;border:1px solid #537283;border-radius:5px;font-size:11px;padding:9px 12px;backdrop-filter:blur(6px)}.stage-toptools button:hover{border-color:var(--accent)}.stage-bottom{position:absolute;bottom:18px;left:30px;right:30px;display:flex;align-items:center;justify-content:space-between;gap:10px}.viewbadge{background:#10293ad8;border:1px solid #3f6375;border-radius:3px;font-size:9px;font-weight:700;letter-spacing:1.4px;padding:10px 12px}.viewbadge>span:first-child{color:#79ebbe}.slash{color:#67899e;margin:0 8px}.viewbadge b{color:#75d9d1}.hint{font-size:9px;letter-spacing:1px;color:#91b3c7}.hint span{margin:0 5px;color:#68b9b3}.compass{position:absolute;right:26px;bottom:76px;display:flex;flex-direction:column;align-items:center;gap:2px;color:#7cb8ca;font-size:9px}.compass-cross{font-size:24px;color:#cdebf1}.callout{position:absolute;left:0;top:0;display:none;pointer-events:none;font-size:9px;font-weight:700;letter-spacing:1px;color:#e7fafe;padding:7px 9px;background:#0e2638da;border:1px solid #5297a3;border-radius:3px;box-shadow:0 2px 10px #0007;white-space:nowrap}.callout:before{content:'';position:absolute;left:-6px;top:50%;height:1px;width:6px;background:#62bbb6}.controls{width:344px;flex:0 0 344px;background:linear-gradient(180deg,#112331,#0b1a27);border-left:1px solid #2a4959;min-height:0;position:relative;z-index:2}.control-scroll{height:100%;overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:#3d5c6c #0b1a27;padding:22px 23px 24px}.control-head{display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #284151;padding:0 0 18px}.control-head small,.control-label{font-size:9px;font-weight:800;letter-spacing:1.4px;color:#79ddd7}.control-head h2{font-size:17px;letter-spacing:-.4px;margin:5px 0 0}.panel-counter{font-size:10px;color:#80a8bd}.control-group{padding:19px 0 20px;border-bottom:1px solid #294151}.control-label{display:flex;justify-content:space-between;align-items:center;margin-bottom:16px}.tiny{color:#7898ac;font-size:9px}.mode-grid{display:grid;grid-template-columns:1fr 1fr;gap:7px;margin-bottom:17px}.mode-grid button,.presets button,.sequence-actions button{border:1px solid #345567;color:#b5cbd6;background:#132838;border-radius:4px;padding:9px 7px;font-size:11px;font-weight:700}.mode-grid button.active,.presets button.active{border-color:#65c7c5;background:#154c56;color:#c3fffa}.mode-grid button.wide{grid-column:span 2;display:flex;justify-content:center;gap:15px}.mode-grid button:hover,.presets button:hover,.sequence-actions button:hover{border-color:#82dbd6;color:white}.slider-caption{display:flex;align-items:center;justify-content:space-between;margin:18px 0 10px}.slider-caption label,.field-label{font-size:10px;font-weight:700;letter-spacing:.8px;color:#b7cddc}.slider-caption output{font-size:11px;font-variant-numeric:tabular-nums;color:#9cf0df;font-weight:800}input[type=range]{width:100%;margin:0;height:5px;accent-color:#7ce9dd;cursor:pointer}select{width:100%;background:#0b1b29;color:#f0f8fc;border:1px solid #456172;border-radius:4px;padding:10px 9px;font-size:11px;outline:none;margin:7px 0 12px}.component-card{background:#0a1926;border:1px solid #244656;padding:12px;border-left:3px solid #72d6d3}.component-top{display:flex;justify-content:space-between;font-size:9px;letter-spacing:1.1px;color:#79dacf;margin-bottom:9px}.dot-row{color:#597b91}.component-card strong{font-size:12px}.component-card p{font-size:11px;color:#a7c1d1;line-height:1.48;margin:8px 0 0}.toggle-row{display:flex;justify-content:space-between;gap:8px;margin:14px 0 16px}.toggle-row label{font-size:10px;color:#c3d5e0;display:flex;gap:6px;align-items:center;cursor:pointer}input[type=checkbox]{accent-color:#76e1d7}.rangetips{display:flex;justify-content:space-between;color:#7899ad;font-size:9px;margin-top:4px}.readout-grid{display:grid;grid-template-columns:1fr 1fr;gap:7px;margin-top:18px}.readout{background:#081b2a;padding:12px 9px;min-width:0;border:1px solid #2a5060}.readout.full{grid-column:span 2}.readout small{display:block;font-size:8px;letter-spacing:.8px;color:#91bacb;line-height:1.35}.readout strong{display:block;margin:9px 0 3px;font-size:20px;letter-spacing:-.5px;color:#c5f9e8;font-variant-numeric:tabular-nums}.readout span{font-size:10px;color:#829bad}.check{display:flex;gap:10px;margin-top:9px;padding:9px;background:#102e32;color:#bceee3;border:1px solid #2d605f}.check-icon{font-weight:900}.check strong{display:block;font-size:9px;letter-spacing:.9px}.check span:last-child{display:block;font-size:10px;line-height:1.5;margin-top:5px}.sequence{display:flex;align-items:center;gap:8px}.sequence button{background:#1b3b4a;border:1px solid #3d6476;color:#e7ffff;width:33px;height:36px;border-radius:3px}.sequence>div{flex:1;min-width:0;text-align:center}.sequence strong{display:block;font-size:11px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.sequence span{display:block;font-size:9px;line-height:1.5;color:#9ab6c5}.sequence-actions{display:flex;gap:8px;margin-top:12px}.sequence-actions button{flex:1;font-size:10px}.progress{background:#244052;height:3px;margin:12px 0}.progress span{display:block;width:100%;height:100%;background:#77dcd5;transition:width .2s}.micro{font-size:10px;line-height:1.55;color:#a5bdcd;margin:9px 0 0}.presets{display:grid;grid-template-columns:1fr 1fr;gap:7px}.science-button{width:100%;text-align:left;display:flex;justify-content:space-between;align-items:center;background:none;color:#bff5e8;border:1px solid #3c7580;border-radius:4px;font-size:12px;font-weight:700;margin:18px 0 0;padding:12px}.science-button:hover{background:#143140}#scienceContent{font-size:11px;color:#c2d5df;line-height:1.65;padding:6px 2px}#scienceContent p{margin:12px 0}.control-footer{font-size:9px;letter-spacing:1.1px;color:#6f92a5;padding:20px 0 0}.control-footer span{color:#7dd7c8}.underbar{height:28px;flex:0 0 28px;border-top:1px solid #274050;padding:0 22px;background:#081420;display:flex;justify-content:space-between;align-items:center;color:#7795a6;font-size:9px;letter-spacing:1.1px}.underbar kbd{background:#1c3e4f;padding:1px 4px;border:1px solid #3a6679;border-radius:2px}dialog{border:1px solid #5ab8c4;background:#102938;color:#efffff;border-radius:10px;max-width:430px;width:90%;padding:20px;box-shadow:0 15px 100px #000a}dialog::backdrop{background:#0009}dialog p{line-height:1.7}dialog button{padding:8px 22px;background:#23766f;border:0;border-radius:3px;color:white}body.embed-mode{height:100vh;height:100dvh;overflow:hidden}body.embed-mode .topbar,body.embed-mode .underbar{display:none}body.embed-mode #app{height:100vh;height:100dvh}
@media(max-width:850px){.topbar{padding:0 14px}.system-indicator{display:none}.controls{width:310px;flex-basis:310px}.control-scroll{padding:15px}.stage-head{left:17px;top:20px}.stage-head h1{font-size:25px}.stage-head p{max-width:280px;font-size:11px}.stage-toptools{right:10px;top:13px}.stage-toptools button{padding:7px;font-size:10px}.stage-bottom{left:17px;right:17px}.hint{display:none}}
@media(max-width:700px){.workspace{flex-direction:column}.topbar{height:48px;flex-basis:48px}.brand strong{font-size:10px}.brand small{font-size:7px}.edition{font-size:8px}.stage{flex:1;min-height:38vh}.controls{width:100%;flex:0 0 39vh;border-left:0;border-top:1px solid #406173}.control-scroll{padding:12px 16px 26px}.control-head{padding-bottom:10px}.control-head h2{font-size:15px}.control-group{padding:14px 0}.stage-head{left:13px;top:12px}.stage-head h1{font-size:clamp(19px,5vw,25px);letter-spacing:-.7px;margin:8px 0 4px}.stage-head p{font-size:10px;max-width:220px;line-height:1.35}.eyebrow{font-size:8px;letter-spacing:1px}.stage-toptools{right:9px;top:10px;flex-direction:column}.stage-toptools button{padding:5px 9px;font-size:10px}.stage-bottom{bottom:9px;left:12px;right:12px}.viewbadge{font-size:8px;padding:7px}.compass{bottom:45px;right:14px}.underbar{height:23px;flex-basis:23px;font-size:8px}.underbar span:last-child{display:none}.callout{font-size:7px;padding:4px 6px}}
@media(max-width:400px){.stage-head p{max-width:205px}.brand small{letter-spacing:1px}.control-group{padding:12px 0}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}