@font-face{font-family:"Press Start 2P";src:url(/fonts/press-start-2p.woff2)format("woff2");font-display:block}:root{--c-bg:#1a1c2c;--c-navy:#29366f;--c-panel:#333c57;--c-panel2:#566c86;--c-ink:#f4f4f4;--c-dim:#94b0c2;--c-accent:#41a6f6;--c-cyan:#73eff7;--c-warn:#b13e53;--c-orange:#ef7d57;--c-ok:#38b764;--c-model:#ffcd75;--c-select:#ffec27;--bev:3px;--fs-s:8px;--fs-m:10px;--fs-l:13px}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}html,body{background:var(--c-bg);overscroll-behavior:none;height:100%;margin:0;overflow:hidden}body{color:var(--c-ink);-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;font-family:"Press Start 2P",monospace}#app{height:100vh;grid-template-rows:1fr auto 1fr;height:100dvh;display:grid}#divider{background:var(--c-panel);touch-action:none;cursor:row-resize;justify-content:center;align-items:center;height:10px;display:flex;position:relative;box-shadow:inset 0 2px #f4f4f41a,inset 0 -2px #00000040}#divider:before{content:"";background:var(--c-panel2);width:28px;height:2px}#divider:after{content:"";position:absolute;inset:-8px 0}#divider.is-down:before{background:var(--c-accent)}#viewport{background:var(--c-bg);justify-content:center;align-items:center;display:flex;position:relative;overflow:hidden}#gl{image-rendering:pixelated;touch-action:none;display:block}#brand{top:calc(8px + env(safe-area-inset-top));z-index:5;pointer-events:none;align-items:center;gap:8px;display:flex;position:absolute;left:8px}#brand canvas{width:32px;height:32px;image-rendering:pixelated;filter:drop-shadow(1px 1px #00000080)}#gizmo{top:calc(38px + env(safe-area-inset-top));z-index:5;cursor:pointer;touch-action:manipulation;filter:drop-shadow(1px 1px #0000008c);position:absolute;right:8px}#gizmo canvas{display:block}#overlay{pointer-events:none;z-index:8;gap:6px;display:flex;position:absolute;bottom:8px;left:8px;right:8px}#overlay .px-btn{pointer-events:auto;width:44px;min-width:44px;height:44px;min-height:44px;font-size:var(--fs-l);filter:drop-shadow(2px 2px #00000073);background:#333c57d9;padding:0}.swatch{width:36px;min-width:36px;height:36px;min-height:36px;padding:0}.swatch.is-active{box-shadow:0 0 0 3px var(--c-select), inset 0 0 0 2px var(--c-bg)}.color-chip{width:44px;min-width:44px;height:44px;min-height:44px;position:relative}.color-chip--auto:after{content:"";background:var(--c-bg);width:9px;height:9px;box-shadow:inset 0 0 0 2px var(--c-dim);position:absolute;bottom:3px;right:3px}.color-preview{width:44px;height:44px;box-shadow:inset 0 0 0 2px var(--c-panel2);flex:none}.palette-strip{flex-wrap:wrap;gap:4px;display:flex}.palette-strip .swatch{width:28px;min-width:28px;height:28px;min-height:28px}.palette-mini{gap:2px;margin-top:4px;display:flex}.palette-mini i{width:14px;height:14px}.spectrum{grid-template-columns:repeat(12,1fr);gap:2px;display:grid}.spec-cell{aspect-ratio:1;cursor:pointer;border:0;border-radius:0;width:100%;padding:0}#overlay .px-btn.is-active{background:var(--c-accent);color:var(--c-bg)}.overlay-spacer{flex:1}#capacity{top:calc(8px + env(safe-area-inset-top));background:var(--c-bg);width:72px;height:6px;box-shadow:inset 0 0 0 1px var(--c-panel), 1px 1px 0 #0000008c;z-index:5;pointer-events:none;position:absolute;right:8px}#capacity .capacity__fill{background:var(--c-ok);width:0%;height:100%}#capacity.cap--warn .capacity__fill{background:var(--c-select)}#capacity.cap--hot .capacity__fill{background:var(--c-warn)}#stats{top:calc(18px + env(safe-area-inset-top));font-size:var(--fs-s);color:var(--c-panel2);text-shadow:1px 1px 0 var(--c-bg);text-align:right;z-index:5;pointer-events:none;position:absolute;right:8px}#stats-hit{top:calc(4px + env(safe-area-inset-top));z-index:6;cursor:pointer;touch-action:manipulation;width:124px;height:32px;position:absolute;right:4px}#stats .fps--low{color:var(--c-select)}#stats .fps--mid{color:var(--c-orange)}#stats .fps--bad{color:var(--c-warn)}#render-blocked{z-index:7;text-align:center;pointer-events:none;background:#1a1c2ce0;flex-direction:column;justify-content:center;align-items:center;gap:12px;padding:24px;display:flex;position:absolute;inset:0}#render-blocked .render-blocked__title{font-size:var(--fs-m);color:var(--c-warn);letter-spacing:1px}#render-blocked .render-blocked__body{font-size:var(--fs-s);color:var(--c-ink);line-height:1.7}#render-blocked .render-blocked__hint{font-size:var(--fs-s);color:var(--c-dim);line-height:1.7}.pick-banner{top:calc(8px + env(safe-area-inset-top));background:var(--c-accent);color:var(--c-bg);font-size:var(--fs-s);z-index:6;text-align:center;max-width:80%;padding:8px 12px;line-height:1.5;position:absolute;left:50%;transform:translate(-50%);box-shadow:2px 2px #00000073}.px-row--child{background:var(--c-panel);min-height:40px;margin-left:18px}.toast{background:var(--c-bg);color:var(--c-ink);font-size:var(--fs-s);filter:drop-shadow(2px 2px #00000073);box-shadow:0 0 0 2px var(--c-panel2);opacity:0;pointer-events:none;z-index:6;text-align:center;max-width:92%;padding:10px 12px;line-height:1.5;position:absolute;bottom:68px;left:50%;transform:translate(-50%)}.toast.show{opacity:1}.toast--warn{box-shadow:0 0 0 2px var(--c-warn);color:var(--c-orange)}#menu{background:var(--c-panel);border-top:4px solid var(--c-panel2);min-height:0;padding-bottom:env(safe-area-inset-bottom);flex-direction:column;display:flex}.menu-header{background:var(--c-bg);flex:none;align-items:center;gap:8px;padding:8px;display:flex}.menu-title{font-size:var(--fs-m);color:var(--c-select);text-transform:uppercase;letter-spacing:1px;text-overflow:ellipsis;white-space:nowrap;flex:1;overflow:hidden}.menu-body{-webkit-overflow-scrolling:touch;flex-direction:column;flex:1;gap:10px;padding:12px;display:flex;overflow-y:auto}.menu-grid{grid-template-columns:repeat(2,1fr);gap:10px;display:grid}.menu-grid--3{grid-template-columns:repeat(3,1fr)}.menu-note{font-size:var(--fs-s);color:var(--c-dim);line-height:1.7}.px-btn{font-family:inherit;font-size:var(--fs-m);color:var(--c-ink);background:var(--c-panel2);cursor:pointer;touch-action:manipulation;text-align:center;min-width:44px;min-height:44px;box-shadow:inset var(--bev) var(--bev) 0 #f4f4f438, inset calc(-1 * var(--bev)) calc(-1 * var(--bev)) 0 #00000059;border:0;border-radius:0;justify-content:center;align-items:center;gap:8px;padding:14px 12px;line-height:1.4;display:inline-flex}.px-btn:active,.px-btn.is-down{box-shadow:inset var(--bev) var(--bev) 0 #00000059, inset calc(-1 * var(--bev)) calc(-1 * var(--bev)) 0 #f4f4f438}.px-btn:disabled{opacity:.4;cursor:default}.px-btn--accent{background:var(--c-accent);color:var(--c-bg)}.px-btn--ok{background:var(--c-ok);color:var(--c-bg)}.px-btn--warn{background:var(--c-warn)}.px-btn--ghost{background:var(--c-panel);color:var(--c-dim)}.px-btn--mini{min-width:36px;min-height:36px;font-size:var(--fs-s);padding:6px}.px-btn--icon{width:44px;height:44px;padding:0}.px-btn canvas{image-rendering:pixelated}.px-row{background:var(--c-bg);align-items:center;gap:8px;min-height:48px;padding:6px 8px;display:flex}.px-row__label{font-size:var(--fs-s);text-overflow:ellipsis;white-space:nowrap;flex:1;line-height:1.5;overflow:hidden}.px-row__sub{color:var(--c-dim);margin-top:4px;display:block}.px-row.is-selected{box-shadow:inset 0 0 0 2px var(--c-select)}.stepper{align-items:center;gap:6px;display:flex}.stepper__label{font-size:var(--fs-s);color:var(--c-dim);flex:none;width:70px;line-height:1.4}.stepper__value{text-align:center;min-width:0;font-size:var(--fs-m);color:var(--c-cyan);background:var(--c-bg);box-shadow:inset 0 0 0 2px var(--c-panel2);cursor:pointer;flex:1;padding:13px 4px}.stepper .px-btn{width:44px;height:44px;font-size:var(--fs-l);flex:none;padding:0}.seg{gap:4px;display:flex}.seg .px-btn{background:var(--c-panel);color:var(--c-dim);flex:1}.seg .px-btn.is-active{background:var(--c-accent);color:var(--c-bg)}.px-input{font-family:inherit;font-size:var(--fs-m);color:var(--c-ink);background:var(--c-bg);width:100%;box-shadow:inset 0 0 0 2px var(--c-panel2);border:0;border-radius:0;padding:12px}.px-input:focus{box-shadow:inset 0 0 0 2px var(--c-accent);outline:none}.install-bar{background:var(--c-navy);flex:none;align-items:center;gap:8px;padding:8px;display:flex}.install-bar span{font-size:var(--fs-s);color:var(--c-ink);flex:1;line-height:1.5}.banner{background:var(--c-warn);color:#fff;font-size:var(--fs-s);text-align:center;padding:8px;line-height:1.5}.update-bar{background:var(--c-navy);cursor:pointer;flex:none;align-items:center;gap:8px;padding:8px;display:flex}.update-bar__text{flex-direction:column;flex:1;gap:6px;display:flex}.update-bar__title{font-size:var(--fs-s);color:var(--c-ink);line-height:1.5}.update-bar__sub{font-size:var(--fs-s);color:var(--c-dim);line-height:1.5}.dialog-backdrop{z-index:100;background:#1a1c2cbf;justify-content:center;align-items:center;padding:16px;display:flex;position:fixed;inset:0}.dialog{background:var(--c-panel);width:100%;max-width:360px;box-shadow:inset 0 0 0 3px var(--c-panel2), 6px 6px 0 #0006;flex-direction:column;gap:14px;padding:16px;display:flex}.dialog__title{font-size:var(--fs-m);color:var(--c-select);text-transform:uppercase}.dialog__msg{font-size:var(--fs-s);color:var(--c-dim);line-height:1.7}.dialog__actions{justify-content:flex-end;gap:8px;display:flex}#splash{font-family:"Press Start 2P",monospace}#splash canvas{width:128px;height:128px;image-rendering:pixelated}#splash .splash-title{font-size:var(--fs-l);color:var(--c-ink);letter-spacing:2px}#splash .splash-text{font-size:var(--fs-s);color:var(--c-dim);animation:1.2s step-end infinite blink}#splash .splash-bar{width:200px;height:18px;box-shadow:inset 0 0 0 2px var(--c-panel2);padding:4px}#splash .splash-bar__fill{background:var(--c-accent);width:0%;height:100%}@keyframes blink{50%{opacity:.25}}#loader{z-index:900;background:#1a1c2cb3;justify-content:center;align-items:center;padding:16px;display:flex;position:fixed;inset:0}.loader-panel{background:var(--c-panel);box-shadow:inset 0 0 0 3px var(--c-panel2), 6px 6px 0 #0006;flex-direction:column;align-items:center;gap:14px;padding:16px;display:flex}.loader-label{font-size:var(--fs-s);color:var(--c-ink);letter-spacing:1px}.loader-bar{background-color:var(--c-bg);background-image:repeating-linear-gradient(90deg, var(--c-accent) 0 12px, var(--c-bg) 12px 24px);width:192px;height:18px;box-shadow:inset 0 0 0 2px var(--c-panel2);animation:.5s steps(2,end) infinite loader-march}@keyframes loader-march{to{background-position-x:24px}}.hidden{display:none!important}
