/* Finish First Chicago — shared site styles.
   Layout: single column, wide on desktop; brand = black + red, Saira italic display, Chicago-flag blue accent.
   Deliberately one dark look (racing pit-wall), so colors are set explicitly. */
:root{
  --bg:#0A0A0C; --bg2:#111115; --panel:#16161B; --panel2:#1E1E25; --line:#2B2B33;
  --ink:#F2F2F4; --muted:#9A9BA5; --red:#E3172F; --red-soft:#3A0E15; --blue:#7DB9EE; --good:#33C27D; --gold:#F2C14E;
  --display:"Saira","Arial Narrow",sans-serif; --body:"IBM Plex Sans","Segoe UI",system-ui,sans-serif; --mono:"JetBrains Mono",Consolas,ui-monospace,monospace;
  color-scheme:dark;
}
*{box-sizing:border-box}
[hidden]{display:none!important}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--ink);font-family:var(--body);font-size:17px;line-height:1.55}
img{max-width:100%;display:block}
a{color:var(--blue)}
:focus-visible{outline:3px solid var(--blue);outline-offset:2px}
.wrap{max-width:1180px;margin:0 auto;padding-inline:20px}
@media (max-width:480px){.wrap{padding-inline:16px}}

/* header */
.site-head{position:sticky;top:0;z-index:20;background:rgba(10,10,12,.92);backdrop-filter:blur(8px);border-bottom:1px solid var(--line)}
.site-head .wrap{display:flex;align-items:center;justify-content:space-between;gap:16px;padding-block:12px}
.wordmark{display:inline-block;text-decoration:none;font:italic 900 22px/.86 var(--display);color:var(--red);text-transform:uppercase}
.wordmark small{display:block;font-size:9px;letter-spacing:.46em;color:var(--blue);margin-top:4px}
nav ul{list-style:none;margin:0;padding:0;display:flex;gap:4px;flex-wrap:wrap;justify-content:flex-end}
nav a{display:block;text-decoration:none;color:var(--muted);font:600 15px var(--body);padding:8px 12px;border-radius:8px}
nav a:hover{color:var(--ink)}
nav a[aria-current="page"]{color:var(--ink);background:var(--panel2)}
nav a.cta{background:var(--red);color:#fff}
@media (max-width:640px){nav a{padding:7px 9px;font-size:14px}}

/* type */
.eyebrow{font:500 12px var(--mono);letter-spacing:.16em;text-transform:uppercase;color:var(--red)}
h1,h2,h3{font-family:var(--display);font-style:italic;text-transform:uppercase;text-wrap:balance;margin:0}
h1{font-weight:900;font-size:clamp(40px,7vw,84px);line-height:.95}
h2{font-weight:800;font-size:clamp(28px,4vw,44px);line-height:1}
h3{font-weight:800;font-size:22px;line-height:1.1}
p{margin:0 0 14px;max-width:64ch}
.lead{font-size:clamp(18px,2vw,21px);color:#D4D4DA}
.muted{color:var(--muted)}
.small{font-size:14px;color:var(--muted)}
section{padding-block:72px}
@media (max-width:640px){section{padding-block:52px}}

/* buttons */
.btn{display:inline-block;text-decoration:none;border:0;cursor:pointer;border-radius:8px;padding:14px 22px;font:700 17px var(--display);letter-spacing:.07em;text-transform:uppercase;background:var(--red);color:#fff}
.btn.ghost{background:none;border:1px solid var(--line);color:var(--ink)}
.btn:hover{filter:brightness(1.1)}
.btns{display:flex;gap:10px;flex-wrap:wrap;margin-top:22px}

/* footer */
.site-foot{border-top:1px solid var(--line);padding-block:32px;margin-top:40px}
.site-foot .wrap{display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap}
.site-foot a{color:var(--ink)}

/* leaderboard table (shared) */
.board{width:100%;border-collapse:collapse;font-size:17px}
.board th{text-align:left;font:500 11px var(--mono);letter-spacing:.12em;text-transform:uppercase;color:var(--muted);padding:8px;border-bottom:2px solid var(--red)}
.board td{padding:11px 8px;border-bottom:1px solid var(--line)}
.board td.p{font:italic 900 24px var(--display);width:44px;color:var(--muted)}
.board tr.p1 td.p{color:var(--gold)}
.board td.t{font:700 17px var(--mono);font-variant-numeric:tabular-nums;white-space:nowrap}
.board td.g{font:500 14px var(--mono);color:var(--muted);white-space:nowrap}
.tw{overflow-x:auto}
.empty{color:var(--muted);padding:18px 2px}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important;animation:none!important}}
nav .sm{display:none}
@media (max-width:640px){nav .lg{display:none}nav .sm{display:inline}nav ul{gap:2px}}