@font-face{font-family:Pixelify;src:url("./fonts/pixelify.woff2") format("woff2");font-weight:700;font-display:swap}
@font-face{font-family:Space;src:url("./fonts/space-grotesk.woff2") format("woff2");font-weight:400 700;font-display:swap}
@font-face{font-family:Archivo;src:url("./fonts/archivo-black.woff2") format("woff2");font-weight:400;font-display:swap}
:root{color-scheme:dark;--bg:#10101a;--panel:#181725;--line:#2d2a3b;--text:#f7f3ef;--muted:#aaa4bf;--lime:#defc55;--purple:#afa1fd;--pix:Pixelify,"Courier New",monospace;--body:Space,system-ui,sans-serif}
*{box-sizing:border-box}
[hidden]{display:none!important}
html{scroll-behavior:smooth;scroll-padding:12px}
body{margin:0;min-width:280px;color:var(--text);font-family:var(--body);background:radial-gradient(ellipse at 50% -16%,#292039 0%,#151421 43%,var(--bg) 77%);min-height:100vh}
body::before{content:"";position:fixed;inset:0;pointer-events:none;background-image:radial-gradient(#9384b013 1px,transparent 1px);background-size:17px 17px;z-index:-1}
button,a{-webkit-tap-highlight-color:transparent}
button{font:inherit;color:inherit;cursor:pointer}
button:focus-visible,a:focus-visible{outline:2px solid #fff;outline-offset:3px}
a{color:inherit;text-decoration:none}
p,h1,h2{margin:0}
.page{max-width:1120px;margin:auto;padding:0 32px}
.masthead{display:flex;justify-content:space-between;align-items:center;min-height:68px;margin-bottom:8px;border-bottom:1px solid var(--line)}
.brand,.header-tag,.cabinet-id,.cabinet-foot,.page-foot{display:flex;align-items:center;gap:10px;font-size:12px;letter-spacing:.115em;font-weight:700}
.brand svg{width:25px;height:25px;color:var(--lime);flex:none}
.brand-suffix{color:var(--muted)}
.header-tag{color:#bbb1d2;font-size:10px;letter-spacing:.16em}
.header-tag i,.cabinet-id i,.cabinet-foot i{display:inline-block;width:7px;height:7px;background:var(--lime);box-shadow:0 0 9px #defc5550;vertical-align:1px;flex:none}
.cabinet{margin-top:24px;border:1px solid #3c374c;background:#181725;box-shadow:0 14px 50px #07071165}
.cabinet-top,.cabinet-foot{display:flex;justify-content:space-between;align-items:center;padding:0 13px 0 16px;min-height:48px;color:#cbc4dc}
.cabinet-id{font-size:11px}
.cabinet-id i{width:6px;height:6px;background:#af99ff;box-shadow:0 0 8px #af99ff75}
.cabinet-id b{color:#ab9cf4;margin-left:-4px}
.cabinet-actions{display:flex;align-items:center;gap:7px}
.icon-btn{display:grid;place-items:center;background:#201e30;border:1px solid #3a344c;border-radius:3px;width:30px;height:29px;color:#dcd4ef;padding:0}
.icon-btn svg{width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:1.55;stroke-linecap:square;stroke-linejoin:round}
.icon-btn:disabled{opacity:.43;cursor:default}
.icon-btn:hover:enabled,.icon-btn[aria-pressed=true]{background:#302946;color:#fff4da}
#sound .mute-x,#sound[aria-pressed=true] .sound-waves{display:none}
#sound[aria-pressed=true] .mute-x{display:block}
#sound[aria-pressed=true] svg{border:0}
.screen{position:relative;width:100%;aspect-ratio:16/9;container-type:inline-size;background:#120e20;overflow:hidden;isolation:isolate;border-top:1px solid #3a2e45;border-bottom:1px solid #3a2e45}
#game{display:block;width:100%;height:100%;image-rendering:crisp-edges;image-rendering:pixelated}
.scanlines{position:absolute;inset:0;pointer-events:none;z-index:3;background:repeating-linear-gradient(transparent 0 3px,#0e061d24 3px 4px);opacity:.66}
.title-screen{position:absolute;inset:0;z-index:4;background:linear-gradient(90deg,#0e0b18f2 2%,#100b1bdf 26%,#160d23a0 50%,#0e091900 74%),linear-gradient(0deg,#120b1bbd,transparent 29%);display:flex;align-items:center;padding-left:5.5%}
.title-plate{margin-top:-.1cqw}
.eyebrow{color:var(--lime);letter-spacing:.19em;font-size:clamp(7px,1.16cqw,12px);font-weight:700;display:flex;align-items:center;gap:.75cqw}
.eyebrow span{width:.7cqw;height:.7cqw;background:var(--lime);display:inline-block;box-shadow:0 0 11px #defc5575}
.tagline{font-size:clamp(8px,1.65cqw,18px);color:#f0dfef;margin-top:2.15cqw;font-weight:500;letter-spacing:.025em}
.primary{display:flex;align-items:center;justify-content:space-between;gap:2.3cqw;border:0;background:var(--lime);color:#161821;font-family:var(--pix);font-weight:700;font-size:clamp(12px,2.18cqw,23px);padding:.77em .9em .7em;line-height:1;box-shadow:.38cqw .44cqw #747e32,.55cqw .64cqw #0a0714}
.primary:hover{background:#f0ff9a;transform:translateY(-1px)}
.primary:active{transform:translate(1px,2px);box-shadow:1px 1px #747e32}
.primary span{font-size:.6em}
#start{margin-top:2.8cqw}
.enter-cue{margin-top:1.25cqw;color:#c2b1cb;letter-spacing:.15em;font-weight:700;font-size:clamp(6px,1cqw,10px)}
.hero-stamp{position:absolute;right:3.25%;bottom:5.4%;color:#f2eaff;text-align:right;font-family:var(--pix);font-weight:700;font-size:clamp(9px,1.9cqw,19px);text-shadow:2px 2px #161224}
.hero-stamp span{color:var(--purple);display:block;font-family:var(--body);font-size:.52em;letter-spacing:.18em;padding-bottom:.24em}
.cabinet-foot{min-height:36px;font-size:10px;letter-spacing:.13em;color:#aaa4be}
.cabinet-foot i{width:5px;height:5px;margin-right:6px;background:var(--lime)}
.cabinet-foot b{color:#b9a5ff;margin:0 .5em;font-size:7px}
.field-guide{display:grid;grid-template-columns:1.13fr 1fr;gap:14px;margin-top:15px}
.guide-panel{border:1px solid var(--line);background:#171622}
.guide-panel h2{font:700 15px var(--pix);letter-spacing:.06em;padding:10px 13px;border-bottom:1px solid var(--line)}
.guide-panel h2 span{color:var(--purple);font:700 10px var(--body);margin-right:8px}
.guide-body{padding:11px 13px}
.controls-grid{display:grid;grid-template-columns:1.45fr 1fr;gap:8px 12px}
.controls-grid p,.fuel p{display:flex;align-items:center;gap:4px;color:#ded8e9;font-size:12px;white-space:nowrap}
.controls-grid small{font-size:9px;color:var(--muted);margin:0 1px}
.controls-grid p>span{margin-left:3px}
kbd{display:inline-grid;place-items:center;border:1px solid #3e3651;border-bottom:2px solid #524568;border-radius:2px;background:#252138;color:#eee1ff;min-width:18px;height:18px;padding:0 3px;font:700 10px var(--body)}
.fuel{display:flex;flex-wrap:wrap;gap:8px 13px;align-items:center}
.fuel p{gap:5px}
.fuel strong,.fuel small{display:block}
.fuel small{font-size:10px;color:var(--muted);margin-top:1px}
.food-icon{width:29px;height:29px;image-rendering:pixelated}
.page-foot{justify-content:space-between;border-top:1px solid var(--line);margin-top:18px;padding:13px 0 20px;color:#8d859f;font-size:9px}
.page-foot b{color:var(--lime)}
.hud{position:absolute;inset:0;z-index:2;pointer-events:none;font-family:var(--pix);font-weight:700;text-shadow:1px 2px #0d0a16;font-size:1.6cqw}
.hud-top{position:absolute;inset:3.4% 2.6% auto;display:grid;grid-template-columns:1fr 1fr 1fr;align-items:start;gap:2cqw}
.hud-player{display:flex;gap:.65cqw;min-width:0}
.hud-player canvas{width:4.7cqw;height:4.7cqw;background:#271d3b;outline:1px solid #9c7bb5;image-rendering:pixelated}
.hud-player>div{width:17.5cqw}
.hud-player p{line-height:1;margin:0 0 .42cqw;color:#fffbe6}
.meter{background:#261629;box-shadow:0 0 0 1px #291323,inset 0 0 0 1px #8c7189;overflow:hidden;height:1.05cqw;min-height:4px;margin-bottom:.43cqw}
.meter i{display:block;height:100%;width:100%;transform-origin:left center;background:linear-gradient(0deg,#e94e80 48%,#ffacb1 49%)}
.meter.energy{height:.68cqw;min-height:3px}
.meter.energy i{background:linear-gradient(0deg,#9cc52d 48%,#e9ff73 49%)}
.hud-stage{text-align:center}
.hud-stage span,.hud-score span{display:block;color:#d2b8e8;font-size:.76em;letter-spacing:.11em}
.hud-stage strong{color:#f1e3f2;white-space:nowrap;line-height:1.1}
.hud-score{text-align:right}
.hud-score strong{font-size:1.5em;color:#edf798;letter-spacing:.08em}
.combo,.go{position:absolute;right:4%;color:var(--lime);font-size:3cqw}
.combo{top:17%;color:#ffd776}
.go{top:46%;animation:nudge .75s alternate infinite ease-in-out;color:#e6fc70}
.go b{font-size:1.35em}
.announce{position:absolute;text-align:center;left:50%;top:26%;transform:translateX(-50%);width:90%;display:grid;gap:.35cqw}
.announce span{font-size:4.7cqw;line-height:.98;color:#fff2d8;text-shadow:2px 2px #752d68,3px 3px #130b1c}
.announce small{color:#e5b5df;font-size:1.8cqw}
.announce.shout span{font-size:5.4cqw;color:#ffb45e}
.boss-hud{position:absolute;inset:auto 12% 4%;text-align:center;color:#ffdbad}
.boss-hud .meter{margin-top:.25cqw;min-height:5px;box-shadow:0 0 0 1px #af5160}
.boss-hud .meter i{background:linear-gradient(0deg,#ce3a54 48%,#f87475 49%)}
.dialog{position:absolute;inset:0;z-index:5;display:grid;place-items:center;background:#0e091bd9}
.dialog-inner{display:grid;justify-items:center;text-align:center;padding:2cqw 5cqw}
.dialog-inner h2{font:700 8.3cqw/.95 var(--pix);color:#f9e9da;text-shadow:.4cqw .4cqw #5c2c61;margin:.65cqw 0}
.dialog-inner #dialog-copy{color:#d8cbe7;font-size:clamp(10px,2cqw,20px);margin:.8cqw 0 2.2cqw}
.text-btn{background:none;border:0;color:#d9c7e9;font-weight:700;font-size:clamp(8px,1.08cqw,12px);letter-spacing:.13em;margin-top:1.65cqw;padding:.5em}
.text-btn:hover{text-decoration:underline}
.touch{display:none}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.cabinet:fullscreen,.cabinet.expanded,.cabinet:-webkit-full-screen{margin:0;background:#0a0814;border:0;display:flex;flex-direction:column;align-items:center;justify-content:center}
.cabinet.expanded{position:fixed;inset:0;z-index:10}
.cabinet:fullscreen .screen,.cabinet.expanded .screen,.cabinet:-webkit-full-screen .screen{width:min(100vw,calc((100dvh - 68px) * 16 / 9))}
.cabinet:fullscreen .cabinet-top,.cabinet:fullscreen .cabinet-foot,.cabinet.expanded .cabinet-top,.cabinet.expanded .cabinet-foot{width:min(100vw,calc((100dvh - 68px) * 16 / 9));min-height:33px}
@keyframes nudge{to{transform:translateX(-.9cqw)}}
@media (max-width:800px){.page{padding-inline:17px}.masthead{min-height:55px}.cabinet{margin-top:15px}.field-guide{gap:9px}.controls-grid{grid-template-columns:1fr 1fr}}
@media (max-width:600px){.page{padding-inline:9px}.masthead{padding-inline:4px;min-height:48px}.brand{font-size:10px;gap:6px}.brand svg{width:20px;height:20px}.header-tag{font-size:8px;gap:5px}.cabinet{margin-top:12px}.cabinet-top{min-height:39px}.cabinet-foot{font-size:8px;min-height:33px}.cabinet-top,.cabinet-foot{padding-inline:8px}.cabinet-id{font-size:9px}.field-guide{grid-template-columns:1fr}.title-screen{padding-left:5%}.eyebrow{letter-spacing:.15em}.enter-cue{margin-top:1.6cqw}}
@media (pointer:coarse), (max-width:600px){.enter-cue{display:none}.touch{display:flex;justify-content:space-between;gap:6px;padding:9px;background:#171522;border-bottom:1px solid var(--line);touch-action:none;user-select:none}.touch-move,.touch-actions{display:grid;grid-template-columns:repeat(3,minmax(35px,54px));gap:4px}.touch-actions{grid-template-columns:repeat(2,minmax(49px,72px))}.touch button{min-height:39px;border:1px solid #53456e;color:#f2ddff;background:#28223a;font-size:12px;font-weight:700;border-radius:3px;padding:3px}.touch button.on{background:#dff66a;color:#171821}.touch-move button:first-child{grid-column:2}.touch-move button:nth-child(2){grid-column:1;grid-row:2}.touch-move button:nth-child(n+3){grid-row:2}.cabinet:fullscreen:has(.touch:not([hidden])) .screen,.cabinet.expanded:has(.touch:not([hidden])) .screen{width:min(100vw,calc((100dvh - 151px) * 16 / 9))}.cabinet:fullscreen .touch,.cabinet.expanded .touch{width:min(100vw,740px)}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.go{animation:none}.scanlines{display:none}}
.meter.energy.charged{box-shadow:0 0 0 1px #b5dc62,0 0 8px #c1f04770}

.touch button.charged:not(.on){color:#ecff9b;border-color:#a9c950;background:#354023}

.header-tag:hover{color:var(--lime)}
.flight-hud .hud-top{grid-template-columns:1fr 1.2fr 1fr}
.flight-counter span{display:block;color:#e6c1d7;letter-spacing:.13em;font-size:.76em}
.flight-counter strong{color:#ffc475;font-size:1.5em}
.screen.flight-active{touch-action:none}
.score-form{width:min(390px,76cqw);text-align:left;margin:0 0 2cqw}
.score-form label{display:block;font-size:clamp(10px,1.4cqw,14px);color:#efe4f8;margin-bottom:.4em}
.score-fields{display:flex;gap:7px;align-items:stretch}
.score-fields input{min-width:0;width:100%;padding:.45em .62em;font:inherit;font-size:clamp(16px,1.9cqw,18px);background:#211931;border:1px solid #7c649a;color:#fff}
.score-fields input:focus-visible{outline:2px solid var(--lime);outline-offset:1px}
.score-fields .primary{font-size:clamp(12px,1.9cqw,18px);padding:.6em .75em;white-space:nowrap}
.score-fields .primary:disabled{opacity:.65;cursor:default;transform:none}
#score-feedback{margin-top:.5em;color:#e6d9f6;font-size:clamp(10px,1.4cqw,14px)}
#score-feedback:empty{display:none}
.dialog.ending h2{font-size:clamp(17px,6.2cqw,70px)}
.dialog.ending #dialog-copy{margin:.5cqw 0 1.5cqw}
.dialog.ending .text-btn{margin-top:1cqw}
.leaderboard{margin-top:15px}
.leaderboard-header{display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid var(--line)}
.leaderboard-header h2{border-bottom:0}
#board-mode{padding-right:13px;color:var(--purple);font-size:10px;font-weight:700;letter-spacing:.1em}
.board-message{color:var(--muted);font-size:13px;padding:13px}
.score-table-wrap{overflow:auto}
.score-table{width:100%;border-collapse:collapse;text-align:left;font-size:13px}
.score-table th,.score-table td{padding:8px 13px;border-bottom:1px solid var(--line)}
.score-table tr:last-child td{border-bottom:0}
.score-table th{color:#c9badd;font-weight:600;white-space:nowrap}
.score-table th:nth-last-child(-n+2),.score-table td:nth-last-child(-n+2){text-align:right;font-variant-numeric:tabular-nums}
.score-table td:nth-child(3){color:var(--lime);font-weight:700}
@media(max-width:600px){
  .controls-grid p{white-space:normal}
  .controls-grid kbd{flex:none}
  .score-form{margin-bottom:1.2cqw}
  .dialog.ending .eyebrow{display:none}
  .dialog.ending .text-btn{margin-top:.35cqw}
  .score-table th,.score-table td{padding-inline:8px}
}

.game-logo{
  margin:2.2cqw 0 0;
  font:700 10.15cqw/.76 var(--pix);
  letter-spacing:-.055em;
}
.game-logo .orange-wordmark{
  display:inline-grid;
  place-items:center;
  width:32.8cqw;
  height:10cqw;
  background:linear-gradient(135deg,#ff6108,#f24c00);
  color:#fff3e3;
  box-shadow:.43cqw .52cqw #68243c,.65cqw .76cqw #100a17;
  vertical-align:top;
}
.orange-wordmark span{
  font:400 6.45cqw/.86 Archivo,"Arial Black",sans-serif;
  letter-spacing:-.07em;
  transform:skewY(-13deg);
  margin-right:.3cqw;
}
.game-logo strong{
  display:block;
  margin-top:1.05cqw;
  color:var(--lime);
  font-size:.9em;
  font-weight:700;
  text-shadow:.43cqw .52cqw #5a316b,.65cqw .76cqw #0b0713;
}

.dialog.ending{overflow:auto;align-items:safe center}
.dialog.ending .primary:focus-visible{outline-offset:2px}
