/* Self-hosted variable fonts (latin subset, one file per family, all
   weights). No third-party font connections; pages preload these two files.
   font-display:swap shows system-font text immediately while they arrive. */
@font-face{
  font-family:'Big Shoulders Display';
  font-style:normal;
  font-weight:100 900;
  font-display:swap;
  src:url('../fonts/BigShouldersDisplay.woff2') format('woff2');
}
@font-face{
  font-family:'Inter Tight';
  font-style:normal;
  font-weight:100 900;
  font-display:swap;
  src:url('../fonts/InterTight.woff2') format('woff2');
}

:root{
  --navy:#071a33;
  --navy-2:#10284a;
  --blue:#183766;
  --gold:#b99025;
  --gold-2:#d7b762;
  --cream:#eef1f5;
  --paper:#ffffff;
  --soft:#f4f6f9;
  --ink:#142033;
  --muted:#637083;
  --line:rgba(7,26,51,.15);
  --line-strong:rgba(7,26,51,.24);
  --ok:#2f7d4f;
  --danger:#aa2233;
  --shadow:0 18px 44px -36px rgba(7,26,51,.62);
}

*{ box-sizing:border-box; }
html{ scroll-behavior:smooth; background:var(--overscroll-blue,#123e73); overflow-x:hidden; }
html,body{ margin:0; padding:0; }
body{
  min-height:100vh;
  background:var(--cream);
  color:var(--ink);
  font-family:"Inter Tight",system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
  /* `clip` not `hidden`: overflow-x:hidden forces overflow-y to compute to
     `auto`, which makes BODY a scroll container that never actually scrolls —
     that silently breaks `position:sticky` on the news ticker (it anchors to
     body's dead scrollport instead of the viewport). `clip` clips exactly the
     same but creates no scroll container. If a browser ever ignores `clip`,
     html's own overflow-x:hidden still prevents sideways scrolling. */
  overflow-x:clip;
}
body.drawer-open{ overflow:hidden; }
a{ color:inherit; }
button,input,select,textarea{ font:inherit; }
::selection{ background:rgba(215,183,98,.35); color:var(--ink); }
/* Keyboard focus: a layered ring that stays visible on ANY background — the
   gold outline reads on the dark mast / drawer / side-rail / hero, the navy
   box-shadow reads on the light pages. One rule, no fragile per-surface list.
   The box-shadow is !important so an element's own resting shadow (e.g. the
   skip-link, FAB) can't suppress the light-surface half of the ring on focus. */
:focus-visible{ outline:3px solid var(--gold-2); outline-offset:3px; box-shadow:0 0 0 3px var(--navy) !important; }

.wrap{
  width:min(100%,1320px);
  margin:0 auto;
  padding:18px 14px 90px;
}
.skip-link{
  position:absolute;
  left:18px;
  top:10px;
  z-index:100;
  transform:translateY(-150%);
  padding:10px 13px;
  border-radius:6px;
  background:#fff;
  color:var(--navy);
  font-weight:900;
  text-decoration:none;
  box-shadow:var(--shadow);
}
.skip-link:focus{ transform:translateY(0); }

/* Header and navigation */
.mast{
  position:relative;
  isolation:isolate;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
  padding:16px 0 18px;
  background:transparent;
  color:#fff;
  clip-path:inset(0 -100vmax);
}
/* Full-bleed banner field — a layered broadcast-graphics composition:
   1. film grain (SVG feTurbulence, tiled) so the field reads as material
   2. ball-flight ring geometry (inline SVG) weighted to the corners
   3. diagonal light beams with one gold cut, hard-stop 115° gradient
   4. gold corner glow behind the brand lockup
   5. deep navy base gradient
   The gold brand stripe lives on .mast::after so it can shimmer. */
.mast::before{
  content:"";
  position:absolute;
  top:0;
  bottom:0;
  left:-100vmax;
  right:-100vmax;
  z-index:-1;
  border-bottom:1px solid rgba(215,183,98,.4);
  background:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 0.05 0'/%3E%3C/filter%3E%3Crect width='160' height='160' filter='url(%23n)'/%3E%3C/svg%3E") repeat left top / 160px 160px,
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1200 360' preserveAspectRatio='xMidYMid slice'%3E%3Cg fill='none' stroke-width='2'%3E%3Ccircle cx='1060' cy='70' r='220' stroke='rgba(255,255,255,0.05)'/%3E%3Ccircle cx='1060' cy='70' r='156' stroke='rgba(215,183,98,0.09)'/%3E%3Ccircle cx='1060' cy='70' r='98' stroke='rgba(255,255,255,0.04)'/%3E%3Ccircle cx='870' cy='330' r='120' stroke='rgba(255,255,255,0.045)'/%3E%3Ccircle cx='190' cy='340' r='170' stroke='rgba(255,255,255,0.04)'/%3E%3Ccircle cx='190' cy='340' r='118' stroke='rgba(215,183,98,0.06)'/%3E%3C/g%3E%3C/svg%3E") center / cover no-repeat,
    linear-gradient(115deg, transparent 0 36%, rgba(255,255,255,.03) 36% 45%, transparent 45% 58%, rgba(215,183,98,.055) 58% 61.5%, transparent 61.5% 76%, rgba(255,255,255,.025) 76% 87%, transparent 87%),
    radial-gradient(130% 175% at 16% 0%, rgba(215,183,98,.17), transparent 52%),
    linear-gradient(165deg,#16345f 0%, #0b2443 52%, #061629 100%);
}
/* Gold brand stripe: its own layer so the sheen can sweep along it. */
.mast::after{
  content:"";
  position:absolute;
  top:0;
  left:-100vmax;
  right:-100vmax;
  height:3px;
  z-index:2;
  background:linear-gradient(90deg,#a87b13 0%,#d7b762 32%,#f3e3ae 50%,#d7b762 68%,#a87b13 100%);
  background-size:220% 100%;
}
.brand-lockup{ display:flex; align-items:center; gap:14px; min-width:0; }
.brand-rack{ width:72px; max-width:23vw; height:auto; flex:none; filter:drop-shadow(0 12px 20px rgba(0,0,0,.45)); }
.brand-text{ min-width:0; }
.kicker{
  margin:0 0 5px;
  color:var(--gold-2);
  font-size:10px;
  font-weight:900;
  letter-spacing:.22em;
  text-transform:uppercase;
}
h1,h2,h3{ margin:0; color:var(--navy); font-family:"Big Shoulders Display",sans-serif; font-weight:900; text-transform:uppercase; line-height:.95; }
.league-name{ color:#fff; font-size:clamp(30px,8vw,58px); letter-spacing:.01em; text-shadow:0 2px 0 rgba(0,0,0,.16); }
.page-title{
  display:flex;
  align-items:center;
  flex-wrap:wrap;
  gap:8px;
  margin-top:8px;
}
.page-chip{
  display:inline-flex;
  align-items:center;
  padding:4px 11px;
  border-radius:999px;
  background:var(--gold-2);
  color:#071a33;
  font-size:11px;
  font-weight:900;
  letter-spacing:.08em;
  text-transform:uppercase;
}
.page-sub{
  color:rgba(255,255,255,.74);
  font-size:11.5px;
  font-weight:800;
  letter-spacing:.07em;
  text-transform:uppercase;
}
.tag{ display:none; }

.nav-shell{ display:none; }
.nav-toggle,.site-menu-button{
  display:none;
  min-height:44px;
  padding:0 12px;
  border:1px solid rgba(215,183,98,.45);
  border-radius:8px;
  background:rgba(255,255,255,.08);
  color:#fff;
  cursor:pointer;
  font-weight:900;
  text-transform:uppercase;
  letter-spacing:.08em;
}

.desktop-side-menu{ display:none; }
.side-menu-brand{ display:flex; align-items:center; gap:10px; padding-bottom:18px; border-bottom:1px solid rgba(215,183,98,.28); }
.side-menu-brand img{ width:52px; }
.side-menu-brand span{ display:block; color:var(--gold-2); font-size:11px; font-weight:900; letter-spacing:.16em; text-transform:uppercase; }
.side-menu-brand strong{ color:#fff; font-family:"Big Shoulders Display",sans-serif; font-size:31px; line-height:1; text-transform:uppercase; }
.side-menu-collapse{
  display:flex;
  align-items:center;
  gap:10px;
  min-height:42px;
  width:100%;
  padding:8px 10px;
  border:1px solid rgba(215,183,98,.34);
  border-radius:8px;
  background:rgba(255,255,255,.06);
  color:#fff;
  cursor:pointer;
  font-size:11px;
  font-weight:900;
  letter-spacing:.12em;
  text-transform:uppercase;
}
.side-menu-collapse-icon{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:26px;
  height:26px;
  border-radius:50%;
  background:var(--gold-2);
  color:#081d38;
  font-size:22px;
  line-height:1;
}
.side-menu-section{ display:grid; gap:8px; }
.side-menu-section h2{
  margin:6px 0 0;
  color:rgba(255,255,255,.55);
  font-family:"Inter Tight",system-ui,sans-serif;
  font-size:10px;
  letter-spacing:.16em;
}
.side-menu-section nav{ display:grid; gap:6px; }
.side-menu-section a{
  display:grid;
  grid-template-columns:28px minmax(0,1fr);
  align-items:center;
  gap:9px;
  min-height:42px;
  padding:7px 9px;
  border:1px solid transparent;
  border-radius:8px;
  color:rgba(255,255,255,.76);
  text-decoration:none;
}
.side-menu-section a span{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:26px;
  height:26px;
  border-radius:6px;
  background:rgba(255,255,255,.08);
  font-size:13px;
}
.side-menu-section a strong{ font-size:12px; font-weight:900; letter-spacing:.08em; text-transform:uppercase; }
.side-menu-section a:hover,.side-menu-section a.active{ color:#fff; background:rgba(255,255,255,.08); border-color:rgba(215,183,98,.38); }
.side-menu-section a.active{ box-shadow:inset 3px 0 0 var(--gold-2); }

.nav-scrim{
  position:fixed;
  inset:0;
  z-index:70;
  background:rgba(7,26,51,.56);
  opacity:0;
  transition:opacity .18s ease;
}
.nav-scrim.open{ opacity:1; }
.nav-drawer{
  position:fixed;
  inset:0 0 0 auto;
  z-index:80;
  width:min(88vw,380px);
  padding:16px;
  background:var(--cream);
  box-shadow:-20px 0 52px -34px rgba(7,26,51,.88);
  transform:translateX(100%);
  transition:transform .2s ease;
  overflow:auto;
}
.nav-drawer.open{ transform:translateX(0); }
.drawer-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  padding:14px;
  border-radius:8px;
  background:linear-gradient(150deg,var(--navy),var(--blue));
  color:#fff;
}
.drawer-brand{ display:flex; align-items:center; gap:10px; }
.drawer-brand img{ width:44px; }
.drawer-brand span{ display:block; color:var(--gold-2); font-size:10px; font-weight:900; letter-spacing:.16em; text-transform:uppercase; }
.drawer-brand strong{ font-family:"Big Shoulders Display",sans-serif; font-size:28px; text-transform:uppercase; }
.drawer-close{
  width:44px;
  height:44px;
  border:1px solid rgba(215,183,98,.45);
  border-radius:8px;
  background:rgba(255,255,255,.08);
  color:#fff;
  cursor:pointer;
  font-size:24px;
}
.drawer-nav{ display:grid; gap:8px; margin-top:14px; }
.drawer-link{
  display:grid;
  grid-template-columns:34px minmax(0,1fr);
  align-items:center;
  gap:10px;
  min-height:54px;
  padding:10px 12px;
  border:1px solid var(--line);
  border-radius:8px;
  background:#fff;
  text-decoration:none;
}
.drawer-link.active{ border-color:var(--gold); background:rgba(215,183,98,.14); }
.drawer-icon{ color:var(--gold); }
.mobile-menu-fab{
  position:fixed;
  right:14px;
  bottom:14px;
  z-index:60;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:9px;
  min-height:52px;
  padding:0 17px 0 13px;
  border:1px solid rgba(255,255,255,.22);
  border-radius:999px;
  background:linear-gradient(145deg,var(--navy),var(--navy-2));
  color:#fff;
  box-shadow:0 18px 40px -18px rgba(7,26,51,.72);
  cursor:pointer;
}
.mobile-menu-fab span{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:32px;
  height:32px;
  border-radius:50%;
  background:var(--gold-2);
  color:#071a33;
  font-weight:900;
}
.mobile-menu-fab strong{ font-family:"Big Shoulders Display",sans-serif; font-size:19px; letter-spacing:.06em; text-transform:uppercase; }

/* Layout primitives */
#content{ display:grid; gap:18px; margin-top:16px; min-width:0; max-width:100%; }
#content > *{ min-width:0; max-width:100%; }
.card,.summary-card,.sidebar-card,.empty-state,.quick-card,.menu-card,.team-card-link,.league-card,.player-card,.mini-result-card,.history-card{
  border:1px solid var(--line);
  border-radius:8px;
  background:var(--paper);
  box-shadow:var(--shadow);
}
.card{ padding:18px; min-width:0; }
.card .card{ box-shadow:none; }
h2{ font-size:clamp(26px,4vw,38px); margin-bottom:8px; }
h3{ font-size:clamp(21px,3vw,28px); margin-bottom:8px; }
.sec-note,.meta{ color:var(--muted); font-size:14px; line-height:1.45; }
.sec-note{ margin:0 0 14px; }
/* ---------------------------------------------------------------------------
   Rolling news ticker — committee broadcast directly beneath the masthead on
   every page, which sticks to the top of the screen once the header scrolls
   away. Reads as a match-night scoreboard strip: navy plate, gold rule beneath,
   messages separated by a gold ball. In normal flow, so the page's own left
   padding already clears the fixed desktop side menu.
   z-index sits under the drawer (80), scrim (70) and menu button (60). */
.ticker{
  position:sticky;
  top:0;
  z-index:55;
  display:flex;
  align-items:stretch;
  min-height:44px;
  margin:12px 0 4px;
  border-radius:9px;
  overflow:hidden;                 /* clip the rolling track to the rounded ends */
  background:linear-gradient(180deg,var(--navy-2),var(--navy));
  border-bottom:2px solid var(--gold);
  box-shadow:0 16px 34px -26px rgba(7,26,51,.85);
}
.ticker-label{
  flex:0 0 auto;
  display:flex; align-items:center;
  padding:0 13px;
  background:rgba(0,0,0,.28);
  border-right:1px solid rgba(215,183,98,.34);
  color:var(--gold-2);
  font:900 13px/1 "Big Shoulders Display",sans-serif;
  letter-spacing:.09em;
  text-transform:uppercase;
  white-space:nowrap;
}
/* Centre the track vertically — the label is centred, the messages must match. */
.ticker-viewport{ flex:1 1 auto; overflow:hidden; display:flex; align-items:center; }
.ticker-track{
  display:flex;
  width:max-content;
  animation:ticker-roll var(--ticker-seconds,30s) linear infinite;
}
/* Stop for anyone reading or tabbing through it. */
.ticker:hover .ticker-track,
.ticker:focus-within .ticker-track{ animation-play-state:paused; }
.ticker-run{ display:flex; align-items:center; flex:0 0 auto; }
.ticker-item{
  color:var(--cream);
  font:700 13.5px/1 "Inter Tight",sans-serif;
  white-space:nowrap;
}
.ticker-ball{
  flex:0 0 auto;
  width:8px; height:8px; margin:0 18px;
  border-radius:50%;
  background:radial-gradient(circle at 32% 30%, var(--gold-2), var(--brand-gold-deep,#a87b13));
}
.ticker-close{
  flex:0 0 auto;
  width:42px;
  border:0; border-left:1px solid rgba(215,183,98,.22);
  background:transparent;
  color:rgba(238,241,245,.7);
  font-size:12px; line-height:1; cursor:pointer;
}
.ticker-close:hover{ color:var(--gold-2); background:rgba(0,0,0,.24); }
.ticker-close:focus-visible{ outline:2px solid var(--gold-2); outline-offset:-3px; color:var(--gold-2); }
@keyframes ticker-roll{ from{ transform:translateX(0); } to{ transform:translateX(-50%); } }

/* Narrow phones: claw back reading width from the label and the separators. */
@media (max-width:479px){
  .ticker-label{ padding:0 9px; font-size:12px; letter-spacing:.05em; }
  .ticker-ball{ margin:0 12px; }
}

/* Reduced motion: never auto-scroll — the reader pans it themselves. */
@media (prefers-reduced-motion: reduce){
  .ticker-track{ animation:none; }
  .ticker-viewport{ overflow-x:auto; }
  .ticker-run + .ticker-run{ display:none; }
}

.footer{ margin-top:24px; padding:18px 0; color:var(--muted); font-size:12px; text-align:center; }
.footer::before{ content:"Leeds Community Pool League - Official league hub"; }
.footer{ font-size:0; }
.footer::before{ font-size:12px; }
/* Footer is font-size:0 to hide its per-page text; affiliations must opt back in. */
.footer-affiliations{ margin-top:7px; font-size:11px; letter-spacing:.06em; text-transform:uppercase; color:var(--muted); }
.footer-affiliations a{ color:var(--gold,#b99025); font-weight:900; text-decoration:none; }
.footer-affiliations a:hover,.footer-affiliations a:focus-visible{ text-decoration:underline; }
.footer-copyright{ margin-top:6px; font-size:11px; color:var(--muted); }
/* Rules page governing-body link list */
.link-list{ list-style:none; margin:8px 0 0; padding:0; display:grid; gap:8px; }
.link-list a{ font-weight:800; }

/* ---- Media page ---------------------------------------------------------- */
/* overflow:hidden lets the edge-to-edge photo bands clip to the card's
   rounded corners on mobile. */
.media-post{ overflow:hidden; }
.media-post + .media-post{ margin-top:16px; }
.media-post-head{ margin-bottom:12px; }
.media-post-head h2{ margin:0; }
.media-date{ display:block; margin-top:5px; color:var(--gold); font-size:12px; font-weight:900; letter-spacing:.08em; text-transform:uppercase; }
.media-body{ margin:0 0 14px; color:var(--ink); line-height:1.55; }

/* One photo → full-width hero; two → paired; three+ → uniform tile grid. */
/* No width:100% — a block button fills its container anyway, and leaving
   width auto lets the mobile negative margins widen it edge-to-edge. */
.media-hero{ display:block; width:auto; padding:0; border:1px solid var(--line); border-radius:10px; overflow:hidden; background:var(--soft); cursor:pointer; }
.media-hero img{ display:block; width:100%; height:auto; max-height:560px; object-fit:cover; transition:transform .25s ease; }
.media-hero:hover img,.media-hero:focus-visible img{ transform:scale(1.02); }
.media-grid{ display:grid; grid-template-columns:repeat(auto-fill,minmax(150px,1fr)); gap:8px; }
.media-grid.cols-2{ grid-template-columns:repeat(2,1fr); }
.media-thumb{
  position:relative;
  padding:0;
  border:1px solid var(--line);
  border-radius:8px;
  background:var(--soft);
  cursor:pointer;
  overflow:hidden;
  aspect-ratio:1 / 1;
}
.media-thumb img{ width:100%; height:100%; object-fit:cover; display:block; transition:transform .2s ease; }
.media-thumb:hover img,.media-thumb:focus-visible img{ transform:scale(1.04); }

/* Share lives in a footer row, never floated in the header (where it wrapped). */
.media-post-foot{ margin-top:14px; }
.media-share{
  display:inline-flex;
  align-items:center;
  gap:7px;
  min-height:42px;
  padding:9px 16px;
  border-radius:999px;
  background:#25d366;
  color:#062d16;
  font-weight:900;
  font-size:13px;
  letter-spacing:.02em;
  text-decoration:none;
  white-space:nowrap;
}
.media-share svg{ flex:none; }
.media-share:hover,.media-share:focus-visible{ filter:brightness(1.05); }
.media-videos{ display:grid; gap:12px; margin-bottom:14px; }
.media-video{ position:relative; width:100%; aspect-ratio:16 / 9; border-radius:8px; overflow:hidden; background:#000; }
.media-video iframe{ position:absolute; inset:0; width:100%; height:100%; border:0; }
.media-video-link{ justify-self:start; }

/* Lightbox: full-screen photo viewer above the drawer (z 80). */
.media-lightbox{
  position:fixed;
  inset:0;
  z-index:200;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:20px;
  background:rgba(7,26,51,.93);
}
/* display:flex above overrides the [hidden] attribute's display:none, so the
   hidden state must be made explicit or the overlay shows (and traps) on load. */
.media-lightbox[hidden]{ display:none; }
body.lightbox-open{ overflow:hidden; }
.media-lb-img{ max-width:92vw; max-height:86vh; border-radius:8px; box-shadow:0 24px 60px -24px rgba(0,0,0,.8); }
.media-lb-close,.media-lb-nav{
  position:absolute;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border:1px solid rgba(215,183,98,.5);
  border-radius:999px;
  background:rgba(7,26,51,.65);
  color:#fff;
  cursor:pointer;
  line-height:1;
}
.media-lb-close{ top:14px; right:14px; width:48px; height:48px; font-size:30px; }
.media-lb-nav{ top:50%; transform:translateY(-50%); width:52px; height:52px; font-size:34px; }
.media-lb-nav.prev{ left:10px; }
.media-lb-nav.next{ right:10px; }

/* Mobile: photos run edge-to-edge inside the card (cancel the 16px card
   padding), tight tile gaps, full-width share CTA. */
@media (max-width:760px){
  .media-grid{ grid-template-columns:repeat(3,1fr); gap:3px; margin:4px -16px 0; }
  .media-grid.cols-2{ grid-template-columns:repeat(2,1fr); }
  .media-grid .media-thumb{ border-radius:0; border:0; }
  .media-hero{ margin:0 -16px; border-radius:0; border-left:0; border-right:0; }
  .media-hero img{ max-height:78vh; }
  .media-share{ width:100%; justify-content:center; }
}

/* ---- Admin: media publishing -------------------------------------------- */
.media-upload-preview{ display:grid; grid-template-columns:repeat(auto-fill,minmax(88px,1fr)); gap:8px; margin-top:10px; }
.media-upload-preview figure{ position:relative; margin:0; aspect-ratio:1 / 1; border-radius:6px; overflow:hidden; border:1px solid var(--line); }
.media-upload-preview img{ width:100%; height:100%; object-fit:cover; }
.media-upload-preview button{ position:absolute; top:3px; right:3px; width:24px; height:24px; border:0; border-radius:50%; background:rgba(170,34,51,.92); color:#fff; cursor:pointer; font-weight:900; line-height:1; }
.media-progress{ margin-top:10px; color:var(--muted); font-size:13px; }
.media-admin-list{ display:grid; gap:10px; margin-top:8px; }
.media-admin-row{ display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:10px 12px; padding:11px 13px; border:1px solid var(--line); border-radius:8px; background:#fff; }
.media-admin-row .meta{ font-size:12px; }
.media-admin-actions{ display:flex; gap:8px; flex:none; }
.media-video-fields{ display:grid; gap:8px; }

.section-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
  margin-bottom:14px;
}
.section-head h2,.section-head h3{ margin:0; }
.section-actions{ display:flex; align-items:center; justify-content:flex-end; gap:10px; flex-wrap:wrap; }

.grid{ display:grid; gap:14px; }
.grid.two,.homepage-grid,.team-dashboard,.home-split{ grid-template-columns:1fr; }
.grid.three,.quick-grid,.menu-grid,.team-grid,.info-grid,.metric-grid{ grid-template-columns:1fr; }
/* Four summary stats: 2x2 on small screens, one row on wide screens. */
.grid.four{ grid-template-columns:repeat(2,minmax(0,1fr)); }

/* Controls */
label{
  display:block;
  margin-bottom:6px;
  color:var(--gold);
  font-size:11px;
  font-weight:900;
  letter-spacing:.1em;
  text-transform:uppercase;
}
input,select,textarea{
  width:100%;
  min-height:44px;
  padding:10px 12px;
  border:1.5px solid var(--line);
  border-radius:8px;
  background:#fff;
  color:var(--ink);
}
textarea{ min-height:110px; resize:vertical; }
input:focus,select:focus,textarea:focus{ border-color:var(--navy); outline:0; box-shadow:0 0 0 3px rgba(16,40,74,.12); }
.controls{ display:grid; grid-template-columns:1fr; gap:12px; margin:14px 0; align-items:end; }
.field{ min-width:0; }
button.action,.jump-button{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  min-height:46px;
  padding:11px 16px;
  border:1.5px solid var(--navy);
  border-radius:8px;
  background:var(--navy);
  color:#fff;
  cursor:pointer;
  text-decoration:none;
  font-family:"Big Shoulders Display",sans-serif;
  font-size:18px;
  font-weight:900;
  letter-spacing:.05em;
  text-transform:uppercase;
  transition:transform .16s ease, background .16s ease, color .16s ease, border-color .16s ease;
}
button.action:hover,.jump-button:hover{ transform:translateY(-1px); }
button.action.secondary,.jump-button.secondary,.button-like{
  background:#fff;
  color:var(--navy);
  border-color:var(--navy);
}
button.action.danger{ background:var(--danger); border-color:var(--danger); }
.text-link{
  border:0;
  background:transparent;
  color:var(--navy);
  cursor:pointer;
  padding:0;
  font:inherit;
  font-weight:900;
  text-decoration:underline;
}

.filter-chips{ display:flex; gap:8px; flex-wrap:wrap; margin:12px 0; }
.chip{
  min-height:44px;
  padding:8px 12px;
  border:1.5px solid var(--line);
  border-radius:999px;
  background:#fff;
  color:var(--navy);
  cursor:pointer;
  font-weight:900;
}
.chip.on{ background:var(--navy); color:#fff; border-color:var(--navy); }
.filter-summary{
  display:flex;
  justify-content:center;
  min-height:34px;
  margin:2px 0 12px;
  padding:8px 10px;
  border:1px solid var(--line);
  border-radius:8px;
  background:#fff;
  color:var(--muted);
  font-size:13px;
  font-weight:800;
}
.filter-summary strong{ margin-right:4px; color:var(--navy); }

/* Tables and data */
.table-wrap{
  position:relative;
  width:100%;
  max-width:100%;
  min-width:0;
  overflow:auto;
  contain:inline-size;
  border:1px solid var(--line);
  border-radius:8px;
  background:#fff;
  -webkit-overflow-scrolling:touch;
}
.mobile-cards,.mobile-latest-results-card{ display:none; }
table{ width:100%; min-width:720px; border-collapse:collapse; }
th,td{ padding:11px 12px; border-bottom:1px solid rgba(7,26,51,.1); text-align:left; vertical-align:middle; font-size:14px; }
td{ font-variant-numeric:tabular-nums; transition:background-color .12s ease; }
th{
  position:sticky;
  top:0;
  z-index:2;
  background:var(--navy);
  color:var(--gold-2);
  font-size:11px;
  font-weight:900;
  letter-spacing:.1em;
  text-transform:uppercase;
  white-space:nowrap;
}
tr:last-child td{ border-bottom:0; }
tbody tr:hover td{ background:rgba(215,183,98,.16); }
.team-cell{ color:var(--navy); font-family:"Big Shoulders Display",sans-serif; font-size:17px; font-weight:900; letter-spacing:.02em; text-transform:uppercase; line-height:1; }
.pts-cell{ color:var(--navy); font-family:"Big Shoulders Display",sans-serif; font-size:18px; font-weight:900; }
/* Numeric columns: headers and cells right-aligned so digits line up. */
.num-col,.num-cell{ text-align:right; }
/* Badge/action columns stay centred and never wrap to two lines. */
.badge-col,.badge-cell{ text-align:center; }
.badge-cell .badge{ white-space:nowrap; }
.sortable{ cursor:pointer; user-select:none; }
.sortable.active{ color:#fff; box-shadow:inset 0 -2px 0 var(--gold-2); }
.sort-arrow{ display:inline-block; width:13px; text-align:center; }
.sortable .sort-arrow::after{
  content:"";
  display:inline-block;
  width:6px;
  height:6px;
  border-right:2px solid currentColor;
  border-bottom:2px solid currentColor;
  transform:rotate(45deg) translateY(-2px);
  opacity:.35;
}
.sortable.active .sort-arrow::after{ opacity:1; }
.sortable.active.asc .sort-arrow::after{ transform:rotate(-135deg) translateY(-2px); }
.sr-only{
  position:absolute;
  width:1px;
  height:1px;
  margin:-1px;
  padding:0;
  border:0;
  overflow:hidden;
  clip:rect(0 0 0 0);
  white-space:nowrap;
}

.position-with-move{ display:inline-flex; align-items:center; gap:4px; color:var(--navy); font-family:"Big Shoulders Display",sans-serif; font-weight:900; }
.table-move{ font-size:10px; line-height:1; opacity:.8; transform:translateY(-1px); }
.table-move.up{ color:var(--ok); }
.table-move.down{ color:var(--danger); }
.table-movement-note{ color:var(--muted); }

/* League table: signed frame difference + quiet FF/FA columns. */
.fd-cell.pos{ color:var(--ok); font-weight:700; }
.fd-cell.neg{ color:var(--danger); font-weight:700; }
.num-cell.minor{ color:var(--muted); font-weight:400; }
/* Points column fenced from the stats so it reads as the headline number. */
.league-table th.pts-col,
.league-table td.pts-cell{ border-left:1px solid var(--line); }
/* Leader treatment: gold inset bar + faint wash, BBC-style. */
.league-table tr.is-leader td{ background:rgba(215,183,98,.1); }
.league-table tr.is-leader td:first-child{ box-shadow:inset 3px 0 0 var(--gold-2); }
.team-monogram.sm{
  width:24px;
  height:24px;
  min-width:24px;
  font-size:11px;
  border-radius:5px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  font-weight:900;
}
.league-table .team-cell{ display:inline-flex; align-items:center; gap:8px; white-space:nowrap; }
.team-cell-link{ text-decoration:none; }
.team-cell-link:hover .team-cell,
.team-cell-link:focus-visible .team-cell{ color:var(--brand-gold-deep,#a87b13); }
/* Form pips: letter + colour so the guide stays readable for everyone. */
.form-row{ display:inline-flex; gap:3px; }
.form-pip{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:20px;
  height:20px;
  border-radius:50%;
  font-size:10px;
  font-weight:800;
  color:#fff;
  cursor:default;
}
.form-pip.w{ background:var(--ok); }
.form-pip.d{ background:#98a1ad; }
.form-pip.l{ background:var(--danger); }
.form-pip.latest{ outline:2px solid rgba(7,26,51,.55); outline-offset:1px; }
.table-key{ margin-top:10px; }
.zone-dot{ display:inline-block; width:10px; height:10px; border-radius:2px; vertical-align:baseline; }
.zone-dot.title{ background:var(--gold-2); }
.table-method{ margin:0 0 12px; color:var(--muted); font-size:13px; }
.table-method summary{
  cursor:pointer;
  color:var(--navy);
  font-weight:700;
  font-size:13px;
}
.table-method p{ margin:8px 0 0; }
.week-badge{ margin-top:6px; }
.empty-row{ text-align:center; }
.history-when{ margin-left:auto; }

/* Cup fixtures: unmistakably distinct from league fixtures wherever they
   appear — navy badge with gold text plus a gold edge on the card. */
.badge.cup-badge{
  background:linear-gradient(145deg,var(--brand-navy,#071a33),var(--brand-blue-2,#10284a));
  color:var(--gold-2);
  border:1px solid rgba(215,183,98,.55);
}
.fixture-card.cup{
  border-left:4px solid var(--gold-2);
  padding-left:10px;
  background:linear-gradient(90deg,rgba(215,183,98,.08),transparent 32%);
}
.fixture-card.cup .week.cup-week{
  background:linear-gradient(145deg,var(--brand-navy,#071a33),var(--brand-blue-2,#10284a));
  color:var(--gold-2);
}
.team-next-card.is-cup .team-next-date span{
  background:linear-gradient(145deg,var(--brand-navy,#071a33),var(--brand-blue-2,#10284a));
  color:var(--gold-2);
  border-radius:6px;
  padding:2px 8px;
}

.badge{
  display:inline-flex;
  align-items:center;
  gap:6px;
  padding:4px 8px;
  border-radius:999px;
  background:#e9edf3;
  color:var(--navy);
  font-size:12px;
  font-weight:900;
  white-space:nowrap;
}
.badge.gold{ background:rgba(215,183,98,.22); color:#6f5310; }
.badge.ok{ background:rgba(47,125,79,.13); color:var(--ok); }
.badge.warn{ background:rgba(170,34,51,.1); color:var(--danger); }
.badge.non-active{ background:rgba(99,112,131,.18); color:#3f4a5a; }
.notice{
  border:1px solid var(--line);
  border-left:4px solid var(--gold);
  border-radius:8px;
  background:#fff;
  padding:13px;
  color:var(--navy);
}
.notice.error,.error{ border-left-color:var(--danger); color:var(--danger); }
.notice.success,.success{ border-left-color:var(--ok); color:var(--ok); }
.loading{ color:var(--muted); font-style:italic; }
/* Skeleton placeholders: reserve realistic space while data loads so the
   page doesn't jump when content arrives (cuts CLS). */
.skeleton-card{ min-height:120px; }
.sk-line,.sk-block{
  border-radius:6px;
  background:linear-gradient(90deg,#e8edf3 25%,#f3f6fa 37%,#e8edf3 63%);
  background-size:400% 100%;
}
.sk-line{ height:16px; margin-bottom:12px; }
.sk-line.w40{ width:40%; }
.sk-line.w65{ width:65%; }
.sk-block{ width:100%; }
.sk-block.h200{ height:200px; }
.sk-block.h320{ height:320px; }
.empty-state{ padding:18px; text-align:center; color:var(--muted); border-style:dashed; }
.empty-state strong{ display:block; color:var(--navy); }
.empty-icon{ color:var(--gold); font-size:30px; }

.stat{
  border:1px solid var(--line);
  border-radius:8px;
  background:#fff;
  padding:16px;
}
.stat .num{ color:var(--navy); font-family:"Big Shoulders Display",sans-serif; font-size:36px; font-weight:900; line-height:1; }
.stat .label{ margin-top:6px; color:var(--gold); font-size:11px; font-weight:900; letter-spacing:.12em; text-transform:uppercase; }
.stat .meta{ margin-top:5px; }

/* Fixture cards */
/* Fixture cards stack vertically at every width: head row (week chip,
   date, status/score), one row per team, then a meta row. No side columns
   to squeeze on phones. */
.fixture-card{
  display:grid;
  gap:8px;
  padding:14px 0;
  border-bottom:1px solid rgba(7,26,51,.1);
}
.fixture-head{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:6px 8px;
  min-width:0;
}
.fixture-head .week{ flex:none; font-size:18px; }
.fixture-date{ flex:none; font-weight:800; }
.fixture-status{ margin-left:auto; flex:none; text-align:right; }
.fixture-status .score{ font-size:24px; }
.fixture-teams{ display:grid; gap:6px; min-width:0; }
.team-row{
  display:flex;
  align-items:center;
  gap:9px;
  min-width:0;
}
.team-row .ha{ flex:none; width:54px; }
.team-row strong{
  min-width:0;
  color:var(--navy);
  font-size:16px;
  font-weight:900;
  line-height:1.25;
  overflow-wrap:anywhere;
}
.fixture-card:last-child{ border-bottom:0; }
.fixture-card.bye{ opacity:.75; }
.fixture-card.played{ border-left:0; box-shadow:none; }
.fixture-card.postponed{
  opacity:.74;
  padding:12px;
  border:1px dashed rgba(91,102,117,.42);
  border-radius:8px;
  background:linear-gradient(180deg,#f6f7f9,#eef1f5);
}
.fixture-card.postponed strong{
  color:var(--muted);
}
.postponed-note{
  margin-top:5px;
  color:var(--muted);
  font-size:12px;
  font-weight:900;
  letter-spacing:.04em;
  text-transform:uppercase;
}
.week{ color:var(--gold); font-family:"Big Shoulders Display",sans-serif; font-size:20px; font-weight:900; text-transform:uppercase; }
.match,.match-line{ color:var(--navy); font-weight:900; }
.match-line{ display:flex; align-items:center; gap:8px; flex-wrap:wrap; }
.icon-line{ display:flex; gap:4px 10px; flex-wrap:wrap; align-items:center; margin-top:0; color:var(--muted); font-size:13px; }
.icon-line > span{ max-width:100%; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.ha{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:4px 9px 3px;
  border-radius:4px;
  font-family:"Big Shoulders Display",sans-serif;
  font-size:11px;
  font-weight:900;
  letter-spacing:.14em;
  line-height:1;
  text-transform:uppercase;
  white-space:nowrap;
}
.ha.home{ background:var(--navy); color:#fff; }
.ha.away{ border:1.5px solid var(--navy); color:var(--navy); background:#fff; }
.ha.bye{ border:1.5px dashed var(--muted); color:var(--muted); background:#fff; }
.fixture-result{ border-top:0; padding-top:0; text-align:right; }
.score{ color:var(--navy); font-family:"Big Shoulders Display",sans-serif; font-size:28px; font-weight:900; line-height:1; white-space:nowrap; }
.score .sep{ margin:0 3px; color:var(--muted); }
.result-meta{ margin-top:3px; color:var(--gold); font-size:11px; font-weight:900; letter-spacing:.1em; text-transform:uppercase; }

/* Homepage */
.home-stack,.website-home{ display:grid; gap:18px; }
.website-hero{ display:grid; grid-template-columns:1fr; gap:14px; }
.website-hero-main,.hero-panel{
  position:relative;
  overflow:hidden;
  border-radius:8px;
  padding:24px 18px;
  background:linear-gradient(150deg,var(--navy),var(--blue));
  color:#fff;
  box-shadow:var(--shadow);
}
.website-hero-main h2,.hero-panel h2,.hero-panel h3{ color:#fff; font-size:clamp(42px,10vw,72px); }
.website-hero-main p,.hero-panel p{ max-width:48ch; color:rgba(255,255,255,.78); line-height:1.5; }
.hero-actions{ display:flex; gap:10px; flex-wrap:wrap; margin-top:16px; }
.website-hero-card{
  border:1px solid var(--line);
  border-radius:8px;
  background:#fff;
  padding:18px;
  box-shadow:var(--shadow);
}
/* The hero cards sit on white. The default light gold fails AA, and even
   --brand-gold-deep (#a87b13) is only ~3.8:1. This 10px label counts as
   "normal" text (needs 4.5:1), so use a darker bronze-gold that clears AA. */
.website-hero-card .kicker{ color:#8a6410; }
.hero-card-head{ display:flex; align-items:center; justify-content:space-between; gap:10px; margin-bottom:8px; }
.week-pill{ padding:5px 9px; border-radius:999px; background:var(--navy); color:#fff; font-weight:900; font-size:12px; }
.mini-fixture-list{ display:grid; gap:8px; margin-top:12px; }
.mini-fixture{
  display:grid;
  grid-template-columns:minmax(0,1fr) 28px minmax(0,1fr);
  align-items:center;
  gap:8px;
  padding:9px 10px;
  border:1px solid var(--line);
  border-radius:8px;
  background:var(--soft);
  font-weight:900;
}
.mini-fixture span{ min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.mini-fixture span:first-child{ text-align:right; }
.mini-fixture em{ display:flex; align-items:center; justify-content:center; font-style:normal; color:var(--gold); }
.mini-fixture.mini-postponed{
  grid-template-columns:minmax(0,1fr) 28px minmax(0,1fr);
  border-style:dashed;
  background:#eef1f5;
  color:var(--muted);
  opacity:.78;
}
.mini-fixture.mini-postponed em{
  color:var(--muted);
}
.mini-fixture.mini-postponed small{
  grid-column:1 / -1;
  color:var(--muted);
  font-size:10px;
  font-weight:900;
  letter-spacing:.04em;
  line-height:1.1;
  text-align:center;
  text-transform:uppercase;
}
.mini-fixture.mini-cup{
  border-color:rgba(215,183,98,.55);
  background:linear-gradient(90deg,rgba(215,183,98,.12),transparent 60%);
}
.mini-fixture.mini-cup small{
  grid-column:1 / -1;
  color:var(--muted);
  font-size:10px;
  font-weight:800;
  text-align:center;
  margin-top:2px;
}
/* One-off events (Singles KO night, finals) — a single centred label with no
   team sides. Gold-accented like the cup styles so they read as "special". */
.badge.event-badge{
  background:linear-gradient(145deg,var(--brand-navy,#071a33),var(--brand-blue-2,#10284a));
  color:var(--gold-2);
  border:1px solid rgba(215,183,98,.55);
}
.fixture-card.event{
  border-left:4px solid var(--gold-2);
  padding-left:10px;
  background:linear-gradient(90deg,rgba(215,183,98,.08),transparent 32%);
}
.mini-fixture.mini-event{
  grid-template-columns:1fr;
  border-color:rgba(215,183,98,.55);
  background:linear-gradient(90deg,rgba(215,183,98,.12),transparent 60%);
}
.mini-fixture.mini-event span{ text-align:center; white-space:normal; overflow:visible; }
.mini-fixture.mini-result{ grid-template-columns:minmax(0,1fr) auto minmax(0,1fr); }
.mini-fixture.mini-result .mini-result-team{ text-align:center; }
.mini-fixture strong{ text-align:center; color:var(--navy); font-family:"Big Shoulders Display",sans-serif; font-size:20px; }
.mini-result-score{
  min-width:54px;
  padding:2px 8px;
  border-radius:999px;
  background:#fff;
  box-shadow:inset 0 0 0 1px rgba(7,26,51,.08);
  white-space:nowrap;
}
.mini-result-score .sep{ margin:0 3px; color:var(--muted); }
.homepage-grid,.home-split{ display:grid; gap:18px; }
.homepage-main-col,.homepage-sidebar-col{ display:grid; gap:18px; align-content:start; }
.quick-grid,.menu-grid,.info-grid{ display:grid; gap:12px; }
.quick-card,.menu-card,.team-card-link{
  display:flex;
  align-items:center;
  gap:12px;
  min-height:76px;
  padding:15px;
  text-decoration:none;
}
.quick-card:hover,.menu-card:hover,.team-card-link:hover{ border-color:var(--gold); transform:translateY(-1px); }
.quick-card strong,.menu-card strong,.team-card-link strong{ display:block; color:var(--navy); font-family:"Big Shoulders Display",sans-serif; font-size:23px; line-height:1; text-transform:uppercase; }
.quick-card small,.menu-card small,.team-card-link small{ display:block; margin-top:4px; color:var(--muted); font-weight:700; }
.member-start-card{
  border:1px solid var(--brand-rule,rgba(7,26,51,.13));
  border-radius:8px;
  background:#fff;
  padding:18px;
  box-shadow:var(--brand-shadow,0 18px 44px -36px rgba(7,26,51,.62));
}
.member-start-grid{
  display:grid;
  grid-template-columns:1fr;
  gap:10px;
}
.member-start-tile{
  display:flex;
  align-items:center;
  gap:13px;
  min-height:78px;
  padding:14px;
  border:1px solid var(--brand-rule,rgba(7,26,51,.13));
  border-radius:7px;
  background:linear-gradient(180deg,#fff,#f9fbfe);
  color:var(--navy);
  text-decoration:none;
}
.member-start-tile strong{
  display:block;
  font-family:"Big Shoulders Display",sans-serif;
  font-size:25px;
  line-height:.95;
  text-transform:uppercase;
}
.member-start-tile small{
  display:block;
  margin-top:5px;
  color:var(--muted);
  font-weight:800;
  line-height:1.25;
}
.member-start-tile.primary{
  border-color:rgba(215,183,98,.56);
  background:
    linear-gradient(135deg,rgba(215,183,98,.18),transparent 38%),
    linear-gradient(150deg,var(--brand-navy,#071a33),var(--brand-blue,#183766));
  color:#fff;
}
.member-start-tile.primary small{ color:rgba(255,255,255,.78); }
.member-start-tile.primary .icon-pill{
  background:var(--brand-gold,#d7b762);
  color:var(--brand-navy,#071a33);
}
.rules-hero{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:18px;
  background:
    linear-gradient(135deg,rgba(215,183,98,.16),transparent 38%),
    linear-gradient(150deg,var(--brand-navy,#071a33),var(--brand-blue,#183766));
  color:#fff;
}
.rules-hero h2{
  margin:0 0 8px;
  color:#fff;
  font-size:clamp(44px,7vw,76px);
  line-height:.88;
}
.rules-hero .sec-note{
  max-width:720px;
  color:rgba(255,255,255,.78);
}
.rules-hero .kicker{ color:var(--brand-gold,#d7b762); }
.rules-hero-actions{
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:10px;
  flex-wrap:wrap;
}
.rules-panel .section-head{ align-items:flex-end; }
.rules-list{
  display:grid;
  gap:10px;
}
.cup-hero,
.magic-monday-card{
  border-color:rgba(215,183,98,.38);
}
.cup-stats-note{
  border-color:rgba(215,183,98,.42);
  background:linear-gradient(180deg,#fffdf7,#fff);
}
.cup-stats-note h2{
  margin-bottom:4px;
}
.cup-event-card.is-collapsed .cup-event-panel{
  display:none;
}
.cup-collapse-button{
  min-width:96px;
}
.cup-hero{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:18px;
  background:
    linear-gradient(135deg,rgba(215,183,98,.16),transparent 38%),
    linear-gradient(150deg,var(--brand-navy,#071a33),var(--brand-blue,#183766));
  color:#fff;
}
.cup-hero h2{
  margin:0 0 8px;
  color:#fff;
  font-size:clamp(44px,7vw,76px);
  line-height:.88;
}
.cup-hero .sec-note{
  max-width:720px;
  color:rgba(255,255,255,.78);
}
.cup-draw-rounds,
.cup-draw-list{
  display:grid;
  gap:10px;
}
.cup-round-section{
  display:grid;
  gap:10px;
  padding-top:14px;
  border-top:1px solid var(--brand-rule,rgba(7,26,51,.13));
}
.cup-round-section:first-child{
  padding-top:0;
  border-top:0;
}
.cup-round-section h3{
  display:flex;
  align-items:center;
  gap:10px;
  margin:0;
  color:var(--navy);
  font-size:30px;
  line-height:.95;
}
.cup-event-meta{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:10px;
  margin-bottom:14px;
}
.cup-event-meta span{
  display:grid;
  gap:2px;
  padding:10px 12px;
  border:1px solid var(--brand-rule,rgba(7,26,51,.13));
  border-radius:8px;
  background:#fff;
  color:var(--ink);
  font-weight:850;
}
.cup-event-meta strong{
  color:var(--gold);
  font-size:11px;
  letter-spacing:.09em;
  text-transform:uppercase;
}
.cup-champion-banner{
  position:relative;
  overflow:hidden;
  display:grid;
  grid-template-columns:auto minmax(0,1fr);
  gap:18px;
  align-items:center;
  margin:0 0 16px;
  padding:22px;
  border:1px solid rgba(215,183,98,.58);
  border-radius:8px;
  background:
    radial-gradient(circle at 92% 10%, rgba(215,183,98,.32), transparent 28%),
    linear-gradient(145deg,#071a33,#10284a 58%,#183766);
  color:#fff;
  box-shadow:0 20px 42px -32px rgba(7,26,51,.8);
}
.cup-champion-banner::after{
  content:"";
  position:absolute;
  right:-42px;
  bottom:-68px;
  width:190px;
  height:190px;
  border:28px solid rgba(215,183,98,.12);
  border-radius:50%;
}
.champion-crown{
  position:relative;
  z-index:1;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:72px;
  height:72px;
  border-radius:18px;
  background:var(--gold-2);
  color:#071a33;
  font-size:44px;
  line-height:1;
  box-shadow:0 16px 28px -22px #000;
}
.cup-champion-banner div{
  position:relative;
  z-index:1;
  min-width:0;
}
.cup-champion-banner p{
  margin:0 0 5px;
  color:var(--gold-2);
  font-size:11px;
  font-weight:900;
  letter-spacing:.18em;
  text-transform:uppercase;
}
.cup-champion-banner h3{
  margin:0;
  color:#fff;
  font-size:clamp(42px,7vw,72px);
  line-height:.82;
}
.cup-champion-banner strong{
  display:inline-flex;
  margin-top:10px;
  padding:7px 12px;
  border-radius:8px;
  background:rgba(255,255,255,.12);
  color:#fff;
  font-family:"Big Shoulders Display",sans-serif;
  font-size:28px;
}
.cup-draw-row{
  display:grid;
  grid-template-columns:46px minmax(0,1fr) minmax(92px,auto);
  align-items:center;
  gap:14px;
  min-height:68px;
  padding:13px 15px;
  border:1px solid var(--brand-rule,rgba(7,26,51,.13));
  border-radius:8px;
  background:
    linear-gradient(90deg,rgba(215,183,98,.09),transparent 26%),
    linear-gradient(180deg,#fff,#f9fbfe);
}
.cup-draw-row.is-complete{
  border-color:rgba(47,125,79,.35);
  background:
    radial-gradient(circle at 8% 50%, rgba(215,183,98,.18), transparent 16%),
    linear-gradient(90deg,rgba(47,125,79,.12),transparent 34%),
    linear-gradient(180deg,#fff,#f8fcfa);
  box-shadow:inset 4px 0 0 var(--ok);
}
.cup-draw-row.is-live{
  border-color:rgba(185,144,37,.55);
  box-shadow:0 0 0 3px rgba(185,144,37,.12);
}
.cup-draw-row.is-started{
  border-color:rgba(7,26,51,.26);
  background:
    linear-gradient(90deg,rgba(7,26,51,.08),transparent 28%),
    linear-gradient(180deg,#fff,#f8fbff);
}
.cup-matchup{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(34px,auto) minmax(0,1fr);
  align-items:center;
  gap:12px;
  min-width:0;
}
.cup-draw-row .cup-side{
  display:inline-flex;
  align-items:center;
  flex-wrap:wrap;
  gap:7px;
  min-width:0;
  color:var(--navy);
  font-size:18px;
  line-height:1.15;
}
.cup-draw-row .home-side{
  text-align:right;
  justify-content:flex-end;
}
.cup-draw-row .away-side{
  text-align:left;
}
.cup-draw-row .cup-side.winner{
  color:var(--ok);
  position:relative;
  padding:8px 10px;
  border-radius:8px;
  background:rgba(47,125,79,.09);
  box-shadow:0 0 0 1px rgba(47,125,79,.18);
}
.cup-draw-row .cup-side.winner::after{
  content:" winner";
  display:block;
  flex-basis:100%;
  margin-top:3px;
  color:var(--ok);
  font-family:"Inter Tight",system-ui,sans-serif;
  font-size:10px;
  font-weight:900;
  letter-spacing:.09em;
  text-transform:uppercase;
}
.winner-burst{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:22px;
  height:22px;
  margin:0 6px 0 0;
  border-radius:50%;
  background:var(--gold-2);
  color:#071a33;
  font-size:14px;
  line-height:1;
  vertical-align:middle;
  box-shadow:0 0 0 4px rgba(215,183,98,.2);
}
.away-side .winner-burst{
  margin:0 6px 0 0;
}
.cup-matchup em{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:30px;
  height:30px;
  border-radius:999px;
  background:rgba(215,183,98,.18);
  color:var(--gold);
  font-style:normal;
  font-weight:900;
  text-align:center;
}
.cup-matchup em.cup-scoreline{
  min-width:68px;
  width:auto;
  padding:0 12px;
  border-radius:8px;
  background:var(--navy);
  color:#fff;
  font-family:"Big Shoulders Display",sans-serif;
  font-size:25px;
  letter-spacing:.02em;
}
.cup-scoreline .sep{
  margin:0 4px;
  color:var(--gold-2);
}
/* Kick-off time pulled from Cuescore: the headline detail for an
   unplayed cup fixture, styled like a fixture-card scoreline. */
.cup-matchup em.cup-start-time{
  width:auto;
  min-width:84px;
  height:34px;
  padding:0 13px;
  border-radius:8px;
  background:linear-gradient(145deg,var(--brand-navy,#071a33),var(--brand-blue-2,#10284a));
  color:var(--gold-2);
  font-family:"Big Shoulders Display",sans-serif;
  font-size:17px;
  font-weight:900;
  letter-spacing:.05em;
  white-space:nowrap;
}
.cup-side-monogram{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:24px;
  height:24px;
  min-width:24px;
  border-radius:6px;
  background:linear-gradient(145deg,var(--brand-navy,#071a33),var(--brand-blue-2,#10284a));
  color:var(--gold-2);
  font-family:"Big Shoulders Display",sans-serif;
  font-size:11px;
  font-weight:900;
  letter-spacing:.02em;
}
.cup-side-name{ min-width:0; }
.cup-round-count{
  margin-left:auto;
  padding:3px 9px;
  border-radius:999px;
  background:rgba(7,26,51,.07);
  color:var(--muted);
  font-family:"Inter Tight",system-ui,sans-serif;
  font-size:11px;
  font-weight:800;
  letter-spacing:.06em;
  text-transform:uppercase;
}
.cup-date-text{ color:var(--navy); }
.cup-race-text{ color:var(--gold); }
.cup-match-meta{
  display:grid;
  gap:3px;
  justify-items:end;
  color:var(--muted);
  font-size:12px;
  font-weight:850;
  text-align:right;
}
.cup-winner-text{
  color:var(--ok);
}
.cup-live-status{
  display:inline-flex;
  justify-self:end;
  align-items:center;
  gap:5px;
  color:var(--gold);
  text-transform:uppercase;
  letter-spacing:.08em;
}
.cup-live-status::before{
  content:"";
  width:7px;
  height:7px;
  border-radius:999px;
  background:var(--gold);
  box-shadow:0 0 0 4px rgba(185,144,37,.16);
}
.cup-match-number,
.cup-round{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:32px;
  padding:4px 9px;
  border-radius:6px;
  background:var(--navy);
  color:var(--gold-2);
  font-family:"Big Shoulders Display",sans-serif;
  font-size:18px;
  font-weight:900;
  text-transform:uppercase;
}
.cup-match-number{
  width:36px;
  min-height:36px;
  background:rgba(7,26,51,.07);
  color:var(--navy);
  font-size:18px;
  letter-spacing:0;
}
.rule-card{
  display:grid;
  grid-template-columns:44px minmax(0,1fr);
  gap:13px;
  padding:14px;
  border:1px solid var(--brand-rule,rgba(7,26,51,.13));
  border-radius:8px;
  background:linear-gradient(180deg,#fff,#f9fbfe);
}
.rule-number{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:38px;
  height:38px;
  border-radius:8px;
  background:var(--brand-navy,#071a33);
  color:var(--brand-gold,#d7b762);
  font-family:"Big Shoulders Display",sans-serif;
  font-size:22px;
  font-weight:900;
}
.rule-card h3{
  margin:0 0 5px;
  font-size:24px;
  line-height:1;
}
.rule-card p{
  margin:0;
  color:var(--ink);
  font-weight:760;
  line-height:1.5;
}
.agm-rules-panel{
  border-color:rgba(215,183,98,.45);
  background:linear-gradient(180deg,#fffdf7,#fff);
}
.icon-pill,.team-monogram,.brand-mark{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:42px;
  height:42px;
  flex:none;
  border-radius:8px;
  background:var(--navy);
  color:var(--gold-2);
  font-family:"Big Shoulders Display",sans-serif;
  font-size:20px;
  font-weight:900;
}
.key-date-list{
  display:grid;
  gap:8px;
  padding:0;
  margin:0;
  list-style:none;
}
.key-date-list li{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  padding:10px 0;
  border-bottom:1px solid rgba(7,26,51,.1);
}
.key-date-list li:last-child{ border-bottom:0; }
.key-date-list strong{ color:var(--navy); }
.key-date-list span{ color:var(--muted); text-align:right; }
.link-list{ display:grid; gap:8px; }
.link-list a,.view-link,.kpi{
  color:var(--navy);
  font-weight:900;
  text-decoration:none;
}
.link-list a{
  padding:10px 0;
  border-bottom:1px solid rgba(7,26,51,.1);
}
.link-list a:last-child{ border-bottom:0; }
.address{ margin:0 0 10px; color:var(--ink); font-weight:800; }
.cat-section{ display:grid; gap:10px; margin-top:16px; }
.cat-heading{ display:flex; align-items:center; justify-content:space-between; gap:12px; }
.muted-cat{ opacity:.82; }

.leader-ranking{ display:grid; gap:8px; }
.leader-rank-row,.cat-win-row,.pots-row,.performer{
  display:grid;
  grid-template-columns:auto minmax(0,1fr) auto;
  gap:10px;
  align-items:center;
  padding:11px 0;
  border-bottom:1px solid rgba(7,26,51,.1);
}
.leader-place,.cat-win-cat,.perf-rank{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:42px;
  min-height:28px;
  padding:4px 8px;
  border-radius:6px;
  background:var(--navy);
  color:#fff;
  font-weight:900;
}
.leader-rank-team strong,.cat-win-player strong,.perf-name{ display:block; color:var(--navy); font-weight:900; }
.leader-rank-team small,.cat-win-player small,.cat-win-metric em,.perf-pct em{ display:block; color:var(--muted); font-size:12px; }
.cat-win-metric,.perf-pct{ text-align:right; color:var(--navy); font-family:"Big Shoulders Display",sans-serif; font-size:24px; font-weight:900; }
.cat-win-record{ display:none; }

/* Teams */
.team-dashboard{ display:grid; gap:18px; }
.team-profile,.team-profile-poster{
  position:relative;
  overflow:hidden;
  padding:22px;
  border:1px solid rgba(215,183,98,.45);
  border-radius:8px;
  background:linear-gradient(150deg,var(--navy),var(--blue));
  color:#fff;
  box-shadow:var(--shadow);
}
.team-profile h2,.team-profile-poster h2{ color:#fff; font-size:clamp(42px,10vw,70px); }
.team-profile .sec-note,.team-profile .meta,.team-profile-poster .sec-note,.team-profile-poster .meta{ color:rgba(255,255,255,.76); }
.team-profile-head{ display:flex; align-items:center; justify-content:space-between; gap:12px; margin-bottom:14px; }
.team-profile-head-clean{ display:flex; }
.team-profile-kicker{ display:block; margin-bottom:5px; color:var(--gold-2); font-size:10px; font-weight:900; letter-spacing:.18em; text-transform:uppercase; }
.team-position{
  min-width:92px;
  padding:8px 12px;
  border:1px solid rgba(215,183,98,.5);
  border-radius:8px;
  background:rgba(215,183,98,.15);
  text-align:center;
}
.team-position .pos-num{ display:block; color:var(--gold-2); font-family:"Big Shoulders Display",sans-serif; font-size:38px; font-weight:900; line-height:1; }
.team-position .pos-label{ display:block; color:rgba(255,255,255,.72); font-size:9px; font-weight:900; letter-spacing:.12em; text-transform:uppercase; }
.squad-head{ display:flex; align-items:center; justify-content:space-between; gap:12px; margin-bottom:12px; }
.squad-list{ display:grid; gap:8px; }
.squad-player{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:10px;
  padding:10px 12px;
  border:1px solid var(--line);
  border-radius:8px;
  background:#fff;
}
.cats-switch,.check-row{ margin:0; color:var(--ink); font-size:14px; font-weight:800; letter-spacing:0; text-transform:none; }
.cats-switch input,.check-row input{ width:auto; min-height:0; margin-right:7px; }
.top-performers-card .performer-list{ margin:0; padding:0; list-style:none; }
.fixture-actions{ display:flex; gap:8px; align-items:center; justify-content:flex-end; flex-wrap:wrap; }
.fixture-team-button{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:44px;
  padding:8px 12px;
  border:1.5px solid var(--navy);
  border-radius:999px;
  background:#fff;
  color:var(--navy);
  text-decoration:none;
  font-family:"Big Shoulders Display",sans-serif;
  font-weight:900;
  letter-spacing:.05em;
  text-transform:uppercase;
}
.opp-form{ display:inline-flex; gap:4px; align-items:center; margin-left:8px; }
.form-box,.form .dot{ width:13px; height:13px; border-radius:4px; display:inline-block; background:var(--muted); }
.form .dot{ border-radius:50%; }
.form-box.w,.dot.w{ background:var(--ok); }
.form-box.l,.dot.l{ background:var(--danger); }
.form-box.d,.dot.d{ background:var(--muted); }
.dot.none{ background:transparent; border:1px solid var(--line); }

.team-switcher-card{
  padding-bottom:26px;
}
.team-select-controls{
  max-width:680px;
  grid-template-columns:minmax(220px,1fr) auto;
  align-items:end;
}
.team-save-button{
  white-space:nowrap;
}
.team-save-button:disabled{
  cursor:default;
  opacity:.72;
  transform:none;
}
.team-save-note{
  min-height:22px;
  margin:-4px 0 10px;
  color:var(--muted);
  font-size:13px;
  font-weight:800;
}
.team-poster{
  display:grid;
  gap:16px;
  margin-top:18px;
  padding:22px;
  border:1px solid rgba(215,183,98,.42);
  border-radius:8px;
  background:
    linear-gradient(135deg,rgba(215,183,98,.2),transparent 36%),
    linear-gradient(150deg,var(--brand-navy,#071a33),var(--brand-blue,#183766));
  color:#fff;
  overflow:hidden;
  position:relative;
}
.team-poster::after{
  content:"";
  position:absolute;
  right:-54px;
  bottom:-58px;
  width:190px;
  height:190px;
  border:1px solid rgba(215,183,98,.28);
  border-radius:50%;
  box-shadow:inset 0 0 0 28px rgba(255,255,255,.04);
  pointer-events:none;
}
.team-poster-main,
.team-poster-position{
  position:relative;
  z-index:1;
}
.team-poster-main h2{
  max-width:760px;
  color:#fff;
  font-size:clamp(48px,10vw,86px);
}
.team-poster-main p{
  max-width:62ch;
  color:rgba(255,255,255,.8);
  font-size:16px;
  line-height:1.45;
}
.team-poster-actions{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
  margin-top:16px;
}
.team-poster-actions .jump-button.secondary{
  border-color:rgba(255,255,255,.45);
  background:rgba(255,255,255,.08);
  color:#fff;
}
.team-poster-position{
  display:grid;
  align-content:center;
  gap:4px;
  min-height:136px;
  padding:16px;
  border:1px solid rgba(215,183,98,.38);
  border-radius:7px;
  background:rgba(255,255,255,.08);
  text-align:center;
}
.team-poster-position span,
.team-poster-position em{
  color:rgba(255,255,255,.72);
  font-size:11px;
  font-style:normal;
  font-weight:900;
  letter-spacing:.12em;
  text-transform:uppercase;
}
.team-poster-position strong{
  color:var(--brand-gold,#d7b762);
  font-family:"Big Shoulders Display",sans-serif;
  font-size:64px;
  line-height:.9;
  text-transform:uppercase;
}
.team-poster-grid{
  display:grid;
  gap:16px;
  margin-top:16px;
}
.team-next-card{
  display:grid;
  gap:14px;
  align-items:center;
  padding:15px;
  border:1px solid var(--brand-rule,rgba(7,26,51,.13));
  border-radius:7px;
  background:linear-gradient(180deg,#fff,#f8fafc);
}
.team-next-date{
  display:grid;
  place-items:center;
  min-height:76px;
  border-radius:6px;
  background:linear-gradient(145deg,var(--brand-navy,#071a33),var(--brand-blue-2,#10284a));
  color:#fff;
}
.team-next-date span{
  color:var(--brand-gold,#d7b762);
  font-size:11px;
  font-weight:900;
  letter-spacing:.12em;
}
.team-next-date strong{
  font-family:"Big Shoulders Display",sans-serif;
  font-size:25px;
  text-transform:uppercase;
}
.team-next-main h3{
  margin:7px 0 4px;
  font-size:34px;
}
.team-next-main p{
  margin:0;
  color:var(--muted);
  font-weight:700;
}
.team-form-strip{
  display:inline-flex;
  gap:5px;
  align-items:center;
}
.team-form-strip .form-box{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:24px;
  height:24px;
  border-radius:5px;
  color:#fff;
  font-size:10px;
  font-weight:900;
  letter-spacing:.02em;
  text-transform:uppercase;
}
.team-form-strip .form-box.d{
  color:var(--navy);
}
.team-result-list{
  display:grid;
  gap:9px;
}
.team-result-card{
  display:grid;
  grid-template-columns:86px minmax(0,1fr);
  gap:12px;
  align-items:center;
  padding:12px;
  border:1px solid var(--brand-rule,rgba(7,26,51,.13));
  border-radius:7px;
  background:#fff;
}
.team-result-card > div:first-child{
  display:grid;
  place-items:center;
  min-height:64px;
  border-radius:6px;
  background:#eef2f7;
}
.team-result-card.result-w > div:first-child{ background:rgba(47,125,79,.12); }
.team-result-card.result-l > div:first-child{ background:rgba(170,34,51,.1); }
.team-result-card.result-d > div:first-child{ background:rgba(99,112,131,.12); }
.team-result-label{
  color:var(--muted);
  font-size:10px;
  font-weight:900;
  letter-spacing:.12em;
  text-transform:uppercase;
}
.team-result-card strong{
  color:var(--navy);
  font-family:"Big Shoulders Display",sans-serif;
  font-size:29px;
  line-height:1;
}
.team-result-card strong span{
  color:var(--muted);
  padding:0 3px;
}
.team-result-card h4{
  margin:0;
  color:var(--navy);
  font-family:"Big Shoulders Display",sans-serif;
  font-size:25px;
  line-height:.95;
  text-transform:uppercase;
}
.team-result-card p{
  margin:4px 0 0;
  color:var(--muted);
  font-size:13px;
  font-weight:700;
}
.poster-squad-list{
  gap:9px;
}
.poster-squad-player{
  display:grid;
  grid-template-columns:42px minmax(0,1fr) auto;
  padding:10px;
}
.poster-squad-player strong{
  min-width:0;
  color:var(--navy);
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.team-contact-strip{
  display:flex;
  gap:12px;
  flex-wrap:wrap;
  margin-top:14px;
  padding-top:14px;
  border-top:1px solid rgba(7,26,51,.09);
}
.team-mode-tabs{
  margin:0 0 14px;
}
.team-performer-list{
  display:grid;
  gap:9px;
  margin:0;
  padding:0;
  list-style:none;
}
.team-performer{
  display:grid;
  grid-template-columns:34px minmax(0,1fr) auto;
  gap:12px;
  align-items:center;
  padding:11px 0;
  border-bottom:1px solid rgba(7,26,51,.09);
}
.team-performer:last-child{
  border-bottom:0;
}
.team-performer strong,
.team-performer em{
  display:block;
}
.team-performer strong{
  color:var(--navy);
  font-weight:900;
}
.team-performer em{
  margin-top:2px;
  color:var(--muted);
  font-size:12px;
  font-style:normal;
}
.team-venue-panel{
  margin-top:16px;
}

@media (min-width:761px){
  .team-poster{
    grid-template-columns:minmax(0,1fr) 210px;
    align-items:stretch;
    padding:30px;
  }
  .team-poster-grid{
    grid-template-columns:minmax(0,1fr) minmax(0,1fr);
  }
  .team-poster-grid.lower{
    grid-template-columns:minmax(0,1.05fr) minmax(320px,.95fr);
  }
  .team-next-card{
    grid-template-columns:86px minmax(0,1fr);
    grid-template-areas:
      "date main"
      "date action";
    gap:10px 14px;
    align-items:center;
  }
  .team-next-date{
    grid-area:date;
    min-height:112px;
  }
  .team-next-main{
    grid-area:main;
    min-width:0;
  }
  .team-next-main h3{
    max-width:100%;
    margin-top:8px;
    font-size:clamp(25px,3vw,38px);
    line-height:.9;
    overflow-wrap:anywhere;
  }
  .team-next-card .fixture-team-button{
    grid-area:action;
    justify-self:start;
    min-height:34px;
    padding:7px 11px;
    font-size:14px;
  }
}

@media (min-width:1100px){
  .team-next-card{
    grid-template-columns:92px minmax(0,1fr) auto;
    grid-template-areas:"date main action";
  }
  .team-next-date{
    min-height:94px;
  }
  .team-next-card .fixture-team-button{
    justify-self:end;
  }
}

/* Stats and history */
.segmented{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:5px;
  padding:5px;
  border:1.5px solid var(--line);
  border-radius:8px;
  background:#fff;
}
.segmented.view-segmented{
  grid-template-columns:repeat(2,minmax(0,1fr));
}
.segmented button{
  min-height:40px;
  min-width:0;
  padding:0 8px;
  white-space:nowrap;
  overflow:hidden;
  border:0;
  border-radius:6px;
  background:transparent;
  color:var(--navy);
  cursor:pointer;
  font-family:"Big Shoulders Display",sans-serif;
  font-size:18px;
  font-weight:900;
  letter-spacing:.04em;
  text-transform:uppercase;
}
.segmented button.on{ background:var(--navy); color:#fff; }
.stats-summary{ margin-bottom:16px; }
.stats-table tr.qualified td{ background:rgba(47,125,79,.1); }
.stats-table tr.qualified td:first-child{ box-shadow:inset 3px 0 0 var(--ok); }
.stats-table tr.front-runner td{ background:rgba(215,183,98,.16); }
.stats-table tr.front-runner td:first-child{ box-shadow:inset 3px 0 0 var(--gold-2); }
.stats-table tbody tr.qualified:hover td,
.stats-table tbody tr.front-runner:hover td{ background:rgba(215,183,98,.2); }
/* Rank medals: leaderboard convention for the top three only. */
.rank-num{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:24px;
  height:24px;
  padding:0 4px;
  border-radius:50%;
  color:var(--muted);
  font-weight:700;
  font-size:12px;
  font-variant-numeric:tabular-nums;
}
.rank-1 .rank-num{ background:var(--gold); color:#fff; }
.rank-2 .rank-num{ background:rgba(185,144,37,.55); color:#fff; }
.rank-3 .rank-num{ background:rgba(185,144,37,.3); color:var(--navy); }
/* Inline win % bars next to the headline percentage. */
.win-cell{ white-space:nowrap; }
.win-pct-text{ font-weight:800; color:var(--navy); }
.win-bar{
  display:inline-block;
  width:48px;
  height:6px;
  margin-left:8px;
  border-radius:3px;
  background:var(--cream);
  vertical-align:2px;
  overflow:hidden;
}
.win-bar-fill{ display:block; height:100%; border-radius:3px; background:var(--gold-2); }
.win-bar.att .win-bar-fill{ background:var(--brand-blue,#123e73); }
.stats-table .team-cell{ font-size:14px; white-space:nowrap; }
.stats-table td:nth-child(2){ white-space:nowrap; }
.pots-leader{ display:flex; gap:10px; align-items:center; flex-wrap:wrap; padding:12px; border:1px solid rgba(47,125,79,.22); border-radius:8px; background:rgba(47,125,79,.07); }
.history-controls{ align-items:end; }
.history-suggestions,.history-list{ display:grid; gap:12px; }
.history-choice{
  display:flex;
  flex-direction:column;
  gap:3px;
  padding:12px;
  border:1.5px solid var(--line);
  border-radius:8px;
  background:#fff;
  color:var(--navy);
  cursor:pointer;
  text-align:left;
}
.history-choice strong{ font-family:"Big Shoulders Display",sans-serif; font-size:22px; text-transform:uppercase; }
.history-choice-card{
  cursor:default;
}
.history-choice-card .text-link{
  align-self:flex-start;
  font-weight:900;
}
.history-profile-head,.history-subhead{ display:flex; align-items:flex-start; justify-content:space-between; gap:12px; margin:14px 0; }
.history-profile-stats{ display:flex; gap:8px; flex-wrap:wrap; justify-content:flex-end; }
.profile-summary-grid{ margin:12px 0 16px; }
.history-card{ padding:14px; }
.history-card.won{ border-left:4px solid var(--ok); }
.history-card.lost{ border-left:4px solid var(--danger); }
.history-card-top{ display:flex; align-items:center; gap:8px; flex-wrap:wrap; margin-bottom:8px; }
.result-pill{ padding:5px 9px 4px; border-radius:999px; color:#fff; font-family:"Big Shoulders Display",sans-serif; font-weight:900; letter-spacing:.05em; text-transform:uppercase; }
.result-pill.win{ background:var(--ok); }
.result-pill.loss{ background:var(--danger); }
.history-date{ color:var(--gold); font-size:12px; font-weight:900; letter-spacing:.1em; text-transform:uppercase; }
.history-fixture{ margin:5px 0 10px; color:var(--navy); font-family:"Big Shoulders Display",sans-serif; font-size:23px; font-weight:900; text-transform:uppercase; }
.history-detail-grid{ display:grid; gap:5px; color:var(--ink); font-size:14px; }
.player-name-link{
  text-decoration:none;
}
.player-name-link:hover{
  text-decoration:underline;
}
.player-profile-action{
  width:max-content;
  min-height:34px;
  margin-top:8px;
  padding:7px 10px;
  font-size:13px;
}
.player-profile-hero{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(230px,.34fr);
  gap:16px;
  align-items:stretch;
  margin-bottom:16px;
  padding:22px;
  border-radius:8px;
  background:
    radial-gradient(circle at 92% 12%, rgba(215,183,98,.22), transparent 30%),
    linear-gradient(145deg,#071a33,#10284a 58%,#183766);
  color:#fff;
  overflow:hidden;
}
.player-profile-id{
  display:flex;
  align-items:center;
  gap:16px;
  min-width:0;
}
.player-profile-id .team-monogram{
  width:72px;
  height:72px;
  border-radius:18px;
  font-size:32px;
  box-shadow:0 18px 30px -24px #000;
}
.player-profile-id h2{
  margin:0;
  color:#fff;
  font-size:clamp(46px,7vw,76px);
  line-height:.82;
}
.player-profile-meta{
  display:flex;
  align-items:center;
  flex-wrap:wrap;
  gap:8px;
  margin-top:11px;
}
.player-profile-meta .team-cell{
  color:#fff;
}
.player-profile-claim{
  align-self:center;
  display:grid;
  gap:5px;
  padding:14px;
  border:1px solid rgba(215,183,98,.36);
  border-radius:8px;
  background:rgba(255,255,255,.08);
}
.player-profile-claim strong{
  color:var(--gold-2);
  font-size:12px;
  letter-spacing:.12em;
  text-transform:uppercase;
}
.player-profile-claim span{
  color:rgba(255,255,255,.78);
  font-weight:800;
}
.player-profile-stats{
  margin-bottom:16px;
}
.player-profile-stat{
  display:grid;
  gap:6px;
  min-height:132px;
  padding:18px;
  border:1px solid var(--line);
  border-radius:8px;
  background:#fff;
  box-shadow:var(--shadow);
}
.player-profile-stat span{
  color:var(--gold);
  font-size:12px;
  font-weight:900;
  letter-spacing:.12em;
  text-transform:uppercase;
}
.player-profile-stat strong{
  color:var(--navy);
  font-family:"Big Shoulders Display",sans-serif;
  font-size:48px;
  line-height:1;
}
.player-profile-stat small{
  color:var(--muted);
  font-weight:800;
}
.player-profile-split{
  margin-bottom:16px;
}
.profile-kpi-list{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:10px;
}
.profile-kpi-list span{
  display:grid;
  gap:3px;
  padding:12px;
  border:1px solid var(--line);
  border-radius:8px;
  background:var(--soft);
}
.profile-kpi-list strong{
  color:var(--navy);
  font-family:"Big Shoulders Display",sans-serif;
  font-size:32px;
  line-height:1;
}
.profile-kpi-list em{
  color:var(--muted);
  font-size:12px;
  font-style:normal;
  font-weight:850;
}
.player-profile-form{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
}
.player-profile-form span{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:42px;
  height:42px;
  border-radius:8px;
  color:#fff;
  font-family:"Big Shoulders Display",sans-serif;
  font-size:26px;
  font-weight:900;
}
.player-profile-form .w{ background:var(--ok); }
.player-profile-form .l{ background:var(--danger); }
.player-profile-history{
  margin-top:12px;
}
.player-result-card h4{
  overflow-wrap:anywhere;
}
.player-result-card p + p{
  margin-top:2px;
}

/* Admin */
.frame-head,.frame-row{
  display:grid;
  grid-template-columns:64px minmax(0,1fr) 140px minmax(0,1fr);
  gap:10px;
  align-items:center;
}
.frame-head{
  margin-top:10px;
  padding:8px 10px;
  border-bottom:1.5px solid var(--line);
  color:var(--gold);
  font-size:11px;
  font-weight:900;
  letter-spacing:.08em;
  text-transform:uppercase;
}
.frame-row{ padding:8px 10px; border-bottom:1px solid rgba(7,26,51,.1); }
.frame-row.doubles{ background:rgba(215,183,98,.08); border-radius:8px; }
.frame-num{ display:flex; align-items:center; gap:5px; color:var(--navy); font-family:"Big Shoulders Display",sans-serif; font-size:20px; font-weight:900; }
.brk{ color:var(--muted); font-size:10px; }
.frame-side{ display:flex; flex-direction:column; gap:6px; }
.frame-win{ display:flex; gap:6px; justify-content:center; }
.winbtn{
  border:1.5px solid var(--line);
  border-radius:7px;
  background:#fff;
  color:var(--muted);
  cursor:pointer;
  padding:8px 10px;
  font-size:12px;
  font-weight:900;
  letter-spacing:.04em;
  text-transform:uppercase;
}
.winbtn.on[data-win="home"]{ background:var(--navy); border-color:var(--navy); color:#fff; }
.winbtn.on[data-win="away"]{ border-color:var(--navy); color:var(--navy); }
.admin-actions{
  display:flex;
  gap:10px;
  align-items:center;
  flex-wrap:wrap;
  margin-top:14px;
}
.admin-actions .action{
  margin-top:0;
}
.admin-postpone{
  display:flex;
  align-items:end;
  gap:8px;
  padding:8px;
  border:1px solid var(--line);
  border-radius:8px;
  background:#fff;
}
.admin-postpone label{
  margin:0;
  white-space:nowrap;
}
.admin-postpone input{
  width:160px;
  min-height:40px;
}
.weekly-update-controls{
  grid-template-columns:160px minmax(220px,1fr) minmax(220px,1fr);
}
.weekly-template-tools{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  margin:12px 0;
}
.weekly-output-field{
  margin-top:12px;
}
.weekly-output-field textarea{
  min-height:360px;
  font-family:"Inter Tight",system-ui,sans-serif;
  line-height:1.45;
  white-space:pre-wrap;
}
.weekly-admin-shortcut,
#weeklyUpdateCard,
#publishSnapshotsPanel{
  scroll-margin-top:18px;
}
.weekly-image-panel{
  margin-top:18px;
  padding-top:16px;
  border-top:1px solid var(--line);
}
.weekly-image-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:14px;
}
.weekly-image-card{
  min-width:0;
  padding:10px;
  border:1px solid var(--line);
  border-radius:8px;
  background:var(--soft);
}
.weekly-image-card canvas{
  display:block;
  width:100%;
  height:auto;
  border-radius:8px;
  background:var(--navy);
  box-shadow:0 14px 32px -28px rgba(7,26,51,.7);
}
.weekly-image-card .weekly-template-tools{
  margin:10px 0 0;
}

/* Share table */
.share-status{
  min-height:0;
  margin:-6px 0 10px;
  color:var(--ok);
  font-size:13px;
  font-weight:900;
  opacity:0;
  transition:opacity .18s ease;
}
.share-status.show{ min-height:20px; opacity:1; }
.share-table-button{ white-space:nowrap; }
.share-table-button::before{
  content:"";
  width:8px;
  height:8px;
  border-radius:999px;
  background:var(--gold);
  box-shadow:0 0 0 4px rgba(185,144,37,.16);
}

/* Mobile table helpers */
@media (max-width:760px){
  body{ padding-bottom:78px; }
  .wrap{ padding:14px 12px 86px; }
  #content,
  #content > *,
  #statsOutput,
  #statsOutput > *,
  .stats-table-wrap{
    width:100%;
    max-width:100%;
    min-width:0;
  }
  .site-menu-button{ display:none; }
  .mast{ justify-content:flex-start; }
  .league-name{ font-size:30px; }
  .page-title{ font-size:11px; }
  #content{ margin-top:16px; }
  .section-head,.history-profile-head,.history-subhead,.squad-head{ display:block; }
  .player-profile-hero{
    grid-template-columns:1fr;
    padding:20px 16px;
  }
  .player-profile-id{
    display:grid;
    justify-items:center;
    text-align:center;
  }
  .player-profile-id h2{
    font-size:clamp(44px,14vw,66px);
  }
  .player-profile-meta{
    justify-content:center;
  }
  .player-profile-claim{
    text-align:center;
  }
  .profile-kpi-list{
    grid-template-columns:1fr;
  }
  .section-actions{ justify-content:stretch; margin-top:12px; }
  .section-actions .jump-button,.section-actions .button-like,.jump-button,button.action{ width:100%; }
  .controls{ grid-template-columns:1fr; }
  .segmented{
    grid-template-columns:1fr;
    gap:7px;
  }
  .segmented button{
    min-height:44px;
    font-size:20px;
  }
  .grid.two,.grid.three,.quick-grid,.menu-grid,.info-grid,.metric-grid{ grid-template-columns:1fr; }
  .member-start-card{
    padding:16px;
  }
  .rules-hero{
    align-items:flex-start;
    flex-direction:column;
    padding:20px 16px;
  }
  .cup-hero{
    align-items:flex-start;
    flex-direction:column;
    padding:20px 16px;
  }
  .cup-hero .jump-button{
    width:100%;
    justify-content:center;
  }
  .cup-draw-row{
    grid-template-columns:40px minmax(0,1fr);
    gap:9px 11px;
    align-items:start;
  }
  .cup-matchup{
    grid-template-columns:minmax(0,1fr) minmax(32px,auto) minmax(0,1fr);
    gap:8px;
  }
  .cup-draw-row .cup-side{
    font-size:15px;
  }
  .cup-matchup em{
    width:26px;
    height:26px;
  }
  .cup-round-section h3{
    font-size:26px;
  }
  .cup-match-number{
    width:34px;
    min-height:34px;
  }
  /* Phone widths: the side columns are too narrow for the mirrored
     monogram chips — they'd wrap under the names. Hide them here;
     they return (mirrored) from tablet width up. */
  .cup-side-monogram{
    display:none;
  }
  .cup-event-meta{
    grid-template-columns:1fr;
  }
  .cup-champion-banner{
    grid-template-columns:1fr;
    justify-items:center;
    text-align:center;
    padding:20px 16px;
  }
  .champion-crown{
    width:62px;
    height:62px;
    border-radius:16px;
    font-size:38px;
  }
  .cup-match-meta{
    grid-column:2;
    justify-items:start;
    text-align:left;
  }
  .rules-hero-actions{
    width:100%;
    display:grid;
    grid-template-columns:1fr;
  }
  .rules-hero .jump-button{
    width:100%;
    justify-content:center;
  }
  .admin-postpone{
    width:100%;
    display:grid;
    grid-template-columns:1fr;
    align-items:stretch;
  }
  .admin-postpone input{
    width:100%;
  }
  .weekly-update-controls{
    grid-template-columns:1fr;
  }
  .weekly-template-tools{
    display:grid;
    grid-template-columns:1fr;
  }
  .weekly-image-grid{
    grid-template-columns:1fr;
  }
  .rule-card{
    grid-template-columns:38px minmax(0,1fr);
    gap:11px;
    padding:12px;
  }
  .rule-number{
    width:34px;
    height:34px;
    font-size:20px;
  }
  .rule-card h3{ font-size:22px; }
  .rule-card p{ font-size:14px; }
  .member-start-tile.primary{
    min-height:104px;
  }
  .member-start-tile.primary strong{
    font-size:34px;
  }
  .member-start-tile.primary .icon-pill{
    width:54px;
    height:54px;
    font-size:24px;
  }
  .home-actions .my-team-card{
    order:-1;
    min-height:96px;
    border-color:rgba(215,183,98,.5);
    background:
      linear-gradient(135deg,rgba(215,183,98,.18),transparent 38%),
      linear-gradient(150deg,var(--brand-navy,#071a33),var(--brand-blue,#183766));
    color:#fff;
  }
  .home-actions .my-team-card strong{ color:#fff; font-size:30px; }
  .home-actions .my-team-card small{ color:rgba(255,255,255,.78); }
  .home-actions .my-team-card .icon-pill{ background:var(--brand-gold,#d7b762); color:var(--brand-navy,#071a33); }
  .card{ padding:16px; }
  .frame-head{ display:none; }
  .frame-row{ grid-template-columns:1fr; padding:12px 10px; border:1px solid var(--line); border-radius:8px; margin-bottom:10px; }
  .frame-win{ justify-content:stretch; }
  .winbtn{ flex:1; min-height:42px; }
  .table-wrap{
    display:block;
    width:100%;
    max-width:100%;
    min-width:0;
    border-radius:6px;
    overscroll-behavior-x:contain;
    scrollbar-width:thin;
    overflow-x:auto;
    overflow-y:visible;
    touch-action:auto;
    contain:inline-size;
    background:
      linear-gradient(90deg,#fff 30%,rgba(255,255,255,0)),
      linear-gradient(90deg,rgba(255,255,255,0),#fff 70%) 100% 0,
      linear-gradient(90deg,rgba(7,26,51,.18),rgba(7,26,51,0)),
      linear-gradient(270deg,rgba(7,26,51,.18),rgba(7,26,51,0)) 100% 0;
    background-repeat:no-repeat;
    background-size:28px 100%,28px 100%,14px 100%,14px 100%;
    background-attachment:local,local,scroll,scroll;
  }
  .table-wrap::-webkit-scrollbar{ height:8px; }
  .table-wrap::-webkit-scrollbar-track{ background:#edf1f6; border-radius:999px; }
  .table-wrap::-webkit-scrollbar-thumb{ background:rgba(7,26,51,.34); border-radius:999px; }
  table{ min-width:640px; }
  .league-table{ min-width:560px; }
  /* Mobile: pin Points to the right edge so the headline number never hides.
     Width is pinned explicitly — table-layout:auto ignores max-width, and an
     unpinned sticky column inflates and eats the scroll window. */
  .league-table th.pts-col,
  .league-table td.pts-cell{
    position:sticky;
    right:0;
    z-index:3;
    width:46px;
    min-width:46px;
    padding-left:8px;
    padding-right:8px;
    box-shadow:-10px 0 16px -16px rgba(7,26,51,.7);
  }
  /* FF/FA add little over FD on a phone — reclaim ~100px of scroll track. */
  .league-table th.ff-col,
  .league-table th.fa-col,
  .league-table td.num-cell.minor,
  .table-key .ff-key{ display:none; }
  .league-table th.num-col,
  .league-table td.num-cell{ padding-left:7px; padding-right:7px; }
  .league-table th.pts-col{
    z-index:7;
    background:linear-gradient(180deg,#071a33,#0b2443);
  }
  /* Keep the sticky team column narrow: monogram is desktop-only. */
  .league-table .team-monogram.sm{ display:none; }
  .league-table .team-cell{ white-space:normal; }
  /* Opaque equivalents of translucent row washes for sticky cells. */
  .league-table tr.is-leader td:first-child,
  .league-table tr.is-leader td:nth-child(2),
  .league-table tr.is-leader td.pts-cell{ background:#faf2dd; }
  .stats-table tr.qualified td:first-child,
  .stats-table tr.qualified td:nth-child(2){ background:#eef5f0; }
  .stats-table tr.front-runner td:first-child,
  .stats-table tr.front-runner td:nth-child(2){ background:#faf2dd; }
  /* Win bars need horizontal room the fixed mobile columns don't have. */
  .win-bar{ display:none; }
  .form-pip{ width:15px; height:15px; font-size:9px; }
  .form-row{ gap:2px; }
  /* Floating menu button: icon-only circle on phones so it covers less of
     the stats table; the scroll wrap gets matching breathing room below. */
  .mobile-menu-fab{ gap:0; width:54px; min-height:54px; padding:0; }
  .mobile-menu-fab strong{ display:none; }
  .mobile-menu-fab span{ font-size:22px; }
  .stats-table-wrap{ padding-bottom:64px; }
  /* Sort headers need a finger-sized hit area. */
  th.sortable{ padding-top:13px; padding-bottom:13px; }
  /* Cup draw rows: the kick-off chip was out-muscling the team names. */
  .cup-matchup em.cup-start-time{ min-width:62px; padding:0 8px; font-size:14px; }
  .stats-table{
    width:900px;
    min-width:900px;
    max-width:none;
    table-layout:fixed;
  }
  .stats-table-wrap{
    max-height:calc(100vh - 158px);
    overflow:auto;
    -webkit-overflow-scrolling:touch;
  }
  .pots-table{ width:840px; min-width:840px; }
  .desktop-table{ display:block; }
  .mobile-cards{ display:none !important; }
  th,td{
    padding:9px 10px;
    font-size:13px;
    white-space:nowrap;
  }
  th{
    top:0;
    z-index:5;
  }
  .stats-table-wrap .stats-table th{
    z-index:8;
    box-shadow:0 2px 0 rgba(7,26,51,.18);
  }
  td{
    background:#fff;
  }
  tbody tr:nth-child(even) td{
    background:#f8fafc;
  }
  .league-table th:nth-child(2),
  .league-table td:nth-child(2){
    position:sticky;
    left:32px;
    z-index:3;
    width:96px;
    min-width:88px;
    max-width:96px;
    padding-left:8px;
    padding-right:8px;
    white-space:normal;
    box-shadow:10px 0 16px -16px rgba(7,26,51,.7);
  }
  .league-table th:nth-child(2){
    z-index:7;
    background:linear-gradient(180deg,#071a33,#0b2443);
  }
  .league-table th:first-child,
  .league-table td:first-child{
    position:sticky;
    left:0;
    z-index:4;
    width:32px;
    min-width:32px;
    max-width:32px;
    padding-left:4px;
    padding-right:4px;
    text-align:center;
    box-shadow:8px 0 14px -15px rgba(7,26,51,.7);
  }
  .league-table th:first-child{
    z-index:8;
    background:linear-gradient(180deg,#071a33,#0b2443);
  }
  .stats-table-wrap .stats-table th:nth-child(2),
  .stats-table-wrap .stats-table td:nth-child(2){
    position:sticky;
    left:0;
    z-index:3;
    width:124px;
    min-width:124px;
    max-width:124px;
    padding-left:8px;
    padding-right:8px;
    white-space:normal;
    box-shadow:10px 0 16px -16px rgba(7,26,51,.7);
  }
  .stats-table-wrap .stats-table th:first-child,
  .stats-table-wrap .stats-table td:first-child{
    width:38px;
    min-width:38px;
    max-width:38px;
    padding-left:6px;
    padding-right:6px;
    text-align:center;
  }
  .stats-table-wrap .stats-table th:nth-child(n+3),
  .stats-table-wrap .stats-table td:nth-child(n+3){
    width:72px;
    text-align:center;
  }
  .stats-table-wrap .stats-table th:nth-child(3),
  .stats-table-wrap .stats-table td:nth-child(3){
    width:112px;
    text-align:left;
  }
  .stats-table-wrap .stats-table th:last-child,
  .stats-table-wrap .stats-table td:last-child{
    width:82px;
  }
  .stats-table-wrap .stats-table th:nth-child(2){
    z-index:12;
    background:linear-gradient(180deg,#071a33,#0b2443);
  }
  .stats-table-wrap .stats-table td:nth-child(2) strong,
  .league-table td:nth-child(2) .team-cell{
    display:block;
    line-height:1.05;
  }
  .stats-table-wrap .stats-table td:nth-child(2) strong{
    max-width:108px;
    font-size:13px;
    overflow:hidden;
    text-overflow:ellipsis;
    display:-webkit-box;
    -webkit-line-clamp:2;
    -webkit-box-orient:vertical;
  }
  .team-cell{
    font-size:15px;
  }
  .pts-cell{
    font-size:17px;
  }
  .mobile-latest-results-card{ display:block; }
  .desktop-latest-results-card,.upcoming-fixtures-card{ display:none !important; }
  .latest-result-mini-list .mini-fixture.mini-result{
    grid-template-columns:1fr;
    gap:6px;
    padding:11px 12px;
    text-align:center;
  }
  .latest-result-mini-list .mini-result-team{
    display:block;
    overflow:visible;
    text-align:center;
    text-overflow:clip;
    white-space:normal;
    line-height:1.12;
  }
  .latest-result-mini-list .mini-result-score{
    justify-self:center;
    font-size:24px;
    line-height:1;
  }
  .table-wrap::after{
    content:"Swipe";
    position:absolute;
    top:6px;
    right:54px;
    z-index:9;
    padding:3px 8px;
    border-radius:999px;
    background:var(--gold-2);
    color:var(--navy);
    font-family:"Big Shoulders Display",sans-serif;
    font-size:10px;
    font-weight:900;
    letter-spacing:.12em;
    text-transform:uppercase;
    pointer-events:none;
    opacity:0;
  }
  .table-wrap.is-scrollable::after{ opacity:.92; }
  .table-wrap.is-scrolled::after,.table-wrap.at-end::after{ opacity:0; }
}

/* Desktop rail layout */
@media (min-width:761px){
  .mobile-menu-fab{ display:none; }
  .nav-toggle{ display:none; }
  .grid.two{ grid-template-columns:repeat(2,minmax(0,1fr)); }
  .grid.three,.metric-grid{ grid-template-columns:repeat(3,minmax(0,1fr)); }
  .grid.four{ grid-template-columns:repeat(4,minmax(0,1fr)); }
  .quick-grid,.menu-grid,.info-grid{ grid-template-columns:repeat(2,minmax(0,1fr)); }
  .member-start-grid{ grid-template-columns:repeat(2,minmax(0,1fr)); }
  .controls{ grid-template-columns:repeat(4,minmax(0,1fr)); }
  /* The stats filters hold two segmented switches — give them room until
     the viewport is genuinely wide. */
  .stats-controls{ grid-template-columns:repeat(2,minmax(0,1fr)); }
  .fixture-status .score{ font-size:28px; }
  .history-suggestions,.history-list{ grid-template-columns:repeat(2,minmax(0,1fr)); }
}

@media (min-width:1240px){
  .stats-controls{ grid-template-columns:repeat(4,minmax(0,1fr)); }
}

@media (min-width:901px){
  body{ padding:0 34px 46px 288px; }
  .wrap{ width:min(100%,1440px); padding:0; }
  .mast{
    margin-bottom:24px;
    padding:22px 0 18px;
    background:transparent;
    color:var(--ink);
    box-shadow:none;
    clip-path:none;
    border-bottom:1px solid var(--line);
  }
  .league-name{ color:var(--navy); text-shadow:none; font-size:58px; }
  .page-title{ color:var(--muted); }
  .page-sub{ color:var(--gold); }
  .brand-rack{ width:104px; filter:none; }
  .desktop-side-menu{
    position:fixed;
    left:0;
    top:0;
    bottom:0;
    z-index:50;
    display:flex;
    flex-direction:column;
    gap:18px;
    width:260px;
    padding:24px 18px;
    overflow:auto;
    background:linear-gradient(180deg,#061629 0%,#0b2443 58%,#071a33 100%);
    border-right:1px solid rgba(215,183,98,.32);
    box-shadow:18px 0 52px -42px rgba(0,0,0,.95);
  }
  .nav-shell{ display:none; }
  #content{ margin-top:22px; }
  .website-hero{ grid-template-columns:1.2fr .8fr; gap:18px; align-items:stretch; }
  .homepage-grid{ grid-template-columns:minmax(0,1fr) 340px; align-items:start; }
  .team-dashboard{ grid-template-columns:.95fr 1.05fr; align-items:start; }
  .home-split{ grid-template-columns:repeat(2,minmax(0,1fr)); }
  .quick-grid,.menu-grid,.info-grid{ grid-template-columns:repeat(3,minmax(0,1fr)); }
  .member-start-grid{ grid-template-columns:repeat(4,minmax(0,1fr)); }
  .member-start-card{ padding:22px; }
  .website-hero-main{ padding:34px; }
  .website-hero-main h2{ font-size:72px; }
  .cat-win-record{ display:block; color:var(--muted); font-size:13px; }
  body.desktop-rail-collapsed{ padding-left:96px; }
  body.desktop-rail-collapsed .desktop-side-menu{ width:72px; padding:18px 10px; overflow-x:hidden; }
  body.desktop-rail-collapsed .side-menu-brand div,
  body.desktop-rail-collapsed .side-menu-section h2,
  body.desktop-rail-collapsed .side-menu-section a strong,
  body.desktop-rail-collapsed .side-menu-collapse-text{ display:none; }
  body.desktop-rail-collapsed .side-menu-brand{ justify-content:center; }
  body.desktop-rail-collapsed .side-menu-brand img{ width:42px; }
  body.desktop-rail-collapsed .side-menu-section a{ display:flex; justify-content:center; grid-template-columns:none; padding:6px; }
}

/* =========================================================================
   LCPL visual design pass
   Restores the broadcast-style blue brand bands and tightens the cleaned CSS.
   ========================================================================= */
:root{
  --brand-navy:#06192f;
  --brand-blue:#123e73;
  --brand-blue-2:#0b2c56;
  --overscroll-blue:#123e73;
  --brand-gold:#d7b762;
  --brand-gold-deep:#a87b13;
  --brand-rule:rgba(7,26,51,.13);
  --brand-shadow:0 26px 70px -52px rgba(6,25,47,.95);
}

body{
  background:
    linear-gradient(180deg,#edf2f8 0%,#f7f9fc 34%,#eef2f7 100%);
}

.mast,
.website-hero-main,
.hero-panel,
.team-profile,
.team-profile-poster{
  background:
    linear-gradient(135deg,rgba(215,183,98,.18),transparent 36%),
    linear-gradient(150deg,var(--brand-navy) 0%,var(--brand-blue) 58%,var(--brand-blue-2) 100%);
}

.mast,
.website-hero-main,
.hero-panel,
.team-profile,
.team-profile-poster,
.desktop-side-menu{
  border-color:rgba(215,183,98,.42);
}

.card,
.summary-card,
.sidebar-card,
.empty-state,
.website-hero-card,
.quick-card,
.menu-card,
.team-card-link,
.league-card,
.player-card,
.mini-result-card,
.history-card,
.stat{
  border-color:var(--brand-rule);
  box-shadow:var(--brand-shadow);
}

.card,
.summary-card,
.sidebar-card,
.website-hero-card,
.quick-card,
.menu-card,
.team-card-link,
.league-card,
.player-card,
.mini-result-card,
.history-card,
.stat,
.table-wrap,
input,
select,
textarea{
  border-radius:7px;
}

h2,
h3,
.team-cell,
.quick-card strong,
.menu-card strong,
.team-card-link strong{
  letter-spacing:.015em;
}

.section-head{
  padding-bottom:12px;
  border-bottom:1px solid rgba(7,26,51,.08);
}

.section-head .sec-note{
  margin-bottom:0;
}

.view-link{
  display:inline-flex;
  align-items:center;
  gap:7px;
  color:var(--brand-blue);
  font-size:13px;
  letter-spacing:.06em;
  text-transform:uppercase;
}

.view-link::after{
  content:"";
  width:7px;
  height:7px;
  border-top:2px solid currentColor;
  border-right:2px solid currentColor;
  transform:rotate(45deg);
}

button.action,
.jump-button{
  border-radius:6px;
  background:linear-gradient(145deg,var(--brand-navy),var(--brand-blue-2));
  border-color:var(--brand-navy);
  box-shadow:0 12px 26px -22px rgba(6,25,47,.9);
}

button.action.secondary,
.jump-button.secondary,
.button-like{
  background:#fff;
  color:var(--brand-navy);
  border-color:rgba(6,25,47,.45);
  box-shadow:none;
}

button.action:hover,
.jump-button:hover,
.quick-card:hover,
.menu-card:hover,
.team-card-link:hover,
.fixture-team-button:hover{
  border-color:var(--brand-gold-deep);
}

.chip{
  border-radius:6px;
  background:#fff;
}

.chip.on,
.segmented button.on{
  background:linear-gradient(145deg,var(--brand-navy),var(--brand-blue-2));
}

.badge{
  border-radius:5px;
  font-size:11px;
  letter-spacing:.04em;
  text-transform:uppercase;
}

.badge.gold,
.week-pill{
  background:rgba(215,183,98,.2);
  color:#6d4d05;
}

.table-wrap{
  border-color:rgba(7,26,51,.14);
  box-shadow:0 18px 50px -46px rgba(7,26,51,.85);
}

th{
  background:linear-gradient(180deg,#071a33,#0b2443);
  color:var(--brand-gold);
  border-bottom:1px solid rgba(215,183,98,.28);
}

td{
  background:#fff;
}

tbody tr:nth-child(even) td{
  background:#f8fafc;
}

tbody tr:hover td{
  background:rgba(215,183,98,.16);
}

.position-with-move{
  gap:6px;
}

.table-move{
  display:inline-block;
  width:0;
  height:0;
  opacity:.42;
  font-size:0;
  transform:none;
}

.table-move.up{
  border-left:4px solid transparent;
  border-right:4px solid transparent;
  border-bottom:6px solid var(--ok);
}

.table-move.down{
  border-left:4px solid transparent;
  border-right:4px solid transparent;
  border-top:6px solid var(--danger);
}

.table-move.same{
  width:6px;
  height:2px;
  border:0;
  border-radius:1px;
  background:rgba(7,26,51,.22);
}

.fixture-card{
  border-bottom-color:rgba(7,26,51,.09);
}

.fixture-card.played{
  background:linear-gradient(90deg,rgba(7,26,51,.025),transparent);
}

.ha{
  border-radius:4px;
}

.ha.home{
  background:var(--brand-navy);
}

.ha.away{
  border-color:rgba(6,25,47,.55);
}

.score,
.pts-cell,
.week{
  letter-spacing:.02em;
}

.notice{
  border-radius:6px;
  background:#fbfcfe;
}

.stat{
  background:linear-gradient(180deg,#fff,#f8fafc);
}

.stat .num{
  color:var(--brand-navy);
}

.icon-pill,
.team-monogram,
.brand-mark{
  border-radius:6px;
  background:linear-gradient(145deg,var(--brand-navy),var(--brand-blue-2));
  color:var(--brand-gold);
}

.quick-card,
.menu-card,
.team-card-link{
  background:linear-gradient(180deg,#fff,#f9fbfe);
  transition:border-color .16s ease, transform .16s ease, box-shadow .16s ease;
}

.quick-card:hover,
.menu-card:hover,
.team-card-link:hover{
  box-shadow:0 22px 52px -42px rgba(6,25,47,.82);
}

.leader-place,
.cat-win-cat,
.perf-rank,
.position-badge{
  border-radius:5px;
  background:linear-gradient(145deg,var(--brand-navy),var(--brand-blue-2));
}

.league-card.leader,
.leader-rank-row.rank-1{
  background:linear-gradient(90deg,rgba(215,183,98,.18),rgba(255,255,255,.2));
}

.share-table-button::before{
  border-radius:2px;
  background:var(--brand-gold);
  box-shadow:none;
  transform:rotate(45deg);
}

@media (min-width:901px){
  body{
    padding-top:0;
  }

  .wrap{
    padding-bottom:54px;
  }

  .mast{
    display:flex;
    align-items:center;
    justify-content:space-between;
    min-height:126px;
    margin:0 0 26px;
    padding:24px 28px;
    border:0;
    border-radius:0 0 10px 10px;
    background:none;
    color:#fff;
    box-shadow:var(--brand-shadow);
    overflow:visible;
    position:relative;
    isolation:isolate;
  }

  .mast::before{
    content:"";
    position:absolute;
    top:0;
    bottom:0;
    left:calc(-1 * ((100vw - 100%) / 2));
    right:calc(-1 * ((100vw - 100%) / 2));
    z-index:-2;
    border:1px solid rgba(215,183,98,.36);
    border-top:0;
    border-left:0;
    border-right:0;
    background:
      url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 0.05 0'/%3E%3C/filter%3E%3Crect width='160' height='160' filter='url(%23n)'/%3E%3C/svg%3E") repeat left top / 160px 160px,
      url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1200 360' preserveAspectRatio='xMidYMid slice'%3E%3Cg fill='none' stroke-width='2'%3E%3Ccircle cx='1060' cy='70' r='220' stroke='rgba(255,255,255,0.05)'/%3E%3Ccircle cx='1060' cy='70' r='156' stroke='rgba(215,183,98,0.09)'/%3E%3Ccircle cx='1060' cy='70' r='98' stroke='rgba(255,255,255,0.04)'/%3E%3Ccircle cx='870' cy='330' r='120' stroke='rgba(255,255,255,0.045)'/%3E%3Ccircle cx='190' cy='340' r='170' stroke='rgba(255,255,255,0.04)'/%3E%3Ccircle cx='190' cy='340' r='118' stroke='rgba(215,183,98,0.06)'/%3E%3C/g%3E%3C/svg%3E") center / cover no-repeat,
      linear-gradient(115deg, transparent 0 36%, rgba(255,255,255,.03) 36% 45%, transparent 45% 58%, rgba(215,183,98,.055) 58% 61.5%, transparent 61.5% 76%, rgba(255,255,255,.025) 76% 87%, transparent 87%),
      radial-gradient(120% 200% at 12% 0%, rgba(215,183,98,.16), transparent 50%),
      linear-gradient(155deg,#16345f 0%, #0e2a50 48%, #071a33 100%);
    box-shadow:var(--brand-shadow);
  }

  .mast::after{
    content:"LCPL";
    position:absolute;
    top:auto;
    left:auto;
    right:22px;
    bottom:-24px;
    height:auto;
    z-index:-1;
    background:none;
    color:rgba(255,255,255,.055);
    font-family:"Big Shoulders Display",sans-serif;
    font-size:118px;
    font-weight:900;
    line-height:1;
    pointer-events:none;
  }

  .brand-lockup{
    position:relative;
    z-index:2;
    gap:18px;
  }

  .brand-rack{
    width:98px;
    filter:drop-shadow(0 16px 24px rgba(0,0,0,.28));
  }

  .tag{
    display:grid;
    gap:7px;
    justify-items:end;
    margin-right:6px;
    padding:12px 16px;
    border:1px solid rgba(215,183,98,.34);
    border-radius:10px;
    background:rgba(255,255,255,.05);
    color:#fff;
    text-align:right;
  }
  .tag strong{
    color:var(--gold-2);
    font-family:"Big Shoulders Display",sans-serif;
    font-size:22px;
    font-weight:900;
    line-height:1;
    letter-spacing:.05em;
    text-transform:uppercase;
  }
  .tag span{
    color:rgba(255,255,255,.62);
    font-size:10.5px;
    font-weight:800;
    letter-spacing:.1em;
    text-transform:uppercase;
  }

  .league-name{
    color:#fff;
    font-size:54px;
    letter-spacing:.018em;
    text-shadow:0 2px 0 rgba(0,0,0,.16);
  }

  .page-title{
    color:rgba(255,255,255,.82);
    font-size:13px;
    letter-spacing:.1em;
  }

  .page-sub{
    color:rgba(255,255,255,.74);
  }

  .kicker{
    color:var(--brand-gold);
  }

  #content{
    margin-top:0;
    gap:22px;
  }

  .website-hero{
    grid-template-columns:minmax(0,1.7fr) minmax(330px,.72fr);
    gap:22px;
  }

  .website-hero-main{
    min-height:330px;
    padding:42px 44px;
    border:1px solid rgba(215,183,98,.36);
    border-radius:10px;
  }

  .website-hero-main::after{
    content:"";
    position:absolute;
    right:-60px;
    bottom:-70px;
    width:260px;
    height:260px;
    border:1px solid rgba(215,183,98,.28);
    border-radius:50%;
    box-shadow:inset 0 0 0 36px rgba(255,255,255,.035);
  }

  .website-hero-main h2{
    max-width:780px;
    font-size:clamp(62px,5.6vw,88px);
    line-height:.84;
  }

  .website-hero-main p{
    max-width:650px;
    font-size:19px;
    color:rgba(255,255,255,.82);
  }

  .website-hero-card{
    padding:26px;
  }

  .homepage-grid{
    grid-template-columns:minmax(0,1.55fr) minmax(310px,.72fr);
    gap:22px;
  }

  .home-split{
    gap:22px;
  }

  .summary-card,
  .sidebar-card,
  .card{
    padding:24px;
  }

  .summary-card h2,
  .sidebar-card h2,
  .card > h2:first-child{
    font-size:32px;
  }

  .sidebar-card{
    border-left:5px solid var(--brand-blue);
  }

  .announcement-card{
    border-left-color:var(--brand-gold-deep);
  }

  .quick-grid.home-actions{
    grid-template-columns:repeat(4,minmax(0,1fr));
  }

  .fixture-card{
    padding:12px 0;
  }

  .latest-results-list .fixture-card{
    padding:11px 0;
  }

  .desktop-side-menu{
    background:
      linear-gradient(180deg,rgba(215,183,98,.09),transparent 22%),
      linear-gradient(180deg,#061629 0%,#0b2443 58%,#071a33 100%);
  }

  .side-menu-section a{
    border-radius:6px;
  }

  .side-menu-section a span{
    border-radius:5px;
  }
}

@media (max-width:900px){
  /* Mobile banner: the full-bleed field (gold stripe, gradient, glow) is
     painted by the base .mast::before. Keep overflow visible so the bleed
     isn't clipped; clip-path on .mast bounds it. */
  .mast{
    position:relative;
    isolation:isolate;
    width:100%;
    margin-left:0;
    margin-right:0;
    padding-left:12px;
    padding-right:12px;
    border-bottom:0;
    background:transparent;
    box-shadow:none;
    clip-path:inset(0 -100vmax);
    overflow:visible;
  }

  .brand-lockup{
    position:relative;
    z-index:1;
  }

  .website-hero-main,
  .hero-panel,
  .team-profile,
  .team-profile-poster{
    border-radius:8px;
  }
}

/* Mobile control repair: stat mode buttons need room to breathe. */
@media (max-width:760px){
  .history-controls .field:nth-child(2),
  .team-performer-panel .team-mode-tabs{
    grid-column:1 / -1;
  }

  .history-segmented,
  .team-mode-tabs{
    grid-template-columns:1fr !important;
    gap:8px;
    padding:7px;
  }

  .history-segmented button,
  .team-mode-tabs button{
    min-height:50px;
    padding:10px 12px;
    font-size:21px;
    letter-spacing:.03em;
    white-space:normal;
  }
}

/* Stats page mobile: force mode controls onto their own readable rows. */
@media (max-width:900px){
  .stats-controls{
    grid-template-columns:1fr !important;
  }

  .stat-mode-field{
    grid-column:1 / -1 !important;
    width:100% !important;
  }

  .stat-mode-segmented{
    display:grid !important;
    grid-template-columns:1fr !important;
    gap:10px !important;
    width:100% !important;
    padding:8px !important;
  }

  .stat-mode-segmented button{
    width:100% !important;
    min-height:56px !important;
    padding:13px 16px !important;
    font-size:24px !important;
    line-height:1 !important;
    letter-spacing:.02em !important;
  }
}

/* =========================================================================
   Motion design layer
   Fast, purposeful animation: entrances when a page renders, growth on the
   data visuals, and press/hover physics on interactive elements. Everything
   sits behind prefers-reduced-motion so opted-out users get an instant UI.
   Only transform and opacity are animated (GPU-friendly, no layout thrash).
   Re-rendered regions (stats leaderboard rows, filter output) deliberately
   get no entrance animation — they redraw on every keystroke.
   ========================================================================= */
@media (prefers-reduced-motion: no-preference){

  /* Cross-document page transitions (progressive enhancement, Chromium). */
  @view-transition{ navigation:auto; }
  ::view-transition-old(root),
  ::view-transition-new(root){ animation-duration:.18s; }

  @keyframes lcpl-fade-in{ from{ opacity:0; } }
  @keyframes lcpl-rise-in{ from{ opacity:0; transform:translateY(12px); } }
  @keyframes lcpl-pop-in{
    0%{ opacity:0; transform:scale(.6); }
    70%{ transform:scale(1.06); }
    100%{ opacity:1; transform:scale(1); }
  }
  @keyframes lcpl-bar-grow{ from{ transform:scaleX(0); } }
  @keyframes lcpl-pulse{ 50%{ opacity:.4; } }

  /* --- Page entrance: masthead first, content cards rise in sequence --- */
  .mast{ animation:lcpl-fade-in .5s ease-out backwards; }

  /* --- Gold brand stripe sheen: a slow light sweep along the top edge.
         Mobile-scoped — on desktop ::after is the LCPL watermark. --- */
  @keyframes lcpl-stripe-sheen{
    from{ background-position:140% 0; }
    to{ background-position:-40% 0; }
  }
  @media (max-width:900px){
    .mast::after{ animation:lcpl-stripe-sheen 7s ease-in-out infinite; }
  }
  #content > *{ animation:lcpl-rise-in .5s cubic-bezier(.16,1,.3,1) backwards; }
  #content > *:nth-child(1){ animation-delay:.06s; }
  #content > *:nth-child(2){ animation-delay:.12s; }
  #content > *:nth-child(3){ animation-delay:.18s; }
  #content > *:nth-child(4){ animation-delay:.24s; }
  #content > *:nth-child(5){ animation-delay:.3s; }
  #content > *:nth-child(n+6){ animation-delay:.34s; }
  .footer{ animation:lcpl-fade-in .6s .3s ease-out backwards; }

  /* --- League table rows cascade (renders once per visit).
         Opacity only: translate would disturb the sticky columns. --- */
  .league-table tbody tr{ animation:lcpl-fade-in .4s ease-out backwards; }
  .league-table tbody tr:nth-child(1){ animation-delay:.05s; }
  .league-table tbody tr:nth-child(2){ animation-delay:.08s; }
  .league-table tbody tr:nth-child(3){ animation-delay:.11s; }
  .league-table tbody tr:nth-child(4){ animation-delay:.14s; }
  .league-table tbody tr:nth-child(5){ animation-delay:.17s; }
  .league-table tbody tr:nth-child(6){ animation-delay:.2s; }
  .league-table tbody tr:nth-child(7){ animation-delay:.23s; }
  .league-table tbody tr:nth-child(8){ animation-delay:.26s; }
  .league-table tbody tr:nth-child(9){ animation-delay:.29s; }
  .league-table tbody tr:nth-child(10){ animation-delay:.32s; }
  .league-table tbody tr:nth-child(n+11){ animation-delay:.35s; }

  /* --- Data visuals: bars grow, pips and medals pop --- */
  .win-bar-fill{
    transform-origin:left center;
    animation:lcpl-bar-grow .6s cubic-bezier(.22,1,.36,1) backwards;
  }
  .form-row .form-pip{ animation:lcpl-pop-in .3s ease-out backwards; }
  .form-row .form-pip:nth-child(1){ animation-delay:.3s; }
  .form-row .form-pip:nth-child(2){ animation-delay:.36s; }
  .form-row .form-pip:nth-child(3){ animation-delay:.42s; }
  .form-row .form-pip:nth-child(4){ animation-delay:.48s; }
  .form-row .form-pip:nth-child(5){ animation-delay:.54s; }
  .rank-1 .rank-num{ animation:lcpl-pop-in .4s .1s cubic-bezier(.34,1.56,.64,1) backwards; }
  .rank-2 .rank-num{ animation:lcpl-pop-in .4s .18s cubic-bezier(.34,1.56,.64,1) backwards; }
  .rank-3 .rank-num{ animation:lcpl-pop-in .4s .26s cubic-bezier(.34,1.56,.64,1) backwards; }

  /* --- History cards rise when a player is chosen --- */
  .history-list .history-card{ animation:lcpl-rise-in .4s cubic-bezier(.16,1,.3,1) backwards; }
  .history-list .history-card:nth-child(1){ animation-delay:.04s; }
  .history-list .history-card:nth-child(2){ animation-delay:.08s; }
  .history-list .history-card:nth-child(3){ animation-delay:.12s; }
  .history-list .history-card:nth-child(4){ animation-delay:.16s; }
  .history-list .history-card:nth-child(5){ animation-delay:.2s; }
  .history-list .history-card:nth-child(6){ animation-delay:.24s; }
  .history-list .history-card:nth-child(n+7){ animation-delay:.28s; }

  /* --- Loading text breathes while data fetches --- */
  .loading{ animation:lcpl-pulse 1.3s ease-in-out infinite; }
  @keyframes lcpl-skeleton-sweep{
    from{ background-position:100% 0; }
    to{ background-position:0 0; }
  }
  .sk-line,.sk-block{ animation:lcpl-skeleton-sweep 1.4s ease-in-out infinite; }

  /* --- Live cup matches: the status dot pulses like a broadcast marker.
         No entrance animation on cup rows — the feed re-renders every
         60 seconds and replaying entrances would be noise. --- */
  @keyframes lcpl-live-pulse{
    0%,100%{ box-shadow:0 0 0 4px rgba(185,144,37,.18); }
    50%{ box-shadow:0 0 0 8px rgba(185,144,37,.04); }
  }
  .cup-live-status::before{ animation:lcpl-live-pulse 1.6s ease-in-out infinite; }

  /* --- Micro-interactions: hover lift, press feedback --- */
  button.action,.jump-button{
    transition:transform .15s ease, box-shadow .2s ease, border-color .16s ease, background-color .16s ease;
  }
  button.action:hover,.jump-button:hover{ transform:translateY(-1px); }
  button.action:active,.jump-button:active{ transform:translateY(1px) scale(.985); transition-duration:.06s; }
  .segmented button{ transition:background-color .18s ease, color .18s ease, transform .15s ease; }
  .segmented button:active{ transform:scale(.96); }
  .quick-card:hover,.menu-card:hover,.team-card-link:hover{ transform:translateY(-3px); }
  th.sortable{ transition:color .15s ease, box-shadow .2s ease; }
  .form-pip{ transition:transform .15s ease; }
  .form-pip:hover{ transform:scale(1.2); }
  .mobile-menu-fab{
    animation:lcpl-pop-in .45s .3s cubic-bezier(.34,1.56,.64,1) backwards;
    transition:transform .15s ease;
  }
  .mobile-menu-fab:active{ transform:scale(.94); }
  .share-status{ transition:opacity .25s ease, min-height .25s ease; }

  /* --- Mobile drawer: links cascade in after the panel slides --- */
  .nav-drawer.open .drawer-link{ animation:lcpl-rise-in .35s cubic-bezier(.16,1,.3,1) backwards; }
  .nav-drawer.open .drawer-link:nth-child(1){ animation-delay:.08s; }
  .nav-drawer.open .drawer-link:nth-child(2){ animation-delay:.11s; }
  .nav-drawer.open .drawer-link:nth-child(3){ animation-delay:.14s; }
  .nav-drawer.open .drawer-link:nth-child(4){ animation-delay:.17s; }
  .nav-drawer.open .drawer-link:nth-child(5){ animation-delay:.2s; }
  .nav-drawer.open .drawer-link:nth-child(6){ animation-delay:.23s; }
  .nav-drawer.open .drawer-link:nth-child(7){ animation-delay:.26s; }
  .nav-drawer.open .drawer-link:nth-child(8){ animation-delay:.29s; }
  .nav-drawer.open .drawer-link:nth-child(9){ animation-delay:.32s; }
  .nav-drawer.open .drawer-link:nth-child(n+10){ animation-delay:.35s; }

  /* --- Desktop side rail collapse glides. The body transition is scoped
         to desktop: transitioning body padding across the mobile breakpoint
         would animate a structural jump that should be instant. --- */
  .desktop-side-menu{ transition:width .25s ease, padding .25s ease; }
  @media (min-width:901px){
    body{ transition:padding-left .25s ease; }
  }
}

/* ===== Break & Dish ======================================================= */
.bd-hero{ display:flex; align-items:flex-end; justify-content:space-between; gap:16px; flex-wrap:wrap; }
.bd-hero h2{ font-size:clamp(30px,6vw,46px); }
.bd-hero .kicker{ color:#8a6410; } /* deep gold for AA on the white card */
.bd-hero-status{ display:flex; flex-direction:column; align-items:flex-end; gap:4px; text-align:right; }
.bd-status-pill{ display:inline-block; padding:6px 12px; border-radius:999px; font-weight:900; font-size:12px; text-transform:uppercase; letter-spacing:.06em; background:var(--soft); color:var(--navy); border:1px solid var(--line); }
.bd-status-pill.open{ background:rgba(47,125,79,.14); color:var(--ok); border-color:rgba(47,125,79,.4); }
.bd-status-pill.closed{ background:rgba(170,34,51,.1); color:var(--danger); border-color:rgba(170,34,51,.35); }
.bd-status-pill.scheduled{ background:rgba(215,183,98,.18); color:#8a6410; border-color:rgba(215,183,98,.5); }
.bd-status-pill.drawn,.bd-status-pill.none{ background:var(--soft); color:var(--muted); }
.bd-status-date{ font-size:12px; color:var(--muted); font-weight:700; }

.bd-nav{ display:flex; gap:8px; flex-wrap:wrap; margin:14px 0 16px; }
.bd-tab{ flex:1 1 auto; min-width:90px; font-family:"Big Shoulders Display",sans-serif; font-weight:900; font-size:16px; text-transform:uppercase; letter-spacing:.03em; padding:11px 14px; border:1.5px solid var(--navy); background:#fff; color:var(--navy); border-radius:8px; cursor:pointer; transition:background .15s,color .15s; }
.bd-tab:hover{ background:var(--soft); }
.bd-tab.on{ background:var(--navy); color:#fff; }

.bd-stats{ display:grid; grid-template-columns:repeat(4,1fr); gap:10px; margin-bottom:16px; }

.bd-draw-stage{ text-align:center; }
.bd-draw-placeholder{ padding:30px 16px; }
.bd-draw-icon{ font-size:50px; color:var(--gold-2); line-height:1; margin-bottom:8px; }
.bd-draw-placeholder strong{ display:block; font-family:"Big Shoulders Display",sans-serif; font-size:22px; color:var(--navy); text-transform:uppercase; }
.bd-draw-placeholder p{ max-width:460px; margin:8px auto 0; color:var(--muted); font-size:14px; line-height:1.5; }

/* Rules blocks + forfeit/price tables (Break & Dish only) */
.rules-block{ margin-bottom:16px; }
.rules-block:last-child{ margin-bottom:0; }
.rules-block h3{ font-family:"Big Shoulders Display",sans-serif; font-weight:900; font-size:18px; color:var(--navy); text-transform:uppercase; letter-spacing:.02em; margin-bottom:5px; padding-bottom:4px; border-bottom:2px solid var(--soft); }
.rules-block p{ margin:6px 0; font-size:14px; line-height:1.55; }
.rules-prices{ display:grid; grid-template-columns:repeat(4,1fr); gap:8px; margin:10px 0; }
.rules-prices .rp{ background:var(--cream); border:1px solid var(--gold-2); border-radius:8px; padding:8px; text-align:center; }
.rules-prices .t{ font-family:"Big Shoulders Display",sans-serif; font-weight:900; font-size:20px; color:var(--navy); line-height:1; }
.rules-prices .p{ font-weight:800; font-size:13px; color:#8a6410; margin-top:2px; }
.cat-table{ border:1px solid var(--line); border-radius:8px; overflow:hidden; margin:12px 0; }
.cat-row{ display:grid; grid-template-columns:96px 1fr; }
.cat-row + .cat-row{ border-top:1px solid var(--line); }
.cat-row .cat-c{ padding:9px 10px; font-weight:900; color:var(--navy); background:var(--cream); border-right:1px solid var(--line); display:flex; align-items:center; }
.cat-row .cat-f{ padding:9px 12px; font-size:13px; line-height:1.5; }
.cat-row.cat-head .cat-c,.cat-row.cat-head .cat-f{ background:var(--navy); color:#fff; font-family:"Big Shoulders Display",sans-serif; font-weight:700; text-transform:uppercase; letter-spacing:.03em; font-size:13px; }

@media (max-width:620px){
  .bd-stats,.rules-prices{ grid-template-columns:repeat(2,1fr); }
  .cat-row{ grid-template-columns:74px 1fr; }
  .cat-row .cat-f{ font-size:12px; }
  .bd-hero-status{ text-align:left; align-items:flex-start; }
}

/* Break & Dish — live draw wheels */
.bd-wheel-wrap{ position:relative; width:460px; max-width:100%; margin:8px auto 4px; }
.bd-wheel-wrap canvas{ width:100%; height:auto; display:block; filter:drop-shadow(0 12px 28px rgba(7,26,51,.28)); }
.bd-wheel-pointer{ position:absolute; top:-6px; left:50%; transform:translateX(-50%); width:0; height:0; border-left:15px solid transparent; border-right:15px solid transparent; border-top:26px solid var(--gold); z-index:3; filter:drop-shadow(0 2px 2px rgba(0,0,0,.25)); }
.bd-reveal{ text-align:center; margin:14px auto 4px; min-height:30px; }
.bd-reveal.show{ animation:bd-pop .5s cubic-bezier(.2,1.3,.4,1); }
@keyframes bd-pop{ from{opacity:0;transform:scale(.6);} to{opacity:1;transform:scale(1);} }
.bd-rev-num{ font-family:"Big Shoulders Display",sans-serif; font-weight:900; font-size:48px; color:#8a6410; line-height:.9; }
.bd-rev-name{ font-family:"Big Shoulders Display",sans-serif; font-weight:900; font-size:26px; color:var(--navy); text-transform:uppercase; line-height:1; margin-top:2px; }
.bd-rev-team{ color:var(--muted); font-weight:700; font-size:14px; margin-top:2px; }
.bd-rev-forfeit{ font-family:"Big Shoulders Display",sans-serif; font-weight:900; font-size:24px; color:#8a6410; text-transform:uppercase; margin-top:4px; }
.bd-viewers{ font-size:13px; font-weight:900; color:var(--navy); white-space:nowrap; }
.wheel-waiting{ color:var(--muted); font-style:italic; }

/* Break & Dish — entries grouped by team (captain cash reconciliation) */
.bd-team-entries{ margin-top:16px; }
.bd-team-entries-head{ display:flex; align-items:center; justify-content:space-between; gap:10px; margin-bottom:6px; flex-wrap:wrap; }
.bd-team-entries-head strong{ font-family:"Big Shoulders Display",sans-serif; font-size:18px; color:var(--navy); text-transform:uppercase; letter-spacing:.02em; }
tr.bd-team-total td{ font-weight:900; color:var(--navy); border-top:2px solid var(--line); background:var(--soft); }

/* Break & Dish — cash tracker (who's holding entry cash) + re-mark select */
.bd-cash-grid{ display:grid; grid-template-columns:1fr 1fr; gap:18px; }
@media (max-width:720px){ .bd-cash-grid{ grid-template-columns:1fr; } }
.bd-cash-col h3{ font-family:"Big Shoulders Display",sans-serif; font-size:18px; font-weight:900; text-transform:uppercase; letter-spacing:.02em; color:var(--navy); margin:0 0 4px; }
.bd-cash-clear{ padding:10px 12px; background:var(--soft); border:1px solid var(--line); border-radius:10px; color:#2e6b34; font-weight:700; }
.bd-pay-select{ width:100%; max-width:230px; padding:6px 8px; border:1px solid var(--line); border-radius:8px; font:inherit; font-size:13px; background:#fff; }
.bd-pay-select:focus-visible{ outline:2px solid var(--gold); outline-offset:1px; }

/* Break & Dish — two-pick draw: step header, picks summary, archive attempts */
.bd-draw-step{ text-align:center; font-family:"Big Shoulders Display",sans-serif; font-weight:900; font-size:16px; text-transform:uppercase; letter-spacing:.04em; color:#8a6410; margin:0 0 10px; }
.bd-picks{ list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:8px; }
.bd-picks li{ padding:11px 13px; background:var(--soft); border:1px solid var(--line); border-radius:10px; line-height:1.4; }
.bd-attempt{ border:1px solid var(--line); border-radius:12px; padding:12px 13px; margin-top:12px; background:var(--soft); }
.bd-attempt-h{ margin:0 0 8px; font-family:"Big Shoulders Display",sans-serif; font-size:16px; font-weight:900; color:var(--navy); text-transform:uppercase; letter-spacing:.02em; }
.muted{ color:var(--muted); }

/* Big-screen / Facebook Live mode (?screen=1): hide chrome, focus the wheels */
body.bd-screen .mast, body.bd-screen .nav-shell, body.bd-screen .desktop-side-menu,
body.bd-screen .mobile-menu-fab, body.bd-screen .footer, body.bd-screen .bd-hero,
body.bd-screen .bd-nav, body.bd-screen .skip-link{ display:none !important; }
body.bd-screen .wrap{ width:min(100%,820px); padding:8px 12px 40px; }
@media (prefers-reduced-motion: reduce){ .bd-reveal.show{ animation:none; } }

/* =====================================================================
   Dream Team side game (dreamteam.html) — pool-native: baize green and
   the reds / yellows / black off the table, in the league navy & gold.
   ===================================================================== */
.dt-hero{ display:flex; align-items:center; justify-content:space-between; gap:20px; flex-wrap:wrap;
  background:linear-gradient(135deg, var(--navy) 0%, #0c2950 58%, #14633e 145%); color:#fff; border:none; }
.dt-hero h2{ color:#fff; margin:.1em 0 .25em; }
.dt-hero .kicker{ color:var(--gold-2,#d7b762); }
.dt-hero .sec-note{ color:rgba(255,255,255,.82); max-width:54ch; }
.dt-hero .sec-note strong{ color:var(--gold-2,#d7b762); }
.dt-hero-badge{ flex:0 0 auto; display:flex; flex-direction:column; align-items:center; gap:4px;
  background:rgba(255,255,255,.06); border:1px solid rgba(215,183,98,.5); border-radius:16px; padding:14px 22px; }
.dt-badge-num{ font-family:"Big Shoulders Display",sans-serif; font-weight:900; font-size:46px; line-height:.9; color:var(--gold-2,#d7b762); }
.dt-badge-num span{ font-size:20px; }
.dt-badge-label{ font-size:11px; text-transform:uppercase; letter-spacing:.12em; color:rgba(255,255,255,.72); }

.dt-actions{ display:flex; gap:10px; flex-wrap:wrap; justify-content:center; margin-top:16px; }
.action.dt-go{ font-size:17px; padding:13px 26px; }
.dt-foot{ text-align:center; margin-top:14px; }

.dt-how{ display:grid; gap:14px; }
.dt-how-step{ display:flex; gap:14px; align-items:flex-start; }
.dt-how-step strong{ font-family:"Big Shoulders Display",sans-serif; font-size:19px; text-transform:uppercase; letter-spacing:.02em; color:var(--navy); }
.dt-how-step p{ margin:2px 0 0; color:var(--muted); }
.dt-how-ball{ flex:0 0 auto; width:40px; height:40px; border-radius:50%; display:grid; place-items:center;
  font-family:"Big Shoulders Display",sans-serif; font-weight:900; font-size:19px; color:#fff;
  box-shadow:inset -3px -4px 8px rgba(0,0,0,.35), inset 3px 3px 6px rgba(255,255,255,.25); }
.dt-how-ball.red{ background:radial-gradient(circle at 35% 30%, #e35d4f, #b32c1d); }
.dt-how-ball.yellow{ background:radial-gradient(circle at 35% 30%, #f4cf63, #cf9a16); color:#3a2a00; }
.dt-how-ball.black{ background:radial-gradient(circle at 35% 30%, #45506a, #0c1626); }

.dt-progress{ display:flex; align-items:center; gap:12px; margin-bottom:14px; font-weight:800; color:var(--navy); }
.dt-progress span{ white-space:nowrap; font-family:"Big Shoulders Display",sans-serif; text-transform:uppercase; letter-spacing:.03em; }
.dt-pbar{ flex:1; height:8px; background:var(--soft); border:1px solid var(--line); border-radius:99px; overflow:hidden; }
.dt-pbar>span{ display:block; height:100%; background:linear-gradient(90deg,var(--gold,#b99025),var(--gold-2,#d7b762)); transition:width .4s ease; }
.dt-squad-head{ display:flex; align-items:center; justify-content:space-between; gap:10px; margin-bottom:10px; }
.dt-squad-head h3{ margin:0; }
.dt-squad{ list-style:none; margin:0; padding:0; display:grid; grid-template-columns:repeat(auto-fill,minmax(155px,1fr)); gap:8px; }
.dt-slot{ display:flex; align-items:center; gap:8px; padding:9px 11px; border:1px dashed var(--line); border-radius:10px; background:var(--soft); min-height:46px; }
.dt-slot.filled{ border-style:solid; border-color:rgba(185,144,37,.5); background:#fff; }
.dt-slot-no{ flex:0 0 auto; width:22px; height:22px; border-radius:50%; background:var(--navy); color:#fff; display:grid; place-items:center; font-weight:800; font-size:12px; }
.dt-slot.filled .dt-slot-no{ background:var(--gold,#b99025); }
.dt-slot-name{ font-weight:700; color:var(--navy); line-height:1.1; }
.dt-slot-cat{ margin-left:auto; font-size:11px; color:var(--muted); white-space:nowrap; }
.dt-slot-empty{ color:var(--muted); font-style:italic; }

.dt-spinbox{ text-align:center; padding:18px 0; }
.dt-rack{ display:inline-grid; grid-template-columns:repeat(3,1fr); gap:6px; margin-bottom:18px; }
.dt-rack span{ width:26px; height:26px; border-radius:50%; box-shadow:inset -2px -3px 6px rgba(0,0,0,.35); }
.dt-rack span:nth-child(odd){ background:radial-gradient(circle at 35% 30%, #e35d4f, #b32c1d); }
.dt-rack span:nth-child(even){ background:radial-gradient(circle at 35% 30%, #f4cf63, #cf9a16); }
.dt-spinner{ width:84px; height:84px; margin:0 auto 14px; border-radius:50%; display:grid; place-items:center;
  background:radial-gradient(circle at 35% 30%, #45506a, #0c1626); animation:dt-spin .7s linear infinite; }
.dt-8ball{ width:34px; height:34px; border-radius:50%; background:#fff; color:#0c1626; display:grid; place-items:center; font-weight:900; font-family:"Big Shoulders Display",sans-serif; }
@keyframes dt-spin{ to{ transform:rotate(360deg); } }
.dt-spin-label{ font-family:"Big Shoulders Display",sans-serif; font-weight:900; font-size:26px; color:var(--navy); text-transform:uppercase; min-height:32px; }

.dt-reveal-head{ text-align:center; margin-bottom:14px; }
.dt-reveal-head h3{ margin:.1em 0; font-size:26px; }
.dt-pcards{ display:grid; grid-template-columns:repeat(auto-fill,minmax(225px,1fr)); gap:10px; }
.dt-pcard{ display:flex; gap:12px; align-items:center; text-align:left; padding:12px; border:1px solid var(--line); border-radius:12px; background:#fff; cursor:pointer; transition:transform .12s ease, box-shadow .12s ease, border-color .12s ease; }
.dt-pcard:hover, .dt-pcard:focus-visible{ border-color:var(--gold,#b99025); box-shadow:0 6px 18px rgba(7,26,51,.12); transform:translateY(-2px); outline:none; }
.dt-pcard.static{ cursor:default; }
.dt-pcard-rating{ flex:0 0 auto; width:46px; height:46px; border-radius:10px; display:grid; place-items:center; font-family:"Big Shoulders Display",sans-serif; font-weight:900; font-size:22px; color:#fff; background:linear-gradient(135deg,var(--navy),#14633e); }
.dt-pcard-body{ flex:1; min-width:0; display:flex; flex-direction:column; gap:5px; }
.dt-pcard-name{ font-weight:800; color:var(--navy); line-height:1.1; }
.dt-pcard-meta{ display:flex; align-items:center; gap:8px; flex-wrap:wrap; }
.dt-wp{ font-size:12px; color:var(--muted); }
.dt-strength{ display:block; height:6px; border-radius:99px; background:var(--soft); overflow:hidden; }
.dt-strength>span{ display:block; height:100%; background:linear-gradient(90deg,var(--gold,#b99025),var(--gold-2,#d7b762)); }

.dt-readybox{ text-align:center; }
.dt-ready-msg{ font-size:17px; color:var(--navy); font-weight:600; }

.dt-verdict{ text-align:center; padding:20px 18px; border-radius:14px; background:var(--soft); border:1px solid var(--line); margin-bottom:16px; }
.dt-verdict.perfect{ background:linear-gradient(135deg,#14633e,#0c2950); border-color:var(--gold,#b99025); color:#fff; }
.dt-verdict.good{ background:#fbf6e7; border-color:rgba(185,144,37,.5); }
.dt-vbig{ display:block; font-family:"Big Shoulders Display",sans-serif; font-weight:900; font-size:54px; line-height:1; color:var(--navy); }
.dt-verdict.perfect .dt-vbig{ color:var(--gold-2,#d7b762); }
.dt-vmsg{ display:block; margin-top:8px; font-size:15px; color:var(--muted); }
.dt-verdict.perfect .dt-vmsg{ color:rgba(255,255,255,.9); }
.dt-highlights{ display:grid; grid-template-columns:repeat(auto-fit,minmax(150px,1fr)); gap:10px; }
.dt-hl{ padding:12px; border:1px solid var(--line); border-radius:12px; background:#fff; text-align:center; }
.dt-hl-k{ display:block; font-size:11px; text-transform:uppercase; letter-spacing:.08em; color:var(--muted); }
.dt-hl-v{ display:block; font-family:"Big Shoulders Display",sans-serif; font-weight:900; font-size:26px; color:var(--navy); margin:2px 0; }
.dt-hl-s{ display:block; font-size:12px; color:var(--muted); }
.dt-squad-strip{ display:flex; flex-wrap:wrap; gap:6px; margin-bottom:12px; }
.dt-chip{ font-size:12px; padding:4px 9px; border-radius:99px; background:var(--soft); border:1px solid var(--line); color:var(--navy); font-weight:600; }
.dt-chip em{ color:var(--gold,#b99025); font-style:normal; font-weight:800; }
.dt-table tr.dt-me td{ background:#faf2dd; font-weight:700; }
.dt-table tr.dt-me td strong{ color:var(--brand-gold-deep,#8a6410); }

/* "In form" draft offer — a rare boosted version of a player */
.dt-pcard.inform{ border-color:#e0992a; box-shadow:0 0 0 1px #e0992a, 0 6px 20px rgba(224,153,42,.30); background:linear-gradient(180deg,#fffdf6,#fff6e3); }
.dt-pcard.inform .dt-pcard-rating{ background:linear-gradient(135deg,#e7a23a,#b5740f); }
.dt-inform-tag{ display:inline-block; font-size:10px; font-weight:800; text-transform:uppercase; letter-spacing:.04em; color:#8a5a00; background:#ffe7b0; border:1px solid #e0992a; border-radius:99px; padding:1px 7px; margin-left:4px; vertical-align:middle; }
.dt-slot.filled.inform{ border-color:#e0992a; background:#fff6e3; }
.dt-chip.inform{ border-color:#e0992a; background:#fff6e3; }

/* Leaderboard */
.dt-board th, .dt-board td{ white-space:nowrap; }
.dt-board tr.dt-me-row td{ background:#faf2dd; font-weight:700; }
.dt-board tr.dt-me-row td strong{ color:var(--brand-gold-deep,#8a6410); }
.dt-qualify{ font-size:16px; font-weight:700; color:var(--navy); margin:0 0 10px; }
.dt-added{ font-size:16px; font-weight:800; color:#14633e; margin:0 0 12px; }
.dt-submit{ background:var(--soft); border:1px solid var(--line); border-radius:12px; padding:14px; margin-bottom:14px; }
.dt-login-card{ text-align:center; }
.dt-login-card .text-link{ font-size:14px; }
.dt-mod-list{ display:flex; flex-direction:column; gap:8px; }
.dt-mod-row{ display:flex; gap:8px; align-items:center; flex-wrap:wrap; padding:8px 9px; border:1px solid var(--line); border-radius:10px; background:#fff; }
.dt-mod-row input{ flex:1 1 140px; min-width:0; padding:7px 9px; border:1px solid var(--line); border-radius:8px; font:inherit; }
.dt-mod-rec{ font-weight:800; color:var(--navy); font-variant-numeric:tabular-nums; white-space:nowrap; }
.dt-mod-row .action{ padding:6px 12px; font-size:13px; }

@media (max-width:560px){
  .dt-badge-num{ font-size:38px; }
  .dt-vbig{ font-size:44px; }
  .dt-pcards{ grid-template-columns:1fr; }
}
@media (prefers-reduced-motion: reduce){ .dt-spinner{ animation:none; } }

/* ============================================================================
   HONOURS BOARD — an engraved walnut-and-brass roll of honour.
   Signature element: a brass nameplate, engraved into dark wood. Every colour
   is drawn from that object (walnut, brass, gold, silver, bronze) — no site
   navy here on purpose, the board is meant to read like the trophy cabinet
   plaque hung in the clubhouse. Scoped under .honours-board so nothing leaks.
   ========================================================================== */
.honours-intro{ display:flex; align-items:center; justify-content:space-between; gap:18px; flex-wrap:wrap; }
.honours-intro .kicker{ color:var(--gold); }
.honours-intro > div{ flex:1 1 320px; min-width:0; }
.honours-intro .jump-button{ flex:none; }
@media (max-width:560px){ .honours-intro .jump-button{ width:100%; justify-content:center; } }

.honours-board{
  --wood-dark:#31200f;
  --wood:#4a2f1a;
  --wood-hi:#5e3c22;
  --brass:#b8963f;
  --brass-lo:#7a5f22;
  --brass-hi:#ecd58a;
  --plate-ink:#2a1c07;
  --gold-txt:#e7c766;
  --name-txt:#f6ead0;
  position:relative;
  margin-top:16px;
  padding:clamp(16px,3.4vw,34px);
  border-radius:16px;
  background-color:var(--wood);
  /* Layered gradients fake walnut grain: fine vertical streaks over a warm
     top-to-bottom tone shift, plus a soft vignette so the centre lifts. */
  background-image:
    radial-gradient(140% 90% at 50% 0%, rgba(255,220,160,.10), rgba(0,0,0,0) 55%),
    radial-gradient(120% 120% at 50% 120%, rgba(0,0,0,.45), rgba(0,0,0,0) 60%),
    repeating-linear-gradient(91deg,
      rgba(0,0,0,.16) 0 2px, rgba(255,236,200,.03) 2px 5px,
      rgba(0,0,0,.05) 5px 10px, rgba(0,0,0,0) 10px 18px),
    linear-gradient(180deg,var(--wood-hi),var(--wood-dark));
  /* Concentric box-shadows build a rounded brass frame with a dark rebate. */
  box-shadow:
    inset 0 0 0 2px rgba(0,0,0,.35),
    inset 0 2px 22px rgba(0,0,0,.4),
    0 0 0 3px var(--wood-dark),
    0 0 0 12px var(--brass-lo),
    0 0 0 14px var(--brass-hi),
    0 0 0 17px var(--brass),
    0 0 0 19px var(--wood-dark),
    0 28px 54px -26px rgba(0,0,0,.75);
}

/* Decorative top: a star crest flanked by two brass rules. */
.honours-board-head{
  display:flex; align-items:center; gap:14px;
  margin:2px 4px 18px;
}
.honours-board-head .hb-rule{
  flex:1; height:3px; border-radius:3px;
  background:linear-gradient(90deg, rgba(236,213,138,0), var(--brass) 25%, var(--brass-hi) 50%, var(--brass) 75%, rgba(236,213,138,0));
  box-shadow:0 1px 0 rgba(0,0,0,.45);
}
.honours-board-head .hb-crest{
  font-size:26px; line-height:1; color:var(--brass-hi);
  text-shadow:0 1px 1px rgba(0,0,0,.6), 0 0 14px rgba(236,213,138,.4);
}
.honours-board-foot{
  height:3px; margin:20px 4px 2px; border-radius:3px;
  background:linear-gradient(90deg, rgba(236,213,138,0), var(--brass) 30%, var(--brass-hi) 50%, var(--brass) 70%, rgba(236,213,138,0));
  box-shadow:0 1px 0 rgba(0,0,0,.45);
}

/* A season block. */
.h-season{ margin:0 0 24px; }
.h-season:last-of-type{ margin-bottom:0; }

/* Brass season nameplate with a routed edge and a screw at each end. */
.h-season-plate{
  position:relative;
  display:flex; align-items:center; justify-content:center;
  margin:0 auto 16px;
  padding:9px 46px;
  max-width:340px;
  border-radius:7px;
  background:linear-gradient(180deg,var(--brass-hi),var(--brass) 52%,var(--brass-lo));
  box-shadow:
    inset 0 1px 0 rgba(255,248,214,.75),
    inset 0 -2px 6px rgba(0,0,0,.45),
    0 4px 10px rgba(0,0,0,.5);
}
.h-season-plate::before, .h-season-plate::after{
  content:""; position:absolute; top:50%; width:9px; height:9px; margin-top:-4.5px;
  border-radius:50%;
  background:radial-gradient(circle at 35% 30%, #fff6d8, #9a7a2c 60%, #5c4517);
  box-shadow:inset 0 0 0 1px rgba(0,0,0,.3);
}
.h-season-plate::before{ left:14px; }
.h-season-plate::after{ right:14px; }
.h-season-year{
  font-family:"Big Shoulders Display", "Inter Tight", sans-serif;
  font-weight:800; font-size:clamp(20px,3.4vw,26px); letter-spacing:.06em;
  text-transform:uppercase; color:var(--plate-ink);
  /* Incised lettering: dark above, light catch below. */
  text-shadow:0 -1px 0 rgba(0,0,0,.35), 0 1px 0 rgba(255,248,214,.55);
}
.h-season-year::after{ content:" season"; font-size:.62em; opacity:.8; letter-spacing:.1em; }

/* Two recessed panels (individual / team). */
.h-panels{ display:grid; grid-template-columns:1fr 1fr; gap:16px; }
.h-panel{
  padding:16px 16px 6px;
  border-radius:10px;
  background:linear-gradient(180deg, rgba(0,0,0,.26), rgba(0,0,0,.14));
  box-shadow:inset 0 1px 0 rgba(255,236,200,.06), inset 0 0 0 1px rgba(0,0,0,.4), inset 0 8px 18px rgba(0,0,0,.34);
}
.h-panel-title{
  margin:0 0 12px; padding-bottom:8px;
  font-family:"Inter Tight", sans-serif; font-weight:800; font-size:13px;
  letter-spacing:.18em; text-transform:uppercase; text-align:center;
  color:var(--gold-txt);
  border-bottom:1px solid rgba(184,150,63,.32);
  text-shadow:0 1px 1px rgba(0,0,0,.6);
}
.h-panel-empty{ color:rgba(246,234,208,.55); font-size:14px; text-align:center; margin:4px 0 12px; }

/* One honour line. */
.h-honour{ padding:9px 2px; border-bottom:1px dashed rgba(184,150,63,.2); }
.h-honour:last-child{ border-bottom:0; }
.h-comp{
  display:block; font-family:"Inter Tight", sans-serif; font-weight:700;
  font-size:11px; letter-spacing:.14em; text-transform:uppercase;
  color:var(--gold-txt); opacity:.85; margin-bottom:2px;
}
.h-winrow{ display:flex; align-items:baseline; gap:8px; }
.h-star{ color:var(--brass-hi); font-size:14px; flex:none; text-shadow:0 0 8px rgba(236,213,138,.45); }
.h-win{
  font-family:"Big Shoulders Display", "Inter Tight", sans-serif;
  font-weight:700; font-size:clamp(18px,2.6vw,22px); line-height:1.1;
  color:var(--name-txt);
  text-shadow:0 -1px 0 rgba(0,0,0,.55), 0 1px 0 rgba(255,240,205,.12);
}
.h-note{ display:block; font-family:"Inter Tight",sans-serif; font-weight:500; font-size:12px; font-style:italic; color:rgba(246,234,208,.6); margin-top:1px; }

/* League podium — gold / silver / bronze medallions. */
.h-podium{ list-style:none; margin:4px 0 0; padding:0; display:grid; gap:8px; }
.h-place{ display:flex; align-items:center; gap:10px; }
.h-disc{
  flex:none; width:26px; height:26px; border-radius:50%;
  display:grid; place-items:center;
  font-family:"Big Shoulders Display",sans-serif; font-weight:800; font-size:15px;
  color:#3a2c07; text-shadow:0 1px 0 rgba(255,255,255,.4);
  box-shadow:inset 0 1px 1px rgba(255,255,255,.7), inset 0 -2px 3px rgba(0,0,0,.35), 0 2px 4px rgba(0,0,0,.45);
}
.h-place.p1 .h-disc{ background:radial-gradient(circle at 35% 30%, #fff2c2, #e7c766 55%, #a9812c); }
.h-place.p2 .h-disc{ background:radial-gradient(circle at 35% 30%, #ffffff, #d4dae0 55%, #9aa3ad); }
.h-place.p3 .h-disc{ background:radial-gradient(circle at 35% 30%, #ffcfa0, #cd8b52 55%, #915127); color:#3a1f07; }
.h-pos{ flex:none; width:34px; font-family:"Inter Tight",sans-serif; font-weight:800; font-size:12px; letter-spacing:.05em; text-transform:uppercase; color:var(--gold-txt); }
.h-place .h-win{ font-size:clamp(16px,2.3vw,19px); }
.h-place.p1 .h-win{ font-size:clamp(18px,2.6vw,22px); }

@media (max-width:640px){
  .h-panels{ grid-template-columns:1fr; }
}

/* ---- Honours admin add form ---------------------------------------------- */
.honours-form{ display:grid; grid-template-columns:1fr 1fr; gap:10px 12px; }
.honours-form .field{ display:flex; flex-direction:column; gap:4px; margin:0; }
.honours-form .field > span{ font-size:12px; font-weight:700; color:var(--muted); }
.honours-form .field > span small{ font-weight:500; opacity:.8; }
.honours-form .field input, .honours-form .field select{
  padding:9px 10px; border:1px solid var(--line); border-radius:9px; background:var(--paper);
}
.honours-form-wide{ grid-column:1 / -1; }
@media (max-width:560px){ .honours-form{ grid-template-columns:1fr; } }
