:root{--bg:#05070b;--ink:#e9eff6;--dim:#97a3b4;--dimmer:#6b7889;--line:#9eb4ca29;--line-strong:#b0c7dc4d;--accent:#edaa62;--accent-soft:#edaa6224;--glow:#86d4ff;--panel:#090d13bd;--ui:ui-sans-serif, -apple-system, "SF Pro Text", "Helvetica Neue", Arial, sans-serif;--mono:ui-monospace, "SF Mono", SFMono-Regular, Menlo, Consolas, monospace}*{box-sizing:border-box}html,body{background:var(--bg);height:100%;color:var(--ink);font-family:var(--ui);-webkit-font-smoothing:antialiased;overscroll-behavior:none;margin:0;overflow:hidden}#stage{position:fixed;inset:0}#stage canvas{touch-action:none;width:100%;height:100%;display:block}.hud{pointer-events:none;z-index:10;padding:26px clamp(20px,3vw,44px);position:fixed;inset:0}.hud>*{pointer-events:auto}.hud:after{content:"";pointer-events:none;z-index:-1;background:linear-gradient(#0000,#030508b8);height:26vh;position:fixed;inset:auto 0 0}.brand{max-width:min(46vw,430px);position:absolute;top:26px;left:clamp(20px,3vw,44px)}.brand__mark{font-family:var(--mono);letter-spacing:.22em;text-transform:uppercase;color:var(--dimmer);align-items:baseline;gap:10px;font-size:10px;display:flex}.brand__id{color:var(--accent)}.brand__tag:before{content:"/ ";color:var(--dimmer)}.brand__title{letter-spacing:-.015em;text-transform:uppercase;margin:12px 0 0;font-size:clamp(26px,3.2vw,46px);font-weight:300;line-height:.94}.brand__title span{letter-spacing:.055em;font-weight:600;display:block}.brand__sub{letter-spacing:.08em;color:var(--dim);margin:14px 0 0;font-size:12px}.brand__rule{background:linear-gradient(to right, var(--accent), transparent);width:74px;height:1px;margin-top:16px}.modes{flex-direction:column;gap:2px;display:flex;position:absolute;top:50%;left:clamp(20px,3vw,44px);transform:translateY(-50%)}.mode{white-space:nowrap;border:0;border-left:1px solid var(--line-strong);width:auto;min-width:158px;color:var(--dim);font-family:var(--ui);letter-spacing:.12em;text-transform:uppercase;text-align:left;cursor:pointer;background:0 0;align-items:center;gap:12px;padding:9px 12px 9px 14px;font-size:12.5px;transition:color .25s,background .25s,border-color .25s;display:flex}.mode__num{font-family:var(--mono);color:var(--dimmer);letter-spacing:.1em;font-size:9.5px}.mode:hover{color:var(--ink);background:linear-gradient(90deg,#96b4d212,#0000)}.mode.is-active{color:#fff;border-left-color:var(--accent);background:linear-gradient(90deg,#edaa621f,#0000)}.mode.is-active .mode__num{color:var(--accent)}.panel{background:var(--panel);border:1px solid var(--line);-webkit-backdrop-filter:blur(16px)saturate(120%);border-radius:2px;flex-direction:column;width:340px;max-height:calc(100vh - 190px);display:flex;position:absolute;top:26px;right:clamp(20px,3vw,44px);box-shadow:0 24px 60px -30px #000}.panel:before{content:"";background:var(--accent);width:56px;height:1px;position:absolute;top:-1px;left:-1px}.panel__head{border-bottom:1px solid var(--line);padding:16px 18px 12px}.panel__kicker{font-family:var(--mono);letter-spacing:.24em;text-transform:uppercase;color:var(--accent);font-size:9.5px}.panel__title{letter-spacing:.01em;margin:6px 0 0;font-size:19px;font-weight:500}.panel__body{scrollbar-width:thin;scrollbar-color:#a0bed747 transparent;color:#ccd6e0;padding:16px 18px 18px;font-size:12.5px;line-height:1.62;overflow-y:auto}.panel__body::-webkit-scrollbar{width:6px}.panel__body::-webkit-scrollbar-thumb{background:#a0bed73d;border-radius:6px}.panel__foot{border-top:1px solid var(--line);font-family:var(--mono);letter-spacing:.18em;text-transform:uppercase;color:var(--dimmer);padding:9px 18px;font-size:9px}.panel p{margin:0 0 10px}.panel p:last-child{margin-bottom:0}.lede{color:#dbe4ee}.muted{color:var(--dim)}.panel h3{font-family:var(--mono);letter-spacing:.22em;text-transform:uppercase;color:var(--accent);margin:18px 0 8px;font-size:9.5px;font-weight:500}.panel h3:first-child{margin-top:0}.specs{grid-template-columns:1fr;gap:0;margin:0;display:grid}.specs div{border-bottom:1px dashed #9eb4ca1f;justify-content:space-between;gap:12px;padding:6px 0;display:flex}.specs div:last-child{border-bottom:0}.specs dt{color:var(--dim);letter-spacing:.03em;font-size:11.5px}.specs dd{font-family:var(--mono);color:#eaf1f8;text-align:right;margin:0;font-size:11.5px}.parts{flex-direction:column;gap:1px;margin:0 -6px;display:flex}.parts button{color:#c3cedb;font-family:var(--ui);text-align:left;cursor:pointer;background:0 0;border:0;border-radius:2px;align-items:center;gap:9px;padding:6px 8px;font-size:12px;transition:background .16s,color .16s;display:flex}.parts button:hover,.parts button.is-active{color:#fff;background:#edaa621a}.parts i{font-family:var(--mono);color:var(--dimmer);min-width:16px;font-size:9.5px;font-style:normal}.parts button.is-active i{color:var(--accent)}.parts small{font-family:var(--mono);color:var(--dimmer);margin-left:auto;font-size:9.5px}.pill{font-family:var(--mono);letter-spacing:.2em;text-transform:uppercase;color:var(--accent);border:1px solid #edaa6266;border-radius:2px;margin-bottom:10px;padding:3px 8px;font-size:9px;display:inline-block}.backlink{color:var(--accent);font-family:var(--mono);letter-spacing:.16em;text-transform:uppercase;cursor:pointer;background:0 0;border:0;margin-top:14px;padding:0;font-size:10px}.backlink:hover{color:#fff}.timeline{margin:0;padding:0;list-style:none}.timeline li{border-left:1px solid var(--line);padding:0 0 12px 20px;position:relative}.timeline li:last-child{border-left-color:#0000;padding-bottom:0}.timeline li:before{content:"";background:var(--bg);border:1px solid var(--accent);border-radius:50%;width:7px;height:7px;position:absolute;top:6px;left:-3.5px}.timeline b{font-family:var(--mono);letter-spacing:.14em;color:var(--accent);font-size:10px;display:block}.timeline span{color:var(--dim);font-size:12px}.explodebar{background:var(--panel);border:1px solid var(--line);-webkit-backdrop-filter:blur(16px)saturate(120%);opacity:0;pointer-events:none;border-radius:2px;align-items:center;gap:16px;width:min(580px,56vw);padding:12px 18px 13px 14px;transition:opacity .45s,transform .45s cubic-bezier(.22,1,.36,1);display:flex;position:absolute;bottom:30px;left:50%;transform:translate(-50%,14px);box-shadow:0 24px 60px -34px #000}.explodebar.is-on{opacity:1;pointer-events:auto;transform:translate(-50%)}.play{border:1px solid var(--line-strong);width:34px;height:34px;color:var(--ink);cursor:pointer;background:0 0;border-radius:50%;flex:none;place-items:center;transition:border-color .2s,background .2s;display:grid}.play:hover{border-color:var(--accent);background:var(--accent-soft)}.play svg{fill:currentColor;width:13px;height:13px}.play.is-playing svg{display:none}.play.is-playing:after{content:"";border-left:2px solid;border-right:2px solid;width:9px;height:11px}.explodebar__track{flex:auto;min-width:0}.explodebar__label{font-family:var(--mono);letter-spacing:.2em;text-transform:uppercase;color:var(--dim);justify-content:space-between;align-items:baseline;margin-bottom:7px;font-size:9px;display:flex}.explodebar__val{color:var(--accent);font-size:10px}.slider{appearance:none;cursor:ew-resize;background:0 0;width:100%;height:16px;display:block}.slider::-webkit-slider-runnable-track{background:linear-gradient(to right, var(--accent) 0, var(--accent) var(--fill,0%), #9eb4ca3d var(--fill,0%), #9eb4ca3d 100%);height:2px}.slider::-webkit-slider-thumb{-webkit-appearance:none;background:#fff;border:0;border-radius:50%;width:12px;height:12px;margin-top:-5px;box-shadow:0 0 0 3px #edaa6238,0 0 14px #edaa6280}.slider::-moz-range-track{background:#9eb4ca3d;height:2px}.slider::-moz-range-progress{background:var(--accent);height:2px}.slider::-moz-range-thumb{background:#fff;border:0;border-radius:50%;width:12px;height:12px}.hints{font-family:var(--mono);letter-spacing:.12em;text-transform:uppercase;color:var(--dimmer);flex-wrap:wrap;gap:6px 16px;max-width:300px;font-size:9.5px;display:flex;position:absolute;bottom:34px;left:clamp(20px,3vw,44px)}.hints span{white-space:nowrap}kbd{border:1px solid var(--line-strong);min-width:16px;font-family:var(--mono);color:var(--dim);text-align:center;border-radius:2px;margin-right:1px;padding:1px 4px;font-size:9px;display:inline-block}.fps{font-family:var(--mono);letter-spacing:.16em;color:var(--glow);opacity:.8;font-size:10px;position:absolute;bottom:30px;right:clamp(20px,3vw,44px)}.labels{pointer-events:none;z-index:8;position:fixed;inset:0;overflow:hidden}.labels svg{width:100%;height:100%;position:absolute;inset:0;overflow:visible}.lbl{will-change:transform;position:absolute;top:0;left:0}.lbl__inner{transform-origin:50%;opacity:0;transition:opacity .3s;position:absolute}.lbl.is-on .lbl__inner{opacity:1}.lbl__card{pointer-events:auto;cursor:pointer;box-sizing:border-box;border:1px solid var(--line-strong);border-left:1px solid var(--accent);-webkit-backdrop-filter:blur(8px);background:#070a0fd1;border-radius:2px;width:212px;padding:7px 11px 8px;transition:border-color .2s,background .2s,transform .2s}.lbl__card:hover{background:#0e141cf0;border-color:#edaa62b3}.lbl__name{font-family:var(--mono);letter-spacing:.17em;text-transform:uppercase;color:var(--accent);white-space:nowrap;font-size:9.5px;display:block}.lbl__desc{-webkit-line-clamp:3;color:#c2ccd8;-webkit-box-orient:vertical;margin-top:3px;font-size:10.5px;line-height:1.42;display:-webkit-box;overflow:hidden}.loader{z-index:50;background:#05070b;place-items:center;transition:opacity .7s,visibility .7s;display:grid;position:fixed;inset:0}.loader.is-done{opacity:0;visibility:hidden}.loader__inner{text-align:center;width:260px}.loader__title{letter-spacing:.34em;text-transform:uppercase;color:var(--dim);margin-bottom:16px;font-size:12px}.loader__bar{background:#9eb4ca33;height:1px;overflow:hidden}.loader__bar span{background:var(--accent);width:30%;height:100%;animation:1.4s cubic-bezier(.6,0,.3,1) infinite load;display:block}.loader__step{font-family:var(--mono);letter-spacing:.22em;text-transform:uppercase;color:var(--dimmer);margin-top:14px;font-size:9px}@keyframes load{0%{transform:translate(-100%)}to{transform:translate(340%)}}@media (width<=1180px){.panel{width:300px}.explodebar{width:min(440px,44vw)}.hints{max-width:210px}}@media (width<=900px){.hud{padding:18px}.brand{top:18px;left:18px}.brand__title{font-size:24px}.brand__sub{display:none}.brand__rule{margin-top:10px}.panel{width:268px;max-height:calc(100vh - 220px);top:18px;right:18px}.modes{flex-direction:row;gap:0;top:auto;bottom:92px;left:18px;transform:none}.mode{border-left:0;border-bottom:1px solid var(--line-strong);width:auto;padding:8px 12px;font-size:11px}.mode.is-active{border-left:0;border-bottom-color:var(--accent);background:linear-gradient(#0000,#edaa621f)}.mode__num{display:none}.explodebar{width:calc(100% - 36px);max-width:420px;bottom:18px}.hints{display:none}.fps{bottom:104px;right:18px}}@media (width<=680px){.panel{display:none}.brand__mark{font-size:9px}}@media (prefers-reduced-motion:reduce){.explodebar,.lbl__inner,.mode,.loader{transition-duration:.01ms}}.label-layer{pointer-events:none;position:absolute;inset:0;overflow:hidden}.lbl{opacity:0;width:0;height:0;position:absolute;top:0;left:0}.lbl__line{transform-origin:0;background:linear-gradient(90deg,#96bee60d 0%,#bad8f661 55%,#edaa6280 100%);height:1px;position:absolute;top:0;left:0}.lbl__dot{background:#eaf4ff;border-radius:50%;width:5px;height:5px;position:absolute;top:-2.5px;left:-2.5px;box-shadow:0 0 10px #96cdffe6,0 0 2px #fff}.lbl__inner{opacity:1;position:absolute;top:0;left:0}.lbl__card{cursor:pointer}.explodebar{opacity:1;pointer-events:auto;transition:opacity .4s,transform .4s cubic-bezier(.22,1,.36,1);transform:translate(-50%)}.explodebar.is-hidden{opacity:0;pointer-events:none;transform:translate(-50%,16px)}.parts button span{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.specs div.row dd{max-width:62%}@media (width<=900px){.lbl__card{width:168px;padding:5px 8px 6px}.lbl__desc{font-size:9.5px}}
