@import url('https://fonts.googleapis.com/css2?family=Barlow+Condensed:wght@600;700;800&family=DM+Sans:wght@400;500;600;700&family=IBM+Plex+Mono:wght@400;500;600&display=swap');

:root{color-scheme:dark;--bg:#101a1a;--ink:#ebeee6;--muted:#7c8a83;--line:#2d3934;--lime:#d4ed8a;--mono:'IBM Plex Mono',monospace}
*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--ink);font-family:'DM Sans',sans-serif}body:before{content:'';position:fixed;inset:0;pointer-events:none;opacity:.035;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Cpath fill='%23fff' filter='url(%23n)' opacity='.6' d='M0 0h180v180H0z'/%3E%3C/svg%3E")}
main{max-width:1600px;margin:auto;padding:0 48px}.masthead{height:108px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line)}.wordmark{text-decoration:none;color:var(--ink);font-size:20px;font-weight:700;letter-spacing:-.5px;display:flex;align-items:center;gap:11px}.mark{font-size:38px;color:var(--lime);line-height:1}.edition{font:10px var(--mono);color:var(--muted);margin:4px 0 0 7px}.masthead-note,.utility{font:10px var(--mono);letter-spacing:1.1px}.masthead-note{color:#a3ada4;display:flex;align-items:center;gap:9px}i{display:inline-block}.masthead-note i,.arena-footer i{width:5px;height:5px;border-radius:50%;background:var(--lime)}button{cursor:pointer}button:focus-visible,a:focus-visible,canvas:focus-visible{outline:2px solid var(--lime);outline-offset:5px}.utility{background:none;border:1px solid #3b4740;color:#b9c2b6;padding:11px 13px}.utility span{margin-left:15px}.game-layout{min-height:730px;display:grid;grid-template-columns:270px minmax(350px,1fr) 190px;gap:38px;align-items:center;padding:52px 0 58px}.eyebrow{font:9px var(--mono);letter-spacing:1.1px;color:#a5b0a6}.intro>.eyebrow{font-size:8px;white-space:nowrap;display:flex;align-items:center;gap:8px}.tiny-line{width:15px;height:1px;background:var(--lime)}h1{font-family:'Barlow Condensed','Arial Narrow',Impact,sans-serif;font-size:90px;line-height:.95;letter-spacing:-2px;font-weight:700;margin:24px 0}h1>span{color:var(--lime)}.intro>p{font-size:12px;line-height:1.95;color:#9da99e;margin:0}.flight-status{font:9px var(--mono);letter-spacing:1px;display:flex;align-items:center;gap:8px;margin-top:29px;color:var(--lime)}#status-light{width:6px;height:6px;background:var(--lime);border-radius:50%}.controls{display:flex;flex-direction:column;align-items:center;width:110px;margin-top:43px;gap:4px}.arrow-key{border:1px solid #526050;border-bottom:3px solid #526050;border-radius:4px;width:31px;height:29px;display:inline-flex;align-items:center;justify-content:center;color:#c4cdbf;font-size:16px}.key-row{display:flex;gap:4px}.control-caption{font:8px var(--mono);white-space:nowrap;letter-spacing:.6px;margin-top:11px;color:#8b988d}.shortcuts{display:flex;flex-direction:column;gap:10px;margin-top:24px;font:8px var(--mono);color:#7c897f;letter-spacing:.6px}kbd{font:8px var(--mono);border:1px solid #39473d;border-radius:2px;padding:3px 5px;color:#abb6a6;margin-right:7px}.arena-column{min-width:0;max-width:700px;width:100%;justify-self:center}.arena-label,.arena-footer{display:flex;justify-content:space-between;font:8px var(--mono);letter-spacing:1px;color:#a4b19f}.muted,#coordinates{color:#697a6c}.arena-label{padding:0 9px 22px}.arena-wrap{position:relative;aspect-ratio:1;border:1px solid #4a5943;border-radius:50%;box-shadow:0 0 0 8px var(--bg),0 0 0 9px #29362d;background:#15221d}canvas{width:100%;height:100%;display:block;border-radius:50%;outline:none}.compass{position:absolute;font:8px var(--mono);color:#839275;background:var(--bg);padding:3px;pointer-events:none}.north{top:-14px;left:calc(50% - 6px)}.south{bottom:-14px;left:calc(50% - 6px)}.west{left:-14px;top:calc(50% - 8px)}.east{right:-14px;top:calc(50% - 8px)}.overlay{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;flex-direction:column;border-radius:50%;background:radial-gradient(ellipse,#15221de8 0%,#15221d9c 43%,transparent 72%);text-align:center;padding:25px}.overlay.hidden{display:none}.overlay-kicker{font:8px var(--mono);letter-spacing:1.6px;color:var(--lime);margin-top:44px}.overlay h2{font-family:'Barlow Condensed','Arial Narrow',Impact,sans-serif;font-size:42px;font-weight:600;letter-spacing:-.6px;margin:13px 0 9px}.overlay p{font-size:11px;color:#a3b39d;line-height:1.6;margin:0 0 24px}.primary{font:10px var(--mono);font-weight:600;letter-spacing:1px;border:0;background:var(--lime);color:#1c2b19;padding:17px 25px;min-width:170px;transition:background .2s,transform .2s}.primary:hover{background:#e6ffab;transform:translateY(-2px)}.primary span{margin-left:30px;font-size:16px}.overlay-hint{font:8px var(--mono);color:#7a8c73;letter-spacing:1px;margin-top:15px}.arena-footer{font-size:7px;letter-spacing:.7px;margin-top:28px;color:#7c8b77}.arena-footer>span:first-child{display:flex;align-items:center;gap:7px}.arena-footer i{width:4px;height:4px;background:#7d9769}.instrument-panel{padding-left:4px}.instrument{border-bottom:1px solid var(--line);padding:0 0 27px;margin-bottom:26px}.time{font:56px 'Barlow Condensed','Arial Narrow',Impact,sans-serif;letter-spacing:-1px;margin:8px 0}.unit{font:16px var(--mono);color:#748374;margin-left:5px}.instrument-note{font:7px var(--mono);letter-spacing:.6px;color:#6e7d70}.best-time{font:37px 'Barlow Condensed','Arial Narrow',Impact,sans-serif;color:var(--lime);margin:10px 0}.best-time .unit{font-size:13px}.star{color:var(--lime);font-size:13px;margin-right:3px}.flight-tip{margin-top:28px;border-left:1px solid #475540;padding-left:14px}.flight-tip>span{font:7px var(--mono);color:#6e806b;letter-spacing:1px}.flight-tip p{font-size:11px;line-height:1.8;color:#9aa792;margin:9px 0 0}.page-footer{border-top:1px solid var(--line);display:flex;justify-content:space-between;align-items:center;height:72px;font:8px var(--mono);letter-spacing:1px;color:#6e7c72}.footer-star{font-size:20px;margin-left:15px;color:#a1af94;vertical-align:middle}.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0)}.touch-controls{display:none}
@media(min-width:1450px){.game-layout{grid-template-columns:295px minmax(350px,1fr) 210px;gap:54px;min-height:810px}h1{font-size:106px}}
@media(max-width:1100px){main{padding:0 28px}.game-layout{grid-template-columns:210px minmax(300px,1fr) 140px;gap:24px;min-height:650px}h1{font-size:75px}.intro>.eyebrow{font-size:6px}.overlay h2{font-size:34px}.overlay p{font-size:10px}.time{font-size:47px}.instrument-note{font-size:6px}.arena-footer{font-size:6px;letter-spacing:0}}
@media(max-width:800px){main{padding:0 24px}.masthead{height:80px}.masthead-note{display:none}.game-layout{grid-template-columns:minmax(0,1fr);padding-top:28px;gap:28px}.intro{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap}.intro>.eyebrow{width:100%;font-size:7px}h1{font-size:55px;line-height:1;margin:15px 0}h1 br{display:none}.intro>p{font-size:10px;line-height:1.6}.intro .controls,.shortcuts,.flight-status{display:none}.arena-column{max-width:530px;grid-row:3}.instrument-panel{display:grid;grid-template-columns:1fr 1fr;gap:22px;padding:0}.instrument{margin:0;padding:0 0 12px;border-bottom:0}.instrument .eyebrow{font-size:8px;letter-spacing:.5px}.time,.best-time{font-size:37px;margin:6px 0}.instrument-note{font-size:6px}.flight-tip{display:none}.arena-label{font-size:7px}.arena-footer{font-size:7px}.overlay h2{font-size:42px}.overlay p{font-size:11px}.page-footer{font-size:6px}.touch-controls{display:flex;justify-content:center;gap:12px;margin-top:25px}.touch-controls button{touch-action:none;user-select:none;background:#223126;border:1px solid #475c3d;color:var(--lime);border-radius:8px;width:55px;height:47px;font-size:23px}}
.arena-wrap{background:var(--arena-bg,#15221d);border-color:var(--arena-rim,#4a5943)}
.overlay{background:radial-gradient(ellipse,var(--overlay-center,#15221de8) 0%,var(--overlay-edge,#15221d9c) 43%,transparent 72%)}

.compass{color:var(--threat-color,var(--lime))}
@media(prefers-reduced-motion:reduce){.primary{transition:none}}

/* Let the arena occupy the space previously used by the introductory copy. */
.flight-record{border-bottom:1px solid var(--line);padding-bottom:24px}
.flight-record dl{display:flex;flex-direction:column;gap:12px;margin:17px 0}
.flight-record dl>div{display:flex;align-items:baseline;justify-content:space-between;gap:12px}
.flight-record dt{font-size:10px;color:#a5b0a6}
.flight-record dd{margin:0;font:21px 'Barlow Condensed','Arial Narrow',Impact,sans-serif;color:var(--ink);font-variant-numeric:tabular-nums}
.flight-record #success-count{color:var(--lime)}
@media(max-width:800px){.flight-record{grid-column:1/-1;padding-bottom:16px}.flight-record dl{flex-direction:row;gap:28px;margin:10px 0}.flight-record dl>div{flex:1}}
.victory-emblem,.victory-stat,.victory-burst{display:none}
.overlay.victory{overflow:hidden;background:radial-gradient(ellipse,#101c27dd 0%,#101c2780 52%,transparent 78%)}
.overlay.victory>:not(.victory-burst){position:relative;z-index:1}
.victory .victory-emblem{display:block;color:#e7f6b3;font-size:46px;line-height:1;text-shadow:0 0 25px #d4ed8a66;margin-bottom:18px}
.victory .overlay-kicker{margin-top:0;color:#e6d4a0;font-size:8px;letter-spacing:1.5px}
.victory h2{font-size:clamp(34px,4.5vw,62px);line-height:1.05;color:#f3f8df;margin:15px 0}
.victory p{white-space:pre-line;color:#c1d2ce;line-height:1.8;margin-bottom:16px}
.victory .victory-stat{display:block;font:8px var(--mono);letter-spacing:1px;color:var(--lime);margin-bottom:24px}
.victory .primary{background:#e4f5a8;box-shadow:0 0 26px #d4ed8a20}
.victory .victory-burst{display:block;position:absolute;inset:0;pointer-events:none;z-index:0}
.victory-burst i{position:absolute;left:50%;top:43%;width:4px;height:8px;background:var(--spark);opacity:0;border-radius:1px;animation:arrival-spark 2.8s var(--delay) ease-out both}
@keyframes arrival-spark{0%{opacity:0;transform:translate(0,0) scale(.2)}12%{opacity:1}70%{opacity:.8}100%{opacity:0;transform:translate(var(--x),var(--y)) rotate(var(--spin)) scale(.6)}}
@media(max-width:480px){.victory .victory-emblem{font-size:28px;margin-bottom:10px}.victory .overlay-kicker{font-size:6px;letter-spacing:.8px}.victory h2{font-size:32px;margin:10px 0}.victory p{font-size:9px;margin-bottom:10px}.victory .victory-stat{font-size:6px;letter-spacing:.4px;margin-bottom:14px}.victory .primary{padding:12px 18px}.victory .overlay-hint{font-size:7px;margin-top:10px}}
@media(prefers-reduced-motion:reduce){.victory-burst i{animation:none}}

.mission-goal{font:8px var(--mono);letter-spacing:1px;color:#a5b0a6;display:flex;flex-direction:column;gap:8px;margin-bottom:25px}
.mission-goal span{color:var(--lime);font-size:10px}
@media(max-width:800px){.mission-goal{grid-column:1/-1;flex-direction:row;align-items:center;justify-content:space-between;margin:0}}
.mode-hint{margin-top:9px}
.mode-picker{display:flex;flex-direction:column;gap:10px;margin-bottom:26px;font:9px var(--mono);letter-spacing:1px;color:#a5b0a6}
.mode-picker select{width:100%;padding:10px 12px;background:var(--bg);color:var(--ink);border:1px solid var(--arena-rim,#526050);border-radius:3px;font:12px var(--mono);cursor:pointer}
.mode-picker select:disabled{opacity:.6;cursor:default}
.mode-picker select:focus-visible{outline:2px solid var(--lime);outline-offset:3px}
#mode-note{font-size:8px;line-height:1.6;letter-spacing:0;color:#99a594}
@media(max-width:800px){.mode-picker{grid-column:1/-1;display:grid;grid-template-columns:auto 110px 1fr;align-items:center;margin:0;gap:12px}}
.wordmark{gap:12px}
.logo-mark{width:46px;height:46px;flex-shrink:0}
.logo-type{font-family:'Barlow Condensed','Arial Narrow',Impact,sans-serif;font-size:29px;font-weight:700;font-style:italic;letter-spacing:1.1px;line-height:1}
.logo-type>span{color:var(--lime)}
.footer-mark{vertical-align:middle;margin-left:14px;opacity:.7}
@media(max-width:480px){.wordmark{gap:8px}.logo-mark{width:36px;height:36px}.logo-type{font-size:24px;letter-spacing:.7px}}
.game-layout{grid-template-columns:minmax(0,1fr) 190px;gap:64px;max-width:1120px;margin:auto;min-height:0;padding:44px 0}
.arena-column{max-width:760px}
.instrument-panel>.flight-status{margin:0 0 32px;font-size:8px}
.flight-controls{display:flex;justify-content:center;flex-wrap:wrap;gap:18px;margin-top:28px;font:8px var(--mono);letter-spacing:.6px;color:#8b988d}
.flight-controls>span{white-space:nowrap}
@media(min-width:1450px){.game-layout{grid-template-columns:minmax(0,1fr) 210px;gap:72px}}
@media(max-width:1100px){.game-layout{grid-template-columns:minmax(0,1fr) 150px;gap:38px}}
@media(max-width:800px){.game-layout{grid-template-columns:minmax(0,1fr);gap:25px;padding:28px 0 36px}.arena-column{grid-row:2;max-width:530px}.instrument-panel{grid-row:1}.instrument-panel>.flight-status{display:none}.flight-controls{gap:12px;font-size:7px;margin-top:24px}}

.lab-link{display:inline-block;margin-top:24px;color:var(--lime);font:11px monospace;letter-spacing:1px}

.wingmate-picker{display:block;margin:24px 0;color:#8ee9f2;font:11px monospace;line-height:1.8}.wingmate-picker input{accent-color:#8ee9f2;margin-right:8px}.wingmate-picker span{display:block;color:var(--muted);font-size:10px;margin-top:8px}
.mission-goal #mission-goal-label{display:inline;color:inherit;font:inherit;letter-spacing:inherit;margin:0}
/* Respect mode-specific visibility even when layout rules set display. */
[hidden]{display:none!important}
.endless-result{display:flex;flex-direction:column;align-items:center;margin:4px 0 18px}
.endless-result-time{font:600 clamp(64px,9vw,116px)/.95 'Barlow Condensed','Arial Narrow',Impact,sans-serif;letter-spacing:-3px;color:var(--lime);font-variant-numeric:tabular-nums;text-shadow:0 0 32px #d4ed8a25}
.endless-result-unit{margin-top:12px;font:8px var(--mono);letter-spacing:2px;color:#b8c4ad}
.overlay.endless-over h2{font-size:clamp(24px,3.5vw,38px);margin-bottom:14px}
.overlay.endless-over .overlay-kicker{margin-top:0}
.overlay.endless-over p{margin-bottom:18px}
@media(max-width:480px){.endless-result{margin:2px 0 10px}.endless-result-time{font-size:64px}.endless-result-unit{font-size:7px;margin-top:7px}.overlay.endless-over h2{font-size:24px;margin:8px 0}.overlay.endless-over p{font-size:9px;margin-bottom:10px}.overlay.endless-over .primary{padding:12px 18px}.overlay.endless-over .overlay-hint{margin-top:9px;font-size:7px}}

/* Keep shared instruments anchored when mode-specific content changes. */
.game-layout{align-items:start}
.instrument-panel{align-self:start}
#mode-note{min-height:3.2em}
.mission-goal{min-height:44px}
.best-time{line-height:1.2;min-height:45px;font-variant-numeric:tabular-nums}
#best-note{display:block;min-height:18px}
#endless-average{margin-top:26px}
@media(max-width:800px){
  .mission-goal{min-height:32px}
  #endless-average{margin-top:0}
}

.time{white-space:nowrap}
.flight-target{font-size:14px;letter-spacing:0;margin-left:6px}

.record-count{white-space:nowrap}
.record-divider{color:var(--muted);font-size:16px}

.record-heading .landing-label{color:var(--lime)}
.record-heading .attempt-label{color:var(--ink)}
.record-heading .record-divider{font:inherit}
.flight-record .record-totals{margin:10px 0 17px}
.flight-record .record-totals dd{font-size:37px;line-height:1.2}

.flight-record .record-totals>div{min-width:0}
.flight-record .record-totals .record-count{width:100%;min-width:0;min-height:45px}
#record-values{display:inline-block;white-space:nowrap;line-height:1.2}
.record-count .record-divider{font-size:1em}
