*,:before,:after{box-sizing:border-box}html,body{background:var(--bg);height:100%;color:var(--text);font-family:var(--font-game);font-variant-numeric:tabular-nums;margin:0}#app{flex-direction:column;min-height:100%;display:flex}.screen{text-align:center;flex-direction:column;flex:1;justify-content:center;align-items:center;gap:16px;padding:16px;display:flex}h1{font-family:var(--font-display);margin:0;font-size:clamp(24px,6vw,40px);font-weight:400}p{max-width:36ch;margin:0}.card{background:var(--surface);border:var(--stroke) solid var(--ink);border-radius:var(--r-card);box-shadow:0 var(--lift) 0 var(--ink);box-shadow:inset 0 1px 0 var(--edge),0 var(--lift) 0 var(--ink);flex-direction:column;align-items:center;gap:12px;padding:16px;display:flex}.row{flex-wrap:wrap;justify-content:center;gap:12px;display:flex}button{font:inherit;color:var(--ink);background:var(--button);border:var(--stroke) solid var(--ink);border-radius:var(--r-button);box-shadow:0 var(--lift) 0 var(--ink);min-width:var(--touch);min-height:var(--touch);cursor:pointer;transition:transform var(--press) linear,box-shadow var(--press) linear;padding:0 20px;font-size:18px}:root[data-theme=dark] button{color:var(--text)}button:active{transform:translateY(var(--lift));box-shadow:0 0 0 var(--ink)}button.primary{background:var(--green);color:var(--ink)}button.secondary{background:var(--cyan);color:var(--ink)}button.warning{background:var(--yellow);color:var(--ink)}button.danger{background:var(--red);color:var(--ink)}:root[data-motion=none] *{transition:none!important;animation:none!important}.level{text-align:left;flex:1;grid-template:"plates plates""hud hud""stage code"minmax(0,1fr)"ctrl code"/1fr 1fr;gap:8px;height:100dvh;min-height:0;padding:8px;display:grid}@media (orientation:portrait){.level{grid-template:"plates""hud""stage"minmax(0,1fr)"ctrl""code"minmax(0,1fr)/1fr}}.level .plates{flex-wrap:wrap;grid-area:plates;gap:8px;display:flex}.level .plate{background:var(--hud-plate);color:var(--hud-text);border:var(--stroke) solid var(--ink);border-radius:var(--r-card);flex:200px;min-width:0;padding:8px 12px}.level .plate h2{font-size:14px;font-family:var(--font-game);color:var(--yellow);margin:0}.level .plate p{max-width:none;font-size:15px}.level .plate[hidden]{display:none}.level .stage,.level .code{border:var(--stroke) dashed var(--dim);border-radius:var(--r-card);color:var(--dim);justify-content:center;align-items:center;min-height:0;display:flex;overflow:hidden}.level .stage{grid-area:stage}.level .code{grid-area:code}.level .ctrl{flex-wrap:wrap;grid-area:ctrl;align-items:center;gap:8px;display:flex}.hud-missions{grid-area:hud;overflow-x:auto}.hud-missions ul{gap:8px;width:max-content;margin:0;padding:0;list-style:none;display:flex}.chip{border:var(--stroke) solid var(--ink);background:var(--nested);white-space:nowrap;border-radius:999px;align-items:center;min-height:32px;padding:0 12px;display:inline-flex}.chip.current{background:var(--yellow);color:var(--ink)}.chip.done:before{content:"";background:var(--green);border:2px solid var(--ink);border-radius:50%;width:10px;height:10px;margin-right:6px}.modal-back{background:var(--scrim);justify-content:center;align-items:center;padding:16px;display:flex;position:fixed;inset:0}.modal{width:100%;max-width:420px}.modal h2{font-family:var(--font-display);margin:0;font-size:28px;font-weight:400}:root[data-motion=touch] .modal,:root[data-motion=full] .modal{animation:.22s ease-out modalIn}@keyframes modalIn{0%{opacity:0;transform:scale(.92)}to{opacity:1;transform:none}}