:root, [data-theme="light"]{
  --color-bg:#f5f5f2; --color-surface:#ffffff; --color-surface-2:#fbfbf9; --color-surface-offset:#eeeeea;
  --color-divider:#dedcd4; --color-border:#d8d6cc;
  --color-text:#15170f; --color-text-muted:#5c5f52; --color-text-faint:#9a9c8e;
  --color-primary:#c8ff33; --color-primary-ink:#1c2010; --color-primary-hover:#b3e62b; --color-primary-highlight:#eaffb0;
  --color-success:#2f7a3a; --color-success-highlight:#d7ecd0;
  --color-warning:#a15c00; --color-warning-highlight:#fdf0d8;
  --radius-sm:0.375rem; --radius-md:0.625rem; --radius-lg:1rem; --radius-full:9999px;
  --shadow-sm:0 1px 2px rgba(21,23,15,.05); --shadow-md:0 6px 20px rgba(21,23,15,.08);
  --font-display:'Archivo','Helvetica Neue',sans-serif; --font-body:'General Sans','Helvetica Neue',sans-serif;
}
[data-theme="dark"]{
  --color-bg:#12130f; --color-surface:#191a14; --color-surface-2:#1e1f18; --color-surface-offset:#212217;
  --color-divider:#2c2d20; --color-border:#33341f;
  --color-text:#eceee2; --color-text-muted:#a2a493; --color-text-faint:#6d6f5f;
  --color-primary:#c8ff33; --color-primary-ink:#15170f; --color-primary-hover:#d6ff5c; --color-primary-highlight:#2b3418;
  --color-success:#7ec788; --color-success-highlight:#1e3122;
  --color-warning:#e0a752; --color-warning-highlight:#392c17;
  --shadow-sm:0 1px 2px rgba(0,0,0,.3); --shadow-md:0 6px 20px rgba(0,0,0,.4);
}
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0;}
html{-webkit-text-size-adjust:none;text-size-adjust:none;}
body{min-height:100dvh;font-family:var(--font-body);font-size:1rem;line-height:1.6;color:var(--color-text);background:var(--color-bg);}
a{color:inherit;text-decoration:none;}
.container{max-width:720px;margin-inline:auto;padding-inline:clamp(1rem,4vw,2.5rem);}
.topbar{border-bottom:1px solid var(--color-divider);}
.topbar-inner{max-width:1120px;margin-inline:auto;padding:0.9rem clamp(1rem,4vw,2.5rem);display:flex;align-items:center;justify-content:space-between;gap:1rem;}
.brand{display:flex;align-items:center;gap:0.6rem;font-family:var(--font-display);font-weight:800;font-size:1.15rem;letter-spacing:-0.02em;}
.brand svg{width:28px;height:28px;flex-shrink:0;}
.all-races-link{font-size:0.875rem;font-weight:700;color:var(--color-text-muted);}
.all-races-link:hover{color:var(--color-text);}
main.race-page{padding-block:2.5rem 3.5rem;}
.back-link{display:inline-block;font-size:0.8125rem;font-weight:700;color:var(--color-text-muted);margin-bottom:1.5rem;}
.back-link:hover{color:var(--color-text);}
.breadcrumbs{font-size:0.8125rem;color:var(--color-text-muted);margin-bottom:1.5rem;}
.breadcrumbs a{font-weight:700;}
.breadcrumbs a:hover{color:var(--color-text);text-decoration:underline;}
.breadcrumbs .sep{margin:0 0.35rem;color:var(--color-text-faint);}
.about-section{margin-bottom:1.8rem;}
.about-section h2{font-family:var(--font-display);font-size:1.05rem;font-weight:800;margin-bottom:0.6rem;}
.about-section p{font-size:0.9375rem;color:var(--color-text-muted);line-height:1.75;}
.race-flag{font-size:2rem;margin-bottom:0.5rem;}
h1{font-family:var(--font-display);font-size:clamp(1.6rem,1rem+2.5vw,2.4rem);font-weight:900;line-height:1.1;letter-spacing:-0.01em;margin-bottom:0.6rem;}
.race-meta{font-size:0.9375rem;color:var(--color-text-muted);margin-bottom:1.1rem;}
.pill-row{display:flex;flex-wrap:wrap;gap:0.4rem;margin-bottom:1.8rem;}
.pill{font-size:0.75rem;font-weight:700;padding:0.25rem 0.7rem;border-radius:var(--radius-full);}
.pill.half{background:var(--color-warning-highlight);color:var(--color-warning);}
.pill.full{background:var(--color-primary-highlight);color:color-mix(in oklab, var(--color-text) 80%, var(--color-primary-ink));}
.pill.other{background:var(--color-surface-offset);color:var(--color-text-muted);}
.info-grid{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-lg);padding:0.4rem 1.2rem;margin-bottom:1.5rem;}
.info-row{display:flex;justify-content:space-between;gap:1rem;padding:0.75rem 0;border-bottom:1px solid var(--color-divider);font-size:0.9rem;}
.info-row:last-child{border-bottom:none;}
.info-row .k{color:var(--color-text-muted);}
.info-row .v{font-weight:600;text-align:right;}
.provisional-note{background:var(--color-warning-highlight);color:var(--color-warning);font-size:0.8125rem;padding:0.7rem 0.9rem;border-radius:var(--radius-md);margin-bottom:1.5rem;}
.cta{display:flex;align-items:center;justify-content:center;gap:0.4rem;text-align:center;background:var(--color-primary);color:var(--color-primary-ink);font-weight:800;padding:0.9rem;border-radius:var(--radius-md);font-size:0.9rem;margin-bottom:1.2rem;transition:background 0.18s;}
.cta:hover{background:var(--color-primary-hover);}
.cta.disabled{background:var(--color-surface-offset);color:var(--color-text-faint);}
.share-row{display:flex;gap:0.5rem;flex-wrap:wrap;margin-bottom:1.8rem;}
.share-btn{display:inline-flex;align-items:center;gap:0.4rem;font-size:0.8125rem;font-weight:700;padding:0.5rem 0.9rem;border-radius:var(--radius-full);border:1px solid var(--color-border);background:var(--color-surface);color:var(--color-text);cursor:pointer;font-family:inherit;transition:border-color 0.18s,background 0.18s;}
.share-btn:hover{border-color:var(--color-text-faint);background:var(--color-surface-2);}
.disclaimer{font-size:0.8125rem;color:var(--color-text-muted);line-height:1.7;}
.similar-section{margin-top:0.5rem;margin-bottom:1.8rem;}
.similar-section h2{font-family:var(--font-display);font-size:1.05rem;font-weight:800;margin-bottom:0.9rem;}
.similar-card{display:block;padding:0.9rem 1rem;border:1px solid var(--color-border);border-radius:var(--radius-md);margin-bottom:0.6rem;transition:border-color 0.18s,background 0.18s;}
.similar-card:hover{border-color:var(--color-text-faint);background:var(--color-surface-2);}
.similar-name{font-weight:700;margin-bottom:0.15rem;}
.similar-meta{font-size:0.8125rem;color:var(--color-text-muted);}
.error-code{font-family:var(--font-display);font-size:clamp(3rem,10vw,5.5rem);font-weight:900;-webkit-text-stroke:2px var(--color-text);color:transparent;line-height:1;margin-bottom:0.6rem;}
footer{border-top:1px solid var(--color-divider);color:var(--color-text-muted);font-size:0.8125rem;text-align:center;padding:2rem 1rem 2.4rem;}
footer a{font-weight:700;color:var(--color-text);}
@media (max-width:640px){
  .info-row{flex-direction:column;gap:0.15rem;}
  .info-row .v{text-align:left;}
}