:root {
      --bg:#faf7f1; --paper:#f0eee9; --card:#fff; --ink:#1f2420; --muted:#6f776e; --faint:#9aa097;
      --line:#ece9e2; --accent:#2f8f5b; --accent-12:rgba(47,143,91,.12); --accent-24:rgba(47,143,91,.24);
      --away:#b07a2a; --away-12:rgba(176,122,42,.13); --r:18px;
      --ghost:#f1efe8; --copy-bg:#fbfaf6; --body-bg:#efece3;
      --shadow-sm:rgba(30,40,30,.06); --shadow-app:rgba(40,40,30,.5);
      color-scheme: light dark;
    }
    @media (prefers-color-scheme: dark) {
      :root {
        --bg:#161a16; --paper:#1e221e; --card:#232823; --ink:#dde8db; --muted:#8a9887; --faint:#5c6659;
        --line:#2c322c; --accent-12:rgba(47,143,91,.18); --accent-24:rgba(47,143,91,.32);
        --away-12:rgba(176,122,42,.2); --ghost:#262c26; --copy-bg:#1a1e1a; --body-bg:#141814;
        --shadow-sm:rgba(0,0,0,.3); --shadow-app:rgba(0,0,0,.7);
        color-scheme: dark;
      }
      body {
        background:#141814;
        background-image:radial-gradient(120% 80% at 50% -10%, #181c18 0%, #141814 70%, #121612 100%);
      }
    }
    * { box-sizing:border-box; -webkit-tap-highlight-color:transparent; }
    html, body { margin:0; padding:0; }
    body {
      min-height:100dvh; background:var(--body-bg);
      background-image:radial-gradient(120% 80% at 50% -10%, #f4f1ea 0%, #e9e5db 70%, #e4e0d5 100%);
      color:var(--ink); font-family:"Hanken Grotesk", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
      line-height:1.45;
    }
    a { color:inherit; }
    .app { min-height:100dvh; background:var(--bg); }
    .top { height:70px; display:flex; align-items:center; gap:24px; padding:0 40px; background:color-mix(in srgb,var(--card) 90%, transparent); border-bottom:1px solid var(--line); backdrop-filter:blur(10px); }
    .brand { display:flex; align-items:center; gap:10px; text-decoration:none; font-weight:900; font-size:18px; }
    .brand-mark { width:34px; height:34px; border-radius:11px; background:var(--accent); color:#fff; display:grid; place-items:center; }
    .toplink { position:relative; font-size:15px; font-weight:700; color:var(--muted); text-decoration:none; padding:8px 4px; }
    .toplink.on { color:var(--ink); }
    .toplink.on::after { content:""; position:absolute; left:4px; right:4px; bottom:-3px; height:3px; border-radius:3px; background:var(--accent); }
    .wrap { width:min(1120px, calc(100% - 36px)); margin:0 auto; }
    .home { padding:40px 0 56px; display:flex; flex-direction:column; gap:44px; }
    .hero { text-align:center; max-width:1000px; margin:0 auto; }
    .eyebrow { font-size:12px; font-weight:800; letter-spacing:0; text-transform:uppercase; color:var(--accent); }
    h1 { margin:0; font-size:clamp(38px, 5vw, 56px); font-weight:800; letter-spacing:0; line-height:1.03; text-wrap:balance; }
    .lead { margin:14px auto 0; max-width:590px; font-size:18px; color:var(--muted); line-height:1.5; }
    .search { margin:26px auto 0; max-width:620px; height:66px; border-radius:18px; border:2px solid var(--line); background:var(--card); box-shadow:0 1px 2px rgba(0,0,0,.04); display:flex; align-items:center; gap:13px; padding:0 18px; color:var(--faint); }
    .search input { flex:1; border:0; outline:0; background:transparent; min-width:0; font:600 18px inherit; color:var(--ink); }
    .search:focus-within { border-color:var(--accent); color:var(--accent); }
    .chips { display:flex; gap:9px; margin-top:14px; flex-wrap:wrap; justify-content:center; }
    .chip { border:1.5px solid var(--line); background:var(--card); color:var(--muted); font-size:13.5px; font-weight:700; border-radius:999px; padding:7px 13px; display:inline-flex; align-items:center; gap:7px; }
    .section-head { display:flex; align-items:baseline; justify-content:space-between; gap:16px; margin-bottom:16px; }
    .section-title { margin:0; font-size:21px; font-weight:800; letter-spacing:0; text-wrap:balance; }
    .section-meta { font-size:14px; font-weight:700; color:var(--faint); }
    .club-grid { display:grid; grid-template-columns:repeat(3, minmax(0, 1fr)); gap:14px; }
    .club-grid.equal-headings { grid-auto-rows:auto auto; align-items:stretch; }
    .club-card { background:var(--card); border-radius:var(--r); box-shadow:0 1px 2px var(--shadow-sm); overflow:hidden; }
    .club-grid.equal-headings .club-card { display:grid; grid-template-rows:subgrid; grid-row:span 2; }
    .club-main { display:flex; align-items:center; gap:15px; padding:17px 18px; text-decoration:none; }
    .badge, .crest { width:46px; height:46px; border-radius:13px; background:var(--accent-12); color:var(--accent); display:flex; align-items:center; justify-content:center; font-size:15px; font-weight:800; flex-shrink:0; overflow:hidden; }
    .crest { width:72px; height:72px; border-radius:18px; background:var(--accent); color:#fff; font-size:25px; box-shadow:inset 0 0 0 4px rgba(255,255,255,.28); }
    .logo-mark { background:var(--card); border:1px solid var(--line); color:transparent; box-shadow:none; }
    .logo-mark img { display:block; width:82%; height:82%; object-fit:contain; }
    .crest.logo-mark { box-shadow:0 1px 2px var(--shadow-sm); }
    .name { font-size:16.5px; font-weight:800; line-height:1.2; text-wrap:pretty; }
    .sub { font-size:13.5px; color:var(--faint); margin-top:2px; }
    .team-list { border-top:1px solid var(--line); padding:8px 12px 12px; display:grid; gap:4px; align-content:start; }
    .team-row { display:flex; align-items:center; gap:9px; min-height:36px; border-radius:11px; padding:6px 8px; color:var(--muted); text-decoration:none; font-size:14.5px; font-weight:700; }
    .team-row:hover { background:var(--paper); color:var(--ink); }
    .team-row .team-name { min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; color:inherit; font-size:inherit; }
    .team-row .team-section { margin-left:auto; color:var(--faint); font-size:12.5px; }
    .page-grid { padding:36px 0 56px; display:grid; grid-template-columns:396px minmax(0, 1fr); gap:40px; align-items:start; }
    .sticky { position:sticky; top:92px; }
    .card { background:var(--card); border-radius:var(--r); box-shadow:0 1px 2px var(--shadow-sm); }
    .subscribe { padding:26px 24px; }
    .crumbs { display:flex; align-items:center; gap:8px; flex-wrap:wrap; color:var(--faint); font-size:13px; font-weight:700; }
    .crumbs a { color:inherit; text-decoration:none; }
    .crumbs a:hover { color:var(--ink); text-decoration:underline; text-underline-offset:3px; }
    .crumbs strong { color:var(--accent); }
    .identity { display:flex; align-items:center; gap:17px; margin:18px 0 4px; }
    .identity h1 { font-size:25px; line-height:1.1; text-wrap:balance; }
    .btn { min-height:56px; border:0; border-radius:14px; background:var(--accent); color:#fff; display:inline-flex; align-items:center; justify-content:center; gap:10px; padding:0 18px; font:800 17px inherit; text-decoration:none; cursor:pointer; box-shadow:0 12px 24px -12px rgba(47,143,91,.85); }
    .btn.full { width:100%; margin-top:20px; }
    .btn.ghost { min-height:42px; flex:1; background:var(--ghost); color:var(--ink); box-shadow:none; font-size:14px; font-weight:700; }
    .app-buttons { display:flex; gap:9px; margin-top:10px; }
    .hint { display:flex; align-items:center; justify-content:center; gap:7px; color:var(--faint); font-size:13px; margin-top:16px; text-align:center; }
    .fetch-meta { display:flex; align-items:center; justify-content:center; gap:7px; color:var(--muted); font-size:13px; font-weight:700; margin-top:10px; text-align:center; }
    .fetch-meta svg { color:var(--faint); flex-shrink:0; }
    .copy { margin-top:14px; padding:10px 12px; border-radius:12px; border:1.5px solid var(--line); color:var(--muted); font-size:13px; overflow-wrap:anywhere; background:var(--copy-bg); }
    .fixture-stack { display:flex; flex-direction:column; gap:13px; }
    .month-group { display:flex; flex-direction:column; gap:13px; }
    .month-group + .month-group { margin-top:16px; }
    .month-head { display:flex; align-items:center; gap:11px; padding:0 2px; color:var(--muted); font-size:13px; font-weight:900; letter-spacing:0; text-transform:uppercase; }
    .month-head::after { content:""; height:1px; flex:1; background:var(--line); }
    .break-marker { display:flex; align-items:center; justify-content:center; gap:10px; margin:2px 0; color:var(--muted); }
    .break-rule { height:1px; flex:1; background:var(--line); }
    .break-pill { min-height:34px; border:1.5px solid var(--line); border-radius:999px; background:color-mix(in srgb, var(--card) 80%, var(--paper)); display:inline-flex; align-items:center; justify-content:center; gap:7px; padding:5px 11px; font-size:12px; font-weight:900; color:var(--muted); white-space:nowrap; }
    .break-pill svg { color:var(--accent); flex-shrink:0; }
    .break-pill strong { color:var(--ink); font-weight:900; }
    .day-card { background:var(--card); border-radius:var(--r); box-shadow:0 1px 2px var(--shadow-sm); overflow:hidden; }
    .day-head { display:flex; align-items:center; gap:12px; padding:11px 15px 9px; border-bottom:1px solid var(--line); }
    .day-head .dow { font-size:11px; font-weight:800; color:var(--faint); letter-spacing:0; text-transform:uppercase; }
    .day-head .date { font-size:17px; font-weight:800; }
    .count { margin-left:auto; font-size:11.5px; font-weight:700; color:var(--accent); background:var(--accent-12); padding:3px 9px; border-radius:999px; }
    .fixture { display:flex; align-items:flex-start; gap:13px; padding:12px 15px; border-top:1px solid var(--line); text-decoration:none; color:inherit; }
    .fixture:first-of-type { border-top:0; }
    .fixture.cancelled .match,
    .fixture.cancelled .meta span,
    .rail-game.cancelled .rail-match,
    .rail-game.cancelled .rail-meta span { text-decoration:line-through; text-decoration-thickness:1.5px; text-decoration-color:currentColor; }
    .time-col { width:62px; flex-shrink:0; }
    .time { font-size:15px; font-weight:800; line-height:1.1; }
    .tag { display:inline-block; margin-top:4px; font-size:10.5px; font-weight:800; letter-spacing:0; text-transform:uppercase; color:var(--accent); background:var(--accent-12); padding:2px 7px; border-radius:6px; }
    .tag.away { color:var(--away); background:var(--away-12); }
    .match { font-size:16px; font-weight:800; line-height:1.25; text-wrap:pretty; }
    .meta { display:flex; align-items:center; gap:6px; margin-top:4px; font-size:13.5px; color:var(--muted); min-width:0; }
    .fixture-note, .rail-note { margin-top:5px; color:var(--muted); font-size:13px; font-weight:700; font-style:italic; line-height:1.3; }
    .status { flex-shrink:0; margin-left:auto; font-size:11px; font-weight:700; color:var(--muted); border:1px solid var(--line); padding:2px 7px; border-radius:6px; }
    .fixture.cancelled .status,
    .rail-game.cancelled .rail-status { color:#fff; background:#c9472e; border-color:#c9472e; }
    .tag.bye,
    .rail-tag.bye { color:var(--muted); background:var(--ghost); }
    .fixture.bye .meta,
    .rail-game.bye .rail-meta { color:var(--faint); }
    .score { color:#c9472e; font-weight:800; }
    .empty { padding:24px; color:var(--muted); }
    .rail-card { background:var(--card); border-radius:var(--r); box-shadow:0 1px 2px var(--shadow-sm); padding:14px 15px; display:flex; gap:14px; align-items:stretch; }
    details.rail-card { display:block; }
    .rail-summary { list-style:none; cursor:pointer; display:flex; gap:14px; align-items:stretch; }
    .rail-summary::-webkit-details-marker { display:none; }
    .rail-summary::marker { content:""; }
    .rail-summary .rail-games { display:none; }
    details[open] > .rail-summary { padding-bottom:12px; margin-bottom:12px; border-bottom:1px solid var(--line); }
    details[open] > .rail-games { padding-left:67px; }
    .rail-state { margin-left:auto; align-self:flex-start; font-size:10.5px; font-weight:900; color:var(--muted); background:var(--ghost); padding:2px 7px; border-radius:999px; text-transform:uppercase; }
    .prev-section { margin-top:16px; }
    .prev-section > summary { list-style:none; cursor:pointer; display:flex; align-items:center; gap:11px; padding:0 2px 12px; color:var(--muted); font-size:13px; font-weight:900; letter-spacing:0; text-transform:uppercase; }
    .prev-section > summary::-webkit-details-marker { display:none; }
    .prev-section > summary::marker { content:""; }
    .prev-section > summary::after { content:""; height:1px; flex:1; background:var(--line); }
    .prev-count { background:var(--ghost); padding:1px 7px; border-radius:999px; font-size:12px; font-weight:700; text-transform:none; letter-spacing:normal; color:var(--faint); }
    .rail-date { width:52px; flex-shrink:0; text-align:center; line-height:1; display:flex; flex-direction:column; align-items:center; padding-top:0; }
    .rail-dow { font-size:11px; font-weight:900; color:var(--accent); letter-spacing:0; text-transform:uppercase; }
    .rail-day { margin-top:3px; font-size:26px; font-weight:900; letter-spacing:0; color:var(--ink); }
    .rail-mon { margin-top:1px; font-size:12px; font-weight:800; color:var(--faint); }
    .rail-count { margin-top:8px; font-size:10.5px; font-weight:900; color:var(--accent); background:var(--accent-12); padding:2px 7px; border-radius:999px; }
    .rail-divider { width:1px; background:var(--line); flex-shrink:0; }
    .rail-games { flex:1; min-width:0; display:flex; flex-direction:column; }
    .rail-game { padding-top:12px; margin-top:12px; border-top:1px solid var(--line); text-decoration:none; color:inherit; }
    a.rail-game:hover .rail-match,
    a.fixture:hover .match { color:var(--accent); }
    .rail-game:first-child { padding-top:0; margin-top:0; border-top:0; }
    .rail-line { display:flex; align-items:center; gap:8px; margin-bottom:3px; }
    .rail-time { font-size:14px; font-weight:900; line-height:1; text-transform:uppercase; }
    .rail-tag { font-size:10.5px; font-weight:900; letter-spacing:0; text-transform:uppercase; color:var(--accent); background:var(--accent-12); padding:2px 7px; border-radius:6px; }
    .rail-tag.away { color:var(--away); background:var(--away-12); }
    .rail-format { margin-left:auto; font-size:11px; font-weight:900; color:var(--muted); border:1.5px solid var(--line); padding:1px 7px; border-radius:6px; }
    .rail-status { font-size:10.5px; font-weight:900; color:var(--muted); border:1.5px solid var(--line); padding:1px 7px; border-radius:6px; }
    .rail-match { display:flex; align-items:center; flex-wrap:wrap; gap:5px 0; font-size:16px; font-weight:900; line-height:1.25; letter-spacing:0; text-wrap:pretty; }
    .rail-result { margin-left:12px; display:inline-flex; align-items:center; gap:6px; vertical-align:baseline; }
    .rail-score { color:var(--ink); font-size:16px; font-weight:900; line-height:1.25; }
    .rail-outcome { display:inline-flex; align-items:center; min-height:24px; border-radius:999px; padding:1px 8px; font-size:11px; font-weight:900; line-height:1; text-transform:uppercase; }
    .rail-outcome.win { color:var(--accent); background:var(--accent-12); }
    .rail-outcome.loss { color:#c9472e; background:rgba(201,71,46,.12); }
    .rail-outcome.draw { color:var(--muted); background:var(--ghost); }
    .rail-meta { display:flex; align-items:center; gap:6px; margin-top:3px; font-size:13.5px; color:var(--muted); min-width:0; }
    .game-page { padding:36px 0 56px; display:flex; flex-direction:column; gap:16px; max-width:980px; }
    .game-hero { padding:26px 28px 22px; overflow:hidden; }
    .game-topline { display:flex; align-items:flex-start; justify-content:space-between; gap:18px; }
    .game-kicker { color:var(--muted); font-size:13px; font-weight:900; text-transform:uppercase; letter-spacing:0; }
    .game-hero h1 { margin:10px 0 0; font-size:clamp(26px, 3.5vw, 40px); line-height:1.08; }
    .game-tags { display:flex; flex-wrap:wrap; justify-content:flex-end; gap:8px; }
    .game-matchup { margin-top:22px; display:grid; grid-template-columns:minmax(0, 1fr) auto minmax(0, 1fr); grid-auto-rows:minmax(128px, auto); align-items:stretch; gap:16px; }
    .game-team { min-width:0; min-height:0; padding:17px 20px; border:1px solid var(--line); border-radius:16px; background:linear-gradient(180deg, color-mix(in srgb, var(--card) 92%, var(--paper)), var(--card)); display:flex; flex-direction:column; justify-content:center; gap:7px; }
    .game-team.away { text-align:right; }
    .game-team-label { color:var(--faint); font-size:11.5px; font-weight:900; text-transform:uppercase; }
    .game-team a { text-decoration:none; color:inherit; }
    .game-team a:hover .game-team-name { color:var(--accent); }
    .game-team-name { font-size:clamp(21px, 2.6vw, 28px); font-weight:900; line-height:1.06; text-wrap:balance; overflow-wrap:anywhere; }
    .game-club { color:var(--muted); font-size:14.5px; font-weight:800; line-height:1.2; }
    .game-sub { margin-top:-3px; color:var(--faint); font-size:13px; font-weight:700; }
    .game-scorecard { min-width:112px; align-self:center; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:6px; padding:0 4px; }
    .game-score { font-size:clamp(34px, 5vw, 54px); font-weight:900; line-height:1; color:var(--accent); white-space:nowrap; }
    .game-scorecard time { color:var(--muted); font-size:13px; font-weight:900; text-transform:uppercase; }
    .game-venue-strip { margin-top:20px; padding-top:17px; border-top:1px solid var(--line); display:flex; flex-wrap:wrap; gap:10px 18px; color:var(--muted); font-size:14.5px; font-weight:800; }
    .game-venue-strip div { min-width:0; display:flex; align-items:center; gap:7px; }
    .game-venue-strip svg { color:var(--accent); flex-shrink:0; }
    .game-venue-strip span { min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
    .game-lower { display:grid; grid-template-columns:minmax(0, 1.45fr) minmax(280px, .8fr); gap:16px; align-items:start; }
    .game-details, .game-side { padding:24px; }
    .game-details h2, .game-side h2 { margin:0 0 16px; font-size:20px; line-height:1.15; }
    .game-details dl, .game-side dl { margin:0; display:grid; gap:0; }
    .detail-row { display:grid; grid-template-columns:128px minmax(0, 1fr); gap:16px; padding:12px 0; border-top:1px solid var(--line); }
    .detail-row:first-child { border-top:0; padding-top:0; }
    .detail-row dt { color:var(--faint); font-size:13px; font-weight:900; text-transform:uppercase; }
    .detail-row dd { margin:0; color:var(--ink); font-size:15.5px; font-weight:800; overflow-wrap:anywhere; }
    .map-link { color:var(--accent); text-decoration:none; text-underline-offset:3px; }
    .map-link:hover { text-decoration:underline; }
    .home-shell { min-height:100dvh; padding-bottom:56px; }
    .home-shell main { width:100%; margin:0; padding:40px; }
    .home-top { height:70px; display:flex; align-items:center; gap:24px; padding:0 40px; background:color-mix(in srgb,var(--card) 90%, transparent); border-bottom:1px solid var(--line); backdrop-filter:blur(10px); }
    .home-brand { display:flex; align-items:center; gap:10px; font-size:18px; font-weight:900; letter-spacing:0; }
    .home-brand .brand-mark { width:34px; height:34px; border-radius:11px; }
    .header-actions { margin-left:auto; display:flex; align-items:center; gap:9px; }
    .iconbtn { width:42px; height:42px; border:0; border-radius:12px; background:var(--card); color:var(--ink); display:flex; align-items:center; justify-content:center; box-shadow:0 1px 2px rgba(0,0,0,.06); text-decoration:none; cursor:pointer; font:inherit; }
    .iconbtn:hover, .iconbtn:focus-visible { color:var(--accent); outline:0; box-shadow:0 0 0 3px var(--accent-12); }
    .mobile-hero { padding:0; text-align:center; }
    .mobile-hero h1 { font-size:42px; letter-spacing:0; line-height:1.03; text-wrap:balance; }
    .mobile-hero p { margin:14px auto 0; max-width:560px; color:var(--muted); font-size:18px; line-height:1.5; }
    .mobile-search-wrap { max-width:620px; margin:0 auto; padding:26px 0 0; }
    .global-search { width:min(620px, calc(100% - 32px)); margin:16px auto 0; }
    .global-search.inline { padding-top:26px; margin-top:0; }
    .mobile-search { width:100%; height:66px; border:2px solid var(--line); border-radius:18px; background:var(--card); box-shadow:0 1px 2px rgba(0,0,0,.04); display:flex; align-items:center; gap:13px; padding:0 18px; color:var(--faint); }
    .mobile-search:focus-within { border-color:var(--accent); color:var(--accent); }
    .mobile-search input { flex:1; min-width:0; border:0; outline:0; background:transparent; color:var(--ink); font:700 18px inherit; }
    .mobile-search input::placeholder { color:var(--faint); opacity:1; }
    .mobile-section-title { margin:0; padding:44px 0 16px; font-size:21px; font-weight:900; letter-spacing:0; }
    .sport-list { padding:0; display:grid; grid-template-columns:repeat(3, minmax(0, 1fr)); gap:14px; }
    .sport-card { min-width:0; min-height:74px; display:flex; align-items:center; gap:15px; padding:15px 18px; border-radius:var(--r); background:var(--card); box-shadow:0 1px 2px var(--shadow-sm); text-decoration:none; color:inherit; }
    .sport-card > svg { flex-shrink:0; }
    .sport-icon { width:46px; height:46px; border-radius:13px; background:var(--accent-12); color:var(--accent); display:flex; align-items:center; justify-content:center; flex-shrink:0; }
    .sport-name { flex:1; min-width:0; font-size:17px; font-weight:900; line-height:1.18; text-wrap:pretty; overflow-wrap:anywhere; }
    .sport-badge { flex-shrink:0; font-size:11px; font-weight:800; letter-spacing:.02em; text-transform:uppercase; color:var(--muted); background:var(--paper); border:1px solid var(--line); border-radius:999px; padding:3px 9px; }
    .fed-list { padding:0; display:grid; grid-template-columns:repeat(3, minmax(0, 1fr)); gap:14px; }
    .fed-row { min-width:0; min-height:86px; display:flex; align-items:center; gap:15px; padding:17px 18px; border-radius:var(--r); background:var(--card); box-shadow:0 1px 2px var(--shadow-sm); text-decoration:none; color:inherit; }
    .fed-badge { width:46px; height:46px; border-radius:13px; background:var(--accent-12); color:var(--accent); display:flex; align-items:center; justify-content:center; font-size:15px; font-weight:900; flex-shrink:0; }
    .fed-name { font-size:16.5px; font-weight:900; line-height:1.2; text-wrap:pretty; }
    .fed-sub { margin-top:2px; font-size:13.5px; color:var(--faint); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
    .search-results { max-width:620px; margin:0 auto; padding:11px 0 0; display:flex; flex-direction:column; gap:8px; }
    .search-result { display:flex; align-items:center; gap:10px; min-height:48px; padding:10px 12px; border-radius:14px; background:var(--card); box-shadow:0 1px 2px var(--shadow-sm); text-decoration:none; }
    .search-result:hover { color:var(--accent); }
    .search-result-copy { min-width:0; display:flex; flex-direction:column; line-height:1.18; }
    .search-result-title { color:var(--ink); font-size:15px; font-weight:900; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
    .search-result-meta { margin-top:3px; color:var(--faint); font-size:13px; font-weight:700; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
    .search-empty { min-height:48px; padding:14px 16px; border-radius:14px; background:var(--card); box-shadow:0 1px 2px var(--shadow-sm); color:var(--muted); font-size:14px; font-weight:700; }
    .search-actions { display:flex; justify-content:center; padding-top:3px; }
    .search-all-btn { min-height:42px; padding:0 14px; }
    .mini-badge { width:30px; height:30px; border-radius:9px; background:var(--accent-12); color:var(--accent); display:flex; align-items:center; justify-content:center; font-size:11px; font-weight:900; flex-shrink:0; overflow:hidden; }
    .browse-clubs { padding:18px 0 0; display:none; }
    .browse-clubs.open { display:block; }
    .browse-clubs.open { display:grid; grid-template-columns:repeat(3, minmax(0, 1fr)); gap:14px; }
    .browse-clubs .mobile-section-title { grid-column:1 / -1; }
    .league-browse { padding:18px 0 0; display:none; }
    .league-browse:target { display:block; }
    .league-browse.open { display:block; }
    .league-grid { display:grid; grid-template-columns:repeat(3, minmax(0, 1fr)); gap:14px; }
    .browse-clubs:target { display:grid; grid-template-columns:repeat(3, minmax(0, 1fr)); gap:14px; }
    [hidden] { display:none !important; }
    @media (max-width: 980px) {
      .sport-list, .fed-list, .league-grid, .club-grid, .browse-clubs.open, .browse-clubs:target { grid-template-columns:repeat(2, minmax(0, 1fr)); }
      .page-grid { grid-template-columns:minmax(0, 1fr); }
      .sticky { position:static; }
    }
    @media (max-width: 640px) {
      body { background:var(--bg); background-image:none; }
      .app:not(.home-shell) { width:100%; }
      .home-shell { width:100%; min-height:100dvh; padding-bottom:40px; }
      .home-shell main { width:100%; padding:0 0 40px; }
      .home-top { height:auto; justify-content:space-between; padding:14px 16px 12px; background:transparent; border-bottom:0; backdrop-filter:none; }
      .home-brand { gap:9px; font-size:17px; }
      .home-brand .brand-mark { width:30px; height:30px; border-radius:9px; }
      .header-actions { margin-left:0; gap:8px; }
      .top .header-actions { margin-left:auto; }
      .iconbtn { width:38px; height:38px; }
      .mobile-hero { padding:4px 16px 0; text-align:left; }
      .mobile-hero h1 { font-size:26px; line-height:1.1; }
      .mobile-hero p { margin:6px 0 0; max-width:320px; font-size:15.5px; line-height:1.45; }
      .mobile-search-wrap { max-width:none; margin:0; padding:16px 16px 0; }
      .global-search { width:auto; margin:12px 16px 0; }
      .global-search.inline { padding-top:16px; margin-top:0; }
      .mobile-search { height:56px; border:0; border-radius:16px; box-shadow:0 1px 2px rgba(0,0,0,.05); gap:11px; padding:0 16px; }
      .mobile-search input { font-size:17px; }
      .mobile-section-title { padding:24px 18px 8px; font-size:17px; }
      .sport-list { padding:0 16px; grid-template-columns:minmax(0, 1fr); }
      .sport-card { min-height:62px; gap:13px; padding:12px 14px; }
      .sport-icon { width:40px; height:40px; border-radius:12px; }
      .sport-icon svg { width:20px; height:20px; }
      .sport-name { font-size:16px; }
      .fed-list { padding:0 16px; }
      .fed-row { min-height:66px; gap:13px; padding:13px 14px; }
      .fed-badge { width:40px; height:40px; border-radius:12px; font-size:14px; }
      .fed-name { font-size:15.5px; }
      .search-results { max-width:none; margin:0; padding:11px 0 0; }
      .home-shell .empty { margin:0 16px; }
      .home-shell .club-grid { padding:0 16px; }
      .browse-clubs { padding:14px 16px 0; }
      .top { height:62px; padding:0 16px; gap:14px; }
      .toplink { display:none; }
      .wrap { width:min(100% - 32px, 1120px); }
      .home { padding:28px 0 42px; gap:30px; }
      h1 { font-size:36px; }
      .lead { font-size:16px; }
      .search { height:56px; border-radius:16px; }
      .search input { font-size:16px; }
      .fed-list, .league-grid, .club-grid, .browse-clubs.open, .browse-clubs:target { grid-template-columns:1fr; gap:9px; }
      .page-grid { padding:16px 0 44px; gap:24px; }
      .subscribe { padding:20px 18px 18px; }
      .identity h1 { font-size:22px; }
      .crest { width:64px; height:64px; border-radius:16px; font-size:22px; }
      .fixture { gap:11px; }
      .break-marker { gap:7px; }
      .break-pill { font-size:11.5px; gap:6px; padding:5px 9px; }
      .league-browse { padding:14px 16px 0; }
      .league-grid { padding:0 16px; }
      .rail-card { gap:11px; padding:12px; }
      .rail-summary { gap:11px; }
      details[open] > .rail-games { padding-left:0; }
      .rail-line { flex-wrap:wrap; }
      .rail-format { margin-left:0; }
      .game-page { padding:16px 0 44px; }
      .game-hero { padding:20px 16px 17px; border-radius:16px; }
      .game-topline { display:block; }
      .game-tags { justify-content:flex-start; margin-top:10px; }
      .game-matchup { margin-top:10px; grid-template-columns:1fr; grid-auto-rows:auto; gap:6px; }
      .game-team.away { text-align:left; }
      .game-team { min-height:128px; display:grid; align-content:center; justify-content:stretch; justify-items:start; row-gap:5px; }
      .game-team.home { align-content:end; }
      .game-team.away { align-content:start; }
      .game-team a { display:block; }
      .game-scorecard { order:2; min-width:0; padding:0; gap:2px; }
      .game-score { font-size:30px; }
      .game-scorecard time { font-size:12px; }
      .game-team.away { order:3; }
      .game-venue-strip { display:grid; gap:8px; }
      .game-venue-strip span { white-space:normal; }
      .game-lower { grid-template-columns:1fr; gap:10px; }
      .game-team, .game-details, .game-side { padding:18px; }
      .detail-row { grid-template-columns:1fr; gap:3px; }
    }
    /* ── Container queries ──────────────────────────────────────── */
    .home-shell main { container-type:inline-size; container-name:home-main; }
    .wrap { container-type:inline-size; container-name:page-wrap; }
    @container home-main (max-width:900px) {
      .fed-list, .league-grid, .club-grid, .browse-clubs.open, .browse-clubs:target { grid-template-columns:repeat(2,minmax(0,1fr)); }
    }
    @container home-main (max-width:560px) {
      .fed-list, .league-grid, .club-grid, .browse-clubs.open, .browse-clubs:target { grid-template-columns:1fr; gap:9px; }
      .fed-list { padding:0 16px; }
      .league-grid { padding:0 16px; }
    }
    @container page-wrap (max-width:940px) {
      .page-grid { grid-template-columns:minmax(0,1fr); }
      .sticky { position:static; }
      .fed-list, .league-grid, .club-grid, .browse-clubs.open, .browse-clubs:target { grid-template-columns:repeat(2,minmax(0,1fr)); }
    }
    @container page-wrap (max-width:600px) {
      .fed-list, .league-grid, .club-grid, .browse-clubs.open, .browse-clubs:target { grid-template-columns:1fr; gap:9px; }
    }
    /* ── @starting-style: search results fade-slide in ─────────── */
    #search-results:not([hidden]) { transition:opacity 0.18s ease, transform 0.18s ease; }
    @starting-style { #search-results:not([hidden]) { opacity:0; transform:translateY(-5px); } }
    /* ── @starting-style: prev-section details expand ──────────── */
    details.prev-section > .month-group { transition:opacity 0.22s ease; }
    @starting-style { details:open.prev-section > .month-group { opacity:0; } }
    /* ── Copy-link popover + CSS anchor positioning ─────────────── */
    /* Hidden by default — only revealed via @supports in anchor-capable browsers */
    .copy-wrap { position:relative; display:flex; align-items:center; gap:8px; margin-top:14px; }
    .copy-wrap .copy { margin-top:0; flex:1; min-width:0; cursor:pointer; }
    .copy-btn { display:none; }
    [popover].copy-popover { display:none; }
    @supports (anchor-name: --x) {
      .copy-btn { display:inline-flex; align-items:center; flex-shrink:0; height:36px; padding:0 14px; border:1.5px solid var(--line); border-radius:10px; background:var(--ghost); color:var(--muted); font:700 13px inherit; cursor:pointer; white-space:nowrap; anchor-name:--copy-btn; }
      .copy-btn:hover { border-color:var(--accent); color:var(--accent); }
      [popover].copy-popover:popover-open { display:block; position:fixed; position-anchor:--copy-btn; bottom:anchor(top); left:anchor(center); translate:-50% -8px; margin:0; border:1.5px solid var(--accent-24); background:var(--card); color:var(--accent); font:700 12px inherit; padding:5px 12px; border-radius:8px; box-shadow:0 4px 12px var(--shadow-sm); white-space:nowrap; transition:opacity 0.15s ease, translate 0.15s ease; }
      @starting-style { [popover].copy-popover:popover-open { opacity:0; translate:-50% -2px; } }
      [popover].copy-popover:popover-open { opacity:1; translate:-50% -8px; }
    }