/* ==========================================================
   MLCL - Mays Landing Cornhole League
   ESPN-broadcast meets gastropub league
   ========================================================== */

/* Bricolage Grotesque is now self-hosted in assets/css/fonts.css (mlcl-fonts,
   enqueued before mlcl-core). The render-blocking Google Fonts @import that
   used to live here was dropped: it blocked the first paint and logged visitor
   IPs to Google. */

/* Fairwater Script: the one brand accent font actually used (.script).
   Previously pulled via the retired tokens.css, which also loaded unused
   Termina + Barlow Condensed + Saira. Those are dropped. */
@font-face {
  font-family: 'Fairwater Script';
  /* WOFF2 first (186KB vs the 1.19MB OTF, same outlines); the OTF stays as
     the fallback for the rare engine without WOFF2 support. */
  src: url('fonts/FairwaterScript-Regular.woff2') format('woff2'),
       url('fonts/FairwaterScript-Regular.otf') format('opentype');
  font-weight: 300 700;
  font-display: swap;
}

/* ---- Theme tokens ---- */
:root {
  /* Default: dark broadcast theme */
  --mlcl-bg: #0c2530;
  --mlcl-bg-2: #103240;
  --mlcl-bg-3: #1a4252;
  --mlcl-surface: #143845;
  --mlcl-ink: #f4f1ea;
  --mlcl-ink-dim: #a8c0c8;
  --mlcl-ink-mute: #7e98a4; /* AA: 5.23:1 on --mlcl-bg (was #6a8590 = 4.06, failed) */
  --mlcl-orange: #FF8B48;
  --mlcl-orange-deep: #E87A3A;
  --mlcl-teal: #53C2CB;
  --mlcl-teal-deep: #134654;
  --mlcl-line: rgba(83, 194, 203, 0.22);
  --mlcl-line-strong: rgba(83, 194, 203, 0.55);
  --mlcl-good: #6ee787;
  --mlcl-bad: #ff6b6b;
  /* Accent ink: orange on dark, deep-rust on light surfaces (4.5:1+ on white/cream) */
  --mlcl-accent-ink: var(--mlcl-orange);
  /* Status ink: bright on dark, dark variant on light surfaces (4.5:1+ on white/cream) */
  --mlcl-teal-ink: var(--mlcl-teal);
  --mlcl-good-ink: var(--mlcl-good);
  --mlcl-bad-ink: var(--mlcl-bad);

  /* Theme-invariant hub literals. The record-book hub paints fixed navy
     bands/chips that must NOT flip with [data-theme] (the hub body runs
     light), so they alias the raw values instead of the theme tokens:
     navy band fill, the hairline on navy, muted ink on navy, and the
     soft muted ink the hub uses on light surfaces. Indirection only;
     rendered values are unchanged. */
  --mlcl-navy: #0c2530;
  --mlcl-navy-2: #1c3a48;
  --mlcl-navy-ink-dim: #bcccd4;
  --mlcl-ink-soft: #54656c;
  /* Editorial dark-band literals: cream copy and dim slate copy on the navy
     hero/CTA bands. The editorial views run the light theme, so the theme
     tokens resolve to cream there; these stay fixed. The band h1 rules were
     already referencing both names via var() fallbacks. Indirection only;
     rendered values are unchanged. */
  --mlcl-cream-on-dark: #f4f1ea;
  --mlcl-dim-on-dark: #a8c0c8;

  /* density */
  --mlcl-pad-section: 6rem;
  --mlcl-pad-block: 2rem;
  --mlcl-gap: 1.5rem;
}

[data-theme="light"] {
  --mlcl-bg: #f4f1ea;
  --mlcl-bg-2: #eae5d8;
  --mlcl-bg-3: #ffffff;
  --mlcl-surface: #ffffff;
  --mlcl-ink: #0c2530;
  --mlcl-ink-dim: #3d5560;
  --mlcl-ink-mute: #5e6770; /* AA: 5.10:1 on cream, 4.57:1 on sand bg-2 (deepened from #646e78 = 4.13 on sand, failed) */
  --mlcl-line: rgba(19, 70, 84, 0.18);
  --mlcl-line-strong: rgba(19, 70, 84, 0.4);
  /* Deep rust: 6.6:1 on white, 5.9:1 on cream, 5.3:1 on bg-2, 5.0:1 on peach -- clears 4.5:1 on all light surfaces incl accent fills (deepened from #B5400C) */
  --mlcl-accent-ink: #A4380A;
  /* Dark status ink: pass WCAG AA (4.5:1) on white, cream (#f4f1ea), and bg-2 (#eae5d8). */
  /* teal #156060: 6.5:1 on cream, 5.8:1 on bg-2, 5.1:1 on grey card -- deepened from #187070 (4.05 on grey card, failed) */
  --mlcl-teal-ink: #156060;
  /* green #1e6c38: 6.45:1 on white, 5.72:1 on cream, 5.13:1 on bg-2 */
  --mlcl-good-ink: #1e6c38;
  /* red #b53428: 6.02:1 on white, 5.34:1 on cream, 4.79:1 on bg-2 */
  --mlcl-bad-ink: #b53428;
}

[data-theme="orange"] {
  --mlcl-bg: #1a0f08;
  --mlcl-bg-2: #2a1810;
  --mlcl-bg-3: #3a2218;
  --mlcl-surface: #2a1810;
  --mlcl-ink: #fff6ed;
  --mlcl-ink-dim: #f5c9a8;
  --mlcl-ink-mute: #a07050;
  --mlcl-line: rgba(255, 139, 72, 0.25);
  --mlcl-line-strong: rgba(255, 139, 72, 0.5);
}

[data-density="compact"] {
  --mlcl-pad-section: 3.5rem;
  --mlcl-pad-block: 1.25rem;
  --mlcl-gap: 1rem;
}

/* Ink anchor: re-declare the dark tokens locally so a section stays
   broadcast-dark while the page rests on the cream (light) theme. */
.ink-anchor {
  --mlcl-bg: #0c2530;
  --mlcl-bg-2: #103240;
  --mlcl-bg-3: #1a4252;
  --mlcl-surface: #143845;
  --mlcl-ink: #f4f1ea;
  --mlcl-ink-dim: #a8c0c8;
  --mlcl-ink-mute: #7e98a4;
  --mlcl-line: rgba(83, 194, 203, 0.22);
  --mlcl-line-strong: rgba(83, 194, 203, 0.55);
  /* Accent/status tokens (--mlcl-orange, --mlcl-orange-deep, --mlcl-teal, --mlcl-teal-deep, --mlcl-good, --mlcl-bad) are intentionally not re-declared: they are theme-invariant (same value in every theme), so they resolve correctly here without restating. */
  /* Re-declare accent/status ink tokens to bright values inside dark bands (overrides the light-theme dark variants). */
  --mlcl-accent-ink: var(--mlcl-orange);
  --mlcl-teal-ink: var(--mlcl-teal);
  --mlcl-good-ink: var(--mlcl-good);
  --mlcl-bad-ink: var(--mlcl-bad);
  /* Explicit background/color paint because .ink-anchor is a section-wrapper utility (unlike the token-only [data-theme] scopes), so the wrapper paints itself without needing a wrapping .section. */
  background: var(--mlcl-bg);
  color: var(--mlcl-ink);
}

/* ---- Reset ---- */
*, *::before, *::after { box-sizing: border-box; }
html, body { margin: 0; padding: 0; overflow-x: hidden; }
body {
  font-family: 'Bricolage Grotesque', system-ui, sans-serif;
  background: var(--mlcl-bg);
  color: var(--mlcl-ink);
  -webkit-font-smoothing: antialiased;
  font-size: 17px;
  line-height: 1.45;
  overflow-x: hidden;
  position: relative;
}
/* GeneratePress prints a default body font-family as late inline dynamic CSS,
   which reverts body copy to the system stack (so recaps and all prose were
   rendering in Helvetica, not Bricolage). html body (0-0-2) wins over GP's
   body (0-0-1) regardless of source order, no !important needed. Archive and
   CPT titles with no explicit font rule inherit this, so it also restores the
   brand face on the players and teams directory headings. */
html body {
  font-family: 'Bricolage Grotesque', system-ui, sans-serif;
}

/* ---- Halftone print texture overlay ---- */
body::before {
  content: '';
  position: fixed;
  inset: 0;
  pointer-events: none;
  z-index: 1;
  background-image: radial-gradient(circle, rgba(255, 255, 255, 0.06) 1px, transparent 1.2px);
  background-size: 4px 4px;
  opacity: 0.7;
}
[data-theme="light"] body::before {
  background-image: radial-gradient(circle, rgba(12, 37, 48, 0.08) 1px, transparent 1.2px);
}
[data-theme="orange"] body::before {
  background-image: radial-gradient(circle, rgba(255, 246, 237, 0.05) 1px, transparent 1.2px);
}
a { color: inherit; text-decoration: none; }
button { font-family: inherit; cursor: pointer; border: none; background: none; color: inherit; }
img { display: block; max-width: 100%; }

/* ---- Type helpers ---- */
.display, h1.display, h2.display {
  font-family: 'Bricolage Grotesque', system-ui, sans-serif;
  font-weight: 800;
  letter-spacing: 0.01em;
  text-transform: uppercase;
  line-height: 0.9;
  margin: 0;
}
/* Oswald display utility -- scoped to the Record Book hub display headings.
   Do NOT apply to the site-wide .display rule (that stays Bricolage). */
.disp {
  font-family: "Oswald", system-ui, sans-serif;
  text-transform: uppercase;
  letter-spacing: .01em;
}

.eyebrow {
  font-family: 'Bricolage Grotesque', system-ui, sans-serif;
  font-weight: 700;
  font-size: 0.75rem;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: var(--mlcl-teal-ink);
}
.mono-num {
  font-family: 'Bricolage Grotesque', system-ui, sans-serif;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
  letter-spacing: -0.01em;
}
.script {
  font-family: 'Fairwater Script', 'Sacramento', cursive;
  font-weight: 400;
}

/* When typo mode is mixed-script, allow specific places to use script */
[data-type="mixed"] .opt-script {
  font-family: 'Fairwater Script', 'Sacramento', cursive;
  text-transform: none;
  letter-spacing: 0;
  font-weight: 400;
}
/* Fairwater Script reserves a huge metric line box (about 124px tall at 54px,
   2.28x the font size) even though the real ink barely descends below the
   baseline. As an inline accent that phantom box pushed the line down and the
   board-stripe ::after appeared to run through the text. Making the script
   accent an inline-block with a constrained line-height collapses the box to
   its actual ink, so the stripe only needs a few px of clearance. */
[data-type="mixed"] .section-head h2 .accent.opt-script {
  display: inline-block;
  font-size: 0.86em;
  line-height: 0.95;
  vertical-align: -0.06em;
}
[data-type="mixed"] .section-head {
  padding-bottom: 0.25rem;
  margin-bottom: 1rem;
}

/* ---- Container ---- */
.wrap {
  width: 100%;
  max-width: 1280px;
  margin: 0 auto;
  padding: 0 1.5rem;
}

/* --------------------------------------------------------------
   THE BOARD - cornhole board stripe motif (teal | orange | teal)
   Used as section dividers, watermarks, decorative anchors.
   -------------------------------------------------------------- */
.board-stripe-band {
  position: relative;
  height: 96px;
  background: var(--mlcl-bg);
  overflow: hidden;
  z-index: 3;
}
.board-stripe-band .bs-stripes {
  position: absolute;
  inset: -14px -5%;
  background:
    linear-gradient(
      90deg,
      var(--mlcl-teal-deep) 0 28%,
      var(--mlcl-orange) 28% 72%,
      var(--mlcl-teal-deep) 72% 100%
    );
  transform: rotate(-1.4deg);
  border-top: 2px solid #0c2530;
  border-bottom: 2px solid #0c2530;
  box-shadow: 0 6px 18px rgba(0,0,0,0.4);
}
.board-stripe-band .bs-hole {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 32px; height: 32px;
  margin: -16px 0 0 -16px;
  border-radius: 50%;
  background: #0c2530;
  box-shadow:
    inset 0 4px 6px rgba(0,0,0,0.55),
    0 0 0 3px var(--mlcl-orange-deep);
  z-index: 1;
}
.board-stripe-band.flip .bs-stripes { transform: rotate(1.4deg); }
.board-stripe-band.tall { height: 120px; }

/* Slim version - just a 12px band (used inside cards/footers) */
.board-stripe-thin {
  height: 14px;
  background:
    linear-gradient(90deg,
      var(--mlcl-teal-deep) 0 28%,
      var(--mlcl-orange) 28% 72%,
      var(--mlcl-teal-deep) 72% 100%);
  border-top: 1px solid #0c2530;
  border-bottom: 1px solid #0c2530;
}

/* --------------------------------------------------------------
   REAL PHOTO SLOTS
   Full-width league-night strip + contained venue photo.
   Real images drop in by replacing the placeholder figure with
   one containing an <img>. The CSS handles sizing for both states.
   -------------------------------------------------------------- */
.ml-photo {
  margin: 0;
}

/* Full-width strip between hero and next section */
.ml-photo--strip {
  border-top: 6px solid var(--mlcl-orange);
  border-bottom: 6px solid var(--mlcl-teal);
}
.ml-photo--strip img {
  display: block;
  width: 100%;
  height: clamp(200px, 32vw, 380px);
  object-fit: cover;
}

/* Contained venue photo inside the location section */
.ml-photo--venue {
  margin-top: 2rem;
  border: 1px solid var(--mlcl-line-strong);
}
.ml-photo--venue img {
  display: block;
  width: 100%;
  height: clamp(160px, 24vw, 280px);
  object-fit: cover;
}

/* Placeholder fill: diagonal hatch on cream, labeled in small-caps.
   Shows when no <img> is present. A real photo makes the img render
   over this background automatically (object-fit: cover fills the figure). */
.ml-photo--placeholder {
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: var(--mlcl-bg-2);
  background-image:
    repeating-linear-gradient(
      -45deg,
      transparent,
      transparent 14px,
      var(--mlcl-line-strong) 14px,
      var(--mlcl-line-strong) 15px
    );
  position: relative;
}
.ml-photo--strip.ml-photo--placeholder {
  height: clamp(200px, 32vw, 380px);
}
.ml-photo--venue.ml-photo--placeholder {
  height: clamp(160px, 24vw, 280px);
}
.ml-photo-label {
  position: relative;
  z-index: 1;
  background: var(--mlcl-bg);
  color: var(--mlcl-ink-mute);
  font-family: 'Bricolage Grotesque', system-ui, sans-serif;
  font-weight: 700;
  font-size: 0.7rem;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  padding: 0.5rem 1rem;
  border: 1px solid var(--mlcl-line-strong);
}

/* --------------------------------------------------------------
   MEGA SECTION NUMBER - big italic numeral background
   -------------------------------------------------------------- */
.section { position: relative; }
.section-num {
  position: absolute;
  top: 1.5rem;
  right: 1.5rem;
  font-family: 'Bricolage Grotesque', system-ui, sans-serif;
  font-weight: 800;
  font-size: clamp(7rem, 16vw, 14rem);
  line-height: 0.85;
  letter-spacing: -0.02em;
  color: transparent;
  -webkit-text-stroke: 1.5px var(--mlcl-line-strong);
  pointer-events: none;
  opacity: 0.6;
  z-index: 0;
  font-variant-numeric: tabular-nums;
}
.section-num .slash {
  font-style: normal;
  -webkit-text-stroke: 1.5px var(--mlcl-orange);
  margin: 0 0.15em;
}
.section-num .total {
  font-size: 0.45em;
  -webkit-text-stroke: 1px var(--mlcl-line);
  vertical-align: top;
  letter-spacing: 0;
}
.section .wrap { position: relative; z-index: 1; }
@media (max-width: 768px) {
  .section-num { font-size: 6rem; opacity: 0.4; }
}

/* Section index marker - small "section NO. 03" type stamp */
.section-stamp {
  display: inline-flex;
  align-items: center;
  gap: 0.6rem;
  font-family: 'Bricolage Grotesque', system-ui, sans-serif;
  font-weight: 700;
  font-size: 0.7rem;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: var(--mlcl-accent-ink);
  margin-bottom: 0.8rem;
}
.section-stamp::before, .section-stamp::after {
  content: '';
  width: 24px;
  height: 1px;
  background: currentColor;
}

/* --------------------------------------------------------------
   BRACKET / CHEVRON accents - used to frame a callout
   -------------------------------------------------------------- */
.brackets {
  display: inline-flex;
  align-items: center;
  gap: 0.8rem;
}
.brackets::before, .brackets::after {
  content: '';
  width: 0;
  height: 28px;
  border: 2px solid var(--mlcl-orange);
}
.brackets::before { border-right: none; width: 14px; }
.brackets::after  { border-left: none;  width: 14px; }

/* Big italic display numeral */
.mega-num {
  font-family: 'Bricolage Grotesque', system-ui, sans-serif;
  font-weight: 800;
  letter-spacing: -0.02em;
  line-height: 0.85;
  font-variant-numeric: tabular-nums;
}

/* --------------------------------------------------------------
   COURT DIAGRAM - top-down cornhole board SVG container
   -------------------------------------------------------------- */
.court-diag-wrap {
  position: relative;
  display: inline-block;
}

/* ---- Buttons ---- */
.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.6rem;
  min-height: 44px;
  padding: 0.95rem 1.5rem;
  font-family: 'Bricolage Grotesque', system-ui, sans-serif;
  font-weight: 700;
  font-size: 0.85rem;
  letter-spacing: 0.15em;
  text-transform: uppercase;
  border: 2px solid transparent;
  transition: transform 0.12s ease, background 0.2s, color 0.2s, border-color 0.2s;
  white-space: nowrap;
  cursor: pointer;
  text-decoration: none;
}
.btn:hover { text-decoration: none; transform: translateY(-1px); }
.btn:active { transform: translateY(0); }
.btn-primary { background: var(--mlcl-orange); color: #0c2530; }
.btn-primary:hover { background: #ffa066; }
.btn-ghost {
  background: transparent;
  color: var(--mlcl-ink);
  border-color: var(--mlcl-line-strong);
}
.btn-ghost:hover { border-color: var(--mlcl-teal-ink); color: var(--mlcl-teal-ink); }
.btn-teal { background: var(--mlcl-teal); color: #0c2530; }
.btn-teal:hover { background: #7fd6dd; }
.btn-lg { padding: 1.15rem 2rem; font-size: 0.95rem; }
.btn-sm { padding: 0.6rem 1rem; font-size: 0.7rem; }

/* ---- Pills / badges ---- */
.pill {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  padding: 0.3rem 0.7rem;
  font-family: 'Bricolage Grotesque', system-ui, sans-serif;
  font-weight: 700;
  font-size: 0.7rem;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  border: 1px solid var(--mlcl-line-strong);
  color: var(--mlcl-teal-ink);
}
.pill-live {
  background: var(--mlcl-orange);
  color: #0c2530;
  border-color: var(--mlcl-orange);
}
.pill-live::before {
  content: '';
  width: 7px; height: 7px;
  background: #0c2530;
  border-radius: 50%;
  animation: pulse 1.4s ease-in-out infinite;
}
@keyframes pulse {
  0%, 100% { opacity: 1; }
  50% { opacity: 0.3; }
}

/* ---- Section header ---- */
.section {
  padding: var(--mlcl-pad-section) 0;
  position: relative;
}
.section-head {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 1.5rem;
  margin-bottom: 2.5rem;
  padding-bottom: 1.25rem;
  position: relative;
}
.section-head::after {
  /* Three-segment underline echoing the cornhole board (teal | orange | teal) */
  content: '';
  position: absolute;
  left: 0; right: 0; bottom: 0;
  height: 3px;
  background: linear-gradient(
    90deg,
    var(--mlcl-teal) 0 28%,
    var(--mlcl-orange) 28% 72%,
    var(--mlcl-teal) 72% 100%
  );
}
.section-head h2 {
  font-family: 'Bricolage Grotesque', system-ui, sans-serif;
  font-weight: 800;
  text-transform: uppercase;
  font-size: clamp(2rem, 4vw, 3.4rem);
  letter-spacing: 0.01em;
  line-height: 0.9;
  margin: 0;
  position: relative;
}
.section-head h2 .accent { color: var(--mlcl-accent-ink); }
.section-head h2 .section-title-tail {
  color: var(--mlcl-accent-ink);
  font: inherit;
}
.section-head h2 .slash {
  color: var(--mlcl-accent-ink);
  margin: 0 0.1em;
  font-family: 'Bricolage Grotesque', system-ui, sans-serif;
  font-weight: 800;
}

/* ---- Cards ---- */
.card {
  background: var(--mlcl-surface);
  border: 1px solid var(--mlcl-line);
  position: relative;
}
.card-pad { padding: 1.5rem; }

/* --------------------------------------------------------------
   NEXT-SEASON ANNOUNCEMENT RIBBON
   Persistent strip above the ticker - promotes upcoming signups
   -------------------------------------------------------------- */
.announce-ribbon {
  background: var(--mlcl-orange);
  color: #0c2530;
  position: relative;
  z-index: 60;
  border-bottom: 2px solid #0c2530;
}
.announce-ribbon-inner {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 1rem;
  padding: 0.7rem 1.5rem;
  font-family: 'Bricolage Grotesque', sans-serif;
  font-weight: 700;
  font-size: 0.85rem;
  letter-spacing: 0.03em;
  flex-wrap: wrap;
  text-align: center;
}
.announce-ribbon-tag {
  background: #0c2530;
  color: var(--mlcl-orange);
  padding: 0.25rem 0.6rem;
  font-weight: 700;
  font-size: 0.7rem;
  letter-spacing: 0.18em;
  text-transform: uppercase;
}
.announce-ribbon-dot {
  width: 6px;
  height: 6px;
  background: #0c2530;
  border-radius: 50%;
  opacity: 0.5;
}
.announce-ribbon-cta {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  gap: 0.3rem;
  font-weight: 700;
  text-decoration: none;
  cursor: pointer;
  background: none;
  border: none;
  color: #0c2530;
  font-family: inherit;
  font-size: inherit;
  padding: 0;
}
.announce-ribbon-cta:hover { color: #1a4252; }
.inline-jump-link {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  color: var(--mlcl-accent-ink);
  font-weight: 700;
  text-decoration: none;
}
.announce-ribbon-deadline { white-space: nowrap; }
@media (max-width: 600px) {
  /* Stack the ribbon: tag pill on top, the season line, then a clear CTA chip.
     The default centered flex row crams the tag, text, dot, and link together. */
  .announce-ribbon-inner {
    flex-direction: column;
    gap: 0.55rem;
    padding: 0.85rem 1.1rem;
    font-size: 0.82rem;
    line-height: 1.35;
  }
  .announce-ribbon-dot { display: none; }
  .announce-ribbon-text { display: block; }
  /* Turn the underlined link into a clear navy chip with orange text. The color
     is scoped to match the entry-content override that otherwise forces navy
     ink (which would be invisible on the navy chip). */
  .announce-ribbon-cta,
  body.mlcl-site:not(.mlcl-app-active) .entry-content a.announce-ribbon-cta {
    text-decoration: none;
    background: #0c2530;
    color: #ff8b48;
    padding: 0.5rem 1.1rem;
    /* 44px floor: the chip was capped at 40px, under the touch-target minimum. */
    min-height: 44px;
    font-size: 0.78rem;
    letter-spacing: 0.04em;
  }
  .announce-ribbon-cta:hover,
  body.mlcl-site:not(.mlcl-app-active) .entry-content a.announce-ribbon-cta:hover { color: #ffd9bf; }
}

/* --------------------------------------------------------------
   SUMMER-SEASON HERO SECTION
   -------------------------------------------------------------- */
.next-season-block {
  position: relative;
  background:
    linear-gradient(180deg, rgba(255, 139, 72, 0.11) 0, rgba(255, 139, 72, 0) 24%),
    linear-gradient(180deg, rgba(19, 70, 84, 0.1) 0, rgba(19, 70, 84, 0) 72%),
    var(--mlcl-bg);
  overflow: hidden;
  padding: 5rem 0;
}
.next-season-block::before,
.next-season-block::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  pointer-events: none;
  z-index: 1;
}
.next-season-block::before {
  top: 0;
  height: 6px;
  background: linear-gradient(90deg, var(--mlcl-orange) 0 33%, var(--mlcl-teal) 33% 66%, var(--mlcl-orange) 66% 100%);
}
.next-season-block::after {
  bottom: 0;
  height: 5.5rem;
  background: linear-gradient(180deg, rgba(244, 241, 234, 0), var(--mlcl-bg));
}
.next-season-bg {
  position: absolute;
  inset: -30% -8%;
  background:
    linear-gradient(
      85deg,
      transparent 0 38%,
      var(--mlcl-teal-deep) 38% 47%,
      var(--mlcl-orange) 47% 61%,
      var(--mlcl-teal-deep) 61% 70%,
      transparent 70% 100%
    );
  transform: rotate(-12deg);
  opacity: 0.1;
  pointer-events: none;
  z-index: 0;
}
.next-season-grid {
  display: grid;
  grid-template-columns: 1.1fr 1fr;
  gap: 3rem;
  align-items: center;
  position: relative;
  z-index: 1;
}
.next-season-eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 0.7rem;
  margin-bottom: 1.25rem;
  font-family: 'Bricolage Grotesque', sans-serif;
  font-weight: 700;
  font-size: 0.78rem;
  letter-spacing: 0.16em;
  text-transform: uppercase;
}
.next-season-eyebrow .dot {
  width: 8px; height: 8px;
  border-radius: 50%;
  background: var(--mlcl-orange);
  animation: pulse 1.6s ease-in-out infinite;
}
.next-season-eyebrow .open {
  background: var(--mlcl-orange);
  color: #0c2530;
  padding: 0.15rem 0.6rem;
  font-weight: 800;
  letter-spacing: 0.18em;
}
.next-season-title {
  font-family: 'Bricolage Grotesque', sans-serif;
  font-weight: 800;
  font-size: clamp(2.4rem, 5.5vw, 4.2rem);
  line-height: 0.95;
  letter-spacing: -0.02em;
  margin: 0 0 1.5rem;
}
.next-season-title .accent { color: var(--mlcl-accent-ink); }
.next-season-title .strike {
  position: relative;
  display: inline-block;
  color: var(--mlcl-ink-mute);
}
.next-season-title .strike::after {
  content: '';
  position: absolute;
  left: -2%; right: -2%;
  top: 56%;
  height: 4px;
  background: var(--mlcl-teal);
  transform: skewY(-3deg);
}
.next-season-blurb {
  color: var(--mlcl-ink-dim);
  font-size: 1.1rem;
  max-width: 480px;
  margin: 0 0 1.5rem;
  line-height: 1.55;
}
.next-season-actions {
  display: flex;
  gap: 1rem;
  flex-wrap: wrap;
}
.next-season-meta {
  display: grid;
  grid-template-columns: 1fr 1fr;
  border: 1px solid var(--mlcl-line-strong);
  background: var(--mlcl-surface);
  margin-top: 2rem;
}
.next-season-meta > div {
  padding: 1rem 1.25rem;
  border-right: 1px solid var(--mlcl-line);
  border-bottom: 1px solid var(--mlcl-line);
}
.next-season-meta > div:nth-child(2n) { border-right: none; }
.next-season-meta > div:nth-last-child(-n+2) { border-bottom: none; }
.next-season-meta .lbl {
  font-family: 'Bricolage Grotesque', sans-serif;
  font-weight: 700;
  font-size: 0.65rem;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--mlcl-ink-mute);
  margin-bottom: 0.3rem;
}
.next-season-meta .val {
  font-family: 'Bricolage Grotesque', sans-serif;
  font-weight: 700;
  font-size: 1.15rem;
  letter-spacing: -0.01em;
}
.next-season-meta .val .strong { color: var(--mlcl-accent-ink); }

/* The Summer schedule preview card */
.summer-card {
  background: var(--mlcl-surface);
  border: 2px solid var(--mlcl-line-strong);
  position: relative;
}
.summer-card-stripe {
  height: 12px;
  background: linear-gradient(
    90deg,
    var(--mlcl-teal-deep) 0 28%,
    var(--mlcl-orange) 28% 72%,
    var(--mlcl-teal-deep) 72% 100%);
  border-bottom: 2px solid #0c2530;
}
.summer-card-head {
  padding: 1.5rem 1.5rem 0;
}
.summer-card-head-row {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 1rem;
}
.summer-card h3 {
  font-family: 'Bricolage Grotesque', sans-serif;
  font-weight: 800;
  font-size: 1.4rem;
  letter-spacing: -0.01em;
  margin: 0;
}
.summer-card-weeks {
  padding: 1.5rem;
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 0.4rem;
}
.summer-week {
  border: 1px solid var(--mlcl-line);
  padding: 0.7rem 0.4rem;
  text-align: center;
}
.summer-week .wk {
  font-family: 'Bricolage Grotesque', sans-serif;
  font-weight: 700;
  font-size: 0.6rem;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--mlcl-ink-mute);
}
.summer-week .day {
  font-family: 'Bricolage Grotesque', sans-serif;
  font-weight: 800;
  font-size: 1.15rem;
  letter-spacing: -0.02em;
  line-height: 1;
  margin-top: 0.3rem;
}
.summer-week .mo {
  font-family: 'Bricolage Grotesque', sans-serif;
  font-weight: 700;
  font-size: 0.58rem;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--mlcl-ink-mute);
  margin-top: 0.2rem;
}
.summer-week.first {
  background: var(--mlcl-orange);
  color: #0c2530;
  border-color: var(--mlcl-orange);
}
.summer-week.first .wk, .summer-week.first .mo { color: #0c2530; opacity: 0.7; }
.summer-week.last {
  border-color: var(--mlcl-teal);
}
.summer-card-foot {
  padding: 1rem 1.5rem;
  border-top: 1px solid var(--mlcl-line);
  background: var(--mlcl-bg-2);
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0.55rem;
  align-items: stretch;
  font-family: 'Bricolage Grotesque', sans-serif;
  font-weight: 700;
  font-size: 0.78rem;
  letter-spacing: 0.04em;
}
.summer-card-foot span {
  min-width: 0;
  padding: 0.58rem 0.65rem;
  border: 1px solid var(--mlcl-line);
  background: rgba(255, 253, 248, 0.72);
  line-height: 1.25;
}
/* Playoffs + championship read as the distinct end-of-season phases: an accent
   bar on the chip and the phase itself called out in color, the same emphasis
   the championship date already carries. The deadline stays a plain info chip. */
.summer-card-foot .summer-card-foot__playoffs {
  border-color: var(--mlcl-orange);
  box-shadow: inset 4px 0 0 var(--mlcl-orange);
  background: rgba(255, 139, 72, 0.1);
  color: var(--mlcl-accent-ink);
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 0.05em;
}
.summer-card-foot .summer-card-foot__championship {
  box-shadow: inset 4px 0 0 var(--mlcl-teal);
}
.summer-card-foot .deadline {
  color: var(--mlcl-accent-ink);
}

@media (max-width: 880px) {
  .next-season-grid { grid-template-columns: 1fr; }
  .summer-card-weeks { grid-template-columns: repeat(5, 1fr); }
}
@media (max-width: 560px) {
  .summer-card-weeks { grid-template-columns: repeat(5, 1fr); gap: 0.3rem; }
  .summer-week { padding: 0.5rem 0.2rem; }
  .summer-week .day { font-size: 1rem; }
  .summer-card-foot { grid-template-columns: 1fr; }
}
@keyframes ticker-scroll {
  from { transform: translateX(0); }
  to { transform: translateX(-50%); }
}

/* ---- Nav ---- */
.nav {
  position: sticky;
  top: 0;
  z-index: 40;
  background: rgba(12, 37, 48, 0.92);
  backdrop-filter: blur(14px);
  border-bottom: 1px solid var(--mlcl-line);
}
[data-theme="light"] .nav:not(.ink-anchor) { background: rgba(244, 241, 234, 0.92); }
[data-theme="orange"] .nav { background: rgba(26, 15, 8, 0.92); }
.nav-inner {
  display: flex;
  align-items: center;
  gap: 2rem;
  padding: 1rem 0;
}
.nav-brand {
  display: flex;
  align-items: center;
  gap: 0.7rem;
  font-family: 'Bricolage Grotesque', system-ui, sans-serif;
  font-weight: 800;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  font-size: 1rem;
  color: var(--mlcl-ink);
  text-decoration: none;
}
.nav-brand img { width: 44px; height: 44px; object-fit: contain; }
.nav-brand-name { font-size: 1.5rem; line-height: 0.95; text-transform: none; color: var(--mlcl-ink); }
.nav-brand-sub {
  display: block;
  font-size: 0.6rem;
  letter-spacing: 0.22em;
  color: var(--mlcl-teal-ink);
  font-weight: 700;
  margin-top: 2px;
}
.nav-links {
  display: flex;
  gap: 0.25rem;
  margin-left: auto;
  align-items: center;
}
.nav-link {
  display: inline-flex;
  align-items: center;
  font-family: 'Bricolage Grotesque', system-ui, sans-serif;
  font-weight: 700;
  font-size: 0.78rem;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  padding: 0.6rem 0.85rem;
  min-height: 44px;
  color: var(--mlcl-ink-dim);
  position: relative;
  transition: color 0.15s;
  cursor: pointer;
}
.nav-link:hover { color: var(--mlcl-ink); }
.nav-link.active { color: var(--mlcl-ink); }
.nav-link.active::after {
  content: '';
  position: absolute;
  left: 0.85rem; right: 0.85rem;
  bottom: -1rem;
  height: 3px;
  background: var(--mlcl-orange);
}
.nav-cta { margin-left: 0.5rem; }

.nav-burger {
  display: none;
  margin-left: auto;
  width: 44px; height: 44px;
  border: 1px solid var(--mlcl-line-strong);
  align-items: center;
  justify-content: center;
}
.nav-burger span {
  display: block;
  width: 18px;
  height: 2px;
  background: var(--mlcl-ink);
  position: relative;
}
.nav-burger span::before, .nav-burger span::after {
  content: '';
  position: absolute;
  left: 0; right: 0;
  height: 2px;
  background: var(--mlcl-ink);
}
.nav-burger span::before { top: -6px; }
.nav-burger span::after { top: 6px; }

@media (max-width: 940px) {
  .nav-links { display: none; }
  .nav-burger { display: flex; }
  .nav-links.open {
    display: flex;
    position: absolute;
    top: 100%; left: 0; right: 0;
    flex-direction: column;
    background: var(--mlcl-bg);
    padding: 1rem;
    align-items: stretch;
    border-bottom: 1px solid var(--mlcl-line);
  }
  .nav-links.open .nav-link { padding: 0.9rem 1rem; }
  .nav-links.open .nav-link.active::after { display: none; }
  .nav-links.open .nav-link.active { background: var(--mlcl-bg-2); color: var(--mlcl-orange); }
  .nav-cta { width: 100%; justify-content: center; margin: 0.5rem 0 0; }
}

/* ---- Hero ---- */
.hero {
  position: relative;
  padding: 4rem 0 5rem;
  overflow: hidden;
  isolation: isolate;
}
.hero-bg-grid {
  position: absolute;
  inset: 0;
  background-image:
    linear-gradient(var(--mlcl-line) 1px, transparent 1px),
    linear-gradient(90deg, var(--mlcl-line) 1px, transparent 1px);
  background-size: 80px 80px;
  opacity: 0.5;
  mask-image: radial-gradient(ellipse at center, rgba(0,0,0,0.7), transparent 75%);
  pointer-events: none;
}

/* The board stripes running at angle behind everything */
.hero-board-bg {
  position: absolute;
  inset: -28% -12%;
  background:
    linear-gradient(
      85deg,
      transparent 0 18%,
      var(--mlcl-teal-deep) 18% 28%,
      var(--mlcl-orange) 28% 44%,
      var(--mlcl-teal-deep) 44% 54%,
      transparent 54% 100%
    );
  transform: rotate(-12deg);
  opacity: 0.12;
  pointer-events: none;
  z-index: 0;
}
[data-theme="light"] .hero-board-bg { opacity: 0.18; }

/* Giant background year/week numeral */
.hero-mega {
  position: absolute;
  top: 48%;
  right: -4%;
  transform: translateY(-50%);
  font-family: 'Bricolage Grotesque', system-ui, sans-serif;
  font-weight: 800;
  font-size: clamp(16rem, 32vw, 28rem);
  line-height: 0.8;
  letter-spacing: -0.02em;
  color: transparent;
  -webkit-text-stroke: 2px var(--mlcl-line-strong);
  pointer-events: none;
  z-index: 0;
  font-variant-numeric: tabular-nums;
  opacity: 0.45;
  white-space: nowrap;
}
.hero-mega .acc {
  -webkit-text-stroke: 2px var(--mlcl-orange);
  opacity: 1;
}

.hero-stripe {
  position: absolute;
  width: 100%;
  height: 2px;
  background: linear-gradient(90deg, transparent, var(--mlcl-orange) 30%, var(--mlcl-orange) 70%, transparent);
  opacity: 0.4;
}

.hero-inner {
  display: grid;
  grid-template-columns: 1.1fr 0.9fr;
  gap: 4rem;
  align-items: center;
  position: relative;
  z-index: 2;
}
.hero-left { z-index: 3; }
.hero-eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 0.8rem;
  margin-bottom: 1.5rem;
}

/* Asterisk burst decoration on top corner */
.hero-burst {
  position: absolute;
  top: -10px;
  left: -30px;
  font-family: 'Bricolage Grotesque', system-ui, sans-serif;
  font-weight: 800;
  font-size: 2rem;
  color: var(--mlcl-orange);
  transform: rotate(-15deg);
  z-index: 4;
  text-shadow:
    1px 1px 0 var(--mlcl-bg),
    -1px -1px 0 var(--mlcl-bg),
    1px -1px 0 var(--mlcl-bg),
    -1px 1px 0 var(--mlcl-bg);
}

.hero-title {
  font-family: 'Bricolage Grotesque', system-ui, sans-serif;
  font-weight: 800;
  font-size: clamp(2.6rem, 6.5vw, 5.6rem);
  line-height: 0.92;
  letter-spacing: -0.005em;
  text-transform: uppercase;
  margin: 0 0 1.5rem;
  position: relative;
}
.hero-title .accent { color: var(--mlcl-orange); }
.hero-title .stroke {
  -webkit-text-stroke: 2px var(--mlcl-teal);
  color: transparent;
}
.hero-title .underline-mark {
  position: relative;
  display: inline-block;
}
.hero-title .underline-mark::after {
  content: '';
  position: absolute;
  left: -4%; right: -4%;
  bottom: -10px;
  height: 6px;
  background: var(--mlcl-orange);
  transform: skewX(-12deg);
}

.hero-sub {
  font-size: 1.15rem;
  line-height: 1.55;
  color: var(--mlcl-ink-dim);
  max-width: 460px;
  margin: 0 0 2rem;
}
.hero-cta-row {
  display: flex;
  gap: 1rem;
  flex-wrap: wrap;
}

.hero-right {
  position: relative;
  aspect-ratio: 1;
  z-index: 2;
}
.hero-logo-wrap {
  position: relative;
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
}
.hero-logo {
  width: 100%;
  max-width: 440px;
  filter: drop-shadow(0 10px 40px rgba(0,0,0,0.5));
  position: relative;
  z-index: 3;
}

/* Court diagram BEHIND the logo (subtle decorative element) */
.hero-court-diag {
  position: absolute;
  inset: 5%;
  z-index: 1;
  opacity: 0.18;
  pointer-events: none;
}

/* Rotated stamp ticket "EST '26 / SPRING / 10 WEEKS" */
.hero-ticket {
  position: absolute;
  top: 4%;
  right: -4%;
  background: var(--mlcl-orange);
  color: #0c2530;
  padding: 0.55rem 1rem 0.55rem 1.4rem;
  transform: rotate(8deg);
  font-family: 'Bricolage Grotesque', system-ui, sans-serif;
  font-weight: 800;
  font-size: 0.78rem;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  z-index: 4;
  clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%, 8% 50%);
  box-shadow: 0 6px 14px rgba(0,0,0,0.35);
}

/* "TOSS - COMPETE - CHAMPION" rotating side stamp */
.hero-side-stamp {
  position: absolute;
  left: -3.5rem;
  top: 50%;
  transform: translateY(-50%) rotate(-90deg);
  transform-origin: center;
  font-family: 'Bricolage Grotesque', system-ui, sans-serif;
  font-weight: 700;
  font-size: 0.7rem;
  letter-spacing: 0.4em;
  text-transform: uppercase;
  color: var(--mlcl-teal);
  display: flex;
  align-items: center;
  gap: 0.8rem;
  white-space: nowrap;
  z-index: 4;
}
.hero-side-stamp::before, .hero-side-stamp::after {
  content: '';
  width: 40px;
  height: 1px;
  background: var(--mlcl-teal);
}
@media (max-width: 1100px) { .hero-side-stamp { display: none; } }

/* Hero stat strip */
.hero-stats {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  border-top: 1px solid var(--mlcl-line-strong);
  border-bottom: 1px solid var(--mlcl-line-strong);
  margin-top: 3.5rem;
  position: relative;
  z-index: 2;
}
.hero-stat {
  padding: 0.85rem 1.25rem;
  border-right: 1px solid var(--mlcl-line);
  position: relative;
}
.hero-stat:last-child { border-right: none; }
.hero-stat-label {
  font-family: 'Bricolage Grotesque', system-ui, sans-serif;
  font-weight: 700;
  font-size: 0.6rem;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--mlcl-ink-mute);
  margin-bottom: 0.3rem;
}
.hero-stat-value {
  font-family: 'Bricolage Grotesque', system-ui, sans-serif;
  font-weight: 700;
  font-size: 1.35rem;
  line-height: 1.1;
  color: var(--mlcl-ink);
  font-variant-numeric: tabular-nums;
  letter-spacing: -0.01em;
}
.hero-stat-value .small {
  font-size: 0.75rem;
  color: var(--mlcl-ink-dim);
  margin-left: 0.3rem;
  font-weight: 500;
  font-style: normal;
}
.hero-stat-value .teal { color: var(--mlcl-teal); }
/* Word/date tile value (pre-season hero): a hand-set word like "Open" or a date
   like "Jun 18" instead of a number. Sized to sit on one line beside the numeric
   tiles without overflowing the four-up strip. */
.hero-stat-value--text {
  font-size: 1.15rem;
  letter-spacing: 0.005em;
  color: var(--mlcl-teal);
}

@media (max-width: 880px) {
  .hero-inner { grid-template-columns: 1fr; gap: 2rem; }
  .hero-right { aspect-ratio: auto; max-width: 360px; margin: 0 auto; }
  .hero-stats { grid-template-columns: repeat(2, 1fr); }
  .hero-stat:nth-child(2) { border-right: none; }
  .hero-stat:nth-child(1), .hero-stat:nth-child(2) { border-bottom: 1px solid var(--mlcl-line); }
  .hero-mega { font-size: 18rem; right: -10%; opacity: 0.3; }
}

/* ---- Live next match card ---- */
.live-match {
  background: var(--mlcl-bg-2);
  border: 1px solid var(--mlcl-line-strong);
  padding: 1.5rem;
  margin-top: 2rem;
  position: relative;
}
.live-match::before {
  content: '';
  position: absolute;
  top: 0; left: 0; bottom: 0;
  width: 4px;
  background: var(--mlcl-orange);
}
.live-match-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 1rem;
  font-family: 'Bricolage Grotesque', system-ui, sans-serif;
  font-size: 0.75rem;
  font-weight: 700;
  letter-spacing: 0.16em;
  text-transform: uppercase;
}
.live-match-body {
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  gap: 1rem;
  align-items: center;
}
.lm-team {
  text-align: center;
}
.lm-team-mark {
  font-family: 'Bricolage Grotesque', system-ui, sans-serif;
  font-weight: 800;
  font-size: 2rem;
  letter-spacing: 0.02em;
  color: var(--mlcl-teal-ink);
}
.lm-team-name {
  font-family: 'Bricolage Grotesque', system-ui, sans-serif;
  font-weight: 700;
  font-size: 0.85rem;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  margin-top: 0.3rem;
}
.lm-team-rec {
  font-family: 'Bricolage Grotesque', system-ui, sans-serif;
  font-size: 0.85rem;
  color: var(--mlcl-ink-mute);
}
.lm-divider {
  font-family: 'Bricolage Grotesque', system-ui, sans-serif;
  font-weight: 800;
  font-size: 1.4rem;
  color: var(--mlcl-accent-ink);
}

/* ---- Sponsors strip ---- */
.sponsors-strip {
  border-top: 1px solid var(--mlcl-line);
  border-bottom: 1px solid var(--mlcl-line);
  background: var(--mlcl-bg-2);
  overflow: hidden;
  padding: 1.25rem 0;
}
.sponsors-row {
  display: flex;
  gap: 4rem;
  align-items: center;
  animation: ticker-scroll 30s linear infinite;
  white-space: nowrap;
}
.sponsor-mark {
  display: flex;
  align-items: center;
  gap: 0.6rem;
  font-family: 'Bricolage Grotesque', system-ui, sans-serif;
  font-weight: 700;
  font-size: 0.85rem;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--mlcl-ink-dim);
}
.sponsor-mark .sponsor-dot {
  width: 8px; height: 8px;
  border: 1px solid var(--mlcl-orange);
  background: var(--mlcl-orange);
  transform: rotate(45deg);
}

/* ---- Standings teaser table ---- */
.standings-mini {
  width: 100%;
  border-collapse: collapse;
}
.standings-mini th {
  text-align: left;
  font-family: 'Bricolage Grotesque', system-ui, sans-serif;
  font-weight: 700;
  font-size: 0.7rem;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--mlcl-ink-mute);
  padding: 0.8rem 0.6rem;
  border-bottom: 1px solid var(--mlcl-line-strong);
}
.standings-mini td {
  padding: 0.85rem 0.6rem;
  border-bottom: 1px solid var(--mlcl-line);
  font-family: 'Bricolage Grotesque', system-ui, sans-serif;
}
.standings-mini tr.row-hot td { background: rgba(255, 139, 72, 0.05); }
.standings-mini tr.row-hot td:first-child { box-shadow: inset 3px 0 0 var(--mlcl-orange); }
.standings-mini .rank {
  font-family: 'Bricolage Grotesque', system-ui, sans-serif;
  font-weight: 800;
  font-size: 1.1rem;
  color: var(--mlcl-teal-ink);
  width: 40px;
}
.standings-mini .rank.top { color: var(--mlcl-accent-ink); }
.standings-mini .team-cell { display: flex; align-items: center; gap: 0.8rem; }
.team-mark {
  font-family: 'Bricolage Grotesque', system-ui, sans-serif;
  font-weight: 800;
  font-size: 0.85rem;
  letter-spacing: 0.04em;
  background: var(--mlcl-bg-3);
  color: var(--mlcl-teal-ink);
  padding: 0.45rem 0.55rem;
  min-width: 50px;
  text-align: center;
  border: 1px solid var(--mlcl-line);
}
.team-mark.orange { color: var(--mlcl-accent-ink); border-color: var(--mlcl-accent-ink); }
.team-name {
  font-family: 'Bricolage Grotesque', system-ui, sans-serif;
  font-weight: 700;
  font-size: 0.95rem;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}
.standings-mini .num { font-weight: 700; font-size: 1.2rem; font-variant-numeric: tabular-nums; font-family: 'Bricolage Grotesque'; letter-spacing: -0.01em; }
.standings-mini .pct { color: var(--mlcl-teal-ink); font-weight: 800; font-size: 1.15rem; font-variant-numeric: tabular-nums; font-family: 'Bricolage Grotesque'; letter-spacing: -0.01em; }
.standings-mini .streak-w { color: var(--mlcl-good-ink); font-weight: 700; }
.standings-mini .streak-l { color: var(--mlcl-bad-ink); font-weight: 700; }
.standings-mini .placement-finish {
  color: var(--mlcl-teal-ink);
  font-weight: 800;
  text-transform: uppercase;
}
.standings-mini .placement-finish--champion { color: var(--mlcl-accent-ink); }
.standings-mini .last5 { display: flex; gap: 3px; }
.standings-mini .last5 span {
  width: 14px; height: 14px;
  display: flex; align-items: center; justify-content: center;
  font-size: 0.65rem;
  font-weight: 800;
  font-family: 'Bricolage Grotesque', system-ui, sans-serif;
  color: #0c2530;
}
.last5 .w { background: var(--mlcl-teal); }
.last5 .l { background: var(--mlcl-ink-mute); color: var(--mlcl-ink); }

/* ---- Info grid ---- */
/* 8 tiles in 4+4: no orphan cells, no gap-background bleed-through */
.info-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 1px;
  background: var(--mlcl-line-strong);
  border: 1px solid var(--mlcl-line-strong);
}
@media (max-width: 900px) {
  .info-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 480px) {
  .info-grid { grid-template-columns: 1fr; }
}
.info-tile {
  background: var(--mlcl-bg);
  padding: 1.8rem 1.5rem;
}
.info-tile-label {
  font-family: 'Bricolage Grotesque', system-ui, sans-serif;
  font-weight: 700;
  font-size: 0.7rem;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: var(--mlcl-teal-ink);
  margin-bottom: 0.8rem;
}
.info-tile-value {
  font-family: 'Bricolage Grotesque', system-ui, sans-serif;
  font-weight: 800;
  font-size: 1.6rem;
  letter-spacing: 0.02em;
  text-transform: uppercase;
  line-height: 1;
  margin-bottom: 0.4rem;
}
.info-tile-sub {
  color: var(--mlcl-ink-dim);
  font-size: 0.95rem;
}

/* ---- Schedule strip ---- */
.schedule-grid {
  display: grid;
  grid-template-columns: repeat(10, 1fr);
  gap: 0.5rem;
  margin-top: 1rem;
}
.week-tile {
  background: var(--mlcl-surface);
  border: 1px solid var(--mlcl-line);
  padding: 1rem 0.5rem;
  text-align: center;
  cursor: pointer;
  transition: all 0.15s;
  position: relative;
}
.week-tile:hover { border-color: var(--mlcl-teal); }
/* Played weeks: lightly de-emphasized; the diagonal "done" hatch carries the
   signal so the labels stay legible (AA) instead of being dimmed unreadable. */
.week-tile.past,
.week-tile.played { opacity: 0.92; }
.week-tile.past::after,
.week-tile.played::after {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(135deg, transparent 48%, var(--mlcl-line-strong) 48%, var(--mlcl-line-strong) 52%, transparent 52%);
}
/* This week: solid orange, the strongest signal. */
.week-tile.current {
  background: var(--mlcl-orange);
  color: #0c2530;
  border-color: var(--mlcl-orange);
  box-shadow: 0 8px 22px rgba(255, 139, 72, 0.28);
}
/* Next up (pre-season): teal-outlined and lifted, clearly the one coming. */
.week-tile.next {
  border-color: var(--mlcl-teal);
  border-width: 2px;
  background: rgba(83, 194, 203, 0.08);
}
/* Upcoming: plain outline, the quiet default. */
.week-tile.upcoming { border-color: var(--mlcl-line-strong); }
/* Tile flag badge for the this-week / next-up tile. */
.week-flag {
  font-family: 'Bricolage Grotesque', system-ui, sans-serif;
  font-weight: 800;
  font-size: 0.5rem;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  line-height: 1;
  margin-bottom: 0.45rem;
  color: var(--mlcl-teal-ink);
}
.week-tile.current .week-flag,
.week-tile.next .week-flag { color: #0c2530; }
.week-num {
  font-family: 'Bricolage Grotesque', system-ui, sans-serif;
  font-weight: 700;
  font-size: 0.7rem;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  margin-bottom: 0.3rem;
  opacity: 0.7;
}
.week-date {
  font-family: 'Bricolage Grotesque', system-ui, sans-serif;
  font-weight: 800;
  font-size: 1.1rem;
  line-height: 1;
}
.week-month {
  font-family: 'Bricolage Grotesque', system-ui, sans-serif;
  font-weight: 700;
  font-size: 0.65rem;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  margin-top: 0.3rem;
  opacity: 0.8;
}
.week-stage {
  font-family: 'Bricolage Grotesque', system-ui, sans-serif;
  font-size: 0.54rem;
  font-weight: 900;
  letter-spacing: 0.08em;
  line-height: 1.1;
  margin-top: 0.55rem;
  text-transform: uppercase;
}
@media (max-width: 880px) {
  .schedule-grid { grid-template-columns: repeat(5, 1fr); }
}
@media (max-width: 500px) {
  .schedule-grid { grid-template-columns: repeat(2, 1fr); }
}

/* ---- Season calendar legend ---- */
.schedule-legend {
  margin-top: 1.5rem;
  display: flex;
  gap: 1.25rem 1.6rem;
  flex-wrap: wrap;
  font-family: 'Bricolage Grotesque', system-ui, sans-serif;
  font-weight: 700;
  font-size: 0.7rem;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--mlcl-ink-mute);
}
.schedule-legend__item {
  display: flex;
  align-items: center;
  gap: 0.5rem;
}
.schedule-legend__swatch {
  width: 14px;
  height: 14px;
  flex: none;
}
.schedule-legend__swatch--current { background: var(--mlcl-orange); }
.schedule-legend__swatch--next {
  border: 2px solid var(--mlcl-teal);
  background: rgba(83, 194, 203, 0.08);
}
.schedule-legend__swatch--upcoming { border: 1px solid var(--mlcl-line-strong); }
.schedule-legend__swatch--played {
  background: var(--mlcl-surface);
  border: 1px solid var(--mlcl-line);
  opacity: 0.5;
}

/* Tighten the calendar's vertical rhythm inside its full-bleed band: the band
   already owns the section padding, so the inner .section drops its own
   top/bottom padding and the heading underline sits closer to the grid. */
body.mlcl-broadcast .entry-content .section[data-mlcl-schedule] { padding-top: 0; padding-bottom: 0; }
body.mlcl-broadcast .entry-content .section[data-mlcl-schedule] .section-head { margin-bottom: 1.6rem; }

/* ---- Diagonal section divider ---- */
.diag-divider {
  height: 60px;
  background: linear-gradient(135deg, var(--mlcl-bg) 50%, var(--mlcl-bg-2) 50%);
  position: relative;
}

/* ---- Rules / scoring (split) ---- */
.split-2 {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0;
  border: 1px solid var(--mlcl-line-strong);
}
.split-2 > div { padding: 2rem; }
.split-2 > div:first-child { border-right: 1px solid var(--mlcl-line-strong); }
.split-2 h3 {
  font-family: 'Bricolage Grotesque', system-ui, sans-serif;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 0.02em;
  font-size: 1.5rem;
  margin: 0 0 1.5rem;
}
.split-2 ul {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 0.6rem;
}
.split-2 li {
  display: flex;
  gap: 0.8rem;
  align-items: flex-start;
  padding: 0.6rem 0;
  border-bottom: 1px dashed var(--mlcl-line);
  font-size: 1rem;
  line-height: 1.4;
}
.split-2 li:last-child { border-bottom: none; }
.split-2 li::before {
  content: counter(rule-counter, decimal-leading-zero);
  counter-increment: rule-counter;
  font-family: 'Bricolage Grotesque', system-ui, sans-serif;
  font-weight: 800;
  font-size: 0.8rem;
  color: var(--mlcl-accent-ink);
  letter-spacing: 0.04em;
  min-width: 28px;
}
.split-2 ul { counter-reset: rule-counter; }
@media (max-width: 768px) {
  .split-2 { grid-template-columns: 1fr; }
  .split-2 > div:first-child { border-right: none; border-bottom: 1px solid var(--mlcl-line-strong); }
}

/* Scoring hero block */
.scoring-hero {
  margin-bottom: 3rem;
}
.scoring-hero-title {
  font-family: 'Bricolage Grotesque', system-ui, sans-serif;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 0.02em;
  font-size: 1.5rem;
  margin: 0 0 1.25rem;
}

/* Scoring grid */
.score-keys {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 1rem;
  margin-top: 0;
}
@media (max-width: 640px) {
  .score-keys { grid-template-columns: repeat(2, 1fr); }
}
.score-key {
  background: var(--mlcl-bg-3);
  padding: 1.5rem 1rem 1.25rem;
  text-align: center;
  border: 1px solid var(--mlcl-line);
  border-top: 3px solid var(--mlcl-line-strong);
}
.score-key--hole {
  border-top-color: var(--mlcl-accent-ink);
  border-top-width: 4px;
  background: rgba(181, 64, 12, 0.07);
  padding-top: 1.75rem;
  padding-bottom: 1.5rem;
}
.score-key--board {
  border-top-color: var(--mlcl-teal-ink);
  background: rgba(24, 112, 112, 0.06);
}
.score-key--hang {
  border-top-color: var(--mlcl-teal-ink);
  background: rgba(24, 112, 112, 0.04);
  border-top-style: dashed;
}
.score-key--zero {
  border-top-color: var(--mlcl-line-strong);
  background: var(--mlcl-bg-2);
  opacity: 0.7;
}
.standings-full .num, .standings-full td.num {
  font-family: 'Bricolage Grotesque', system-ui, sans-serif;
  font-weight: 800;
  font-size: 1.2rem;
  font-variant-numeric: tabular-nums;
  letter-spacing: -0.01em;
}
.standings-full .pct {
  font-family: 'Bricolage Grotesque', system-ui, sans-serif;
  font-weight: 800;
  font-size: 1.2rem;
  font-variant-numeric: tabular-nums;
  color: var(--mlcl-teal-ink);
  letter-spacing: -0.01em;
}
.score-key-pts {
  font-family: 'Bricolage Grotesque', system-ui, sans-serif;
  font-weight: 800;
  font-size: 3rem;
  line-height: 0.9;
  color: var(--mlcl-ink);
  margin-bottom: 0.5rem;
  letter-spacing: -0.01em;
}
.score-key--hole .score-key-pts {
  font-size: 3.75rem;
  color: var(--mlcl-accent-ink);
}
.score-key--board .score-key-pts,
.score-key--hang .score-key-pts {
  color: var(--mlcl-teal-ink);
}
.score-key--zero .score-key-pts {
  color: var(--mlcl-ink-mute);
}
.sc-stat-num {
  font-family: 'Bricolage Grotesque', system-ui, sans-serif;
  font-weight: 800;
  font-size: 1.55rem;
  line-height: 1;
  font-variant-numeric: tabular-nums;
  letter-spacing: -0.02em;
}
.flip-fs-num {
  font-family: 'Bricolage Grotesque', system-ui, sans-serif;
  font-weight: 800;
  font-size: 1.75rem;
  line-height: 1;
  font-variant-numeric: tabular-nums;
  letter-spacing: -0.02em;
}
.score-key-label {
  font-family: 'Bricolage Grotesque', system-ui, sans-serif;
  font-weight: 700;
  font-size: 0.75rem;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--mlcl-ink-dim);
  line-height: 1.3;
}
.score-key--hole .score-key-label {
  color: var(--mlcl-ink);
  font-weight: 800;
}

/* Cancellation scoring callout */
.score-cancel-note {
  display: flex;
  align-items: baseline;
  gap: 0.75rem;
  margin-top: 1rem;
  padding: 0.85rem 1.1rem;
  border: 1px solid var(--mlcl-line);
  border-top: 3px solid var(--mlcl-teal-ink);
  font-size: 0.9rem;
  color: var(--mlcl-ink-dim);
  flex-wrap: wrap;
}
.score-cancel-note-label {
  font-family: 'Bricolage Grotesque', system-ui, sans-serif;
  font-weight: 800;
  font-size: 0.75rem;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--mlcl-teal-ink);
  white-space: nowrap;
}
.score-cancel-note ul {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-wrap: wrap;
  gap: 0 1.5rem;
}
.score-cancel-note li {
  position: relative;
  padding-left: 0.9rem;
  line-height: 1.4;
}
.score-cancel-note li::before {
  content: '';
  position: absolute;
  left: 0;
  top: 0.55em;
  width: 4px;
  height: 4px;
  border-radius: 50%;
  background: var(--mlcl-teal-ink);
  opacity: 0.6;
}

/* Rules two-column block */
.rules-block {
  border: 1px solid var(--mlcl-line-strong);
  padding: 2rem;
}
.rules-block-title {
  font-family: 'Bricolage Grotesque', system-ui, sans-serif;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 0.02em;
  font-size: 1.5rem;
  margin: 0 0 1.5rem;
}
.rules-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 1.35rem;
  /* Reset on the grid (not each ul) so the official and house rule numbers run
     continuously instead of restarting at 01 for each subsection. */
  counter-reset: rule-counter;
}
.rules-list {
  min-width: 0;
}
.rules-list-title {
  font-family: 'Bricolage Grotesque', system-ui, sans-serif;
  font-size: 0.78rem;
  font-weight: 800;
  letter-spacing: 0.16em;
  margin: 0 0 0.8rem;
  padding-bottom: 0.55rem;
  text-transform: uppercase;
  border-bottom: 2px solid var(--mlcl-orange);
}
.rules-list--house .rules-list-title {
  border-bottom-color: var(--mlcl-teal-ink);
}
.rules-grid ul {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 0;
}
.rules-grid li {
  display: flex;
  gap: 0.8rem;
  align-items: flex-start;
  padding: 0.55rem 0;
  border-bottom: 1px dashed var(--mlcl-line);
  font-size: 0.975rem;
  line-height: 1.4;
  counter-increment: rule-counter;
}
.rules-grid li:last-child { border-bottom: none; }
.rules-grid li::before {
  content: counter(rule-counter, decimal-leading-zero);
  font-family: 'Bricolage Grotesque', system-ui, sans-serif;
  font-weight: 800;
  font-size: 0.8rem;
  color: var(--mlcl-accent-ink);
  letter-spacing: 0.04em;
  min-width: 28px;
  padding-top: 0.1em;
}

/* ---- FAQ ---- */
.faq-item {
  border-bottom: 1px solid var(--mlcl-line);
}
.faq-q {
  width: 100%;
  text-align: left;
  padding: 1.25rem 0;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  font-family: 'Bricolage Grotesque', system-ui, sans-serif;
  font-weight: 700;
  font-size: 1.05rem;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--mlcl-ink);
  background: transparent;
  border: none;
  cursor: pointer;
}
.faq-q-num {
  font-family: 'Bricolage Grotesque', system-ui, sans-serif;
  font-weight: 800;
  font-size: 0.75rem;
  color: var(--mlcl-accent-ink);
  letter-spacing: 0.1em;
  margin-right: 1rem;
}
.faq-toggle {
  width: 32px; height: 32px;
  border: 1px solid var(--mlcl-line-strong);
  display: flex;
  align-items: center;
  justify-content: center;
  transition: transform 0.2s, background 0.2s;
  flex-shrink: 0;
}
.faq-toggle::before {
  content: '+';
  font-family: 'Bricolage Grotesque', system-ui, sans-serif;
  font-weight: 700;
  font-size: 1.2rem;
}
.faq-item.open .faq-toggle {
  background: var(--mlcl-orange);
  color: #0c2530;
  border-color: var(--mlcl-orange);
  transform: rotate(45deg);
}
.faq-a {
  max-height: 0;
  overflow: hidden;
  transition: max-height 0.3s ease, padding 0.3s;
  color: var(--mlcl-ink-dim);
  font-size: 1.05rem;
  line-height: 1.6;
}
.faq-item.open .faq-a {
  max-height: 400px;
  padding: 0 0 1.5rem;
}

/* FAQ interactive states. GeneratePress styles bare <button> with background:#55555e
   and a #3f4047 hover/focus background; .faq-q only reset the resting background, so
   GP's gray leaked onto the question on hover and focus (and the .entry-content color
   pin left dark text on it, failing AA). Own every state here in the orange accent
   language already used by the focus ring and the open toggle. */
.faq-q { transition: color 0.18s ease; }
.faq-q:hover,
.faq-q:focus,
.faq-item.open .faq-q { background: transparent; }
.faq-q:hover { color: var(--mlcl-accent-ink); }
.faq-item:not(.open) .faq-q:hover .faq-toggle,
.faq-item:not(.open) .faq-q:focus-visible .faq-toggle {
  border-color: var(--mlcl-orange);
  background: rgba(255, 139, 72, 0.12);
}

/* ---- Footer ---- */
.footer {
  background: #061821;
  border-top: 2px solid var(--mlcl-orange);
  padding: 4rem 0 2rem;
}
.footer-grid {
  display: grid;
  grid-template-columns: 1.5fr 1fr 1fr 1fr;
  gap: 3rem;
  margin-bottom: 3rem;
}
.footer h4 {
  font-family: 'Bricolage Grotesque', system-ui, sans-serif;
  font-weight: 800;
  font-size: 0.8rem;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  margin: 0 0 1rem;
  color: var(--mlcl-teal);
}
.footer-links { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 0.6rem; }
.footer-links a {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  color: var(--mlcl-ink-dim);
  font-family: 'Bricolage Grotesque', system-ui, sans-serif;
  font-size: 0.8rem;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  transition: color 0.15s;
  cursor: pointer;
}
.footer-links a:hover { color: var(--mlcl-orange); }
.footer-bottom {
  border-top: 1px solid var(--mlcl-line);
  padding-top: 1.5rem;
  display: flex;
  align-items: center;
  justify-content: space-between;
  font-size: 0.85rem;
  color: var(--mlcl-ink-mute);
}
@media (max-width: 768px) {
  .footer-grid { grid-template-columns: 1fr 1fr; gap: 2rem; }
}

/* ---- Pricing cards ---- */
.pricing-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1.5rem;
}
.price-card {
  background: var(--mlcl-surface);
  border: 1px solid var(--mlcl-line);
  padding: 2.5rem 2rem;
  position: relative;
}
.price-card.featured {
  border-color: var(--mlcl-orange);
  background: linear-gradient(180deg, rgba(255, 139, 72, 0.1), transparent 60%), var(--mlcl-surface);
}
.price-card.featured::before {
  content: 'Most Popular';
  position: absolute;
  top: -1px; right: 1.5rem;
  background: var(--mlcl-orange);
  color: #0c2530;
  font-family: 'Bricolage Grotesque', system-ui, sans-serif;
  font-weight: 700;
  font-size: 0.65rem;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  padding: 0.4rem 0.7rem;
}
.price-card h3 {
  font-family: 'Bricolage Grotesque', system-ui, sans-serif;
  font-weight: 800;
  text-transform: uppercase;
  font-size: 1.4rem;
  letter-spacing: 0.02em;
  margin: 0 0 0.5rem;
}
.price {
  font-family: 'Bricolage Grotesque', system-ui, sans-serif;
  font-weight: 800;
  font-size: 4rem;
  line-height: 1;
  margin: 1rem 0;
  letter-spacing: -0.01em;
}
.price .currency {
  font-size: 1.5rem;
  vertical-align: top;
  color: var(--mlcl-accent-ink);
  font-weight: 700;
  margin-right: 0.2rem;
}
.price .period { font-size: 1rem; color: var(--mlcl-ink-dim); letter-spacing: 0.08em; }
.price-card ul {
  list-style: none;
  padding: 0;
  margin: 1.5rem 0;
  display: flex;
  flex-direction: column;
  gap: 0.7rem;
}
.price-card li {
  display: flex;
  align-items: flex-start;
  gap: 0.6rem;
  font-size: 1rem;
  color: var(--mlcl-ink-dim);
}
.price-card li::before {
  content: '';
  width: 18px; height: 18px;
  background: var(--mlcl-orange);
  margin-top: 3px;
  flex-shrink: 0;
  clip-path: polygon(15% 50%, 0 65%, 40% 100%, 100% 25%, 85% 10%, 40% 65%);
}
@media (max-width: 768px) {
  .pricing-grid { grid-template-columns: 1fr; }
}

/* ---- Misc utilities ---- */
.text-muted { color: var(--mlcl-ink-dim); }
.text-teal { color: var(--mlcl-teal-ink); }
.text-orange { color: var(--mlcl-orange); }
.divider-orange { height: 4px; background: var(--mlcl-orange); width: 60px; margin-bottom: 1.5rem; }

/* ---- Bag toss animation ---- */
.bag-anim {
  position: absolute;
  pointer-events: none;
  z-index: 1;
}
.bag {
  position: absolute;
  width: 28px;
  height: 28px;
  background: var(--mlcl-orange);
  border-radius: 3px;
  box-shadow: inset 0 -4px 0 rgba(0,0,0,0.2);
}
.bag.t { background: var(--mlcl-teal); }
.bag-stitched::after {
  content: '';
  position: absolute;
  inset: 4px;
  border: 1.5px dashed rgba(0,0,0,0.3);
  border-radius: 2px;
}
@keyframes bagTossA {
  0% { transform: translate(-200px, 100px) rotate(0deg); opacity: 0; }
  10% { opacity: 1; }
  100% { transform: translate(600px, -350px) rotate(720deg); opacity: 0; }
}
@keyframes bagTossB {
  0% { transform: translate(800px, 100px) rotate(0deg); opacity: 0; }
  10% { opacity: 1; }
  100% { transform: translate(-200px, -350px) rotate(-720deg); opacity: 0; }
}

/* ---- Page-only sections (sub pages) ---- */
.page-header {
  background: var(--mlcl-bg-2);
  padding: 3.5rem 0 2rem;
  position: relative;
  overflow: hidden;
}
/* Reduce the dead band between the page-header divider and first content section */
.page-header + .section {
  padding-top: 2.5rem;
}
.page-header::after {
  content: '';
  position: absolute;
  left: 0; right: 0; bottom: 0;
  height: 4px;
  background: linear-gradient(90deg, var(--mlcl-teal-deep) 0 28%, var(--mlcl-orange) 28% 72%, var(--mlcl-teal-deep) 72% 100%);
}
.page-header-mega {
  position: absolute;
  right: -2%;
  top: 50%;
  transform: translateY(-50%);
  font-family: 'Bricolage Grotesque', system-ui, sans-serif;
  font-weight: 800;
  font-size: clamp(12rem, 22vw, 20rem);
  line-height: 0.85;
  letter-spacing: -0.02em;
  color: transparent;
  -webkit-text-stroke: 2px var(--mlcl-line);
  pointer-events: none;
  z-index: 0;
  font-variant-numeric: tabular-nums;
  opacity: 0.55;
  white-space: nowrap;
}
.page-header .wrap { position: relative; z-index: 1; }
.page-header h1 {
  font-family: 'Bricolage Grotesque', system-ui, sans-serif;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 0.01em;
  font-size: clamp(2.2rem, 5vw, 4rem);
  line-height: 0.9;
  margin: 0;
}
.page-header h1 .slash {
  color: var(--mlcl-accent-ink);
  font-family: 'Bricolage Grotesque', system-ui, sans-serif;
  font-weight: 800;
  margin: 0 0.1em;
}
.page-header h1 .accent { color: var(--mlcl-accent-ink); }
.page-header .crumbs {
  font-family: 'Bricolage Grotesque', system-ui, sans-serif;
  font-weight: 700;
  font-size: 0.7rem;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: var(--mlcl-teal-ink);
  margin-bottom: 0.8rem;
  display: flex; gap: 0.6rem; align-items: center;
}
.page-header .crumbs span { color: var(--mlcl-ink-mute); }

/* ---- Standings full ---- */
.standings-toolbar {
  display: flex;
  align-items: center;
  gap: 1rem;
  margin-bottom: 1.5rem;
  flex-wrap: wrap;
}
.tab-row {
  display: flex;
  gap: 0;
  border: 1px solid var(--mlcl-line-strong);
}
.tab-row button {
  min-height: 44px;
  font-family: 'Bricolage Grotesque', system-ui, sans-serif;
  font-weight: 700;
  font-size: 0.72rem;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  padding: 0.7rem 1rem;
  color: var(--mlcl-ink-dim);
  background: transparent;
  border-right: 1px solid var(--mlcl-line-strong);
}
.tab-row button:last-child { border-right: none; }
.tab-row button.active { background: var(--mlcl-orange); color: #0c2530; }
.search-input {
  background: var(--mlcl-surface);
  border: 1px solid var(--mlcl-line-strong);
  padding: 0.6rem 0.9rem;
  font-family: 'Bricolage Grotesque';
  color: var(--mlcl-ink);
  font-size: 1rem;
  flex: 1;
  min-width: 200px;
  outline: none;
}
.search-input:focus { border-color: var(--mlcl-orange); }
.search-input::placeholder { color: var(--mlcl-ink-mute); }

.standings-full {
  width: 100%;
  border-collapse: collapse;
}
.standings-full th {
  font-family: 'Bricolage Grotesque', system-ui, sans-serif;
  font-weight: 700;
  font-size: 0.68rem;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--mlcl-ink-mute);
  padding: 0.9rem 0.7rem;
  text-align: left;
  border-bottom: 2px solid var(--mlcl-line-strong);
  background: var(--mlcl-bg-2);
  cursor: pointer;
  white-space: nowrap;
}
.standings-full th .sort-ind {
  margin-left: 4px;
  opacity: 0.7;
}
.standings-full th.center, .standings-full td.center { text-align: center; }
.standings-full td {
  padding: 0.85rem 0.7rem;
  border-bottom: 1px solid var(--mlcl-line);
  vertical-align: middle;
}
.standings-full tr:hover td { background: var(--mlcl-bg-2); cursor: pointer; }
.standings-full tr.expanded td { background: var(--mlcl-bg-2); }
.standings-full .expand-body td {
  background: var(--mlcl-bg-3);
  padding: 1.5rem;
}

/* Podium */
.podium {
  display: grid;
  grid-template-columns: 1fr 1.2fr 1fr;
  align-items: end;
  gap: 1rem;
  margin: 2rem 0;
}
.podium-spot {
  text-align: center;
  padding: 1.5rem 1rem;
  background: var(--mlcl-surface);
  border: 1px solid var(--mlcl-line);
  position: relative;
}
.podium-spot .place {
  font-family: 'Bricolage Grotesque', system-ui, sans-serif;
  font-weight: 800;
  font-size: 4rem;
  line-height: 1;
  margin-bottom: 0.5rem;
}
.podium-1 { border-color: var(--mlcl-orange); }
.podium-1 .place { color: var(--mlcl-orange); font-size: 5rem; }
.podium-1 { padding-top: 2.5rem; }
.podium-2 .place { color: var(--mlcl-teal-ink); }
.podium-3 .place { color: #cd7f32; }
.podium-spot .tname {
  font-family: 'Bricolage Grotesque', system-ui, sans-serif;
  font-weight: 700;
  font-size: 0.95rem;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  margin-bottom: 0.3rem;
}
.podium-spot .trec {
  font-family: 'Bricolage Grotesque';
  color: var(--mlcl-ink-dim);
  font-size: 0.95rem;
}

/* Standings cards */
.standings-cards {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
  gap: 1rem;
}
.sc-card {
  background: var(--mlcl-surface);
  border: 1px solid var(--mlcl-line);
  padding: 1.25rem;
  position: relative;
}
.sc-card.top1 { border-color: var(--mlcl-orange); }
.sc-card.top3 { border-top: 3px solid var(--mlcl-teal); }
.sc-card-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 1rem;
}
.sc-rank {
  font-family: 'Bricolage Grotesque', system-ui, sans-serif;
  font-weight: 800;
  font-size: 2rem;
  color: var(--mlcl-teal-ink);
  line-height: 1;
}
.sc-card.top1 .sc-rank { color: var(--mlcl-orange); }
.sc-stats {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 0.4rem;
  margin-top: 1rem;
  padding-top: 1rem;
  border-top: 1px solid var(--mlcl-line);
}
.sc-stats div {
  text-align: center;
}
.sc-stat-num {
  font-family: 'Bricolage Grotesque';
  font-weight: 800;
  font-size: 1.4rem;
  line-height: 1;
  font-variant-numeric: tabular-nums;
}
.sc-stat-lbl {
  font-family: 'Bricolage Grotesque', system-ui, sans-serif;
  font-weight: 700;
  font-size: 0.6rem;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--mlcl-ink-mute);
  margin-top: 0.25rem;
}

/* ---- Roster flip cards ---- */
.roster-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
  gap: 1.25rem;
}
.flip-card {
  perspective: 1200px;
  height: 360px;
  cursor: pointer;
}
.flip-inner {
  position: relative;
  width: 100%;
  height: 100%;
  transition: transform 0.6s cubic-bezier(0.4, 0, 0.2, 1);
  transform-style: preserve-3d;
}
.flip-card.flipped .flip-inner { transform: rotateY(180deg); }
.flip-face {
  position: absolute;
  inset: 0;
  backface-visibility: hidden;
  border: 1px solid var(--mlcl-line);
  background: var(--mlcl-surface);
  /* Extra bottom padding reserves room for the .flip-hint footer pinned to the
     card's bottom border. */
  padding: 1.5rem 1.5rem 2.6rem;
  display: flex;
  flex-direction: column;
}
.flip-back { transform: rotateY(180deg); background: var(--mlcl-bg-2); }
.flip-team-mark {
  font-family: 'Bricolage Grotesque', system-ui, sans-serif;
  font-weight: 800;
  font-size: 3.5rem;
  letter-spacing: 0.02em;
  color: var(--mlcl-orange);
  line-height: 1;
  margin-bottom: 0.5rem;
}
.flip-team-name {
  font-family: 'Bricolage Grotesque', system-ui, sans-serif;
  font-weight: 800;
  font-size: 1.35rem;
  letter-spacing: 0.03em;
  text-transform: uppercase;
  line-height: 1.1;
  margin: 0 0 1.2rem;
  color: var(--mlcl-ink);
}
.flip-front-stats {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0.5rem;
  margin-top: auto;
}
.flip-front-stats > div {
  border: 1px solid var(--mlcl-line);
  padding: 0.6rem;
}
.flip-fs-num {
  font-family: 'Bricolage Grotesque';
  font-weight: 800;
  font-size: 1.6rem;
  line-height: 1;
  font-variant-numeric: tabular-nums;
}
.flip-fs-lbl {
  font-family: 'Bricolage Grotesque', system-ui, sans-serif;
  font-weight: 700;
  font-size: 0.6rem;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--mlcl-ink-mute);
  margin-top: 0.3rem;
}
.flip-back h4 {
  font-family: 'Bricolage Grotesque', system-ui, sans-serif;
  font-weight: 700;
  font-size: 0.7rem;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--mlcl-teal-ink);
  margin: 0 0 0.6rem;
}
.player-row {
  display: flex;
  align-items: center;
  gap: 0.8rem;
  padding: 0.7rem 0;
  border-bottom: 1px dashed var(--mlcl-line);
}
.player-row:last-child { border-bottom: none; }
.player-avatar {
  width: 38px; height: 38px;
  background: var(--mlcl-bg-3);
  color: var(--mlcl-teal-ink);
  font-family: 'Bricolage Grotesque', system-ui, sans-serif;
  font-weight: 800;
  font-size: 0.85rem;
  display: flex;
  align-items: center;
  justify-content: center;
  border: 1px solid var(--mlcl-line-strong);
}
.player-name {
  font-family: 'Bricolage Grotesque', system-ui, sans-serif;
  font-weight: 700;
  font-size: 0.85rem;
  letter-spacing: 0.05em;
  text-transform: uppercase;
}

/* ---- Roster directory cards ---- */
.mlcl-rosters .standings-toolbar {
  align-items: center;
}

.mlcl-rosters [data-roster-count] {
  margin-left: auto;
}

.roster-phase-pill {
  display: inline-flex;
  min-height: 44px;
  align-items: center;
  padding: 0.7rem 0.95rem;
  border: 1px solid rgba(12, 37, 48, 0.18);
  background: #fffdf8;
  color: #a84e16;
  font-family: 'Bricolage Grotesque', system-ui, sans-serif;
  font-size: 0.7rem;
  font-weight: 850;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}

.mlcl-rosters .roster-grid {
  grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
  gap: 1rem;
  align-items: stretch;
}

.roster-card {
  position: relative;
  display: flex;
  min-height: 100%;
  flex-direction: column;
  gap: 1rem;
  overflow: hidden;
  border: 1px solid rgba(12, 37, 48, 0.16);
  background: #fffdf8;
  box-shadow: 0 16px 34px rgba(12, 37, 48, 0.08);
}

.roster-card::before {
  content: "";
  position: absolute;
  top: 0;
  right: 0;
  left: 0;
  height: 5px;
  background: linear-gradient(90deg, var(--mlcl-orange) 0 44%, var(--mlcl-teal-ink) 44% 100%);
}

.roster-card--b::before {
  background: linear-gradient(90deg, var(--mlcl-teal-ink) 0 58%, var(--mlcl-orange) 58% 100%);
}

.roster-card--absent {
  background: #f7f4ec;
}

.roster-card__head {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 0.95rem;
  align-items: center;
  padding: 1.35rem 1.35rem 0;
}

.roster-card__badge {
  display: inline-flex;
  width: 64px;
  height: 64px;
  align-items: center;
  justify-content: center;
  border: 2px solid rgba(12, 37, 48, 0.18);
  background:
    linear-gradient(90deg, rgba(255,255,255,0.12) 0 32%, transparent 32% 100%),
    #123f4d;
  color: #f4f1ea;
  font-family: 'Bricolage Grotesque', system-ui, sans-serif;
  font-size: 1.05rem;
  font-weight: 900;
  letter-spacing: 0.02em;
  line-height: 1;
  text-transform: uppercase;
}

.roster-card__badge--a {
  background:
    linear-gradient(90deg, rgba(255,255,255,0.16) 0 32%, transparent 32% 100%),
    var(--mlcl-orange);
  color: #241003;
}

.roster-card__badge--b {
  background:
    linear-gradient(90deg, rgba(255,255,255,0.12) 0 32%, transparent 32% 100%),
    var(--mlcl-teal-ink);
}

.roster-card__badge--logo {
  width: 72px;
  height: 72px;
  overflow: hidden;
  padding: 0.35rem;
  border-color: rgba(12, 37, 48, 0.22);
  background: #fffdf8;
  box-shadow:
    inset 0 0 0 1px rgba(255, 255, 255, 0.88),
    0 1px 0 rgba(12, 37, 48, 0.08);
  color: transparent;
}

.roster-card__logo {
  display: block;
  width: 100%;
  height: 100%;
  filter:
    drop-shadow(0 0 1px rgba(255, 255, 255, 0.94))
    drop-shadow(0 0 2px rgba(12, 37, 48, 0.68));
  object-fit: contain;
}

.roster-card__identity {
  min-width: 0;
}

.roster-card__status {
  display: inline-flex;
  margin-bottom: 0.35rem;
  color: #a72810;
  font-family: 'Bricolage Grotesque', system-ui, sans-serif;
  font-size: 0.64rem;
  font-weight: 800;
  letter-spacing: 0.13em;
  text-transform: uppercase;
}

.roster-card__name {
  margin: 0;
  color: var(--mlcl-ink);
  font-family: 'Bricolage Grotesque', system-ui, sans-serif;
  font-size: clamp(1rem, 1.7vw, 1.28rem);
  font-weight: 900;
  letter-spacing: 0.01em;
  line-height: 1.05;
  text-transform: uppercase;
}

.roster-card__stats {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0.5rem;
  margin: 0 1.35rem;
  border: 0;
  background: transparent;
}

.roster-card__stats div {
  position: relative;
  min-width: 0;
  overflow: hidden;
  padding: 0.75rem 0.72rem 0.78rem;
  border: 1px solid rgba(12, 37, 48, 0.13);
  background: linear-gradient(180deg, #fffdf8 0%, #f4f1ea 100%);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.9);
}

.roster-card__stats div::before {
  content: "";
  position: absolute;
  top: 0;
  right: 0;
  left: 0;
  height: 3px;
  background: rgba(168, 78, 22, 0.86);
}

.roster-card__stats div:nth-child(2)::before {
  background: rgba(24, 112, 112, 0.82);
}

.roster-card__stats div:nth-child(3)::before {
  background: rgba(12, 37, 48, 0.64);
}

.roster-card__stats dt {
  margin: 0 0 0.25rem;
  color: #58686f;
  font-family: 'Bricolage Grotesque', system-ui, sans-serif;
  font-size: 0.58rem;
  font-weight: 800;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}

.roster-card__stats dd {
  margin: 0;
  color: var(--mlcl-ink);
  font-family: 'Bricolage Grotesque', system-ui, sans-serif;
  font-size: 1.28rem;
  font-weight: 900;
  line-height: 1;
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}

.roster-card__players,
.roster-card__note {
  padding: 0 1.35rem;
}

.roster-card__note {
  margin-top: auto;
  padding-bottom: 1.35rem;
}

.roster-card__players h4,
.roster-card__note h4 {
  margin: 0 0 0.55rem;
  color: var(--mlcl-teal-ink);
  font-family: 'Bricolage Grotesque', system-ui, sans-serif;
  font-size: 0.66rem;
  font-weight: 900;
  letter-spacing: 0.14em;
  text-transform: uppercase;
}

.roster-card__player-list {
  display: grid;
  gap: 0.45rem;
}

.roster-card__player {
  display: grid;
  grid-template-columns: 34px 1fr;
  gap: 0.65rem;
  align-items: center;
  padding: 0.52rem 0;
  border-bottom: 1px dashed rgba(12, 37, 48, 0.18);
}

.roster-card__player:last-child {
  border-bottom: 0;
}

.roster-card__avatar {
  display: inline-flex;
  width: 34px;
  height: 34px;
  align-items: center;
  justify-content: center;
  border: 1px solid rgba(12, 37, 48, 0.18);
  background: #e7eee9;
  color: var(--mlcl-teal-ink);
  font-family: 'Bricolage Grotesque', system-ui, sans-serif;
  font-size: 0.72rem;
  font-weight: 900;
}

.roster-card__player-name,
.roster-card__empty,
.roster-card__note p {
  color: #27353d;
  font-size: 0.88rem;
  line-height: 1.45;
}

.roster-card__player-name {
  font-family: 'Bricolage Grotesque', system-ui, sans-serif;
  font-weight: 750;
  text-transform: uppercase;
}

.roster-card__empty,
.roster-card__note p {
  margin: 0;
}
/* Standings table: horizontal-scroll affordance so all five columns
   (Rank, Team, W-L, Points, Diff) are reachable on narrow screens.
   The container is always overflow-x:auto; at desktop it is a no-op because
   the table fits. A right-edge fade hints the table is scrollable. */
.mlcl-table-scroll {
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  /* Right-edge fade: indicates more content scrolls into view. */
  background:
    linear-gradient(to right, transparent 85%, rgba(244, 241, 234, 0.9) 100%),
    linear-gradient(to right, var(--mlcl-bg-2, #fff), var(--mlcl-bg-2, #fff));
  background-repeat: no-repeat;
  background-size: 100% 100%, 100% 100%;
  background-attachment: local, scroll;
}
.mlcl-table-scroll:focus-visible,
.mlcl-bkt-side:focus-visible,
.table-scroll:focus-visible {
  outline: 3px solid var(--mlcl-teal-ink);
  outline-offset: 3px;
}
.mlcl-standings .mlcl-table-scroll table {
  /* Enough width so the five columns never crush; the container scrolls when
     the viewport is narrower (e.g. 375px). At desktop the table fits within
     the 900px max-width of .mlcl-standings and this min-width is a no-op. */
  min-width: 480px;
}

/* ---- Championship bracket (double-elimination) ----
   Rendered above the final standings tables in championship phase. Dark match
   cards on the cream standings page; winner row bold with an orange edge marker
   and teal score. Each side (upper/lower) is a horizontally-scrolling row of round
   columns; collapses to a vertical stack at <=560px. */
.mlcl-brackets { display: flex; flex-direction: column; gap: 3.25rem; margin: 0 0 3.5rem; }
.mlcl-bracket__head { display: flex; align-items: center; gap: 0.9rem; margin-bottom: 1.5rem; flex-wrap: wrap; }
.mlcl-bracket__head .lead-accent { width: 5px; align-self: stretch; min-height: 1.8rem; background: var(--mlcl-orange); border-radius: 2px; }
.mlcl-bracket__title { font-family: 'Bricolage Grotesque', system-ui, sans-serif; font-weight: 800; font-size: 1.6rem; text-transform: uppercase; letter-spacing: -0.01em; color: var(--mlcl-ink); margin: 0; }
.mlcl-bracket__count { font-size: 0.7rem; text-transform: uppercase; letter-spacing: 0.1em; color: var(--mlcl-ink-mute); font-weight: 700; }
.mlcl-bracket__champ { margin-left: auto; display: inline-flex; align-items: baseline; gap: 0.5rem; background: var(--mlcl-orange); color: #241003; font-weight: 800; font-size: 0.9rem; padding: 0.4rem 0.95rem; text-transform: uppercase; letter-spacing: 0.03em; }
.mlcl-bracket__champ-label { font-size: 0.62rem; opacity: 0.75; letter-spacing: 0.12em; }
.mlcl-bracket__scroll { display: flex; flex-direction: column; gap: 2rem; }
.mlcl-bkt-side { overflow-x: auto; -webkit-overflow-scrolling: touch; padding-bottom: 0.4rem; }
.mlcl-bkt-side__label { font-size: 0.66rem; text-transform: uppercase; letter-spacing: 0.16em; color: var(--mlcl-teal-ink); font-weight: 800; margin-bottom: 0.75rem; }
.mlcl-bkt-rounds { display: flex; gap: 1.25rem; align-items: stretch; min-width: max-content; }
.mlcl-bkt-round { display: flex; flex-direction: column; min-width: 200px; }
.mlcl-bkt-round__name { font-size: 0.6rem; text-transform: uppercase; letter-spacing: 0.12em; color: var(--mlcl-ink-mute); font-weight: 700; margin-bottom: 0.6rem; }
.mlcl-bkt-round__matches { display: flex; flex-direction: column; justify-content: space-around; gap: 0.9rem; flex: 1; }
.mlcl-bkt-match { position: relative; background: #0c2530; border: 1px solid rgba(255, 255, 255, 0.1); }
.mlcl-bkt-round:not(:last-child) .mlcl-bkt-match::after,
.mlcl-bkt-round:not(:first-child) .mlcl-bkt-match::before {
  content: "";
  position: absolute;
  top: 50%;
  width: 1.25rem;
  border-top: 2px solid rgba(19, 70, 84, 0.68);
}
.mlcl-bkt-round:not(:last-child) .mlcl-bkt-match::after {
  right: -1.25rem;
}
.mlcl-bkt-round:not(:first-child) .mlcl-bkt-match::before {
  left: -1.25rem;
}
.mlcl-bkt-round:not(:first-child) {
  background: linear-gradient(90deg, rgba(19, 70, 84, 0.5), rgba(19, 70, 84, 0.5)) left calc(50% + 0.9rem) / 2px calc(100% - 2.35rem) no-repeat;
}
.mlcl-bkt-row { display: grid; grid-template-columns: 1.4rem 1fr auto; align-items: center; gap: 0.5rem; padding: 0.45rem 0.7rem; }
.mlcl-bkt-row + .mlcl-bkt-row { border-top: 1px solid rgba(255, 255, 255, 0.08); }
.mlcl-bkt-seed { font-size: 0.66rem; color: #8ea8b2; font-variant-numeric: tabular-nums; text-align: center; }
.mlcl-bkt-team { font-size: 0.82rem; color: #cdd9dd; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.mlcl-bkt-score { font-size: 0.85rem; font-weight: 700; color: #8aa0a8; font-variant-numeric: tabular-nums; min-width: 1.4rem; text-align: right; }
.mlcl-bkt-row--win { box-shadow: inset 3px 0 0 var(--mlcl-orange); }
.mlcl-bkt-row--win .mlcl-bkt-team { color: #f4f1ea; font-weight: 700; }
.mlcl-bkt-row--win .mlcl-bkt-score { color: var(--mlcl-teal); }
.mlcl-bkt-final { align-self: center; text-align: center; padding: 0.5rem 0; }
.mlcl-bkt-final__name { font-size: 0.64rem; text-transform: uppercase; letter-spacing: 0.14em; color: var(--mlcl-accent-ink); font-weight: 800; margin-bottom: 0.5rem; }
.mlcl-bkt-match--final { border: 2px solid var(--mlcl-orange); min-width: 230px; text-align: left; }
.mlcl-bkt-match--final .mlcl-bkt-row { padding: 0.6rem 0.85rem; }
@media (max-width: 560px) {
  .mlcl-bkt-rounds { flex-direction: column; min-width: 0; gap: 0.9rem; }
  .mlcl-bkt-round { position: relative; min-width: 0; padding-left: 0.85rem; }
  .mlcl-bkt-round::before {
    content: "";
    position: absolute;
    left: 0.15rem;
    top: 1.55rem;
    bottom: 0.2rem;
    width: 2px;
    background: linear-gradient(180deg, var(--mlcl-orange), rgba(19, 70, 84, 0.58));
  }
  .mlcl-bkt-round__name {
    position: relative;
  }
  .mlcl-bkt-round__name::before {
    content: "";
    position: absolute;
    left: -0.86rem;
    top: 50%;
    width: 0.46rem;
    border-top: 2px solid var(--mlcl-orange);
  }
  .mlcl-bkt-round:not(:first-child) { background: none; }
  .mlcl-bkt-round:not(:last-child) .mlcl-bkt-match::after,
  .mlcl-bkt-round:not(:first-child) .mlcl-bkt-match::before { display: none; }
  .mlcl-bkt-side { overflow-x: visible; }
}

/* ---- Roster card auto-badge (teams have no uploaded logos) ----
   A two-letter monogram chip leads each card; orange for A bracket, teal for B,
   neutral ink in the regular season (no bracket). */
.flip-card-head { display: flex; align-items: center; gap: 0.8rem; margin-bottom: 0.85rem; }
.flip-card-head__text { min-width: 0; }
.flip-card-head .eyebrow { margin-bottom: 0.15rem; }
.flip-card-head .flip-team-name { margin: 0; }
.roster-badge {
  flex: none;
  width: 46px;
  height: 46px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-family: 'Bricolage Grotesque', system-ui, sans-serif;
  font-weight: 800;
  letter-spacing: 0.01em;
  color: #f4f1ea;
  background: #1a4252;
  border-radius: 7px;
  font-size: 0.95rem;
}
.roster-badge--a { background: var(--mlcl-orange); color: #241003; }
.roster-badge--b { background: var(--mlcl-teal-ink); color: #f4f1ea; }

/* ---- Rosters: bracket section headers (A/B grouping) ---- */
.roster-bracket-head {
  font-family: 'Bricolage Grotesque', system-ui, sans-serif;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  font-size: 1.5rem;
  color: var(--mlcl-ink);
  margin: 2.75rem 0 1.25rem;
  padding-bottom: 0.5rem;
  border-bottom: 2px solid var(--mlcl-line-strong);
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 1rem;
}
/* SPA pages: heads are direct siblings, so :first-of-type tightens only the A head. */
.roster-bracket-head:first-of-type { margin-top: 0.5rem; }

/* Converted block page: each head sits in its own .roster-bracket-group wrapper, and
   .standings-toolbar is also a div before them, so neither group is :first-of-type.
   Give every group head the reduced top gap by default, then restore the larger
   2.75rem gap on any group that FOLLOWS another group (the B bracket and beyond) via
   the adjacent-sibling combinator. This keeps the A grid tight to its heading while
   separating the A grid from the B section, matching the pre-block SPA spacing.

   Scoped under .entry-content .mlcl-rosters with the .roster-bracket-group chain so
   they out-specify the generic .mlcl-site:not(.mlcl-app-active) .entry-content h2
   rule (3 classes + 1 element, declared later in this file) that otherwise forces
   both heads to 2.5rem on the converted page. The B (later-group) rule carries one
   more class than the A (any-group) rule so it wins on the B head. */
.entry-content .mlcl-rosters .roster-bracket-group h2.roster-bracket-head { margin-top: 0.5rem; }
.entry-content .mlcl-rosters .roster-bracket-group + .roster-bracket-group .roster-bracket-head { margin-top: 2.75rem; }
.roster-bracket-head span {
  font-size: 0.7rem;
  letter-spacing: 0.16em;
  color: var(--mlcl-teal-ink);
  font-weight: 700;
}

/* ---- Home standings teaser: phase-aware bracket tables ---- */

/* Regular season: single table, centered at a comfortable width */
.teaser-tables {
  max-width: 720px;
  margin: 0 auto;
}

/* Playoff mode: A and B bracket side-by-side, each in its own column */
.teaser-tables--split {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1.75rem;
  align-items: start;
  max-width: none;
  margin: 0;
}
.teaser-bracket-col { min-width: 0; }
.teaser-bracket-head {
  font-family: 'Bricolage Grotesque', system-ui, sans-serif;
  font-weight: 700;
  font-size: 0.72rem;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--mlcl-teal-ink);
  margin: 0 0 0.6rem;
}
/* Horizontal scroll container for the home mini standings table (bracket-leaders). */
.table-scroll {
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}
.teaser-bracket-col .table-scroll { margin: 0; }

/* Stack the two bracket tables on tablet and below for readability */
@media (max-width: 900px) {
  .teaser-tables--split { grid-template-columns: 1fr; gap: 2.25rem; }
}

/* Keep the segmented filter row usable on small screens (no overflow) */
@media (max-width: 560px) {
  .standings-toolbar .tab-row {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    max-width: 100%;
  }
  .standings-toolbar .tab-row button { white-space: nowrap; }
  .mlcl-rosters [data-roster-count] { margin-left: 0; }
  .roster-phase-pill {
    width: 100%;
    justify-content: center;
    order: 3;
  }
  .roster-bracket-head { font-size: 1.25rem; }
}
.flip-hint {
  /* Footer pinned to the card's bottom border: a full-width strip with a divider
     line on top, centered hint text. */
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  padding: 0.55rem 1.5rem;
  border-top: 1px solid var(--mlcl-line);
  font-family: 'Bricolage Grotesque', system-ui, sans-serif;
  font-weight: 700;
  font-size: 0.6rem;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--mlcl-ink-dim);
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.3rem;
}

/* ---- Rosters on the converted (block) page: contrast (WCAG AA) ----
   The converted /rosters/ page runs the dark-theme tokens on a cream body, which
   creates two readability problems the rules below correct:
   1. The flip cards keep their dark surface, but the generic
      .mlcl-site:not(.mlcl-app-active) .entry-content {color} + h3/h4 rules darken
      page prose, bleeding dark-on-dark into the cards. Re-assert bright card text
      (and restore the cards' own heading margins the generic h3/h4 rules clobber).
      Higher specificity beats the generic .entry-content rules; SPA pages have no
      .entry-content, so they are untouched.
   2. The toolbar controls sit on the cream page, but .btn-ghost / .pill / .tab-row
      carry the dark-theme bright token colors, which wash out on cream. Give them
      dark ink, on the converted page only. */
.entry-content .mlcl-rosters .flip-face,
.entry-content .mlcl-rosters .flip-face .player-name { color: var(--mlcl-ink); }
.entry-content .mlcl-rosters .flip-face h3.flip-team-name { color: var(--mlcl-ink); margin: 0 0 1.2rem; }
/* .flip-face.flip-back compound keeps this above the generic .entry-content h4 (0,3,1) tie. */
.entry-content .mlcl-rosters .flip-face.flip-back h4 { color: var(--mlcl-teal-ink); margin: 0 0 0.6rem; }
.entry-content .mlcl-rosters .flip-face .flip-fs-lbl,
.entry-content .mlcl-rosters .flip-face .flip-hint { color: var(--mlcl-ink-dim); }

.entry-content .mlcl-rosters .tab-row button { color: #27353d; }
.entry-content .mlcl-rosters .tab-row button.active { color: #0c2530; }
/* Bracket-head team count sits on the cream page; bright teal washes out there. */
.entry-content .mlcl-rosters .roster-bracket-head span { color: #187070; }
.entry-content .mlcl-rosters .standings-toolbar .pill { color: #187070; border-color: rgba(24, 112, 112, 0.45); }
.entry-content .mlcl-rosters .standings-toolbar .btn-ghost { color: #27353d; border-color: rgba(12, 37, 48, 0.32); }
.entry-content .mlcl-rosters .standings-toolbar .btn-ghost:hover { color: #a84e16; border-color: #a84e16; }

/* ---- Converted Home (front page) on the cream/white body: contrast (WCAG AA) ----
   The Home page is now native prose + 10 custom blocks. The blocks paint their own
   dark sections (hero, season-card, league-info, schedule) and bright sections
   (scoring-hero, court-diagram, faq, season-callout) while sitting inside the same
   .entry-content cascade that powers blog posts. The generic .entry-content {color}
   + h2/h3/h4 rules (specificity 0,3,1) bleed dark ink into dark blocks and bright
   tokens into bright blocks. Re-assert the block-intended colors with a 4th class
   on every rule (block-hook + element-class) so we BEAT the generic rule on
   specificity rather than tying and losing on source order. SPA pages have no
   .entry-content, so they are untouched. Retires with the SPA in Phase 7. */

/* Hero section: dark band, bright text. Don't target .hero-title span -- that
 * would beat the existing .hero-title .accent (orange) and .underline-mark
 * rules on specificity and silently wash out the "Cornhole" accent + the
 * "League." underline mark. Unclassed spans inherit cream from .hero-title. */
.entry-content .hero[data-mlcl-hero] .hero-title,
.entry-content .hero[data-mlcl-hero] .hero-sub,
.entry-content .hero[data-mlcl-hero] .hero-eyebrow,
.entry-content .hero[data-mlcl-hero] .hero-stat-label,
.entry-content .hero[data-mlcl-hero] .hero-stat-value { color: var(--mlcl-ink); }
.entry-content .hero[data-mlcl-hero] .hero-stat-label { color: var(--mlcl-ink-dim); }
.entry-content .hero[data-mlcl-hero] .hero-bg-grid {
  opacity: 0.28;
  mask-image: radial-gradient(ellipse at 72% 48%, rgba(0,0,0,0.68), transparent 72%);
}
.entry-content .hero[data-mlcl-hero] .hero-board-bg {
  inset: -28% -14% -28% 18%;
  opacity: 0.1;
}
.entry-content .hero[data-mlcl-hero]::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 6px;
  z-index: 2;
  background: linear-gradient(90deg, var(--mlcl-orange) 0 33%, var(--mlcl-teal) 33% 66%, var(--mlcl-orange) 66% 100%);
  pointer-events: none;
}
.entry-content .hero[data-mlcl-hero] .hero-stripe {
  top: auto !important;
  right: 0;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 6px;
  z-index: 2;
  background: linear-gradient(90deg, var(--mlcl-orange) 0 33%, var(--mlcl-teal) 33% 66%, var(--mlcl-orange) 66% 100%);
  opacity: 1;
}
.entry-content .hero[data-mlcl-hero] .hero-bag {
  display: none;
}
.entry-content .hero[data-mlcl-hero] a.btn,
.entry-content .hero[data-mlcl-hero] a.btn:hover {
  text-decoration: none;
}
.entry-content .hero[data-mlcl-hero] .btn.btn-primary {
  background: #ff8b48;
  border-color: #f4f1ea;
  color: #0c2530;
  box-shadow: 0 8px 0 rgba(0, 0, 0, 0.22);
}
.entry-content .hero[data-mlcl-hero] .btn.btn-primary:hover {
  background: #ffa66e;
  color: #0c2530;
}
.entry-content .hero[data-mlcl-hero] .btn.btn-ghost {
  background: rgba(244, 241, 234, 0.08);
  color: #f4f1ea;
  border-color: rgba(244, 241, 234, 0.7);
}
.entry-content .hero[data-mlcl-hero] .btn.btn-ghost:hover {
  background: #f4f1ea;
  color: #0c2530;
  border-color: #f4f1ea;
}

/* Signup aside callout box: soft cream-tinted info block on non-app pages. */
.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-signup-aside {
  position: relative;
  overflow: hidden;
  padding: clamp(1.15rem, 2.4vw, 1.65rem);
  border: 1px solid rgba(244, 241, 234, 0.14);
  background:
    linear-gradient(135deg, rgba(255, 139, 72, 0.14), transparent 38%),
    #0c2530;
  color: #f4f1ea;
  box-shadow: 0 18px 40px rgba(12, 37, 48, 0.16);
}

.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-signup-layout {
  display: grid;
  grid-template-columns: minmax(250px, 0.62fr) minmax(0, 1.38fr);
  gap: clamp(1rem, 3vw, 2rem);
  align-items: start;
  margin-top: 0;
}

.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-signup-aside h2,
.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-form-card > h2,
.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-sponsor-checkout > h2 {
  margin-top: 0;
}

.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-signup-aside h2 {
  color: #f4f1ea;
  padding-bottom: 0.85rem;
  border-bottom: 1px solid rgba(244, 241, 234, 0.18);
}

.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-signup-aside p {
  margin: 0;
  padding: 0.95rem 0;
  color: rgba(244, 241, 234, 0.84);
  line-height: 1.55;
  border-bottom: 1px solid rgba(244, 241, 234, 0.12);
}

.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-signup-aside p:last-child {
  padding-bottom: 0;
  border-bottom: 0;
}

.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-signup-aside strong {
  display: block;
  margin-bottom: 0.18rem;
  color: #ffb181;
  font-family: 'Bricolage Grotesque', system-ui, sans-serif;
  font-size: 0.72rem;
  font-weight: 900;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}

.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-form-card {
  position: relative;
  overflow: hidden;
  padding: clamp(1.2rem, 3vw, 2rem);
  border: 1px solid rgba(12, 37, 48, 0.16);
  background: #fffdf8;
  box-shadow: 0 18px 42px rgba(12, 37, 48, 0.1);
}
.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-form-card::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 6px;
  background: linear-gradient(90deg, var(--mlcl-orange) 0 38%, var(--mlcl-teal) 38% 68%, var(--mlcl-orange) 68% 100%);
}

.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-form-card .gform_wrapper,
.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-sponsor-checkout .gform_wrapper {
  margin-top: 1.25rem;
}

.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-form-card .gform_heading,
.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-sponsor-checkout .gform_heading {
  display: none;
}

.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-form-card .gform_fields,
.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-sponsor-checkout .gform_fields {
  gap: 0.9rem;
}

.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-form-card .gfield,
.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-sponsor-checkout .gfield {
  position: relative;
  padding: 0.95rem;
  border: 1px solid rgba(12, 37, 48, 0.11);
  background: rgba(255, 253, 248, 0.76);
}

.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-form-card .gsection,
.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-sponsor-checkout .gsection {
  margin-top: 0.75rem;
  padding: 0.9rem 1rem;
  border: 1px solid rgba(12, 37, 48, 0.95);
  border-top: 3px solid var(--mlcl-orange);
  background: #0c2530;
}

.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-form-card .gsection:first-child,
.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-sponsor-checkout .gsection:first-child {
  margin-top: 0;
}

.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-form-card .gsection_title,
.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-sponsor-checkout .gsection_title {
  margin: 0;
  color: #f4f1ea;
  font-family: 'Bricolage Grotesque', system-ui, sans-serif;
  font-size: 0.9rem;
  font-weight: 900;
  letter-spacing: 0.03em;
  line-height: 1.2;
  text-transform: uppercase;
}

.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-form-card .gfield_label,
.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-sponsor-checkout .gfield_label,
.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-form-card legend,
.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-sponsor-checkout legend {
  color: var(--mlcl-ink);
  font-family: 'Bricolage Grotesque', system-ui, sans-serif;
  font-size: 0.76rem;
  font-weight: 850;
  letter-spacing: 0.08em;
  line-height: 1.25;
  text-transform: uppercase;
}

.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-form-card input[type="text"],
.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-form-card input[type="email"],
.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-form-card input[type="tel"],
.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-form-card input[type="number"],
.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-form-card select,
.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-form-card textarea,
.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-sponsor-checkout input[type="text"],
.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-sponsor-checkout input[type="email"],
.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-sponsor-checkout input[type="tel"],
.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-sponsor-checkout input[type="number"],
.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-sponsor-checkout select,
.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-sponsor-checkout textarea {
  width: 100%;
  min-height: 46px;
  border: 1px solid rgba(12, 37, 48, 0.22);
  background: #fffdf8;
  color: var(--mlcl-ink);
  font: inherit;
  padding-inline: 0.8rem;
  box-shadow: inset 0 1px 0 rgba(12, 37, 48, 0.04);
  transition: border-color 0.16s ease, box-shadow 0.16s ease, outline-color 0.16s ease;
}

/* Selects share the text inputs' rhythm exactly: same 46px field, same
   0.8rem left inset, value vertically centered. appearance:none drops the
   UA baseline quirk that floated the value high in the tall field, so an
   inline chevron (the light-theme --mlcl-ink, #0c2530) replaces the native
   arrow, with right padding so long values never collide with it. The
   native option list stays native. */
.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-form-card select,
.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-sponsor-checkout select {
  appearance: none;
  -webkit-appearance: none;
  height: 46px;
  padding-block: 0;
  padding-right: 2.4rem;
  line-height: 44px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1.5l5 5 5-5' fill='none' stroke='%230c2530' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 0.8rem center;
  background-size: 12px 8px;
}

.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-form-card input:focus,
.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-form-card select:focus,
.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-form-card textarea:focus,
.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-sponsor-checkout input:focus,
.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-sponsor-checkout select:focus,
.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-sponsor-checkout textarea:focus {
  border-color: var(--mlcl-orange);
  box-shadow: 0 0 0 3px rgba(255, 139, 72, 0.16);
  outline: 2px solid rgba(255, 139, 72, 0.28);
  outline-offset: 1px;
}

.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-form-card .gchoice,
.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-sponsor-checkout .gchoice {
  display: flex;
  gap: 0.5rem;
  align-items: center;
  min-height: 48px;
  padding: 0.58rem 0.8rem;
  border: 1px solid rgba(12, 37, 48, 0.12);
  background: rgba(244, 241, 234, 0.48);
  transition: background-color 0.16s ease, border-color 0.16s ease, box-shadow 0.16s ease;
}

.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-form-card .gchoice:has(input:checked),
.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-sponsor-checkout .gchoice:has(input:checked) {
  border-color: rgba(168, 78, 22, 0.48);
  background: rgba(255, 139, 72, 0.13);
  box-shadow: inset 4px 0 0 var(--mlcl-orange);
}

.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-form-card .gchoice input,
.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-sponsor-checkout .gchoice input {
  accent-color: var(--mlcl-orange);
}

.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-form-card .gfield_description,
.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-sponsor-checkout .gfield_description {
  color: var(--mlcl-ink-dim);
  font-size: 0.82rem;
  line-height: 1.5;
}

.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-form-card .gform_button,
.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-sponsor-checkout .gform_button {
  min-height: 48px;
  border: 1px solid #0c2530;
  background: var(--mlcl-orange);
  color: #0c2530;
  font-family: 'Bricolage Grotesque', system-ui, sans-serif;
  font-weight: 900;
  letter-spacing: 0.06em;
  padding: 0.78rem 1.2rem;
  text-transform: uppercase;
}

.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-form-card .gfield_choice_all_toggle,
.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-sponsor-checkout .gfield_choice_all_toggle {
  min-height: 36px !important;
  border: 1px solid #0c2530 !important;
  background: #fffdf8 !important;
  color: #0c2530 !important;
  font-family: 'Bricolage Grotesque', system-ui, sans-serif !important;
  font-size: 0.72rem !important;
  font-weight: 900 !important;
  letter-spacing: 0.08em !important;
  padding: 0.5rem 0.75rem !important;
  text-transform: uppercase !important;
}

.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-form-card .gfield_choice_all_toggle:hover,
.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-sponsor-checkout .gfield_choice_all_toggle:hover {
  background: var(--mlcl-orange) !important;
}

.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-form-card input[type="submit"].gform_button,
.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-sponsor-checkout input[type="submit"].gform_button,
.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-form-card .gform_footer input.button,
.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-sponsor-checkout .gform_footer input.button {
  display: inline-flex;
  min-width: 9rem;
  min-height: 48px;
  align-items: center;
  justify-content: center;
  padding: 0.8rem 1.25rem;
  border: 1px solid #0c2530;
  background: var(--mlcl-orange);
  color: #0c2530;
  font-family: 'Bricolage Grotesque', system-ui, sans-serif;
  font-size: 0.78rem;
  font-weight: 900;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

@media (max-width: 820px) {
  .mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-signup-layout {
    grid-template-columns: 1fr;
  }
}

/* Season callout (orange ribbon): dark ink on orange. Rust-ink reads weak on orange. */
.entry-content .announce-ribbon[data-mlcl-season-callout] .announce-ribbon-cta { color: #0c2530; }
.entry-content .announce-ribbon[data-mlcl-season-callout] .announce-ribbon-cta:hover { color: #134654; }

/* Season card (next-season-block, dark section): keep bright text. */
.entry-content .next-season-block[data-mlcl-season-card] h2.next-season-title,
.entry-content .next-season-block[data-mlcl-season-card] .next-season-title,
.entry-content .next-season-block[data-mlcl-season-card] .next-season-blurb,
.entry-content .next-season-block[data-mlcl-season-card] .eyebrow,
.entry-content .next-season-block[data-mlcl-season-card] .summer-card-head h3,
.entry-content .next-season-block[data-mlcl-season-card] .summer-week,
.entry-content .next-season-block[data-mlcl-season-card] .summer-week .wk,
.entry-content .next-season-block[data-mlcl-season-card] .summer-week .day,
.entry-content .next-season-block[data-mlcl-season-card] .summer-week .mo,
.entry-content .next-season-block[data-mlcl-season-card] .summer-card-foot,
.entry-content .next-season-block[data-mlcl-season-card] .summer-card-foot span { color: var(--mlcl-ink); }
.entry-content .next-season-block[data-mlcl-season-card] .summer-week .mo,
.entry-content .next-season-block[data-mlcl-season-card] .summer-card-foot .deadline { color: var(--mlcl-ink-dim); }
/* Playoffs chip: same scope wins over the generic .summer-card-foot span ink rule
   above so the rust phase color survives. Reads as the distinct playoff phase, the
   bridge into the championship. */
.entry-content .next-season-block[data-mlcl-season-card] .summer-card-foot .summer-card-foot__playoffs { color: var(--mlcl-accent-ink); }
.entry-content .next-season-block[data-mlcl-season-card] .summer-week.first,
.entry-content .next-season-block[data-mlcl-season-card] .summer-week.first .wk,
.entry-content .next-season-block[data-mlcl-season-card] .summer-week.first .day,
.entry-content .next-season-block[data-mlcl-season-card] .summer-week.first .mo {
  color: #0c2530;
  opacity: 1;
}
.entry-content .next-season-block[data-mlcl-season-card] .next-season-bg {
  inset: -18% -16% -24%;
  background:
    linear-gradient(
      84deg,
      transparent 0 31%,
      rgba(19, 70, 84, 0.68) 31% 42%,
      rgba(255, 139, 72, 0.64) 42% 59%,
      rgba(19, 70, 84, 0.68) 59% 70%,
      transparent 70% 100%
    );
  opacity: 0.16;
}
.entry-content .next-season-block[data-mlcl-season-card] .next-season-grid {
  position: relative;
  z-index: 2;
}
.entry-content .next-season-block[data-mlcl-season-card] .btn.btn-primary {
  background: #ff8b48;
  border-color: #0c2530;
  color: #0c2530;
  box-shadow: 0 7px 0 rgba(12, 37, 48, 0.22);
  text-decoration: none;
}
.entry-content .next-season-block[data-mlcl-season-card] .btn.btn-primary:hover { background: #ffa66e; }
.entry-content .next-season-block[data-mlcl-season-card] .btn.btn-ghost {
  background: #0c2530;
  border-color: #0c2530;
  color: #f4f1ea;
  text-decoration: none;
}
.entry-content .next-season-block[data-mlcl-season-card] .btn.btn-ghost:hover {
  background: #134654;
  border-color: #134654;
  color: #f4f1ea;
}

/* League info owns a full-bleed light sub-band inside the broader home section. */
body.mlcl-broadcast .entry-content .section[data-mlcl-league-info] {
  width: 100vw;
  max-width: 100vw;
  margin-left: calc(50% - 50vw) !important;
  margin-right: calc(50% - 50vw) !important;
  padding-left: 2rem;
  padding-right: 2rem;
  background: var(--mlcl-bg-2);
}
.entry-content .section[data-mlcl-league-info] h2,
.entry-content .section[data-mlcl-league-info] .eyebrow,
.entry-content .section[data-mlcl-league-info] .info-tile-value { color: var(--mlcl-ink); }
.entry-content .section[data-mlcl-league-info] .info-tile-value .info-tile-suffix {
  color: var(--mlcl-accent-ink);
  font-size: 1rem;
  margin-left: 0.3rem;
}
.entry-content .section[data-mlcl-league-info] .info-tile-sub { color: var(--mlcl-ink-dim); }

/* Schedule (dark section): bright headings + week-tile content. The .current
   tile is the orange "this week" pill; on the bright #ff8b48 fill, cream text
   fails AA (2.06). Swap to dark ink for the current tile only. */
.entry-content .section[data-mlcl-schedule] h2,
.entry-content .section[data-mlcl-schedule] .eyebrow,
.entry-content .section[data-mlcl-schedule] .week-tile .week-num,
.entry-content .section[data-mlcl-schedule] .week-tile .week-date,
.entry-content .section[data-mlcl-schedule] .week-tile .week-month,
.entry-content .section[data-mlcl-schedule] .week-tile .week-stage { color: var(--mlcl-ink); }
.entry-content .section[data-mlcl-schedule] .week-tile.past .week-num,
.entry-content .section[data-mlcl-schedule] .week-tile.past .week-date,
.entry-content .section[data-mlcl-schedule] .week-tile.past .week-month,
.entry-content .section[data-mlcl-schedule] .week-tile.past .week-stage { color: var(--mlcl-ink-dim); }
.entry-content .section[data-mlcl-schedule] .week-tile.current .week-num,
.entry-content .section[data-mlcl-schedule] .week-tile.current .week-date,
.entry-content .section[data-mlcl-schedule] .week-tile.current .week-month,
.entry-content .section[data-mlcl-schedule] .week-tile.current .week-stage { color: #0c2530; }

/* Scoring tiles (cream tiles on cream page): use dark ink for tile content. */
.entry-content .scoring-hero[data-mlcl-scoring-tiles] .scoring-hero-title,
.entry-content .scoring-hero[data-mlcl-scoring-tiles] .score-key-pts,
.entry-content .scoring-hero[data-mlcl-scoring-tiles] .score-key-label { color: #0c2530; }
.entry-content .scoring-hero[data-mlcl-scoring-tiles] .score-key-pts { color: #a84e16; }
.entry-content .scoring-hero[data-mlcl-scoring-tiles] .score-cancel-note-label { color: #187070; }
.entry-content .scoring-hero[data-mlcl-scoring-tiles] .score-cancel-note,
.entry-content .scoring-hero[data-mlcl-scoring-tiles] .score-cancel-note p,
.entry-content .scoring-hero[data-mlcl-scoring-tiles] .score-cancel-note span { color: #27353d; }

/* Court diagram (decorative): the court-num pip needs a dark ink-on-cream tone
   so the lane labels remain legible when the diagram sits on the white column. */
.entry-content .map-vis--courts[data-mlcl-court-diagram] .map-court-num { color: #0c2530; }

/* FAQ accordion: enhancer renders .faq-q buttons + .faq-q-num tags inside the
   .mlcl-faq wrapper on the white inside-article. Generic .entry-content {color:#27353d}
   was inheriting through; pin question text to dark ink and Q.NN tag to rust. */
.entry-content .mlcl-faq[data-mlcl-faq] .faq-q { color: #0c2530; }
.entry-content .mlcl-faq[data-mlcl-faq] .faq-q-num { color: #a84e16; }
.entry-content .mlcl-faq[data-mlcl-faq] .faq-a,
.entry-content .mlcl-faq[data-mlcl-faq] .faq-a p { color: #27353d; }
/* Hover override must out-specify the color pin above (0,3,1) on the homepage. */
.entry-content .mlcl-faq[data-mlcl-faq] .faq-q:hover { color: var(--mlcl-accent-ink); }

/* Bracket leaders A/B head sits on cream/white; keep the warm teal-ink display.
   The block emits <h3 class="teaser-bracket-head">; the generic prefixed
   .mlcl-site:not(.mlcl-app-active) .entry-content h3 rule is (0,3,1). We match
   its left-prefix and add .mlcl-bracket-leaders + .teaser-bracket-head, landing
   the override at (0,5,1) -- wins on class count, no source-order dependency. */
.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-bracket-leaders h3.teaser-bracket-head,
.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-bracket-leaders .teaser-bracket-head { color: #134654; }

/* ============================================================
   Home Spring recap: the finished-season final placements. Polished to the
   Record Book hub look (navy headers, champion emphasis, orange/navy palette)
   while reading as a secondary recap below the Summer 2026 promotion. Scoped to
   the placements variant inside the home season hub so live standings teasers
   elsewhere are untouched.
   ============================================================ */
.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-home-season-hub .mlcl-bracket-leaders {
  margin: 0.5rem 0 0;
}
/* Bracket label becomes a navy banner with the orange lead bar (echoes the
   "Spring 2026 final standings" badge above it). */
.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-home-season-hub .mlcl-bracket-leaders h3.teaser-bracket-head,
.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-home-season-hub .mlcl-bracket-leaders .teaser-bracket-head {
  display: block;
  background: #0c2530;
  color: #f4f1ea;
  box-shadow: inset 5px 0 0 var(--mlcl-orange);
  padding: 0.5rem 0.8rem;
  margin: 0 0 0;
  font-size: 0.74rem;
  letter-spacing: 0.14em;
}
/* Placement card: lift the table onto its own surface with a hairline frame. */
.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-home-season-hub .mlcl-bracket-leaders .teaser-bracket-col .table-scroll {
  border: 1px solid var(--mlcl-line);
  border-top: none;
  background: #fff;
}
.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-home-season-hub .standings-mini--placements {
  background: transparent;
}
.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-home-season-hub .standings-mini--placements th {
  background: #f7f4ec;
  color: var(--mlcl-ink-mute);
  border-bottom: 1px solid var(--mlcl-line-strong);
  padding: 0.6rem 0.7rem;
}
.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-home-season-hub .standings-mini--placements td {
  padding: 0.7rem;
}
/* Champion row: a warm gold-leaf highlight with the orange lead bar. */
.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-home-season-hub .standings-mini--placements tr.row-hot td {
  background: rgba(255, 139, 72, 0.12);
}
.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-home-season-hub .standings-mini--placements tr.row-hot .team-name {
  color: var(--mlcl-accent-ink);
}
/* Seed badge: a small navy chip in the seed column. */
.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-home-season-hub .standings-mini--placements td.num {
  font-size: 0.9rem;
  font-weight: 800;
  color: var(--mlcl-teal-ink);
}
/* Finish badge: pill-shaped, color-coded by placement. */
.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-home-season-hub .standings-mini--placements .placement-finish {
  display: inline-block;
  padding: 0.2rem 0.55rem;
  border-radius: 2px;
  font-size: 0.66rem;
  letter-spacing: 0.06em;
  background: rgba(19, 70, 84, 0.1);
  color: var(--mlcl-teal-ink);
}
.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-home-season-hub .standings-mini--placements .placement-finish--champion {
  background: var(--mlcl-orange);
  color: #0c2530;
}
.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-home-season-hub .standings-mini--placements .placement-finish--runner-up {
  background: rgba(19, 70, 84, 0.16);
}

/* Core WP buttons (Join CTA + venue buttons): WP's default link color is
   #55555e on the front-end (no theme.json button override here). Re-paint with
   the brand fill/outline. The .wp-block-button container provides the 4th class. */
/* Button shape consistency (round vs square mismatch). The custom .btn used in the hero
   and season sections is square; core WP buttons (the closing "Ready to throw" CTA and the
   venue buttons) were inheriting a pill radius from the parent theme. Square the core
   buttons so every button on the site reads the same. Flip this one value to a small unit
   (e.g. 4px) if a softer, uniformly-rounded look is preferred. */
.entry-content .wp-block-button > .wp-block-button__link { border-radius: 0; }
.entry-content .wp-block-button > .wp-block-button__link,
.entry-content .wp-block-button > .wp-block-button__link:hover {
  text-decoration: none;
}
.entry-content .wp-block-button.is-style-fill > .wp-block-button__link {
  background: #ff8b48; color: #0c2530; border: 1px solid #0c2530;
  font-weight: 800; letter-spacing: 0.08em; text-transform: uppercase;
}
.entry-content .wp-block-button.is-style-fill > .wp-block-button__link:hover { background: #ffa66e; }
.entry-content .wp-block-button.is-style-outline > .wp-block-button__link {
  background: transparent; color: #0c2530; border: 1.5px solid #0c2530;
  font-weight: 800; letter-spacing: 0.08em; text-transform: uppercase;
}
.entry-content .wp-block-button.is-style-outline > .wp-block-button__link:hover { background: #0c2530; color: #f4f1ea; }
/* Outline buttons on dark bands (the closing "Ready to throw" CTA) must read as a light
   ghost button. The default outline style above paints dark-on-light (#0c2530 text and
   border), which is invisible on the #0c2530 band: "Sponsor the league" was blending in.
   On dark bands, invert to a cream ghost that fills cream on hover. */
body.mlcl-broadcast .entry-content .mlcl-band--dark .wp-block-button.is-style-outline > .wp-block-button__link {
  color: #f4f1ea;
  border-color: rgba(244, 241, 234, 0.6);
}
body.mlcl-broadcast .entry-content .mlcl-band--dark .wp-block-button.is-style-outline > .wp-block-button__link:hover {
  background: #f4f1ea;
  color: #0c2530;
  border-color: #f4f1ea;
}

body.mlcl-broadcast .entry-content .mlcl-band--sand:has([data-mlcl-court-diagram]) .wp-block-buttons {
  gap: 0.65rem 0.75rem;
  margin-top: 1rem;
}

body.mlcl-broadcast .entry-content .mlcl-band--sand:has([data-mlcl-court-diagram]) .wp-block-button > .wp-block-button__link {
  display: inline-flex;
  min-height: 44px;
  align-items: center;
  justify-content: center;
  padding: 0.78rem 1rem;
  box-shadow: 0 8px 18px rgba(12, 37, 48, 0.08);
  font-size: 0.74rem;
  line-height: 1.1;
}

body.mlcl-broadcast .entry-content .mlcl-band--sand:has([data-mlcl-court-diagram]) .wp-block-button.is-style-outline > .wp-block-button__link {
  border-color: rgba(24, 112, 112, 0.58);
  background: #fffdf8;
  color: #134654;
}

body.mlcl-broadcast .entry-content .mlcl-band--sand:has([data-mlcl-court-diagram]) .wp-block-button.is-style-outline > .wp-block-button__link:hover {
  border-color: var(--mlcl-orange);
  background: #0c2530;
  color: #f4f1ea;
}

@media (max-width: 600px) {
  body.mlcl-broadcast .entry-content .mlcl-band--sand:has([data-mlcl-court-diagram]) .wp-block-buttons {
    align-items: stretch;
  }
  body.mlcl-broadcast .entry-content .mlcl-band--sand:has([data-mlcl-court-diagram]) .wp-block-button,
  body.mlcl-broadcast .entry-content .mlcl-band--sand:has([data-mlcl-court-diagram]) .wp-block-button > .wp-block-button__link {
    width: 100%;
  }
}

/* ---- Signup multi-step ---- */
.signup-wrap {
  max-width: 720px;
  margin: 0 auto;
}
.steps {
  display: flex;
  align-items: center;
  margin-bottom: 3rem;
  gap: 0;
}
.step {
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.5rem;
  position: relative;
}
.step::after {
  content: '';
  position: absolute;
  left: 50%; right: -50%;
  top: 18px;
  height: 2px;
  background: var(--mlcl-line);
  z-index: 0;
}
.step:last-child::after { display: none; }
.step.done::after, .step.active::after { background: var(--mlcl-orange); }
.step-num {
  width: 38px; height: 38px;
  border: 2px solid var(--mlcl-line-strong);
  background: var(--mlcl-bg);
  color: var(--mlcl-ink-mute);
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: 'Bricolage Grotesque', system-ui, sans-serif;
  font-weight: 800;
  font-size: 0.9rem;
  position: relative;
  z-index: 1;
}
.step.active .step-num { background: var(--mlcl-orange); color: #0c2530; border-color: var(--mlcl-orange); }
.step.done .step-num { background: var(--mlcl-teal); color: #0c2530; border-color: var(--mlcl-teal); }
.step-label {
  font-family: 'Bricolage Grotesque', system-ui, sans-serif;
  font-weight: 700;
  font-size: 0.65rem;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--mlcl-ink-mute);
  text-align: center;
}
.step.active .step-label, .step.done .step-label { color: var(--mlcl-ink); }

.form-field { margin-bottom: 1.25rem; }
.form-field label {
  display: block;
  font-family: 'Bricolage Grotesque', system-ui, sans-serif;
  font-weight: 700;
  font-size: 0.7rem;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--mlcl-teal-ink);
  margin-bottom: 0.4rem;
}
.form-field input, .form-field select, .form-field textarea {
  width: 100%;
  background: var(--mlcl-bg-2);
  border: 1px solid var(--mlcl-line-strong);
  padding: 0.9rem 1rem;
  color: var(--mlcl-ink);
  font-family: 'Bricolage Grotesque';
  font-size: 1.05rem;
  outline: none;
  transition: border-color 0.15s;
}
.form-field input:focus, .form-field select:focus, .form-field textarea:focus { border-color: var(--mlcl-orange); }
.form-field .error {
  color: var(--mlcl-bad-ink);
  font-size: 0.85rem;
  margin-top: 0.4rem;
  font-weight: 600;
}
.form-field.invalid input, .form-field.invalid select { border-color: var(--mlcl-bad); }
.form-row { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; }
@media (max-width: 600px) { .form-row { grid-template-columns: 1fr; } }
.form-actions {
  display: flex;
  justify-content: space-between;
  margin-top: 2rem;
}
.form-summary { background: var(--mlcl-bg-2); padding: 1.5rem; border: 1px solid var(--mlcl-line-strong); margin-bottom: 1.5rem; }
.form-summary dt { font-family: 'Bricolage Grotesque', system-ui, sans-serif; font-weight: 700; font-size: 0.65rem; letter-spacing: 0.16em; text-transform: uppercase; color: var(--mlcl-ink-mute); margin-top: 0.8rem; }
.form-summary dt:first-child { margin-top: 0; }
.form-summary dd { margin: 0.2rem 0 0; font-size: 1.1rem; font-weight: 600; }

/* ---- Updates / posts ---- */
.updates-grid {
  display: grid;
  grid-template-columns: 1.5fr 1fr 1fr;
  gap: 1.5rem;
}
.update-card {
  background: var(--mlcl-surface);
  border: 1px solid var(--mlcl-line);
  overflow: hidden;
  display: flex;
  flex-direction: column;
}
.update-card.featured { grid-row: span 2; }
.update-img {
  aspect-ratio: 16 / 10;
  background: var(--mlcl-bg-3);
  position: relative;
  overflow: hidden;
}
.update-card.featured .update-img { aspect-ratio: 16 / 9; }
.update-img-placeholder {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: 'Bricolage Grotesque';
  font-weight: 800;
  font-size: 3rem;
  color: var(--mlcl-teal-ink);
  opacity: 0.4;
  background:
    repeating-linear-gradient(45deg, transparent, transparent 12px, rgba(83, 194, 203, 0.06) 12px, rgba(83, 194, 203, 0.06) 24px),
    linear-gradient(135deg, var(--mlcl-bg-3), var(--mlcl-surface));
}
.update-img-tag {
  position: absolute;
  top: 0.8rem; left: 0.8rem;
  background: var(--mlcl-orange);
  color: #0c2530;
  font-family: 'Bricolage Grotesque';
  font-weight: 700;
  font-size: 0.65rem;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  padding: 0.3rem 0.6rem;
}
.update-body { padding: 1.5rem; flex: 1; display: flex; flex-direction: column; }
.update-meta {
  font-family: 'Bricolage Grotesque';
  font-weight: 700;
  font-size: 0.65rem;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--mlcl-ink-mute);
  margin-bottom: 0.6rem;
}
.update-title {
  font-family: 'Bricolage Grotesque';
  font-weight: 800;
  font-size: 1.25rem;
  line-height: 1.05;
  letter-spacing: 0.02em;
  text-transform: uppercase;
  margin-bottom: 0.6rem;
}
.update-card.featured .update-title { font-size: 1.75rem; }
.update-excerpt {
  color: var(--mlcl-ink-dim);
  font-size: 0.95rem;
  line-height: 1.5;
  margin-bottom: 1rem;
}
.update-link {
  font-family: 'Bricolage Grotesque';
  font-weight: 700;
  font-size: 0.75rem;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--mlcl-orange);
  margin-top: auto;
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  gap: 0.4rem;
}
@media (max-width: 880px) {
  .updates-grid { grid-template-columns: 1fr; }
  .update-card.featured { grid-row: auto; }
}

/* ---- Updates (season-chaptered index, Phase B4) ----
   Page 264 is the dark hero band + section headings + the
   mlcl/season-timeline and mlcl/season-chapters blocks (their styles live in
   the SEASON STORY TIMELINE section below). The old Query Loop
   toolbar/event-card layer was retired with the B4 content swap. ---- */

.entry-content .mlcl-updates-page-head .mlcl-kicker {
  color: var(--mlcl-orange);
  font-family: 'Bricolage Grotesque', system-ui, sans-serif;
  font-size: 0.72rem;
  font-weight: 850;
  letter-spacing: 0.14em;
  margin: 0 0 0.55rem;
  text-transform: uppercase;
}

.entry-content .mlcl-updates-section-title {
  display: flex;
  align-items: center;
  gap: 0.65rem;
  margin: 0 0 1rem;
}

.entry-content .mlcl-updates-archive {
  padding-top: clamp(3.25rem, 6vw, 4rem);
}

.entry-content .mlcl-updates-section-title::before {
  content: "";
  display: inline-block;
  width: 0.18rem;
  height: 1.35rem;
  background: var(--mlcl-orange);
}

/* ---- Sponsorship ---- */
.sponsor-tiers {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1.25rem;
}
.tier {
  background: var(--mlcl-surface);
  border: 1px solid var(--mlcl-line);
  padding: 2rem 1.5rem;
  position: relative;
}
.tier.platinum { border-color: var(--mlcl-orange); border-width: 2px; }
.tier-band {
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 6px;
}
.tier.bronze .tier-band { background: #cd7f32; }
.tier.silver .tier-band { background: var(--mlcl-teal); }
.tier.platinum .tier-band { background: var(--mlcl-orange); }
.tier h3 {
  font-family: 'Bricolage Grotesque';
  font-weight: 800;
  text-transform: uppercase;
  font-size: 1.4rem;
  margin: 1rem 0 0.3rem;
  letter-spacing: 0.02em;
}
.tier .tier-price {
  font-family: 'Bricolage Grotesque';
  font-weight: 800;
  font-size: 3rem;
  line-height: 1;
  color: var(--mlcl-orange);
  letter-spacing: -0.02em;
  margin-bottom: 1rem;
}
.tier ul {
  list-style: none;
  padding: 0;
  margin: 1.5rem 0;
  display: flex; flex-direction: column;
  gap: 0.6rem;
}
.tier li { font-size: 0.95rem; color: var(--mlcl-ink-dim); padding-left: 1.2rem; position: relative; }
.tier li::before {
  content: '+';
  position: absolute;
  left: 0;
  color: var(--mlcl-orange);
  font-family: 'Bricolage Grotesque';
  font-weight: 800;
}
@media (max-width: 768px) {
  .sponsor-tiers { grid-template-columns: 1fr; }
}

/* ---- Sponsorship tier cards on the converted (block) page ----
   The mlcl/sponsor-tiers block renders a .mlcl-sponsor-tiers columns wrapper
   with three .mlcl-tier cards and per-tier modifiers. The SPA's legacy
   .tier / .sponsor-tiers rules are
   NOT scoped to .entry-content, so on the converted page they would lose the
   specificity tie to the generic .mlcl-site:not(.mlcl-app-active) .entry-content
   h3/p/a rules and the price would inherit the bright orange accent (#FF8B48),
   which fails WCAG AA on the white card. Scope these card rules under the Phase-4
   specificity wrapper and drive all text from the -ink token layer so the cards
   render styled AND readable on the cream/white body. Retires with the SPA in
   Phase 7. */
.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-tiers-head {
  text-align: center;
}
.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-sponsor-tiers {
  gap: 1.25rem;
  margin-block: 1.5rem 1rem;
}
.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-past-sponsors {
  font-size: 0.9rem;
  opacity: 0.78;
  margin-top: 0.75rem;
}
.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-sponsor-tiers .mlcl-tier {
  background: var(--mlcl-surface);
  border: 1px solid var(--mlcl-line-strong);
  padding: 2rem 1.5rem;
  position: relative;
}
.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-sponsor-tiers .mlcl-tier-platinum {
  border-color: var(--mlcl-accent-ink);
  border-width: 2px;
}
/* The 6px top band reuses the ::before pseudo-element (no extra markup). */
.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-sponsor-tiers .mlcl-tier::before {
  content: '';
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 6px;
}
.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-sponsor-tiers .mlcl-tier-bronze::before { background: #8a5a00; }
.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-sponsor-tiers .mlcl-tier-silver::before { background: var(--mlcl-teal-ink); }
.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-sponsor-tiers .mlcl-tier-platinum::before { background: var(--mlcl-accent-ink); }
.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-sponsor-tiers .mlcl-tier-eyebrow {
  font-family: 'Bricolage Grotesque', system-ui, sans-serif;
  font-weight: 700;
  font-size: 0.72rem;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  margin: 0.5rem 0 0;
}
.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-sponsor-tiers .mlcl-tier-bronze .mlcl-tier-eyebrow { color: #8a5a00; }
.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-sponsor-tiers .mlcl-tier-silver .mlcl-tier-eyebrow { color: var(--mlcl-teal-ink); }
.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-sponsor-tiers .mlcl-tier-platinum .mlcl-tier-eyebrow { color: var(--mlcl-accent-ink); }
.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-sponsor-tiers .mlcl-tier-name {
  font-family: 'Bricolage Grotesque', system-ui, sans-serif;
  font-weight: 800;
  text-transform: uppercase;
  font-size: 1.4rem;
  margin: 0.4rem 0 0.3rem;
  letter-spacing: 0.02em;
  color: var(--mlcl-ink);
}
.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-sponsor-tiers .mlcl-tier-price {
  font-family: 'Bricolage Grotesque', system-ui, sans-serif;
  font-weight: 800;
  font-size: 3rem;
  line-height: 1;
  color: var(--mlcl-accent-ink);
  letter-spacing: -0.02em;
  margin: 0 0 0.25rem;
}
.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-sponsor-tiers .mlcl-tier-sub {
  color: var(--mlcl-ink-dim);
  font-size: 0.9rem;
  margin: 0;
}
.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-sponsor-tiers .mlcl-tier-perks {
  list-style: none;
  padding: 0;
  margin: 1.5rem 0;
  display: flex;
  flex-direction: column;
  gap: 0.6rem;
}
.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-sponsor-tiers .mlcl-tier-perks li {
  font-size: 0.95rem;
  color: var(--mlcl-ink-dim);
  padding-left: 1.2rem;
  position: relative;
}
.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-sponsor-tiers .mlcl-tier-perks li::before {
  content: '+';
  position: absolute;
  left: 0;
  color: var(--mlcl-accent-ink);
  font-family: 'Bricolage Grotesque', system-ui, sans-serif;
  font-weight: 800;
}
.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-sponsor-tiers .mlcl-tier-cta {
  width: 100%;
}
.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-sponsor-tiers .mlcl-tier-cta .wp-block-button__link {
  width: 100%;
}
.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-tiers-footnote {
  text-align: center;
  margin-top: 1.5rem;
  color: var(--mlcl-ink-dim);
  font-size: 0.9rem;
}

/* Why-sponsor stat tiles (four centered number + label cards). */
.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-sponsor-stats {
  gap: 1.5rem;
  margin-block: 1.5rem;
}
.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-sponsor-stats .wp-block-column {
  background: var(--mlcl-surface);
  border: 1px solid var(--mlcl-line);
  padding: 2rem 1.5rem;
  text-align: center;
}
.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-sponsor-stats .mlcl-stat-number {
  font-family: 'Bricolage Grotesque', system-ui, sans-serif;
  font-weight: 800;
  font-size: 3.5rem;
  color: var(--mlcl-accent-ink);
  line-height: 1;
  letter-spacing: -0.01em;
  margin: 0;
}
.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-sponsor-stats .mlcl-stat-label {
  font-family: 'Bricolage Grotesque', system-ui, sans-serif;
  font-weight: 700;
  font-size: 0.8rem;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--mlcl-ink-dim);
  margin: 0.6rem 0 0;
}

/* Sponsor checkout section: light info band wrapping the GF form 6. */
.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-sponsor-checkout {
  position: relative;
  overflow: hidden;
  margin-top: 2rem;
  padding: clamp(1.25rem, 3vw, 2rem);
  border: 1px solid rgba(12, 37, 48, 0.16);
  background: #fffdf8;
  box-shadow: 0 18px 42px rgba(12, 37, 48, 0.1);
}

.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-sponsor-checkout::before {
  content: "";
  position: absolute;
  top: 0;
  right: 0;
  left: 0;
  height: 6px;
  background: linear-gradient(90deg, var(--mlcl-orange) 0 38%, var(--mlcl-teal) 38% 68%, var(--mlcl-orange) 68% 100%);
}

@media (max-width: 768px) {
  .mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-sponsor-stats .wp-block-column {
    padding: 1.5rem 1rem;
  }
}

/* Homepage Instagram band: native Bunziez social feed block with core intro/CTA. */
.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-home-instagram {
  /* Match the light-band section seam (its 4-class selector out-ranks the
     .mlcl-band--* divider, so set the same hairline here). */
  border-top: 1px solid var(--mlcl-line-strong);
}
.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-home-instagram__intro {
  align-items: flex-end;
  gap: clamp(1.25rem, 4vw, 3rem);
  margin-bottom: clamp(1.25rem, 3vw, 2rem);
}
.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-home-instagram__intro h2 {
  margin-bottom: 0.55rem;
}
.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-home-instagram__intro p {
  max-width: 46rem;
  margin: 0;
  color: rgba(244, 241, 234, 0.78);
}
@media (min-width: 782px) {
  .mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-home-instagram__intro > .mlcl-home-instagram__cta {
    flex: 0 0 auto;
  }
  .mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-home-instagram__intro > .wp-block-column:last-child .wp-block-buttons {
    justify-content: flex-end;
  }
}
.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-home-instagram .bsz-instagram-feed {
  --bsz-instagram-gap: 0.75rem;
  --bsz-instagram-border: rgba(12, 37, 48, 0.22);
  --bsz-instagram-surface: #fffaf1;
  --bsz-instagram-muted: #43545c;
  width: 100%;
  max-width: 100%;
  margin-top: 0;
}
.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-home-instagram .bsz-instagram-feed--grid .bsz-instagram-feed__items {
  grid-template-columns: repeat(6, minmax(0, 1fr));
}
.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-home-instagram .bsz-instagram-tile {
  position: relative;
  background:
    linear-gradient(135deg, rgba(83, 194, 203, 0.2), rgba(255, 139, 72, 0.16)),
    repeating-linear-gradient(45deg, rgba(244, 241, 234, 0.08) 0 8px, transparent 8px 18px),
    #0f303b;
  box-shadow: 0 14px 30px rgba(12, 37, 48, 0.12);
}
.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-home-instagram .bsz-instagram-tile::before {
  content: "";
  position: absolute;
  inset: 0;
  border: 1px solid rgba(83, 194, 203, 0.26);
  box-shadow: inset 0 0 0 5px rgba(12, 37, 48, 0.18);
  pointer-events: none;
  transition: opacity 0.18s ease;
}
.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-home-instagram .bsz-instagram-tile::after {
  content: attr(data-mlcl-label);
  position: absolute;
  left: 0.75rem;
  right: 0.75rem;
  bottom: 0.75rem;
  z-index: 3;
  padding: 0.42rem 0.5rem;
  background: rgba(12, 37, 48, 0.76);
  color: #fffdf8;
  font-family: 'Bricolage Grotesque', system-ui, sans-serif;
  font-size: 0.7rem;
  font-weight: 800;
  line-height: 1.08;
  letter-spacing: 0;
  text-transform: uppercase;
  transition: opacity 0.18s ease;
}
.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-home-instagram .bsz-instagram-tile__image {
  position: absolute;
  inset: 0;
  z-index: 2;
  height: 100%;
  background: #fffdf8;
  object-fit: contain;
  opacity: 0;
  transition: opacity 0.18s ease;
}
.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-home-instagram .bsz-instagram-tile.mlcl-visual-loaded {
  background:
    linear-gradient(135deg, rgba(83, 194, 203, 0.1), rgba(255, 139, 72, 0.08)),
    #fffdf8;
}
.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-home-instagram .bsz-instagram-tile.mlcl-visual-loaded::before {
  opacity: 0;
}
.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-home-instagram .bsz-instagram-tile.mlcl-visual-loaded .bsz-instagram-tile__image {
  opacity: 1;
}
.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-home-instagram .bsz-instagram-feed--empty {
  border: 1px dashed rgba(12, 37, 48, 0.26);
  background: rgba(255, 250, 241, 0.72);
  padding: 1.25rem;
}
.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-home-instagram .bsz-instagram-feed--empty p {
  margin: 0;
  color: #27353d;
}
@media (max-width: 900px) {
  .mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-home-instagram .bsz-instagram-feed--grid .bsz-instagram-feed__items {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}
@media (max-width: 600px) {
  .mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-home-instagram .wp-block-buttons,
  .mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-home-instagram .wp-block-button,
  .mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-home-instagram .wp-block-button > .wp-block-button__link {
    width: 100%;
  }
  .mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-home-instagram .bsz-instagram-feed--grid .bsz-instagram-feed__items {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

/* Homepage sponsor band: core heading/copy/CTA wrapped around mlcl/sponsors. */
.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-home-season-hub {
  position: relative;
}
.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-season-note-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1rem;
  margin: 1.5rem 0 2.75rem;
}
.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-season-note {
  padding: 1rem 1.15rem;
  border: 1px solid rgba(12, 37, 48, 0.16);
  background: #fffdf8;
  box-shadow: inset 5px 0 0 var(--mlcl-orange);
}
.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-season-note p {
  margin: 0;
  color: #27353d;
}
.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-season-note strong {
  color: #0c2530;
}
.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-home-history-actions {
  margin: 1.2rem 0 3rem;
}
.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-home-season-hub > h2.wp-block-heading {
  display: block;
  width: fit-content;
  max-width: 100%;
  /* Pin the badge's left edge to the centered content column (x of the intro,
     tables, note grid) instead of the band's full-bleed gutter. The offset is
     the same one WP's constrained layout uses to center a 1200px column:
     (parent content width - content-size) / 2. At narrow widths the min()
     clamps to 0 and the badge sits at the gutter, matching the siblings. */
  margin-left: calc((100% - min(100%, var(--wp--style--global--content-size, 1200px))) / 2) !important;
  margin-right: auto !important;
  padding: 0.5rem 0.85rem;
  background: #0c2530;
  color: #f4f1ea;
  box-shadow: inset 5px 0 0 var(--mlcl-orange);
}
.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-home-instagram {
  position: relative;
  overflow: hidden;
  background:
    linear-gradient(135deg, rgba(255, 139, 72, 0.16), transparent 36%),
    linear-gradient(180deg, #0c2530 0, #123f4d 100%) !important;
  color: #f4f1ea;
}
.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-home-instagram::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 6px;
  background: linear-gradient(90deg, var(--mlcl-orange) 0 33%, var(--mlcl-teal) 33% 66%, var(--mlcl-orange) 66% 100%);
}
.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-home-instagram > * {
  position: relative;
  z-index: 1;
}
.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-home-instagram h2,
.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-home-instagram p {
  color: #f4f1ea;
}
.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-home-instagram p {
  color: rgba(244, 241, 234, 0.78);
}
.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-home-instagram .mlcl-home-instagram__intro p,
.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-home-instagram .mlcl-home-section-intro p:not(.eyebrow) {
  /* The Instagram band paints a dark teal gradient, so its intro copy must stay
     cream. The shared light-band .mlcl-home-section-intro p rule (#27353d) would
     otherwise win on source order and render the description dark-on-dark. */
  color: rgba(244, 241, 234, 0.82);
}
.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-home-instagram .wp-block-button.is-style-outline > .wp-block-button__link {
  color: #f4f1ea;
  border-color: rgba(244, 241, 234, 0.72);
}
.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-home-instagram .wp-block-button.is-style-outline > .wp-block-button__link:hover {
  background: #f4f1ea;
  color: #0c2530;
}
.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-home-sponsors > p {
  max-width: 48rem;
  color: #27353d;
}
.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-home-sponsors .mlcl-sponsors {
  margin-block: 1.5rem;
}
.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-home-sponsors .wp-block-buttons {
  margin-top: 1.5rem;
}

/* ============================================================
   Homepage 9.x section architecture

   The homepage is intentionally split into authored bands. Each band has one
   job and one dominant artifact: signup, schedule, snapshot, recap, venue,
   play, rules, FAQ, community, sponsors, CTA. These rules sit after the older
   conversion styles so they can refine the same block markup without changing
   shared block renderers.
   ============================================================ */
.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-home-section {
  position: relative;
  isolation: isolate;
}

/* Section dividers are consolidated onto the fleet-wide
   .mlcl-band--{cream,sand,white} top hairline (see "Section seam on light bands").
   The homepage-only .mlcl-home-section::after duplicate was removed during
   reconciliation so one divider system covers every page. */

.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-home-section-intro {
  max-width: 58rem;
  margin: 0 auto 2.4rem 0;
}

.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-home-section-intro .eyebrow {
  margin: 0 0 0.7rem;
}

.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-home-section-intro h2 {
  margin: 0 0 0.75rem;
  max-width: 15ch;
  font-size: 4.15rem;
  line-height: 0.92;
  letter-spacing: 0;
}

.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-home-section-intro p:not(.eyebrow) {
  max-width: 48rem;
  margin: 0;
  color: #27353d;
  font-size: 1.12rem;
  line-height: 1.55;
}

.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-home-instagram .mlcl-home-section-intro p:not(.eyebrow) {
  color: rgba(244, 241, 234, 0.78);
}

/* Signup is the conversion feature. Let the dynamic season-card own the full
   vertical rhythm; otherwise the wrapper plus block padding double-stacks. */
.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-home-signup {
  padding: 0;
  border-top: 0;
}

.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-home-signup .next-season-block {
  padding-top: clamp(4.75rem, 8vw, 7rem);
  padding-bottom: clamp(4.75rem, 8vw, 7rem);
}

.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-home-signup .next-season-grid {
  gap: clamp(2rem, 5vw, 4.5rem);
}

.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-home-signup .next-season-title {
  max-width: 11ch;
}

.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-home-signup .next-season-blurb {
  max-width: 38rem;
}

/* Schedule owns "when"; the schedule block already carries the season context. */
.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-home-schedule {
  background:
    linear-gradient(180deg, rgba(255, 139, 72, 0.06), rgba(255, 139, 72, 0) 34%),
    #fffdf8;
}

.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-home-schedule .section[data-mlcl-schedule] {
  padding: 0;
}

.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-home-schedule .section-head h2 {
  max-width: 12ch;
}

/* Snapshot is the "what do I get?" section. Keep the league-info block inside
   this band instead of breaking out as another full-bleed sub-band. */
.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-home-snapshot {
  background:
    linear-gradient(90deg, rgba(83, 194, 203, 0.1), transparent 42%),
    var(--mlcl-bg-2);
}

body.mlcl-broadcast .entry-content .mlcl-home-snapshot .section[data-mlcl-league-info] {
  width: auto;
  max-width: none;
  margin-left: 0 !important;
  margin-right: 0 !important;
  padding: 0;
  background: transparent;
}

.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-home-snapshot .section[data-mlcl-league-info] .wrap {
  width: min(100%, var(--wp--style--global--content-size, 1200px));
}

/* Recap is past-season context. It should read as secondary to Summer signup,
   while still feeling polished enough to trust the standings data. */
.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-home-recap {
  background:
    linear-gradient(180deg, rgba(19, 70, 84, 0.055), rgba(19, 70, 84, 0) 42%),
    var(--mlcl-bg);
}

.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-home-recap .mlcl-bracket-leaders {
  margin: 0.8rem 0 0;
}

.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-home-recap .mlcl-bracket-leaders h3.teaser-bracket-head,
.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-home-recap .mlcl-bracket-leaders .teaser-bracket-head {
  display: block;
  background: #0c2530;
  color: #f4f1ea;
  box-shadow: inset 5px 0 0 var(--mlcl-orange);
  padding: 0.58rem 0.85rem;
  margin: 0;
  font-size: 0.74rem;
  letter-spacing: 0;
}

.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-home-recap .mlcl-bracket-leaders .teaser-bracket-col .table-scroll {
  border: 1px solid var(--mlcl-line);
  border-top: none;
  background: #fff;
  box-shadow: 0 16px 34px rgba(12, 37, 48, 0.08);
}

.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-home-recap .standings-mini--placements th {
  background: #f7f4ec;
  color: var(--mlcl-ink-mute);
  border-bottom: 1px solid var(--mlcl-line-strong);
  padding: 0.62rem 0.7rem;
}

.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-home-recap .standings-mini--placements td {
  padding: 0.72rem;
}

.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-home-recap .standings-mini--placements tr.row-hot td {
  background: rgba(255, 139, 72, 0.12);
}

.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-home-recap .standings-mini--placements tr.row-hot .team-name {
  color: var(--mlcl-accent-ink);
}

.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-home-recap .standings-mini--placements .placement-finish {
  display: inline-block;
  padding: 0.2rem 0.55rem;
  border-radius: 2px;
  font-size: 0.66rem;
  letter-spacing: 0;
  background: rgba(19, 70, 84, 0.1);
  color: var(--mlcl-teal-ink);
}

.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-home-recap .standings-mini--placements .placement-finish--champion {
  background: var(--mlcl-orange);
  color: #0c2530;
}

.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-home-recap .standings-mini--placements .placement-finish--runner-up {
  background: rgba(19, 70, 84, 0.12);
  color: #134654;
}

/* Venue gets a location-card treatment distinct from rules and scoring. */
.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-home-venue {
  background:
    linear-gradient(135deg, rgba(83, 194, 203, 0.1), transparent 32%),
    #fffdf8;
}

.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-home-venue-grid {
  align-items: center;
  gap: clamp(2rem, 5vw, 4rem);
  margin-bottom: 0;
}

.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-home-venue-grid > .wp-block-column:first-child {
  padding: clamp(1.5rem, 3vw, 2.25rem);
  border: 1px solid rgba(12, 37, 48, 0.14);
  background: rgba(255, 253, 248, 0.78);
  box-shadow: inset 6px 0 0 var(--mlcl-orange), 0 18px 40px rgba(12, 37, 48, 0.08);
}

.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-home-venue-grid h3 {
  margin-top: 0;
  font-size: 1.65rem;
}

.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-home-venue-grid > .wp-block-column:last-child {
  padding: clamp(1rem, 2.2vw, 1.65rem);
  border: 1px solid rgba(19, 70, 84, 0.18);
  background: rgba(234, 229, 216, 0.54);
}

/* Play is instructional and physical. Rules below it are reference. */
.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-home-play {
  background:
    linear-gradient(90deg, rgba(255, 139, 72, 0.08), transparent 40%),
    var(--mlcl-bg-2);
}

.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-home-play .scoring-hero {
  margin-bottom: 0;
}

.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-home-rules {
  background: var(--mlcl-bg);
}

.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-home-rules .rules-block {
  border: 1px solid rgba(12, 37, 48, 0.14);
  background: rgba(255, 253, 248, 0.68);
  padding: clamp(1.25rem, 3vw, 2rem);
}

.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-home-rules .rules-grid {
  grid-template-columns: 1fr;
  gap: clamp(1rem, 2vw, 1.35rem);
}

.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-home-rules .rules-list--official ul {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  column-gap: clamp(1.5rem, 3vw, 2.35rem);
}

.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-home-rules .rules-list--official li {
  min-height: 2.75rem;
}

.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-home-rules .rules-list--house {
  display: block;
  padding: clamp(0.9rem, 2vw, 1.15rem);
  background:
    linear-gradient(90deg, rgba(19, 70, 84, 0.08), transparent 54%),
    #fffdf8;
  border: 1px solid rgba(19, 70, 84, 0.18);
  border-top: 3px solid var(--mlcl-teal-ink);
  box-shadow: none;
}

.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-home-rules .rules-list--house .rules-list-title {
  display: inline-flex;
  align-items: center;
  margin: 0 0 0.75rem;
  padding: 0.28rem 0.48rem;
  border: 1px solid rgba(19, 70, 84, 0.18);
  background: rgba(19, 70, 84, 0.08);
  color: var(--mlcl-teal-ink);
  line-height: 1;
}

.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-home-rules .rules-list--house ul {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0.6rem;
  counter-reset: house-rule-counter;
}

.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-home-rules .rules-list--house li {
  position: relative;
  display: block;
  counter-increment: house-rule-counter;
  min-height: 0;
  padding: 0.68rem 0.72rem 0.68rem 3.3rem;
  border: 1px solid rgba(19, 70, 84, 0.14);
  background: rgba(255, 253, 248, 0.84);
  line-height: 1.45;
}

.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-home-rules .rules-list--house li:nth-child(3) {
  border-color: rgba(164, 56, 10, 0.28);
  background: rgba(255, 139, 72, 0.11);
}

.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-home-rules .rules-list--house li::before {
  content: counter(house-rule-counter, decimal-leading-zero);
  display: inline-grid;
  place-items: center;
  position: absolute;
  top: 0.68rem;
  left: 0.72rem;
  width: 2rem;
  height: 1.55rem;
  padding: 0;
  background: rgba(19, 70, 84, 0.1);
  color: var(--mlcl-teal-ink);
  border-radius: 3px;
}

.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-home-rules .rules-list--house li strong {
  display: inline;
  margin-bottom: 0;
  color: var(--mlcl-accent-ink);
  font-weight: 800;
}

.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-home-faq {
  background: #fffdf8;
}

.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-home-faq .mlcl-faq {
  border-top: 1px solid rgba(12, 37, 48, 0.12);
}

.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-home-instagram .mlcl-home-section-intro {
  margin-bottom: 1.2rem;
}

.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-home-instagram .mlcl-home-instagram__actions {
  justify-content: flex-start;
  margin: 0 0 1.6rem;
}

.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-home-sponsors .mlcl-home-section-intro h2 {
  max-width: 20ch;
}

.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-home-sponsors .wp-block-buttons {
  justify-content: flex-start;
}

@media (max-width: 900px) {
  .mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-home-section-intro {
    margin-bottom: 1.8rem;
  }

  .mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-home-section-intro h2 {
    font-size: 3.25rem;
  }

  .mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-home-rules .rules-grid {
    grid-template-columns: 1fr;
  }

  .mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-home-rules .rules-list--official ul,
  .mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-home-rules .rules-list--house,
  .mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-home-rules .rules-list--house ul {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 640px) {
  .mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-home-section-intro h2 {
    max-width: 11ch;
    font-size: 2.35rem;
  }

  .mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-season-note-grid {
    grid-template-columns: 1fr;
  }

  .mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-home-signup .next-season-actions,
  .mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-home-signup .next-season-actions .btn,
  .mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-home-history-actions,
  .mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-home-history-actions .wp-block-button,
  .mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-home-history-actions .wp-block-button__link {
    width: 100%;
  }
}

/* ---- Sponsors block (mlcl/sponsors) ---- */
/* Scoped under the Phase-4 specificity wrapper to win the tie against SPA styles. */
.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-sponsors {
  margin-block: 2rem;
}
.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-sponsors__heading {
  font-family: 'Bricolage Grotesque', system-ui, sans-serif;
  font-weight: 800;
  font-size: 1.2rem;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--mlcl-accent-ink);
  margin-bottom: 1.25rem;
}
.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-sponsors__grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(230px, 1fr));
  gap: 1rem;
}
.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-sponsor-card {
  background: #fffdf8;
  border: 1px solid var(--mlcl-line-strong);
  padding: 1.3rem 1rem 1.1rem;
  text-align: center;
  position: relative;
  color: inherit;
  display: block;
  min-width: 0;
  text-decoration: none;
  transition: border-color 160ms ease, box-shadow 160ms ease, transform 160ms ease;
}
.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-sponsor-card--linked:hover,
.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-sponsor-card--linked:focus-visible {
  border-color: var(--mlcl-orange);
  box-shadow: 0 12px 28px rgba(12, 37, 48, 0.12);
  color: inherit;
  transform: translateY(-2px);
}
.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-sponsor-card__band {
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 4px;
}
.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-sponsor-card--platinum .mlcl-sponsor-card__band {
  background: var(--mlcl-orange);
}
.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-sponsor-card--silver .mlcl-sponsor-card__band {
  background: var(--mlcl-teal);
}
.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-sponsor-card--bronze .mlcl-sponsor-card__band {
  background: #cd7f32;
}
.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-sponsor-card__mark {
  width: min(100%, 12rem);
  height: 6.4rem;
  margin: 0.35rem auto 1rem;
  display: flex;
  align-items: center;
  justify-content: center;
}
.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-sponsor-card__logo {
  display: block;
  width: 100%;
  height: 100%;
  max-width: 100%;
  max-height: 100%;
  object-fit: contain;
}
.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-sponsor-card__initials {
  width: 88px;
  height: 88px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: 'Bricolage Grotesque', system-ui, sans-serif;
  font-weight: 800;
  font-size: 1.4rem;
  letter-spacing: 0.02em;
}
.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-sponsor-card--platinum .mlcl-sponsor-card__initials {
  background: var(--mlcl-orange);
  color: #0c2530;
}
.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-sponsor-card--silver .mlcl-sponsor-card__initials {
  background: var(--mlcl-teal);
  color: #0c2530;
}
.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-sponsor-card--bronze .mlcl-sponsor-card__initials {
  background: #cd7f32;
  color: #0c2530;
}
.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-sponsor-card__name {
  font-family: 'Bricolage Grotesque', system-ui, sans-serif;
  font-weight: 700;
  font-size: 0.85rem;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  margin-bottom: 0;
}
.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-sponsor-card__tagline {
  color: #27353d;
  font-size: 0.78rem;
  line-height: 1.45;
  margin: 0 auto 0.8rem;
  max-width: 14rem;
}
.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-sponsor-card__tier {
  font-family: 'Bricolage Grotesque', system-ui, sans-serif;
  font-weight: 700;
  font-size: 0.6rem;
  letter-spacing: 0.2em;
  text-transform: uppercase;
}
.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-sponsor-card--platinum .mlcl-sponsor-card__tier {
  color: var(--mlcl-accent-ink);
}
.rules-list--official ul {
  display: grid;
  grid-template-columns: 1fr;
}
.rules-list--house {
  padding: 1rem;
  border: 1px solid rgba(19, 70, 84, 0.22);
  background: rgba(255, 253, 248, 0.58);
}
.rules-list--house ul {
  display: grid;
  grid-template-columns: 1fr;
  gap: 0.8rem;
}
.rules-list--house li {
  padding: 0.75rem;
  border: 1px solid rgba(19, 70, 84, 0.16);
  background: #fffdf8;
}
.rules-list--house li:last-child {
  border-bottom: 1px solid rgba(19, 70, 84, 0.16);
}
.rules-list--house li strong {
  display: inline;
  color: var(--mlcl-accent-ink);
  font-family: inherit;
  letter-spacing: 0;
  text-transform: none;
}
@media (max-width: 760px) {
  .rules-list--official ul,
  .rules-list--house ul {
    grid-template-columns: 1fr;
  }
}
.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-sponsor-card--silver .mlcl-sponsor-card__tier {
  color: var(--mlcl-teal-ink);
}
.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-sponsor-card--bronze .mlcl-sponsor-card__tier {
  color: #8a5a00;
}
@media (max-width: 600px) {
  .mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-season-note-grid {
    grid-template-columns: 1fr;
  }
  .mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-sponsors__grid {
    grid-template-columns: 1fr;
  }
}

/* ---- Location/map placeholder ---- */
.map-block {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0;
  border: 1px solid var(--mlcl-line-strong);
  min-height: 360px;
}
.map-block .map-meta { padding: 2.5rem; background: var(--mlcl-bg-2); display: flex; flex-direction: column; justify-content: center; }
.map-block .map-vis {
  background:
    radial-gradient(circle at 30% 40%, rgba(83, 194, 203, 0.18), transparent 40%),
    radial-gradient(circle at 70% 60%, rgba(255, 139, 72, 0.18), transparent 40%),
    var(--mlcl-bg-3);
  position: relative;
  overflow: hidden;
  border-left: 1px solid var(--mlcl-line-strong);
}
.map-grid-bg {
  position: absolute; inset: 0;
  background-image:
    linear-gradient(var(--mlcl-line) 1px, transparent 1px),
    linear-gradient(90deg, var(--mlcl-line) 1px, transparent 1px);
  background-size: 40px 40px;
  opacity: 0.5;
  /* Purely decorative; never swallow clicks meant for siblings/overlapping
   * sections (the FAQ buttons sit below the diagram on mobile column-stack). */
  pointer-events: none;
}
.map-pin {
  position: absolute;
  top: 50%; left: 50%;
  transform: translate(-50%, -50%);
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.5rem;
}
.map-pin-dot {
  width: 22px; height: 22px;
  background: var(--mlcl-orange);
  border: 3px solid #0c2530;
  border-radius: 50%;
  box-shadow: 0 0 0 6px rgba(255, 139, 72, 0.25), 0 0 0 12px rgba(255, 139, 72, 0.12);
  animation: pulse 2s infinite;
}
.map-pin-label {
  background: #0c2530;
  color: var(--mlcl-orange);
  font-family: 'Bricolage Grotesque';
  font-weight: 700;
  font-size: 0.65rem;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  padding: 0.4rem 0.7rem;
  border: 1px solid var(--mlcl-orange);
}
/* ---- Venue court diagram - 6-lane grid ---- */
.map-vis--courts {
  display: flex;
  flex-direction: column;
  gap: 0;
  padding: 0.6rem 0.75rem 0.75rem;
  /* Containing block for the absolute .map-grid-bg overlay. On the SPA the
   * positioned ancestor was .map-block .map-vis; on the converted Home the
   * court-diagram block lives inside a core/columns column with no positioned
   * ancestor, so the grid background was escaping upward and intercepting
   * clicks on neighboring sections (the FAQ accordion). */
  position: relative;
}
.map-vis-label {
  font-family: 'Bricolage Grotesque', system-ui, sans-serif;
  font-weight: 700;
  font-size: 0.6rem;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: var(--mlcl-ink-mute);
  margin-bottom: 0.5rem;
  position: relative;
  z-index: 1;
}
.map-courts {
  flex: 1 1 auto;
  min-height: 0;
  display: flex;
  flex-direction: row;
  gap: 6px;
  align-items: stretch;
  justify-content: center;
  position: relative;
  z-index: 1;
}
.map-court-lane {
  flex: 1 1 0;
  min-width: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 4px;
  border: 1px solid rgba(83, 194, 203, 0.25);
  border-radius: 3px;
  padding: 4px 2px 2px;
  background: rgba(12, 37, 48, 0.35);
}
.map-court-num {
  font-family: 'Bricolage Grotesque', system-ui, sans-serif;
  font-weight: 700;
  font-size: 0.5rem;
  letter-spacing: 0.18em;
  color: var(--mlcl-orange);
  text-align: center;
  line-height: 1;
}
.map-court-svg {
  width: 100%;
  height: auto;
  flex: 1 1 auto;
  min-height: 0;
  display: block;
}
.map-vis-caption {
  font-family: 'Bricolage Grotesque', system-ui, sans-serif;
  font-weight: 800;
  font-size: 0.85rem;
  letter-spacing: 0.08em;
  color: var(--mlcl-accent-ink);
  text-align: right;
  margin-top: 0.5rem;
  position: relative;
  z-index: 1;
}
@media (max-width: 480px) {
  .map-courts {
    flex-wrap: wrap;
    gap: 4px;
  }
  .map-court-lane {
    flex: 1 1 calc(33.333% - 6px);
    max-width: calc(33.333% - 6px);
  }
}
@media (max-width: 768px) {
  .map-block { grid-template-columns: 1fr; }
  .map-block .map-vis { border-left: none; border-top: 1px solid var(--mlcl-line-strong); min-height: 280px; }
}

/* ---- Animation - bag toss in hero ---- */
.hero-bag {
  position: absolute;
  width: 32px;
  height: 32px;
  background: var(--mlcl-orange);
  border-radius: 4px;
  z-index: 1;
  box-shadow: inset 0 -5px 0 rgba(0,0,0,0.25);
}
.hero-bag::after {
  content: '';
  position: absolute;
  inset: 5px;
  border: 1.5px dashed rgba(0,0,0,0.35);
  border-radius: 2px;
}

@keyframes heroBag1 {
  0% { left: -5%; top: 80%; transform: rotate(0); opacity: 0; }
  10%, 50% { opacity: 1; }
  50% { left: 105%; top: 20%; transform: rotate(540deg); opacity: 0; }
  100% { opacity: 0; }
}
@keyframes heroBag2 {
  0% { right: -5%; top: 70%; transform: rotate(0); opacity: 0; }
  20%, 60% { opacity: 1; }
  60% { right: 105%; top: 30%; transform: rotate(-540deg); opacity: 0; }
  100% { opacity: 0; }
}
[data-hero="animated"] .hero-bag-1 { animation: heroBag1 6s ease-in-out infinite; background: var(--mlcl-orange); }
[data-hero="animated"] .hero-bag-2 { animation: heroBag2 6s ease-in-out infinite 1.2s; background: var(--mlcl-teal); }
[data-hero="static"] .hero-bag { display: none; }
[data-hero="photo"] .hero-bag { display: none; }

/* Photo hero variant */
.hero-photo-bg {
  position: absolute;
  inset: 0;
  display: none;
  background:
    linear-gradient(180deg, rgba(12, 37, 48, 0.85), rgba(12, 37, 48, 0.9)),
    repeating-linear-gradient(45deg, var(--mlcl-bg-2) 0 12px, var(--mlcl-bg-3) 12px 24px);
  z-index: 0;
}
[data-hero="photo"] .hero-photo-bg { display: block; }
[data-hero="photo"] .hero-bg-grid { opacity: 0.15; }

/* ---- Confetti for signup complete ---- */
.confetti {
  position: fixed;
  width: 8px; height: 14px;
  pointer-events: none;
  z-index: 9999;
}
@keyframes confettiFall {
  0% { transform: translateY(-100vh) rotate(0); opacity: 1; }
  100% { transform: translateY(110vh) rotate(720deg); opacity: 0; }
}

/* ---- Misc reveal ---- */
.reveal { opacity: 0; transform: translateY(20px); transition: opacity 0.6s, transform 0.6s; }
.reveal.in { opacity: 1; transform: none; }

/* ---- Live Gravity Forms shell ---- */
.live-form-layout {
  display: grid;
  grid-template-columns: minmax(0, 0.75fr) minmax(0, 1.25fr);
  gap: clamp(1.5rem, 4vw, 3rem);
  align-items: start;
}
.live-form-aside {
  position: sticky;
  top: 6rem;
  border: 1px solid var(--mlcl-line-strong);
  background:
    linear-gradient(135deg, rgba(255,139,72,0.12), transparent 45%),
    var(--mlcl-bg-2);
  padding: clamp(1.25rem, 3vw, 2rem);
}
.live-form-aside h2 {
  font-family: 'Bricolage Grotesque', system-ui, sans-serif;
  font-weight: 800;
  text-transform: uppercase;
  font-size: clamp(2rem, 4vw, 3.6rem);
  letter-spacing: 0.01em;
  line-height: 0.9;
  margin: 0 0 1rem;
}
.live-form-aside h2 .accent {
  color: var(--mlcl-orange);
}
.live-form-aside p {
  color: var(--mlcl-ink-dim);
  margin: 0 0 1.5rem;
  max-width: 34rem;
}
.live-form-points {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  border: 1px solid var(--mlcl-line);
}
.live-form-points div {
  min-width: 0;
  padding: 1rem;
  border-right: 1px solid var(--mlcl-line);
  border-bottom: 1px solid var(--mlcl-line);
}
.live-form-points div:nth-child(2n) {
  border-right: 0;
}
.live-form-points div:nth-last-child(-n+2) {
  border-bottom: 0;
}
.live-form-points strong {
  display: block;
  color: var(--mlcl-orange);
  font-size: 1.6rem;
  font-weight: 800;
  line-height: 1;
}
.live-form-points span,
.live-form-note {
  color: var(--mlcl-ink-dim);
  font-size: 0.82rem;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}
.live-form-note {
  margin-top: 1rem;
  line-height: 1.45;
}
.live-form-panel {
  min-width: 0;
  border: 1px solid var(--mlcl-line-strong);
  background: var(--mlcl-bg-3);
  box-shadow: 0 18px 50px rgba(0,0,0,0.18);
  padding: clamp(1rem, 3vw, 2rem);
}
.form-panel-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  margin-bottom: 1.4rem;
  padding-bottom: 1rem;
  border-bottom: 1px solid var(--mlcl-line);
}
.live-form-missing {
  color: var(--mlcl-ink-dim);
}

/* ---- Sidebar (mobile menu) ---- */
@media (max-width: 600px) {
  .hero-title { font-size: 3rem; }
  .section-head { flex-direction: column; align-items: flex-start; }
  .nav-brand-sub { display: none; }
}

/* Interactive-element focus rings apply on BOTH SPA (app-active) pages and
   converted block pages (which do NOT carry the mlcl-app-active body class,
   because chrome and scope are mount-gated). The prefix was dropped so the
   ring is never suppressed on a converted page (a11y regression). These are
   pure focus-visible outlines on interactive elements, so showing them
   globally is correct on every MLCL page. */
.tab-row button:focus-visible,
.tab-row a:focus-visible,
.btn:focus-visible,
.faq-q:focus-visible,
.nav-burger:focus-visible,
.nav-link:focus-visible,
.flip-card:focus-visible,
input:focus-visible,
/* select/textarea carry the same outline:none + border-color-only focus as
   .form-field input; fold them into the ring so a border tint is never the
   sole keyboard indicator. */
select:focus-visible,
textarea:focus-visible {
  outline: 3px solid var(--mlcl-orange);
  outline-offset: 3px;
}

/* Site chrome links (header nav and logo, footer menus and actions) get the
   same orange ring instead of the faint UA default on the navy bands. */
body.mlcl-site:not(.mlcl-app-active) .nav-menu a:focus-visible,
body.mlcl-site:not(.mlcl-app-active) .footer-menu a:focus-visible,
.site-header__logo:focus-visible,
.site-header__cta:focus-visible,
.site-header__mobile-toggle:focus-visible,
.site-footer__logo:focus-visible,
.site-footer__map-link:focus-visible,
.footer-sponsor__link:focus-visible,
.footer-action:focus-visible,
.footer-sponsor-cta:focus-visible {
  outline: 3px solid var(--mlcl-orange);
  outline-offset: 2px;
}

/* On the orange announcement surfaces an orange ring would vanish; use navy. */
.site-header__ticker-link:focus-visible,
.announce-ribbon-cta:focus-visible {
  outline: 3px solid #0c2530;
  outline-offset: 2px;
}

/* Full-bleed broadcast pages: the colored bands butt flush against the header and
   footer. GeneratePress separate-containers puts a 20px vertical margin on .site-main,
   which showed as a background sliver above the first band and below the last (clearest
   between the closing CTA band and the footer). Zero it on broadcast pages. */
body.mlcl-broadcast .site-main { margin-top: 0; margin-bottom: 0; }

/* ---- Non-app WordPress pages (shop, cart, account, utility pages) ---- */
body.mlcl-site:not(.mlcl-app-active) {
  background: #f4f1ea;
  color: #0c2530;
}
body.mlcl-site:not(.mlcl-app-active)::before {
  display: none;
}
body.mlcl-site:not(.mlcl-app-active) .site {
  background: #f4f1ea;
}
body.mlcl-site:not(.mlcl-app-active) .site-content {
  max-width: 1180px;
  margin: 0 auto;
  padding: 2rem 1.25rem 4rem;
}
body.mlcl-site:not(.mlcl-app-active) .inside-article,
body.mlcl-site:not(.mlcl-app-active) .woocommerce .product,
body.mlcl-site:not(.mlcl-app-active) .woocommerce-cart-form,
body.mlcl-site:not(.mlcl-app-active) .cart-collaterals,
body.mlcl-site:not(.mlcl-app-active) .woocommerce-checkout,
body.mlcl-site:not(.mlcl-app-active) .woocommerce-MyAccount-content,
body.mlcl-site:not(.mlcl-app-active) .woocommerce-MyAccount-navigation {
  background: #ffffff;
  border: 1px solid rgba(12,37,48,0.16);
  color: #0c2530;
  padding: clamp(1rem, 3vw, 2rem);
}
body.mlcl-site:not(.mlcl-app-active) .site-header {
  position: sticky;
  top: 0;
  z-index: 80;
  background: #0c2530;
  border-bottom: 4px solid #ff8b48;
  color: #f4f1ea;
}
body.mlcl-site:not(.mlcl-app-active) .site-header__ticker {
  display: flex;
  justify-content: center;
  gap: 1rem;
  flex-wrap: wrap;
  background: #ff8b48;
  color: #0c2530;
  font-size: 0.72rem;
  font-weight: 800;
  letter-spacing: 0.1em;
  padding: 0.35rem 1rem;
  text-transform: uppercase;
}
body.mlcl-site:not(.mlcl-app-active) .site-header__ticker-link {
  color: inherit;
  font-weight: 800;
  text-decoration: none;
}
#wpadminbar {
  background: #1d2327 !important;
  color: #f0f6f8 !important;
}
#wpadminbar .ab-item,
#wpadminbar a.ab-item,
#wpadminbar > #wp-toolbar span.ab-label,
#wpadminbar > #wp-toolbar span.noticon,
#wpadminbar .ab-icon::before {
  color: #f0f6f8 !important;
}
#wpadminbar .ab-top-menu > li.hover > .ab-item,
#wpadminbar .ab-top-menu > li:hover > .ab-item,
#wpadminbar .ab-top-menu > li > .ab-item:focus {
  background: #0c2530 !important;
  color: #ffffff !important;
}
body.mlcl-site:not(.mlcl-app-active) .site-header__inner,
body.mlcl-site:not(.mlcl-app-active) .site-footer__inner {
  width: min(1180px, calc(100vw - 2rem));
  margin: 0 auto;
}
body.mlcl-site:not(.mlcl-app-active) .site-header__inner {
  display: flex;
  align-items: center;
  gap: 1.25rem;
  padding: 0.95rem 0;
}
body.mlcl-site:not(.mlcl-app-active) .site-header__logo {
  display: inline-flex;
  align-items: center;
  color: #f4f1ea;
  text-decoration: none;
}
body.mlcl-site:not(.mlcl-app-active) .site-header__logo .mlcl-brand--nav {
  display: block;
  width: auto;
  height: 44px;
}
body.mlcl-site:not(.mlcl-app-active) .site-header__nav {
  margin-left: auto;
}
body.mlcl-site:not(.mlcl-app-active) .nav-menu,
body.mlcl-site:not(.mlcl-app-active) .footer-menu {
  display: flex;
  align-items: center;
  gap: 1rem;
  list-style: none;
  margin: 0;
  padding: 0;
}
body.mlcl-site:not(.mlcl-app-active) .nav-menu a,
body.mlcl-site:not(.mlcl-app-active) .footer-menu a {
  color: inherit;
  font-size: 0.78rem;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-decoration: none;
  text-transform: uppercase;
}
body.mlcl-site:not(.mlcl-app-active) .nav-menu .menu-item-has-children {
  position: relative;
  display: flex;
  align-items: center;
}
body.mlcl-site:not(.mlcl-app-active) .nav-menu__sub-toggle {
  /* JS-injected caret. 24px hit box keeps the bar height; the chevron is a
     border-drawn triangle so no icon font or SVG asset is needed. */
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 24px;
  height: 24px;
  margin-left: 0.15rem;
  padding: 0;
  background: none;
  border: 0;
  color: inherit;
  cursor: pointer;
}
body.mlcl-site:not(.mlcl-app-active) .nav-menu__sub-toggle::after {
  content: "";
  width: 7px;
  height: 7px;
  border-right: 2px solid currentColor;
  border-bottom: 2px solid currentColor;
  transform: rotate(45deg) translateY(-2px);
  transition: transform 0.15s ease;
}
body.mlcl-site:not(.mlcl-app-active) .menu-item-has-children.is-open > .nav-menu__sub-toggle::after {
  transform: rotate(225deg) translateY(-2px);
}
body.mlcl-site:not(.mlcl-app-active) .nav-menu .sub-menu {
  /* Closed by default; opens on hover, keyboard focus-within, or the JS
     toggle. display:none keeps the links out of the tab order while closed. */
  display: none;
  position: absolute;
  top: 100%;
  left: 50%;
  transform: translateX(-50%);
  min-width: 200px;
  margin: 0;
  padding: 0.4rem 0;
  list-style: none;
  background: #0c2530;
  border-top: 3px solid #ff8b48;
  box-shadow: 0 14px 28px rgba(12, 37, 48, 0.35);
  z-index: 90;
}
/* Open on hover or via the JS caret (disclosure pattern). Keyboard users
   open with the caret button; :focus-within is intentionally absent because
   it would re-open the panel when Escape returns focus to the parent link. */
body.mlcl-site:not(.mlcl-app-active) .nav-menu .menu-item-has-children:hover > .sub-menu,
body.mlcl-site:not(.mlcl-app-active) .nav-menu .menu-item-has-children.is-open > .sub-menu {
  display: block;
}
body.mlcl-site:not(.mlcl-app-active) .nav-menu .sub-menu a {
  display: block;
  padding: 0.55rem 1.1rem;
  white-space: nowrap;
}
body.mlcl-site:not(.mlcl-app-active) .nav-menu .sub-menu a:hover,
body.mlcl-site:not(.mlcl-app-active) .nav-menu .sub-menu a:focus {
  background: rgba(255, 139, 72, 0.14);
  color: #ff8b48;
}
body.mlcl-site:not(.mlcl-app-active) .site-header__cta,
body.mlcl-site:not(.mlcl-app-active) .button,
body.mlcl-site:not(.mlcl-app-active) button.button,
body.mlcl-site:not(.mlcl-app-active) input.button {
  background: #ff8b48;
  border: 1px solid #0c2530;
  color: #0c2530;
  font-weight: 800;
  letter-spacing: 0.08em;
  padding: 0.72rem 1rem;
  text-decoration: none;
  text-transform: uppercase;
}
body.mlcl-site:not(.mlcl-app-active) .site-header__mobile-toggle {
  /* Hidden on desktop; the mobile media query shows it. The 3 spans form the
     hamburger. 44px box meets the touch-target minimum. */
  display: none;
  flex-direction: column;
  justify-content: center;
  gap: 5px;
  width: 44px;
  height: 44px;
  padding: 11px 10px;
  margin-left: 0.5rem;
  background: none;
  border: 0;
  cursor: pointer;
  color: inherit;
}
body.mlcl-site:not(.mlcl-app-active) .site-header__mobile-toggle span {
  display: block;
  width: 100%;
  height: 2px;
  background: currentColor;
}
body.mlcl-site:not(.mlcl-app-active) .site-footer {
  background: #0c2530;
  color: #f4f1ea;
}
body.mlcl-site:not(.mlcl-app-active) .site-footer__inner {
  display: grid;
  gap: 1.25rem;
  padding: 2rem 0;
}
body.mlcl-site:not(.mlcl-app-active) .site-footer__logo {
  display: inline-block;
  color: #f4f1ea;
  margin: 0 0 0.6rem;
}
body.mlcl-site:not(.mlcl-app-active) .site-footer__logo .mlcl-brand--lockup {
  display: block;
  width: auto;
  height: 66px;
}
body.mlcl-site:not(.mlcl-app-active) .site-footer__tagline,
body.mlcl-site:not(.mlcl-app-active) .site-footer__copyright {
  color: #a8c0c8;
  margin: 0;
}

/* ---- Redesigned footer: 4-column end-cap (brand + next-night | the league |
   get in | sponsors) with the board-stripe top edge, a sponsor logo row, and a
   Fairwater script sign-off over the copyright. Overrides the single-column
   broadcast footer above. AA on the #0c2530 band throughout. ---- */
body.mlcl-site:not(.mlcl-app-active) .site-footer__inner {
  grid-template-columns: 1.6fr 1fr 1fr 1.4fr;
  gap: 2.5rem 3rem;
  padding: 3.5rem 0 2.5rem;
  align-items: start;
}
body.mlcl-site:not(.mlcl-app-active) .site-footer__col { min-width: 0; }
.site-footer__heading {
  font-family: 'Bricolage Grotesque', system-ui, sans-serif;
  font-weight: 800;
  font-size: 0.72rem;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--mlcl-teal);
  margin: 0 0 1.1rem;
}
.site-footer__nextnight {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  margin: 1rem 0 0;
  font-size: 0.82rem;
  color: #a8c0c8;
}
.site-footer__nextnight strong { color: #f4f1ea; font-weight: 700; }
.site-footer__dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--mlcl-orange);
  flex: none;
}
.site-footer__map {
  position: relative;
  overflow: hidden;
  margin-top: 1.1rem;
  border: 1px solid rgba(255, 255, 255, 0.14);
  background:
    linear-gradient(135deg, rgba(83, 194, 203, 0.14) 0 25%, transparent 25% 50%, rgba(255, 139, 72, 0.14) 50% 75%, transparent 75% 100%),
    #09202a;
  background-size: 34px 34px;
}
.site-footer__map::after {
  content: "Kneble's Lot \00b7  Mays Landing, NJ";
  position: absolute;
  left: 0.65rem;
  bottom: 2.95rem;
  z-index: 2;
  padding: 0.34rem 0.5rem;
  background: rgba(12, 37, 48, 0.88);
  color: #f4f1ea;
  font-family: 'Bricolage Grotesque', system-ui, sans-serif;
  font-size: 0.58rem;
  font-weight: 900;
  letter-spacing: 0.08em;
  line-height: 1;
  text-transform: uppercase;
}
.site-footer__map iframe {
  display: block;
  width: 100%;
  height: 132px;
  border: 0;
  filter: saturate(0.85) contrast(0.95);
  opacity: 0.82;
}
.site-footer__map-link {
  display: block;
  position: relative;
  z-index: 3;
  padding: 0.65rem 0.75rem;
  border-top: 1px solid rgba(255, 255, 255, 0.12);
  background: #0c2530;
  color: #f4f1ea;
  font-size: 0.74rem;
  font-weight: 700;
  line-height: 1.35;
  text-decoration: none;
}
.site-footer__map-link:hover { color: var(--mlcl-orange); }
body.mlcl-site:not(.mlcl-app-active) .site-footer__col .footer-menu {
  flex-direction: column;
  align-items: flex-start;
  gap: 0.4rem;
}
body.mlcl-site:not(.mlcl-app-active) .site-footer__col .footer-menu a {
  color: #a8c0c8;
  min-height: 44px;
  display: inline-flex;
  align-items: center;
  transition: color 0.15s;
}
body.mlcl-site:not(.mlcl-app-active) .site-footer__col .footer-menu a:hover {
  color: var(--mlcl-orange);
}
.footer-actions {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 0.7rem;
}
.footer-action {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  min-height: 44px;
  color: #a8c0c8;
  font-family: 'Bricolage Grotesque', system-ui, sans-serif;
  font-size: 0.82rem;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  font-weight: 700;
  text-decoration: none;
  transition: color 0.15s, background 0.15s;
}
.footer-action:hover { color: var(--mlcl-orange); }
.footer-action--primary {
  color: #241003;
  background: var(--mlcl-orange);
  padding: 0.7rem 1.15rem;
}
.footer-action--primary:hover { background: #ffa066; color: #241003; }
.footer-action--sponsor {
  padding: 0.68rem 1.15rem;
  border: 1px solid var(--mlcl-teal);
  background: rgba(83, 194, 203, 0.12);
  color: #cdeef1;
}
.footer-action--sponsor:hover {
  border-color: var(--mlcl-teal);
  background: rgba(83, 194, 203, 0.22);
  color: #fffdf8;
}
.footer-sponsors {
  list-style: none;
  margin: 0 0 1rem;
  padding: 0;
  display: flex;
  flex-wrap: wrap;
  gap: 0.6rem 1.25rem;
  align-items: center;
}
.footer-sponsor { display: inline-flex; align-items: center; }
.footer-sponsor__link {
  display: inline-flex;
  align-items: center;
  color: inherit;
  text-decoration: none;
}
.footer-sponsor__logo {
  max-height: 38px;
  width: auto;
  filter: grayscale(1) brightness(1.7);
  opacity: 0.8;
  transition: opacity 0.15s, filter 0.15s;
}
.footer-sponsor:hover .footer-sponsor__logo { filter: none; opacity: 1; }
.footer-sponsor__name {
  font-family: 'Bricolage Grotesque', system-ui, sans-serif;
  font-size: 0.8rem;
  font-weight: 700;
  color: #ccd9dd;
  letter-spacing: 0.02em;
}
.footer-sponsor-cta {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  min-height: 44px;
  color: var(--mlcl-teal);
  font-size: 0.78rem;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  text-decoration: none;
  border-bottom: 1px solid transparent;
  transition: color 0.15s, border-color 0.15s;
}
.footer-sponsor-cta::after {
  content: "->";
  color: var(--mlcl-orange);
  font-weight: 900;
}
.footer-sponsor-cta:hover {
  color: #fffdf8;
  border-color: var(--mlcl-teal);
}
body.mlcl-site:not(.mlcl-app-active) .site-footer__bottom {
  width: min(1180px, calc(100vw - 2rem));
  margin: 1rem auto 0;
  border-top: 1px solid rgba(255, 255, 255, 0.1);
  padding: 1.4rem 0 0.5rem;
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 0.5rem 1.5rem;
}
.site-footer__bottom .site-footer__copyright { font-size: 0.78rem; }
.site-footer__signoff {
  margin: 0;
  font-family: 'Fairwater Script', 'Sacramento', cursive;
  font-size: 1.6rem;
  color: var(--mlcl-orange);
  line-height: 1;
}
@media (max-width: 820px) {
  body.mlcl-site:not(.mlcl-app-active) .site-footer__inner {
    grid-template-columns: 1fr 1fr;
    gap: 2rem 2.5rem;
  }
  /* The brand column (logo + tagline + map) keeps the full row so the map and
     address never squeeze into a half-width cell. */
  body.mlcl-site:not(.mlcl-app-active) .site-footer__brand { grid-column: 1 / -1; }
}
@media (max-width: 600px) {
  /* Single, full-width column: each footer section reads cleanly top to bottom
     with comfortable spacing instead of a cramped two-up grid. */
  body.mlcl-site:not(.mlcl-app-active) .site-footer__inner {
    grid-template-columns: 1fr;
    gap: 2rem;
    padding: 2.5rem 0 2rem;
  }
  body.mlcl-site:not(.mlcl-app-active) .site-footer__logo .mlcl-brand--lockup { height: 56px; }
  .site-footer__heading { margin-bottom: 0.85rem; }
  .footer-actions { gap: 0.6rem; }
  /* Action buttons span the column so they read as full-width tap targets. */
  .footer-action--primary,
  .footer-action--sponsor {
    width: 100%;
    justify-content: center;
  }
  body.mlcl-site:not(.mlcl-app-active) .site-footer__bottom {
    flex-direction: column-reverse;
    align-items: flex-start;
    gap: 0.75rem;
    padding-top: 1.25rem;
  }
  .site-footer__signoff { font-size: 1.4rem; }
}

/* ==========================================================
   Non-app CONTENT design layer (recaps, pages, archives, Woo, 404).
   Light context: card #fff on cream #f4f1ea. Links use burnt orange
   #a84e16 (AA on light); bright #ff8b48 is decorative only.
   ========================================================== */
.mlcl-site:not(.mlcl-app-active) .site-content { max-width: 1080px; }

/* On the broadcast app pages the full-bleed band layout owns its own widths
   (each band centers its inner content at ~1200px), so the boxed-prose frame
   the non-app pages get -- the 1080px .site-content cap, the GP .grid-container
   width, the .inside-article padding + orange border-top -- is dropped here so
   the bands reach the viewport edges with no inset frame. It is scoped to
   .mlcl-broadcast (the six app pages) so the shop / blog / single-recap / Woo
   prose layout is untouched.

   Specificity note: the doubled body class (body.mlcl-broadcast.mlcl-site) is
   deliberate -- it out-weighs the body.mlcl-site:not(.mlcl-app-active) prose
   rules (which set the .inside-article padding/border and the .entry-content
   table/heading skin) so this lift wins cleanly instead of tying on source
   order. The .alignfull breakout itself is self-correcting (calc(50% - 50vw))
   and does not depend on this lift, but lifting the frame removes the visible
   boxed edge around the bands. */
body.mlcl-broadcast.mlcl-site #page.site,
body.mlcl-broadcast.mlcl-site .site-content,
body.mlcl-broadcast.mlcl-site .content-area,
body.mlcl-broadcast.mlcl-site .inside-article { max-width: none; }
body.mlcl-broadcast.mlcl-site .site-content,
body.mlcl-broadcast.mlcl-site .inside-article { padding: 0; }
body.mlcl-broadcast.mlcl-site .inside-article { border-top: 0; }

/* ==========================================================
   FULL-BLEED BROADCAST BANDS (home exemplar; foundation for the rollout)
   --------------------------------------------------------------------
   Each top-level section on a broadcast app page is a core/group with
   {"align":"full"} + a band-background class. WP's own .alignfull margin
   technique is root-padding-relative (does not reach the viewport on a
   classic GP theme), so we override it to a true 100vw breakout using the
   self-correcting calc(50% - 50vw) offset. body/html already carry
   overflow-x:hidden, so the breakout never opens a horizontal scrollbar
   (the scrollbar gutter is absorbed).

   The inner content is centered by WP's constrained-layout rule
   (.is-layout-constrained > :where(...) caps children at
   --wp--style--global--content-size = 1200px and auto-margins them), so
   body text never runs the full 1440px. The band only owns the full-bleed
   background paint and the vertical rhythm + side gutter.
   ========================================================== */
body.mlcl-broadcast .entry-content .alignfull {
  width: 100vw;
  max-width: 100vw;
  margin-left: calc(50% - 50vw);
  margin-right: calc(50% - 50vw);
}

/* Band backgrounds (full-bleed) + vertical rhythm. The mockup uses ~5.5rem
   vertical padding and a 2rem side gutter; the inner 1200px cap comes from
   the constrained group. */
body.mlcl-broadcast .entry-content .mlcl-band {
  padding-top: 5.5rem;
  padding-bottom: 5.5rem;
  padding-left: 2rem;
  padding-right: 2rem;
}
body.mlcl-broadcast .entry-content .mlcl-band--cream { background: var(--mlcl-bg); }
body.mlcl-broadcast .entry-content .mlcl-band--sand { background: var(--mlcl-bg-2); }
body.mlcl-broadcast .entry-content .mlcl-band--white { background: #fff; }

/* Section seam on light bands: cream (--mlcl-bg #f4f1ea) and sand (--mlcl-bg-2
   #eae5d8) differ by only ~1.1:1, below the ~1.2:1 the eye needs to read an edge,
   so adjacent light sections blend into one continuous slab. Darkening sand to
   force a visible tonal step would drop the muted ink on sand below AA, so the
   separation comes from a full-bleed hairline at the top of each light band
   instead. Dark bands carry the bolder board-stripe (.mlcl-band--seam) and the
   hero leads the page, so neither needs this. */
body.mlcl-broadcast .entry-content .mlcl-band--cream,
body.mlcl-broadcast .entry-content .mlcl-band--sand,
body.mlcl-broadcast .entry-content .mlcl-band--white {
  border-top: 1px solid var(--mlcl-line-strong);
}

/* Dark band: paint the ink surface AND flip the token context to the bright
   on-dark palette via the existing .ink-anchor utility (added alongside
   .mlcl-band--dark on the group). Belt-and-suspenders: also paint the bg here
   so the band is dark even if .ink-anchor is ever dropped from the markup. */
body.mlcl-broadcast .entry-content .mlcl-band--dark {
  background: var(--mlcl-bg);
  color: var(--mlcl-ink);
}

/* Board-stripe seam: a thin orange/teal/orange rule the mockup runs between
   bands (top of a band). Rendered as a ::before so no extra markup is needed;
   opt in with .mlcl-band--seam on the group. */
body.mlcl-broadcast .entry-content .mlcl-band--seam { position: relative; }
body.mlcl-broadcast .entry-content .mlcl-band--seam::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 6px;
  background: linear-gradient(90deg, var(--mlcl-orange) 0 33%, var(--mlcl-teal) 33% 66%, var(--mlcl-orange) 66% 100%);
  opacity: 0.9;
}

body.mlcl-broadcast .entry-content .mlcl-band--seam:has(h1)::before {
  height: 3px;
  opacity: 0.82;
}

/* The hero block paints its own dark ink surface (.hero.ink-anchor) and owns
   its internal padding, so when it is the full-bleed band we strip the band
   padding and let the hero's own rhythm stand. */
body.mlcl-broadcast .entry-content .mlcl-band--hero {
  padding: 0;
  background: var(--mlcl-bg);
}

/* Section heading rhythm inside bands: the converted Home leads each content
   band with a core/heading h2. On the light cream/sand bands the generic
   .entry-content h2 ink rule already applies; we just tighten the top margin
   so the heading hugs the band's top padding instead of stacking a second gap. */
body.mlcl-broadcast .entry-content .mlcl-band > .wp-block-heading:first-child,
body.mlcl-broadcast .entry-content .mlcl-band > h2:first-child,
body.mlcl-broadcast .entry-content .mlcl-band > h3:first-child { margin-top: 0; }

/* Dark stats / CTA bands: headings + prose flip to the cream-on-dark ink via
   .ink-anchor, but the generic .entry-content h2/h3/p ink rules
   (.mlcl-site:not(.mlcl-app-active) .entry-content h2 { color:#0c2530 }) would
   out-specify the token cascade and paint dark text on the dark band. Re-assert
   the cream ink under the dark band so the headings/prose stay legible (AA). */
body.mlcl-broadcast .entry-content .mlcl-band--dark h2,
body.mlcl-broadcast .entry-content .mlcl-band--dark h3,
body.mlcl-broadcast .entry-content .mlcl-band--dark h4 { color: var(--mlcl-ink); }
body.mlcl-broadcast .entry-content .mlcl-band--dark p,
body.mlcl-broadcast .entry-content .mlcl-band--dark li { color: var(--mlcl-ink-dim); }
body.mlcl-broadcast .entry-content .mlcl-band--dark a:not(.wp-block-button__link):not(.announce-ribbon-cta):not(.btn) { color: var(--mlcl-orange); }

/* ---- Shared page hero: a dark band that LEADS a page with an <h1> (Standings,
   Rosters, Updates). The home hero is its own block (.mlcl-band--hero) and the
   home closing CTA carries an <h2>, so :has(h1) targets only the page heros and
   lifts all three at once with no per-page content edits. Adds a faded diagonal
   board motif behind the content, a display-weight H1 with the orange lead-accent
   bar, and a refined subtitle. ---- */
body.mlcl-broadcast .entry-content .mlcl-band--dark:has(h1) {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  padding-top: 4.75rem;
  padding-bottom: 4.75rem;
}
body.mlcl-broadcast .entry-content .mlcl-band--dark:has(h1)::after {
  content: "";
  position: absolute;
  inset: -12% -10%;
  z-index: 0;
  background: linear-gradient(85deg, transparent 0 20%, var(--mlcl-teal-deep) 20% 30%, var(--mlcl-orange) 30% 46%, var(--mlcl-teal-deep) 46% 56%, transparent 56% 100%);
  transform: rotate(-12deg);
  opacity: 0.14;
  pointer-events: none;
}
/* Keep the board-stripe seam and the content above the diagonal motif. */
body.mlcl-broadcast .entry-content .mlcl-band--dark:has(h1)::before { z-index: 2; }
body.mlcl-broadcast .entry-content .mlcl-band--dark:has(h1) > * { position: relative; z-index: 1; }
body.mlcl-broadcast .entry-content .mlcl-band--dark:has(h1) > h1,
body.mlcl-broadcast .entry-content .mlcl-band--dark:has(h1) > .wp-block-heading {
  font-family: 'Bricolage Grotesque', system-ui, sans-serif;
  font-weight: 800;
  font-size: clamp(2.5rem, 5.5vw, 4.2rem);
  line-height: 0.95;
  letter-spacing: -0.015em;
  text-transform: uppercase;
  color: var(--mlcl-cream-on-dark, #f4f1ea);
  margin: 0 0 1.1rem;
  padding-left: 1.15rem;
  border-left: 5px solid var(--mlcl-orange);
  margin-left: 0 !important;
  margin-right: auto !important;
}
body.mlcl-broadcast .entry-content .mlcl-band--dark:has(h1) > p {
  font-size: 1.15rem;
  line-height: 1.55;
  max-width: 56ch;
  color: var(--mlcl-dim-on-dark, #a8c0c8);
  margin: 0 auto 0 0 !important;
}

/* Fairwater script accent line in a band (e.g. the "Ready to throw?" CTA's
   "Grab a partner..." line). The generic .entry-content h2/h3 rule hard-sets
   Bricolage at (0,3,1), out-specifying the bare .script (0,1,0) utility, so a
   .script heading inside a band falls back to Bricolage. Re-assert Fairwater
   with band-scoped specificity (0,4,1) and give it the mockup's display size +
   warm orange. text-transform:none undoes the uppercase the generic heading
   rule applies. */
body.mlcl-broadcast .entry-content .mlcl-band h2.script,
body.mlcl-broadcast .entry-content .mlcl-band h3.script {
  font-family: 'Fairwater Script', 'Sacramento', cursive;
  font-weight: 400;
  text-transform: none;
  letter-spacing: 0;
  font-size: clamp(1.9rem, 4vw, 2.6rem);
  line-height: 1.05;
  color: var(--mlcl-orange);
  margin: 0.2rem 0 1.6rem;
}

@media (max-width: 880px) {
  body.mlcl-broadcast .entry-content .mlcl-band {
    padding-top: 3.25rem;
    padding-bottom: 3.25rem;
    padding-left: 1.25rem;
    padding-right: 1.25rem;
  }
  body.mlcl-broadcast .entry-content .mlcl-band--hero { padding: 0; }
}

/* --- Article / page card --- */
.mlcl-site:not(.mlcl-app-active) .inside-article {
  border-top: 5px solid #ff8b48;
}
.mlcl-site:not(.mlcl-app-active) .entry-header { margin-bottom: 1.75rem; }
.mlcl-site:not(.mlcl-app-active) .entry-title,
.mlcl-site:not(.mlcl-app-active) .page-title,
.mlcl-site:not(.mlcl-app-active) .page-header .entry-title {
  font-family: 'Bricolage Grotesque', system-ui, sans-serif;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 0.01em;
  line-height: 0.98;
  font-size: clamp(2rem, 5vw, 3.25rem);
  color: #0c2530;
  margin: 0 0 0.6rem;
}
.mlcl-site:not(.mlcl-app-active) .entry-title a { color: inherit; text-decoration: none; }
/* Recap (single post) title gets the orange lead-accent bar so a recap reads as a
   branded hero, matching the page heros and section headings. Single posts only, so
   page titles and archive headers are untouched. */
.mlcl-site.single-post .entry-header .entry-title {
  padding-left: 1.15rem;
  border-left: 5px solid var(--mlcl-orange);
}
.mlcl-site:not(.mlcl-app-active) .entry-meta {
  font-family: 'Bricolage Grotesque', system-ui, sans-serif;
  font-weight: 700; font-size: 0.72rem; letter-spacing: 0.14em; text-transform: uppercase;
  color: #5f7079; display: flex; flex-wrap: wrap; gap: 0.4rem 1rem;
  padding-bottom: 1.1rem; border-bottom: 2px solid rgba(12,37,48,0.12);
}
.mlcl-site:not(.mlcl-app-active) .entry-meta a { color: #a84e16; text-decoration: none; }

/* --- Body typography --- */
.mlcl-site:not(.mlcl-app-active) .entry-content { font-size: 1.06rem; line-height: 1.7; color: #27353d; }
.mlcl-site:not(.mlcl-app-active) .entry-content > p,
.mlcl-site:not(.mlcl-app-active) .entry-content > ul,
.mlcl-site:not(.mlcl-app-active) .entry-content > ol,
.mlcl-site:not(.mlcl-app-active) .entry-content > blockquote,
.mlcl-site:not(.mlcl-app-active) .entry-content > h2,
.mlcl-site:not(.mlcl-app-active) .entry-content > h3,
.mlcl-site:not(.mlcl-app-active) .entry-content > h4 { max-width: 68ch; }
.mlcl-site:not(.mlcl-app-active) .entry-content h2 {
  font-family: 'Bricolage Grotesque', system-ui, sans-serif;
  font-weight: 800; text-transform: uppercase; letter-spacing: 0.01em;
  font-size: clamp(1.4rem, 3vw, 1.9rem); color: #0c2530;
  margin: 2.5rem 0 0.8rem; padding-left: 0.8rem; border-left: 4px solid #ff8b48;
}
.mlcl-site:not(.mlcl-app-active) .entry-content h3 {
  font-family: 'Bricolage Grotesque', system-ui, sans-serif;
  font-weight: 700; font-size: 1.25rem; color: #134654; margin: 1.8rem 0 0.5rem;
}
.mlcl-site:not(.mlcl-app-active) .entry-content h4 { font-weight: 700; color: #0c2530; margin: 1.4rem 0 0.4rem; }
.mlcl-site:not(.mlcl-app-active) .entry-content p { margin: 0 0 1.1rem; }
.mlcl-site:not(.mlcl-app-active) .entry-content a { color: #a84e16; text-decoration: underline; text-underline-offset: 2px; font-weight: 600; }
.mlcl-site:not(.mlcl-app-active) .entry-content a:hover { color: #0c2530; }

/* Button-styled links must not show the prose underline.
   Covers: .btn (hero/standings ghost/primary), .wp-block-button__link (WP buttons),
   and .announce-ribbon-cta (orange-band signup link, whose color is also
   restored to navy so it passes AA on the orange background). */
.mlcl-site:not(.mlcl-app-active) .entry-content a.btn,
.mlcl-site:not(.mlcl-app-active) .entry-content .wp-block-button a,
.mlcl-site:not(.mlcl-app-active) .entry-content a.wp-block-button__link { text-decoration: none; }
.mlcl-site:not(.mlcl-app-active) .entry-content a.btn:hover,
.mlcl-site:not(.mlcl-app-active) .entry-content .wp-block-button a:hover,
.mlcl-site:not(.mlcl-app-active) .entry-content a.wp-block-button__link:hover { text-decoration: none; }

/* announce-ribbon-cta: restore navy ink (rust #a84e16 on orange #ff8b48 = 2.5:1, fails AA).
   Remove underline too -- it is a standalone CTA link, not inline prose. */
.mlcl-site:not(.mlcl-app-active) .entry-content a.announce-ribbon-cta { color: #0c2530; font-weight: 700; text-decoration: none; }
.mlcl-site:not(.mlcl-app-active) .entry-content a.announce-ribbon-cta:hover { color: #1a4252; text-decoration: none; }
.mlcl-site:not(.mlcl-app-active) .entry-content ul,
.mlcl-site:not(.mlcl-app-active) .entry-content ol { margin: 0 0 1.2rem; padding-left: 1.3rem; }
.mlcl-site:not(.mlcl-app-active) .entry-content li { margin: 0 0 0.4rem; }
.mlcl-site:not(.mlcl-app-active) .entry-content blockquote {
  border-top: 3px solid var(--mlcl-teal); border-left: 0; background: #f4f1ea; margin: 1.5rem 0;
  padding: 1rem 1.25rem; font-style: italic; color: #27353d;
}
.mlcl-site:not(.mlcl-app-active) .entry-content img { height: auto; border: 1px solid rgba(12,37,48,0.14); }
.mlcl-site:not(.mlcl-app-active) .entry-content figcaption,
.mlcl-site:not(.mlcl-app-active) .wp-caption-text { font-size: 0.8rem; color: #5f7079; text-align: center; margin-top: 0.4rem; }
.mlcl-site:not(.mlcl-app-active) .entry-content hr { border: none; border-top: 2px solid rgba(12,37,48,0.12); margin: 2rem 0; }

/* --- Tables (recap standings) -> broadcast style --- */
.mlcl-site:not(.mlcl-app-active) .entry-content table {
  width: 100%; border-collapse: collapse; margin: 1.25rem 0 2rem;
  font-variant-numeric: tabular-nums; border: 1px solid rgba(12,37,48,0.15); background: #fff;
}
.mlcl-site:not(.mlcl-app-active) .entry-content thead th,
.mlcl-site:not(.mlcl-app-active) .entry-content tr:first-child th {
  background: #0c2530; color: #f4f1ea;
  font-family: 'Bricolage Grotesque', system-ui, sans-serif;
  font-weight: 800; text-transform: uppercase; letter-spacing: 0.05em;
  font-size: 0.7rem; text-align: left; padding: 0.6rem 0.8rem;
}
.mlcl-site:not(.mlcl-app-active) .entry-content td,
.mlcl-site:not(.mlcl-app-active) .entry-content tbody th {
  padding: 0.55rem 0.8rem; border-bottom: 1px solid rgba(12,37,48,0.1); text-align: left;
}
.mlcl-site:not(.mlcl-app-active) .entry-content tbody tr:nth-child(even) { background: #f7f4ec; }
.mlcl-site:not(.mlcl-app-active) .entry-content tbody tr:hover { background: #e4efe9; }

/* --- Archive: title + entry cards --- */
.mlcl-site:not(.mlcl-app-active) .page-header {
  border-bottom: 3px solid #ff8b48; margin-bottom: 1.5rem; padding-bottom: 0.75rem;
}
.mlcl-site:not(.mlcl-app-active) .archive-description { color: #5f7079; }
.mlcl-site:not(.mlcl-app-active) .blog .inside-article .entry-title,
.mlcl-site:not(.mlcl-app-active) .archive .inside-article .entry-title { font-size: clamp(1.4rem, 3vw, 2rem); }
.mlcl-site:not(.mlcl-app-active) .blog article.inside-article,
.mlcl-site:not(.mlcl-app-active) .archive article.inside-article { margin-bottom: 1.5rem; }
.mlcl-site:not(.mlcl-app-active) .read-more,
.mlcl-site:not(.mlcl-app-active) .more-link {
  display: inline-block; margin-top: 0.5rem; color: #a84e16; font-weight: 800;
  text-transform: uppercase; letter-spacing: 0.06em; font-size: 0.8rem; text-decoration: none;
}

/* --- Pagination / post nav --- */
.mlcl-site:not(.mlcl-app-active) .nav-links,
.mlcl-site:not(.mlcl-app-active) .pagination { display: flex; gap: 0.5rem; flex-wrap: wrap; margin-top: 2rem; }
.mlcl-site:not(.mlcl-app-active) .nav-links a,
.mlcl-site:not(.mlcl-app-active) .pagination a,
.mlcl-site:not(.mlcl-app-active) .pagination .current {
  padding: 0.55rem 0.9rem; border: 1px solid rgba(12,37,48,0.2); color: #0c2530;
  font-weight: 700; text-decoration: none; background: #fff;
}
.mlcl-site:not(.mlcl-app-active) .pagination .current { background: #ff8b48; border-color: #0c2530; }

/* --- 404 --- */
.mlcl-site:not(.mlcl-app-active) .error-404 .page-title { font-size: clamp(2.5rem, 9vw, 5rem); }

/* --- Search form (404 + widgets) --- */
.mlcl-site:not(.mlcl-app-active) .search-submit,
.mlcl-site:not(.mlcl-app-active) .wp-block-search__button {
  background: #ff8b48; color: #0c2530; border: 1px solid #0c2530;
  font-weight: 800; text-transform: uppercase; letter-spacing: 0.06em; padding: 0 1rem;
}

/* --- WooCommerce --- */
.mlcl-site:not(.mlcl-app-active) .woocommerce-message,
.mlcl-site:not(.mlcl-app-active) .woocommerce-info,
.mlcl-site:not(.mlcl-app-active) .woocommerce-error {
  border-top: 3px solid #ff8b48; background: #fff; color: #0c2530; padding: 1rem 1.25rem; list-style: none;
}
.mlcl-site:not(.mlcl-app-active) ul.products { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 1.5rem; list-style: none; margin: 1.5rem 0 0; padding: 0; }
.mlcl-site:not(.mlcl-app-active) ul.products li.product { width: auto !important; float: none !important; margin: 0 !important; background: #fff; border: 1px solid rgba(12,37,48,0.14); padding: 1rem; text-align: left; }
.mlcl-site:not(.mlcl-app-active) ul.products li.product img { width: 100%; margin: 0 0 0.6rem; }
.mlcl-site:not(.mlcl-app-active) ul.products li.product a.button,
.mlcl-site:not(.mlcl-app-active) ul.products li.product a.added_to_cart { margin-top: 0.6rem; display: inline-block; }
.mlcl-site:not(.mlcl-app-active) ul.products li.product .woocommerce-loop-product__title { font-family: 'Bricolage Grotesque', system-ui, sans-serif; font-weight: 700; font-size: 1rem; text-transform: uppercase; color: #0c2530; padding: 0.6rem 0 0.3rem; }
.mlcl-site:not(.mlcl-app-active) .price,
.mlcl-site:not(.mlcl-app-active) ul.products li.product .price { color: #0c2530; font-family: 'Bricolage Grotesque', system-ui, sans-serif; font-weight: 800; }
.mlcl-site:not(.mlcl-app-active) .product_title { font-family: 'Bricolage Grotesque', system-ui, sans-serif; font-weight: 800; text-transform: uppercase; color: #0c2530; }
.mlcl-site:not(.mlcl-app-active) .woocommerce table.shop_table th { background: #0c2530; color: #f4f1ea; text-transform: uppercase; font-size: 0.72rem; letter-spacing: 0.05em; }
.mlcl-site:not(.mlcl-app-active) .woocommerce-MyAccount-navigation ul { list-style: none; margin: 0; padding: 0; }
.mlcl-site:not(.mlcl-app-active) .woocommerce-MyAccount-navigation a { color: #0c2530; font-weight: 700; }

/* WooCommerce classic markup. NOTE: `.woocommerce` is a BODY class here (same
   element as .mlcl-site), not a wrapper div -- so it cannot be used as a
   descendant combinator. Body scope + !important overrides Woo's brand purple
   (#7f54b3) buttons and olive (#958e09) price. */
.mlcl-site:not(.mlcl-app-active) a.button,
.mlcl-site:not(.mlcl-app-active) button.button,
.mlcl-site:not(.mlcl-app-active) input.button,
.mlcl-site:not(.mlcl-app-active) .button.alt,
.mlcl-site:not(.mlcl-app-active) .single_add_to_cart_button {
  background: #ff8b48 !important; color: #0c2530 !important; border: 1px solid #0c2530 !important;
  font-family: 'Bricolage Grotesque', system-ui, sans-serif; font-weight: 800 !important;
  text-transform: uppercase; letter-spacing: 0.06em;
}
.mlcl-site:not(.mlcl-app-active) a.button:hover,
.mlcl-site:not(.mlcl-app-active) button.button:hover,
.mlcl-site:not(.mlcl-app-active) .single_add_to_cart_button:hover { background: #e87a3a !important; }
.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-form-card .gform_footer input[type="submit"].gform_button.button,
.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-sponsor-checkout .gform_footer input[type="submit"].gform_button.button {
  display: inline-flex;
  min-width: 9rem;
  min-height: 48px;
  align-items: center;
  justify-content: center;
  padding: 0.8rem 1.25rem;
  border: 1px solid #0c2530 !important;
  border-radius: 0;
  background: var(--mlcl-orange) !important;
  color: #0c2530 !important;
  font-family: 'Bricolage Grotesque', system-ui, sans-serif;
  font-size: 0.78rem;
  font-weight: 900 !important;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}
.mlcl-site:not(.mlcl-app-active) .single_add_to_cart_button.disabled,
.mlcl-site:not(.mlcl-app-active) .button.disabled,
.mlcl-site:not(.mlcl-app-active) .button:disabled { opacity: 0.5 !important; cursor: not-allowed; }
.mlcl-site:not(.mlcl-app-active) div.product p.price,
.mlcl-site:not(.mlcl-app-active) div.product span.price,
.mlcl-site:not(.mlcl-app-active) ul.products li.product .price {
  color: #0c2530 !important; font-family: 'Bricolage Grotesque', system-ui, sans-serif;
  font-weight: 800 !important; font-size: 1.4rem;
}
.mlcl-site:not(.mlcl-app-active) div.product .product_title { font-size: clamp(1.8rem, 4vw, 3rem); }
.mlcl-site:not(.mlcl-app-active) div.product .woocommerce-product-details__short-description a,
.mlcl-site:not(.mlcl-app-active) .woocommerce-breadcrumb a,
.mlcl-site:not(.mlcl-app-active) div.product .product_meta a { color: #a84e16; }
/* Variation selector table must not inherit the recap-table dark header. */
.mlcl-site:not(.mlcl-app-active) table.variations th,
.mlcl-site:not(.mlcl-app-active) table.variations td {
  background: transparent !important; color: #0c2530 !important; border: none;
  padding: 0.45rem 0.7rem 0.45rem 0; text-align: left;
  font-family: 'Bricolage Grotesque', system-ui, sans-serif;
  text-transform: uppercase; font-size: 0.78rem; letter-spacing: 0.08em;
}
/* Single product: description tabs, related products, gallery, quantity */
.mlcl-site:not(.mlcl-app-active) .woocommerce-tabs ul.tabs {
  border-bottom: 2px solid rgba(12,37,48,0.15); padding: 0; margin: 2.5rem 0 0;
  display: flex; gap: 0.25rem; flex-wrap: wrap; list-style: none;
}
.mlcl-site:not(.mlcl-app-active) .woocommerce-tabs ul.tabs::before { display: none; }
.mlcl-site:not(.mlcl-app-active) .woocommerce-tabs ul.tabs li { background: transparent; border: none; margin: 0; padding: 0; border-radius: 0; }
.mlcl-site:not(.mlcl-app-active) .woocommerce-tabs ul.tabs li::before,
.mlcl-site:not(.mlcl-app-active) .woocommerce-tabs ul.tabs li::after { display: none; }
.mlcl-site:not(.mlcl-app-active) .woocommerce-tabs ul.tabs li a {
  font-family: 'Bricolage Grotesque', system-ui, sans-serif; font-weight: 800;
  text-transform: uppercase; letter-spacing: 0.06em; font-size: 0.8rem;
  color: #5f7079; padding: 0.6rem 1rem; display: block;
}
.mlcl-site:not(.mlcl-app-active) .woocommerce-tabs ul.tabs li.active a { color: #0c2530; box-shadow: inset 0 -3px 0 #ff8b48; }
.mlcl-site:not(.mlcl-app-active) .woocommerce-tabs .panel { padding-top: 1.25rem; }
.mlcl-site:not(.mlcl-app-active) .related.products > h2,
.mlcl-site:not(.mlcl-app-active) .upsells.products > h2 {
  font-family: 'Bricolage Grotesque', system-ui, sans-serif; font-weight: 800;
  text-transform: uppercase; letter-spacing: 0.01em; color: #0c2530;
  border-left: 4px solid #ff8b48; padding-left: 0.7rem; margin-top: 2.75rem;
}
.mlcl-site:not(.mlcl-app-active) .woocommerce-product-gallery { border: 1px solid rgba(12,37,48,0.12); background: #fff; }
.mlcl-site:not(.mlcl-app-active) .quantity input.qty {
  border: 1px solid rgba(12,37,48,0.25); padding: 0.45rem; font-weight: 700;
  font-family: 'Bricolage Grotesque', system-ui, sans-serif; background: #fff; color: #0c2530;
}

/* WooCommerce Cart/Checkout BLOCKS (wc-block-*) -- newer Gutenberg markup the
   classic .button rules do not reach. Match the broadcast CTA. */
.mlcl-site:not(.mlcl-app-active) .wc-block-components-button,
.mlcl-site:not(.mlcl-app-active) .wc-block-cart__submit-button,
.mlcl-site:not(.mlcl-app-active) .wc-block-components-checkout-place-order-button {
  background: #ff8b48 !important; color: #0c2530 !important; border: 1px solid #0c2530 !important;
  border-radius: 0 !important; box-shadow: none !important; text-decoration: none !important;
  font-family: 'Bricolage Grotesque', system-ui, sans-serif; font-weight: 800 !important;
  text-transform: uppercase; letter-spacing: 0.06em;
}
.mlcl-site:not(.mlcl-app-active) .wc-block-components-button:hover { background: #e87a3a !important; }
.mlcl-site:not(.mlcl-app-active) .wc-block-components-button__text { text-decoration: none !important; }
.mlcl-site:not(.mlcl-app-active) .wp-block-woocommerce-cart h2,
.mlcl-site:not(.mlcl-app-active) .wp-block-woocommerce-checkout h2,
.mlcl-site:not(.mlcl-app-active) .wc-block-components-title {
  font-family: 'Bricolage Grotesque', system-ui, sans-serif; font-weight: 800;
  text-transform: uppercase; letter-spacing: 0.01em; color: #0c2530;
}

/* --- Non-app mobile --- */
@media (max-width: 600px) {
  .mlcl-site:not(.mlcl-app-active) .entry-content table {
    display: block; overflow-x: auto; -webkit-overflow-scrolling: touch; white-space: nowrap;
  }
  .mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-table-scroll table,
  .mlcl-site:not(.mlcl-app-active) .entry-content .table-scroll table {
    display: table;
    overflow: visible;
    white-space: normal;
  }
  .mlcl-site:not(.mlcl-app-active) ul.products { grid-template-columns: 1fr 1fr; gap: 1rem; }
}

@media (max-width: 720px) {
  body.mlcl-site:not(.mlcl-app-active) .site-header__inner {
    flex-wrap: wrap;
  }

  body.mlcl-site:not(.mlcl-app-active) .site-header__mobile-toggle {
    display: inline-flex;
  }

  body.mlcl-site:not(.mlcl-app-active) .site-header__nav {
    order: 3;
    width: 100%;
    /* Collapsed by default on mobile; mlcl.js adds .is-open on the toggle
       click. Without this the 6 links rendered a 433px-tall open menu that
       buried the hero on every page. */
    display: none;
  }

  body.mlcl-site:not(.mlcl-app-active) .site-header__nav.is-open {
    display: block;
  }

  body.mlcl-site:not(.mlcl-app-active) .nav-menu {
    align-items: flex-start;
    flex-direction: column;
  }

  /* Mobile: dropdown children render inline and stay visible (content is
     never collapsed by default on mobile), so the caret toggle goes away. */
  body.mlcl-site:not(.mlcl-app-active) .nav-menu .menu-item-has-children {
    display: block;
  }
  body.mlcl-site:not(.mlcl-app-active) .nav-menu__sub-toggle {
    display: none;
  }
  body.mlcl-site:not(.mlcl-app-active) .nav-menu .sub-menu {
    display: block;
    position: static;
    transform: none;
    min-width: 0;
    margin: 0.35rem 0 0.2rem 0.9rem;
    padding: 0 0 0 0.75rem;
    background: none;
    border-top: 0;
    border-left: 2px solid rgba(255, 139, 72, 0.45);
    box-shadow: none;
  }
  body.mlcl-site:not(.mlcl-app-active) .nav-menu .sub-menu a {
    padding: 0.35rem 0;
    white-space: normal;
  }
  body.mlcl-site:not(.mlcl-app-active) .nav-menu .sub-menu a:hover,
  body.mlcl-site:not(.mlcl-app-active) .nav-menu .sub-menu a:focus {
    background: none;
  }

  .live-form-layout {
    grid-template-columns: 1fr;
  }

  .live-form-aside {
    position: static;
  }

  .live-form-points {
    grid-template-columns: 1fr;
  }

  .live-form-points div,
  .live-form-points div:nth-child(2n),
  .live-form-points div:nth-last-child(-n+2) {
    border-right: 0;
    border-bottom: 1px solid var(--mlcl-line);
  }

  .live-form-points div:last-child {
    border-bottom: 0;
  }

  .form-panel-head {
    align-items: flex-start;
    flex-direction: column;
  }
}

/* Server-rendered standings groups (regular table, or A Bracket / B Bracket during playoffs). */
.mlcl-standings{max-width:900px;margin:0 auto;padding:1.5rem 1rem 3rem}
.mlcl-standings h1{color:var(--mlcl-accent-ink);text-transform:uppercase;letter-spacing:.04em;font-size:1.9rem;margin:0 0 1rem}
.mlcl-standings-group{margin:1.6rem 0 0}
.mlcl-standings-group__label{color:var(--mlcl-teal-ink);text-transform:uppercase;letter-spacing:.06em;border-bottom:2px solid var(--mlcl-line-strong);padding-bottom:.4rem;font-size:1.25rem;margin:0 0 .6rem}
.mlcl-standings table{width:100%;border-collapse:collapse;background:var(--mlcl-bg-2);border:1px solid var(--mlcl-line)}
.mlcl-standings th,.mlcl-standings td{padding:.5rem .7rem;text-align:left;border-bottom:1px solid var(--mlcl-line)}
.mlcl-standings th{color:var(--mlcl-ink-mute);text-transform:uppercase;font-size:.7rem;letter-spacing:.06em}
.mlcl-standings tbody tr:last-child td{border-bottom:0}
.mlcl-standings-leader{background:rgba(255,139,72,.14)}
.mlcl-standings-leader td{font-weight:700;color:var(--mlcl-accent-ink)}
.mlcl-standings-absent td{color:var(--mlcl-ink-mute);opacity:.55}
.mlcl-absent-tag{font-size:.65rem;text-transform:uppercase;letter-spacing:.05em;color:var(--mlcl-ink-mute);margin-left:.3rem}
/* Converted standings page (light table): the leader + absent text otherwise use
   the dark-theme bright tokens (accent-ink orange, ink-mute), which fail WCAG AA
   on near-white. Use dark variants, scoped to .entry-content so the SPA standings
   view (which renders these on a dark surface) is untouched. The .55 opacity is
   dropped because it further erodes contrast; the muted slate color carries the
   de-emphasis instead. */
.entry-content .mlcl-standings-leader td { color: #b5400c; }
.entry-content .mlcl-standings-absent td { color: #51626a; opacity: 1; }
.entry-content .mlcl-absent-tag { color: #51626a; }

/* ---- Screen-reader only utility ---- */
.sr-only {
  position: absolute !important;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
  white-space: nowrap;
  border: 0;
}

/* ---- View root: focus target after SPA route change ---- */
.mlcl-view-root:focus {
  outline: none;
}

/* ---- Reduced-motion: freeze all decorative animations ---- */
@media (prefers-reduced-motion: reduce) {
  /* Sponsors row (infinite CSS scroll) */
  .sponsors-row {
    animation: none !important;
  }

  /* Hero bag-toss loop */
  [data-hero="animated"] .hero-bag-1,
  [data-hero="animated"] .hero-bag-2 {
    animation: none !important;
    opacity: 0;
  }

  /* Pulse keyframe: live pill dot, season-eyebrow dot, map pin dot */
  .pill-live::before,
  .next-season-eyebrow .dot,
  .map-pin-dot {
    animation: none !important;
  }

  /* Reveal entrance transitions */
  .reveal,
  .reveal.in {
    opacity: 1 !important;
    transform: none !important;
    transition: none !important;
  }

  /* General transition suppression for interactive elements */
  .btn,
  .nav-link,
  .faq-toggle,
  .flip-inner,
  .week-tile {
    transition: none !important;
  }

  /* FAQ expand animation */
  .faq-a {
    transition: none !important;
  }
}

/* ============================================================================
   EDITORIAL: blog archive, standard post, and recap single.
   Chrome is injected by inc/editorial.php on generate_after_header (top) and
   generate_after_primary_content_area (bottom). Dark bands use the
   theme-invariant aliases (--mlcl-navy, --mlcl-cream-on-dark,
   --mlcl-dim-on-dark, --mlcl-orange, --mlcl-teal) because these views run the
   light theme, where the theme tokens resolve to cream; light-context
   elements use the regular --mlcl-* tokens. Buttons are rectangular.
   ============================================================================ */

/* Full-bleed utility: the same calc(50% - 50vw) breakout the app pages use, so
   a band reaches the viewport edges whether it is injected outside #page (hero)
   or inside #content (author / related / sponsor / CTA). */
.mlcl-ed-full { width: 100vw; max-width: 100vw; margin-left: calc(50% - 50vw); margin-right: calc(50% - 50vw); }
.mlcl-ed-wrap { max-width: 1200px; margin: 0 auto; padding: 0 2rem; }
.mlcl-ed-wrap--narrow { max-width: 880px; }
.mlcl-ed-script { font-family: 'Fairwater Script', 'Sacramento', cursive; font-weight: 400; }
.mlcl-ed-stripe { height: 6px; width: 100%;
  background: linear-gradient(90deg, var(--mlcl-orange) 0 33%, var(--mlcl-teal) 33% 66%, var(--mlcl-orange) 66% 100%); opacity: 0.92; }

/* --- Hero / page-header band (dark) --- */
.mlcl-ed-hero { background: var(--mlcl-navy); color: var(--mlcl-cream-on-dark); }
.mlcl-ed-hero .mlcl-ed-wrap { padding-top: 3.4rem; padding-bottom: 3.6rem; }
.mlcl-ed-kick { font-family: 'Bricolage Grotesque', system-ui, sans-serif; text-transform: uppercase;
  letter-spacing: 0.18em; font-size: 0.78rem; color: var(--mlcl-teal); margin: 0 0 0.9rem; font-weight: 600; }
.mlcl-ed-title { font-family: 'Bricolage Grotesque', system-ui, sans-serif; font-weight: 800;
  font-size: clamp(2rem, 5vw, 3rem); line-height: 1.02; letter-spacing: -0.02em; color: var(--mlcl-cream-on-dark); margin: 0; }
.mlcl-ed-lede { color: var(--mlcl-dim-on-dark); font-size: 1.12rem; max-width: 52ch; margin: 1.1rem 0 0; }
.mlcl-ed-by { display: flex; flex-wrap: wrap; gap: 0.5rem 1.2rem; margin-top: 1.3rem;
  font-size: 0.86rem; color: var(--mlcl-dim-on-dark); }
.mlcl-ed-by b { color: var(--mlcl-cream-on-dark); font-weight: 700; }
.mlcl-ed-hero--post .mlcl-ed-title { max-width: 22ch; }

/* category label, color coded; bright tints on the dark hero */
.mlcl-ed-cat { font-family: 'Bricolage Grotesque', system-ui, sans-serif; font-size: 0.72rem;
  font-weight: 800; text-transform: uppercase; letter-spacing: 0.14em; color: var(--mlcl-accent-ink);
  margin: 0 0 1rem; display: inline-flex; align-items: center; gap: 0.5rem; }
.mlcl-ed-cat::before { content: ""; width: 1.6rem; height: 3px; background: currentColor; border-radius: 2px; }
.mlcl-ed-cat--update { color: var(--mlcl-teal-ink); }
.mlcl-ed-cat--news { color: #8a5a00; }
.mlcl-ed-hero .mlcl-ed-cat { color: var(--mlcl-orange); }
.mlcl-ed-hero .mlcl-ed-cat--update { color: var(--mlcl-teal); }
.mlcl-ed-hero .mlcl-ed-cat--news { color: #e6b860; } /* gold tint, no token exists; single use */

/* --- Stat strip (recap; renders when hand-set, Phase B) --- */
.mlcl-ed-statstrip { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1rem;
  margin-top: 1.8rem; padding-top: 1.6rem; border-top: 1px solid rgba(255, 255, 255, 0.1); }
.mlcl-ed-stat { text-align: left; }
.mlcl-ed-stat-n { font-family: 'Bricolage Grotesque', system-ui, sans-serif; font-weight: 800;
  font-size: 1.9rem; line-height: 1; color: var(--mlcl-orange); font-variant-numeric: tabular-nums; }
.mlcl-ed-stat-n.mlcl-teal { color: var(--mlcl-teal); }
.mlcl-ed-stat-l { font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.08em;
  color: var(--mlcl-dim-on-dark); margin-top: 0.4rem; }

/* --- Filter bar (sticky) --- */
.mlcl-ed-filters { background: var(--mlcl-bg); border-bottom: 1px solid var(--mlcl-line);
  position: sticky; top: 0; z-index: 20; }
.mlcl-ed-filters .mlcl-ed-wrap { display: flex; gap: 0.7rem; align-items: center; flex-wrap: wrap;
  padding-top: 0.9rem; padding-bottom: 0.9rem; }
.mlcl-ed-chip { font-size: 0.8rem; font-weight: 600; text-decoration: none; color: var(--mlcl-ink-dim);
  padding: 0.45rem 0.95rem; border: 1px solid var(--mlcl-line); border-radius: 3px;
  background: #fff; transition: border-color 0.15s, color 0.15s; }
.mlcl-ed-chip:hover { border-color: var(--mlcl-orange); color: var(--mlcl-ink); }
.mlcl-ed-chip.is-active { background: #0c2530; color: #f4f1ea; border-color: #0c2530; }

/* --- Bands --- */
.mlcl-ed-band--sand { background: var(--mlcl-bg-2); }
.mlcl-ed-band--cream { background: var(--mlcl-bg); }
.mlcl-ed-band--dark { background: #0c2530; color: #f4f1ea; }
.mlcl-ed-band { padding: 0; }
.mlcl-ed-band .mlcl-ed-wrap { padding-top: 3rem; padding-bottom: 3rem; }

/* section heading inside a band */
.mlcl-ed-shead { display: flex; align-items: baseline; gap: 1rem; margin-bottom: 1.6rem; }
.mlcl-ed-shead h2 { font-family: 'Bricolage Grotesque', system-ui, sans-serif; font-weight: 800;
  font-size: 1.7rem; letter-spacing: -0.01em; color: var(--mlcl-ink); margin: 0;
  text-transform: none; border: 0; padding: 0; }
.mlcl-ed-accent { width: 5px; align-self: stretch; min-height: 1.6rem; background: var(--mlcl-orange);
  border-radius: 2px; flex: none; }

/* --- Author card --- */
.mlcl-ed-author-row { display: flex; gap: 1.3rem; align-items: center; }
.mlcl-ed-av { width: 64px; height: 64px; border-radius: 50%; flex: none; font-weight: 800; font-size: 1.4rem;
  background: radial-gradient(circle at 35% 30%, #53C2CB, #187070); color: #04231f;
  display: flex; align-items: center; justify-content: center; }
.mlcl-ed-who b { font-size: 1.05rem; color: var(--mlcl-ink); }
.mlcl-ed-who span { display: block; font-size: 0.86rem; color: var(--mlcl-ink-mute); margin-top: 0.15rem; }
.mlcl-ed-who p { font-size: 0.92rem; color: var(--mlcl-ink-dim); margin: 0.5rem 0 0; max-width: 56ch; }

/* --- Related cards (and archive cards share .mlcl-ed-card) --- */
.mlcl-ed-cards { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.6rem; }
.mlcl-ed-card { background: #fff; border: 1px solid var(--mlcl-line); border-radius: 4px; overflow: hidden;
  display: flex; flex-direction: column; transition: transform 0.16s, border-color 0.16s, box-shadow 0.16s; }
.mlcl-ed-card:hover { transform: translateY(-3px); border-color: var(--mlcl-orange);
  box-shadow: 0 14px 30px rgba(12, 37, 48, 0.1); }
.mlcl-ed-card-ph { position: relative; display: block; aspect-ratio: 16 / 10;
  background: linear-gradient(135deg, #1a4252, #0c2530); overflow: hidden; }
.mlcl-ed-card-ph img { width: 100%; height: 100%; object-fit: cover; border: 0; }
.mlcl-ed-card-ph::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 5px;
  background: linear-gradient(90deg, #FF8B48 0 33%, #53C2CB 33% 66%, #FF8B48 66% 100%); }
.mlcl-ed-card-body { padding: 1.2rem 1.3rem 1.4rem; display: flex; flex-direction: column; gap: 0.5rem; flex: 1; }
.mlcl-ed-card-body h3 { font-family: 'Bricolage Grotesque', system-ui, sans-serif; font-weight: 800;
  font-size: 1.2rem; line-height: 1.12; letter-spacing: -0.01em; margin: 0; }
.mlcl-ed-card-body h3 a { color: var(--mlcl-ink); text-decoration: none; }
.mlcl-ed-card:hover h3 a { color: var(--mlcl-accent-ink); }
.mlcl-ed-stamp { font-size: 0.74rem; color: var(--mlcl-ink-mute); margin: 0; }

/* --- Sponsor band --- */
.mlcl-ed-sponsors .mlcl-ed-wrap { text-align: center; }
.mlcl-ed-sponsors-lead { font-size: 0.78rem; text-transform: uppercase; letter-spacing: 0.16em;
  color: var(--mlcl-ink-mute); font-weight: 700; margin: 0; }
.mlcl-ed-sponsors-lead .mlcl-ed-script { display: block; font-size: 2rem; color: var(--mlcl-accent-ink);
  letter-spacing: 0; text-transform: none; margin-top: 0.2rem; }
.mlcl-ed-sponsors-logos { display: flex; gap: 1rem 3rem; justify-content: center; align-items: center;
  flex-wrap: wrap; margin-top: 1.4rem; }
.mlcl-ed-sponsors-logos a { text-decoration: none; color: var(--mlcl-ink); font-weight: 800; font-size: 1.3rem;
  display: inline-flex; flex-direction: column; align-items: center; gap: 0.2rem; transition: color 0.15s; }
.mlcl-ed-sponsors-logos a span { font-size: 0.72rem; font-weight: 600; color: var(--mlcl-ink-mute);
  text-transform: uppercase; letter-spacing: 0.08em; }
.mlcl-ed-sponsors-logos a:hover { color: var(--mlcl-accent-ink); }

/* --- CTA band --- */
.mlcl-ed-cta { position: relative; }
.mlcl-ed-cta .mlcl-ed-stripe { position: absolute; top: 0; left: 0; }
.mlcl-ed-cta .mlcl-ed-wrap { text-align: center; padding-top: 3.6rem; padding-bottom: 3.6rem; }
.mlcl-ed-cta h2 { font-family: 'Bricolage Grotesque', system-ui, sans-serif; font-weight: 800;
  font-size: clamp(1.9rem, 4vw, 2.4rem); letter-spacing: -0.01em; color: #f4f1ea; margin: 0; border: 0; padding: 0; }
.mlcl-ed-cta-script { font-size: 2rem; color: #FF8B48; margin: 0.1rem 0 1.4rem; }
.mlcl-ed-cta-sub { color: #a8c0c8; max-width: 46ch; margin: 0 auto 1.6rem; }
.mlcl-ed-join { display: inline-block; background: #FF8B48; color: #241003; font-weight: 700;
  text-decoration: none; padding: 0.85rem 1.8rem; border-radius: 3px; font-size: 1rem; letter-spacing: 0.04em;
  text-transform: uppercase; transition: transform 0.12s, box-shadow 0.12s; }
.mlcl-ed-join:hover { transform: translateY(-1px); box-shadow: 0 6px 18px rgba(255, 139, 72, 0.32); }

/* --- Recap reading column enhancements (layers on the existing entry-content) --- */
.mlcl-recap .entry-header,
.mlcl-standard-post .entry-header { display: none; }
/* centered reading column (matches the mockup); the injected bands stay full-bleed */
.mlcl-recap .entry-content,
.mlcl-standard-post .entry-content { max-width: 48rem; margin-left: auto; margin-right: auto; }
/* hero featured image: league photos are portrait by default, so the GP
   featured-image block becomes a height-capped cover crop in the reading
   column instead of rendering at full natural (very tall) size */
.mlcl-recap .inside-article > .featured-image,
.mlcl-standard-post .inside-article > .featured-image {
  max-width: 48rem;
  margin: 0 auto 1.5rem;
}
.mlcl-recap .inside-article > .featured-image img,
.mlcl-standard-post .inside-article > .featured-image img {
  display: block;
  width: 100%;
  height: clamp(18rem, 60vw, 30rem);
  object-fit: cover;
  object-position: center 30%;
  border-radius: 10px;
}
.mlcl-post-frame { position: relative; max-width: 48rem; margin-left: auto; margin-right: auto; }
.mlcl-post-body { min-width: 0; }
.mlcl-recap .entry-content h2[id],
.mlcl-recap .entry-content h3[id],
.mlcl-standard-post .entry-content h2[id],
.mlcl-standard-post .entry-content h3[id] { scroll-margin-top: 5rem; }
.mlcl-reading-progress {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  height: 4px;
  z-index: 9999;
  background: rgba(12, 37, 48, 0.12);
  pointer-events: none;
}
body.admin-bar .mlcl-reading-progress { top: 32px; }
.mlcl-reading-progress span {
  display: block;
  width: 100%;
  height: 100%;
  transform: scaleX(0);
  transform-origin: left center;
  background: linear-gradient(90deg, #FF8B48, #53C2CB);
}
.mlcl-post-toc {
  width: 100%;
  padding: 0.2rem 0.85rem 0.2rem 0;
  background: transparent;
  border-right: 1px solid rgba(12, 37, 48, 0.16);
  box-shadow: none;
  z-index: 19;
  transition: opacity 0.18s ease, transform 0.18s ease;
}
/* rail yields while a full-bleed element shares its vertical span (JS toggles) */
.mlcl-post-toc.is-yielding {
  opacity: 0;
  transform: translateX(-0.4rem);
  pointer-events: none;
}
@media (prefers-reduced-motion: reduce) {
  .mlcl-post-toc { transition: none; }
}
.mlcl-post-toc__label {
  margin: 0 0 0.55rem;
  color: var(--mlcl-accent-ink);
  font-family: 'Bricolage Grotesque', system-ui, sans-serif;
  font-size: 0.68rem;
  font-weight: 850;
  letter-spacing: 0.14em;
  text-transform: uppercase;
}
.mlcl-post-toc ol { list-style: none; margin: 0; padding: 0 0.2rem 0 0; display: grid; gap: 0.25rem; }
.mlcl-post-toc li { margin: 0; }
.mlcl-post-toc li.is-sub { padding-left: 0.75rem; }
.mlcl-post-toc a {
  display: block;
  padding: 0.35rem 0;
  border-left: 3px solid transparent;
  padding-left: 0.55rem;
  color: #41535c;
  font-size: 0.82rem;
  line-height: 1.25;
  text-decoration: none;
  font-weight: 700;
}
.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-post-toc a,
.mlcl-post-toc a {
  color: #41535c;
  text-decoration: none;
}
.mlcl-post-toc a:hover,
.mlcl-post-toc a:focus-visible,
.mlcl-post-toc a[aria-current="true"] {
  border-left-color: var(--mlcl-orange);
  color: var(--mlcl-ink);
  text-decoration: none;
}
.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-post-toc a:hover,
.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-post-toc a:focus-visible,
.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-post-toc a[aria-current="true"] {
  color: var(--mlcl-ink);
  text-decoration: none;
}
.mlcl-recap .entry-content strong { color: var(--mlcl-accent-ink); }
.mlcl-recap .entry-content thead th strong,
.mlcl-recap .entry-content tr:first-child th strong { color: inherit; }
/* leader row (first body row is the winner in both standings and placement tables) */
.mlcl-recap .entry-content tbody tr:first-child td { background: rgba(255, 139, 72, 0.12); font-weight: 600; }
.mlcl-recap .entry-content tbody tr:first-child td:first-child { box-shadow: inset 4px 0 0 #c79a3a; }
.mlcl-recap .entry-content tbody tr:first-child td strong { color: var(--mlcl-accent-ink); }
/* gallery: board-stripe motif under each tile */
.mlcl-recap .entry-content .mlcl-post-body > h2#week-1-photos {
  position: relative;
  z-index: 0;
  margin-bottom: 0;
  padding-top: 2.2rem;
  padding-bottom: 1.15rem;
}
.mlcl-recap .entry-content .mlcl-post-body > h2#week-1-photos::before {
  content: "";
  position: absolute;
  z-index: -1;
  top: 0;
  bottom: 0;
  left: calc(50% - 50vw);
  width: 100vw;
  background: #fff;
}
.mlcl-recap .entry-content .wp-block-gallery.is-cropped {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0.5rem;
  align-items: stretch;
  margin-top: 0;
  padding-bottom: 2rem;
  background: #fff;
}
.mlcl-recap .entry-content .wp-block-gallery.is-cropped .wp-block-image {
  width: auto !important;
  max-width: none !important;
  margin: 0 !important;
  aspect-ratio: 1 / 1;
  overflow: hidden;
}
.mlcl-recap .entry-content .wp-block-gallery.is-cropped .wp-block-image a,
.mlcl-recap .entry-content .wp-block-gallery.is-cropped .wp-block-image img {
  display: block;
  width: 100%;
  height: 100%;
}
.mlcl-recap .entry-content .wp-block-gallery.is-cropped .wp-block-image img {
  object-fit: cover;
  /* League photos are portrait shots of players; bias the square crop toward
     the upper third so faces survive instead of being center-cropped away. */
  object-position: 50% 22%;
}
@media (min-width: 900px) {
  .mlcl-recap .entry-content .wp-block-gallery.is-cropped {
    grid-template-columns: repeat(6, minmax(0, 1fr));
  }
}
@media (min-width: 1181px) {
  .mlcl-recap .entry-content .mlcl-post-frame:not(.mlcl-post-frame--no-toc) .mlcl-post-body > h2#week-1-photos::before,
  .mlcl-recap .entry-content .mlcl-post-frame:not(.mlcl-post-frame--no-toc) .mlcl-post-body > .wp-block-gallery.alignfull.is-cropped {
    --mlcl-recap-gallery-shift: calc(clamp(10.5rem, 14vw, 13.25rem) + clamp(1.5rem, 2.5vw, 2.5rem) - 9.5625rem);
  }
  .mlcl-recap .entry-content .mlcl-post-frame:not(.mlcl-post-frame--no-toc) .mlcl-post-body > h2#week-1-photos::before {
    left: calc(50% - 50vw - var(--mlcl-recap-gallery-shift));
  }
  .mlcl-recap .entry-content .mlcl-post-frame:not(.mlcl-post-frame--no-toc) .mlcl-post-body > .wp-block-gallery.alignfull.is-cropped {
    width: 100vw;
    max-width: 100vw;
    margin-left: calc(50% - 50vw - var(--mlcl-recap-gallery-shift)) !important;
    margin-right: calc(50% - 50vw + var(--mlcl-recap-gallery-shift)) !important;
  }
}
.mlcl-recap .entry-content .wp-block-gallery .wp-block-image { position: relative; }
.mlcl-recap .entry-content .wp-block-gallery .wp-block-image::after { content: ""; position: absolute;
  left: 0; right: 0; bottom: 0; height: 4px;
  background: linear-gradient(90deg, #FF8B48 0 50%, #53C2CB 50% 100%); opacity: 0.85; }

/* --- Single-post Season Thread --- */
.mlcl-season-thread {
  border-top: 1px solid var(--mlcl-line);
}
.mlcl-season-thread .mlcl-ed-wrap {
  padding-top: 2.6rem;
  padding-bottom: 2.8rem;
}
.mlcl-season-thread__head {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 0.6rem 1rem;
  align-items: end;
  margin-bottom: 1rem;
}
.mlcl-season-thread__head .mlcl-ed-cat {
  grid-column: 1 / -1;
  margin-bottom: 0;
}
.mlcl-season-thread__head h2 {
  margin: 0;
  color: var(--mlcl-ink);
  font-family: 'Bricolage Grotesque', system-ui, sans-serif;
  font-size: clamp(1.55rem, 4vw, 2.4rem);
  font-weight: 850;
  line-height: 0.98;
  text-transform: uppercase;
}
.mlcl-season-thread__season {
  align-self: center;
  color: var(--mlcl-accent-ink);
  font-size: 0.78rem;
  font-weight: 800;
  letter-spacing: 0.12em;
  text-decoration: none;
  text-transform: uppercase;
}
.mlcl-season-thread__season:hover {
  text-decoration: underline;
  text-underline-offset: 3px;
}
.mlcl-season-thread__current {
  /* "current season" marker: full orange hairline (the .sc-card.top1
     precedent) instead of a side stripe; the card is rounded, so a thick
     top rule is not an option either. */
  border: 1px solid var(--mlcl-orange);
  background: #fff;
  border-radius: 6px;
  padding: 1.05rem 1.15rem;
}
.mlcl-season-thread__current > span,
.mlcl-season-thread__card > span {
  display: block;
  color: var(--mlcl-accent-ink);
  font-family: 'Bricolage Grotesque', system-ui, sans-serif;
  font-size: 0.68rem;
  font-weight: 850;
  letter-spacing: 0.14em;
  margin-bottom: 0.35rem;
  text-transform: uppercase;
}
.mlcl-season-thread__current strong {
  display: block;
  color: var(--mlcl-ink);
  font-size: 1.05rem;
  line-height: 1.2;
}
.mlcl-season-thread__weeks,
.mlcl-season-thread__nav {
  display: flex;
  flex-wrap: wrap;
  gap: 0.55rem;
  margin-top: 0.9rem;
}
.mlcl-season-thread__weeks a {
  display: inline-flex;
  align-items: center;
  min-height: 34px;
  border: 1px solid rgba(12, 37, 48, 0.18);
  border-radius: 999px;
  color: var(--mlcl-accent-ink);
  font-size: 0.72rem;
  font-weight: 800;
  letter-spacing: 0.08em;
  padding: 0.32rem 0.7rem;
  text-decoration: none;
  text-transform: uppercase;
}
.mlcl-season-thread__weeks a:hover {
  background: var(--mlcl-orange);
  border-color: var(--mlcl-orange);
  color: #0c2530;
  text-decoration: none;
}
.mlcl-season-thread__nav {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}
.mlcl-season-thread__card {
  min-height: 7rem;
  border: 1px solid var(--mlcl-line);
  background: #fff;
  border-radius: 6px;
  padding: 1rem;
}
.mlcl-season-thread__card a,
.mlcl-season-thread__card strong {
  display: block;
  color: var(--mlcl-ink);
  font-weight: 850;
  line-height: 1.15;
  text-decoration: none;
}
.mlcl-season-thread__card a:hover {
  color: var(--mlcl-accent-ink);
}
.mlcl-season-thread__card small {
  display: block;
  color: var(--mlcl-ink-mute);
  font-size: 0.82rem;
  margin-top: 0.4rem;
}
.mlcl-season-thread__card.is-empty {
  background: #f8f5ec;
}
.mlcl-season-thread__card.is-empty strong {
  color: var(--mlcl-ink-mute);
}

/* --- Archive: native GP loop -> card grid --- */
.mlcl-archive-view .site-main { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.6rem;
  align-items: stretch; }
.mlcl-archive-view .site-main > article { margin: 0; background: #fff; border: 1px solid var(--mlcl-line);
  border-radius: 4px; overflow: hidden; transition: transform 0.16s, border-color 0.16s, box-shadow 0.16s; }
.mlcl-archive-view .site-main > article:hover { transform: translateY(-3px); border-color: var(--mlcl-orange);
  box-shadow: 0 14px 30px rgba(12, 37, 48, 0.1); }
/* GP's separate-containers layout pads .inside-article; out-specify it so the card
   image is full-bleed and the text padding below is the only inset. */
.mlcl-archive-view .site-main > article > .inside-article { padding: 0; border: 0; display: flex; flex-direction: column; height: 100%; }
.mlcl-archive-view .site-main > article .post-image { margin: 0; position: relative; width: 100%; height: 0; padding-bottom: 62.5%;
  overflow: hidden; order: -1; flex: none; background: linear-gradient(135deg, #1a4252, #0c2530); }
.mlcl-archive-view .post-image a { display: block; position: absolute; inset: 0; }
.mlcl-archive-view .post-image img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; border: 0; }
.mlcl-archive-view .post-image::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 5px;
  background: linear-gradient(90deg, #FF8B48 0 33%, #53C2CB 33% 66%, #FF8B48 66% 100%); }
/* Posts without a featured image (the mirror lacks some thumbnails; production
   posts have them) get a matching gradient + board-stripe header, so every card
   in the grid is structurally identical. */
.mlcl-archive-view .site-main > article:not(:has(.post-image)) .inside-article::before {
  content: ""; display: block; order: -1; flex: none; width: 100%; height: 0; padding-bottom: 62.5%;
  background:
    linear-gradient(90deg, #FF8B48 0 33%, #53C2CB 33% 66%, #FF8B48 66% 100%) bottom / 100% 5px no-repeat,
    linear-gradient(135deg, #1a4252, #0c2530); }
.mlcl-archive-view .inside-article .entry-header,
.mlcl-archive-view .inside-article .entry-summary,
.mlcl-archive-view .inside-article .entry-meta,
.mlcl-archive-view .inside-article .read-more-container { display: block; padding-left: 1.3rem; padding-right: 1.3rem; }
.mlcl-archive-view .inside-article .entry-header { padding-top: 1.2rem; }
.mlcl-archive-view .inside-article .entry-title { font-size: 1.2rem; line-height: 1.14; margin: 0;
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.mlcl-archive-view .inside-article .entry-title a { color: var(--mlcl-ink); text-decoration: none; }
.mlcl-archive-view .site-main > article:hover .entry-title a { color: var(--mlcl-accent-ink); }
.mlcl-archive-view .inside-article .entry-summary { color: var(--mlcl-ink-dim); font-size: 0.92rem; margin: 0.6rem 0 0;
  display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.mlcl-archive-view .inside-article .read-more-container { padding-bottom: 1.4rem; margin-top: auto; padding-top: 0.8rem; }
/* GP renders its archive title as .page-header inside the loop; inc/editorial.php
   removes it (we show our own dark page-header band). Hide any that slips through
   so the heading never doubles. */
.mlcl-archive-view .site-main > .page-header { display: none; }
/* Every card is the same size: one uniform 3-up grid, no featured span. */
/* pagination as rectangles */
.mlcl-editorial .paging-navigation,
.mlcl-editorial .generate-columns + .paging-navigation { grid-column: 1 / -1; margin-top: 2.5rem; }
.mlcl-editorial .page-numbers { border-radius: 3px; }

/* --- Editorial responsive --- */
@media (max-width: 880px) {
  .mlcl-ed-wrap { padding-left: 1.25rem; padding-right: 1.25rem; }
  .mlcl-ed-statstrip { grid-template-columns: repeat(2, 1fr); gap: 1.3rem; }
  .mlcl-ed-cards { grid-template-columns: 1fr; gap: 1.2rem; }
  .mlcl-ed-author-row { flex-wrap: wrap; }
  .mlcl-season-thread__head,
  .mlcl-season-thread__nav { grid-template-columns: 1fr; }
  .mlcl-archive-view .site-main { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 1180px) {
  .mlcl-post-toc { display: none; }
}

@media (min-width: 1181px) {
  .mlcl-recap .entry-content,
  .mlcl-standard-post .entry-content { max-width: 76rem; }
  .mlcl-post-frame {
    display: grid;
    grid-template-columns: clamp(10.5rem, 14vw, 13.25rem) minmax(0, 48rem) minmax(0, 1fr);
    column-gap: clamp(1.5rem, 2.5vw, 2.5rem);
    align-items: start;
    max-width: none;
  }
  .mlcl-post-body { grid-column: 2; grid-row: 1; }
  .mlcl-post-toc {
    grid-column: 1;
    grid-row: 1;
    align-self: start;
    position: sticky;
    top: 6.5rem;
  }
  .mlcl-post-toc ol { max-height: calc(100vh - 11rem); overflow: auto; overscroll-behavior: contain; }
  body.admin-bar .mlcl-post-toc { top: 8.5rem; }
  /* headerless posts: no toc means no rail gutter; plain centered column */
  .mlcl-post-frame--no-toc {
    display: block;
    max-width: 48rem;
    margin-left: auto;
    margin-right: auto;
  }
  .mlcl-post-frame--no-toc .mlcl-post-toc { display: none; }
}

@media (max-width: 600px) {
  .mlcl-archive-view .site-main { grid-template-columns: 1fr; }
  body.admin-bar .mlcl-reading-progress { top: 46px; }
}

/* ==========================================================================
   Site-wide touch-target pass (a11y, 2026-06-09)
   --------------------------------------------------------------------------
   Every rule grows the HIT AREA only, never the type size. Two techniques:
   (a) min-height on a flex link whose container is already taller than 44px,
   so nothing moves; (b) padding cancelled by an equal negative margin, so the
   rendered layout is byte-identical while the pointer/tap box reaches 44px.
   ========================================================================== */

/* Primary nav links: ~15px-tall text in an 81px bar. A 44px hit box centers
   on the same text (the .nav-menu flex row centers items); the bar height is
   set by the 44px logo + the .95rem padding so it cannot grow, and no
   horizontal padding is added (the menu must not wrap at 1024-1440). */
body.mlcl-site:not(.mlcl-app-active) .nav-menu a {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
}

/* Announcement-bar (ticker) link: the orange band is ~28px tall by design.
   Grow the hit box mostly downward, over the dead center of the navy bar
   below (the header is sticky at top:0, so area added upward would sit off
   viewport), and cancel with negative margins so the band does not grow. */
body.mlcl-site:not(.mlcl-app-active) .site-header__ticker-link {
  padding: 6px 10px 21px;
  margin: -6px -10px -21px;
}

/* Footer: the map address link and the sponsor logo links measured 38px. The
   map link centers in a 44px row (the map card absorbs the 6px); sponsor
   logos keep their 38px art inside a centered 44px box. */
.site-footer__map-link {
  display: flex;
  align-items: center;
  min-height: 44px;
}
.footer-sponsor__link {
  min-width: 44px;
  min-height: 44px;
  justify-content: center;
}

/* Page-header breadcrumbs (rosters, schedule, shop, utility pages): 11px
   links in a text row; pad the hit box and cancel it so the row keeps its
   current height. No background or underline paints into the padding. */
.page-header .crumbs a {
  display: inline-block;
  padding: 17px 6px;
  margin: -17px -6px;
}

/* /updates/ Query Loop cards. The season badge and the week chips grow the
   same way the hub week-selector chips did (min-height, label size stays);
   the title link is inline text, so vertical padding enlarges its hit box
   without moving the line boxes. */
.entry-content .mlcl-updates .wp-block-post .wp-block-post-terms a,
.entry-content .mlcl-updates .wp-block-post .wp-block-post-terms span {
  display: inline-flex;
  align-items: center;
  /* span included so a linked badge and a plain badge stay the same height. */
  min-height: 44px;
}
.entry-content .mlcl-updates .wp-block-post .wp-block-post-title a {
  padding: 14px 0;
}
.entry-content .mlcl-updates .mlcl-updates-card-links a {
  min-height: 44px;
}

/* ==========================================================================
   History hub (player profiles now; team pages / record book later)
   --------------------------------------------------------------------------
   Appended section. Shared .mlcl-hub-* furniture (avatars, the centered
   container) is reusable by later hub blocks; .mlcl-player-profile scopes the
   profile-specific layout. All colors use the --mlcl-* token layer so the page
   tracks the light/dark theme. Mockup -> token map: cream->--mlcl-bg,
   paper->#fff, sand->--mlcl-bg-2, ink->--mlcl-ink, ink2->--mlcl-ink-dim,
   gray->--mlcl-ink-mute, line->--mlcl-line, orange fill->--mlcl-orange,
   orange text->--mlcl-accent-ink, teal->--mlcl-teal, deep->--mlcl-teal-deep,
   link text->--mlcl-teal-ink.
   ========================================================================== */

/* The hub uses a centered container on the cream body (NOT the full-bleed band
   system). Lift the boxed GP prose frame so the profile spans the content area,
   then cap it with the hub wrap below. */
body.mlcl-hub .mlcl-hub-content { width: 100%; }
/* Flat, border-led surfaces to match the broadcast/print redesign. The hub was
   built from a separate mockup whose soft 24px-blur shadow made it read as a
   bolted-on dashboard layer. One tight shadow on body.mlcl-hub flows to every
   hub surface (profiles, team pages, the record book, the directories); the
   var() fallbacks at each call site are now only a safety net. Cards are
   defined by their 1px border, the way .card and .roster-card are. */
body.mlcl-hub {
  --mlcl-hub-shadow: 0 1px 2px rgba(12, 37, 48, 0.06);
}

/* Shared avatar: colored-initials chip (logo image falls into the same box). */
.mlcl-hub-avatar {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 2.625rem;
  height: 2.625rem;
  border-radius: 50%;
  color: #fff;
  font-weight: 800;
  font-size: 0.82rem;
  line-height: 1;
  letter-spacing: 0.01em;
  box-shadow: 0 2px 6px rgba(12, 37, 48, 0.18);
  object-fit: cover;
  overflow: hidden;
}
.mlcl-hub-avatar--sm { width: 2rem; height: 2rem; font-size: 0.72rem; box-shadow: none; }
.mlcl-hub-avatar--lg { width: 3.25rem; height: 3.25rem; font-size: 1rem; }
.mlcl-hub-avatar--xl {
  width: 8.5rem;
  height: 8.5rem;
  border-radius: 50%;
  font-size: 2.5rem;
  letter-spacing: 0.02em;
  border: 4px solid #fff;
  box-shadow: 0 8px 22px rgba(12, 37, 48, 0.22);
}
/* Square teams, round people. The base avatar is a circle (people: headshots,
   teammates, roster, the player directory). Team logos/badges square off to
   match .roster-card__badge in the redesign. Declared after the size modifiers
   so it wins the equal-specificity tie against --xl/--sm/--lg. */
.mlcl-hub-avatar--team { border-radius: 0; }

/* --- Results by week (shared nested season -> week -> games disclosure) -------
   Rendered by mlcl_hub_results_by_week() inside the player-profile and team-page
   season dropdowns. Only the season is a card; weeks are flat rows split by
   hairlines, and a week's games sit under a single teal left rule. Hierarchy
   reads by indent + weight, not nested boxes, so it stays clean on phones. The
   per-week W-L is the tally of the matches shown, not the official record (the
   season header carries that). Colors are the AA-safe ink tokens (good/bad/teal
   ink all clear 4.5:1 on the white season card). */
.mlcl-hub-results { margin-top: 0.7rem; }
.mlcl-hub-results-lbl {
  margin: 0 0 0.1rem;
  font-size: 0.7rem;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  color: var(--mlcl-ink-mute);
  font-weight: 800;
}
.mlcl-hub-weeks { display: flex; flex-direction: column; }
.mlcl-hub-week-item { position: relative; border-top: 1px solid var(--mlcl-line); }
.mlcl-hub-week-item:first-child { border-top: 0; }
.mlcl-hub-week-head {
  display: grid;
  grid-template-columns: 16px auto 1fr;
  gap: 0.7rem;
  align-items: center;
  /* Right padding reserves room for the recap link, which is absolutely
     positioned as a sibling of the <details> (not nested inside the <summary>)
     so it never forms a nested interactive control (axe: nested-interactive). */
  padding: 0.55rem 7rem 0.55rem 0;
  cursor: pointer;
  list-style: none;
}
.mlcl-hub-week-head::-webkit-details-marker { display: none; }
.mlcl-hub-week-head:focus-visible { outline: 2px solid var(--mlcl-teal-ink); outline-offset: 2px; }
.mlcl-hub-wchev {
  width: 8px;
  height: 8px;
  border-right: 2px solid var(--mlcl-ink-mute);
  border-bottom: 2px solid var(--mlcl-ink-mute);
  transform: rotate(-45deg);
  transition: transform 0.2s ease;
}
.mlcl-hub-week[open] .mlcl-hub-wchev { transform: rotate(45deg); }
.mlcl-hub-wname { font-weight: 800; font-size: 0.9rem; color: var(--mlcl-ink); }
.mlcl-hub-wrec { justify-self: start; font-size: 0.82rem; font-weight: 800; font-variant-numeric: tabular-nums; }
.mlcl-hub-wrec-w { color: var(--mlcl-good-ink); }
.mlcl-hub-wrec-l { color: var(--mlcl-bad-ink); }
.mlcl-hub-wrec-sep { color: var(--mlcl-ink-mute); margin: 0 0.1rem; }
.mlcl-hub-wrecap {
  position: absolute;
  top: 0.5rem;
  right: 0;
  font-weight: 700;
  font-size: 0.8rem;
  color: var(--mlcl-teal-ink);
  text-decoration: none;
  white-space: nowrap;
}
.mlcl-hub-wrecap::after { content: " \203A"; }
.mlcl-hub-wrecap:hover { color: var(--mlcl-accent-ink); }
.mlcl-hub-wname { display: inline-flex; align-items: center; gap: 0.45rem; flex-wrap: wrap; }
.mlcl-hub-wtag {
  font-size: 0.62rem;
  font-weight: 800;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--mlcl-teal-ink);
  border: 1px solid var(--mlcl-teal-ink);
  padding: 0.04rem 0.34rem;
}
.mlcl-hub-week-head--static { cursor: default; padding-right: 0; }
.mlcl-hub-wchev--none { visibility: hidden; }
.mlcl-hub-wbadge--forfeit {
  justify-self: start;
  font-size: 0.62rem;
  font-weight: 800;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--mlcl-ink-mute);
  border: 1px solid var(--mlcl-ink-mute);
  padding: 0.04rem 0.4rem;
}
.mlcl-hub-week-item--forfeit .mlcl-hub-wname { color: var(--mlcl-ink-mute); font-weight: 700; }

.mlcl-hub-week-games {
  margin: 0 0 0.5rem 16px;
  padding: 0.1rem 0 0.15rem 0.85rem;
  border-left: 2px solid var(--mlcl-teal);
}
.mlcl-hub-game {
  display: grid;
  grid-template-columns: 1fr auto auto;
  gap: 0.6rem;
  align-items: center;
  padding: 0.26rem 0;
}
.mlcl-hub-opp {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 0.86rem;
  color: var(--mlcl-ink);
}
.mlcl-hub-vs { color: var(--mlcl-ink-mute); font-weight: 600; margin-right: 0.15rem; }
.mlcl-hub-res {
  font-size: 0.64rem;
  font-weight: 800;
  letter-spacing: 0.04em;
  padding: 0.08rem 0.3rem;
  border: 1px solid;
}
.mlcl-hub-res--w { color: var(--mlcl-good-ink); border-color: var(--mlcl-good-ink); }
.mlcl-hub-res--l { color: var(--mlcl-bad-ink); border-color: var(--mlcl-bad-ink); }
.mlcl-hub-res--t { color: var(--mlcl-ink-mute); border-color: var(--mlcl-line-strong); }
.mlcl-hub-sc { font-variant-numeric: tabular-nums; font-weight: 800; font-size: 0.86rem; white-space: nowrap; }
.mlcl-hub-sc-own { color: var(--mlcl-ink); }
.mlcl-hub-sc-sep { color: var(--mlcl-ink-mute); margin: 0 0.15rem; }
.mlcl-hub-sc-opp { color: var(--mlcl-ink-mute); }

@media (prefers-reduced-motion: reduce) {
  .mlcl-hub-wchev { transition: none; }
}

@media (max-width: 560px) {
  /* The summary is just the toggle (chevron, week, record); the recap link sits as
     a static sibling on its own line so nothing crowds it on narrow phones. */
  .mlcl-hub-week-head {
    grid-template-columns: 16px 1fr auto;
    padding-right: 0;
  }
  .mlcl-hub-wrec { justify-self: end; }
  .mlcl-hub-wrecap {
    position: static;
    display: inline-block;
    margin: 0 0 0.45rem 1.55rem;
  }
}

/* ================================================================
   player-profile block (record-book-player-v1 mockup)
   Reuses the shared .mlcl-hub furniture (.crumbs, .hero, .sec, .shd,
   .tab, .xl, .disp, the navy thead table, the .badge / .brk badges,
   the .tablecard). Only the player-specific pieces (the hero avatar +
   chips, the stat band, the game-log accordion, the teammate cards)
   live here. Fixed-dark fills (the hero band, the season log headers,
   the table thead) use the literal navy #0c2530 + white because the
   hub body runs data-theme="light" (token fills flip to cream).
   ================================================================ */

/* breadcrumb: same navy band as the seasons index + season overview. Shared
   with the team page (both blocks emit the .crumbs breadcrumb). */
.mlcl-player-profile .crumbs,
.mlcl-team-page .crumbs { padding: 12px 40px; background: #0c2530; border-bottom: 1px solid #1c3a48; font: 700 11px/1 "Oswald", system-ui, sans-serif; letter-spacing: .08em; text-transform: uppercase; color: #bcccd4; }
.mlcl-player-profile .crumbs a,
.mlcl-team-page .crumbs a { color: var(--mlcl-orange); text-decoration: none; }
.mlcl-player-profile .crumbs a:hover,
.mlcl-team-page .crumbs a:hover { color: #f4f1ea; }

/* hero: dark band with the avatar + name + chips */
.mlcl-player-profile .hero { position: relative; display: flex; align-items: center; gap: 22px; background: #0c2530; color: #fff; padding: 30px 40px 26px; overflow: hidden; }
.mlcl-player-profile .hero::after { content: ""; position: absolute; inset: 0 0 0 auto; width: 40%; background: linear-gradient(115deg, transparent, rgba(255, 255, 255, .05)); clip-path: polygon(28% 0, 100% 0, 100% 100%, 0 100%); pointer-events: none; }
.mlcl-player-profile .mlcl-pp-av { position: relative; z-index: 2; flex: none; width: 84px; height: 84px; font-size: 30px; border: 2px solid var(--mlcl-orange); background: linear-gradient(160deg, #1a4458, #0c2530); color: var(--mlcl-orange); box-shadow: none; }
.mlcl-player-profile .mlcl-pp-hgrid { position: relative; z-index: 2; min-width: 0; }
.mlcl-player-profile .hero .ey { font: 700 11px/1 "Oswald", system-ui, sans-serif; letter-spacing: .18em; color: var(--mlcl-orange); }
.mlcl-player-profile .hero h1 { font-weight: 700; font-size: clamp(32px, 5.5vw, 46px); line-height: .95; margin: 5px 0 8px; color: #fff; }

/* hero chips */
.mlcl-player-profile .mlcl-pp-meta { display: flex; flex-wrap: wrap; gap: 8px; }
.mlcl-player-profile .mlcl-pp-chip { font: 700 11px/1 "Oswald", system-ui, sans-serif; letter-spacing: .04em; color: #fff; background: rgba(255, 255, 255, .08); border: 1px solid #2a4d5d; border-radius: 20px; padding: 6px 11px; }
.mlcl-player-profile .mlcl-pp-chip .xl { color: #fff; background-image: linear-gradient(var(--mlcl-orange), var(--mlcl-orange)); }
.mlcl-player-profile .mlcl-pp-chip--gold { background: rgba(255, 139, 72, .16); border-color: var(--mlcl-orange); color: var(--mlcl-orange); }

/* stat band: five fixed-dark cells under the hero */
.mlcl-player-profile .mlcl-pp-band { display: grid; grid-template-columns: repeat(5, 1fr); background: #081a24; border-bottom: 1px solid #16323f; }
.mlcl-player-profile .mlcl-pp-band div { padding: 14px 16px; border-right: 1px solid #122e3a; }
.mlcl-player-profile .mlcl-pp-band div:last-child { border-right: 0; }
.mlcl-player-profile .mlcl-pp-band b { font: 700 24px/1 "Oswald", system-ui, sans-serif; color: #fff; font-variant-numeric: tabular-nums; }
.mlcl-player-profile .mlcl-pp-band span { display: block; margin-top: 4px; font: 700 9px/1.2 "Oswald", system-ui, sans-serif; letter-spacing: .1em; text-transform: uppercase; color: #7e97a3; }

/* season-by-season table: the .n numeric cells right-align in Oswald */
.mlcl-player-profile thead th.n { text-align: right; }
.mlcl-player-profile tbody td.n { text-align: right; font-family: "Oswald", system-ui, sans-serif; font-weight: 600; color: var(--mlcl-ink); }
.mlcl-player-profile th.tn-cell { font-weight: 700; color: var(--mlcl-ink); }
.mlcl-player-profile .mlcl-pp-teamcell .badge { display: inline-block; font: 700 8px/1 "Oswald", system-ui, sans-serif; letter-spacing: .04em; padding: 3px 5px; border-radius: 2px; margin-left: 7px; vertical-align: 1px; }
.mlcl-player-profile .mlcl-pp-teamcell .badge.a { background: var(--mlcl-orange); color: #0c2530; }
.mlcl-player-profile .mlcl-pp-teamcell .badge.b { background: #0c2530; color: #fff; }

/* game log accordion. SHARED with the team page: the team-page block reuses the
   same .mlcl-pp-* game-log markup (navy season header, native <details> weeks,
   W/L badges, hyphen scores, week + recap links) so its selectors are broadened
   to cover .mlcl-team-page rather than duplicated. */
.mlcl-player-profile .mlcl-pp-gacc,
.mlcl-team-page .mlcl-pp-gacc { border: 1px solid var(--mlcl-line); border-radius: 8px; overflow: hidden; background: var(--mlcl-surface); }
.mlcl-player-profile .mlcl-pp-gseason,
.mlcl-team-page .mlcl-pp-gseason { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; background: #0c2530; color: #fff; padding: 11px 14px; font: 700 12px/1 "Oswald", system-ui, sans-serif; letter-spacing: .05em; }
.mlcl-player-profile .mlcl-pp-gseason + .mlcl-pp-gseason,
.mlcl-player-profile details.mlcl-pp-gw + .mlcl-pp-gseason,
.mlcl-player-profile .mlcl-pp-gw--forfeit + .mlcl-pp-gseason,
.mlcl-team-page .mlcl-pp-gseason + .mlcl-pp-gseason,
.mlcl-team-page details.mlcl-pp-gw + .mlcl-pp-gseason,
.mlcl-team-page .mlcl-pp-gwrow + .mlcl-pp-gseason,
.mlcl-team-page .mlcl-pp-gw--forfeit + .mlcl-pp-gseason { border-top: 1px solid var(--mlcl-line); }
.mlcl-player-profile .mlcl-pp-gseason .xl,
.mlcl-team-page .mlcl-pp-gseason .xl { color: #fff; background-image: linear-gradient(var(--mlcl-orange), var(--mlcl-orange)); }
/* team-page season header carries the team name THAT season as plain bright ink */
.mlcl-team-page .mlcl-pp-gseason .mlcl-pp-gtn { color: #fff; }
.mlcl-player-profile .mlcl-pp-gseason .mlcl-pp-ch,
.mlcl-team-page .mlcl-pp-gseason .mlcl-pp-ch { font-size: 9px; color: #bcccd4; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; }
.mlcl-player-profile .mlcl-pp-gseason .mlcl-pp-gr,
.mlcl-team-page .mlcl-pp-gseason .mlcl-pp-gr { margin-left: auto; color: var(--mlcl-orange); font-variant-numeric: tabular-nums; }

.mlcl-player-profile details.mlcl-pp-gw,
.mlcl-team-page details.mlcl-pp-gw { border-top: 1px solid var(--mlcl-line); }
.mlcl-team-page .mlcl-pp-gwrow { position: relative; border-top: 1px solid var(--mlcl-line); }
.mlcl-team-page .mlcl-pp-gwrow details.mlcl-pp-gw { border-top: 0; }
.mlcl-player-profile details.mlcl-pp-gw > summary,
.mlcl-team-page details.mlcl-pp-gw > summary { list-style: none; cursor: pointer; display: flex; align-items: center; gap: 11px; padding: 11px 14px; font: 700 12px/1 "Oswald", system-ui, sans-serif; letter-spacing: .04em; color: var(--mlcl-ink); }
.mlcl-team-page .mlcl-pp-gwrow details.mlcl-pp-gw > summary { padding-right: 230px; }
.mlcl-player-profile details.mlcl-pp-gw > summary::-webkit-details-marker,
.mlcl-team-page details.mlcl-pp-gw > summary::-webkit-details-marker { display: none; }
.mlcl-player-profile details.mlcl-pp-gw > summary::marker,
.mlcl-team-page details.mlcl-pp-gw > summary::marker { content: ""; }
.mlcl-player-profile details.mlcl-pp-gw > summary:hover,
.mlcl-team-page details.mlcl-pp-gw > summary:hover { background: #faf8f3; }
.mlcl-player-profile details.mlcl-pp-gw[open] > summary,
.mlcl-team-page details.mlcl-pp-gw[open] > summary { background: #faf8f3; }
.mlcl-player-profile details.mlcl-pp-gw > summary:focus-visible,
.mlcl-team-page details.mlcl-pp-gw > summary:focus-visible { outline: 3px solid var(--mlcl-orange); outline-offset: -3px; }
.mlcl-player-profile .mlcl-pp-gw .chev,
.mlcl-team-page .mlcl-pp-gw .chev { color: var(--mlcl-orange); font-size: 11px; transition: transform .15s; }
.mlcl-player-profile details.mlcl-pp-gw[open] > summary .chev,
.mlcl-team-page details.mlcl-pp-gw[open] > summary .chev { transform: rotate(90deg); }
.mlcl-player-profile .mlcl-pp-gw .mlcl-pp-wname,
.mlcl-team-page .mlcl-pp-gw .mlcl-pp-wname { color: var(--mlcl-ink); }
.mlcl-player-profile .mlcl-pp-gw .mlcl-pp-wrec,
.mlcl-team-page .mlcl-pp-gw .mlcl-pp-wrec { margin-left: auto; color: #54656c; font-weight: 600; font-variant-numeric: tabular-nums; }

/* a forfeit / no-game week shows as a static (non-interactive) row */
.mlcl-player-profile .mlcl-pp-gw--forfeit,
.mlcl-team-page .mlcl-pp-gw--forfeit { display: flex; align-items: center; gap: 11px; padding: 11px 14px; border-top: 1px solid var(--mlcl-line); font: 700 12px/1 "Oswald", system-ui, sans-serif; color: #54656c; }
.mlcl-player-profile .mlcl-pp-gw--forfeit .mlcl-pp-wname,
.mlcl-team-page .mlcl-pp-gw--forfeit .mlcl-pp-wname { color: #54656c; }
.mlcl-player-profile .mlcl-pp-wforf,
.mlcl-team-page .mlcl-pp-wforf { margin-left: auto; font: 700 8px/1 "Oswald", system-ui, sans-serif; letter-spacing: .04em; text-transform: uppercase; color: #54656c; }

/* per-game rows inside an open week */
.mlcl-player-profile .mlcl-pp-grow,
.mlcl-team-page .mlcl-pp-grow { display: flex; align-items: center; gap: 12px; padding: 9px 14px 9px 36px; border-top: 1px solid #eee5d4; font-size: 13.5px; }
.mlcl-player-profile .mlcl-pp-res,
.mlcl-team-page .mlcl-pp-res { flex: none; width: 21px; height: 21px; border-radius: 4px; display: flex; align-items: center; justify-content: center; font: 700 10px/1 "Oswald", system-ui, sans-serif; color: #fff; }
.mlcl-player-profile .mlcl-pp-res--w,
.mlcl-team-page .mlcl-pp-res--w { background: #2f6f4f; }
.mlcl-player-profile .mlcl-pp-res--l,
.mlcl-team-page .mlcl-pp-res--l { background: #9a4242; }
.mlcl-player-profile .mlcl-pp-res--t,
.mlcl-team-page .mlcl-pp-res--t { background: #54656c; }
.mlcl-player-profile .mlcl-pp-op,
.mlcl-team-page .mlcl-pp-op { flex: 1; min-width: 0; color: #54656c; }
.mlcl-player-profile .mlcl-pp-op .xl,
.mlcl-team-page .mlcl-pp-op .xl { color: var(--mlcl-ink); }
.mlcl-player-profile .mlcl-pp-sc,
.mlcl-team-page .mlcl-pp-sc { font: 700 15px/1 "Oswald", system-ui, sans-serif; color: var(--mlcl-ink); font-variant-numeric: tabular-nums; }

/* per-week links row (week page + recap), inside the expanded details */
.mlcl-player-profile .mlcl-pp-wlinks,
.mlcl-team-page .mlcl-pp-wlinks { display: flex; flex-wrap: wrap; gap: 8px 22px; padding: 11px 14px 12px 36px; border-top: 1px solid #eee5d4; }
.mlcl-player-profile .mlcl-pp-wlink,
.mlcl-team-page .mlcl-pp-wlink { font: 700 11px/1 "Oswald", system-ui, sans-serif; letter-spacing: .05em; color: var(--mlcl-accent-ink); }
/* compact week/recap badges in the collapsed summary row */
.mlcl-player-profile .mlcl-pp-wsumrecap,
.mlcl-team-page .mlcl-pp-wsumrecap { margin-left: 14px; font: 700 10px/1 "Oswald", system-ui, sans-serif; letter-spacing: .05em; color: var(--mlcl-accent-ink); }
.mlcl-team-page .mlcl-pp-wquicklinks { position: absolute; top: 11px; right: 14px; z-index: 1; display: flex; align-items: center; justify-content: flex-end; gap: 14px; font: 700 10px/1 "Oswald", system-ui, sans-serif; letter-spacing: .05em; }
.mlcl-team-page .mlcl-pp-wquicklink { color: var(--mlcl-accent-ink); white-space: nowrap; }

.mlcl-player-profile .mlcl-pp-tnote,
.mlcl-team-page .mlcl-pp-tnote { margin: 12px 0 0; font-size: 12px; color: #54656c; font-style: italic; }
.mlcl-player-profile .mlcl-pp-note,
.mlcl-team-page .mlcl-pp-note { font-size: 14px; color: #54656c; margin: 0; }

/* played-with: teammate cards in a responsive grid */
.mlcl-player-profile .mlcl-pp-mates { display: grid; grid-template-columns: repeat(2, 1fr); gap: 12px; }
.mlcl-player-profile .mlcl-pp-mate { display: flex; align-items: center; gap: 10px; background: var(--mlcl-surface); border: 1px solid var(--mlcl-line); border-radius: 8px; padding: 11px 13px; text-decoration: none; }
.mlcl-player-profile a.mlcl-pp-mate:hover { box-shadow: 0 4px 14px rgba(12, 37, 48, .10); border-color: var(--mlcl-orange); }
.mlcl-player-profile .mlcl-pp-mi { flex: none; width: 36px; height: 36px; font-size: 13px; background: #1a4458; box-shadow: none; }
.mlcl-player-profile .mlcl-pp-mate-body { display: flex; flex-direction: column; min-width: 0; }
.mlcl-player-profile .mlcl-pp-mn { font-weight: 700; color: var(--mlcl-ink); font-size: 14px; }
.mlcl-player-profile .mlcl-pp-ms { font-size: 11px; color: #54656c; margin-top: 2px; }

/* empty / not-found state */
.mlcl-player-profile .mlcl-pp-empty { padding: 40px; }

/* ---------- responsive: single 760px reflow ---------- */
@media (max-width: 760px) {
  .mlcl-player-profile .crumbs { padding-left: 18px; padding-right: 18px; }
  .mlcl-player-profile .hero { padding: 24px 18px 20px; gap: 16px; }
  .mlcl-player-profile .mlcl-pp-band { grid-template-columns: repeat(3, 1fr); }
  .mlcl-player-profile .mlcl-pp-band div:nth-child(n+4) { border-top: 1px solid #122e3a; }
  .mlcl-player-profile .mlcl-pp-mates { grid-template-columns: 1fr; }
  /* season-by-season table reflows to stacked cards (data-label numbers).
     This block scopes the reflow so it overrides the shared champions-table
     reflow that hides the team cell behind a navy season strip. */
  .mlcl-player-profile table { display: table; border: 1px solid var(--mlcl-line); background: var(--mlcl-surface); border-radius: 8px; }
  .mlcl-player-profile tbody { display: table-row-group; }
  .mlcl-player-profile thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
  .mlcl-player-profile tbody tr, .mlcl-player-profile tbody tr:nth-child(even) { display: flex; align-items: baseline; flex-wrap: wrap; gap: 2px 8px; padding: 9px 12px; border: 0; border-top: 1px solid var(--mlcl-line); border-radius: 0; margin: 0; background: var(--mlcl-surface); }
  .mlcl-player-profile tbody tr:first-child { border-top: 0; }
  .mlcl-player-profile tbody tr:nth-child(even) { background: #faf8f3; }
  .mlcl-player-profile tbody td, .mlcl-player-profile tbody th { display: inline; width: auto; border-top: 0; padding: 0; font-size: 13.5px; }
  .mlcl-player-profile th.tn-cell { flex: 1 1 100%; margin-bottom: 2px; }
  .mlcl-player-profile .mlcl-pp-teamcell { flex: 1 1 100%; margin-bottom: 4px; }
  .mlcl-player-profile td.n { font-size: 12px; color: #54656c; font-weight: 600; }
  .mlcl-player-profile td.n::before { content: attr(data-label) " "; font-weight: 400; color: #54656c; }
  .mlcl-team-page .mlcl-pp-gwrow details.mlcl-pp-gw > summary { padding-right: 14px; }
  .mlcl-team-page .mlcl-pp-wquicklinks {
    position: static;
    justify-content: flex-start;
    flex-wrap: wrap;
    gap: 8px 16px;
    padding: 0 14px 11px 36px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .mlcl-player-profile .mlcl-pp-gw .chev,
  .mlcl-team-page .mlcl-pp-gw .chev { transition: none; }
}

/* --- Player profile (legacy directory wrap, retained for any non-block use) - */
.mlcl-player-profile .mlcl-pp-wrap {
  max-width: 1080px;
  margin: 0 auto;
  padding: 1.5rem 1.4rem 4rem;
}

/* ================================================================
   team-page block (record-book-team-v1 mockup)
   The TEAM analog of the player profile. Reuses the shared .mlcl-hub
   furniture (.crumbs, .hero, .sec, .shd, .tab, .xl, .disp, the .brk
   badges) AND the player-profile game-log accordion (.mlcl-pp-*,
   broadened above to cover .mlcl-team-page). Only the team-specific
   pieces live here: the hero avatar + "also known as" rebrand line +
   chips, the navy stat band, the Through the Years timeline (with
   per-season name eras + champ badges), and the Roster cards. Fixed-
   dark fills (the hero band, the stat band) use the literal navy
   #0c2530 + white because the hub body runs data-theme="light".
   ================================================================ */
.mlcl-team-page { color: var(--mlcl-ink); }

/* hero: dark band with the team avatar + name + aka line + chips. Mirrors the
   player-profile hero. */
.mlcl-team-page .hero { position: relative; display: flex; align-items: center; gap: 22px; background: #0c2530; color: #fff; padding: 30px 40px 26px; overflow: hidden; }
.mlcl-team-page .hero::after { content: ""; position: absolute; inset: 0 0 0 auto; width: 42%; background: linear-gradient(115deg, transparent, rgba(255, 255, 255, .05)); clip-path: polygon(26% 0, 100% 0, 100% 100%, 0 100%); pointer-events: none; }
.mlcl-team-page .mlcl-tp-av { position: relative; z-index: 2; flex: none; width: 84px; height: 84px; font-size: 28px; border: 2px solid var(--mlcl-orange); background: linear-gradient(160deg, #1a4458, #0c2530); color: var(--mlcl-orange); box-shadow: none; }
.mlcl-team-page .mlcl-tp-hgrid { position: relative; z-index: 2; min-width: 0; }
.mlcl-team-page .hero .ey { font: 700 11px/1 "Oswald", system-ui, sans-serif; letter-spacing: .18em; color: var(--mlcl-orange); }
.mlcl-team-page .hero h1 { font-weight: 700; font-size: clamp(32px, 5.5vw, 48px); line-height: .95; margin: 6px 0 6px; color: #fff; }
.mlcl-team-page .mlcl-tp-aka { font-size: 13px; color: #bcccd4; margin: 0 0 4px; }
.mlcl-team-page .mlcl-tp-aka b { color: #fff; font-weight: 600; }

/* hero chips */
.mlcl-team-page .mlcl-tp-meta { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 10px; }
.mlcl-team-page .mlcl-tp-chip { font: 700 11px/1 "Oswald", system-ui, sans-serif; letter-spacing: .04em; color: #fff; background: rgba(255, 255, 255, .08); border: 1px solid #2a4d5d; border-radius: 20px; padding: 6px 11px; }
.mlcl-team-page .mlcl-tp-chip--gold { background: rgba(255, 139, 72, .16); border-color: var(--mlcl-orange); color: var(--mlcl-orange); }

/* stat band: five fixed-dark cells under the hero */
.mlcl-team-page .mlcl-tp-band { display: grid; grid-template-columns: repeat(5, 1fr); background: #081a24; border-bottom: 1px solid #16323f; }
.mlcl-team-page .mlcl-tp-band div { padding: 14px 16px; border-right: 1px solid #122e3a; }
.mlcl-team-page .mlcl-tp-band div:last-child { border-right: 0; }
.mlcl-team-page .mlcl-tp-band b { font: 700 22px/1 "Oswald", system-ui, sans-serif; color: #fff; font-variant-numeric: tabular-nums; }
.mlcl-team-page .mlcl-tp-band span { display: block; margin-top: 4px; font: 700 9px/1.2 "Oswald", system-ui, sans-serif; letter-spacing: .1em; text-transform: uppercase; color: #7e97a3; }

/* Through the Years: a horizontal timeline, one card per season the franchise
   played. Each card shows the season (linked), the name THAT season (so rebrands
   read in place), the record, the finish, and a champ / best-season badge. */
.mlcl-team-page .mlcl-tp-tl { display: grid; grid-template-columns: repeat(5, 1fr); gap: 0; }
.mlcl-team-page .mlcl-tp-node { position: relative; padding: 0 8px; }
.mlcl-team-page .mlcl-tp-node::before { content: ""; position: absolute; top: 13px; left: 0; right: 0; height: 2px; background: var(--mlcl-line-strong); }
.mlcl-team-page .mlcl-tp-node:first-child::before { left: 50%; }
.mlcl-team-page .mlcl-tp-node:last-child::before { right: 50%; }
.mlcl-team-page .mlcl-tp-dot { position: relative; display: block; width: 14px; height: 14px; border-radius: 50%; background: var(--mlcl-orange); border: 3px solid var(--mlcl-bg); margin: 6px auto 12px; z-index: 2; }
.mlcl-team-page .mlcl-tp-dot--champ { background: #0c2530; box-shadow: 0 0 0 2px var(--mlcl-orange); }
.mlcl-team-page .mlcl-tp-ncard { background: var(--mlcl-surface); border: 1px solid var(--mlcl-line); border-radius: 8px; padding: 13px; text-align: center; min-height: 108px; }
.mlcl-team-page .mlcl-tp-ncard--best { border-color: var(--mlcl-orange); box-shadow: 0 0 0 2px rgba(255, 139, 72, .18); }
.mlcl-team-page .mlcl-tp-sl { font: 700 9px/1.2 "Oswald", system-ui, sans-serif; letter-spacing: .06em; color: #54656c; }
.mlcl-team-page .mlcl-tp-sl .xl { color: #54656c; }
.mlcl-team-page .mlcl-tp-nn { font: 700 14px/1.05 "Oswald", system-ui, sans-serif; text-transform: uppercase; color: var(--mlcl-ink); margin: 7px 0 6px; }
.mlcl-team-page .mlcl-tp-nr { font: 700 16px/1 "Oswald", system-ui, sans-serif; color: var(--mlcl-accent-ink); font-variant-numeric: tabular-nums; }
.mlcl-team-page .mlcl-tp-nf { font-size: 11px; color: #54656c; margin-top: 3px; }
.mlcl-team-page .mlcl-tp-ncard .brk { margin: 8px 0 0; margin-right: 0; }
.mlcl-team-page .mlcl-tp-star { display: inline-block; font: 700 8px/1 "Oswald", system-ui, sans-serif; letter-spacing: .04em; color: #0c2530; background: var(--mlcl-orange); border-radius: 2px; padding: 3px 6px; margin-top: 8px; }

/* Roster: player cards, each linked to the profile, with the season span. */
.mlcl-team-page .mlcl-tp-roster { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; }
.mlcl-team-page .mlcl-tp-pc { display: flex; align-items: center; gap: 11px; background: var(--mlcl-surface); border: 1px solid var(--mlcl-line); border-radius: 8px; padding: 13px; text-decoration: none; }
.mlcl-team-page a.mlcl-tp-pc:hover { box-shadow: 0 4px 14px rgba(12, 37, 48, .10); border-color: var(--mlcl-orange); }
.mlcl-team-page .mlcl-tp-pi { flex: none; width: 40px; height: 40px; font-size: 14px; background: #1a4458; box-shadow: none; }
.mlcl-team-page .mlcl-tp-pc-body { display: flex; flex-direction: column; min-width: 0; }
.mlcl-team-page .mlcl-tp-pn { font-weight: 700; color: var(--mlcl-ink); font-size: 14px; }
.mlcl-team-page .mlcl-tp-py { font-size: 11px; color: #54656c; margin-top: 2px; }

/* empty / not-found state */
.mlcl-team-page .mlcl-tp-empty { padding: 40px; }

/* ---------- responsive: single 760px reflow ---------- */
@media (max-width: 760px) {
  .mlcl-team-page .hero { padding: 24px 18px 20px; gap: 16px; flex-wrap: wrap; }
  .mlcl-team-page .mlcl-tp-band { grid-template-columns: repeat(3, 1fr); }
  .mlcl-team-page .mlcl-tp-band div:nth-child(n+4) { border-top: 1px solid #122e3a; }
  /* timeline reflows to a vertical rail: the connector runs down the left edge,
     dots pin to it, cards stack and left-align. */
  .mlcl-team-page .mlcl-tp-tl { grid-template-columns: 1fr; gap: 10px; }
  .mlcl-team-page .mlcl-tp-node { padding: 0 0 0 24px; }
  .mlcl-team-page .mlcl-tp-node::before,
  .mlcl-team-page .mlcl-tp-node:first-child::before,
  .mlcl-team-page .mlcl-tp-node:last-child::before { top: 0; bottom: 0; left: 6px; right: auto; width: 2px; height: auto; }
  .mlcl-team-page .mlcl-tp-dot { position: absolute; left: 0; top: 16px; margin: 0; }
  .mlcl-team-page .mlcl-tp-ncard { text-align: left; min-height: 0; }
  .mlcl-team-page .mlcl-tp-roster { grid-template-columns: 1fr; }
}

@media (prefers-reduced-motion: reduce) {
  .mlcl-team-page a.mlcl-tp-pc { transition: none; }
}

/* --- Record book hub: one shared fluid shell ------------------------------- */
/* Hub surfaces render through two chrome structures: normal WP pages
   (record book, records, head-to-head, team directory) and dedicated taxonomy
   templates (team, season, week, player surfaces). 2026-06-10: the old boxed
   shell (1180px #content + 1140px column) made the hub read fixed-width while
   the rest of the site runs full-bleed bands. Lift every outer cap, the same
   lift the broadcast pages get, so each hub section can paint its background
   edge to edge; the inner content cap moves onto the sections themselves (see
   "Hub fluid bands" below). */
body.mlcl-hub #page.site,
body.mlcl-hub #content.site-content,
body.mlcl-hub .content-area { max-width: none; }
body.mlcl-hub #content.site-content {
  padding-left: 0;
  padding-right: 0;
  box-sizing: border-box;
}
body.mlcl-hub .content-area { width: 100%; }
body.mlcl-hub.page .inside-article {
  max-width: none;
  padding: 0;
  border: 0;
  background: transparent;
}

/* Hub fluid bands (2026-06-10): the hub keeps its own section vocabulary
   (.crumbs / .hero / .sec / the dark stat and filter strips) but adopts the
   broadcast band model: each section element spans the viewport and owns the
   full-bleed background paint, while the content inside is centered and capped
   at the site-standard inner width, --wp--style--global--content-size = 1200px
   (theme.json contentSize, the same cap WP's constrained layout applies inside
   the home/standings .mlcl-band groups). Implemented as symmetric padding with
   the hub's own 40px gutter as the floor: below 1280px the sections keep
   today's rhythm, above it the content column locks to 1200px while the
   backgrounds run edge to edge. Scoped to min-width 761px so the hub's single
   760px mobile breakpoint (18px gutters) is untouched. */
.site-main .mlcl-hub { width: 100%; }
@media (min-width: 761px) {
  body.mlcl-hub .mlcl-hub .sec,
  body.mlcl-hub .mlcl-hub > .crumbs,
  body.mlcl-hub .mlcl-hub > .hero,
  body.mlcl-hub .mlcl-hub > .wkbar,
  body.mlcl-hub .mlcl-hub > .tools,
  body.mlcl-hub .mlcl-hub > .mlcl-season-pager,
  body.mlcl-hub .mlcl-records .marq {
    padding-left: max(40px, calc((100% - 1200px) / 2));
    padding-right: max(40px, calc((100% - 1200px) / 2));
  }
  /* The player/team dark stat strips have no side gutter of their own (the
     cells carry it), so their floor is 0: flush below 1280px exactly as
     today, locked to the 1200px column above it. */
  body.mlcl-hub .mlcl-hub > .mlcl-pp-band,
  body.mlcl-hub .mlcl-hub > .mlcl-tp-band {
    padding-left: max(0px, calc((100% - 1200px) / 2));
    padding-right: max(0px, calc((100% - 1200px) / 2));
  }
}

/* Pull every hub surface up under the ticker. GeneratePress adds top padding on
   the content wrapper and a top margin on <main>; the hub owns its own top
   spacing, so that GP chrome just opens a dead gap below the ticker. Zero both
   (top only; bottom spacing is left intact) so the hub content leads the page. */
body.mlcl-hub #content.site-content { padding-top: 0; }
body.mlcl-hub .site-main { margin-top: 0; }

.mlcl-record-book { color: var(--mlcl-ink); }
.mlcl-record-book a { color: var(--mlcl-teal-ink); text-decoration: none; }
.mlcl-record-book a:hover { color: var(--mlcl-accent-ink); }

/* Empty / no-plugin state */
.mlcl-rb-empty {
  max-width: 1080px;
  margin: 2rem auto;
  padding: 1.5rem;
  background: #fff;
  border: 1px solid var(--mlcl-line);
  border-radius: 0;
  box-shadow: var(--mlcl-hub-shadow, 0 8px 24px rgba(12, 37, 48, 0.07));
}

/* Hero: a full dark deep-teal band. .ink-anchor (on the element in render.php)
   re-declares the bright token set + paints the dark background, so every text
   color below resolves to a light value that passes AA on the deep teal. */
.mlcl-rb-hero {
  position: relative;
  overflow: hidden;
  padding: 1.9rem 1.75rem;
  border-radius: 0;
  background: var(--mlcl-bg);
  box-shadow: var(--mlcl-hub-shadow, 0 8px 24px rgba(12, 37, 48, 0.07));
}
.mlcl-rb-hero::after {
  content: "";
  position: absolute;
  top: -60px;
  right: -40px;
  width: 320px;
  height: 220px;
  background: radial-gradient(160px 160px at 70% 20%, rgba(255, 139, 72, 0.4), transparent 70%);
  pointer-events: none;
}
.mlcl-rb-eyebrow {
  position: relative;
  z-index: 1;
  margin: 0;
  text-transform: uppercase;
  letter-spacing: 0.18em;
  font-size: 0.72rem;
  font-weight: 700;
  color: var(--mlcl-teal-ink);
}
/* Page-hero echo: lead the title with the redesign's orange left-accent bar and
   uppercase weight, the same treatment the Standings/Rosters page heroes use, so
   the record book reads as one of the site's pages, not a separate hub. */
.mlcl-rb-title {
  position: relative;
  z-index: 1;
  margin: 0.5rem 0 0;
  padding-left: 1rem;
  border-left: 5px solid var(--mlcl-orange);
  font-family: "Oswald", system-ui, sans-serif;
  font-size: clamp(2.1rem, 6vw, 3.4rem);
  font-weight: 700;
  line-height: 1;
  letter-spacing: .01em;
  text-transform: uppercase;
  color: var(--mlcl-ink);
}
.mlcl-rb-intro {
  position: relative;
  z-index: 1;
  margin: 0.55rem 0 0;
  color: var(--mlcl-ink-dim);
  font-weight: 500;
  font-size: 0.95rem;
  max-width: 46ch;
}

/* Hero stat strip */
.mlcl-rb-stats {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 1px;
  margin-top: 1.3rem;
  background: var(--mlcl-line-strong);
  border-radius: 0;
  overflow: hidden;
}
.mlcl-rb-stat {
  background: var(--mlcl-surface);
  padding: 0.9rem 0.75rem;
  text-align: center;
}
.mlcl-rb-stat-n {
  font-family: "Oswald", system-ui, sans-serif;
  font-size: 1.5rem;
  font-weight: 700;
  line-height: 1;
  color: var(--mlcl-ink);
  font-variant-numeric: tabular-nums;
}
.mlcl-rb-stat-l {
  margin-top: 0.4rem;
  font-size: 0.64rem;
  text-transform: uppercase;
  letter-spacing: 0.09em;
  color: var(--mlcl-teal-ink);
  font-weight: 700;
}

/* Layout: ledger column + side rail */
.mlcl-rb-grid {
  display: grid;
  grid-template-columns: 1fr 360px;
  gap: 1.6rem;
  margin-top: 1.75rem;
  align-items: start;
}

/* Section header (shared by the Champions + Browse rows) */
.mlcl-rb-sec-h {
  display: flex;
  align-items: baseline;
  gap: 0.75rem;
  margin: 0 0 0.9rem;
}
.mlcl-rb-sec-h h2 {
  margin: 0;
  font-size: 1.2rem;
  font-weight: 800;
  letter-spacing: -0.01em;
  color: var(--mlcl-ink);
}
.mlcl-rb-sec-rule {
  flex: 1;
  height: 1px;
  background: var(--mlcl-line);
  transform: translateY(-4px);
}
.mlcl-rb-sec-h--browse { margin-top: 1.75rem; }

/* Champions ledger */
.mlcl-rb-ledger { display: flex; flex-direction: column; gap: 0.6rem; }
.mlcl-rb-champ {
  display: grid;
  grid-template-columns: 64px 2rem 1fr auto;
  gap: 0.9rem;
  align-items: center;
  background: #fff;
  border: 1px solid var(--mlcl-line);
  border-radius: 0;
  padding: 0.85rem 1rem;
  box-shadow: var(--mlcl-hub-shadow, 0 8px 24px rgba(12, 37, 48, 0.07));
  transition: transform 0.15s ease, box-shadow 0.15s ease;
}
.mlcl-rb-champ:hover {
  transform: translateY(-2px);
  box-shadow: 0 1px 2px rgba(12, 37, 48, 0.04), 0 12px 26px rgba(12, 37, 48, 0.1);
}
.mlcl-rb-sea { display: flex; flex-direction: column; }
.mlcl-rb-sea-s {
  font-weight: 800;
  font-size: 1.02rem;
  letter-spacing: -0.02em;
  color: var(--mlcl-ink);
}
.mlcl-rb-sea-y {
  font-size: 0.66rem;
  color: var(--mlcl-ink-mute);
  font-weight: 700;
  text-transform: uppercase;
}
.mlcl-rb-champ-main { min-width: 0; }
.mlcl-rb-champ-tn { font-weight: 800; font-size: 1.02rem; }
.mlcl-rb-champ-tn a { color: var(--mlcl-ink); }
.mlcl-rb-champ-pl {
  font-size: 0.8rem;
  color: var(--mlcl-ink-dim);
  font-weight: 500;
  margin-top: 0.1rem;
}
.mlcl-rb-champ-pl a { color: var(--mlcl-teal-ink); }
.mlcl-rb-badge {
  display: inline-flex;
  align-items: center;
  gap: 0.45rem;
  background: var(--mlcl-bg-2);
  border: 1px solid var(--mlcl-line);
  border-radius: 0;
  padding: 0.3rem 0.75rem;
  font-weight: 800;
  font-size: 0.74rem;
  color: var(--mlcl-ink);
  white-space: nowrap;
}
.mlcl-rb-badge-t {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 1.15rem;
  height: 1.15rem;
  padding: 0 0.2rem;
  border-radius: 0;
  background: var(--mlcl-orange);
  color: #0c2530;
  font-size: 0.62rem;
  font-weight: 800;
}
.mlcl-rb-ledger-empty {
  background: #fff;
  border: 1px dashed var(--mlcl-line-strong);
  border-radius: 0;
  padding: 1.25rem;
  color: var(--mlcl-ink-mute);
  font-weight: 600;
}

/* Side-rail leaderboards */
.mlcl-rb-board {
  background: #fff;
  border: 1px solid var(--mlcl-line);
  border-radius: 0;
  padding: 1rem 1.1rem;
  margin-bottom: 1.1rem;
  box-shadow: var(--mlcl-hub-shadow, 0 8px 24px rgba(12, 37, 48, 0.07));
}
.mlcl-rb-board h3 {
  margin: 0 0 0.75rem;
  font-size: 0.72rem;
  text-transform: uppercase;
  letter-spacing: 0.11em;
  color: var(--mlcl-ink-mute);
}
.mlcl-rb-lrow {
  display: flex;
  align-items: center;
  gap: 0.7rem;
  padding: 0.5rem 0;
  border-top: 1px solid var(--mlcl-line);
}
.mlcl-rb-lrow:first-of-type { border-top: 0; }
.mlcl-rb-rk {
  width: 1.25rem;
  text-align: center;
  font-weight: 800;
  font-size: 0.85rem;
  color: var(--mlcl-ink-mute);
  font-variant-numeric: tabular-nums;
}
.mlcl-rb-ln { font-weight: 700; font-size: 0.92rem; min-width: 0; }
.mlcl-rb-ln a { color: var(--mlcl-ink); }
.mlcl-rb-lv {
  margin-left: auto;
  font-weight: 800;
  font-size: 0.92rem;
  color: var(--mlcl-accent-ink);
  font-variant-numeric: tabular-nums;
}
.mlcl-rb-lrow--lead .mlcl-rb-rk { color: var(--mlcl-accent-ink); }
.mlcl-rb-board-empty {
  margin: 0;
  color: var(--mlcl-ink-mute);
  font-weight: 600;
  font-size: 0.88rem;
}

/* Browse buttons */
.mlcl-rb-browse {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0.9rem;
}
.mlcl-rb-bbtn {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: 0.2rem;
  background: #fff;
  border: 1px solid var(--mlcl-line);
  border-radius: 0;
  padding: 1.15rem;
  box-shadow: var(--mlcl-hub-shadow, 0 8px 24px rgba(12, 37, 48, 0.07));
  transition: transform 0.15s ease;
}
.mlcl-rb-bbtn:hover { transform: translateY(-2px); text-decoration: none; }
.mlcl-rb-bn { font-weight: 800; font-size: 1.15rem; color: var(--mlcl-ink); }
.mlcl-rb-bs { font-size: 0.8rem; color: var(--mlcl-ink-mute); font-weight: 600; }
.mlcl-rb-arrow {
  position: absolute;
  top: 1.1rem;
  right: 1.15rem;
  color: var(--mlcl-accent-ink);
  font-weight: 800;
  font-size: 1.2rem;
  line-height: 1;
}

@media (prefers-reduced-motion: reduce) {
  .mlcl-rb-champ { transition: none; }
  .mlcl-rb-bbtn { transition: none; }
}

@media (max-width: 820px) {
  .mlcl-rb-grid { grid-template-columns: 1fr; }
  .mlcl-rb-stats { grid-template-columns: repeat(3, 1fr); }
}

@media (max-width: 560px) {
  .mlcl-rb-champ {
    grid-template-columns: 54px 2rem 1fr;
    row-gap: 0.5rem;
  }
  .mlcl-rb-badge {
    grid-column: 2 / 4;
    justify-self: start;
  }
  .mlcl-rb-browse { grid-template-columns: 1fr; }
}

@media (max-width: 420px) {
  .mlcl-rb-stats { grid-template-columns: repeat(2, 1fr); }
  /* Five stats in a 2-col grid leave the last one (Founded) alone on the final
     row with an empty filler cell beside it. Span the last stat full width so
     the strip reads as a clean block. */
  .mlcl-rb-stat:last-child { grid-column: 1 / -1; }
}

/* --- Player / team directories (A-Z + client search) ---------------------- */
/* Shared by the player-directory and team-directory blocks via the
   mlcl_hub_render_directory() helper. The page header is an .ink-anchor dark
   band (bright AA tokens); the list below rests on the cream body, so item rows
   use ink tokens that pass AA on light. The search filter is progressive
   enhancement (view.js); without JS the full list renders and links work. */
.mlcl-dir-page { color: var(--mlcl-ink); }
.mlcl-dir-page .mlcl-dir-wrap {
  max-width: 1080px;
  margin: 0 auto;
  padding: 1.5rem 1.4rem 4rem;
}

.mlcl-dir-crumb {
  font-size: 0.78rem;
  font-weight: 700;
  color: var(--mlcl-ink-mute);
  letter-spacing: 0.01em;
  margin-bottom: 0.9rem;
}
.mlcl-dir-crumb a { color: var(--mlcl-ink-mute); }
.mlcl-dir-crumb a:hover { color: var(--mlcl-teal-ink); }
.mlcl-dir-crumb-sep { margin: 0 0.4rem; }
.mlcl-dir-crumb-current { color: var(--mlcl-ink); }

/* Header band */
.mlcl-dir-head {
  position: relative;
  overflow: hidden;
  padding: 1.6rem 1.75rem;
  border-radius: 0;
  box-shadow: var(--mlcl-hub-shadow, 0 8px 24px rgba(12, 37, 48, 0.07));
}
.mlcl-dir-head::after {
  content: "";
  position: absolute;
  top: -60px;
  right: -40px;
  width: 320px;
  height: 220px;
  background: radial-gradient(160px 160px at 70% 20%, rgba(255, 139, 72, 0.4), transparent 70%);
  pointer-events: none;
}
/* Page-hero echo, same as .mlcl-rb-title: orange left-accent bar + uppercase so
   the directory header matches the site's other page heroes. */
.mlcl-dir-title {
  position: relative;
  z-index: 1;
  margin: 0;
  padding-left: 1rem;
  border-left: 5px solid var(--mlcl-orange);
  font-size: clamp(1.9rem, 5.5vw, 3rem);
  font-weight: 800;
  line-height: 1.02;
  letter-spacing: -0.01em;
  text-transform: uppercase;
  color: var(--mlcl-ink);
}
.mlcl-dir-count {
  position: relative;
  z-index: 1;
  margin: 0.5rem 0 0;
  color: var(--mlcl-teal-ink);
  font-weight: 700;
  font-size: 0.9rem;
  letter-spacing: 0.01em;
}

/* Search + jump nav tools */
.mlcl-dir-tools { margin: 1.5rem 0 0.5rem; }
.mlcl-dir-search-l {
  display: block;
  margin-bottom: 0.4rem;
  font-size: 0.8rem;
  font-weight: 700;
  color: var(--mlcl-ink-dim);
}
.mlcl-dir-search {
  width: 100%;
  max-width: 28rem;
  padding: 0.7rem 0.95rem;
  font-size: 1rem;
  font-family: inherit;
  color: var(--mlcl-ink);
  background: var(--mlcl-bg-3);
  border: 1px solid var(--mlcl-line-strong);
  border-radius: 0;
  box-shadow: var(--mlcl-hub-shadow, 0 1px 2px rgba(12, 37, 48, 0.05));
  -webkit-appearance: none;
  appearance: none;
}
.mlcl-dir-search::placeholder { color: var(--mlcl-ink-mute); opacity: 1; }
.mlcl-dir-search:focus-visible {
  outline: 3px solid var(--mlcl-teal-ink);
  outline-offset: 2px;
  border-color: var(--mlcl-teal-ink);
}

.mlcl-dir-az {
  display: flex;
  flex-wrap: wrap;
  gap: 0.3rem;
  margin: 0.9rem 0 0.4rem;
}
.mlcl-dir-az-l {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 1.85rem;
  height: 1.85rem;
  padding: 0 0.35rem;
  font-size: 0.82rem;
  font-weight: 800;
  color: var(--mlcl-teal-ink);
  background: var(--mlcl-bg-2);
  border: 1px solid var(--mlcl-line);
  border-radius: 0;
  text-decoration: none;
}
.mlcl-dir-az-l:hover {
  color: #fff;
  background: var(--mlcl-teal-deep);
  border-color: var(--mlcl-teal-deep);
}
.mlcl-dir-az-l:focus-visible {
  outline: 3px solid var(--mlcl-teal-ink);
  outline-offset: 2px;
}

/* Letter groups + item rows */
.mlcl-dir-list { margin-top: 1rem; }
.mlcl-dir-group { margin-top: 1.4rem; }
.mlcl-dir-group:first-child { margin-top: 0.6rem; }
.mlcl-dir-letter {
  margin: 0 0 0.6rem;
  padding-bottom: 0.35rem;
  font-size: 1.15rem;
  font-weight: 800;
  letter-spacing: 0.02em;
  color: var(--mlcl-accent-ink);
  border-bottom: 2px solid var(--mlcl-line);
  scroll-margin-top: 1rem;
}
.mlcl-dir-items {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.5rem 1rem;
}
.mlcl-dir-li { margin: 0; }
.mlcl-dir-item {
  display: flex;
  align-items: center;
  gap: 0.7rem;
  padding: 0.55rem 0.75rem;
  background: var(--mlcl-bg-3);
  border: 1px solid var(--mlcl-line);
  border-radius: 0;
  text-decoration: none;
  color: var(--mlcl-ink);
  transition: border-color 0.15s ease, box-shadow 0.15s ease, transform 0.15s ease;
}
.mlcl-dir-item:hover {
  border-color: var(--mlcl-line-strong);
  box-shadow: var(--mlcl-hub-shadow, 0 8px 24px rgba(12, 37, 48, 0.07));
  transform: translateY(-1px);
}
.mlcl-dir-item:focus-visible {
  outline: 3px solid var(--mlcl-teal-ink);
  outline-offset: 2px;
}
.mlcl-dir-av { flex: 0 0 auto; }
.mlcl-dir-body {
  flex: 1 1 auto;
  min-width: 0;
  display: flex;
  flex-direction: column;
}
.mlcl-dir-name {
  font-weight: 700;
  font-size: 0.95rem;
  color: var(--mlcl-ink);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.mlcl-dir-meta {
  font-size: 0.78rem;
  color: var(--mlcl-ink-mute);
  font-weight: 600;
}
.mlcl-dir-arrow {
  flex: 0 0 auto;
  color: var(--mlcl-ink-mute);
  font-size: 1.1rem;
  font-weight: 700;
}
.mlcl-dir-item:hover .mlcl-dir-arrow { color: var(--mlcl-teal-ink); }

/* Empty + no-match states */
.mlcl-dir--empty {
  margin-top: 1rem;
  padding: 1.5rem;
  background: var(--mlcl-bg-3);
  border: 1px solid var(--mlcl-line);
  border-radius: 0;
}
.mlcl-dir-emptynote,
.mlcl-dir-nomatch {
  margin: 0;
  color: var(--mlcl-ink-dim);
  font-weight: 600;
}
.mlcl-dir-nomatch {
  margin-top: 1.2rem;
  padding: 1rem 1.25rem;
  background: var(--mlcl-bg-2);
  border: 1px dashed var(--mlcl-line-strong);
  border-radius: 0;
}
/* The no-match note is a persistent ARIA live region (role=status). It starts
   empty and view.js sets its textContent when 0 items match, so screen readers
   announce the change. :empty hides it visually while it stays in the a11y tree. */
.mlcl-dir-nomatch:empty { display: none; }

@media (max-width: 680px) {
  .mlcl-dir-items { grid-template-columns: 1fr; }
}

@media (prefers-reduced-motion: reduce) {
  .mlcl-dir-item { transition: none; }
  .mlcl-dir-item:hover { transform: none; }
}

/* ---- History hub: season overview + week view ---- */
.mlcl-so-wrap {
	max-width: 56rem;
	margin: 0 auto;
	padding: 0 1rem 3rem;
}
.mlcl-so-crumb {
	display: flex;
	flex-wrap: wrap;
	gap: 0.4rem;
	align-items: center;
	font-size: 0.85rem;
	margin: 1rem 0;
	color: var(--mlcl-ink-mute);
}
.mlcl-so-crumb a {
	color: var(--mlcl-teal-ink);
}
.mlcl-so-hero {
	border-radius: 0.75rem;
	padding: 1.75rem 1.5rem;
	margin-bottom: 1.5rem;
}
.mlcl-so-eyebrow {
	text-transform: uppercase;
	letter-spacing: 0.08em;
	font-size: 0.8rem;
	margin: 0 0 0.25rem;
	opacity: 0.85;
}
.mlcl-so-title {
	margin: 0;
	font-size: clamp( 1.6rem, 4vw, 2.4rem );
	line-height: 1.1;
}
.mlcl-so-champs {
	margin: 0 0 1.5rem;
}
.mlcl-so-champs-h {
	font-size: 1rem;
	text-transform: uppercase;
	letter-spacing: 0.06em;
	color: var(--mlcl-ink-mute);
	margin: 0 0 0.5rem;
}
.mlcl-so-champ {
	display: flex;
	align-items: baseline;
	gap: 0.5rem;
	padding: 0.35rem 0;
}
.mlcl-so-trophy {
	color: #b8860b;
}
.mlcl-so-champ-note {
	font-size: 0.85rem;
	color: var(--mlcl-ink-mute);
}
.mlcl-so-pending {
	background: var(--mlcl-sand, #efe7d8);
	border-radius: 0.5rem;
	padding: 1rem 1.25rem;
	margin: 0 0 1.5rem;
	font-style: italic;
}
.mlcl-so-bracket {
	margin: 0 0 2rem;
}
.mlcl-so-bracket-h {
	font-size: 1.15rem;
	margin: 0 0 0.5rem;
}
.mlcl-so-table {
	width: 100%;
	border-collapse: collapse;
	font-variant-numeric: tabular-nums;
}
.mlcl-so-table th,
.mlcl-so-table td {
	text-align: left;
	padding: 0.5rem 0.6rem;
	border-bottom: 1px solid rgba( 0, 0, 0, 0.08 );
}
.mlcl-so-th-num,
.mlcl-so-td-num,
.mlcl-so-th-rank,
.mlcl-so-td-rank {
	text-align: right;
	white-space: nowrap;
}
.mlcl-so-th-rank,
.mlcl-so-td-rank {
	width: 2.5rem;
	text-align: center;
}
.mlcl-so-row--champ {
	background: rgba( 184, 134, 11, 0.10 );
	font-weight: 600;
}
.mlcl-so-tag {
	color: #b8860b;
	margin-left: 0.25rem;
}
.mlcl-so-weeks {
	margin-top: 1rem;
}
.mlcl-so-weeklist {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-wrap: wrap;
	gap: 0.5rem;
}
.mlcl-so-weekitem a {
	display: inline-block;
	padding: 0.4rem 0.75rem;
	border: 1px solid rgba( 0, 0, 0, 0.15 );
	border-radius: 0.4rem;
	color: var(--mlcl-teal-ink);
	text-decoration: none;
}
/* Links on the new hub surfaces read as the hub's AA dark teal on the light
   body; they otherwise inherit the GeneratePress default link color, which
   fails the AA contrast floor (standings team links, champion links, the
   empty-state and 404 back-links). */
.mlcl-so a {
	color: var(--mlcl-teal-ink);
}
/* Inside the dark ink-anchor hero band, links take the hero's light ink color
   (AA on the deep navy) and stay underlined so they still read as links. */
.mlcl-so-hero a {
	color: inherit;
	text-decoration: underline;
}

/* ---- History hub: seasons index ---- */
.mlcl-si-wrap {
	max-width: 56rem;
	margin: 0 auto;
	padding: 0 1rem 3rem;
}
.mlcl-si-crumb {
	display: flex;
	flex-wrap: wrap;
	gap: 0.4rem;
	align-items: center;
	font-size: 0.85rem;
	margin: 1rem 0;
	color: var(--mlcl-ink-mute);
}
.mlcl-si-hero {
	border-radius: 0.75rem;
	padding: 1.75rem 1.5rem;
	margin-bottom: 1.5rem;
}
.mlcl-si-eyebrow {
	text-transform: uppercase;
	letter-spacing: 0.08em;
	font-size: 0.8rem;
	margin: 0 0 0.25rem;
	opacity: 0.85;
}
.mlcl-si-title {
	margin: 0;
	font-size: clamp( 1.6rem, 4vw, 2.4rem );
	line-height: 1.1;
}
.mlcl-si-list {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: 0.5rem;
}
.mlcl-si-link {
	display: flex;
	align-items: baseline;
	flex-wrap: wrap;
	gap: 0.5rem 0.9rem;
	padding: 0.85rem 1rem;
	border: 1px solid rgba( 0, 0, 0, 0.12 );
	border-radius: 0.6rem;
	text-decoration: none;
	transition: border-color 0.15s ease, background 0.15s ease;
}
.mlcl-si-link:hover {
	border-color: var(--mlcl-teal-ink);
	background: rgba( 24, 112, 112, 0.05 );
}
.mlcl-si-season {
	font-weight: 700;
	font-size: 1.05rem;
}
.mlcl-si-meta {
	display: flex;
	flex-wrap: wrap;
	align-items: baseline;
	gap: 0.4rem 0.9rem;
	margin-left: auto;
	font-size: 0.88rem;
	color: var(--mlcl-ink-mute);
}
.mlcl-si-champ {
	display: inline-flex;
	align-items: baseline;
	gap: 0.3rem;
}
.mlcl-si-trophy {
	color: #b8860b;
}
.mlcl-si-champ-name {
	font-weight: 600;
	color: var(--mlcl-ink);
}
.mlcl-si-champ-note {
	font-size: 0.8rem;
}
.mlcl-si-badge {
	display: inline-block;
	padding: 0.1rem 0.5rem;
	border-radius: 0.35rem;
	background: var(--mlcl-sand, #efe7d8);
	color: var(--mlcl-ink);
	font-size: 0.78rem;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.04em;
}
.mlcl-si-counts {
	white-space: nowrap;
}
.mlcl-si-counts-sep {
	margin: 0 0.3rem;
}
.mlcl-si-arrow {
	color: var(--mlcl-teal-ink);
}
@media ( max-width: 30rem ) {
	.mlcl-si-meta {
		margin-left: 0;
		width: 100%;
	}
}
/* Links on the seasons index read as the hub's AA dark teal on the light body
   (the row anchor + arrow); inside the dark ink-anchor hero band, links take the
   light hero ink and stay underlined. Mirrors the season/week surfaces. */
.mlcl-si a {
	color: var(--mlcl-teal-ink);
}
.mlcl-si-hero a {
	color: inherit;
	text-decoration: underline;
}
/* ============================================================
   Record Book hub -- shared component vocabulary (ported from the
   approved mockups). Scoped under .mlcl-hub so it does not collide
   with the app/broadcast styles. Single 760px breakpoint; AA pairings.

   Color mapping: the hub body runs data-theme="light", so the theme
   tokens resolve to the mockup's cream/white/navy palette
   (--mlcl-bg=cream, --mlcl-surface=white, --mlcl-ink=navy,
   --mlcl-orange=orange, --mlcl-line=subtle navy). FIXED-dark elements
   (the Latest Week left panel, the table thead, the bracket badges, the
   Explore cards) use the theme-invariant var(--mlcl-navy) + white text, because
   --mlcl-bg flips to cream here and a token fill would break the navy.
   The on-navy muted ink (--mlcl-navy-ink-dim) and on-light muted ink (--mlcl-ink-soft) are the
   mockup literals; both clear AA on their backgrounds.
   ============================================================ */

/* The hub display headings use Oswald (the global .disp utility already
   sets the family); restate here so the record book is self-contained. */
.mlcl-hub .disp { font-family: "Oswald", system-ui, sans-serif; text-transform: uppercase; letter-spacing: .01em; }

/* cross-links: every name is a link, underline grows on hover */
.mlcl-hub .xl { color: inherit; text-decoration: none; background: linear-gradient(var(--mlcl-orange), var(--mlcl-orange)) left bottom/0% 2px no-repeat; transition: background-size .15s; padding-bottom: 1px; }
.mlcl-hub .xl:hover, .mlcl-hub .xl:focus-visible { background-size: 100% 2px; }

/* hero */
.mlcl-record-book .hero { position: relative; background: var(--mlcl-navy); color: #fff; padding: 34px 40px 30px; overflow: hidden; border-radius: 0; }
.mlcl-record-book .hero::after { content: ""; position: absolute; inset: 0 0 0 auto; width: 44%; background: linear-gradient(115deg, transparent, rgba(255, 255, 255, .05)); clip-path: polygon(24% 0, 100% 0, 100% 100%, 0 100%); pointer-events: none; }
.mlcl-record-book .hero .ey { font: 700 12px/1 "Oswald", system-ui, sans-serif; letter-spacing: .2em; color: var(--mlcl-orange); }
.mlcl-record-book .hero h1 { font-weight: 700; font-size: clamp(38px, 7vw, 60px); line-height: .95; margin: 6px 0 0; padding-left: 16px; border-left: 6px solid var(--mlcl-orange); color: #fff; }
.mlcl-record-book .hero p { color: var(--mlcl-navy-ink-dim); font-size: 15px; margin: 12px 0 0; max-width: 480px; position: relative; z-index: 2; }
.mlcl-record-book .mini { position: relative; z-index: 2; display: flex; flex-wrap: wrap; gap: 14px 26px; margin-top: 18px; }
.mlcl-record-book .mini b { font: 700 22px/1 "Oswald", system-ui, sans-serif; color: var(--mlcl-orange); display: block; }
.mlcl-record-book .mini span { font-size: 11px; letter-spacing: .08em; text-transform: uppercase; color: var(--mlcl-navy-ink-dim); display: block; margin-top: 2px; }
.mlcl-record-book .mlcl-rb-hero-actions { position: relative; z-index: 2; display: flex; align-items: center; gap: 14px; flex-wrap: wrap; margin-top: 20px; }
.mlcl-record-book .mlcl-rb-hero-link { font: 700 12px/1 "Oswald", system-ui, sans-serif; letter-spacing: .06em; color: #f4f1ea; text-decoration: none; }
.mlcl-record-book .mlcl-rb-hero-link::after { content: " \2192"; color: var(--mlcl-orange); }
.mlcl-record-book .mlcl-rb-hero-link:hover { color: var(--mlcl-orange); }

/* sections + section heads */
.mlcl-hub .sec { padding: 26px 40px; }
.mlcl-hub .sec--last { padding-bottom: 34px; }
.mlcl-hub .shd { display: flex; align-items: center; gap: 12px; margin-bottom: 16px; flex-wrap: wrap; }
.mlcl-hub .shd .tab { width: 6px; height: 26px; background: var(--mlcl-orange); border-radius: 1px; flex: none; }
/* The .entry-content h2 site rule (0,3,1) outranks .mlcl-hub .disp (0,2,0) and
   would force Bricolage onto the Oswald section heads; match its weight so the
   hub display family wins inside the post content. */
.mlcl-site .entry-content .mlcl-hub .shd h2.disp,
.mlcl-hub .shd h2 { font-family: "Oswald", system-ui, sans-serif; font-weight: 700; font-size: 22px; color: var(--mlcl-ink); flex: 1; min-width: 160px; margin: 0; }
/* The same global prose rule also paints its own orange border-left bar onto
   the heads on page-rendered hub surfaces (/record-book/, /record-book/records/),
   doubling the .shd .tab bar. The .tab element is the hub's one bar; strip the
   inherited prose bar inside the hub ((0,4,1) beats the global (0,3,1)). */
.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-hub h2 {
  border-left: 0;
  padding-left: 0;
}
.mlcl-hub .shd .meta { font-size: 12px; color: var(--mlcl-ink-soft); }

/* btn (scoped so it does not inherit the site-wide .btn) */
.mlcl-hub .btn { display: inline-flex; align-items: center; min-height: 44px; font: 700 12px/1 "Oswald", system-ui, sans-serif; letter-spacing: .05em; color: var(--mlcl-navy); background: var(--mlcl-orange); padding: 0 18px; border-radius: 4px; text-decoration: none; transform: none; }
.mlcl-hub .btn:hover { background: #ffa468; color: var(--mlcl-navy); transform: none; }
/* AA fix: the .entry-content a rule (0,3,1) beats .mlcl-hub .btn (0,2,0) and
   forces rust text (#a84e16, 2.6:1 on orange = FAIL) onto hub CTAs.
   Match that weight with a 0,3,1 selector so hub buttons render navy-on-orange
   (6.83:1, passes AA), mirroring the homepage CTA treatment. */
.mlcl-site .entry-content .mlcl-hub .btn,
.mlcl-site .entry-content .mlcl-hub .btn:hover { color: var(--mlcl-navy); text-decoration: none; }

/* latest week */
.mlcl-hub .latest { display: grid; grid-template-columns: 1.05fr 1fr; border: 1px solid var(--mlcl-line); border-radius: 8px; overflow: hidden; }
/* Light surface (site grammar): the left summary panel sits on sand with ink
   text (the sand-vs-white split is the divider); the dark broadcast moment on
   this page is the hero + stat strip. */
.mlcl-hub .latest .l { background: var(--mlcl-bg-2); color: var(--mlcl-ink); padding: 22px 24px; }
.mlcl-hub .latest .l .wk { font: 700 13px/1 "Oswald", system-ui, sans-serif; letter-spacing: .1em; color: var(--mlcl-accent-ink); }
.mlcl-hub .latest .l .wk .xl { color: var(--mlcl-accent-ink); }
.mlcl-hub .latest .l h3 { font: 700 28px/1 "Oswald", system-ui, sans-serif; text-transform: uppercase; margin: 8px 0 10px; color: var(--mlcl-ink); }
.mlcl-hub .latest .l p { font-size: 13.5px; color: var(--mlcl-ink-dim); margin: 0; }
.mlcl-hub .latest .l .xl { background-image: linear-gradient(var(--mlcl-orange), var(--mlcl-orange)); }
.mlcl-hub .latest .l .btn { margin-top: 16px; }
.mlcl-hub .latest .r { background: var(--mlcl-surface); padding: 18px 22px; }
.mlcl-hub .latest .r .h { font: 700 11px/1 "Oswald", system-ui, sans-serif; letter-spacing: .1em; color: var(--mlcl-ink-soft); margin-bottom: 6px; }
.mlcl-hub .latest--empty { grid-template-columns: 1fr; }
.mlcl-hub .gr { display: flex; justify-content: space-between; gap: 12px; padding: 9px 0; border-bottom: 1px solid var(--mlcl-line); font-size: 13.5px; }
.mlcl-hub .gr:last-child { border-bottom: 0; }
.mlcl-hub .gr .s { font-family: "Oswald", system-ui, sans-serif; font-weight: 600; color: var(--mlcl-ink); white-space: nowrap; }
.mlcl-hub .gr .xl { font-weight: inherit; }

/* champions table */
.mlcl-hub .tablecard { border: 1px solid var(--mlcl-line); border-radius: 8px; overflow: hidden; }
.mlcl-hub table { width: 100%; border-collapse: collapse; background: var(--mlcl-surface); margin: 0; }
.mlcl-hub caption { text-align: left; padding: 0; margin: 0; position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
.mlcl-hub thead th { background: var(--mlcl-navy); color: #fff; font: 700 11px/1 "Oswald", system-ui, sans-serif; letter-spacing: .1em; text-align: left; padding: 12px 20px; }
/* Champions ladder header: standings-style light head (cream-grammar pass).
   Wins the equal-specificity tie against .mlcl-hub thead th by source order;
   the navy thead stays only on the player/team game-log tables. */
.mlcl-record-book thead th { background: var(--mlcl-bg-2); color: var(--mlcl-ink-mute); border-bottom: 2px solid var(--mlcl-line-strong); }
.mlcl-hub tbody td { padding: 13px 20px; border-top: 1px solid var(--mlcl-line); font-size: 14px; vertical-align: middle; }
.mlcl-hub tbody tr:nth-child(even) { background: #faf8f3; }
.mlcl-hub .seasoncell { white-space: nowrap; }
.mlcl-hub .seasoncell .so { font: 700 14px/1 "Oswald", system-ui, sans-serif; color: var(--mlcl-ink); }
.mlcl-hub .seasoncell small { display: block; font-size: 11px; color: var(--mlcl-ink-soft); margin-top: 3px; }
.mlcl-hub .champ { font-weight: 700; color: var(--mlcl-ink); }
.mlcl-hub .champ small { display: block; font-weight: 500; color: var(--mlcl-ink-soft); font-size: 12px; margin-top: 2px; }
.mlcl-hub .brk { display: inline-block; font: 700 10.5px/1 "Oswald", system-ui, sans-serif; letter-spacing: .04em; padding: 4px 7px; border-radius: 3px; margin-right: 8px; vertical-align: 1px; }
.mlcl-hub .brk.a { background: var(--mlcl-orange); color: var(--mlcl-navy); }
.mlcl-hub .brk.b { background: var(--mlcl-navy); color: #fff; }
.mlcl-hub .aonly { color: var(--mlcl-ink-soft); font-style: italic; font-size: 13px; }

/* records */
.mlcl-hub .rec { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; }
.mlcl-hub .rc { background: var(--mlcl-surface); border: 1px solid var(--mlcl-line); border-top: 3px solid var(--mlcl-orange); border-radius: 6px; padding: 15px; }
.mlcl-hub .rc .lab { font: 700 10.5px/1.3 "Oswald", system-ui, sans-serif; letter-spacing: .1em; color: var(--mlcl-ink-soft); }
.mlcl-hub .rc .val { font: 700 26px/1 "Oswald", system-ui, sans-serif; color: var(--mlcl-ink); margin: 8px 0 3px; }
.mlcl-hub .rc .val--name { font-size: 18px; }
.mlcl-hub .rc .who { font-size: 12px; color: var(--mlcl-ink-soft); }

/* explore */
.mlcl-hub .expl { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; }
/* Explore tiles: light surface cards (site grammar); accent text uses the
   AA-on-light ink variants. */
.mlcl-hub .ec { background: var(--mlcl-surface); color: var(--mlcl-ink); border: 1px solid var(--mlcl-line); border-radius: 8px; padding: 20px; display: flex; flex-direction: column; gap: 5px; text-decoration: none; transition: transform .12s, box-shadow .12s, border-color .12s; }
.mlcl-hub .ec:hover { transform: translateY(-3px); box-shadow: 0 10px 26px rgba(12, 37, 48, .14); border-color: var(--mlcl-orange); }
.mlcl-hub .ec .n { font: 700 26px/1 "Oswald", system-ui, sans-serif; color: var(--mlcl-accent-ink); }
.mlcl-hub .ec .t { font: 700 15px/1 "Oswald", system-ui, sans-serif; text-transform: uppercase; }
.mlcl-hub .ec .s { font-size: 12.5px; color: var(--mlcl-ink-dim); flex: 1; }
.mlcl-hub .ec .go { font: 700 11px/1 "Oswald", system-ui, sans-serif; letter-spacing: .05em; color: var(--mlcl-accent-ink); }
.mlcl-record-book .mlcl-rb-signup { display: flex; align-items: center; justify-content: space-between; gap: 24px; background: var(--mlcl-navy); color: #fff; border-top: 6px solid var(--mlcl-orange); }
.mlcl-record-book .mlcl-rb-signup .ey { font: 700 11px/1 "Oswald", system-ui, sans-serif; letter-spacing: .16em; text-transform: uppercase; color: var(--mlcl-orange); margin-bottom: 8px; }
.mlcl-record-book .mlcl-rb-signup h2 { color: #fff; margin: 0; font: 700 clamp(26px, 4vw, 38px)/.98 "Oswald", system-ui, sans-serif; text-transform: uppercase; }
.mlcl-site .entry-content .mlcl-record-book .mlcl-rb-signup h2.disp { color: #fff; }
.mlcl-record-book .mlcl-rb-signup p { color: var(--mlcl-navy-ink-dim); max-width: 58ch; margin: 10px 0 0; font-size: 14px; }
.mlcl-record-book .mlcl-rb-signup .btn { flex: none; }
.mlcl-hub .mlcl-hub-signup-cta { display: flex; align-items: center; justify-content: space-between; gap: 18px; margin-top: 6px; background: var(--mlcl-navy); color: #fff; border-top: 5px solid var(--mlcl-orange); }
.mlcl-hub .mlcl-hub-signup-cta .ey { font: 700 10px/1 "Oswald", system-ui, sans-serif; letter-spacing: .16em; color: var(--mlcl-orange); margin-bottom: 7px; }
.mlcl-hub .mlcl-hub-signup-cta h2 { color: #fff; margin: 0; font: 700 28px/1 "Oswald", system-ui, sans-serif; text-transform: uppercase; }
.mlcl-site .entry-content .mlcl-hub .mlcl-hub-signup-cta h2.disp { color: #fff; }
.mlcl-hub .mlcl-hub-signup-cta p { color: var(--mlcl-navy-ink-dim); max-width: 58ch; margin: 8px 0 0; font-size: 13.5px; }
.mlcl-hub .mlcl-hub-signup-cta .btn { flex: none; }

/* seasons-index: breadcrumb */
.mlcl-seasons-index .crumbs { padding: 12px 40px; background: var(--mlcl-navy); border-bottom: 1px solid var(--mlcl-navy-2); font: 700 11px/1 "Oswald", system-ui, sans-serif; letter-spacing: .08em; text-transform: uppercase; color: var(--mlcl-navy-ink-dim); }
.mlcl-seasons-index .crumbs a { color: var(--mlcl-orange); text-decoration: none; }
.mlcl-seasons-index .crumbs a:hover { color: #f4f1ea; }

/* seasons-index: hero (matches .mlcl-record-book .hero but scoped here) */
.mlcl-seasons-index .hero { position: relative; background: var(--mlcl-navy); color: #fff; padding: 32px 40px 28px; overflow: hidden; }
.mlcl-seasons-index .hero::after { content: ""; position: absolute; inset: 0 0 0 auto; width: 44%; background: linear-gradient(115deg, transparent, rgba(255, 255, 255, .05)); clip-path: polygon(24% 0, 100% 0, 100% 100%, 0 100%); pointer-events: none; }
.mlcl-seasons-index .hero .ey { font: 700 12px/1 "Oswald", system-ui, sans-serif; letter-spacing: .2em; color: var(--mlcl-orange); }
.mlcl-seasons-index .hero h1 { font-weight: 700; font-size: clamp(38px, 7vw, 58px); line-height: .95; margin: 6px 0 0; padding-left: 16px; border-left: 6px solid var(--mlcl-orange); color: #fff; }
.mlcl-seasons-index .hero p { color: var(--mlcl-navy-ink-dim); font-size: 14.5px; margin: 12px 0 0; max-width: 520px; position: relative; z-index: 2; }
.mlcl-seasons-index .mini { position: relative; z-index: 2; display: flex; flex-wrap: wrap; gap: 14px 26px; margin-top: 18px; }
.mlcl-seasons-index .mini b { font: 700 22px/1 "Oswald", system-ui, sans-serif; color: var(--mlcl-orange); display: block; }
.mlcl-seasons-index .mini span { font-size: 11px; letter-spacing: .08em; text-transform: uppercase; color: var(--mlcl-navy-ink-dim); display: block; margin-top: 2px; }

/* seasons-index: section note */
.mlcl-hub .shd .note { font-size: 12px; color: var(--mlcl-ink-soft); }

/* seasons-index: season card grid */
.mlcl-seasons-index .seasons { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.mlcl-seasons-index .scard { display: flex; flex-direction: column; background: var(--mlcl-surface); border: 1px solid var(--mlcl-line); border-radius: 10px; overflow: hidden; transition: box-shadow .12s, border-color .12s, transform .12s; }
.mlcl-seasons-index .scard:hover { box-shadow: 0 12px 28px rgba(12, 37, 48, .14); border-color: var(--mlcl-orange); transform: translateY(-2px); }

/* srail: sand header strip inside each light card (cream grammar; the navy
   band stays on the hero only). The season number keeps the accent, in its
   AA-on-light ink variant. */
.mlcl-seasons-index .srail { display: flex; align-items: center; gap: 14px; background: var(--mlcl-bg-2); color: var(--mlcl-ink); padding: 14px 18px; position: relative; border-bottom: 1px solid var(--mlcl-line); }
.mlcl-seasons-index .snum { font: 700 30px/1 "Oswald", system-ui, sans-serif; color: var(--mlcl-accent-ink); flex: none; min-width: 48px; }
.mlcl-seasons-index .stitle { flex: 1; min-width: 0; }
.mlcl-seasons-index .stitle a { font: 700 18px/1.05 "Oswald", system-ui, sans-serif; text-transform: uppercase; color: var(--mlcl-ink); text-decoration: none; }
.mlcl-seasons-index .stitle a:hover { color: var(--mlcl-accent-ink); }
.mlcl-seasons-index .smeta { font-size: 11.5px; color: var(--mlcl-ink-mute); margin-top: 4px; letter-spacing: .02em; }
.mlcl-seasons-index .stag { font: 700 10.5px/1 "Oswald", system-ui, sans-serif; letter-spacing: .1em; text-transform: uppercase; color: var(--mlcl-navy); background: var(--mlcl-orange); padding: 4px 7px; border-radius: 3px; flex: none; align-self: flex-start; }

/* champion blocks */
.mlcl-seasons-index .schamps { display: flex; flex-direction: column; flex: 1; }
.mlcl-seasons-index .schamp { display: flex; align-items: flex-start; gap: 11px; padding: 13px 18px; border-top: 1px solid var(--mlcl-line); }
.mlcl-seasons-index .schamp:first-child { border-top: 0; }
.mlcl-seasons-index .cinfo { flex: 1; min-width: 0; }
/* .ct label: use deep-rust on light surface (4.5:1+ on white/cream) */
.mlcl-seasons-index .ct { font: 700 10px/1 "Oswald", system-ui, sans-serif; letter-spacing: .08em; color: var(--mlcl-accent-ink); margin-bottom: 3px; }
.mlcl-seasons-index .cn { font-weight: 700; color: var(--mlcl-ink); font-size: 15px; }
.mlcl-seasons-index .cp { font-size: 12px; color: var(--mlcl-ink-soft); margin-top: 2px; }
.mlcl-seasons-index .cp .crec { font-family: "Oswald", system-ui, sans-serif; font-weight: 700; color: var(--mlcl-ink); letter-spacing: .02em; }
.mlcl-seasons-index .schamp.aonly .cn { color: var(--mlcl-ink-soft); font-style: italic; font-weight: 500; font-size: 13.5px; }

/* card footer */
.mlcl-seasons-index .sfoot { padding: 11px 18px; border-top: 1px solid var(--mlcl-line); background: #faf8f3; }
.mlcl-seasons-index .sfoot a { font: 700 10px/1 "Oswald", system-ui, sans-serif; letter-spacing: .06em; color: var(--mlcl-accent-ink); text-decoration: none; }
.mlcl-seasons-index .sfoot a:hover { color: var(--mlcl-ink); }

/* ================================================================
   records block (record-book-records mockup)
   Reuses the shared .mlcl-hub furniture (.crumbs, .hero, .sec, .shd,
   .tab, .xl, .btn, .disp, the navy thead table). Only the records-
   specific pieces (the marquee, the leaderboard grid, the biggest-
   wins cards, the head-to-head CTA) live here. Fixed-dark fills use
   the theme-invariant var(--mlcl-navy) because the hub body runs
   data-theme="light" (token fills flip to cream).
   ================================================================ */

/* breadcrumb + hero: match the seasons-index / record-book bands */
.mlcl-records .crumbs { padding: 12px 40px; background: var(--mlcl-navy); border-bottom: 1px solid var(--mlcl-navy-2); font: 700 11px/1 "Oswald", system-ui, sans-serif; letter-spacing: .08em; text-transform: uppercase; color: var(--mlcl-navy-ink-dim); }
.mlcl-records .crumbs a { color: var(--mlcl-orange); text-decoration: none; }
.mlcl-records .crumbs a:hover { color: #f4f1ea; }
.mlcl-records .hero { position: relative; background: var(--mlcl-navy); color: #fff; padding: 32px 40px 28px; overflow: hidden; }
.mlcl-records .hero::after { content: ""; position: absolute; inset: 0 0 0 auto; width: 44%; background: linear-gradient(115deg, transparent, rgba(255, 255, 255, .05)); clip-path: polygon(24% 0, 100% 0, 100% 100%, 0 100%); pointer-events: none; }
.mlcl-records .hero .ey { font: 700 12px/1 "Oswald", system-ui, sans-serif; letter-spacing: .2em; color: var(--mlcl-orange); }
.mlcl-records .hero h1 { font-weight: 700; font-size: clamp(38px, 7vw, 58px); line-height: .95; margin: 6px 0 0; padding-left: 16px; border-left: 6px solid var(--mlcl-orange); color: #fff; }
.mlcl-records .hero p { color: var(--mlcl-navy-ink-dim); font-size: 14.5px; margin: 12px 0 0; max-width: 540px; position: relative; z-index: 2; }

/* marquee: 4 headline cards lapping up over the hero band */
.mlcl-records .marq { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; padding: 0 40px; margin-top: -30px; position: relative; z-index: 3; }
.mlcl-records .mq { background: var(--mlcl-surface); border: 1px solid var(--mlcl-line); border-top: 3px solid var(--mlcl-orange); border-radius: 8px; padding: 16px 16px 15px; box-shadow: 0 10px 26px rgba(12, 37, 48, .12); }
.mlcl-records .mqlab { font: 700 10.5px/1.3 "Oswald", system-ui, sans-serif; letter-spacing: .1em; color: var(--mlcl-accent-ink); }
.mlcl-records .mqval { font: 700 40px/1 "Oswald", system-ui, sans-serif; color: var(--mlcl-ink); margin: 8px 0 6px; }
.mlcl-records .mqwho { font-weight: 700; color: var(--mlcl-ink); font-size: 13.5px; line-height: 1.3; }
.mlcl-records .mqsub { font-size: 11.5px; color: var(--mlcl-ink-soft); margin-top: 4px; }

/* leaderboard grid: two cards across, each a ranked table */
.mlcl-records .lbgrid { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; }
.mlcl-records .lbcap { font: 700 13px/1.2 "Oswald", system-ui, sans-serif; letter-spacing: .06em; color: var(--mlcl-ink); margin-bottom: 8px; display: flex; align-items: baseline; gap: 8px; flex-wrap: wrap; }
.mlcl-records .lbcap span { font-weight: 500; font-size: 11px; letter-spacing: .02em; color: var(--mlcl-ink-soft); text-transform: none; }
.mlcl-records table { width: 100%; border-collapse: collapse; background: var(--mlcl-surface); border: 1px solid var(--mlcl-line); border-radius: 8px; overflow: hidden; margin: 0; }
/* Standings-style light table head (cream grammar): sand fill, muted ink. */
.mlcl-records thead th { background: var(--mlcl-bg-2); color: var(--mlcl-ink-mute); border-bottom: 2px solid var(--mlcl-line-strong); font: 700 10px/1 "Oswald", system-ui, sans-serif; letter-spacing: .07em; padding: 9px 12px; text-align: left; }
.mlcl-records thead th.n { text-align: right; }
.mlcl-records tbody td, .mlcl-records tbody th { padding: 9px 12px; border-top: 1px solid var(--mlcl-line); font-size: 13.5px; text-align: left; font-weight: 400; vertical-align: middle; }
.mlcl-records tbody td.n { text-align: right; font-family: "Oswald", system-ui, sans-serif; font-weight: 600; color: var(--mlcl-ink); }
.mlcl-records tbody tr:nth-child(even) { background: #faf8f3; }
.mlcl-records td.rk { color: var(--mlcl-ink-soft); font-family: "Oswald", system-ui, sans-serif; font-weight: 600; width: 28px; }
.mlcl-records th.tn { font-weight: 700; color: var(--mlcl-ink); }
.mlcl-records tr.lead td, .mlcl-records tr.lead th { background: rgba(255, 139, 72, .14); }

/* biggest wins: three across, score + matchup */
.mlcl-records .bigwins { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; }
.mlcl-records .bw { display: flex; align-items: center; gap: 14px; background: var(--mlcl-surface); border: 1px solid var(--mlcl-line); border-top: 3px solid var(--mlcl-orange); border-radius: 7px; padding: 13px 15px; }
.mlcl-records .bwsc { font: 700 22px/1 "Oswald", system-ui, sans-serif; color: var(--mlcl-ink); flex: none; min-width: 62px; }
.mlcl-records .bwinfo { font-weight: 700; color: var(--mlcl-ink); font-size: 13.5px; line-height: 1.25; }
.mlcl-records .bwinfo span { font-weight: 400; color: var(--mlcl-ink-soft); }
.mlcl-records .bwm { font-size: 11px; color: var(--mlcl-ink-soft); font-weight: 400; margin-top: 3px; }

/* head-to-head CTA: dark navy panel */
.mlcl-records .h2hcta { display: flex; align-items: center; gap: 18px; background: var(--mlcl-navy); color: #fff; border-radius: 10px; padding: 20px 24px; text-decoration: none; transition: box-shadow .12s, transform .12s; }
.mlcl-records .h2hcta:hover { box-shadow: 0 12px 30px rgba(12, 37, 48, .3); transform: translateY(-2px); }
.mlcl-records .h2hcta .big { font: 700 30px/1 "Oswald", system-ui, sans-serif; color: var(--mlcl-orange); flex: none; }
.mlcl-records .h2hcta .ht { flex: 1; }
.mlcl-records .h2hcta .ht b { font: 700 17px/1.1 "Oswald", system-ui, sans-serif; text-transform: uppercase; display: block; color: #f4f1ea; }
.mlcl-records .h2hcta .ht span { font-size: 13px; color: var(--mlcl-navy-ink-dim); }
.mlcl-records .h2hcta .go { font: 700 12px/1 "Oswald", system-ui, sans-serif; letter-spacing: .05em; color: var(--mlcl-orange); flex: none; }

/* tiny note under the leaderboard grid */
.mlcl-records .note-tiny { font-size: 11.5px; color: var(--mlcl-ink-soft); font-style: italic; margin-top: 12px; }

/* ================================================================
   head-to-head block (record-book-h2h mockup)
   Reuses the shared .mlcl-hub furniture (.crumbs, .hero, .sec, .shd,
   .tab, .xl, .btn, .disp) plus the navy-thead table styling for the
   meetings table. Only the picker, the scoreboard summary, the series
   dots and the rivalry cards live here. Theme tokens drive the light
   hub; theme-invariant navies (--mlcl-navy, on-navy mute --mlcl-navy-ink-dim) fill the fixed-dark
   picker and board. The win/loss dot fills use AA-clearing greens/reds.
   ================================================================ */

/* breadcrumb: same navy band as the records page */
.mlcl-head-to-head .crumbs { padding: 12px 40px; background: var(--mlcl-navy); border-bottom: 1px solid var(--mlcl-navy-2); font: 700 11px/1 "Oswald", system-ui, sans-serif; letter-spacing: .08em; text-transform: uppercase; color: var(--mlcl-navy-ink-dim); }
.mlcl-head-to-head .crumbs a { color: var(--mlcl-orange); text-decoration: none; }
.mlcl-head-to-head .crumbs a:hover { color: #f4f1ea; }

/* hero (matches the records hero, scoped here) */
.mlcl-head-to-head .hero { position: relative; background: var(--mlcl-navy); color: #fff; padding: 32px 40px 28px; overflow: hidden; }
.mlcl-head-to-head .hero::after { content: ""; position: absolute; inset: 0 0 0 auto; width: 42%; background: linear-gradient(115deg, transparent, rgba(255, 255, 255, .05)); clip-path: polygon(26% 0, 100% 0, 100% 100%, 0 100%); pointer-events: none; }
.mlcl-head-to-head .hero .ey { font: 700 12px/1 "Oswald", system-ui, sans-serif; letter-spacing: .2em; color: var(--mlcl-orange); }
.mlcl-head-to-head .hero h1 { font-weight: 700; font-size: clamp(34px, 6vw, 50px); line-height: .95; margin: 6px 0 0; padding-left: 16px; border-left: 6px solid var(--mlcl-orange); color: #fff; }
.mlcl-head-to-head .hero p { color: var(--mlcl-navy-ink-dim); font-size: 14px; margin: 10px 0 0; max-width: 520px; position: relative; z-index: 2; }

/* picker: a translucent panel inside the navy hero */
.mlcl-head-to-head .picker { position: relative; z-index: 2; display: flex; align-items: flex-end; gap: 12px; flex-wrap: wrap; margin-top: 18px; background: rgba(255, 255, 255, .05); border: 1px solid #244a5b; border-radius: 10px; padding: 14px 16px; }
.mlcl-head-to-head .pk { display: flex; flex-direction: column; gap: 5px; flex: 1 1 200px; min-width: 0; }
.mlcl-head-to-head .pk label { font: 700 10.5px/1 "Oswald", system-ui, sans-serif; letter-spacing: .1em; text-transform: uppercase; color: var(--mlcl-navy-ink-dim); }
.mlcl-head-to-head .pk select { height: 40px; background: #0a1f29; border: 1px solid #2a4d5d; border-radius: 6px; color: #fff; font-family: system-ui, sans-serif; font-size: 13.5px; padding: 0 10px; max-width: 100%; }
.mlcl-head-to-head .pk select:focus-visible { outline: 3px solid var(--mlcl-orange); outline-offset: 2px; }
.mlcl-head-to-head .pkvs { font: 700 14px/40px "Oswald", system-ui, sans-serif; color: var(--mlcl-orange); flex: none; padding: 0 2px; }
.mlcl-head-to-head .pkgo { height: 40px; border: 0; border-radius: 6px; background: var(--mlcl-orange); color: var(--mlcl-navy); font: 700 12px/1 "Oswald", system-ui, sans-serif; letter-spacing: .06em; padding: 0 18px; cursor: pointer; flex: none; }
.mlcl-head-to-head .pkgo:hover { background: #ffa468; }
.mlcl-head-to-head .pkgo:focus-visible { outline: 3px solid #fff; outline-offset: 2px; }
.mlcl-head-to-head .pknote { flex: 1 1 100%; font-size: 11.5px; color: var(--mlcl-navy-ink-dim); margin-top: 2px; }

/* section note (matches the other hub blocks) */
.mlcl-head-to-head .shd .note { font-size: 12px; color: var(--mlcl-ink-soft); }

/* scoreboard summary: a fixed-navy band with the two teams and the meeting count */
.mlcl-head-to-head .board { display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 10px; background: var(--mlcl-navy); color: #fff; border-radius: 10px; padding: 22px 24px; margin-bottom: 14px; }
.mlcl-head-to-head .bteam { text-align: center; }
.mlcl-head-to-head .bteam .bn { font: 700 20px/1.05 "Oswald", system-ui, sans-serif; text-transform: uppercase; }
.mlcl-head-to-head .bteam .bn .xl { color: #fff; background-image: linear-gradient(var(--mlcl-orange), var(--mlcl-orange)); }
.mlcl-head-to-head .bteam .bn .xl:hover, .mlcl-head-to-head .bteam .bn .xl:focus-visible { color: var(--mlcl-orange); }
.mlcl-head-to-head .bteam .bw { font: 700 52px/1 "Oswald", system-ui, sans-serif; color: var(--mlcl-orange); margin-top: 6px; }
.mlcl-head-to-head .bteam .bl { font: 700 10.5px/1 "Oswald", system-ui, sans-serif; letter-spacing: .1em; color: var(--mlcl-navy-ink-dim); margin-top: 4px; }
.mlcl-head-to-head .bvs { text-align: center; color: var(--mlcl-navy-ink-dim); font: 700 12px/1.4 "Oswald", system-ui, sans-serif; letter-spacing: .08em; }
.mlcl-head-to-head .bvs .bvn { display: block; font-size: 26px; color: #fff; margin-bottom: 3px; }

/* series dots: the team-one form line over the whole series */
.mlcl-head-to-head .series { display: flex; flex-wrap: wrap; gap: 5px; align-items: center; background: var(--mlcl-surface); border: 1px solid var(--mlcl-line); border-radius: 8px; padding: 13px 15px; margin-bottom: 16px; }
.mlcl-head-to-head .series .slab { font: 700 10.5px/1 "Oswald", system-ui, sans-serif; letter-spacing: .1em; color: var(--mlcl-ink-soft); margin-right: 6px; }
.mlcl-head-to-head .sdot { width: 22px; height: 22px; border-radius: 5px; display: inline-grid; place-items: center; font: 700 10px/1 "Oswald", system-ui, sans-serif; color: #fff; }
.mlcl-head-to-head .sdot.w { background: #1e6c38; }
.mlcl-head-to-head .sdot.l { background: #b53428; }

/* meetings table: reuse the navy-thead .mlcl-hub table; H2H-specific cells */
.mlcl-head-to-head table { width: 100%; border-collapse: collapse; background: var(--mlcl-surface); border: 1px solid var(--mlcl-line); border-radius: 8px; overflow: hidden; margin: 0; }
.mlcl-head-to-head thead th { background: var(--mlcl-navy); color: #fff; font: 700 10px/1 "Oswald", system-ui, sans-serif; letter-spacing: .07em; padding: 10px 12px; text-align: left; }
.mlcl-head-to-head thead th.n { text-align: right; }
.mlcl-head-to-head tbody td { padding: 10px 12px; border-top: 1px solid var(--mlcl-line); font-size: 13.5px; vertical-align: middle; }
.mlcl-head-to-head tbody td.n { text-align: right; font-family: "Oswald", system-ui, sans-serif; font-weight: 600; color: var(--mlcl-ink); white-space: nowrap; }
.mlcl-head-to-head tbody tr:nth-child(even) { background: #faf8f3; }
.mlcl-head-to-head td.res { font-weight: 700; color: var(--mlcl-ink); }
.mlcl-head-to-head td.lose { color: var(--mlcl-ink-soft); }
.mlcl-head-to-head .wtag { display: inline-grid; place-items: center; width: 19px; height: 19px; border-radius: 4px; background: #1e6c38; color: #fff; font: 700 10.5px/1 "Oswald", system-ui, sans-serif; vertical-align: 1px; margin-right: 4px; }
.mlcl-head-to-head .sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }

/* most-played rivalries grid */
.mlcl-head-to-head .rivs { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; }
.mlcl-head-to-head .rivcard { text-align: left; background: var(--mlcl-surface); border: 1px solid var(--mlcl-line); border-radius: 8px; padding: 14px 15px; cursor: pointer; font-family: inherit; display: flex; flex-direction: column; gap: 8px; transition: border-color .12s, box-shadow .12s, transform .12s; }
.mlcl-head-to-head .rivcard:hover { border-color: var(--mlcl-orange); box-shadow: 0 8px 20px rgba(12, 37, 48, .12); transform: translateY(-2px); }
.mlcl-head-to-head .rivcard:focus-visible { outline: 3px solid var(--mlcl-orange); outline-offset: 2px; }
.mlcl-head-to-head .rvcount { font: 700 22px/1 "Oswald", system-ui, sans-serif; color: var(--mlcl-ink); }
.mlcl-head-to-head .rvcount span { font-size: 10.5px; letter-spacing: .1em; color: var(--mlcl-accent-ink); margin-left: 6px; }
.mlcl-head-to-head .rvteams { font-weight: 700; color: var(--mlcl-ink); font-size: 13.5px; line-height: 1.3; display: flex; flex-wrap: wrap; align-items: baseline; gap: 0 2px; }
.mlcl-head-to-head .rvteams em { font-style: normal; color: var(--mlcl-ink-soft); font-weight: 400; padding: 0 5px; font-size: 11px; }
.mlcl-head-to-head .rvteams .rvt { color: var(--mlcl-ink); }
.mlcl-head-to-head .rvrec { font: 700 13px/1 "Oswald", system-ui, sans-serif; color: var(--mlcl-accent-ink); letter-spacing: .06em; }

/* ================================================================
   season-overview block (record-book-season-v8 mockup)
   Reuses the shared .mlcl-hub furniture (.crumbs, .hero, .sec, .shd,
   .tab, .xl, .btn, .disp) and the navy thead table styling. Only the
   season-specific pieces (champion cards, brackets, standings grid,
   week list) live here.
   ================================================================ */

/* breadcrumb: same navy band as the seasons index */
.mlcl-season-overview .crumbs { padding: 12px 40px; background: var(--mlcl-navy); border-bottom: 1px solid var(--mlcl-navy-2); font: 700 11px/1 "Oswald", system-ui, sans-serif; letter-spacing: .08em; text-transform: uppercase; color: var(--mlcl-navy-ink-dim); }
.mlcl-season-overview .crumbs a { color: var(--mlcl-orange); text-decoration: none; }
.mlcl-season-overview .crumbs a:hover { color: #f4f1ea; }

/* hero: dark band, champion cards inside */
.mlcl-season-overview .hero { position: relative; background: var(--mlcl-navy); color: #fff; padding: 30px 40px 28px; overflow: hidden; }
.mlcl-season-overview .hero::after { content: ""; position: absolute; inset: 0 0 0 auto; width: 42%; background: linear-gradient(115deg, transparent, rgba(255, 255, 255, .05)); clip-path: polygon(26% 0, 100% 0, 100% 100%, 0 100%); pointer-events: none; }
.mlcl-season-overview .hero .ey { font: 700 12px/1 "Oswald", system-ui, sans-serif; letter-spacing: .2em; color: var(--mlcl-orange); position: relative; z-index: 2; }
.mlcl-season-overview .hero h1 { font-weight: 700; font-size: clamp(36px, 6vw, 54px); line-height: .95; margin: 6px 0 0; padding-left: 16px; border-left: 6px solid var(--mlcl-orange); color: #fff; position: relative; z-index: 2; }
.mlcl-season-overview .hero .sub { color: var(--mlcl-navy-ink-dim); font-size: 14px; margin-top: 10px; position: relative; z-index: 2; }

/* champion cards */
.mlcl-season-overview .champs { position: relative; z-index: 2; display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin-top: 18px; max-width: 680px; }
.mlcl-season-overview .cb { background: rgba(255, 255, 255, .05); border: 1px solid #244a5b; border-radius: 6px; padding: 14px 16px; }
.mlcl-season-overview .cb.a { border-color: var(--mlcl-orange); background: rgba(255, 139, 72, .10); }
.mlcl-season-overview .cb .t { font: 700 10px/1 "Oswald", system-ui, sans-serif; letter-spacing: .12em; color: var(--mlcl-orange); }
.mlcl-season-overview .cb .nm { font: 700 19px/1.05 "Oswald", system-ui, sans-serif; text-transform: uppercase; color: #fff; margin-top: 7px; }
.mlcl-season-overview .cb .nm .xl { color: #fff; }
.mlcl-season-overview .cb .rec { font-size: 12px; color: var(--mlcl-navy-ink-dim); margin-top: 3px; }

.mlcl-season-overview .mlcl-so-sections {
	position: sticky;
	top: var(--mlcl-sticky-header-offset, 5.5rem);
	z-index: 50;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
	padding: 10px 40px;
	background: rgba(244, 241, 234, 0.96);
	border-top: 1px solid var(--mlcl-line);
	border-bottom: 1px solid var(--mlcl-line-strong);
	box-shadow: 0 8px 18px rgba(12, 37, 48, 0.08);
	backdrop-filter: blur(10px);
}
.mlcl-season-overview .mlcl-so-sections__label {
	flex: none;
	font: 700 10.5px/1 "Oswald", system-ui, sans-serif;
	letter-spacing: 0;
	color: var(--mlcl-ink-soft);
}
.mlcl-season-overview .mlcl-so-sections__links {
	display: flex;
	align-items: center;
	justify-content: flex-end;
	gap: 7px;
	min-width: 0;
	overflow-x: auto;
	overscroll-behavior-inline: contain;
	scrollbar-width: none;
}
.mlcl-season-overview .mlcl-so-sections__links::-webkit-scrollbar { display: none; }
.mlcl-season-overview .mlcl-so-section-link {
	flex: none;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 36px;
	padding: 0 12px;
	border: 1px solid var(--mlcl-line);
	border-radius: 999px;
	background: var(--mlcl-surface);
	color: var(--mlcl-ink);
	font: 700 10.5px/1 "Oswald", system-ui, sans-serif;
	letter-spacing: 0;
	text-decoration: none;
}
.mlcl-season-overview .mlcl-so-section-link:hover,
.mlcl-season-overview .mlcl-so-section-link:focus-visible {
	border-color: var(--mlcl-orange);
	background: #fff;
	color: var(--mlcl-accent-ink);
}
.mlcl-season-overview #mlcl-so-now,
.mlcl-season-overview #mlcl-so-tl,
.mlcl-season-overview #mlcl-so-bk,
.mlcl-season-overview #mlcl-so-st,
.mlcl-season-overview #mlcl-so-wk {
	scroll-margin-top: calc(var(--mlcl-sticky-header-offset, 5.5rem) + 4.75rem);
}

/* season-in-progress notice */
.mlcl-season-overview .mlcl-so-pending { background: var(--mlcl-surface); border: 1px solid var(--mlcl-line); border-top: 3px solid var(--mlcl-orange); border-radius: 6px; padding: 14px 16px; font-size: 14px; color: var(--mlcl-ink); margin: 0; }

/* The season timeline section renders the B1 season story component in
   compact mode (see SEASON STORY TIMELINE); the old .mlcl-so-event grid
   retired with it. */

/* brackets */
.mlcl-season-overview .brkts { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; }
.mlcl-season-overview .brkt { border: 1px solid var(--mlcl-line); border-radius: 8px; padding: 16px; background: #fbf9f3; }
.mlcl-season-overview .brkt .bt { font: 700 12px/1 "Oswald", system-ui, sans-serif; letter-spacing: .08em; color: var(--mlcl-accent-ink); margin-bottom: 12px; }
.mlcl-season-overview .rounds { display: flex; gap: 12px; align-items: stretch; }
.mlcl-season-overview .round { flex: 1; display: flex; flex-direction: column; justify-content: center; gap: 10px; min-width: 0; }
.mlcl-season-overview .round.win-col { flex: .85; }
.mlcl-season-overview .rl { font: 700 10.5px/1 "Oswald", system-ui, sans-serif; letter-spacing: .1em; color: var(--mlcl-ink-soft); margin-bottom: 2px; }
.mlcl-season-overview .match { background: var(--mlcl-navy); border-radius: 6px; overflow: hidden; }
.mlcl-season-overview .match .t { display: flex; justify-content: space-between; gap: 8px; padding: 8px 10px; font-size: 12px; color: var(--mlcl-navy-ink-dim); }
.mlcl-season-overview .match .t + .t { border-top: 1px solid var(--mlcl-navy-2); }
.mlcl-season-overview .match .t .xl { color: inherit; }
.mlcl-season-overview .match .t b { font-family: "Oswald", system-ui, sans-serif; font-weight: 600; color: #fff; }
.mlcl-season-overview .match .t.win { color: #fff; font-weight: 700; box-shadow: inset 3px 0 0 var(--mlcl-orange); }
.mlcl-season-overview .match .t.win .xl { color: #fff; }
.mlcl-season-overview .match .t.win b { color: var(--mlcl-orange); }
.mlcl-season-overview .champcard { background: var(--mlcl-navy); border: 1px solid var(--mlcl-orange); border-radius: 6px; padding: 12px; text-align: center; }
.mlcl-season-overview .champcard .cl { font: 700 10.5px/1 "Oswald", system-ui, sans-serif; letter-spacing: .1em; color: var(--mlcl-orange); }
.mlcl-season-overview .champcard .cn { font: 700 14px/1.1 "Oswald", system-ui, sans-serif; text-transform: uppercase; color: #fff; margin-top: 6px; }
.mlcl-season-overview .champcard .cn .xl { color: #fff; }

/* standings grid */
.mlcl-season-overview .grid2 { display: grid; grid-template-columns: 1fr 1fr; gap: 22px; }
.mlcl-season-overview .tcap { font: 700 12px/1 "Oswald", system-ui, sans-serif; letter-spacing: .08em; color: var(--mlcl-accent-ink); margin-bottom: 8px; }
.mlcl-season-overview table { width: 100%; border-collapse: collapse; background: var(--mlcl-surface); border: 1px solid var(--mlcl-line); border-radius: 8px; overflow: hidden; margin: 0; }
/* Standings-style light table head (cream grammar): sand fill, muted ink. */
.mlcl-season-overview thead th { background: var(--mlcl-bg-2); color: var(--mlcl-ink-mute); border-bottom: 2px solid var(--mlcl-line-strong); font: 700 10px/1 "Oswald", system-ui, sans-serif; letter-spacing: .08em; padding: 10px 12px; text-align: left; }
.mlcl-season-overview thead th.n { text-align: right; }
.mlcl-season-overview tbody td, .mlcl-season-overview tbody th { padding: 10px 12px; border-top: 1px solid var(--mlcl-line); font-size: 13.5px; text-align: left; font-weight: 400; }
.mlcl-season-overview tbody td.n { text-align: right; font-family: "Oswald", system-ui, sans-serif; font-weight: 600; color: var(--mlcl-ink); }
.mlcl-season-overview tbody tr:nth-child(even) { background: #faf8f3; }
.mlcl-season-overview td.rk { color: var(--mlcl-ink-soft); font-family: "Oswald", system-ui, sans-serif; font-weight: 600; width: 30px; }
.mlcl-season-overview th.tn-cell { font-weight: 700; color: var(--mlcl-ink); }
.mlcl-season-overview tr.champ td, .mlcl-season-overview tr.champ th { background: rgba(255, 139, 72, .16); }
.mlcl-season-overview .badge { display: inline-block; font: 700 10.5px/1 "Oswald", system-ui, sans-serif; letter-spacing: .04em; padding: 3px 5px; border-radius: 2px; margin-left: 7px; vertical-align: 1px; }
.mlcl-season-overview .badge.a { background: var(--mlcl-orange); color: var(--mlcl-navy); }
.mlcl-season-overview .badge.b { background: var(--mlcl-navy); color: #fff; }

/* week list */
.mlcl-season-overview .weeks { display: grid; grid-template-columns: repeat(2, 1fr); gap: 10px; }
.mlcl-season-overview .wk { display: flex; align-items: center; gap: 14px; background: var(--mlcl-surface); border: 1px solid var(--mlcl-line); border-top: 3px solid var(--mlcl-orange); border-radius: 6px; padding: 12px 14px; }
.mlcl-season-overview .wk:hover { background: #fff; box-shadow: 0 4px 14px rgba(12, 37, 48, .10); }
.mlcl-season-overview .wk .wk-page { display: flex; align-items: center; gap: 14px; flex: 1; min-width: 0; text-decoration: none; }
.mlcl-season-overview .wk .wn { font: 700 16px/1 "Oswald", system-ui, sans-serif; color: var(--mlcl-ink); min-width: 64px; }
.mlcl-season-overview .wk .wm { font-size: 12px; color: var(--mlcl-ink-soft); flex: 1; }
.mlcl-season-overview .wk .wr { font: 700 10px/1 "Oswald", system-ui, sans-serif; letter-spacing: .05em; color: var(--mlcl-accent-ink); flex: none; }
.mlcl-season-overview .wk .wr.is-muted { color: #87979e; }

/* empty state */
.mlcl-season-overview .mlcl-so-empty { padding: 40px; }

/* ================================================================
   week-view block (record-book-week-v7 mockup)
   Reuses the shared .mlcl-hub furniture (.crumbs, .hero, .ey, .sub,
   .sec, .shd, .tab, .xl, .btn, .disp). Only the week-specific pieces
   (the inline week selector, the per-court accordions, and the
   two-up game grid) live here. The court header strip and the
   winner-emphasis bar use the theme-invariant var(--mlcl-navy) + white because
   the hub body runs data-theme="light" (token fills flip to cream).
   ================================================================ */

/* breadcrumb: same navy band as the seasons index + season overview */
.mlcl-week-view .crumbs { padding: 12px 40px; background: var(--mlcl-navy); border-bottom: 1px solid var(--mlcl-navy-2); font: 700 11px/1 "Oswald", system-ui, sans-serif; letter-spacing: .08em; text-transform: uppercase; color: var(--mlcl-navy-ink-dim); }
.mlcl-week-view .crumbs a { color: var(--mlcl-orange); text-decoration: none; }
.mlcl-week-view .crumbs a:hover { color: #f4f1ea; }

/* hero: dark band, eyebrow + h1 + sub line */
.mlcl-week-view .hero { position: relative; background: var(--mlcl-navy); color: #fff; padding: 26px 40px 22px; overflow: hidden; }
.mlcl-week-view .hero::after { content: ""; position: absolute; inset: 0 0 0 auto; width: 40%; background: linear-gradient(115deg, transparent, rgba(255, 255, 255, .05)); clip-path: polygon(28% 0, 100% 0, 100% 100%, 0 100%); pointer-events: none; }
.mlcl-week-view .hero .ey { font: 700 12px/1 "Oswald", system-ui, sans-serif; letter-spacing: .2em; color: var(--mlcl-orange); position: relative; z-index: 2; }
.mlcl-week-view .hero h1 { font-weight: 700; font-size: clamp(32px, 6vw, 48px); line-height: .95; margin: 6px 0 0; padding-left: 16px; border-left: 6px solid var(--mlcl-orange); color: #fff; position: relative; z-index: 2; }
.mlcl-week-view .hero .sub { color: var(--mlcl-navy-ink-dim); font-size: 14px; margin-top: 8px; position: relative; z-index: 2; }

/* inline week selector */
.mlcl-week-view .wkbar { display: flex; gap: 7px; overflow-x: auto; padding: 12px 40px; background: #081a24; border-bottom: 1px solid #16323f; -webkit-overflow-scrolling: touch; }
/* 44px-tall touch target (min-height/padding only; the 11px label stays). */
.mlcl-week-view .wsel { flex: none; font: 700 11px/1 "Oswald", system-ui, sans-serif; letter-spacing: .04em; color: var(--mlcl-navy-ink-dim); background: rgba(255, 255, 255, .05); border: 1px solid #244a5b; border-radius: 22px; padding: 9px 16px; text-decoration: none; min-height: 44px; display: inline-flex; align-items: center; }
.mlcl-week-view .wsel:hover { border-color: var(--mlcl-orange); color: #fff; }
.mlcl-week-view .wsel.on { background: var(--mlcl-orange); color: var(--mlcl-navy); border-color: var(--mlcl-orange); }

.mlcl-week-view .mlcl-wv-recaps { display: flex; flex-wrap: wrap; gap: 8px; justify-content: flex-end; }
.mlcl-week-view .mlcl-wv-recaps .btn { max-width: 240px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

/* per-court accordion */
.mlcl-week-view .court { border: 1px solid var(--mlcl-line); border-radius: 8px; margin-bottom: 12px; overflow: hidden; background: var(--mlcl-surface); }
.mlcl-week-view .court > summary { list-style: none; cursor: pointer; display: flex; align-items: center; gap: 11px; padding: 12px 16px; font: 700 14px/1 "Oswald", system-ui, sans-serif; text-transform: uppercase; color: var(--mlcl-ink); background: #f1ece1; }
.mlcl-week-view .court > summary::-webkit-details-marker { display: none; }
.mlcl-week-view .court > summary::marker { content: ""; }
.mlcl-week-view .court > summary:focus-visible { outline: 3px solid var(--mlcl-orange); outline-offset: -3px; }
.mlcl-week-view .chev { color: var(--mlcl-orange); font-size: 11px; transition: transform .15s; }
.mlcl-week-view .court[open] > summary .chev { transform: rotate(90deg); }
.mlcl-week-view .court .cc { margin-left: auto; font-size: 12px; color: var(--mlcl-ink-soft); font-family: system-ui, sans-serif; font-weight: 500; }

/* two-up game grid */
.mlcl-week-view .games { display: grid; grid-template-columns: repeat(2, 1fr); gap: 10px; padding: 14px 16px; }
.mlcl-week-view .game { border: 1px solid var(--mlcl-line); border-radius: 8px; overflow: hidden; }
.mlcl-week-view .side { display: flex; align-items: center; gap: 10px; padding: 10px 13px; }
.mlcl-week-view .side + .side { border-top: 1px solid #eee5d4; }
.mlcl-week-view .side .tn { flex: 1; min-width: 0; font-size: 13.5px; font-weight: 600; color: var(--mlcl-ink); }
.mlcl-week-view .side .tn .xl { font-weight: inherit; }
.mlcl-week-view .side .sc { font: 700 19px/1 "Oswald", system-ui, sans-serif; color: var(--mlcl-ink-soft); min-width: 30px; text-align: right; }
.mlcl-week-view .side.w { background: rgba(47, 111, 79, .07); }
.mlcl-week-view .side.w .tn { font-weight: 700; color: var(--mlcl-ink); }
.mlcl-week-view .side.w .sc { color: var(--mlcl-ink); }
.mlcl-week-view .wtag { font: 700 10.5px/1 "Oswald", system-ui, sans-serif; color: #fff; background: #2f6f4f; padding: 3px 5px; border-radius: 2px; }
.mlcl-week-view .dot { font: 700 10.5px/1 "Oswald", system-ui, sans-serif; color: var(--mlcl-ink-soft); padding: 3px 5px; }

/* not-played-yet + empty states */
.mlcl-week-view .mlcl-wv-pending { background: var(--mlcl-surface); border: 1px solid var(--mlcl-line); border-top: 3px solid var(--mlcl-orange); border-radius: 6px; padding: 18px 18px 20px; }
.mlcl-week-view .mlcl-wv-pending p { font-size: 14px; color: var(--mlcl-ink); margin: 0 0 14px; }
.mlcl-week-view .mlcl-wv-empty { padding: 40px; }

/* ---------- responsive: single 760px reflow ---------- */
@media (max-width: 760px) {
	.mlcl-hub .sec { padding: 22px 18px; }
	.mlcl-record-book .hero { padding: 26px 20px 24px; }
	.mlcl-hub .latest { grid-template-columns: 1fr; }
	.mlcl-hub .rec { grid-template-columns: repeat(2, 1fr); }
	.mlcl-hub .expl { grid-template-columns: 1fr; }
	.mlcl-record-book .mlcl-rb-signup { align-items: flex-start; flex-direction: column; }
	.mlcl-hub .mlcl-hub-signup-cta { align-items: flex-start; flex-direction: column; }
	.mlcl-hub .mlcl-hub-signup-cta h2 { font-size: 24px; }
	.mlcl-hub .mlcl-hub-signup-cta .btn { justify-content: center; width: 100%; }
	/* champions table becomes stacked season cards */
	.mlcl-hub table, .mlcl-hub tbody, .mlcl-hub tr, .mlcl-hub td { display: block; width: 100%; }
	.mlcl-hub thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
	.mlcl-hub .tablecard { border: 0; border-radius: 0; overflow: visible; }
	.mlcl-hub table { background: transparent; }
	.mlcl-hub tbody tr, .mlcl-hub tbody tr:nth-child(even) { background: var(--mlcl-surface); border: 1px solid var(--mlcl-line); border-radius: 8px; margin-bottom: 12px; overflow: hidden; }
	.mlcl-hub tbody td { border-top: 0; padding: 12px 16px; }
	/* Light card header (site grammar): the season strip reads as a sand header
	   row on the white card, like the team-directory rows, not a navy band. */
	.mlcl-hub td.seasoncell { background: var(--mlcl-bg-2); color: var(--mlcl-ink); display: flex; align-items: baseline; gap: 10px; white-space: normal; border-bottom: 1px solid var(--mlcl-line); }
	.mlcl-hub td.seasoncell .so { color: var(--mlcl-ink); }
	.mlcl-hub td.seasoncell .xl { color: var(--mlcl-ink); }
	.mlcl-hub td.seasoncell small { color: var(--mlcl-ink-mute); margin: 0; }
	.mlcl-hub td.cc { border-top: 1px solid var(--mlcl-line); }
	/* Deep-rust accent-ink (resolves to #B5400C on the light hub body, 5.67:1 on
	   white) instead of the mockup's #d75f23 literal, which fails AA on white. */
	.mlcl-hub td.cc::before { content: attr(data-label); display: block; font: 700 10.5px/1 "Oswald", system-ui, sans-serif; letter-spacing: .1em; color: var(--mlcl-accent-ink); margin-bottom: 5px; }
	/* seasons-index: single column on mobile, breadcrumb/hero pad collapse */
	.mlcl-seasons-index .crumbs { padding-left: 18px; padding-right: 18px; }
	.mlcl-seasons-index .hero { padding: 26px 18px 22px; }
	.mlcl-seasons-index .seasons { grid-template-columns: 1fr; }

	/* season-overview: stack everything; brackets must not overflow */
	.mlcl-season-overview .crumbs { padding-left: 18px; padding-right: 18px; }
	.mlcl-season-overview .hero { padding: 24px 18px 22px; }
	.mlcl-season-overview .mlcl-so-sections { align-items: flex-start; flex-direction: column; gap: 8px; padding: 10px 18px; }
	.mlcl-season-overview .mlcl-so-sections__links { justify-content: flex-start; width: 100%; padding-bottom: 1px; }
	.mlcl-season-overview .mlcl-so-section-link { min-height: 40px; padding: 0 13px; }
	.mlcl-season-overview .champs { grid-template-columns: 1fr; }
	.mlcl-season-overview .brkts { grid-template-columns: 1fr; }
	.mlcl-season-overview .rounds { flex-direction: column; }
	.mlcl-season-overview .round.win-col { flex: 1; }
	.mlcl-season-overview .grid2 { grid-template-columns: 1fr; gap: 18px; }
	.mlcl-season-overview .weeks { grid-template-columns: 1fr; }
	/* standings: reflow each row to a card with data-label numbers (mockup
	   pattern), overriding the shared champions-table block reflow above. */
	.mlcl-season-overview table { display: table; border: 1px solid var(--mlcl-line); background: var(--mlcl-surface); border-radius: 8px; }
	.mlcl-season-overview tbody { display: table-row-group; }
	.mlcl-season-overview thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
	.mlcl-season-overview tbody tr, .mlcl-season-overview tbody tr:nth-child(even) { display: flex; align-items: baseline; flex-wrap: wrap; gap: 2px 8px; padding: 9px 12px; border: 0; border-top: 1px solid var(--mlcl-line); border-radius: 0; margin: 0; background: var(--mlcl-surface); }
	.mlcl-season-overview tbody tr:first-child { border-top: 0; }
	.mlcl-season-overview tbody tr:nth-child(even) { background: #faf8f3; }
	.mlcl-season-overview tbody tr.champ { background: rgba(255, 139, 72, .16); }
	.mlcl-season-overview tbody td, .mlcl-season-overview tbody th { display: inline; width: auto; border-top: 0; padding: 0; font-size: 13.5px; }
	.mlcl-season-overview td.rk { min-width: 24px; }
	.mlcl-season-overview th.tn-cell { flex: 1 1 58%; }
	.mlcl-season-overview td.n { font-size: 12px; color: var(--mlcl-ink-soft); }
	.mlcl-season-overview td.n::before { content: attr(data-label) " "; font-weight: 400; color: var(--mlcl-ink-soft); }

	/* records: collapse bands, reflow marquee + leaderboards + biggest wins */
	.mlcl-records .crumbs { padding-left: 18px; padding-right: 18px; }
	.mlcl-records .hero { padding: 26px 18px 40px; }
	.mlcl-records .marq { grid-template-columns: 1fr 1fr; padding: 0 18px; margin-top: -28px; }
	.mlcl-records .mqval { font-size: 34px; }
	.mlcl-records .lbgrid { grid-template-columns: 1fr; gap: 16px; }
	.mlcl-records .bigwins { grid-template-columns: 1fr; }
	/* records tables reflow each row to a flex-wrap card with data-label
	   numbers (mockup pattern), overriding the shared champions-table block
	   reflow above so the records leaderboards stay readable on narrow screens. */
	.mlcl-records table { display: table; border: 1px solid var(--mlcl-line); background: var(--mlcl-surface); border-radius: 8px; }
	.mlcl-records tbody { display: table-row-group; }
	.mlcl-records thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
	.mlcl-records tbody tr, .mlcl-records tbody tr:nth-child(even) { display: flex; align-items: baseline; flex-wrap: wrap; gap: 2px 8px; padding: 9px 12px; border: 0; border-top: 1px solid var(--mlcl-line); border-radius: 0; margin: 0; background: var(--mlcl-surface); }
	.mlcl-records tbody tr:first-child { border-top: 0; }
	.mlcl-records tbody tr:nth-child(even) { background: #faf8f3; }
	.mlcl-records tbody tr.lead, .mlcl-records tbody tr.lead:nth-child(even) { background: rgba(255, 139, 72, .14); }
	.mlcl-records tbody td, .mlcl-records tbody th { display: inline; width: auto; border-top: 0; padding: 0; font-size: 13px; }
	.mlcl-records td.rk { min-width: 22px; }
	.mlcl-records th.tn { flex: 1 1 55%; }
	.mlcl-records td.n { font-size: 12px; color: var(--mlcl-ink-soft); }
	.mlcl-records td.n::before { content: attr(data-label) " "; font-weight: 400; color: var(--mlcl-ink-soft); }

	/* head-to-head: collapse bands, hide the vs divider, shrink the board,
	   single-column rivalry cards, and reflow the meetings table to wrapped
	   rows with the loser prefixed "def." (mockup pattern). */
	.mlcl-head-to-head .crumbs { padding-left: 18px; padding-right: 18px; }
	.mlcl-head-to-head .hero { padding: 24px 18px 22px; }
	.mlcl-head-to-head .pkvs { display: none; }
	.mlcl-head-to-head .board { padding: 18px; }
	.mlcl-head-to-head .bteam .bw { font-size: 40px; }
	.mlcl-head-to-head .rivs { grid-template-columns: 1fr; }
	.mlcl-head-to-head table { display: table; border: 1px solid var(--mlcl-line); background: var(--mlcl-surface); border-radius: 8px; }
	.mlcl-head-to-head tbody { display: table-row-group; }
	.mlcl-head-to-head thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
	.mlcl-head-to-head tbody tr, .mlcl-head-to-head tbody tr:nth-child(even) { display: flex; flex-wrap: wrap; align-items: baseline; gap: 3px 10px; padding: 10px 12px; border: 0; border-top: 1px solid var(--mlcl-line); border-radius: 0; margin: 0; background: var(--mlcl-surface); }
	.mlcl-head-to-head tbody tr:first-child { border-top: 0; }
	.mlcl-head-to-head tbody tr:nth-child(even) { background: #faf8f3; }
	.mlcl-head-to-head tbody td { display: inline; width: auto; border-top: 0; padding: 0; font-size: 13px; }
	.mlcl-head-to-head td.res { flex: 1 1 100%; }
	.mlcl-head-to-head td.n { order: 3; }
	.mlcl-head-to-head td.lose::before { content: "def. "; color: var(--mlcl-ink-soft); }

	/* week-view: collapse band padding + stack the game grid to one column */
	.mlcl-week-view .crumbs { padding-left: 18px; padding-right: 18px; }
	.mlcl-week-view .hero { padding: 24px 18px 20px; }
	.mlcl-week-view .wkbar { padding-left: 18px; padding-right: 18px; }
	.mlcl-week-view .games { grid-template-columns: 1fr; }

	/* directory: collapse padding, two-column card grid, wrap azbar */
	.mlcl-directory .hero { padding: 24px 18px 20px; }
	.mlcl-directory .tools { padding-left: 18px; padding-right: 18px; }
	.mlcl-directory .sec { padding-left: 18px; padding-right: 18px; }
	.mlcl-directory .dgrid { grid-template-columns: 1fr 1fr; }
}

/* ================================================================
   player-directory + team-directory blocks (record-book-players /
   record-book-teams mockups)
   Shared vocabulary under .mlcl-directory. Both blocks emit the same
   structure: a dark hero, a sticky filter toolbar (.tools), an A-Z
   jump bar (.azbar), and letter groups (.dgroup > .dgrid > .dcard).
   Fixed-dark fills (the hero band) use the theme-invariant var(--mlcl-navy)
   because the hub body runs data-theme="light" (token fills flip).
   ================================================================ */

/* hero: matches .mlcl-record-book .hero exactly */
.mlcl-directory .hero { position: relative; background: var(--mlcl-navy); color: #fff; padding: 30px 40px 26px; overflow: hidden; }
.mlcl-directory .hero::after { content: ""; position: absolute; inset: 0 0 0 auto; width: 42%; background: linear-gradient(115deg, transparent, rgba(255, 255, 255, .05)); clip-path: polygon(26% 0, 100% 0, 100% 100%, 0 100%); pointer-events: none; }
.mlcl-directory .hero .ey { font: 700 12px/1 "Oswald", system-ui, sans-serif; letter-spacing: .2em; color: var(--mlcl-orange); }
.mlcl-directory .hero h1 { font-weight: 700; font-size: clamp(36px, 6.5vw, 54px); line-height: .95; margin: 6px 0 0; padding-left: 16px; border-left: 6px solid var(--mlcl-orange); color: #fff; }
.mlcl-directory .hero p { color: var(--mlcl-navy-ink-dim); font-size: 14px; margin: 10px 0 0; max-width: 540px; position: relative; z-index: 2; }

/* filter toolbar: sticky under the .rbn nav (top: 52px matches the nav height) */
.mlcl-directory .tools { position: sticky; top: 52px; z-index: 30; background: #f4f1ea; border-bottom: 1px solid #ddd3bf; padding: 14px 40px; }
.mlcl-directory .filterrow { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.mlcl-directory .filterbox { position: relative; flex: 1 1 280px; }
.mlcl-directory .filterbox svg { position: absolute; left: 12px; top: 50%; transform: translateY(-50%); width: 16px; height: 16px; color: var(--mlcl-ink-soft); }
.mlcl-directory .filterbox input { width: 100%; height: 42px; border: 1px solid #ddd3bf; border-radius: 8px; background: #fff; padding: 0 12px 0 36px; font-size: 14px; font-family: system-ui, -apple-system, "Segoe UI", Roboto, sans-serif; }
.mlcl-directory .filterbox input:focus { outline: none; border-color: var(--mlcl-orange); box-shadow: 0 0 0 3px rgba(255, 139, 72, .18); }
/* AA fix: restore a visible keyboard focus ring (matches the nav search input pattern). */
.mlcl-directory .filterbox input:focus-visible { outline: 3px solid var(--mlcl-orange); outline-offset: 2px; }
.mlcl-directory .fcount { font: 700 11px/1 "Oswald", system-ui, sans-serif; letter-spacing: .06em; color: var(--mlcl-accent-ink); white-space: nowrap; }

/* alphabet jump bar */
.mlcl-directory .azbar { display: flex; flex-wrap: wrap; gap: 1px; margin-top: 10px; }
.mlcl-directory .azbar a,
.mlcl-directory .azbar span { display: inline-grid; place-items: center; min-width: 26px; height: 28px; font: 700 11px/1 "Oswald", system-ui, sans-serif; text-decoration: none; border-radius: 5px; color: var(--mlcl-navy); }
.mlcl-directory .azbar a:hover { background: var(--mlcl-orange); color: var(--mlcl-navy); }
.mlcl-directory .azbar .off { color: #c4b9a3; }
.mlcl-directory .azbar a:focus-visible { outline: 3px solid var(--mlcl-orange); outline-offset: 2px; }
/* AA fix: bump A-Z jump-bar tap targets to >=44x44px on mobile.
   Switch to block display with explicit min dimensions so the tap area is guaranteed.
   16px padding top+bottom + ~13px line = 45px; 18px padding left+right + ~8px letter = 44px. */
@media (max-width: 760px) {
  .mlcl-directory .azbar a,
  .mlcl-directory .azbar span { display: inline-flex !important; align-items: center !important; justify-content: center !important; min-width: 44px !important; height: 44px !important; padding: 0 !important; box-sizing: border-box !important; }
}

/* A-Z letter groups */
.mlcl-directory .sec { padding: 18px 40px 36px; }
.mlcl-directory .dgroup { margin-bottom: 6px; }
/* AA fix: #c9591f = 3.77:1 on cream (fails); var(--mlcl-accent-ink) = #B5400C = 5.03:1 (passes). */
.mlcl-directory .dletter { font: 700 15px/1 "Oswald", system-ui, sans-serif; color: var(--mlcl-accent-ink); padding: 14px 0 8px; border-bottom: 2px solid #ddd3bf; margin-bottom: 12px; scroll-margin-top: 150px; }
.mlcl-directory .dgrid { display: grid; grid-template-columns: repeat(auto-fill, minmax(210px, 1fr)); gap: 8px; }

/* individual cards */
.mlcl-directory .dcard { display: flex; align-items: center; gap: 10px; background: #fff; border: 1px solid #ddd3bf; border-radius: 7px; padding: 10px 12px; text-decoration: none; transition: border-color .12s, box-shadow .12s, transform .1s; }
.mlcl-directory .dcard:hover { border-color: var(--mlcl-orange); box-shadow: 0 6px 16px rgba(12, 37, 48, .1); transform: translateY(-1px); }
.mlcl-directory .dcard:focus-visible { outline: 3px solid var(--mlcl-orange); outline-offset: 2px; border-radius: 7px; }
.mlcl-directory .dcard .dn { flex: 1; font-weight: 600; font-size: 14px; color: var(--mlcl-navy); line-height: 1.25; }
.mlcl-directory .dcard .ds { flex: none; min-width: 24px; height: 24px; padding: 0 6px; border-radius: 12px; background: #f1ead9; color: var(--mlcl-accent-ink); font-size: 11px; display: grid; place-items: center; font-weight: 700; }

/* no-results message */
.mlcl-directory .noresults { display: none; padding: 40px 0; text-align: center; color: var(--mlcl-ink-soft); font-size: 14px; }
.mlcl-directory .noresults.on { display: block; }

/* Skip-to-content link: GeneratePress paints it in its default link blue
   (#1e73be = 4.38:1 on the cream page, just under AA). Repaint as the dark ink
   band so the keyboard-focus skip link clears 4.5:1. */
.mlcl-site .skip-link,
.mlcl-site a.skip-link {
  background: var(--mlcl-navy);
  color: #f4f1ea;
}

/* ---- 9.x editorial polish (2026-06-08) ---- */
/* The 6 redundant section kickers (Reference/The rules, Questions/FAQ, etc.) were
   removed at the content level in page 16 + the front-page-content.html artifact
   during reconciliation, so the earlier display:none trim is no longer needed.
   Only "Last season recap" remains. */

/* Readable measure: cap long-form prose near ~62ch instead of letting it run
   130+ch across the wide bands. */
.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-home-section-intro p:not(.eyebrow),
.mlcl-site:not(.mlcl-app-active) .entry-content .next-season-blurb {
  max-width: 62ch;
}

/* ============================================================================
   Record Book hub: cross-page consistency + accessibility pass (2026-06-08).
   One appended block, kept clear of the concurrent mlcl.css redesign. Each rule
   wins by source order / specificity over the per-block values above.
   ========================================================================== */

/* Hero band rhythm. The per-block heroes had drifted to five different paddings
   (34/32/30/26 top, 30/28/26/22 bottom); unify them so every hub surface reads
   the same. Records keeps a taller mobile bottom so its overlapping stat tiles
   (.marq, margin-top:-28) clear the hero copy. */
.mlcl-hub .hero { padding: 30px 40px 28px; }
@media (max-width: 760px) {
  .mlcl-hub .hero { padding: 24px 18px 22px; }
  .mlcl-records .hero { padding: 26px 18px 40px; }
}

/* Breadcrumb links. The crumb bars are already navy on every page, but the
   global .entry-content a rust (#a84e16, 2.85:1 on navy, fails AA) was beating
   each block's own .crumbs a rule on the page-rendered surfaces. Force the
   AA-safe bright orange (0,4,1 / 0,5,1 beats the 0,3,1 / 0,4,1 rust rules on
   pages; the short selector covers the template surfaces). */
.mlcl-site .entry-content .mlcl-hub .crumbs a,
.mlcl-hub .crumbs a { color: var(--mlcl-orange); text-decoration: none; }
.mlcl-site .entry-content .mlcl-hub .crumbs a:hover,
.mlcl-hub .crumbs a:hover { color: #f4f1ea; text-decoration: none; }

/* Hub link rollover: generic hub content links (results, champions) sit in
   rust at rest, then the site-wide a:hover flipped them to navy, a full hue
   jump that read as the link switching off. Keep the hover in-hue (a deeper
   rust, AA on cream). Moved here from rb-nav.css when the sub-nav was
   retired; the higher specificity wins regardless of load order. */
.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-hub a:not(.btn):not(.xl):hover {
  color: #8a3a10;
}

/* Focus rings reach the in-content data links (team/player names, crumbs, table
   links) that are the primary way you navigate the hub; they had been falling
   back to the near-invisible UA outline on the navy bands. */
.mlcl-hub a.xl:focus-visible,
.mlcl-hub .crumbs a:focus-visible,
.mlcl-hub td a:focus-visible { outline: 3px solid var(--mlcl-orange); outline-offset: 2px; }

/* Numeric columns get tabular figures so single- and multi-digit stats share a
   right edge in the leaderboards, standings and game logs (the columns are
   already right-aligned; this fixes the ones-place drift the reviewer flagged).
   Cell padding is intentionally left per-table: the leaderboards run dense in a
   narrow split column, the game logs roomier, and forcing one value wrapped the
   long team names. */
.mlcl-hub td.n, .mlcl-hub th.n,
.mlcl-records td.n, .mlcl-records th.n,
.mlcl-season-overview td.n, .mlcl-season-overview th.n { font-variant-numeric: tabular-nums; }

/* Disabled A-Z jump letters read as an intentional "no names here" state, not a
   half-rendered glitch (was #c4b9a3, 1.72:1 on cream). */
.mlcl-directory .azbar .off { color: #6f6551; }

/* Profile avatar monograms: white reads cleanly on the win/loss-tinted circles
   (green/red, both dark) where the fixed orange dipped under AA-large (2.77:1).
   The orange ring stays; only the initials switch to white. */
.mlcl-player-profile .mlcl-pp-av,
.mlcl-team-page .mlcl-tp-av { color: #fff; }

/* The Record Book landing page is mostly card/table navigation, not prose. Keep
   links visible through color, chips and focus rings, but remove underlines and
   the shared .xl underline-grow treatment on this one landing surface. */
.mlcl-site .entry-content .mlcl-record-book a,
.mlcl-site .entry-content .mlcl-record-book a:hover,
.mlcl-site .entry-content .mlcl-record-book a:focus-visible,
.mlcl-record-book a,
.mlcl-record-book a:hover,
.mlcl-record-book a:focus-visible { text-decoration: none; }

.mlcl-site .entry-content .mlcl-record-book .xl,
.mlcl-site .entry-content .mlcl-record-book .xl:hover,
.mlcl-site .entry-content .mlcl-record-book .xl:focus-visible,
.mlcl-record-book .xl,
.mlcl-record-book .xl:hover,
.mlcl-record-book .xl:focus-visible {
  background: none;
  padding-bottom: 0;
}

.mlcl-site .entry-content .mlcl-record-book .crumbs a,
.mlcl-record-book .crumbs a { text-decoration: none; }

.mlcl-site .entry-content .mlcl-record-book .mlcl-rb-hero-link,
.mlcl-record-book .mlcl-rb-hero-link { color: #f4f1ea; text-decoration: none; }
.mlcl-site .entry-content .mlcl-record-book .mlcl-rb-hero-link:hover,
.mlcl-record-book .mlcl-rb-hero-link:hover { color: var(--mlcl-orange); }

.mlcl-record-book .expl .ec .t { color: var(--mlcl-ink); }

/* Records-page data links inherited the global .entry-content rust (#a84e16),
   which failed AA on the cream rows (3.77:1) and the orange-tint leader rows
   (2.40:1). Use the theme's AA-on-light rust-ink (#B5400C, 5.03:1 on cream) for
   every records table and marquee link, matching the directories. The doubled
   selector outranks the global .entry-content a rule on the page surfaces. */
.mlcl-site .entry-content .mlcl-records .xl,
.mlcl-records .xl,
.mlcl-site .entry-content .mlcl-records .xl:hover,
.mlcl-records .xl:hover { color: var(--mlcl-accent-ink); }

/* The H2H call-to-action card on the records page had no keyboard focus ring
   (UA default only); give it the same orange ring as the other hub controls. */
.mlcl-records .h2hcta:focus-visible { outline: 3px solid var(--mlcl-orange); outline-offset: 2px; }

/* Cream-grammar table heads (2026-06-09 cohesion pass). The per-block light
   thead values above lose to the global recap-table rule
   .mlcl-site:not(.mlcl-app-active) .entry-content thead th (broadcast navy,
   0,4,2) on page-rendered surfaces, so restate them here at higher
   specificity. Standings-style: sand fill, muted ink, strong baseline. The
   navy thead intentionally stays on the player/team game logs and the
   head-to-head meetings table (those pages already meet the site grammar). */
.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-record-book thead th,
.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-records thead th {
  background: var(--mlcl-bg-2);
  color: var(--mlcl-ink-mute);
  border-bottom: 2px solid var(--mlcl-line-strong);
}

/* The same global recap-table rule also paints any tr:first-child th as a navy
   chip, which on the hub leaderboards lands on the rank-1 leader's team cell.
   Standings-style leader rows carry the orange tint instead, so restore the
   regular cell treatment there (the leader tint matches tr.lead). */
.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-records tbody tr:first-child th {
  background: rgba(255, 139, 72, .14);
  color: var(--mlcl-ink);
  font-family: inherit;
  font-weight: 700;
  text-transform: none;
  letter-spacing: normal;
  font-size: 13.5px;
  padding: 9px 12px;
}
@media (max-width: 760px) {
  /* Match the mobile card reflow values the global chip rule was overriding. */
  .mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-records tbody tr:first-child th {
    font-size: 13px;
    padding: 0;
  }
}

/* Team-name links in the leaderboard rows inherit their cell colour instead of
   the rust accent above: rows read as dark ink on cream (the rank-1 leader row
   carries the orange tint, restored above from the old navy-chip treatment).
   This matches how the season-overview standings link team names and stays
   correct whichever way the cell is tinted. The rust accent still applies to
   the marquee / biggest-wins / rivalry links on the cream cards. */
.mlcl-site .entry-content .mlcl-records .tn .xl,
.mlcl-records .tn .xl { color: inherit; }

/* ============================================================================
   Hub touch-target pass (a11y, 2026-06-09): breadcrumbs + the record-book
   index aside link clusters. Same technique as the site-wide pass above:
   padding cancelled by an equal negative margin grows the pointer/tap box to
   44px while the rendered layout does not move. The record-book scope strips
   the .xl underline-grow background (background: none above), so none of the
   added padding paints anything.
   ========================================================================== */

/* Hub breadcrumb links (record-book, records, seasons index/overview, week,
   team, player, directories): 11-14px text in slim crumb bars. */
.mlcl-hub .crumbs a,
.mlcl-so-crumb a,
.mlcl-si-crumb a,
.mlcl-dir-crumb a {
  display: inline-block;
  padding: 17px 6px;
  margin: -17px -6px;
}

/* Record-book hero: the "Browse all records" underline link (12px text). */
.mlcl-record-book .mlcl-rb-hero-link {
  padding: 16px 6px;
  margin: -16px -6px;
}

/* Latest-week panel: the season / week eyebrow links and the per-game team
   links in the results column. The doubled .mlcl-site .entry-content prefix
   out-weighs the record-book padding-bottom:0 reset above (0,4,0), which was
   stripping the bottom half of these hit boxes on the page surface. */
.mlcl-site .entry-content .mlcl-record-book .latest .l .wk .xl,
.mlcl-record-book .latest .l .wk .xl {
  display: inline-block;
  padding: 16px 4px;
  margin: -16px -4px;
}
.mlcl-site .entry-content .mlcl-record-book .gr .xl,
.mlcl-record-book .gr .xl {
  padding: 15px 2px;
  margin: -15px -2px;
}

/* Records cards: the record-holder name link and the context (who) link. */
.mlcl-site .entry-content .mlcl-record-book .rc .val--name a,
.mlcl-record-book .rc .val--name a {
  padding: 10px 2px;
  margin: -10px -2px;
}
.mlcl-site .entry-content .mlcl-record-book .rc .who a,
.mlcl-record-book .rc .who a {
  padding: 15px 2px;
  margin: -15px -2px;
}

/* Champions ladder: the season cell is one 42px block link; nudge it to 44.
   The champion team + player links inside td.cc stay as-is: they are inline
   links within the cell's text block (WCAG 2.5.8 inline exception), and any
   padding large enough to matter would overlap the adjacent distinct target
   on the next line, which is worse than the small target. */
.mlcl-site .entry-content .mlcl-record-book .seasoncell > .xl,
.mlcl-record-book .seasoncell > .xl {
  display: inline-block;
  padding: 3px 0;
  margin: -3px 0;
}

/* ============================================================================
   SEASON STORY TIMELINE (Phase B, 2026-06-10)
   One component, three surfaces: the recap category archives (full mode),
   the /season/{slug}/ overview block (compact mode), and the /updates/
   season chapters (B4; the chapter card CSS ships here).
   Rendered by mlcl_render_season_timeline() in inc/season-timeline.php from
   the approved mockup (designs/design-audit-20260609/timeline-mockup.html).

   Mobile-first, ONE single-column spine at every width: >=900px only gets a
   roomier 860px column and bigger thumbs, never multiple columns. Colors are
   tokens only; the fixed navy moments (week nodes, the championship card, the
   state bar) use the theme-invariant --mlcl-navy because this renders on the
   light hub body. The spine rail is a border-left on the CONTAINER
   (.mlcl-tl-spine), deliberate wayfinding, not a card accent; the only card
   accent is the championship card's border-top, per the top-rule convention.
   ============================================================================ */
.mlcl-tl {
  max-width: 860px;
  margin: 0 auto;
}

/* --- A. season state bar (in-progress / upcoming, full mode only) --- */
.mlcl-tl-state {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 10px;
  background: var(--mlcl-navy);
  color: #fff;
  border-radius: 8px;
  padding: 12px 16px;
  margin: 0 0 14px;
}
.mlcl-tl-state-dot {
  width: 9px;
  height: 9px;
  border-radius: 50%;
  background: var(--mlcl-orange);
  box-shadow: 0 0 0 4px rgba(255, 139, 72, 0.25);
  flex: none;
}
.mlcl-tl-state--upcoming .mlcl-tl-state-dot {
  background: var(--mlcl-teal);
  box-shadow: 0 0 0 4px rgba(83, 194, 203, 0.25);
}
.mlcl-tl-state b {
  font: 600 13px/1 'Oswald', system-ui, sans-serif;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: #fff;
}
.mlcl-tl-state span {
  color: var(--mlcl-navy-ink-dim);
  font-size: 13.5px;
}
.mlcl-tl-state a {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  margin: -12px 0 -12px auto;
  color: var(--mlcl-orange);
  font: 600 12px/1 'Oswald', system-ui, sans-serif;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  text-decoration: none;
  flex: none;
}
.mlcl-tl-state a:hover {
  text-decoration: underline;
}

/* --- photo slot: real featured image, or the hatch placeholder labeled with
   the season (the load-bearing fallback: 83 of 85 recaps have no photo) --- */
.mlcl-tl-ph {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
  background: repeating-linear-gradient(45deg, var(--mlcl-bg-2), var(--mlcl-bg-2) 8px, var(--mlcl-bg) 8px, var(--mlcl-bg) 16px);
  color: var(--mlcl-ink-mute);
  font: 600 10px/1.2 'Oswald', system-ui, sans-serif;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  text-align: center;
  padding: 4px;
}
.mlcl-tl-ph--dark {
  background: repeating-linear-gradient(45deg, var(--mlcl-navy-2), var(--mlcl-navy-2) 8px, var(--mlcl-navy) 8px, var(--mlcl-navy) 16px);
  color: var(--mlcl-navy-ink-dim);
}
.mlcl-tl .mlcl-tl-img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  /* league photos are portrait phone shots; faces sit in the upper third */
  object-position: center 30%;
}

/* --- shared link row ("Recap" rust / "Results" teal, arrow tail) --- */
.mlcl-tl-links {
  display: flex;
  flex-wrap: wrap;
  gap: 0 18px;
  margin-top: 5px;
}
.mlcl-tl-links a {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  font-weight: 700;
  font-size: 13.5px;
  text-decoration: none;
  color: var(--mlcl-accent-ink);
}
.mlcl-tl-links a.alt {
  color: var(--mlcl-teal-ink);
}
.mlcl-tl-links a::after {
  content: ' \2192';
  white-space: pre;
}
.mlcl-tl-links a:hover {
  text-decoration: underline;
}

/* --- B. featured latest week (photo-forward, in-progress full mode) --- */
.mlcl-tl-feat {
  background: var(--mlcl-surface);
  border: 1px solid var(--mlcl-line);
  border-radius: 10px;
  overflow: hidden;
  margin: 0 0 18px;
  box-shadow: 0 10px 26px rgba(12, 37, 48, 0.08);
}
.mlcl-tl-feat-ph {
  /* portrait media box (league photos are portrait), capped so the card
     never towers over the body copy on phones */
  aspect-ratio: 4 / 5;
  height: auto;
  max-height: 440px;
  overflow: hidden;
}
.mlcl-tl-feat-body {
  padding: 16px;
}
.mlcl-tl-tagrow {
  display: flex;
  gap: 8px;
  align-items: center;
  margin: 0;
}
.mlcl-tl-tag {
  font: 700 10.5px/1 'Oswald', system-ui, sans-serif;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  background: var(--mlcl-orange);
  color: var(--mlcl-navy);
  border-radius: 3px;
  padding: 5px 8px;
}
.mlcl-tl-when {
  font: 600 11.5px/1.3 'Oswald', system-ui, sans-serif;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--mlcl-ink-soft);
}
.mlcl-tl-feat-h {
  font-size: 22px;
  line-height: 1.15;
  font-weight: 800;
  margin: 10px 0 6px;
}
.mlcl-tl-feat-h a,
.mlcl-tl-h a {
  color: var(--mlcl-ink);
  text-decoration: none;
}
.mlcl-tl-feat-h a:hover,
.mlcl-tl-h a:hover {
  color: var(--mlcl-accent-ink);
}
.mlcl-tl-feat-body > p {
  margin: 0;
  color: var(--mlcl-ink-dim);
  font-size: 14.5px;
}
.mlcl-tl-facts {
  display: flex;
  gap: 14px;
  flex-wrap: wrap;
  margin: 12px 0 0;
  padding-top: 11px;
  border-top: 1px solid var(--mlcl-bg-2);
}
.mlcl-tl-facts dt {
  font: 600 12px/1.3 'Oswald', system-ui, sans-serif;
  letter-spacing: 0.04em;
  color: var(--mlcl-ink-soft);
  text-transform: uppercase;
}
.mlcl-tl-facts dd {
  margin: 0;
  color: var(--mlcl-ink);
  font-size: 15px;
  font-weight: 700;
}
.mlcl-tl-feat .mlcl-tl-links {
  margin-top: 9px;
}

/* --- C. the spine: 2px left rail + week-number nodes; announcements ride
   teal outline-circle nodes with no card chrome. The rail is wayfinding on
   the container, not a card accent. --- */
.mlcl-tl-spine {
  position: relative;
  margin: 4px 0 0 17px;
  padding-left: 26px;
  border-left: 2px solid var(--mlcl-line-strong);
}
.mlcl-tl-row {
  position: relative;
  padding: 4px 0 22px;
}
.mlcl-tl-node {
  position: absolute;
  left: -45px;
  top: 2px;
  width: 36px;
  height: 36px;
  border-radius: 7px;
  background: var(--mlcl-navy);
  color: #fff;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}
.mlcl-tl-node small {
  font: 600 7.5px/1 'Oswald', system-ui, sans-serif;
  letter-spacing: 0.14em;
  color: var(--mlcl-navy-ink-dim);
}
.mlcl-tl-node b {
  font: 700 16px/1 'Oswald', system-ui, sans-serif;
}
.mlcl-tl-node--an {
  background: var(--mlcl-surface);
  border: 2px solid var(--mlcl-teal-ink);
  border-radius: 50%;
  color: var(--mlcl-teal-ink);
}
.mlcl-tl-node--an b {
  font-size: 13px;
}
.mlcl-tl-card {
  background: var(--mlcl-surface);
  border: 1px solid var(--mlcl-line);
  border-radius: 9px;
  padding: 13px 14px;
  display: flex;
  gap: 12px;
  align-items: flex-start;
}
.mlcl-tl-txt {
  flex: 1;
  min-width: 0;
}
.mlcl-tl-h {
  margin: 3px 0 4px;
  font-size: 17px;
  line-height: 1.2;
  font-weight: 700;
}
.mlcl-tl-txt > p {
  margin: 0;
  color: var(--mlcl-ink-dim);
  font-size: 13.5px;
}
.mlcl-tl-thumb {
  flex: none;
  width: 68px;
  height: 68px;
  border-radius: 7px;
  overflow: hidden;
}
.mlcl-tl-thumb .mlcl-tl-ph {
  font-size: 8px;
  letter-spacing: 0.08em;
}
.mlcl-tl-row .mlcl-tl-links a {
  font-size: 13px;
}
.mlcl-tl-row--an .mlcl-tl-card {
  background: transparent;
  border: 0;
  padding: 6px 0 0;
}
.mlcl-tl-row--an .mlcl-tl-h {
  font-size: 15px;
}

/* --- D. championship entry: the ONE dark navy moment; orange top rule per
   the border-top accent convention; Fairwater script accent --- */
.mlcl-tl-champ {
  background: var(--mlcl-navy);
  color: #fff;
  border-top: 4px solid var(--mlcl-orange);
  border-radius: 10px;
  overflow: hidden;
  margin: 0 0 22px;
}
.mlcl-tl-champ-ph {
  height: 150px;
}
.mlcl-tl-champ-body {
  padding: 16px;
}
.mlcl-tl-script {
  display: inline-block;
  font-family: 'Fairwater Script', 'Sacramento', cursive;
  font-weight: 400;
  font-size: 26px;
  line-height: 0.95;
  color: var(--mlcl-orange);
}
.mlcl-tl-champ-h {
  margin: 2px 0 4px;
  font-size: 24px;
  font-weight: 800;
  color: #fff;
}
.mlcl-tl-champ-body > p {
  margin: 0;
  color: var(--mlcl-navy-ink-dim);
  font-size: 14px;
}
.mlcl-tl-champ .mlcl-tl-links {
  margin-top: 9px;
}
.mlcl-tl-champ .mlcl-tl-links a {
  color: var(--mlcl-orange);
}
.mlcl-tl-champ .mlcl-tl-links a.alt {
  color: var(--mlcl-teal);
}

/* --- empty state (upcoming seasons; honest, never a broken arc) --- */
.mlcl-tl-empty {
  background: var(--mlcl-surface);
  border: 1px solid var(--mlcl-line);
  border-radius: 9px;
  padding: 16px;
}
.mlcl-tl-empty p {
  margin: 0 0 6px;
  color: var(--mlcl-ink-dim);
  font-size: 14.5px;
}
.mlcl-tl-empty p:last-child {
  margin-bottom: 0;
}
.mlcl-tl-empty a {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  margin: -10px 0;
  color: var(--mlcl-teal-ink);
  font-weight: 700;
  text-decoration: none;
}
.mlcl-tl-empty a:hover {
  text-decoration: underline;
}

/* --- compact mode (season overview): tighter rows, no thumbs/excerpts, the
   championship stays distinct as a slim navy card --- */
.mlcl-tl--compact .mlcl-tl-row {
  padding-bottom: 14px;
}
.mlcl-tl--compact .mlcl-tl-card {
  padding: 9px 12px;
}
.mlcl-tl--compact .mlcl-tl-h {
  font-size: 15px;
}
.mlcl-tl--compact .mlcl-tl-links a {
  min-height: 36px;
}
.mlcl-tl--compact .mlcl-tl-champ-ph {
  display: none;
}
.mlcl-tl--compact .mlcl-tl-champ {
  margin-bottom: 16px;
}
.mlcl-tl--compact .mlcl-tl-champ-body {
  padding: 12px 16px 14px;
}
.mlcl-tl--compact .mlcl-tl-script {
  font-size: 22px;
}
.mlcl-tl--compact .mlcl-tl-champ-h {
  font-size: 19px;
}

/* --- E. season chapter card (/updates/ prior seasons, B4) --- */
.mlcl-tl-chap {
  display: flex;
  gap: 14px;
  align-items: center;
  background: var(--mlcl-surface);
  border: 1px solid var(--mlcl-line);
  border-radius: 10px;
  padding: 14px 16px;
}
.mlcl-tl-chap-ph {
  flex: none;
  width: 64px;
  height: 84px;
  border-radius: 7px;
  overflow: hidden;
}
.mlcl-tl-chap-ph .mlcl-tl-ph {
  font-size: 8px;
  letter-spacing: 0.08em;
}
.mlcl-tl-chap-h {
  margin: 0 0 2px;
  font-size: 18px;
  font-weight: 800;
}
.mlcl-tl-chap p {
  margin: 0;
  color: var(--mlcl-ink-dim);
  font-size: 13px;
}
.mlcl-tl-chap-go {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  margin-left: auto;
  flex: none;
  font: 700 12px/1 'Oswald', system-ui, sans-serif;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--mlcl-accent-ink);
  text-decoration: none;
}
.mlcl-tl-chap-go:hover {
  text-decoration: underline;
}
/* chapter list wrapper (the mlcl/season-chapters block) + the two-link tail
   ("Season story" rust / "Record book" teal). Single column at every width,
   matching the one-spine rule. */
.mlcl-tl-chaps {
  max-width: 860px;
  margin: 0 auto;
  display: grid;
  gap: 12px;
}
.mlcl-tl-chaps-empty {
  margin: 0;
  color: var(--mlcl-ink-dim);
  font-size: 14.5px;
}
.mlcl-tl-chap-txt {
  min-width: 0;
}
.mlcl-tl-chap-links {
  margin-left: auto;
  flex: none;
  display: flex;
  flex-direction: column;
  align-items: flex-end;
}
.mlcl-tl-chap-go.alt {
  color: var(--mlcl-teal-ink);
}
@media (max-width: 560px) {
  .mlcl-tl-chap {
    flex-wrap: wrap;
  }
  .mlcl-tl-chap-links {
    margin-left: 0;
    width: 100%;
    flex-direction: row;
    align-items: center;
    gap: 0 22px;
  }
}

/* --- recap category page (category.php, B2): breadcrumb + dark hero band
   matching the seasons-index hero vocabulary, plus the "Part of the Record
   Book" cross-link into the /season/{slug}/ hub twin --- */
.mlcl-season-cat .crumbs {
  padding: 12px 40px;
  background: var(--mlcl-navy);
  border-bottom: 1px solid var(--mlcl-navy-2);
  font: 700 11px/1 'Oswald', system-ui, sans-serif;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--mlcl-navy-ink-dim);
}
.mlcl-season-cat .crumbs a {
  display: inline-block;
  padding: 12px 2px;
  margin: -12px -2px;
  color: var(--mlcl-orange);
  text-decoration: none;
}
.mlcl-season-cat .crumbs a:hover {
  text-decoration: underline;
}
.mlcl-season-cat .hero {
  position: relative;
  background: var(--mlcl-navy);
  color: #fff;
  padding: 32px 40px 28px;
  overflow: hidden;
}
.mlcl-season-cat .hero::after {
  content: '';
  position: absolute;
  inset: 0 0 0 auto;
  width: 44%;
  background: linear-gradient(115deg, transparent, rgba(255, 255, 255, 0.05));
  clip-path: polygon(24% 0, 100% 0, 100% 100%, 0 100%);
  pointer-events: none;
}
.mlcl-season-cat .hero .ey {
  font: 700 12px/1 'Oswald', system-ui, sans-serif;
  letter-spacing: 0.2em;
  color: var(--mlcl-orange);
}
.mlcl-season-cat .hero h1 {
  font-weight: 700;
  font-size: clamp(38px, 7vw, 58px);
  line-height: 0.95;
  margin: 6px 0 0;
  padding-left: 16px;
  border-left: 6px solid var(--mlcl-orange); /* brand h1 bar motif */
  color: #fff;
}
.mlcl-season-cat .hero p {
  color: var(--mlcl-navy-ink-dim);
  font-size: 14.5px;
  margin: 12px 0 0;
  max-width: 520px;
  position: relative;
  z-index: 2;
}
.mlcl-cat-rb-link {
  position: relative;
  z-index: 2;
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  margin-top: 8px;
  font: 700 12px/1.4 'Oswald', system-ui, sans-serif;
  letter-spacing: 0.06em;
  color: #f4f1ea;
  text-decoration: none;
}
.mlcl-cat-rb-link::after { content: " \2192"; color: var(--mlcl-orange); }
.mlcl-cat-rb-link:hover {
  color: var(--mlcl-orange);
}
@media (max-width: 760px) {
  .mlcl-season-cat .crumbs {
    padding-left: 18px;
    padding-right: 18px;
  }
  .mlcl-season-cat .hero {
    padding: 26px 18px 22px;
  }
  .mlcl-season-cat .sec {
    padding-left: 18px;
    padding-right: 18px;
  }
}

/* --- season pager (Phase C2): prev/next season wayfinding directly under the
   dark hero on the season hub (/season/{slug}/) and the recap category
   timeline. One slim navy band reading as the hero's footer rule, Oswald
   labels, 44px touch targets, a 1px hairline top rule only (no side accents,
   nothing on a rounded surface) so the detector counts stay flat. --- */
.mlcl-season-pager {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: 0 24px;
  background: var(--mlcl-navy);
  border-top: 1px solid var(--mlcl-navy-2);
  padding: 0 40px;
}
.mlcl-sp-link {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-height: 44px;
  font: 700 11px/1.3 'Oswald', system-ui, sans-serif;
  letter-spacing: 0.08em;
  text-decoration: none;
  color: var(--mlcl-orange);
}
.mlcl-sp-link:hover {
  text-decoration: underline;
}
.mlcl-sp-link--next {
  margin-left: auto;
  text-align: right;
}
.mlcl-sp-arrow {
  color: var(--mlcl-navy-ink-dim);
}
@media (max-width: 760px) {
  .mlcl-season-pager {
    padding: 0 18px;
  }
}

/* --- Phase B/C micro-interactions (polish pass). The hub explore tiles' lift,
   scaled down to 2px, on the spine cards and season chapter cards; transform
   only, and :focus-within gives keyboard users the same cue. Announcement
   rows have no card chrome, so nothing lifts there. The pager and the
   timeline text links keep their plain hover underline (already right). --- */
.mlcl-tl-row:not(.mlcl-tl-row--an) .mlcl-tl-card,
.mlcl-tl-chap {
  transition: transform 0.18s ease-out;
}
.mlcl-tl-row:not(.mlcl-tl-row--an) .mlcl-tl-card:hover,
.mlcl-tl-row:not(.mlcl-tl-row--an) .mlcl-tl-card:focus-within,
.mlcl-tl-chap:hover,
.mlcl-tl-chap:focus-within {
  transform: translateY(-2px);
}
@media (prefers-reduced-motion: reduce) {
  .mlcl-tl-card,
  .mlcl-tl-chap {
    transition: none !important;
    transform: none !important;
  }
}

/* Visible keyboard rings for every Phase B/C interactive surface (timeline
   links, chapter links, season pager, category-hero links, recap-single chips
   and record-book band); they had been falling back to the faint UA outline
   on the navy bands. Same 3px orange ring as the rest of the hub. */
.mlcl-tl a:focus-visible,
.mlcl-tl-chaps a:focus-visible,
.mlcl-season-pager a:focus-visible,
.mlcl-season-cat .crumbs a:focus-visible,
.mlcl-cat-rb-link:focus-visible,
.mlcl-rs-chips a:focus-visible,
.mlcl-rs-band a:focus-visible {
  outline: 3px solid var(--mlcl-orange);
  outline-offset: 2px;
}

/* --- /updates/ (.entry-content) re-pins: the generic boxed-prose rules
   (.mlcl-site:not(.mlcl-app-active) .entry-content h3/h4/p/a at (0,3,1))
   would recolor and re-margin the timeline + chapter cards rendered inside
   the page content. Match their prefix and add the component class so the
   component owns its own ink (the bracket-leaders precedent; the champ
   heading otherwise paints prose teal on navy, an AA failure). --- */
.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-tl h3,
.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-tl-chaps h3 {
  margin: 0;
  text-transform: none;
  letter-spacing: normal;
}
.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-tl h4 {
  margin: 3px 0 4px;
}
.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-tl p,
.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-tl-chaps p {
  margin: 0;
}
.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-tl-champ-h {
  color: #fff;
  margin: 2px 0 4px;
}
.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-tl-feat-h {
  margin: 10px 0 6px;
}
.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-tl-chap-h {
  color: var(--mlcl-ink);
  margin: 0 0 2px;
}
.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-tl a,
.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-tl-chaps a {
  text-decoration: none;
}
.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-tl a:hover,
.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-tl-chaps a:hover {
  text-decoration: underline;
}
.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-tl .mlcl-tl-feat-h a,
.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-tl .mlcl-tl-h a {
  color: var(--mlcl-ink);
}
.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-tl .mlcl-tl-feat-h a:hover,
.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-tl .mlcl-tl-h a:hover {
  color: var(--mlcl-accent-ink);
  text-decoration: none;
}
.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-tl .mlcl-tl-links a {
  color: var(--mlcl-accent-ink);
}
.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-tl .mlcl-tl-links a.alt {
  color: var(--mlcl-teal-ink);
}
.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-tl .mlcl-tl-champ .mlcl-tl-links a {
  color: var(--mlcl-orange);
}
.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-tl .mlcl-tl-champ .mlcl-tl-links a.alt {
  color: var(--mlcl-teal);
}
.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-tl .mlcl-tl-state a {
  color: var(--mlcl-orange);
}
.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-tl .mlcl-tl-empty a {
  color: var(--mlcl-teal-ink);
}
.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-tl-chaps .mlcl-tl-chap-go {
  color: var(--mlcl-accent-ink);
}
.mlcl-site:not(.mlcl-app-active) .entry-content .mlcl-tl-chaps .mlcl-tl-chap-go.alt {
  color: var(--mlcl-teal-ink);
}

/* ============================================================================
   RECAP SINGLE (Phase B5, inc/recap-single.php)
   Season-term posts only: context chips on the dark editorial hero, and the
   "This week in the Record Book" band after the content. Tokens only; the
   chips are pill-radius with a 1px hairline (no side accents), the nav cards
   plain 1px line cards, so the detector counts stay flat.
   ============================================================================ */
.mlcl-rs-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 0 0 16px;
}
.mlcl-rs-chip {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  padding: 0 16px;
  background: var(--mlcl-navy-2);
  border: 1px solid rgba(255, 255, 255, 0.16);
  border-radius: 999px;
  font: 600 12px/1 'Oswald', system-ui, sans-serif;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  text-decoration: none;
  color: var(--mlcl-orange);
}
.mlcl-rs-chip--wk {
  color: var(--mlcl-teal);
}
a.mlcl-rs-chip:hover {
  border-color: currentColor;
  text-decoration: underline;
}
.mlcl-rs-chip.is-static {
  color: var(--mlcl-navy-ink-dim);
}

/* --- the record-book band: link row + prev/next cards on cream --- */
.mlcl-rs-band .mlcl-rs-links {
  list-style: none;
  margin: 0 0 18px;
  padding: 0;
  display: flex;
  flex-wrap: wrap;
  gap: 0 24px;
}
.mlcl-rs-links li {
  margin: 0;
}
.mlcl-rs-links a {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  font-weight: 700;
  font-size: 14px;
  text-decoration: none;
  color: var(--mlcl-accent-ink);
}
.mlcl-rs-links a.alt {
  color: var(--mlcl-teal-ink);
}
.mlcl-rs-links a::after {
  content: ' \2192';
  white-space: pre;
}
.mlcl-rs-links a:hover {
  text-decoration: underline;
}
.mlcl-rs-nav {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
}
.mlcl-rs-nav-card {
  display: flex;
  flex-direction: column;
  gap: 3px;
  background: var(--mlcl-surface);
  border: 1px solid var(--mlcl-line);
  border-radius: 9px;
  padding: 12px 14px;
  text-decoration: none;
}
.mlcl-rs-nav-card span {
  font: 600 11px/1 'Oswald', system-ui, sans-serif;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--mlcl-ink-soft);
}
.mlcl-rs-nav-card strong {
  color: var(--mlcl-ink);
  font-size: 15px;
  line-height: 1.25;
}
.mlcl-rs-nav-card small {
  color: var(--mlcl-ink-dim);
  font-size: 12.5px;
}
a.mlcl-rs-nav-card:hover strong {
  color: var(--mlcl-accent-ink);
  text-decoration: underline;
}
.mlcl-rs-nav-card.is-empty {
  background: transparent;
  border-style: dashed;
}
.mlcl-rs-nav-card.is-empty strong {
  color: var(--mlcl-ink-dim);
  font-weight: 600;
}
@media (max-width: 600px) {
  .mlcl-rs-nav {
    grid-template-columns: 1fr;
  }
}

/* --- >=900px: the SAME single spine, roomier (never columns) --- */
@media (min-width: 900px) {
  .mlcl-tl-feat {
    display: grid;
    grid-template-columns: 42% 1fr;
  }
  .mlcl-tl-feat-ph {
    aspect-ratio: auto;
    max-height: none;
    height: 100%;
    min-height: 230px;
  }
  .mlcl-tl-feat-h {
    font-size: 26px;
  }
  .mlcl-tl-spine {
    margin-left: 22px;
    padding-left: 34px;
  }
  .mlcl-tl-row {
    padding-bottom: 26px;
  }
  .mlcl-tl-card {
    padding: 16px 18px;
    gap: 16px;
  }
  .mlcl-tl-h {
    font-size: 19px;
  }
  .mlcl-tl-thumb {
    width: 72px;
    height: 96px;
  }
  .mlcl-tl--full .mlcl-tl-champ {
    display: grid;
    grid-template-columns: 40% 1fr;
  }
  .mlcl-tl--full .mlcl-tl-champ-ph {
    height: 100%;
    min-height: 180px;
  }
  .mlcl-tl--compact .mlcl-tl-row {
    padding-bottom: 16px;
  }
  .mlcl-tl--compact .mlcl-tl-card {
    padding: 10px 14px;
  }
  .mlcl-tl--compact .mlcl-tl-h {
    font-size: 16px;
  }
}

/* ==========================================================================
   Hub hero = shared page hero (2026-06-11)
   --------------------------------------------------------------------------
   The record book and its subpages lead with the SAME hero top as the
   broadcast pages (Standings / Rosters / Updates, the
   .mlcl-band--dark:has(h1) recipe): ink band, 3px board-stripe seam, faded
   diagonal board motif, Bricolage 800 uppercase H1 behind the orange lead
   bar, refined subtitle. The hub keeps its own inner hero furniture (stat
   strip, pickers, avatars) and the fluid-band gutters; only the band paint
   and the top-of-page type change. Oswald stays for in-page hub furniture
   (.disp tabs, badges, tables).
   ========================================================================== */

/* Board-stripe seam on the first dark strip of the page: the crumbs bar when
   the surface has one, else the hero itself. Same 3px rule the page-hero
   bands run under the site header. */
body.mlcl-hub .mlcl-hub > .crumbs { position: relative; }
body.mlcl-hub .mlcl-hub > .crumbs::before,
body.mlcl-hub .mlcl-hub > .hero:first-child::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 3px;
  background: linear-gradient(90deg, var(--mlcl-orange) 0 33%, var(--mlcl-teal) 33% 66%, var(--mlcl-orange) 66% 100%);
  opacity: 0.82;
  z-index: 2;
}

/* The page-hero diagonal board motif replaces the hub's corner sheen so the
   dark surface reads as the same band everywhere. Children lift above it. */
body.mlcl-hub .mlcl-hub .hero::after {
  inset: -12% -10%;
  width: auto;
  clip-path: none;
  background: linear-gradient(85deg, transparent 0 20%, var(--mlcl-teal-deep) 20% 30%, var(--mlcl-orange) 30% 46%, var(--mlcl-teal-deep) 46% 56%, transparent 56% 100%);
  transform: rotate(-12deg);
  opacity: 0.14;
  z-index: 0;
}
body.mlcl-hub .mlcl-hub .hero > * { position: relative; z-index: 1; }

/* Band typography + rhythm on the simple page heroes (eyebrow + H1 + intro).
   The profile and team heroes are avatar-led flex rows; they swap to the site
   display family further down but keep their own scale and layout. */
body.mlcl-hub .mlcl-record-book .hero,
body.mlcl-hub .mlcl-records .hero,
body.mlcl-hub .mlcl-head-to-head .hero,
body.mlcl-hub .mlcl-directory .hero,
body.mlcl-hub .mlcl-seasons-index .hero,
body.mlcl-hub .mlcl-season-overview .hero,
body.mlcl-hub .mlcl-week-view .hero,
body.mlcl-hub .mlcl-season-cat .hero {
  padding-top: 3.5rem;
  padding-bottom: 3.2rem;
}
body.mlcl-hub .mlcl-record-book .hero h1,
body.mlcl-hub .mlcl-records .hero h1,
body.mlcl-hub .mlcl-head-to-head .hero h1,
body.mlcl-hub .mlcl-directory .hero h1,
body.mlcl-hub .mlcl-seasons-index .hero h1,
body.mlcl-hub .mlcl-season-overview .hero h1,
body.mlcl-hub .mlcl-week-view .hero h1,
body.mlcl-hub .mlcl-season-cat .hero h1 {
  font-family: 'Bricolage Grotesque', system-ui, sans-serif;
  font-weight: 800;
  font-size: clamp(2.5rem, 5.5vw, 4.2rem);
  line-height: 0.95;
  letter-spacing: -0.015em;
  text-transform: uppercase;
  color: var(--mlcl-cream-on-dark, #f4f1ea);
  padding-left: 1.15rem;
  border-left: 5px solid var(--mlcl-orange);
}
body.mlcl-hub .mlcl-record-book .hero > p,
body.mlcl-hub .mlcl-records .hero > p,
body.mlcl-hub .mlcl-head-to-head .hero > p,
body.mlcl-hub .mlcl-directory .hero > p,
body.mlcl-hub .mlcl-seasons-index .hero > p,
body.mlcl-hub .mlcl-season-overview .hero > p,
body.mlcl-hub .mlcl-week-view .hero > p,
body.mlcl-hub .mlcl-season-cat .hero > p {
  font-size: 1.15rem;
  line-height: 1.55;
  max-width: 56ch;
  color: var(--mlcl-dim-on-dark, #a8c0c8);
}

/* Eyebrow: the site-wide .eyebrow recipe (Bricolage, wide tracking) in the
   hero orange. */
body.mlcl-hub .mlcl-hub .hero .ey {
  font-family: 'Bricolage Grotesque', system-ui, sans-serif;
  font-weight: 700;
  font-size: 0.75rem;
  line-height: 1;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: var(--mlcl-orange);
}

/* Avatar-led heroes (player profile, team page): same display family so the
   top of every hub page speaks one voice; scale and flex layout stay theirs. */
body.mlcl-hub .mlcl-player-profile .hero h1,
body.mlcl-hub .mlcl-team-page .hero h1 {
  font-family: 'Bricolage Grotesque', system-ui, sans-serif;
  font-weight: 800;
  letter-spacing: -0.01em;
}

/* Crumbs ride the same type change (they sit inside the hero top). */
body.mlcl-hub .mlcl-hub > .crumbs {
  font-family: 'Bricolage Grotesque', system-ui, sans-serif;
  font-weight: 700;
  font-size: 11px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
}