:root{color-scheme:dark;--blue: #085dff;--blue-hot: #13a4ff;--gold: #ffbf31;--red: #ff3434;--green: #20d24b;--ink: #050507;--panel: #090b18}*{box-sizing:border-box}html,body{margin:0;min-height:100%;overflow-x:hidden}body{align-items:center;background:radial-gradient(circle at 50% 8%,color-mix(in srgb,var(--blue) 24%,transparent),transparent 26rem),linear-gradient(180deg,#050509,#000);color:#fff;display:flex;font-family:Courier New,Courier,monospace;justify-content:center;padding:clamp(12px,3vw,30px)}button,input{font:inherit}button{touch-action:manipulation}.arcade-shell{max-width:1100px;width:min(100%,1100px)}.hud,.controls{align-items:center;display:grid;gap:16px;grid-template-columns:1fr auto 1fr;letter-spacing:0;text-transform:uppercase}.hud{margin:0 auto 12px;text-shadow:0 0 8px rgba(255,255,255,.35)}.hud>div{display:grid;gap:4px}.hud>div:last-child{justify-items:end;text-align:right}.hud span,.hud strong,.controls,.mobile-high-score,.scoreboard-panel,.signup-panel{font-size:clamp(12px,2.2vw,24px)}.hud strong{color:#fff}.red{color:var(--red)}.brand{color:var(--green);justify-items:center;min-width:220px;text-align:center}.brand span{color:#fff;font-size:clamp(20px,4vw,42px);font-style:italic;line-height:.85;text-transform:none}.brand strong{color:var(--green);font-size:clamp(18px,3.5vw,36px);line-height:.9}.cabinet{aspect-ratio:48 / 31;background:#000;border:4px solid var(--blue);box-shadow:0 0 0 2px #001650 inset,0 0 22px #085dffd9,0 0 70px #085dff59;contain:paint;overflow:hidden;position:relative;width:100%}canvas{display:block;height:100%;image-rendering:pixelated;outline:none;touch-action:none;width:100%}.crt{background:repeating-linear-gradient(180deg,rgba(255,255,255,.08) 0,rgba(255,255,255,.08) 1px,transparent 1px,transparent 4px);top:0;right:0;bottom:0;left:0;opacity:.18;pointer-events:none;position:absolute}.cabinet:after{background:radial-gradient(circle at 50% 50%,transparent 55%,rgba(0,0,0,.72) 100%);content:"";top:0;right:0;bottom:0;left:0;pointer-events:none;position:absolute}.controls{color:var(--gold);margin-top:14px}.controls button,.signup-panel button,.scoreboard-panel button{background:#050507;border:2px solid var(--blue);color:var(--gold);cursor:pointer;min-height:44px;padding:8px 16px;text-shadow:0 0 8px rgba(255,191,49,.6)}.controls button:hover,.signup-panel button:hover,.scoreboard-panel button:hover{border-color:var(--blue-hot);box-shadow:0 0 16px #13a4ffa6}.controls span{justify-self:end;text-align:right}.mobile-high-score{align-items:center;background:#020612e0;border:2px solid var(--blue);box-shadow:0 0 14px #085dff61;display:none;gap:12px;justify-content:space-between;margin-top:10px;padding:10px 12px;text-shadow:0 0 8px rgba(255,255,255,.28);text-transform:uppercase}.mobile-high-score strong{color:#fff}.touch-controls{display:none;justify-items:center}.touch-controls button{background:#050507;border:2px solid var(--blue);color:var(--gold);cursor:pointer;font-size:28px;font-weight:700;min-height:58px;padding:0;text-shadow:0 0 8px rgba(255,191,49,.7);-webkit-user-select:none;user-select:none}.touch-controls button:active{background:color-mix(in srgb,var(--blue) 34%,#050507);border-color:var(--blue-hot);box-shadow:0 0 18px #13a4ffbf;color:#fff}.touch-pad{display:grid;gap:10px;grid-template-areas:". up ." "left label right" ". down .";grid-template-columns:repeat(3,minmax(58px,1fr));justify-self:center;max-width:340px;width:100%}.touch-pad-label{align-self:center;color:var(--green);font-size:16px;font-weight:700;grid-area:label;justify-self:center;text-shadow:0 0 8px rgba(32,210,75,.7)}.touch-up{grid-area:up}.touch-left{grid-area:left}.touch-right{grid-area:right}.touch-down{grid-area:down}.touch-pad-p2{display:none;opacity:.86;transform:scale(.92);transform-origin:top center}.touch-pad-p2 .touch-pad-label{color:var(--blue-hot)}.touch-pad-p2 button{font-size:22px;min-height:48px}body.co-op-on .touch-pad-p2{display:grid}.scoreboard-panel{align-items:center;background:#020612e6;border:2px solid var(--blue);box-shadow:0 0 18px #085dff73;display:grid;gap:12px;grid-template-columns:minmax(170px,.72fr) minmax(260px,1.28fr);margin-top:12px;padding:14px 16px;text-transform:uppercase}.scoreboard-panel[hidden],.initials-form[hidden]{display:none}.scoreboard-head{display:grid;gap:4px}.scoreboard-head h2{color:var(--green);font-size:clamp(18px,3vw,28px);line-height:1;margin:0;text-shadow:0 0 10px rgba(32,210,75,.65)}.initials-form{align-items:center;display:grid;gap:10px;grid-column:1 / -1;grid-template-columns:auto 82px auto minmax(120px,1fr)}.initials-form label{color:var(--gold)}.initials-form input{background:#030711;border:2px solid #173ea8;color:#fff;font-size:22px;font-weight:700;height:44px;letter-spacing:0;padding:4px 8px;text-align:center;text-transform:uppercase;width:82px}.initials-form input:focus{border-color:var(--blue-hot);box-shadow:0 0 12px #13a4ff73;outline:none}.initials-form p{color:var(--gold);margin:0;text-align:right;text-shadow:0 0 8px rgba(255,191,49,.45)}.scoreboard-list{display:grid;gap:6px;list-style:none;margin:0;padding-left:0}.scoreboard-list li{color:#fff;display:grid;gap:12px;grid-template-columns:44px minmax(64px,1fr) auto;text-shadow:0 0 8px rgba(255,255,255,.25)}.scoreboard-rank,.scoreboard-initials{color:var(--gold);font-weight:700}.scoreboard-score{color:var(--green);justify-self:end}.scoreboard-empty{color:#ffffff94;grid-column:1 / -1}.signup-panel{align-items:center;background:#020612e6;border:2px solid var(--blue);box-shadow:0 0 18px #085dff73;display:grid;gap:14px;grid-template-columns:minmax(180px,.9fr) minmax(260px,1.2fr);margin-top:18px;padding:16px;text-transform:uppercase}.signup-panel h2{color:var(--green);font-size:clamp(18px,3vw,28px);line-height:1;margin:4px 0 0;text-shadow:0 0 10px rgba(32,210,75,.65)}.signup-panel form{display:grid;gap:10px;grid-template-columns:minmax(0,1fr) auto}.signup-panel input{background:#030711;border:2px solid #173ea8;color:#fff;min-height:44px;min-width:0;padding:8px 12px;text-transform:none}.signup-panel input:focus{border-color:var(--blue-hot);outline:none;box-shadow:0 0 12px #13a4ff73}.signup-panel p{color:var(--gold);grid-column:1 / -1;margin:0;min-height:1.25em;text-align:right;text-shadow:0 0 8px rgba(255,191,49,.45)}.secret-coop{background:transparent;border:0;color:#ffffff8f;cursor:pointer;display:block;font-size:clamp(12px,1.8vw,16px);letter-spacing:0;margin:12px auto 0;padding:8px 10px;text-align:center;text-shadow:0 0 8px rgba(19,164,255,.2);text-transform:uppercase}.secret-coop:hover,.secret-coop:focus-visible{color:var(--gold);outline:none;text-shadow:0 0 12px rgba(255,191,49,.65)}body.co-op-on .secret-coop{display:none}.sr-only{clip:rect(0,0,0,0);border:0;height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;white-space:nowrap;width:1px}@media(max-width:720px){body{align-items:start;padding:10px}.hud{grid-template-columns:1fr 1fr}.brand{grid-column:1 / -1;grid-row:1;min-width:0}.hud>div:first-child,.hud>div:last-child{grid-row:2}.hud>div:first-child{grid-column:1 / -1;justify-items:center;text-align:center}.hud>div:last-child{display:none}.controls{grid-template-columns:1fr 1fr}.controls span{grid-column:1 / -1;justify-self:center;text-align:center}.mobile-high-score{display:flex}.touch-controls{align-items:end;display:grid;gap:14px;grid-template-columns:minmax(220px,360px);justify-content:center;margin-top:12px}body.co-op-on .touch-controls{grid-template-columns:repeat(2,minmax(0,1fr));justify-items:stretch}body.co-op-on .touch-controls>.touch-pad{max-width:none}body.co-op-on .touch-controls>.touch-pad:not(.touch-pad-p2) button{font-size:26px;min-height:54px}.signup-panel,.scoreboard-panel{grid-template-columns:1fr}.initials-form{grid-template-columns:1fr auto auto}.initials-form p{grid-column:1 / -1;text-align:left}.signup-panel form{grid-template-columns:1fr}.signup-panel p{text-align:left}}@media(pointer:coarse){.touch-controls{align-items:end;display:grid;gap:14px;grid-template-columns:minmax(220px,360px);justify-content:center;margin-top:12px}body.co-op-on .touch-controls{grid-template-columns:repeat(2,minmax(0,1fr));justify-items:stretch}body.co-op-on .touch-controls>.touch-pad{max-width:none}body.co-op-on .touch-controls>.touch-pad:not(.touch-pad-p2) button{font-size:26px;min-height:54px}}@media(max-width:420px){.touch-controls{gap:8px;grid-template-columns:minmax(0,1fr)}.touch-pad{gap:8px;grid-template-columns:repeat(3,minmax(54px,1fr));max-width:320px}.touch-controls button{min-height:54px}body.co-op-on .touch-controls{grid-template-columns:repeat(2,minmax(0,1fr))}body.co-op-on .touch-pad{gap:5px;grid-template-columns:repeat(3,minmax(0,1fr))}body.co-op-on .touch-controls button{font-size:20px;min-height:42px}body.co-op-on .touch-controls>.touch-pad:not(.touch-pad-p2) button{font-size:22px;min-height:46px}}
