/* The mini-game never touches the site's color-theme storage or affiliate UI. */
.runner-section { padding:42px 0 58px; }
.runner-heading { display:flex; justify-content:space-between; align-items:end; gap:28px; margin-bottom:24px; }
.runner-heading h2 { margin:11px 0 0; font-size:clamp(28px,3.5vw,43px); letter-spacing:-.04em; }
.runner-heading>p { font:13px/1.65 var(--sans); color:var(--muted); }
.runner-shell { background:#101218; color:#f4f4f6; border:1px solid #383b44; border-radius:10px; overflow:hidden; box-shadow:7px 7px 0 var(--action); margin-right:7px; scroll-margin-top:96px; }
.runner-hud { min-height:65px; padding:13px 22px; display:flex; align-items:center; gap:22px; background:#17191f; border-bottom:1px solid #333640; }
.runner-level { display:flex; gap:11px; align-items:center; font:600 12px var(--mono); flex-shrink:0; }
.runner-speed[hidden] { display:none; }
.runner-dot { background:#fa354e; width:7px; height:7px; transform:rotate(45deg); }
.runner-speed { color:#ff7182; border:1px solid #593440; border-radius:4px; padding:4px 7px; }
.runner-score { margin-left:auto; display:flex; gap:8px; align-items:center; color:#b8bdca; font:11px var(--mono); }
.runner-score strong { font:700 24px var(--mono); color:#fff; min-width:48px; }
.runner-score progress { width:75px; height:5px; border:0; border-radius:5px; margin-left:9px; background:#363944; accent-color:#ff3953; overflow:hidden; }
.runner-score progress::-webkit-progress-bar { background:#363944; }
.runner-score progress::-webkit-progress-value { background:#ff3953; }
.runner-score progress::-moz-progress-bar { background:#ff3953; }
.runner-pause,.runner-fullscreen { min-height:36px; border:1px solid #444854; border-radius:5px; background:transparent; color:#e2e4eb; padding:6px 11px; font:12px var(--sans); cursor:pointer; }
.runner-pause:disabled { cursor:default; opacity:.4; }
.runner-pause:hover:not(:disabled),.runner-fullscreen:hover { border-color:#ff5365; }
.runner-stage { position:relative; aspect-ratio:1000/420; min-height:310px; background:#101218; isolation:isolate; }
.runner-canvas { display:block; width:100%; height:100%; position:absolute; inset:0; touch-action:manipulation; cursor:pointer; -webkit-user-select:none; user-select:none; outline-offset:-4px!important; }
.runner-canvas:focus-visible { outline:3px solid #ff5365; }
.runner-overlay { position:absolute; inset:0; display:grid; place-items:center; padding:24px; background:linear-gradient(90deg,#090a10d4,#1010188f); z-index:2; }
.runner-overlay[hidden] { display:none; }
.runner-dialog { width:min(540px,100%); text-align:center; }
.runner-dialog h3 { font:750 clamp(24px,3vw,38px)/1.13 var(--sans); letter-spacing:-.04em; margin:13px 0; color:#fff; }
.runner-dialog h3[hidden],.runner-dialog p[hidden],.runner-next[hidden] { display:none; }
.runner-next-world { display:inline-block; padding:11px 15px; border:1px solid #555967; color:#fff; font-size:18px; }
.runner-ludoman-copy { color:#fff!important; font-size:19px!important; font-weight:700; }
[data-runner][data-phase="complete"] .runner-dialog h3 { font-size:clamp(28px,3.3vw,42px); line-height:1.12; }
.runner-dialog p { font:13px/1.65 var(--sans); color:#c2c7d3; margin:12px auto; max-width:500px; }
.runner-overline { font:10px var(--mono); color:#ff6b7d; letter-spacing:.08em; text-transform:uppercase; }
.runner-next { display:block; font:600 12px/1.6 var(--mono); color:#fff; margin:15px 0 14px; }
.runner-start { display:inline-flex; align-items:center; justify-content:center; min-height:45px; min-width:160px; padding:12px 22px; border:1px solid #ef2740; background:#d91832; color:#fff; font:650 13px var(--sans); border-radius:5px; cursor:pointer; }
.runner-start:hover { background:#b8152b; border-color:#ff5365; }
.runner-secondary { display:block; margin:13px auto 0; background:transparent; color:#d7dae3; padding:7px 10px; font:12px var(--sans); border:1px solid #5a5e69; border-radius:4px; cursor:pointer; }
.runner-secondary[hidden] { display:none; }
.runner-revive { display:block; width:min(230px,100%); margin:10px auto 0; padding:10px 16px 8px; border:1px solid #f05a6b; border-radius:5px; background:#29151a; color:#fff; font:700 13px/1.2 var(--sans); cursor:pointer; }
.runner-revive span { display:block; margin-top:4px; color:#ffb1bc; font:10px/1.2 var(--mono); font-weight:400; }
.runner-revive:hover { background:#5b1625; border-color:#ff8795; }
.runner-revive[hidden] { display:none; }
.runner-mode { display:block; margin:12px auto 0; padding:9px 15px; max-width:100%; border:1px solid #545966; border-radius:5px; background:#17191fe6; color:#f5f5f8; font:600 12px/1.4 var(--sans); cursor:pointer; }
.runner-mode span { display:block; font-size:10px; font-weight:400; color:#bfc4cf; margin-top:2px; }
.runner-mode:hover { border-color:#ff5365; }
.runner-mode[hidden],.runner-score progress[hidden],.runner-score [hidden] { display:none; }
.runner-shield-icon { display:block; width:20px; height:24px; background:linear-gradient(125deg,#ffb1bc,#e52a47 48%,#7e172a); border:1px solid #ffb3c1; clip-path:polygon(50% 0,100% 19%,89% 67%,72% 88%,50% 100%,28% 88%,11% 67%,0 19%); }
[data-runner][data-mode="endless"] .runner-score strong { font-size:clamp(16px,2vw,24px); }
.runner-dialog .runner-save-note { font:10px/1.55 var(--mono); color:#b4baca; margin-top:14px; max-width:380px; }
.runner-footer { display:flex; justify-content:space-between; align-items:center; gap:18px; padding:11px 20px; background:#17191f; border-top:1px solid #333640; }
.runner-footer p { color:#b4bac8; font:11px/1.6 var(--sans); }
.runner-footer p>span { margin:0 8px; }
.runner-footer kbd { background:#262934; color:#f4f4f6; border:1px solid #484b59; border-radius:4px; padding:3px 7px; font:10px var(--mono); }
.runner-fullscreen { border:0; padding:4px; font-size:11px; flex-shrink:0; }
.runner-boost-indicator { position:absolute; top:16px; left:16px; z-index:1; background:#17191fea; color:#fff; border:1px solid #ff7182; border-radius:5px; padding:8px 11px; font:600 11px var(--mono); pointer-events:none; }
.runner-boost-indicator[hidden] { display:none; }
.runner-help { border-bottom:1px solid var(--line); margin-top:20px; padding:17px 0; }
.runner-help>summary { font:600 13px var(--sans); color:var(--muted); }
.runner-guide-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:20px; margin:24px 0; }
.runner-guide-grid>div { background:var(--paper-2); border:1px solid var(--line); border-radius:6px; padding:18px; }
.runner-guide-grid img { display:block; margin-bottom:18px; height:74px; width:100px; object-fit:contain; }
.runner-guide-grid h3 { font-size:16px; line-height:1.25; margin-bottom:8px; }
.runner-help p,.runner-help li { font:13px/1.65 var(--sans); color:var(--muted); margin-top:8px; }
.runner-help ul { margin:15px 0; padding-left:20px; }
.runner-noscript { padding:16px; background:var(--notice-bg); color:var(--notice-fg); }
.runner-confetti { position:fixed; inset:0; width:100%; height:100%; pointer-events:none; z-index:999; }
.runner-shell:fullscreen { width:100vw; height:100dvh; min-height:0; margin:0; border:0; border-radius:0; display:flex; flex-direction:column; justify-content:stretch; overflow:hidden; background:#080a0e; box-shadow:none; }
.runner-shell:fullscreen .runner-hud,.runner-shell:fullscreen .runner-footer { flex:0 0 auto; }
.runner-shell:fullscreen .runner-stage { flex:1 1 auto; width:100%; height:auto; aspect-ratio:auto; min-height:0; overflow:hidden; position:relative; }
.runner-shell:fullscreen .runner-canvas { width:100%; height:100%; }
.runner-shell:fullscreen .runner-overlay { background:#0b0d13bb; }
.runner-shell:fullscreen .runner-confetti { position:absolute; }
@media(max-width:850px) {
  .runner-heading { align-items:start; }
  .runner-hud { gap:14px; padding:11px 16px; }
  .runner-score progress { display:none; }
  .runner-stage { min-height:360px; }
  .runner-guide-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media(max-width:540px) {
  .runner-section { padding:32px 0 40px; }
  .runner-heading { display:block; }
  .runner-heading>p { margin-top:12px; font-size:12px; }
  .runner-heading>p br { display:none; }
  .runner-shell { box-shadow:4px 4px 0 var(--action); margin-right:4px; }
  .runner-hud { padding:10px 12px; gap:8px; flex-wrap:wrap; }
  .runner-level { font-size:10px; gap:6px; }
  .runner-dot { width:5px; height:5px; }
  .runner-speed { padding:3px 5px; }
  .runner-score { font-size:9px; gap:5px; }
  .runner-score strong { font-size:20px; min-width:36px; }
  .runner-score>span:first-child { display:none; }
  .runner-pause { font-size:10px; padding:5px 7px; min-height:33px; }
  .runner-stage { aspect-ratio:auto; height:360px; min-height:360px; }
  .runner-overlay { padding:21px 16px; }
  .runner-dialog { max-height:100%; overflow-y:auto; overscroll-behavior:contain; scrollbar-width:thin; }
  .runner-dialog h3 { font-size:28px; margin:8px 0; }
  .runner-dialog p { font-size:12px; margin:8px auto; }
  .runner-dialog .runner-save-note { font-size:9px; }
  .runner-overline { font-size:9px; }
  .runner-next { font-size:11px; margin:8px 0; }
  .runner-start { min-height:40px; padding:9px 18px; }
  .runner-revive { margin-top:8px; padding:8px 13px 7px; }
  .runner-mode { margin-top:8px; padding:7px 11px; }
  .runner-secondary { margin-top:8px; }
  .runner-footer { align-items:start; gap:9px; padding:11px 12px; }
  .runner-footer p { font-size:10px; }
  .runner-footer p>span { margin:0 4px; }
  .runner-fullscreen { font-size:10px; }
  .runner-guide-grid { gap:10px; }
  .runner-guide-grid>div { padding:13px; }
  .runner-guide-grid h3 { font-size:14px; }
  .runner-help p,.runner-help li { font-size:12px; }
}
@media(prefers-reduced-motion:reduce) {
  .runner-start,.runner-pause { transition:none; }
}