:root{--void: #0a0908;--panel: #12110f;--panel-2: #181614;--line: #2d2924;--line-2: #3a342c;--copper: #c47a4a;--copper-2: #e0a070;--ember: #ff6a1a;--acid: #d6ff3f;--paper: #efe8d8;--mute: #8a8276;--danger: #ff4d3a;--serif: "Instrument Serif", "Times New Roman", serif;--sans: "Outfit", "PingFang SC", "Noto Sans SC", sans-serif;--mono: "IBM Plex Mono", ui-monospace, monospace;color-scheme:dark}*{box-sizing:border-box}html,body{margin:0;height:100%;overflow:hidden;background:var(--void);color:var(--paper);font-family:var(--sans);font-size:14px;letter-spacing:.01em}button,input,select{font:inherit;color:inherit}#grain{pointer-events:none;position:fixed;top:0;right:0;bottom:0;left:0;z-index:40;opacity:.045;mix-blend-mode:overlay;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='180' height='180' filter='url(%23n)' opacity='.9'/%3E%3C/svg%3E")}#app{height:100%;display:grid;grid-template-rows:auto 1fr auto;min-height:0}.topbar{display:flex;align-items:center;justify-content:space-between;padding:12px 20px 10px;border-bottom:1px solid var(--line);background:linear-gradient(180deg,#141210,#0d0c0b)}.brand{display:flex;gap:12px;align-items:center}.mark{width:36px;height:36px;display:grid;place-items:center;border:1px solid var(--copper);color:var(--acid);font-family:var(--mono);font-size:12px;letter-spacing:.08em}.brand h1{margin:0;font-family:var(--serif);font-size:22px;font-weight:400;line-height:1}.brand h1 span{font-style:italic;color:var(--copper-2)}.brand p{margin:3px 0 0;color:var(--mute);font-size:11px;letter-spacing:.18em;text-transform:uppercase}.top-status{display:flex;align-items:center;gap:14px}.out-links{display:flex;align-items:center;gap:12px}.out-links a{text-decoration:none}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.lang select{background:transparent;border:1px solid var(--line-2);padding:4px 6px;font-size:11px;letter-spacing:.04em;cursor:pointer}.lang select:hover,.lang select:focus-visible{border-color:var(--copper-2);outline:none}html[lang=zh] .brand p,html[lang=ja] .brand p{text-transform:none;letter-spacing:.1em}.meta{font-family:var(--mono);font-size:12px;color:var(--copper-2)}.text-btn{background:none;border:0;color:var(--mute);cursor:pointer;padding:0;letter-spacing:.12em;text-transform:uppercase;font-size:11px}.text-btn:hover{color:var(--paper)}main{display:grid;grid-template-columns:1fr 360px;min-height:0;overflow:hidden}#stage-wrap{position:relative;min-width:0;min-height:0;overflow:hidden;background:radial-gradient(1200px 600px at 50% 40%,#161310 0%,var(--void) 62%)}#stage{display:block;width:100%;height:100%;touch-action:none}.axis-overlay{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none}.axis-tag{font-family:var(--mono);font-size:12px;letter-spacing:.16em;padding:2px 7px;border:1px solid currentColor;background:#0a0908e0}.axis-tag.is-x{color:var(--copper-2)}.axis-tag.is-y{color:var(--acid)}.axis-tag.is-t{color:var(--ember)}.fiducials i{position:absolute;width:18px;height:18px;border-color:var(--copper);border-style:solid;opacity:.45;pointer-events:none}.fiducials i:nth-child(1){top:14px;left:14px;border-width:1px 0 0 1px}.fiducials i:nth-child(2){top:14px;right:14px;border-width:1px 1px 0 0}.fiducials i:nth-child(3){bottom:14px;left:14px;border-width:0 0 1px 1px}.fiducials i:nth-child(4){bottom:14px;right:14px;border-width:0 1px 1px 0}#drop-hint{position:absolute;top:0;right:0;bottom:0;left:0;display:grid;place-content:center;justify-items:center;text-align:center;gap:10px;padding:32px;pointer-events:none;transition:opacity .35s ease}#drop-hint.is-hidden{opacity:0;visibility:hidden;pointer-events:none}.hint-cube{width:54px;height:54px;border:1px solid var(--copper);transform:rotateX(58deg) rotate(45deg);box-shadow:8px 8px #d6ff3f40;margin-bottom:8px}#drop-hint h2{margin:0;font-family:var(--serif);font-size:clamp(28px,4vw,42px);font-weight:400}#drop-hint p{margin:0;max-width:28em;color:var(--mute);line-height:1.55}#drop-hint em{color:var(--paper);font-style:normal;font-family:var(--mono);font-size:12px}.hint-actions{pointer-events:auto;display:flex;gap:12px;align-items:center;margin-top:8px;color:var(--mute);font-size:12px}.deck{border-left:1px solid var(--line);background:var(--panel);overflow:auto;padding:14px 16px 28px;display:flex;flex-direction:column;gap:16px;min-height:0}.deck h3{margin:0 0 8px;font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--mute);font-weight:500}.monitor-well{display:flex;flex-direction:column;gap:8px}.well-head{display:flex;justify-content:space-between;align-items:baseline;font-size:12px;color:var(--mute)}.mono{font-family:var(--mono);font-size:11px}.gate{position:relative;background:#070706;border:1px solid var(--line);aspect-ratio:16 / 10;overflow:hidden}.gate:before,.gate:after{content:"";position:absolute;width:10px;height:10px;border:1px solid var(--acid);opacity:.45;z-index:1;pointer-events:none}.gate:before{top:6px;left:6px;border-width:1px 0 0 1px}.gate:after{right:6px;bottom:6px;border-width:0 1px 1px 0}.monitor-main{width:100%;height:100%;display:block}.minis{display:grid;grid-template-columns:1fr 1fr 1fr;gap:6px}.mini{background:#070706;border:1px solid var(--line);padding:0;cursor:pointer;display:grid;text-align:left}.mini canvas{width:100%;height:56px;display:block}.mini span{display:block;padding:5px 6px 6px;font-family:var(--mono);font-size:10px;color:var(--mute);letter-spacing:.04em;white-space:nowrap}.mini.is-on{border-color:var(--acid)}.mini.is-on span{color:var(--acid)}.transport{display:grid;grid-template-columns:auto 1fr auto;gap:8px;align-items:center}.btn{background:var(--panel-2);border:1px solid var(--line-2);color:var(--paper);padding:8px 12px;cursor:pointer;letter-spacing:.04em}.btn:hover{border-color:var(--copper-2)}.btn.primary{background:var(--acid);color:#14120a;border-color:var(--acid);font-weight:600}.btn.primary:hover{filter:brightness(1.05)}.btn.play{min-width:64px}.btn:disabled{opacity:.4;cursor:not-allowed}.seg{display:grid;grid-template-columns:1fr 1fr 1fr;border:1px solid var(--line-2)}.seg-btn{background:transparent;border:0;border-right:1px solid var(--line-2);padding:8px 4px;cursor:pointer;font-size:11px;color:var(--mute)}.seg-btn:last-child{border-right:0}.seg-btn.is-on{background:#1c1914;color:var(--acid)}.note{margin:8px 0 0;color:var(--mute);font-size:12px;line-height:1.45}.toggles{display:flex;flex-wrap:wrap;gap:8px 14px}.toggles.compact{margin-top:8px}.chk{display:flex;gap:6px;align-items:center;cursor:pointer;font-size:13px}.chk input{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:12px;height:12px;border:1px solid var(--copper);background:transparent;margin:0}.chk input:checked{background:var(--acid);border-color:var(--acid);box-shadow:inset 0 0 0 2px #12110f}.chk.is-on span{color:var(--acid)}.sliders{display:grid;gap:8px}.sliders label,.density{display:grid;grid-template-columns:14px 1fr;gap:8px;align-items:center;color:var(--mute);font-family:var(--mono);font-size:11px}.density{grid-template-columns:1fr;margin-top:8px}input[type=range]{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:100%;height:18px;background:transparent}input[type=range]::-webkit-slider-runnable-track{height:1px;background:var(--line-2)}input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:10px;height:10px;margin-top:-4.5px;background:var(--paper);border:1px solid var(--void);cursor:pointer}input[type=range]:focus-visible{outline:1px solid var(--acid)}.row-btns{display:flex;justify-content:space-between;align-items:center;gap:8px}.speed{display:flex;gap:8px;align-items:center;color:var(--mute);font-size:12px}select{background:var(--panel-2);border:1px solid var(--line-2);padding:6px 8px}.dock{display:flex;flex-wrap:wrap;gap:12px 18px;align-items:center;justify-content:space-between;padding:10px 16px 12px;border-top:1px solid var(--line);background:#100e0c}.dock-left,.dock-mid,.dock-right{display:flex;align-items:center;gap:12px;min-width:0}.demos{display:flex;align-items:center;gap:6px;color:var(--mute);font-size:12px}.demos button{background:transparent;border:1px solid var(--line-2);padding:6px 8px;cursor:pointer}.demos button:hover,.demos button.is-on{border-color:var(--copper-2);color:var(--paper)}.dock-mid label{display:flex;gap:6px;align-items:center;color:var(--mute);font-size:12px}.progress{width:140px;height:2px;background:var(--line);position:relative;overflow:hidden}.progress.is-idle{opacity:.35}#progress-bar{position:absolute;inset:0 auto 0 0;width:0%;background:var(--acid)}.status{font-size:12px;color:var(--mute);white-space:nowrap}.status.is-error{color:var(--danger)}#app.is-drag #stage-wrap{outline:1px dashed var(--acid);outline-offset:-10px}dialog{border:1px solid var(--line-2);background:#141210;color:var(--paper);padding:0;max-width:520px;width:calc(100% - 32px)}dialog::backdrop{background:#060504b8}.help-body{padding:24px 26px 22px}.help-body h2{font-family:var(--serif);font-weight:400;font-size:28px;margin:0 0 12px}.help-body p,.help-body li{color:#cfc6b6;line-height:1.6}.help-body ul{padding-left:1.1em}.keys{font-family:var(--mono);font-size:11px;color:var(--mute)!important}.help-body form{margin-top:16px}@media(max-width:960px){main{grid-template-columns:1fr;grid-template-rows:minmax(200px,34vh) minmax(0,1fr);min-height:0}.deck{border-left:0;border-top:1px solid var(--line);max-height:none;min-height:0}.gate{aspect-ratio:16 / 9}.dock{align-items:center;padding:8px 12px max(10px,env(safe-area-inset-bottom))}.dock-right{width:auto}}@media(max-width:640px){.brand p{display:none}.topbar{padding:10px 12px 8px}.meta{display:none}.lang select{max-width:88px}.top-status{gap:10px}.out-links{gap:8px}.dock-mid,.dock-right{display:none}.dock-left{min-width:0;overflow-x:auto}#drop-hint{padding:16px}#drop-hint h2{font-size:24px}.minis canvas{height:44px}}