:root{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;color:#edf5ff;font-synthesis:none;background:#000;font-family:DM Mono,monospace}*{box-sizing:border-box}html,body{width:100%;height:100%;margin:0;overflow:hidden}body{background:#000}main{height:100dvh;padding:env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left);place-items:center;display:grid}.arcade{--energy-color:#fff;--energy-light:#fff;width:min(100%,calc((100svh - env(safe-area-inset-top) - env(safe-area-inset-bottom) - 68px)/1.46));width:min(100%,calc((100dvh - env(safe-area-inset-top) - env(safe-area-inset-bottom) - 68px)/1.46));background:#000}.hud{font-variant-numeric:tabular-nums;background:#000;justify-content:space-between;align-items:center;gap:24px;height:68px;padding:8px 18px 11px;display:flex}.hud-label{letter-spacing:.16em;font-size:10px;line-height:1.5;display:block}.score-readout .hud-label{color:#ff8794}#score,#level{letter-spacing:.035em;color:#f5f7ff;white-space:nowrap;font-size:25px;line-height:1.15;display:block}.level-readout{flex-shrink:0}.energy-readout{text-align:right;min-width:104px;color:var(--energy-color);position:relative}.energy-value{white-space:nowrap;line-height:1.15}.energy-value b{font-size:25px;font-weight:400}.energy-value>span{margin-left:5px;font-size:11px}.energy-meter{background:#262626;width:100%;height:2px;position:absolute;bottom:-6px;right:0}.energy-meter i{background:var(--energy-color);width:100%;height:100%;transition:width .12s;display:block}.recovering .energy-value{text-shadow:0 0 13px var(--energy-color)}.recovering .energy-meter{box-shadow:0 0 14px #b0ffc76b}.board-wrap{aspect-ratio:10/14.6;isolation:isolate;width:100%;position:relative;overflow:hidden;container-type:size}canvas{touch-action:none;outline:none;width:100%;height:100%;display:block}canvas:focus-visible{box-shadow:inset 0 0 0 2px #b9e9ff}.pause-button{z-index:1;color:#c7d7e7;background:#000000d9;border:1px solid #9ab4cf4d;border-radius:4px;place-items:center;width:44px;height:44px;padding:0;display:grid;position:absolute;top:8px;right:8px}.pause-button:hover{color:#fff;border-color:#b9dbef}button{font:inherit;cursor:pointer;touch-action:manipulation;-webkit-tap-highlight-color:transparent}button:focus-visible{outline-offset:5px;outline:2px solid #d8f2ff}button:disabled{cursor:wait;opacity:.5}.overlay{text-align:center;background:#000000b8;flex-direction:column;justify-content:center;align-items:center;gap:28px;padding:20px;display:flex;position:absolute;inset:0}.overlay[hidden],[hidden]{display:none!important}.overlay h1{letter-spacing:.12em;white-space:nowrap;text-shadow:0 0 24px #ffffff20;margin:0;font:400 clamp(24px,8cqw,42px)/1.2 DM Mono,monospace}.primary{color:#071324;letter-spacing:.08em;background:#e0effa;border:1px solid #b9dbef;min-width:180px;min-height:48px;padding:12px 24px;font-family:system-ui,sans-serif;font-size:14px;font-weight:600}.primary:hover{background:#fff}.primary:active{transform:translateY(1px)}.overlay-actions{justify-content:center;gap:12px;width:180px;max-width:100%;display:flex}.arcade[data-state=paused] .overlay-actions{width:360px}.secondary{color:#d5e2ed;letter-spacing:.08em;background:#000000d9;border:1px solid #9ab4cf80;min-height:48px;padding:12px 24px;font-family:system-ui,sans-serif;font-size:14px;font-weight:600}.secondary:hover{color:#fff;background:#162535;border-color:#b9dbef}.secondary:active{transform:translateY(1px)}.overlay-actions .primary,.overlay-actions .secondary{flex:1;min-width:0;padding-inline:clamp(6px,3cqw,18px)}.announcement{text-align:center;pointer-events:none;opacity:0;letter-spacing:.025em;color:#effaff;text-shadow:0 2px 16px #000;white-space:pre-line;background:linear-gradient(90deg,#0000,#000000d9 20% 80%,#0000);padding:18px 2px;font:clamp(17px,6cqw,30px)/1.4 DM Mono,monospace;position:absolute;inset:35% 0 auto}.announcement.visible{opacity:1}.arcade[data-state=over] .overlay{pointer-events:none;background:0 0;justify-content:flex-end;gap:0;padding-bottom:18%}.arcade[data-state=over] .overlay h1{letter-spacing:.04em;background:linear-gradient(90deg,#0000,#000000ce 20% 80%,#0000);padding:18px 0;font-size:clamp(24px,8cqw,40px);position:absolute;top:50%;left:0;right:0;transform:translateY(-50%)}.arcade[data-state=over] .primary{pointer-events:auto;background:#e0effaf2;box-shadow:0 0 28px #000b}.sr-only{clip-path:inset(50%);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.unavailable{text-align:center;z-index:2;background:#000;padding:20px;font:14px/1.8 system-ui,sans-serif;position:absolute;inset:40% 10% auto}html.impulse-touch-steering,html.impulse-touch-steering body{touch-action:none;overscroll-behavior:none;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none}@media (width<=360px){.hud{gap:10px;padding-inline:12px}#score,#level,.energy-value b{font-size:22px}.energy-readout{min-width:90px}}@media (height<=500px){.hud{gap:4px;padding-inline:6px}#score,#level,.energy-value b{font-size:14px}.hud-label{letter-spacing:.04em;font-size:8px}.energy-readout{min-width:56px}.energy-value>span{margin-left:2px;font-size:8px}.primary,.secondary{min-width:130px;min-height:44px;padding:10px 16px;font-size:12px}.overlay{gap:16px;padding:10px}}@media (prefers-reduced-motion:reduce){.energy-meter i{transition:none}}.object-layer{z-index:1;pointer-events:none;position:absolute;inset:0}.pause-button{z-index:2}.overlay,.announcement{z-index:3}
