/* Shared styling for the league table, results, fixtures and podium pages.
   Same brand system as index.html / venue-guide.html, plus league furniture. */
:root{
  --ink:#15113D; --ink-soft:#241D63; --ink-line:#362C82;
  --paper:#FFF9EE; --paper-dim:#F3EBD8;
  --yellow:#FFE347; --pink:#FF3E7F; --teal:#2FE6B0; --white:#FFFFFF;
  --up:#127C55; --down:#C0264F;
  --font-display:'Space Grotesk',sans-serif; --font-body:'Inter',sans-serif;
  --radius:18px; --radius-sm:10px; --container:1080px;
}
*,*::before,*::after{ box-sizing:border-box; }
html{ scroll-behavior:smooth; }
body{ margin:0; font-family:var(--font-body); background:var(--paper); color:var(--ink); -webkit-font-smoothing:antialiased; overflow-x:hidden; }
a{ color:inherit; text-decoration:none; }
h1,h2,h3,h4{ font-family:var(--font-display); line-height:1.05; margin:0 0 .5em; letter-spacing:-0.01em; }
p{ line-height:1.65; margin:0 0 1em; }
.wrap{ max-width:var(--container); margin:0 auto; padding:0 24px; }
:focus-visible{ outline:3px solid var(--pink); outline-offset:3px; }
@media (prefers-reduced-motion: reduce){ *{ animation-duration:.001ms !important; transition-duration:.001ms !important; scroll-behavior:auto !important; } }

.site-header{ position:sticky; top:0; z-index:100; background:var(--ink); border-bottom:3px solid var(--yellow); }
.nav{ display:flex; align-items:center; justify-content:space-between; gap:16px; padding:14px 24px; max-width:var(--container); margin:0 auto; }
.brand{ display:flex; align-items:center; gap:.6em; font-family:var(--font-display); font-weight:700; color:var(--paper); font-size:1.1rem; }
.brand .dot{ width:12px; height:12px; border-radius:50%; background:var(--pink); box-shadow:0 0 0 4px rgba(255,62,127,.25); }
.nav-links{ display:flex; align-items:center; gap:14px; flex-wrap:wrap; }
.nav a.link{ font-size:.88rem; font-weight:600; color:var(--paper); }
.nav a.link:hover{ color:var(--yellow); }
.nav a.link[aria-current="page"]{ color:var(--yellow); }
.nav a.pill{ font-size:.88rem; font-weight:700; color:var(--ink); background:var(--yellow); padding:9px 16px; border-radius:999px; }

.hero{ background:var(--ink); color:var(--paper); padding:56px 0 46px; position:relative; overflow:hidden; }
.hero::after{ content:""; position:absolute; left:0; right:0; bottom:-1px; height:22px; background:linear-gradient(135deg,var(--paper) 25%,transparent 25%) 0 50%, linear-gradient(-135deg,var(--paper) 25%,transparent 25%) 0 50%; background-size:22px 22px; background-repeat:repeat-x; }
.eyebrow{ display:inline-block; font-family:var(--font-display); font-weight:700; font-size:.75rem; letter-spacing:.14em; text-transform:uppercase; color:var(--ink); background:var(--teal); padding:6px 14px; border-radius:999px; margin-bottom:14px; }
.hero h1{ font-size:clamp(2rem,4.6vw,2.9rem); max-width:720px; }
.hero .lede{ max-width:640px; color:#DCD8FA; font-size:1.04rem; }
.stat-row{ display:flex; flex-wrap:wrap; gap:12px; margin:22px 0 6px; }
.stat-chip{ background:var(--ink-soft); border:2px solid var(--ink-line); border-radius:var(--radius-sm); padding:12px 16px; min-width:120px; }
.stat-chip b{ display:block; font-family:var(--font-display); font-size:1.4rem; color:var(--yellow); }
.stat-chip span{ font-size:.78rem; color:#C7C1F2; }

.controls{ padding:22px 0 4px; background:var(--paper-dim); border-bottom:2px solid var(--ink); position:sticky; top:61px; z-index:90; }
.controls .wrap{ display:flex; gap:12px; align-items:center; flex-wrap:wrap; padding-bottom:12px; }
.search-input{ flex:1; min-width:210px; padding:13px 18px; border-radius:999px; border:2px solid var(--ink); font-family:var(--font-body); font-size:1rem; background:var(--white); color:var(--ink); }
.search-count{ font-size:.85rem; color:#5B5490; font-weight:600; white-space:nowrap; }
.chip-row{ display:flex; gap:8px; flex-wrap:wrap; padding-bottom:16px; }
.chip{ font-family:var(--font-display); font-weight:700; font-size:.82rem; padding:7px 14px; border-radius:999px; border:2px solid var(--ink); background:var(--white); color:var(--ink); cursor:pointer; }
.chip[aria-pressed="true"]{ background:var(--ink); color:var(--yellow); }
.chip[disabled]{ opacity:.45; cursor:not-allowed; }

section{ padding:40px 0; }
.section-title{ font-size:clamp(1.5rem,3vw,2rem); }
.section-sub{ color:#5B5490; max-width:680px; margin-bottom:24px; }

/* Division panels shared by all three pages */
.division{ margin-bottom:28px; }
.division.hidden{ display:none; }
.division-head{ display:flex; align-items:baseline; justify-content:space-between; gap:12px; flex-wrap:wrap; margin-bottom:10px; }
.division-head h3{ margin:0; font-size:1.15rem; }
.division-head .meta{ font-size:.78rem; font-weight:600; color:#5B5490; }
.panel{ background:var(--white); border:2px solid var(--ink); border-radius:var(--radius-sm); box-shadow:4px 4px 0 var(--ink); overflow:hidden; }
.table-scroll{ overflow-x:auto; -webkit-overflow-scrolling:touch; }

table.league{ width:100%; border-collapse:collapse; font-size:.88rem; min-width:740px; }
table.league th, table.league td{ padding:9px 8px; text-align:right; border-bottom:1px solid rgba(21,17,61,.1); white-space:nowrap; }
table.league th{ font-family:var(--font-display); font-size:.72rem; letter-spacing:.06em; text-transform:uppercase; color:var(--paper); background:var(--ink); }
table.league th.team, table.league td.team{ text-align:left; white-space:normal; min-width:190px; }
table.league td.pos{ font-family:var(--font-display); font-weight:700; width:52px; }
table.league td.team b{ font-weight:700; }
table.league td.base{ color:#5B5490; }
table.league td.pts{ font-family:var(--font-display); font-weight:700; font-size:1rem; }
table.league td.streak{ font-family:var(--font-display); font-weight:700; }
table.league td.streak.live{ color:#087F6A; background:rgba(13,166,144,.1); }
.streak-division{ margin-top:46px; padding-top:30px; border-top:2px dashed rgba(21,17,61,.28); }
.streak-division .division-head h3{ display:flex; align-items:center; gap:9px; }
.streak-mark{ display:inline-block; width:12px; height:18px; border-radius:999px; background:var(--teal); border:2px solid var(--ink); box-shadow:3px 0 0 var(--pink); vertical-align:-3px; margin-right:7px; }
table.streak-table{ min-width:560px; }
table.league tbody tr:last-child td{ border-bottom:none; }
table.league tbody tr.match{ background:rgba(255,227,71,.16); }
table.league tr.dim td{ opacity:.5; }

.zone{ display:inline-block; width:6px; height:22px; border-radius:3px; margin-right:8px; vertical-align:-5px; background:transparent; }
.zone.promo{ background:var(--teal); }
.zone.rel{ background:var(--pink); }
.move{ font-size:.78rem; font-weight:700; }
.move.up{ color:var(--up); }
.move.down{ color:var(--down); }
.move.same{ color:#8A85AD; }
.tag{ display:inline-block; font-size:.66rem; font-weight:700; letter-spacing:.06em; text-transform:uppercase; padding:3px 8px; border-radius:999px; background:var(--paper-dim); color:var(--ink-soft); margin-left:6px; }
.tag.noshow{ background:var(--pink); color:var(--white); }
/* An absence the week has assumed rather than seen: same rule applied, but
   held apart from a no-show that is settled. */
.tag.noshow.assumed{ background:transparent; border:1px dashed var(--pink); color:#C0264F; }
.tag.nsw{ background:var(--teal); }

/* Podium finishes: one table per place, so the medal replaces the zone marker.
   The sweets list is the bottom of the night, so it takes the same pink the
   league tables use for the drop zone. */
.zone.gold{ background:var(--yellow); }
.zone.silver{ background:#B9BEDA; }
.zone.bronze{ background:#C77B3C; }
.zone.sweets{ background:var(--pink); }
.medal{ display:inline-block; width:12px; height:12px; border-radius:50%; margin-right:8px; border:2px solid var(--ink); vertical-align:0; }
.medal.gold{ background:var(--yellow); }
.medal.silver{ background:#B9BEDA; }
.medal.bronze{ background:#C77B3C; }
.medal.sweets{ background:var(--pink); }
.tag.venues{ background:transparent; border:1px dashed rgba(21,17,61,.35); color:#5B5490; }

/* A list cut to its top twenty. The rest of it is rendered and held back
   rather than dropped, so a search still reaches a team's record from a row
   the cut hid, and the button under the table opens the whole list out. */
.division:not(.expanded) table.league tbody tr.beyond{ display:none; }
.division:not(.expanded) table.league tbody tr.beyond.match{ display:table-row; }
.cut{ display:flex; align-items:center; justify-content:space-between; gap:12px; flex-wrap:wrap;
  padding:11px 16px; border-top:2px solid var(--ink); background:var(--paper-dim); }
.cut-text{ font-size:.78rem; font-weight:600; color:#5B5490; }
.cut-toggle{ font-family:var(--font-display); font-weight:700; font-size:.78rem; padding:7px 14px;
  border-radius:999px; border:2px solid var(--ink); background:var(--white); color:var(--ink); cursor:pointer; }
.cut-toggle:hover{ background:var(--yellow); }
table.league th.latest, table.league td.latest{ text-align:left; }
table.league td.latest b{ font-family:var(--font-display); font-weight:700; display:block; font-size:.82rem; }
table.league td.latest span{ display:block; font-size:.72rem; color:#5B5490; }

/* Results / fixtures match rows */
.match-list{ display:flex; flex-direction:column; }
.match-row{ display:grid; grid-template-columns:1fr 108px 1fr; gap:12px; align-items:center; padding:11px 16px; border-bottom:1px solid rgba(21,17,61,.1); }
.match-row:last-child{ border-bottom:none; }
.match-row.hidden{ display:none; }
.match-row .side{ font-size:.92rem; }
.match-row .side.home{ text-align:right; }
.match-row .side.win{ font-weight:700; }
.match-row .side.lose{ color:#6B6595; }
.match-row .side .base-note{ display:block; margin-top:3px; font-family:var(--font-display); font-weight:700; font-size:.7rem; letter-spacing:.06em; text-transform:uppercase; color:#5B5490; }
.score{ display:flex; align-items:center; justify-content:center; gap:6px; font-family:var(--font-display); font-weight:700; }
.score .val{ min-width:38px; text-align:center; padding:5px 6px; border-radius:8px; border:2px solid var(--ink); background:var(--paper-dim); font-size:.92rem; }
.score .val.win{ background:var(--yellow); }
.score .sep{ color:#8A85AD; font-size:.8rem; }
.score.pending{ color:#8A85AD; font-size:.78rem; letter-spacing:.08em; text-transform:uppercase; }
@media (max-width:620px){
  .match-row{ grid-template-columns:1fr; gap:4px; text-align:center; }
  .match-row .side.home{ text-align:center; }
  .score{ order:3; }
}

.legend{ background:var(--paper-dim); border-top:2px solid var(--ink); border-bottom:2px solid var(--ink); }
.legend-grid{ display:grid; grid-template-columns:repeat(auto-fit,minmax(240px,1fr)); gap:16px; }
.legend-card{ background:var(--white); border:2px solid var(--ink); border-radius:var(--radius-sm); padding:16px 18px; box-shadow:4px 4px 0 var(--ink); }
.legend-card h3{ font-size:.95rem; margin-bottom:8px; }
.legend-card ul{ margin:0; padding-left:18px; font-size:.85rem; color:#5B5490; line-height:1.6; }
.legend-card p{ font-size:.85rem; color:#5B5490; margin:0; }
.key-row{ display:flex; flex-wrap:wrap; gap:14px; font-size:.82rem; font-weight:600; color:var(--ink-soft); margin-bottom:20px; }
.key-row span{ display:flex; align-items:center; gap:6px; }

.state{ text-align:center; padding:40px 0; color:#5B5490; }
/* Says how much of a part played week is in, above the table or results
   that are counting the rest of it as no-shows. */
.live-note{ background:var(--white); border:2px solid var(--ink); border-left:8px solid var(--pink);
  border-radius:var(--radius-sm); box-shadow:4px 4px 0 var(--ink); padding:14px 18px;
  margin:0 0 20px; font-size:.86rem; color:var(--ink-soft); max-width:760px; }
.live-note.hidden{ display:none; }

/* On narrow screens the filter bar is too tall to pin without eating the page. */
@media (max-width:760px){
  .controls{ position:static; }
}
.state.hidden{ display:none; }

.site-footer{ background:var(--ink); color:#C7C1F2; padding:32px 0 24px; border-top:3px solid var(--yellow); }
.footer-bottom{ display:flex; justify-content:space-between; flex-wrap:wrap; gap:10px; font-size:.82rem; }
.footer-bottom a:hover{ color:var(--yellow); }
