@font-face{font-family:Barlow;src:url('/assets/barlow-display.ttf') format('truetype');font-style:italic;font-weight:800;font-display:swap}@font-face{font-family:Barlow;src:url('/assets/barlow-semibold.ttf') format('truetype');font-style:normal;font-weight:600;font-display:swap}@font-face{font-family:Plex;src:url('/assets/plex-mono.ttf') format('truetype');font-style:normal;font-weight:400 700;font-display:swap}
:root{color-scheme:light;--paper:#f6f4eb;--ink:#203d33;--muted:#6d796b;--mono:Plex,monospace;--display:Barlow,'Arial Narrow',sans-serif;font-family:var(--mono);background:var(--paper);color:var(--ink)}*{box-sizing:border-box}body{margin:0;min-height:100svh}header{padding:30px 4.5vw}header a{display:inline-block}header img{display:block;width:116px;height:auto}main{min-height:calc(100svh - 100px);display:grid;place-items:center;padding:0 4.5vw 6vh}.game-stage{position:relative;width:100%;max-width:1160px;min-height:550px;outline:none;isolation:isolate;touch-action:manipulation}.game-stage.active{min-height:0;aspect-ratio:960/420;background:#f4efcf;box-shadow:0 0 0 1px #203d3320;overflow:hidden}#game-canvas{display:none;width:100%;height:100%;image-rendering:pixelated}.active #game-canvas{display:block}#effects-canvas{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;z-index:12;image-rendering:pixelated}.start-overlay{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:550px;text-align:center;padding:4px 0 12px}.start-overlay h1{font:italic 800 clamp(160px,19vw,230px)/.82 var(--display);letter-spacing:-.035em;margin:0 18px 15px 0}.start-overlay>p{font:600 26px/1 var(--display);text-transform:uppercase;letter-spacing:.16em;margin:0 0 0 .16em}#idle-horse{width:240px;height:230px;object-fit:contain;image-rendering:pixelated;margin:8px 0 17px}.start-overlay button{font-size:14px;padding:10px 16px;white-space:nowrap}.touch-prompt{display:none}button{font:inherit;border:0;background:none;color:inherit;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;gap:12px}button:hover{color:#507450}button:focus-visible,a:focus-visible{outline:2px solid #718758;outline-offset:4px}.game-stage:focus-visible{outline:none}kbd{font:inherit;border:1px solid #203d3340;border-bottom-width:2px;border-radius:3px;padding:3px 7px;font-size:.85em}.hud{position:absolute;inset:16px 22px auto;pointer-events:none;font:14px var(--mono)}.hud-top{display:flex;justify-content:space-between;align-items:center}.tools{display:flex;gap:5px;pointer-events:auto}.icon-button{width:32px;height:32px;padding:4px}.icon-button svg{display:block;overflow:visible}.scores{display:flex;gap:24px;align-items:center;letter-spacing:1px}.scores b{font-weight:500}.best{color:#657360}.token-count{color:#62743d}.hud-bottom{display:flex;justify-content:space-between;align-items:center;margin-top:11px}.stage-status{display:flex;align-items:baseline;gap:9px}.hud-label{text-transform:uppercase;font-size:10px;letter-spacing:1px;color:#687760}.stage-status strong{font:600 22px/1 var(--display);text-transform:uppercase;letter-spacing:.03em}.runway-status{width:180px}.runway-label{display:flex;justify-content:space-between;text-transform:uppercase;font-size:10px;letter-spacing:.6px;margin-bottom:6px}.runway-meter{height:5px;background:#203d331c;overflow:hidden}.runway-meter>span{display:block;width:100%;height:100%;background:#648052;transform-origin:left;transition:background .2s}.runway-status.low{color:#b45730}.runway-status.low .runway-meter>span{background:#c86c3b}.runway-status.extended .runway-meter>span{background:#a2b533}.play-controls{position:absolute;bottom:14px;left:22px;right:22px;display:flex;align-items:center;justify-content:space-between;font:12px var(--mono);color:#5b6a53}#rider-label strong{font-weight:600;color:#2c4739}.funding-controls{display:flex;align-items:center;gap:20px;pointer-events:auto}#gong-button{font:12px var(--mono);padding:6px 9px;gap:7px;min-width:128px;border:1px solid #84947166;background:#f6f4eb55;border-radius:3px}#gong-button kbd{padding:2px 5px}#gong-button[aria-disabled=true]{color:#67735b}.gong-symbol{font-size:24px;color:#947c44}#gong-button.ready{color:#253e29;background:#e8e6af;border-color:#9aab57}.ready .gong-symbol{color:#ad7624;animation:ready 1.8s ease-in-out infinite}.power-status{position:absolute;right:22px;bottom:16px;display:flex;gap:20px;pointer-events:none}.power-track{display:flex;align-items:center;gap:9px}.power-track img{object-fit:contain;width:36px;height:16px}#shield-status img{width:23px}.power-meter{width:110px;height:8px;background:#3c30282b;border:1px solid #3c302847;overflow:hidden}.power-meter>span{display:block;height:100%;width:100%;transform-origin:left;transition:transform 85ms linear}#ramp-fill{background:#e4f222}#shield-fill{background:#ec0000}.event-toast{position:absolute;top:109px;left:50%;transform:translateX(-50%);font:600 18px var(--display);text-transform:uppercase;letter-spacing:.07em;white-space:nowrap;color:#3f5c42}.modal-layer{position:absolute;inset:0;z-index:8;display:grid;place-items:center;background:#203d3314;backdrop-filter:blur(5px);-webkit-backdrop-filter:blur(5px)}.modal-card{width:340px;max-width:calc(100% - 44px);padding:28px 25px 25px;background:#f6f4ebf2;text-align:center;border:1px solid #809076;box-shadow:5px 5px 0 #203d3325}.modal-card>p:first-child{font:600 22px var(--display);text-transform:uppercase;letter-spacing:.08em;margin:0 0 5px}.modal-card h2{font:italic 800 72px/.95 var(--display);text-transform:uppercase;letter-spacing:-.025em;margin:0}.modal-card button{font-size:12px;margin-top:23px;gap:13px}.result-stage{font-size:11px;color:#6c7965;margin:15px 0 0}.record-banner{position:absolute;z-index:13;top:104px;left:50%;transform:translateX(-50%) rotate(-3deg);font:italic 800 36px var(--display);text-transform:uppercase;color:#203d33;background:#e6d892;padding:4px 20px;box-shadow:3px 3px 0 #203d33;white-space:nowrap;pointer-events:none}.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap}[hidden]{display:none!important}@keyframes ready{50%{opacity:.45}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important}}@media(max-width:650px){header{padding:26px 24px}header img{width:100px}main{padding:0 16px 6vh;min-height:calc(100svh - 85px)}.game-stage{min-height:490px}.start-overlay{min-height:490px}.start-overlay h1{font-size:172px}.start-overlay>p{font-size:22px}#idle-horse{width:220px;height:210px;margin:10px 0}.start-overlay button{font-size:12px}.game-stage.active{aspect-ratio:576/460}.hud{inset:10px 12px auto;font-size:11px}.scores{gap:12px;letter-spacing:0}.tools{gap:0}.icon-button{width:27px;height:30px}.hud-bottom{margin-top:5px}.hud-label{font-size:9px}.stage-status{gap:6px}.stage-status strong{font-size:19px}.runway-status{width:102px}.funding-controls{gap:8px}.runway-label{font-size:9px;margin-bottom:4px}.play-controls{bottom:10px;left:12px;right:12px;font-size:10px}.gong-symbol{font-size:19px}#gong-button{gap:4px;min-width:108px;padding:5px;font-size:10px}#gong-button kbd{padding:1px 4px}.power-status{bottom:34px;right:12px;gap:14px}.power-track{gap:6px}.power-track img{width:28px;height:12px}.power-meter{width:74px;height:7px}#shield-status img{width:18px}.event-toast{top:89px;font-size:14px}.modal-card{width:260px;padding:21px 16px}.modal-card h2{font-size:55px}.modal-card>p:first-child{font-size:18px}.modal-card button{font-size:10px;margin-top:20px}.record-banner{top:85px;font-size:26px;padding:3px 12px}}

.ended .record-banner{top:calc(50% - 145px)}@media(max-width:650px){.ended .record-banner{top:calc(50% - 129px)}}

.pause-copy{font:12px/1.65 var(--mono);max-width:245px;margin:17px auto 0;color:#65745f}.mechanical-key{display:inline-block;min-width:54px;padding:5px 8px;background:linear-gradient(#fffdf6,#eae8dd);border:1px solid #a6ad99;border-radius:4px;box-shadow:0 4px 0 #a5ad98,0 5px 2px #203d331c;animation:press-space 2.8s ease-in-out infinite}button:active .mechanical-key{animation:none;transform:translateY(4px);box-shadow:0 0 0 #a5ad98}@keyframes press-space{0%,30%,68%,100%{transform:translateY(0);box-shadow:0 4px 0 #a5ad98,0 5px 2px #203d331c}43%,55%{transform:translateY(4px);box-shadow:0 0 0 #a5ad98,0 1px 1px #203d331c}}@media(max-width:650px){.pause-copy{font-size:10px;max-width:215px;margin-top:13px}}@media(prefers-reduced-motion:reduce){.mechanical-key{animation:none}}


/* Runway belongs to the scoreboard; the gong stays immediately below it. */
.scoreboard{display:flex;align-items:center;gap:30px}.scoreboard .runway-status{width:150px}.scoreboard .runway-label{font-size:9px}.hud-bottom{margin-top:10px}
.modal-card:focus,.modal-card button:focus,.modal-card button:focus-visible{outline:none}.modal-card button,.modal-card button kbd{text-decoration:none}
.pause-card button{gap:10px}
@media(max-width:650px){.scoreboard{gap:14px}.scoreboard .runway-status{width:74px}.scoreboard .runway-label{font-size:8px;letter-spacing:0;margin-bottom:4px}.scoreboard .runway-meter{height:4px}.scores{gap:9px;font-size:10px}.hud-bottom{margin-top:9px}.pause-card button{gap:8px}}
@media(max-width:360px){.scoreboard{gap:9px}.scoreboard .runway-status{width:62px}.scores{gap:7px;font-size:9px}}

/* One top row for stage, runway, score and clearly labelled AI tokens. */
.hud-top{gap:20px}.stage-status{font:inherit;white-space:nowrap;letter-spacing:0}.scoreboard{gap:28px}.scores{gap:20px}.token-count{text-transform:uppercase}.hud-bottom{margin-top:7px}.hud-bottom .tools{margin-left:-4px}#gong-button{white-space:nowrap}#gong-charge{font-size:.9em}
@media(max-width:650px){.hud{font-size:10px}.hud-top{gap:10px}.stage-status{font:inherit}.scoreboard{gap:12px}.scoreboard .runway-status{width:64px}.scores{font-size:inherit;gap:9px}.hud-bottom{margin-top:8px}}
@media(max-width:360px){.hud{font-size:9px}.hud-top{gap:8px}.scoreboard{gap:9px}.scoreboard .runway-status{width:50px}.scores{gap:8px}.scores .best{display:none}}

.game-stage.active{color:var(--ink)}

/* Selected chrome bezel. The outer surround preserves the canvas dimensions. */
.game-frame{position:relative;width:100%;max-width:1160px;isolation:isolate}
.is-playing .game-frame::before{content:'';position:absolute;inset:-12px;z-index:-1;pointer-events:none;background:linear-gradient(135deg,#f4fbff 0%,#b3c2cc 21%,#536576 47%,#8295a8 52%,#d4dfe5 74%,#6c7f8e 100%);box-shadow:0 0 0 1px #50616a,0 12px 35px #0008}
.game-stage.active{box-shadow:0 0 0 2px #071912,0 0 0 5px #0eb588}
.hud{inset:14px 18px auto;font-size:12px}
.hud-top{display:flex;align-items:center;gap:18px}
.hud-left{display:flex;align-items:center;gap:12px}
.hud-left .tools{gap:2px}
.stage-status{font:inherit}
.scoreboard{gap:16px;margin-left:auto}
.scores{gap:14px;letter-spacing:.4px;font-size:inherit}
.scoreboard .runway-status{display:flex;align-items:center;gap:8px;width:auto}
.scoreboard .runway-label{display:block;font-size:10px;letter-spacing:.2px;margin:0}
.scoreboard .runway-meter{width:84px;height:14px;border:1px solid #62744b55}
.funding-controls{gap:0}
#gong-button{min-width:0;font-size:10px;gap:5px;padding:5px 7px}
#gong-button .gong-symbol{font-size:20px}
.power-status{left:50%;right:auto;bottom:16px;transform:translateX(-50%);gap:22px}
.power-track{gap:9px}.power-track img{width:42px;height:18px}#shield-status img{width:27px}
.power-meter{width:130px;height:14px}
.event-toast{top:70px;pointer-events:none}
.event-toast.power-toast{font:italic 800 38px/1 var(--display);letter-spacing:.015em;transform:translateX(-50%) rotate(-3deg);text-shadow:2px 2px 0 #fff8df,-1px -1px 0 #fff8df,3px 4px 0 #203d332b;animation:power-pop .35s cubic-bezier(.16,1.4,.3,1)}
.power-toast.ramp,.power-toast.funding{color:#335825}.power-toast.crowdstrike{color:#bf241d}
.event-toast .toast-detail{display:block;margin-top:.65em;font-size:.48em;letter-spacing:.06em}
.toast-exchange{display:flex;align-items:center;justify-content:center;gap:8px;margin-top:12px;font:600 11px/1 var(--mono);letter-spacing:.05em;text-shadow:none;transform:rotate(3deg)}.toast-exchange img{width:57px;height:23px;object-fit:contain}
.result-stage{line-height:1.6}
@keyframes power-pop{from{opacity:0;transform:translateX(-50%) translateY(12px) rotate(-7deg) scale(.72)}to{opacity:1;transform:translateX(-50%) translateY(0) rotate(-3deg) scale(1)}}
@media(max-width:1050px) and (min-width:651px){.hud{font-size:10px;inset:12px 14px auto}.hud-top{gap:12px}.hud-left{gap:6px}.scoreboard{gap:12px}.scores{gap:9px;letter-spacing:0}.scoreboard .runway-meter{width:60px}.scoreboard .runway-label{font-size:9px}.icon-button{width:26px}.tools{gap:0}#gong-button{font-size:9px}#gong-button kbd{display:none}}
@media(max-width:800px) and (min-width:651px){.scores .best{display:none}}
@media(max-width:650px){
  .hud{inset:9px 12px auto;font-size:10px}.hud-top{display:grid;grid-template-columns:1fr auto;gap:7px 8px}
  .hud-left{gap:6px;font-size:9px}.hud-left .tools{gap:0}.icon-button{width:23px;height:27px;padding:3px}
  .funding-controls{grid-column:2;grid-row:1;justify-self:end}
  #gong-button{font-size:8.5px;gap:4px;padding:4px 5px}#gong-button kbd{display:none}#gong-button .gong-symbol{font-size:16px}
  .scoreboard{grid-column:1 / -1;grid-row:2;width:100%;margin:0;justify-content:space-between;gap:12px}
  .scoreboard .runway-status{gap:7px}.scoreboard .runway-label{font-size:9px}.scoreboard .runway-meter{width:70px;height:12px}
  .scores{font-size:10px;gap:10px;letter-spacing:0}.scores .best{display:inline}
  .power-status{bottom:35px;gap:15px}.power-track{gap:6px}.power-track img{width:30px;height:14px}#shield-status img{width:21px}.power-meter{width:84px;height:13px}
  .event-toast{top:81px}.event-toast.power-toast{font-size:25px}
}
@media(max-width:360px){.hud-left{font-size:8.5px}.icon-button{width:22px}.scoreboard .runway-meter{width:63px}.scores{font-size:9px;gap:9px}.scores .best{display:none}.event-toast.power-toast{font-size:22px}}

/* Broadcast dialogs: the same chrome, emerald and headline type as the opening. */
.modal-layer{background:#06120e40;backdrop-filter:blur(5px);-webkit-backdrop-filter:blur(5px)}
.modal-card{width:408px;padding:25px 26px 22px;color:#eaf0f3;border:6px solid transparent;border-image:none;background:linear-gradient(145deg,#142820,#09130f) padding-box,linear-gradient(135deg,#f4fbff 0%,#b3c2cc 21%,#536576 47%,#8295a8 52%,#d4dfe5 74%,#6c7f8e 100%) border-box;box-shadow:inset 0 0 0 1px #0eb588,0 0 0 1px #50616a,0 12px 38px #0006;text-align:left}
#result-eyebrow{font:500 15px/1.3 RecordLaserFreeze,Arial,sans-serif;letter-spacing:.025em;margin:0;color:#79dfb8;text-transform:uppercase;text-align:center}
.result-metrics{display:flex;align-items:flex-start;justify-content:center;gap:28px;margin-top:21px}
.result-score{min-width:0;flex:0 0 auto}
.result-score,.result-tokens{text-align:left}
.metric-label{display:block;font:10px/1.2 var(--mono);text-transform:uppercase;letter-spacing:.08em;color:#9fb4ab;margin-bottom:8px}
.modal-card #result-title,.modal-card #result-tokens{font:500 42px/1.1 RecordLaserFreeze,Arial,sans-serif;letter-spacing:-.025em;font-variant-numeric:tabular-nums;margin:0;background:linear-gradient(#fbfdff,#a5b7ca);color:#e4ebf1;-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.result-tokens{flex:0 0 auto}
.modal-card .result-stage{font:500 12px/1.4 RecordLaserFreeze,Arial,sans-serif;text-transform:uppercase;letter-spacing:.015em;color:#a0c5b4;margin:17px 0 0;text-align:center}
.modal-card button{width:100%;margin:19px 0 0;padding:15px 0 0;border-top:1px solid #78928444;font:500 12px/1.4 RecordLaserFreeze,Arial,sans-serif;text-transform:uppercase;letter-spacing:.015em;color:#e8efed;gap:14px;justify-content:center}
.modal-card button:hover{color:#87e4be}
.modal-card button .mechanical-key{font:11px/1.2 var(--mono);text-transform:lowercase;color:#19382e;background:linear-gradient(#f2f6f8,#bfccd1);border-color:#82998e;box-shadow:0 4px 0 #728d7e,0 5px 2px #0004}
.pause-card{text-align:center}
.pause-card #pause-title{font:500 35px/1.1 RecordLaserFreeze,Arial,sans-serif;letter-spacing:.025em;color:#e4ebf1;background:linear-gradient(#fff,#a5b7ca);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.pause-card .pause-copy{font:12px/1.7 var(--mono);max-width:290px;color:#a2b9ad;margin:20px auto 0}
@media(max-width:650px){
  .modal-card{padding:16px 16px 15px;width:330px}
  #result-eyebrow{font-size:11px;letter-spacing:.015em}
  .result-metrics{margin-top:14px;gap:12px}
  .metric-label{font-size:8px;margin-bottom:6px}
  .modal-card #result-title,.modal-card #result-tokens{font-size:28px}
  .modal-card .result-stage{font-size:10px;margin-top:12px;line-height:1.5}
  .modal-card button{font-size:9px;gap:10px;margin-top:13px;padding-top:12px}
  .modal-card button .mechanical-key{font-size:10px;min-width:48px}
  .pause-card #pause-title{font-size:25px}
  .pause-card .pause-copy{font-size:10px;max-width:240px;margin-top:15px;line-height:1.6}
}
/* Keep dialog content from expanding the modal grid on narrow phones. */
.modal-layer{grid-template-columns:minmax(0,1fr);grid-template-rows:minmax(0,1fr)}
.modal-card{min-width:0;width:min(408px,calc(100% - 44px));max-width:none}
@media(max-width:650px){.modal-card{width:min(330px,calc(100% - 32px))}}

/* Input-aware prompts: touch and external keyboards can switch in the same session. */
.touch-ui .desktop-prompt{display:none}.touch-ui .touch-prompt{display:inline}
.desktop-prompt{align-items:center;gap:12px}.modal-card .desktop-prompt{display:inline-flex}
.touch-ui .modal-card .desktop-prompt{display:none}.touch-ui #gong-button kbd{display:none}
.touch-ui .jump-hint{margin-left:auto;color:#5b6a53;font-size:10px;white-space:nowrap}

/* Keep a held mobile jump from becoming a browser scroll gesture. */
.game-stage.active{touch-action:none}

/* Treat the viewer as a game surface on iOS, with selection kept available elsewhere. */
.game-frame,.game-frame *{-webkit-tap-highlight-color:transparent}
.game-stage,.game-stage *{-webkit-user-select:none;user-select:none;-webkit-touch-callout:none}
.game-stage{-webkit-text-size-adjust:100%;text-size-adjust:100%}
.game-stage img,.game-stage svg{-webkit-user-drag:none}

/* A charged gong is the primary action: raise a round and refill runway. */
#gong-button{min-height:44px;transition:background .2s,color .2s,box-shadow .2s}
#gong-label{font-weight:600}
#gong-button.ready{color:#302817;background:linear-gradient(#fff0aa,#f6ca58);border-color:#c18b19;box-shadow:0 0 0 3px #efbb4499,0 0 16px 5px #e8af3866,0 0 30px 8px #e8af3838;animation:gong-ready-glow 1.2s ease-in-out infinite}
#gong-button.ready .gong-symbol{color:#805417;animation:none;opacity:1}
#gong-button.ready kbd{border-color:#80541766;background:#fff4c055}
#gong-button.ready:hover{background:linear-gradient(#fff3c3,#ffd673);color:#302817}
@keyframes gong-ready-glow{0%,100%{box-shadow:0 0 0 3px #efbb4499,0 0 16px 5px #e8af3866,0 0 30px 8px #e8af3838}50%{box-shadow:0 0 0 4px #ffcc54cc,0 0 22px 7px #efb83399,0 0 38px 10px #efb83355}}
@media(max-width:650px){#gong-button{padding:5px 7px}}
@media(max-width:650px){
  .modal-card{width:min(310px,calc(100% - 32px));border-width:4px;padding:18px 18px 16px}
  .result-metrics{gap:20px;margin-top:18px}
  .result-score,.result-tokens{min-width:0;text-align:left}
  .metric-label{font-size:9px;letter-spacing:.06em;margin-bottom:7px}
  .modal-card #result-title,.modal-card #result-tokens{font-size:clamp(24px,7.7vw,32px);line-height:1.1;font-style:normal}
  .modal-card .result-stage{font-size:11px;margin-top:16px}
  .modal-card button{min-height:44px;font-size:10px;margin-top:16px;padding:12px 0 3px;gap:9px}
  .pause-card .pause-copy{margin-top:17px}
}
