/* Dates.Run v2 stylesheet. Tokens from code/dates-run/design/tokens.css: dark first, flat colour, one accent, pill header, poster cards. */
:root{
  --color-ink:#f5f5f4;--color-graphite:#e5e5e4;--color-slate:#9ca3af;--color-stone:#8b929e;--color-silver:#2a2d31;
  --color-paper:#0e0f11;--color-white:#17191c;--color-accent:#f5f5f4;--color-accent-contrast:#0e0f11;--color-link:#818cf8;
  --grey-poster-bg:#3b4048;--grey-poster-ink:#f5f5f4;--photo-chip-bg:rgba(14,15,17,.78);--photo-chip-ink:#f5f5f4;
  --status-ok:#4ade80;--status-warn:#fbbf24;
  --race-road:#0284c7;--race-trail:#16a34a;--race-ultra:#7c3aed;--race-fun:#f59e0b;--race-charity:#ec4899;--race-virtual:#06b6d4;--race-obstacle:#ea580c;--race-vertical:#0d9488;--race-walk:#65a30d;--race-multisport:#64748b;--race-night:#5a5ad6;--race-hill:#b8864b;
  --font-body:"Geist",system-ui,-apple-system,"Segoe UI",sans-serif;--font-mono:"Geist Mono",ui-monospace,"SF Mono",Menlo,monospace;
  --radius-card:16px;--radius-input:10px;--radius-pill:9999px;--card-border:1px solid var(--color-silver);--card-shadow:none;
  --motion-fast:150ms ease-out;--motion-base:200ms ease-out;--poster-ratio:4/3;color-scheme:dark;
}
:root[data-mode="light"]{
  --color-ink:#14181c;--color-graphite:#24272b;--color-slate:#6b7280;--color-stone:#6b7280;--color-silver:#e5e7eb;--color-paper:#f7f7f5;--color-white:#fff;
  --color-accent:#14181c;--color-accent-contrast:#fff;--color-link:#4f46e5;--grey-poster-bg:#cfd3da;--grey-poster-ink:#14181c;
  --status-ok:#15803d;--status-warn:#92400e;--card-shadow:0 4px 16px rgba(20,24,28,.06);--card-border:none;color-scheme:light;
}
*{box-sizing:border-box}
[hidden]{display:none!important}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--color-paper);color:var(--color-ink);font:16px/1.55 var(--font-body);-webkit-font-smoothing:antialiased}
a{color:inherit}
:focus-visible{outline:2px solid var(--color-link);outline-offset:2px;border-radius:4px}
.skip{position:absolute;left:16px;top:-48px;z-index:50;padding:10px 18px;border-radius:var(--radius-pill);background:var(--color-ink);color:var(--color-paper);font:600 14px var(--font-body);text-decoration:none;transition:top var(--motion-fast)}
.skip:focus{top:12px}
.wrap{max-width:1120px;margin:0 auto;padding:12px 16px 56px}
/* header: one pill */
.nav{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;padding:8px 8px 8px 20px;border-radius:var(--radius-pill);background:var(--color-white);border:var(--card-border);box-shadow:var(--card-shadow)}
.brand{font:700 18px var(--font-body);letter-spacing:-.02em;text-decoration:none}
.brand i{font-style:normal;color:var(--color-slate);font-weight:500}
.navlinks{display:flex;gap:6px;align-items:center;flex-wrap:wrap}
.navlinks a,.navlinks button{font:600 13px var(--font-body);padding:7px 14px;border-radius:var(--radius-pill);text-decoration:none;color:var(--color-slate);background:transparent;border:0;cursor:pointer;transition:background var(--motion-fast),color var(--motion-fast)}
.navlinks a:hover,.navlinks button:hover,.navlinks a[aria-current]{background:var(--color-silver);color:var(--color-ink)}
.navlinks .lang{border:1.5px solid var(--color-silver);color:var(--color-ink)}
/* headings and text */
h1{font-size:clamp(28px,5vw,44px);line-height:1.1;letter-spacing:-.025em;margin:28px 0 8px;text-wrap:balance}
h2{font-size:20px;letter-spacing:-.01em;margin:32px 0 12px}
.lede{color:var(--color-slate);font-size:18px;margin:0 0 20px;max-width:46rem}
.muted{color:var(--color-slate);font-size:14px}
.mono{font-family:var(--font-mono)}
/* filters */
.filters{display:flex;flex-wrap:wrap;gap:10px;margin:24px 0 8px;align-items:center}
.filters input,.filters select{font:500 14px var(--font-body);color:var(--color-ink);background:var(--color-white);border:1.5px solid var(--color-silver);border-radius:var(--radius-pill);padding:9px 16px;min-width:0}
.filters input[type=search]{flex:1 1 220px}
.filters select{appearance:none;padding-right:30px;background-image:linear-gradient(45deg,transparent 50%,var(--color-slate) 50%),linear-gradient(135deg,var(--color-slate) 50%,transparent 50%);background-position:calc(100% - 17px) 55%,calc(100% - 12px) 55%;background-size:5px 5px;background-repeat:no-repeat}
.btn{display:inline-flex;align-items:center;gap:8px;border:0;cursor:pointer;font:700 15px var(--font-body);padding:12px 24px;border-radius:var(--radius-pill);background:var(--color-accent);color:var(--color-accent-contrast);text-decoration:none;transition:opacity var(--motion-fast)}
.btn:hover{opacity:.88}
.btn.ghost{background:transparent;color:var(--color-ink);border:1.5px solid var(--color-silver)}
.filters .btn{padding:9px 18px;font-size:14px}
.count{font:500 13px var(--font-mono);color:var(--color-slate);margin:12px 0}
.clear{font-size:14px;color:var(--color-link)}
/* cards */
.grid{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:16px;align-items:start}
.card{display:flex;flex-direction:column;text-decoration:none;color:inherit;background:var(--color-white);border:var(--card-border);box-shadow:var(--card-shadow);border-radius:var(--radius-card);overflow:hidden;transition:transform var(--motion-base)}
.card:hover{transform:translateY(-2px)}
.poster{position:relative;overflow:hidden;aspect-ratio:16/5;background:var(--grey-poster-bg);color:var(--grey-poster-ink);display:flex;align-items:flex-end;padding:10px 16px;font-family:var(--font-mono)}
.poster.photo{aspect-ratio:var(--poster-ratio);padding:14px 16px}
.poster img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain}
.dm{position:relative;display:inline-flex;align-items:baseline;gap:8px}
.poster.photo .dm{background:var(--photo-chip-bg);color:var(--photo-chip-ink);padding:4px 12px;border-radius:var(--radius-pill)}
.d{font-size:40px;font-weight:500;line-height:.95}
.poster.photo .d{font-size:24px}
.m{font-size:14px;font-weight:500;letter-spacing:.08em}
.body{padding:14px 16px 16px;display:flex;flex-direction:column;gap:4px;min-width:0;flex:1}
.body h3{margin:0;font-size:18px;line-height:1.2;letter-spacing:-.01em;text-wrap:balance;overflow-wrap:anywhere}
.loc{font-size:14px;color:var(--color-slate)}
.foot{display:flex;justify-content:space-between;gap:8px;flex-wrap:wrap;margin-top:auto;padding-top:10px;font:12px var(--font-mono);color:var(--color-slate)}
.from{font:12px var(--font-mono);color:var(--color-slate)}
.thin{font-style:italic}
.card.past{opacity:.6}
/* race page */
.hero{margin:24px 0 0;border-radius:var(--radius-card);overflow:hidden;background:var(--grey-poster-bg);border:var(--card-border)}
.hero img{display:block;width:100%;height:auto;max-height:520px;object-fit:contain}
.hero figcaption{padding:8px 14px;font-size:12px;color:var(--color-slate);background:var(--color-white)}
.eyebrow{font:500 12px var(--font-mono);letter-spacing:.1em;text-transform:uppercase;color:var(--color-slate);margin-top:28px}
.actions{display:flex;flex-wrap:wrap;gap:10px;margin:20px 0}
.why{color:var(--color-slate);font-size:15px;margin:20px 0}
.facts{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:12px;margin:24px 0;padding:0;list-style:none}
.facts li{background:var(--color-white);border:var(--card-border);box-shadow:var(--card-shadow);border-radius:var(--radius-input);padding:12px 16px}
.facts .k{display:block;font:500 11px var(--font-mono);letter-spacing:.1em;text-transform:uppercase;color:var(--color-slate);margin-bottom:2px}
.facts .v{font-size:16px;overflow-wrap:anywhere}
.chips{display:flex;flex-wrap:wrap;gap:8px;margin:0;padding:0;list-style:none}
.chips li{font:600 13px var(--font-mono);padding:6px 14px;border-radius:var(--radius-pill);border:1.5px solid var(--color-silver)}
table.prices{width:100%;border-collapse:collapse;font-size:15px;background:var(--color-white);border:var(--card-border);border-radius:var(--radius-input);overflow:hidden}
table.prices th,table.prices td{text-align:left;padding:10px 16px;border-top:1px solid var(--color-silver)}
table.prices tr:first-child th,table.prices tr:first-child td{border-top:0}
table.prices td{text-align:right;font-family:var(--font-mono);white-space:nowrap}
.prose{max-width:46rem}
.prose p{margin:0 0 14px}
details.more{margin:16px 0;max-width:46rem}
details.more summary{cursor:pointer;color:var(--color-slate);font-weight:600;font-size:14px}
.checked{margin-top:32px;font-size:13px;color:var(--color-slate)}
.credit a{color:var(--color-slate)}
footer.site{margin-top:64px;padding-top:20px;border-top:1px solid var(--color-silver);font-size:13px;color:var(--color-slate);display:flex;gap:16px;flex-wrap:wrap;justify-content:space-between}
.empty{padding:48px 0;color:var(--color-slate)}
.subnav{display:none;gap:6px;margin:10px 0 0;padding:0 4px;flex-wrap:wrap}
.subnav a{font:600 13px var(--font-body);padding:6px 14px;border-radius:var(--radius-pill);text-decoration:none;color:var(--color-slate);border:1.5px solid var(--color-silver)}
.subnav a[aria-current]{background:var(--color-silver);color:var(--color-ink)}
@media (max-width:620px){.nav{flex-wrap:nowrap;padding-left:16px}.navlinks .sec{display:none}.subnav{display:flex}.d{font-size:34px}}
@media (prefers-reduced-motion:reduce){.card{transition:none}.card:hover{transform:none}}

/* a race whose date the organiser states shows in its type's colour; the date numeral sits on it */
.poster[data-type]{background:var(--c);color:#0b0d10}
.poster[data-type="road"]{--c:var(--race-road);color:#0b0d10}
.poster[data-type="trail"]{--c:var(--race-trail)}
.poster[data-type="ultra"]{--c:var(--race-ultra);color:#fff}
.poster[data-type="fun"]{--c:var(--race-fun)}
.poster[data-type="charity"]{--c:var(--race-charity)}
.poster[data-type="virtual"]{--c:var(--race-virtual)}
.poster[data-type="obstacle"]{--c:var(--race-obstacle)}
.poster[data-type="vertical"]{--c:var(--race-vertical)}
.poster[data-type="walk"]{--c:var(--race-walk)}
.poster[data-type="multisport"]{--c:var(--race-multisport);color:#fff}
.poster[data-type="night"]{--c:var(--race-night);color:#fff}
.poster[data-type="hill"]{--c:var(--race-hill)}
.poster.photo[data-type]{background:var(--grey-poster-bg)}
.chip{position:absolute;top:10px;left:10px;font:600 11px var(--font-body);padding:3px 9px;border-radius:var(--radius-pill);background:var(--photo-chip-bg);color:var(--photo-chip-ink)}
.type{font:500 11px var(--font-mono);letter-spacing:.1em;text-transform:uppercase;color:var(--color-slate)}

ol.changes{list-style:none;margin:0;padding:0;border-left:2px solid var(--color-silver)}
ol.changes li{padding:6px 0 6px 16px;display:flex;gap:14px;flex-wrap:wrap;position:relative}
ol.changes li::before{content:"";position:absolute;left:-6px;top:15px;width:10px;height:10px;border-radius:50%;background:var(--color-paper);border:2px solid var(--color-slate)}
ol.changes .when{font-size:12px;color:var(--color-slate);min-width:9rem}

h1 em{font-style:normal;color:var(--color-slate)}
.brand{font-weight:800}