
/* Team-Pages Design Tokens
 * -------------------------------------------------------------------------
 * Shared-across-all-teams foundation. Per-team accent colors are still
 * injected as inline custom-properties on the <body> element at render time,
 * but nothing paints with them: on web pages team colour lives in the logo
 * only (DESIGN.md "The Team Color Rule", D-143; guarded by
 * tests/test_team_page_accent_contract.py).
 *
 * DESIGN.md (the design law since 2026-09-28):
 *   - Light-only, Archivo only (condensed "Archivo Head" for headlines)
 *   - Sentence case: no uppercase transforms, no letter-spaced labels
 *   - 44px touch targets, mobile-first spacing rhythm
 */


:root {
  /* -----  Color system (538/Pudding light — Phase 3 2026-06-16) ------ */
  --bg-0: #ffffff;
  --bg-1: #ffffff;
  --bg-2: #f1f1ec;                       /* neutral fill (Track); the chart plot panel retired, charts sit on white (DESIGN.md) */
  --bg-card: #ffffff;
  --bg-card-raised: #f1f1ec;
  --bg-overlay: rgba(34, 34, 34, 0.55);  /* modal scrim (ink, semi) */

  --fg-primary: #222222;
  --fg-secondary: #5b5b5b;
  /* Caption Gray (5.6:1). Was #8b8b8b (3.4:1), below DESIGN.md's contrast
   * floor for text; --fg-tertiary was never defined, so its ~70 callers
   * rendered their #8b8b8b fallback. Both now resolve to Caption Gray. */
  --fg-muted: #686862;
  --fg-tertiary: #686862;
  --fg-subtle: #a8a8a4;
  --fg-on-accent: #222222;               /* ink on accent (doc-90 Appendix C) */

  --stroke-default: #e4e4e1;
  --stroke-subtle: rgba(34, 34, 34, 0.05);
  --stroke-strong: #d7d7d4;

  /* -----  Accent (overridden per-team via inline style) ------ */
  --accent-primary: #c5b358;
  --accent-secondary: #084c24;
  --accent-gradient: linear-gradient(135deg, var(--accent-primary), var(--accent-secondary));
  --accent-on: #0b0d12;

  /* -----  Percentile / belief ramps ------ */
  /* One hue (DESIGN.md: percentiles are Measured Blue), darker = better.
     #c2d7e8 is the palest start that keeps check_color_blind.py passing
     with #1d68a3 on top. The Savant red->grey->blue ramp retired 2026-09-29. */
  --pct-low: #c2d7e8;
  --pct-mid-low: #99bbd7;
  --pct-mid: #70a0c6;
  --pct-mid-high: #4684b4;
  --pct-high: #1d68a3;

  --belief-doom: #c04a4a;
  --belief-mixed: #8a90a1;
  --belief-bullish: #3ea073;

  --accolade-gold: #c5b358;

  /* -----  Emotional-key accents (seasonal sentience) ------ */
  --tone-red: #c04a4a;
  --tone-amber: #d9a55e;
  --tone-navy: #3570b5;
  --tone-gray: #8a90a1;
  --tone-coral: #d95e7c;
  --tone-green: #3ea073;

  /* -----  Typography ------ */
  /* --font-display (Archivo) drives hero numbers + metric tiles + labels,
   * which must stay sans/tabular, never serif. Editorial serif
   * headlines/prose use --font-serif (Fraunces). */
  --font-display: 'Archivo', -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --font-body: 'Archivo', -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  /* --font-sans was never one of this system's real names (--font-body/--font-display
   * are) -- 67 var(--font-sans, 'Inter', ...) call sites across 26 team_pages modules
   * were silently rendering in Inter (a retired font) instead of Archivo because of it,
   * confirmed live 2026-07-26. Defined as an alias of --font-body's exact value rather
   * than rewriting 26 files, since that's what every one of those call sites actually
   * meant by "sans". */
  --font-sans: 'Archivo', -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --font-serif: 'Archivo Head', 'Archivo', 'Helvetica Neue', Arial, sans-serif;
  /* No mono face (DESIGN.md "One Family Rule"): data is Archivo with tabular
   * figures. JetBrains Mono was never self-hosted, so this rendered as the
   * system monospace. Kept as a name so its callers resolve to Archivo. */
  --font-mono: 'Archivo', 'Helvetica Neue', Arial, sans-serif;

  /* ----- Canonical type ladder (2026-09-10 heading/module-rhythm fix pass) -----
   * One spec, mirrored into cfb-tokens.css and reporting.py's global monolith.
   * Codifies what's actually shipped (~17px body / ~33px h1) rather than the
   * original doc-90 spec (18px/40px) — owner ruling 2026-09-10, doc-90 §1.2
   * amended accordingly. --fs-headline-sm/--fs-headline/--fs-hero/--fs-label
   * below alias onto this ladder so their ~60 existing call sites keep working
   * unchanged; --fs-metric/--fs-metric-sm/--fs-serif-body stay independent
   * (data-display sizes, not the heading register).
   */
  --fs-micro: 12px;
  --fs-eyebrow: 12px;
  --fs-caption: clamp(13px, 0.78rem + 0.11vw, 14px);
  --fs-h3: clamp(18px, 1.04rem + 0.34vw, 21px);
  --fs-h2: clamp(22px, 1.27rem + 0.45vw, 26px);
  --fs-h1: clamp(27px, 1.52rem + 0.67vw, 33px);
  --fs-display: clamp(34px, 1.63rem + 2.02vw, 52px);

  --fs-label: var(--fs-eyebrow);
  --fs-metric-sm: clamp(14px, 1vw + 10px, 16px);
  --fs-body: clamp(15px, 0.88rem + 0.22vw, 17px);
  --fs-body-lg: clamp(17px, 1.00rem + 0.22vw, 19px);
  --fs-headline-sm: var(--fs-h3);
  --fs-headline: var(--fs-h2);
  --fs-hero: var(--fs-display);
  --fs-serif-body: clamp(16px, 0.8vw + 12px, 19px);
  --fs-metric: clamp(24px, 2vw + 12px, 36px);

  --lh-tight: 1.12;
  --lh-snug: 1.28;
  --lh-normal: 1.48;
  --lh-relaxed: 1.65;

  --lh-display: 1.00;
  --lh-h1: 1.12;
  --lh-h2: 1.20;
  --lh-h3: 1.30;
  --lh-body-lg: 1.55;
  --lh-body: 1.60;
  --lh-label: 1.25;

  /* Sentence case, no letter-spaced labels (DESIGN.md): the wide/label/
   * eyebrow tracking that came with the retired uppercase labels is gone. */
  --ls-tight: -0.02em;
  --ls-normal: 0em;
  --ls-wide: 0.01em;
  --ls-label: 0.01em;
  --ls-display: -0.022em;
  --ls-h1: -0.015em;
  --ls-h2: -0.010em;
  --ls-eyebrow: 0.01em;

  --measure-prose: 68ch;
  --measure-headline: 26ch;

  /* ----- Module rhythm (distinct names — never reuse --sp-N; team_pages'
   * --sp-7=32px collides in VALUE but not MEANING with cfb-tokens' --sp-8=32px,
   * and a shared --sp-N name across scopes would silently reflow whichever
   * surface didn't intend the change) ------ */
  --module-gap: 32px;
  --module-gap-chapter: 48px;
  --module-gap-tight: 16px;
  --module-gap-drawer: 24px;

  /* -----  Spacing rhythm ------ */
  --sp-1: 4px;
  --sp-2: 8px;
  --sp-3: 12px;
  --sp-4: 16px;
  --sp-5: 20px;
  --sp-6: 24px;
  --sp-7: 32px;
  --sp-8: 40px;
  --sp-9: 56px;
  --sp-10: 80px;

  /* -----  Radii (538 sharp; pill kept for circular avatars only) ------ */
  --radius-sm: 2px;
  --radius-md: 3px;
  --radius-lg: 3px;
  --radius-xl: 3px;
  --radius-pill: 999px;

  /* -----  Elevation (538 flat — hierarchy from hairlines, not shadows) ------ */
  --elev-card: none;
  --elev-raised: 0 2px 8px rgba(0,0,0,0.12);   /* the single allowed overlay shadow */

  /* -----  Motion (state changes only: nothing reveals on scroll) ------ */
  --motion-reveal: 240ms cubic-bezier(.2,.7,.25,1);
  --motion-state: 180ms cubic-bezier(.2,.7,.25,1);
  --motion-data: 420ms cubic-bezier(.2,.7,.25,1);
  --motion-delight: 800ms cubic-bezier(.2,.7,.25,1);

  /* -----  Touch targets ------ */
  --touch-min: 44px;
  --touch-medium: 48px;
  --touch-large: 60px;

  /* -----  Layout ------ */
  --content-max-w: 1100px;
  --content-side-pad: clamp(16px, 4vw, 32px);
}

/* Reduced motion */
@media (prefers-reduced-motion: reduce) {
  :root {
    --motion-reveal: 0ms;
    --motion-state: 0ms;
    --motion-data: 0ms;
    --motion-delight: 0ms;
  }
}

/* Module rhythm compresses on small viewports — discrete step, not fluid,
 * so the 8pt grid stays a grid. */
@media (max-width: 640px) {
  :root {
    --module-gap: 24px;
    --module-gap-chapter: 32px;
    --module-gap-drawer: 16px;
    --module-gap-tight: 12px;
  }
}

/* ============================================================================
   WORLD-CLASS RANKINGS PAGE STYLES
   ============================================================================ */

/* -----  Tiered Row Styling ------ */
.rankings-row--elite {
  font-weight: 600;
}

.rankings-row--elite .rank-cell {
  font-size: 1.2em;
  color: var(--tone-navy);
  font-weight: 700;
}

.rankings-row--power {
  background: transparent;
}

.rankings-row--all {
  opacity: 0.8;
  font-size: 0.95em;
}

/* -----  Rank Change Magnitude ------ */
/* A delta is a coloured word with its arrow, never a filled badge. */
.rank-delta--large {
  font-weight: 700;
  font-size: 1.1em;
}

.rank-delta--large.rank-delta--up {
  color: var(--green, #3a7a4b);
}

.rank-delta--large.rank-delta--down {
  color: var(--red, #bf3b31);
}

.rank-delta--medium {
  font-weight: 600;
}

/* -----  Movement Dashboard ------ */
.movement-dashboard {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--sp-6);
  margin: var(--sp-8) 0;
}

.movement-panel {
  background: var(--bg-1);
  border: 1px solid var(--stroke-default);
  border-radius: var(--radius-lg);
  padding: var(--sp-4);
}

.movement-panel__title {
  font-family: var(--font-display);
  font-size: var(--fs-label);
  text-transform: none;
  letter-spacing: 0.01em;
  margin-bottom: var(--sp-3);
  color: var(--fg-secondary);
}

.movement-card {
  display: flex;
  align-items: center;
  gap: var(--sp-3);
  padding: var(--sp-2) 0;
  border-bottom: 1px solid var(--stroke-subtle);
}

.movement-card:last-child {
  border-bottom: none;
}

.movement-card__rank {
  font-family: var(--font-display);
  font-weight: 700;
  font-size: var(--fs-metric-sm);
  color: var(--tone-navy);
  min-width: 40px;
}

.movement-card__team {
  flex: 1;
  display: flex;
  flex-direction: column;
}

.movement-card__team .team-link {
  font-weight: 600;
  color: var(--fg-primary);
}

.movement-card__team .submetric {
  font-size: var(--fs-label);
  color: var(--fg-muted);
}

.movement-card__change {
  min-width: 60px;
  text-align: right;
}

/* -----  Tier Toggles ------ */
.rankings-tier-toggles {
  display: flex;
  gap: var(--sp-2);
  margin: var(--sp-6) 0;
  justify-content: center;
}

/* A segmented control: squared, active option in solid ink. */
.tier-toggle {
  padding: var(--sp-2) var(--sp-4);
  background: var(--bg-1);
  border: 1px solid #d9d9d3;
  border-radius: 2px;
  font-family: var(--font-display);
  font-size: var(--fs-label);
  font-weight: 600;
  color: var(--fg-secondary);
  cursor: pointer;
  transition: opacity .1s ease-in;
}

.tier-toggle:hover {
  opacity: .8;
}

.tier-toggle--active {
  background: var(--ink, #222);
  color: #ffffff;
  border-color: var(--ink, #222);
}

/* -----  Quick filters: underlined text, never chips ------ */
.rankings-quick-filters {
  display: flex;
  flex-wrap: wrap;
  gap: var(--sp-4);
  margin: var(--sp-6) 0;
  justify-content: center;
}

.filter-chip {
  padding: var(--sp-1) 0;
  background: none;
  border: 0;
  border-bottom: 2px solid transparent;
  font-family: var(--font-display);
  font-size: var(--fs-label);
  font-weight: 600;
  color: var(--fg-muted);
  text-decoration: underline;
  text-underline-offset: 3px;
  cursor: pointer;
  transition: opacity .1s ease-in;
}

.filter-chip:hover {
  opacity: .8;
}

.filter-chip--active {
  color: var(--ink, #222);
  text-decoration: none;
  border-bottom-color: var(--ink, #222);
}

/* -----  Sparkline Styling ------ */
.rank-sparkline {
  display: block;
  margin-top: 4px;
  opacity: 0.8;
}

.rank-change-wrapper {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}

/* -----  Accessibility ------ */
.skip-link {
  position: absolute;
  top: -40px;
  left: 0;
  background: var(--ink, #222);
  color: #ffffff;
  padding: var(--sp-2) var(--sp-3);
  text-decoration: none;
  border-radius: 2px;
  z-index: 9999;
}

.skip-link:focus {
  top: 0;
}

.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border-width: 0;
}

/* -----  Responsive Design ------ */
@media (max-width: 640px) {
  .rankings-tier-toggles {
    flex-wrap: wrap;
  }

  .tier-toggle {
    flex: 1 1 calc(50% - var(--sp-2));
    text-align: center;
    min-width: 100px;
  }

  .movement-dashboard {
    grid-template-columns: 1fr;
  }

  .rankings-quick-filters {
    gap: var(--sp-1);
  }

  .filter-chip {
    font-size: 12.5px;
  }

  .rank-sparkline {
    width: 60px;
    height: 18px;
  }

  /* Transform table rows into cards on mobile */
  #rankingsTableBody tr {
    display: block;
    margin-bottom: var(--sp-4);
    background: var(--bg-1);
    border: 1px solid var(--stroke-default);
    border-radius: var(--radius-md);
    padding: var(--sp-3);
  }

  #rankingsTableBody thead {
    display: none;
  }

  #rankingsTableBody td {
    display: block;
    padding: var(--sp-1) 0;
    border: none;
  }

  #rankingsTableBody td::before {
    content: attr(data-label);
    font-weight: 600;
    margin-right: var(--sp-2);
    color: var(--fg-muted);
  }

  .movement-card {
    flex-direction: column;
    align-items: flex-start;
  }

  .movement-card__rank {
    font-size: var(--fs-body);
  }
}

/* -------------------------------------------------------------------------
 * Light-mode override for profiled team pages (Sprint v5-11.5 Surface 2)
 *
 * When the theme toggle sets data-theme="light" on <html>, override the
 * dark-default tokens above with their light-mode equivalents. The
 * data ramps (--pct-*, --tone-*, --belief-*) are not overridden; the
 * per-team --accent-* values paint nothing (logo-only team colour).
 *
 * Specificity: :root[data-theme="light"] (0,1,1) beats :root (0,0,1)
 * defined above. No :where() neutralizer needed here because the
 * defaults aren't behind an @media block.
 * ------------------------------------------------------------------------- */

/* Base :root is now 538 light. This explicit-toggle block matches it so the
 * legacy theme toggle stays consistent until it is retired in Phase 8. */
:root[data-theme="light"] {
  --bg-0:               #ffffff;
  --bg-1:               #ffffff;
  --bg-2:               #f1f1ec;
  --bg-card:            #ffffff;
  --bg-card-raised:     #f1f1ec;
  --bg-overlay:         rgba(34, 34, 34, 0.55);

  --fg-primary:         #222222;
  --fg-secondary:       #5b5b5b;
  --fg-muted:           #686862;
  --fg-tertiary:        #686862;
  --fg-subtle:          #a8a8a4;
  --fg-on-accent:       #222222;

  --stroke-default:     #e4e4e1;
  --stroke-subtle:      rgba(34, 34, 34, 0.05);
  --stroke-strong:      #d7d7d4;
}

@view-transition{navigation:auto}
::view-transition-old(root){animation:.2s ease-in both pk-fade-out}
::view-transition-new(root){animation:.2s ease-in both pk-fade-in}
@keyframes pk-fade-out{from{opacity:1}to{opacity:0}}
@keyframes pk-fade-in {from{opacity:0}to{opacity:1}}
@keyframes slideIn{from{opacity:0;transform:translateX(-10px)}to{opacity:1;transform:none}}
@keyframes riseIn {from{opacity:0;transform:translateY(8px)} to{opacity:1;transform:none}}
@media(prefers-reduced-motion:reduce){
*,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;}}
.tnote{font:500 12.5px/1.45 "Archivo","Helvetica Neue",Arial,sans-serif;
  color:var(--ink-3,#686862);letter-spacing:0;text-transform:none;white-space:nowrap}
.xp{border:1px solid var(--rule,#d7d7d4);border-radius:2px}
.xp-btn{width:100%;text-align:left;display:flex;align-items:center;justify-content:space-between;
  gap:10px;background:none;border:none;padding:10px 14px;
  font-family:"Archivo",system-ui,sans-serif;font-size:13.5px;font-weight:600;
  color:var(--ink,#222);cursor:pointer;transition:background .12s ease}
.xp-btn:hover{background:var(--row,#f7f7f6)}
.xp-chev{font-size:15px;flex:0 0 auto;transition:transform .2s ease;
  display:inline-block}
.xp.open .xp-chev{transform:rotate(180deg)}
.xp-body{display:grid;grid-template-rows:0fr;grid-template-columns:minmax(0,1fr);overflow:hidden;
  transition:grid-template-rows .24s ease}
.xp.open .xp-body{grid-template-rows:1fr}
.xp-inner{min-width:0;min-height:0;padding:0 14px}
.xp.open .xp-inner{padding:10px 14px 14px}
.hfoot{display:flex;flex-wrap:wrap;gap:4px 10px;font-size:11.5px;line-height:1.5;
  color:var(--ink-3,#8b8b8b);font-family:"Archivo",system-ui,sans-serif;
  font-variant-numeric:tabular-nums;border-top:1px solid var(--line,#e4e4e1);
  padding-top:6px;margin-top:8px}
.hfoot b{color:var(--ink-2,#5b5b5b);font-weight:600}

/* Team-Pages Component Styles
 * -------------------------------------------------------------------------
 * Reads from tokens.css. DESIGN.md (D-143): team colour lives in the logo
 * only, so nothing here paints with --accent-*; the subject is ink.
 */

/* Quote-as-headline rule (BUILD_PLAN.md Chunk D5 / Fable Pass-2 primitive):
 * generated summary text may never render at larger type than the verbatim
 * receipt it summarizes -- a template rule against flatness on any surface
 * that pairs an AI/computed take with the real quote or stat it's based on.
 * .tp-generated-take is the take; .tp-verbatim-receipt is the receipt it
 * points at. Apply both classes together; the receipt's size floor tracks
 * the take's cap so this holds regardless of which one a future edit resizes.
 */
.tp-generated-take {
  font-size: var(--fs-headline-sm);
}
.tp-verbatim-receipt {
  font-size: max(var(--fs-body), var(--fs-headline-sm));
}

* { box-sizing: border-box; }

html, body {
  margin: 0;
  padding: 0;
  /* overflow-x: clip (not hidden) + explicit overflow-y: visible — plain
     overflow-x: hidden on an ancestor breaks position:sticky on every
     descendant (incl. .team-tabs below), because browsers force the other
     axis to a scroll-container value unless clip is used with visible
     explicitly paired. Found 2026-07-03: the tab spine's sticky rule was
     correctly declared but silently defeated by this. */
  overflow-x: clip;
  overflow-y: visible;
  background: var(--bg-0);
  color: var(--fg-primary);
  font-family: var(--font-body);
  font-size: var(--fs-body);
  line-height: var(--lh-normal);
  /* Data is Archivo with tabular, lining figures, set globally (DESIGN.md). */
  font-variant-numeric: tabular-nums lining-nums;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

a { color: inherit; text-decoration: none; }

.team-page {
  min-height: 100vh;
  overflow-x: clip;
  overflow-y: visible;
  background: var(--bg-0);
}

.content {
  max-width: var(--content-max-w);
  margin: 0 auto;
  padding: var(--sp-6) var(--content-side-pad) var(--sp-10);
}

/* ------------------------------------------------------------------ */
/* Hero                                                                */
/* ------------------------------------------------------------------ */

.hero {
  display: grid;
  gap: var(--sp-6);
  padding: var(--sp-8) 0 var(--sp-7);
  border-bottom: 1px solid var(--stroke-default);
}

.hero__identity-bar {
  display: flex;
  align-items: center;
  gap: var(--sp-4);
  flex-wrap: wrap;
  row-gap: var(--sp-3);
}

.hero__logo {
  width: 80px;
  height: 80px;
  object-fit: contain;
  flex-shrink: 0;
}

@media (max-width: 640px) {
  .hero__logo {
    width: 56px;
    height: 56px;
  }
}

.hero__wordmark {
  font-family: var(--font-display);
  font-size: var(--fs-hero);
  font-weight: 800;
  letter-spacing: var(--ls-tight);
  line-height: var(--lh-tight);
  color: var(--ink-0, #191919);
  margin: 0;
}

/* Identity phrase — one-line voice anchor below the wordmark.
 * Hand-authored profiles surface their bespoke identity_phrase here;
 * synthesized profiles surface a conference-register template phrase. */
.hero__identity-phrase {
  font-family: 'Archivo', 'Helvetica Neue', Arial, sans-serif;
  font-size: clamp(15px, 0.5vw + 14px, 19px);
  
  line-height: 1.4;
  color: var(--fg-secondary);
  margin: clamp(6px, 1vw, 12px) 0 0 0;
  max-width: 70ch;
}

.hero__record {
  /* The record (10-2) is the loudest single stat in the hero: display
   * type in ink, no box (DESIGN.md: team colour is logo-only, labels are
   * words). */
  font-family: var(--font-display);
  font-size: var(--fs-headline);
  font-weight: 800;
  color: var(--ink-0, #191919);
  letter-spacing: var(--ls-normal);
  line-height: 1;
  font-variant-numeric: tabular-nums;
}

.hero__record-qualifier {
  font-family: var(--font-body);
  font-size: var(--fs-micro, 11px);
  text-transform: none;
  letter-spacing: 0.01em;
  color: var(--fg-2, #686862);
  align-self: center;
}

/* Poll ranks are words, not chips: "AP No. 8" in ink, the CFP committee's
 * rank in Talk Gold (what people vote). */
.hero__rank-chip {
  font-family: var(--font-display);
  font-weight: 700;
  font-size: var(--fs-label);
  text-transform: none;
  letter-spacing: var(--ls-label);
  color: var(--fg-primary);
}

.hero__rank-chip--cfp { color: var(--gold-text, #8a6200); }
.hero__rank-chip--d3  { color: var(--fg-primary); }

.hero__eyebrow {
  font-family: var(--font-display);
  text-transform: none;
  letter-spacing: var(--ls-label);
  font-size: var(--fs-label);
  color: var(--fg-muted);
}

.hero__heritage {
  display: flex;
  flex-wrap: wrap;
  gap: var(--sp-3) var(--sp-5);
  padding: var(--sp-3) 0;
  color: var(--fg-secondary);
  font-size: var(--fs-label);
  text-transform: none;
  letter-spacing: var(--ls-label);
  border-top: 1px solid var(--stroke-subtle);
  border-bottom: 1px solid var(--stroke-subtle);
}
.hero__heritage span { white-space: nowrap; }
.hero__heritage strong {
  color: var(--fg-primary);
  font-weight: 600;
  font-family: var(--font-mono);
  letter-spacing: var(--ls-normal);
}

.hero__state {
  font-family: Archivo,Helvetica Neue,Arial,sans-serif;
  font-size: var(--fs-serif-body);
  line-height: var(--lh-relaxed);
  color: var(--fg-primary);
  max-width: 62ch;
  margin: 0;
}

.hero__state strong {
  color: var(--fg-primary);
  font-weight: 600;
}

.hero__metrics {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: var(--sp-3);
}

@media (min-width: 760px) {
  .hero__metrics {
    grid-template-columns: repeat(4, 1fr);
  }
}

/* A plain row of facts, not a banner of big-number tiles (DESIGN.md):
 * no frames, a hairline between them. */
.metric-tile {
  border-top: 1px solid var(--line, #e7e7e2);
  padding: var(--sp-3) 0 0;
  display: grid;
  gap: var(--sp-2);
}

.metric-tile__label {
  font-family: var(--font-display);
  text-transform: none;
  letter-spacing: var(--ls-label);
  font-size: var(--fs-label);
  color: var(--fg-muted);
}

.metric-tile__value {
  font-family: var(--font-display);
  font-size: var(--fs-metric);
  font-weight: 700;
  letter-spacing: var(--ls-tight);
  line-height: var(--lh-tight);
  color: var(--fg-primary);
}

.metric-tile__value--accent { color: var(--fg-primary); }

.metric-tile__delta {
  font-family: var(--font-mono);
  font-size: var(--fs-label);
  color: var(--fg-secondary);
}
.metric-tile__delta--up { color: var(--tone-green); }
.metric-tile__delta--down { color: var(--tone-red); }

/* ------------------------------------------------------------------ */
/* Pulse module                                                        */
/* ------------------------------------------------------------------ */

.pulse {
  margin-top: var(--sp-8);
  background: var(--bg-card);
  border: 1px solid var(--stroke-default);
  border-radius: var(--radius-xl);
  padding: var(--sp-6);
  display: grid;
  gap: var(--sp-5);
  box-shadow: var(--elev-card);
}

.pulse__header {
  display: flex;
  align-items: center;
  gap: var(--sp-3);
  flex-wrap: wrap;
}

.pulse__title {
  font-family: var(--font-serif);
  font-weight: 800;
  font-size: var(--fs-headline-sm);
  letter-spacing: normal;
  color: var(--fg-primary);
  margin: 0;
}

/* A still dot: no halo, no endless pulse (DESIGN.md, at rest). */
.pulse__live-dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--green, #3a7a4b);
}

.pulse__live-dot--quiet { background: var(--fg-muted); }

.pulse__meta {
  font-family: var(--font-mono);
  font-size: var(--fs-label);
  color: var(--fg-muted);
  letter-spacing: var(--ls-wide);
}

.pulse__grid {
  display: grid;
  gap: var(--sp-5);
  grid-template-columns: 1fr;
}

@media (min-width: 760px) {
  .pulse__grid {
    grid-template-columns: 1.2fr 1fr;
  }
}

.pulse__mood-card {
  display: grid;
  gap: var(--sp-3);
}

.pulse__mood-number {
  font-family: var(--font-display);
  font-size: clamp(44px, 5vw + 16px, 84px);
  font-weight: 800;
  letter-spacing: var(--ls-tight);
  line-height: 1;
  color: var(--fg-primary);
}

.pulse__mood-delta {
  font-family: var(--font-mono);
  font-size: var(--fs-body);
  color: var(--fg-secondary);
}

.pulse__mood-word {
  font-size: 0.38em;
  font-weight: 700;
  letter-spacing: 0;
  margin-left: 14px;
  vertical-align: 0.35em;
}

.pulse__scale-track {
  position: relative;
  height: 10px;
  margin: 2px 0 0;
}

.pulse__scale-track::before {
  content: "";
  position: absolute;
  left: 0; right: 0; top: 4px;
  height: 2px;
  background: var(--stroke-default, #e4e4e1);
}

.pulse__scale-tick {
  position: absolute;
  top: 1px;
  width: 1px;
  height: 8px;
  background: #c8c8c4;
}

.pulse__scale-dot {
  position: absolute;
  top: -1px;
  width: 12px;
  height: 12px;
  margin-left: -6px;
  border-radius: 50%;
  background: var(--blue, #1d68a3);
}

.pulse__scale-ends {
  display: flex;
  justify-content: space-between;
  font-size: 12px;
  color: #686862;
}

.pulse__trajectory {
  display: flex;
  align-items: flex-end;
  gap: 3px;
  height: 48px;
  padding: var(--sp-2) 0;
}

.pulse__trajectory-bar {
  flex: 1;
  min-width: 6px;
  background: var(--stroke-strong, #d7d7d4);
  border-radius: 2px 2px 0 0;
}

.pulse__trajectory-bar--current {
  background: var(--blue, #1d68a3);
}

.pulse__event-log {
  display: grid;
  gap: var(--sp-3);
  padding: var(--sp-4);
  background: #ffffff;
  border-radius: var(--radius-md);
  border: 1px solid var(--stroke-default);
}

.pulse__event-log-title {
  font-family: var(--font-display);
  text-transform: none;
  letter-spacing: var(--ls-label);
  font-size: var(--fs-label);
  color: var(--fg-muted);
  margin: 0;
}

.pulse__event {
  display: grid;
  grid-template-columns: 58px 1fr auto;
  gap: var(--sp-3);
  align-items: baseline;
  padding-bottom: var(--sp-3);
  border-bottom: 1px solid var(--stroke-subtle);
}
.pulse__event:last-child { border-bottom: 0; padding-bottom: 0; }

.pulse__event-time {
  font-family: var(--font-mono);
  font-size: var(--fs-label);
  color: var(--fg-muted);
  letter-spacing: var(--ls-wide);
}

.pulse__event-text {
  font-size: var(--fs-body);
  color: var(--fg-primary);
  line-height: var(--lh-snug);
}

.pulse__event-delta {
  font-family: var(--font-mono);
  font-size: var(--fs-label);
  font-weight: 600;
}
.pulse__event-delta--up { color: var(--tone-green); }
.pulse__event-delta--down { color: var(--tone-red); }

.pulse__top-take {
  padding: var(--sp-4);
  background: #ffffff;
  border-radius: var(--radius-md);
  border: 1px solid var(--stroke-default);
  font-family: Archivo,Helvetica Neue,Arial,sans-serif;
  font-size: var(--fs-body);
  line-height: var(--lh-relaxed);
  color: var(--fg-secondary);
}

.pulse__top-take-attr {
  display: block;
  margin-top: var(--sp-2);
  font-family: var(--font-display);
  font-size: var(--fs-label);
  color: var(--fg-muted);
  text-transform: none;
  letter-spacing: var(--ls-label);
  font-style: normal;
}

/* ============================================================================
 * Five-axis Pulse strip — Brief §4.2 Panel 2 (Sprint D)
 * Reality Gap / Respect Gap / Cohort Divergence / Rival Heat / Volatility
 * ========================================================================= */

.pulse-five-axis {
  display: grid;
  gap: var(--sp-3);
  padding: var(--sp-4);
  margin-top: var(--sp-4);
  border: 1px solid var(--stroke-default);
  border-radius: var(--radius-md);
}
.pulse-five-axis__eyebrow {
  font-family: var(--font-display);
  font-size: var(--fs-label);
  font-weight: 700;
  letter-spacing: var(--ls-label);
  text-transform: none;
  color: var(--fg-muted);
  margin: 0;
}
.pulse-axis {
  display: grid;
  grid-template-columns: minmax(0, 120px) 1fr auto;
  align-items: center;
  gap: var(--sp-3);
  padding: var(--sp-2) 0;
  border-top: 1px solid var(--stroke-subtle);
}
.pulse-axis:first-of-type { border-top: 0; }
.pulse-axis__label {
  font-family: var(--font-sans);
  font-size: var(--fs-body);
  font-weight: 600;
  color: var(--fg-primary);
}
.pulse-axis__bar {
  position: relative;
  height: 10px;
  background: var(--fill-2, #f1f1ec);
  border-radius: var(--radius-md);
  overflow: hidden;
}
.pulse-axis__fill {
  position: absolute;
  inset: 0;
  width: var(--pct, 0%);
  background: var(--pct-mid);
  border-radius: var(--radius-md);
}
.pulse-axis[data-band="high"] .pulse-axis__fill { background: var(--pct-high); }
.pulse-axis[data-band="mid"]  .pulse-axis__fill { background: var(--pct-mid); }
.pulse-axis[data-band="low"]  .pulse-axis__fill { background: var(--pct-low); }
.pulse-axis__chip {
  font-family: var(--font-mono);
  font-size: var(--fs-label);
  font-weight: 600;
  color: var(--fg-secondary);
  white-space: nowrap;
  font-variant-numeric: tabular-nums;
}
.pulse-axis__desc {
  grid-column: 1 / -1;
  font-family: Archivo,Helvetica Neue,Arial,sans-serif;
  font-size: var(--fs-label);
  color: var(--fg-muted);
  line-height: 1.4;
  
}
.pulse-axis--awaiting .pulse-axis__label,
.pulse-axis--awaiting .pulse-axis__desc {
  color: var(--fg-muted);
}
.pulse-axis--awaiting .pulse-axis__fill {
  opacity: 0.45;
}
.pulse-axis--awaiting .pulse-axis__chip {
  color: var(--fg-muted);
}
@media (max-width: 720px) {
  .pulse-axis {
    grid-template-columns: minmax(0, 1fr) auto;
  }
  .pulse-axis__bar { grid-column: 1 / -1; }
}

.pulse__velocity {
  display: flex;
  align-items: baseline;
  gap: var(--sp-3);
}
.pulse__velocity-number {
  font-family: var(--font-display);
  font-size: var(--fs-headline-sm);
  font-weight: 700;
  color: var(--fg-primary);
}
.pulse__velocity-context {
  font-family: var(--font-mono);
  font-size: var(--fs-label);
  color: var(--fg-muted);
}

.pulse__badge-row {
  display: flex;
  justify-content: flex-end;
  margin-top: var(--sp-3);
}
/* A status is a word in caption style, not a boxed badge. */
.pulse__badge {
  font-family: var(--font-body);
  font-size: 12.5px;
  font-weight: 500;
  letter-spacing: var(--ls-label);
  text-transform: none;
  color: var(--fg-muted);
}
.pulse__badge--awaiting { color: var(--fg-muted); }
.pulse__badge--growing  { color: var(--fg-secondary); }

/* ------------------------------------------------------------------ */
/* Chronicle cards (compact render)                                    */
/* ------------------------------------------------------------------ */

.chronicle {
  margin-top: var(--sp-8);
  display: grid;
  gap: var(--sp-5);
}

.chronicle__header {
  display: flex;
  align-items: baseline;
  gap: var(--sp-3);
  border-bottom: 1px solid var(--stroke-default);
  padding-bottom: var(--sp-3);
}

.chronicle__title {
  font-family: var(--font-display);
  font-size: var(--fs-headline-sm);
  font-weight: 700;
  margin: 0;
}

.chronicle__grid {
  display: grid;
  gap: var(--sp-4);
  grid-template-columns: 1fr;
}
@media (min-width: 760px) {
  .chronicle__grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

/* Framed card: white, 1px line, 3px corners. The card type is a word
 * (.chronicle-card__type), not a coloured side stripe. */
.chronicle-card {
  background: var(--bg-card);
  border: 1px solid var(--stroke-default);
  border-radius: var(--radius-md);
  padding: var(--sp-5);
  display: grid;
  gap: var(--sp-3);
}

.chronicle-card__type {
  font-family: var(--font-display);
  text-transform: none;
  letter-spacing: var(--ls-label);
  font-size: var(--fs-label);
  color: var(--fg-muted);
}

.chronicle-card__headline {
  font-family: var(--font-display);
  font-size: var(--fs-body-lg);
  font-weight: 700;
  color: var(--fg-primary);
  margin: 0;
  line-height: var(--lh-snug);
}

.chronicle-card__body {
  font-family: Archivo,Helvetica Neue,Arial,sans-serif;
  font-size: var(--fs-body);
  line-height: var(--lh-relaxed);
  color: var(--fg-secondary);
  margin: 0;
}

.chronicle-card__source {
  font-family: var(--font-mono);
  font-size: var(--fs-label);
  color: var(--fg-subtle);
  letter-spacing: var(--ls-wide);
}

/* ------------------------------------------------------------------ */
/* Page footer + subnav                                                */
/* ------------------------------------------------------------------ */

.page-footer {
  margin-top: var(--sp-10);
  padding: var(--sp-6) 0;
  border-top: 1px solid var(--stroke-default);
  color: var(--fg-muted);
  font-size: var(--fs-label);
  text-transform: none;
  letter-spacing: var(--ls-label);
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: var(--sp-3);
}

.page-footer__mantra {
  font-family: Archivo,Helvetica Neue,Arial,sans-serif;
  
  color: var(--fg-secondary);
  text-transform: none;
  letter-spacing: var(--ls-normal);
  font-size: var(--fs-body);
}

.page-footer__link {
  color: var(--blue, #1d68a3);
  text-decoration: none;
  font-weight: 700;
  letter-spacing: 0.01em;
  transition: opacity .1s ease-in;
}
.page-footer__link:hover {
  opacity: 0.8;
  text-decoration: underline;
}

/* ------------------------------------------------------------------ */
/* Responsive tweaks                                                   */
/* ------------------------------------------------------------------ */

@media (max-width: 480px) {
  .hero { padding: var(--sp-6) 0; }
  .hero__wordmark { letter-spacing: var(--ls-tight); }
  .pulse { padding: var(--sp-5); }
  .pulse__mood-number { font-size: clamp(40px, 12vw, 64px); }
  .chronicle-card { padding: var(--sp-4); }
}

/* No entrance animations and no hover lifts: pages render finished and
 * still (DESIGN.md, "At rest, complete and still"). */

/* Savant Card — 13-metric percentile grid with peer-set toggle.
   Tokens live in tokens.css; this file composes cards from those tokens. */

/* Team colour lives in the logo only (DESIGN.md, 2026-09-28): the card is a
   plain 1px frame, no team-colour top bar. */
.savant-card {
  background: var(--surface-card, #fff);
  border: 1px solid var(--line-subtle, #e6e6e6);
  border-radius: var(--radius-md, 3px);
  padding: var(--sp-4, 16px) var(--sp-5, 20px);
  margin-top: var(--sp-5, 24px);
  font-family: var(--font-sans, system-ui, sans-serif);
  color: var(--text-primary, #111);
}

.savant-card__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--sp-3, 12px);
  flex-wrap: wrap;
  margin-bottom: var(--sp-3, 12px);
}

/* The card's only heading ("The Savant Card · Ohio State · 2026"): a plain
   sentence-case label, not a tracked eyebrow. */
.savant-card__eyebrow {
  font-family: var(--font-sans, system-ui);
  font-size: 12.5px;
  letter-spacing: 0.01em;
  text-transform: none;
  color: var(--text-muted, #666);
  font-weight: 700;
}

.savant-card__toggle {
  display: inline-flex;
  gap: 2px;
  background: var(--surface-muted, #f2f2f2);
  border-radius: 3px;
  padding: 3px;
}
/* The peer-set toggle is a real control (a segmented control): it keeps its
   box, squared, with the active option in solid ink. */
.savant-card__chip {
  background: transparent;
  border: none;
  padding: 5px 11px;
  border-radius: 2px;
  font-size: .8rem;
  letter-spacing: 0.01em;
  text-transform: none;
  font-weight: 600;
  color: var(--text-muted, #555);
  cursor: pointer;
  transition: opacity .1s ease-in;
}
.savant-card__chip:hover:not(.savant-card__chip--active) { opacity: .8; }
.savant-card__chip--active {
  background: var(--fg-primary, #222222);
  color: #fff;
}

/* The take above the bars: plain, upright text -- no gradient wash, no
   team-colour side stripe, no italic (DESIGN.md, 2026-09-28). */
.savant-card__narrative {
  font-family: Archivo, Helvetica Neue, Arial, sans-serif;
  font-size: 1.08rem;
  line-height: 1.55;
  color: var(--text-primary, #111);
  margin: 0 0 var(--sp-4, 16px) 0;
}
.savant-card__narrative--fallback {
  color: var(--text-muted, #555);
}
.savant-card .ai-badge { margin: calc(-1 * var(--sp-3, 12px)) 0 var(--sp-4, 16px); }

.savant-card__section {
  padding: var(--sp-3, 12px) 0;
  border-top: 1px solid var(--line-subtle, #e6e6e6);
}
.savant-card__section:first-of-type { border-top: none; }
.savant-card__section-eyebrow {
  font-size: 12.5px;
  letter-spacing: 0.01em;
  text-transform: none;
  color: var(--text-muted, #666);
  font-weight: 700;
  margin: 0 0 var(--sp-3, 12px) 0;
}

/* Bar layout: label | track | value  */
.savant-bar {
  display: grid;
  grid-template-columns: 160px 1fr 56px;
  align-items: center;
  gap: var(--sp-3, 12px);
  padding: 6px 0;
  transition: background 120ms ease;
}
.savant-bar:hover { background: rgba(0,0,0,0.02); }

.savant-bar__label {
  display: flex;
  flex-direction: column;
  gap: 2px;
  min-width: 0;
}
.savant-bar__label-text {
  font-size: 0.86rem;
  color: var(--text-primary, #111);
  font-weight: 500;
  line-height: 1.25;
  overflow-wrap: anywhere;
}
.savant-bar__raw {
  font-size: .8rem;
  color: var(--text-muted, #888);
  letter-spacing: 0.01em;
  font-variant-numeric: tabular-nums;
}
.savant-bar__track {
  position: relative;
  background: var(--surface-muted, #f2f2f2);
  height: 10px;
  border-radius: 3px;
  overflow: hidden;
}
.savant-bar__fill {
  height: 100%;
  width: 0;
  border-radius: 3px;
  background: var(--band-color, #9aa0a6);
}
.savant-bar__midline {
  position: absolute;
  left: 50%;
  top: 0;
  bottom: 0;
  width: 1px;
  background: rgba(0,0,0,0.08);
}
.savant-bar__value {
  font-variant-numeric: tabular-nums;
  font-weight: 600;
  color: var(--text-primary, #111);
  text-align: right;
  font-size: 0.98rem;
}
.savant-bar__pct-sup {
  font-size: 0.6em;
  vertical-align: super;
  color: var(--text-muted, #888);
  font-weight: 500;
  margin-left: 1px;
}

/* Band colors — encoded via data-band so the peer toggle can swap them
   without rewriting inline styles. */
.savant-bar[data-band="elite"]    .savant-bar__fill { background: #1d68a3; }
.savant-bar[data-band="strong"]   .savant-bar__fill { background: #6a9cc6; }
.savant-bar[data-band="average"]  .savant-bar__fill { background: #a3a3a3; }
.savant-bar[data-band="concern"]  .savant-bar__fill { background: #9b9b96; }
.savant-bar[data-band="bottom"]   .savant-bar__fill { background: #686862; }
.savant-bar[data-band="missing"]  .savant-bar__fill { background: transparent; }
.savant-bar[data-band="missing"]  .savant-bar__value .savant-bar__pct { color: var(--text-muted, #999); }

/* Echo callout: a ruled paragraph inside the defense section -- no tint box,
   no side stripe, no card nested in the card (DESIGN.md, 2026-09-28). */
.savant-card__echo {
  margin-top: var(--sp-3, 12px);
  padding: var(--sp-3, 12px) 0 0;
  border-top: 1px solid var(--line-subtle, #e6e6e6);
}
.savant-card__echo-eyebrow {
  display: block;
  font-size: 12px;
  letter-spacing: 0.01em;
  color: var(--text-muted, #666);
  font-weight: 700;
  margin-bottom: 4px;
}
.savant-card__echo-body {
  margin: 0;
  font-family: Archivo, Helvetica Neue, Arial, sans-serif;
  font-size: 0.95rem;
  line-height: 1.5;
  color: var(--text-primary, #222);
}
.savant-card__echo-body strong { font-weight: 600; }

.savant-card__legend {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: var(--sp-3, 12px) 0 0 0;
  padding-top: var(--sp-3, 12px);
  border-top: 1px dashed var(--line-subtle, #e6e6e6);
}
/* Legend: each band is a dot in the bar colour and a word -- labels are
   words, not filled boxes (DESIGN.md, 2026-09-28). */
.savant-card__legend-chip {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  font-size: 12px;
  letter-spacing: 0.01em;
  text-transform: none;
  font-weight: 600;
  color: var(--text-muted, #666);
}
.savant-card__legend-chip::before {
  content: "";
  width: 8px;
  height: 8px;
  border-radius: 50%;
  flex: none;
  background: var(--legend-dot, #a3a3a3);
}
.savant-card__legend-chip--elite    { --legend-dot: #1d68a3; }
.savant-card__legend-chip--strong   { --legend-dot: #6a9cc6; }
.savant-card__legend-chip--average  { --legend-dot: #a3a3a3; }
.savant-card__legend-chip--concern  { --legend-dot: #9b9b96; }
.savant-card__legend-chip--bottom   { --legend-dot: #686862; }

.savant-card__source {
  margin-top: var(--sp-3, 12px);
  padding-top: var(--sp-3, 10px);
  border-top: 1px solid var(--line-subtle, #eee);
  font-size: .8rem;
  color: var(--text-muted, #888);
  letter-spacing: 0.01em;
}

@media (max-width: 640px) {
  .savant-bar {
    grid-template-columns: 104px 1fr 44px;
    gap: 8px;
  }
  .savant-bar__label-text { font-size: .8rem; }
  .savant-bar__value { font-size: 0.86rem; }
  .savant-card__header { gap: 10px; }
  .savant-card__toggle { flex-wrap: wrap; }
  .savant-card__chip { padding: 5px 9px; font-size: .8rem; }
}

/* Rivalry Card — header + meta strip + trajectory + panels + meetings + stakes.
 * DESIGN.md (2026-09-28): team colour lives in the logo only, so the card has
 * no accent top bar, side stripes or team-coloured names; results are a bold
 * green W / red L letter, not a badge; labels are sentence case, untracked. */

.rivalry-card {
  background: var(--surface-card, #fff);
  border: 1px solid var(--line-subtle, #e6e6e6);
  border-radius: var(--radius-md, 3px);
  padding: var(--sp-4, 18px) var(--sp-5, 24px);
  margin-top: var(--sp-5, 24px);
  font-family: var(--font-sans, system-ui, sans-serif);
  color: var(--text-primary, #111);
}

/* ---------- Header ---------- */
.rivalry-card__header {
  text-align: center;
  padding-bottom: var(--sp-4, 16px);
  margin-bottom: var(--sp-4, 18px);
  border-bottom: 1px solid var(--line-subtle, #eee);
}
.rivalry-card__eyebrow {
  display: block;
  font-size: 12.5px;
  letter-spacing: 0.01em;
  font-weight: 700;
  color: var(--text-muted, #666);
  margin-bottom: 8px;
}
.rivalry-card__title {
  font-family: Archivo, Helvetica Neue, Arial, sans-serif;
  font-size: clamp(1.5rem, 3.5vw, 2.4rem);
  line-height: 1.15;
  margin: 0 0 6px 0;
  color: var(--text-primary, #111);
  letter-spacing: -0.02em;
  font-weight: 400;
}
.rivalry-card__trophy {
  display: inline-block;
  font-family: Archivo, Helvetica Neue, Arial, sans-serif;

  color: var(--fg-primary, #222222);
  font-size: 1.02rem;
  margin-bottom: 6px;
}
.rivalry-card__lineage {
  display: block;
  font-size: .8rem;
  color: var(--text-muted, #666);
  font-variant-numeric: tabular-nums;
  letter-spacing: 0.01em;
}

.rivalry-card__full-history {
  display: inline-block;
  margin-top: 10px;
  font-size: 0.82rem;
  font-weight: 600;
  color: var(--panel-accent, #1d68a3);
  text-decoration: none;
  transition: opacity 0.1s ease-in;
}
.rivalry-card__full-history:hover {
  opacity: 0.8;
}

/* ---------- Meta strip ---------- */
.rivalry-card__meta-strip {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 12px;
  padding: 14px 0;
  border-bottom: 1px solid var(--line-subtle, #eee);
}
.rivalry-card__meta-tile {
  display: flex;
  flex-direction: column;
  gap: 4px;
  padding: 10px 14px;
}
.rivalry-card__meta-label {
  font-size: 12.5px;
  letter-spacing: 0.01em;
  text-transform: none;
  color: var(--text-muted, #686862);
  font-weight: 700;
}
.rivalry-card__meta-value {
  font-family: Archivo, Helvetica Neue, Arial, sans-serif;
  font-size: 1.35rem;
  font-weight: 500;
  color: var(--text-primary, #111);
  font-variant-numeric: tabular-nums;
}
.rivalry-card__meta-sub {
  font-size: .8rem;
  color: var(--text-muted, #686862);
}

/* ---------- Trajectory ---------- */
.rivalry-card__trajectory {
  padding: 14px 0;
  border-bottom: 1px solid var(--line-subtle, #eee);
}
.rivalry-card__trajectory-header {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 8px;
}
.rivalry-card__section-eyebrow {
  font-size: 12.5px;
  letter-spacing: 0.01em;
  text-transform: none;
  color: var(--text-muted, #666);
  font-weight: 700;
}
.rivalry-card__gap {
  font-family: Archivo, Helvetica Neue, Arial, sans-serif;
  font-size: 0.95rem;
  color: var(--fg-primary, #222222);
  font-variant-numeric: tabular-nums;

}
.rivalry-card__trajectory-svg {
  width: 100%;
  height: 140px;
  display: block;
}
.rivalry-card__trajectory-note {
  font-size: .8rem;
  color: var(--text-muted, #686862);
  margin: 6px 0 0 0;
}

/* ---------- Panels ---------- */
.rivalry-card__panels {
  display: grid;
  gap: 14px;
  padding: 16px 0;
  border-bottom: 1px solid var(--line-subtle, #eee);
}
.rivalry-card__panels--dual { grid-template-columns: 1fr 1fr; }
.rivalry-card__panels--single { grid-template-columns: 1fr; }
.rivalry-card__panel {
  border: 1px solid var(--line-subtle, #e7e7e2);
  border-radius: var(--radius-md, 3px);
  padding: 14px 16px;
  background: var(--surface-card, #fff);
}
.rivalry-card__panel-head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 10px;
  margin-bottom: 8px;
}
.rivalry-card__panel-name {
  font-family: Archivo, Helvetica Neue, Arial, sans-serif;
  font-size: 1.04rem;
  color: var(--ink, #222);
  font-weight: 500;
}
.rivalry-card__panel-posture {
  font-size: 12.5px;
  letter-spacing: 0.01em;
  text-transform: lowercase;
  color: var(--text-muted, #555);
  font-weight: 500;
}
.rivalry-card__panel-quote {
  font-family: Archivo, Helvetica Neue, Arial, sans-serif;
  font-size: 1.02rem;
  line-height: 1.5;
  margin: 0 0 8px 0;
  color: var(--text-primary, #222);
}
/* A quote gets a short gold rule above it (DESIGN.md: gold = what people say). */
.rivalry-card__panel-quote::before {
  content: "";
  display: block;
  width: 40px;
  height: 3px;
  background: var(--gold, #b7851a);
  margin: 0 0 8px;
}
.rivalry-card__panel-attr {
  display: block;
  font-size: .8rem;
  color: var(--text-muted, #686862);
  font-style: normal;
}

/* ---------- Meetings ---------- */
.rivalry-card__meetings {
  padding: 16px 0;
  border-bottom: 1px solid var(--line-subtle, #eee);
}
.rivalry-card__meetings-list {
  list-style: none;
  padding: 0;
  margin: 10px 0 0 0;
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.rivalry-card__meeting {
  display: grid;
  grid-template-columns: 30px 48px 1fr;
  gap: 10px;
  align-items: baseline;
  padding: 8px 0;
  border-bottom: 1px dashed var(--line-subtle, #e7e7e2);
  font-family: Archivo, Helvetica Neue, Arial, sans-serif;
  font-size: 0.94rem;
  line-height: 1.45;
}
.rivalry-card__meeting:last-child { border-bottom: none; }
/* The result is a bold letter, W in Win Green and L in Loss Red, never a badge. */
.rivalry-card__meeting-result {
  display: inline-block;
  width: 24px;
  font-family: var(--font-sans, system-ui);
  font-size: 0.94rem;
  font-weight: 800;
  letter-spacing: 0;
  color: var(--text-muted, #686862);
}
.rivalry-card__meeting-result--win  { color: var(--win, #3a7a4b); }
.rivalry-card__meeting-result--loss { color: var(--loss, #bf3b31); }
.rivalry-card__meeting-year {
  font-family: var(--font-sans, system-ui);
  font-size: 0.84rem;
  font-weight: 600;
  color: var(--text-muted, #666);
  font-variant-numeric: tabular-nums;
}
.rivalry-card__meeting-body {
  color: var(--text-primary, #222);
}
.rivalry-card__meeting-body--placeholder {
  color: var(--text-muted, #686862);
  font-size: 0.9em;
}

/* ---------- Stakes ---------- */
.rivalry-card__stakes {
  padding: 16px 0 4px 0;
}
.rivalry-card__stakes-grid {
  display: grid;
  gap: 14px;
  margin-top: 10px;
}
.rivalry-card__stakes--dual .rivalry-card__stakes-grid {
  grid-template-columns: 1fr 1fr;
}
.rivalry-card__stake {
  padding: 12px 14px;
  background: var(--surface-card, #fff);
  border: 1px solid var(--line-subtle, #e7e7e2);
  border-radius: var(--radius-md, 3px);
}
.rivalry-card__stake-label {
  display: block;
  font-size: 12.5px;
  letter-spacing: 0.01em;
  text-transform: none;
  color: var(--text-muted, #666);
  font-weight: 700;
  margin-bottom: 6px;
}
.rivalry-card__stake-text {
  margin: 0;
  font-family: Archivo, Helvetica Neue, Arial, sans-serif;
  font-size: 0.98rem;
  line-height: 1.5;
  color: var(--text-primary, #222);
}

/* ---------- Responsive ---------- */
@media (max-width: 720px) {
  .rivalry-card { padding: 14px 16px; }
  .rivalry-card__meta-strip { grid-template-columns: repeat(2, 1fr); }
  .rivalry-card__panels--dual { grid-template-columns: 1fr; }
  .rivalry-card__stakes--dual .rivalry-card__stakes-grid { grid-template-columns: 1fr; }
  .rivalry-card__meeting { grid-template-columns: 24px 40px 1fr; gap: 8px; font-size: 0.86rem; }
}

/* ============================================================================
 * Fan heat index dual-thermometer — Brief §7.2 Zone 4 (Sprint E finish)
 * Two opposing thermometers. DESIGN.md (2026-09-28): the subject's bar is ink
 * and the rival's is quiet gray (--side-accent, set per side by
 * rivalry_card.py); the old blue-gold-red wash borrowed three meaning colours
 * for a heat scale, and the side borders/names wore team colour.
 * ========================================================================= */

.rivalry-heat {
  display: grid;
  gap: 12px;
  padding: 18px 20px;
  margin: 14px 0;
  background: #ffffff;
  border: 1px solid var(--line);
  border-radius: var(--r-2);
}
.rivalry-heat__header {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 6px 18px;
}
.rivalry-heat__title {
  font-family: 'Archivo', 'Helvetica Neue', Arial, sans-serif;
  font-size: 20px;
  font-weight: 600;
  line-height: 1;
  color: var(--ink);
  margin: 0;
}
.rivalry-heat__eyebrow {
  font-family: 'Archivo', system-ui, sans-serif;
  font-size: 12.5px;
  font-weight: 700;
  letter-spacing: 0.01em;
  color: var(--ink-3);
  margin: 0;
}
.rivalry-heat__body {
  font-family: 'Archivo', system-ui, sans-serif;
  font-size: 13px;
  line-height: 1.5;
  color: var(--ink-2);
  margin: 0;
  max-width: 60ch;
}
.rivalry-heat__body em { font-style: normal; }
.rivalry-heat__pair {
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  gap: 12px;
  align-items: stretch;
  margin-top: 4px;
}
.rivalry-heat__pair::before {
  content: "vs";
  grid-column: 2 / 3;
  align-self: center;
  font-family: 'Archivo', system-ui, sans-serif;
  font-weight: 800;
  font-size: 13px;
  color: var(--ink-3);
  letter-spacing: 0.01em;
}
.rivalry-heat__side {
  display: grid;
  gap: 6px;
  padding: 10px 12px;
  background: var(--page);
  border: 1px solid var(--line);
  border-radius: var(--r-2);
  text-align: left;
}
.rivalry-heat__side--opponent { text-align: right; }
.rivalry-heat__name {
  font-family: 'Archivo', system-ui, sans-serif;
  font-size: 12.5px;
  font-weight: 700;
  letter-spacing: 0.01em;
  color: var(--ink, #222);
}
.rivalry-heat__column { display: flex; align-items: stretch; }
.rivalry-heat__side--opponent .rivalry-heat__column { justify-content: flex-end; }
.rivalry-heat__bar {
  position: relative;
  width: 100%;
  height: 16px;
  background: var(--panel);
  border: 1px solid var(--line);
  border-radius: var(--r-2);
  overflow: hidden;
}
.rivalry-heat__side--opponent .rivalry-heat__bar { transform: scaleX(-1); }
.rivalry-heat__fill {
  position: absolute;
  inset: 0;
  width: var(--fill, 0%);
  background: var(--side-accent, #222);
  border-radius: var(--r-2);
}
.rivalry-heat__bar--awaiting .rivalry-heat__fill {
  opacity: 0.35;
  filter: grayscale(0.6);
}
.rivalry-heat__label {
  font-family: 'Archivo', system-ui, sans-serif;
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.01em;
  color: var(--ink-2);
  font-variant-numeric: tabular-nums;
}
@media (max-width: 540px) {
  .rivalry-heat__pair { grid-template-columns: 1fr; gap: 8px; }
  .rivalry-heat__pair::before { display: none; }
  .rivalry-heat__side--opponent { text-align: left; }
  .rivalry-heat__side--opponent .rivalry-heat__column { justify-content: flex-start; }
  .rivalry-heat__side--opponent .rivalry-heat__bar { transform: none; }
}

.rivalry-card__quiet{margin:1rem 0 .5rem;font:400 .9rem/1.5 Archivo,sans-serif;color:var(--text-3,#686862);}

/* CFPEraView — zoomed-out 2014+ trajectory + brick chapter index.
 * DESIGN.md (2026-09-28): the program's line, dots and regime bands are ink
 * (team colour lives in the logo only); no accent top bar or tile stripes;
 * labels are sentence case and untracked; nothing moves on hover but opacity. */

.arc-card {
  background: var(--surface-card, #fff);
  border: 1px solid var(--line-subtle, #e6e6e6);
  border-radius: var(--radius-md, 3px);
  padding: var(--sp-4, 18px) var(--sp-5, 24px);
  margin-top: var(--sp-5, 24px);
  font-family: var(--font-sans, system-ui, sans-serif);
  color: var(--text-primary, #111);
}

/* ---------- Header ---------- */
.arc-card__header {
  padding-bottom: 14px;
  margin-bottom: 14px;
  border-bottom: 1px solid var(--line-subtle, #eee);
}
.arc-card__eyebrow,
.arc-card__section-eyebrow {
  font-size: 12.5px;
  letter-spacing: 0.01em;
  text-transform: none;
  color: var(--text-muted, #666);
  font-weight: 700;
}
.arc-card__title {
  font-family: var(--font-serif, 'Archivo Head', 'Archivo', 'Helvetica Neue', Arial, sans-serif);
  font-size: clamp(1.4rem, 3.2vw, 2.2rem);
  line-height: 1.1;
  margin: 6px 0 8px 0;
  font-weight: 800;
  letter-spacing: -0.02em;
  color: var(--text-primary, #111);
}
.arc-card__thesis {
  font-family: Archivo, Helvetica Neue, Arial, sans-serif;
  font-size: 1.05rem;
  line-height: 1.55;
  color: var(--text-primary, #222);
  margin: 0;
  max-width: 68ch;
}
.arc-card__thesis--fallback {
  color: var(--text-muted, #555);
}

/* ---------- Meta strip ---------- */
/* auto-fit, not repeat(5,1fr), since 2026-09-10: the strip now drops the
   zero-valued CFP tiles, so a program with no playoff history ships 2 tiles
   and a blue-blood ships 6. A hardcoded 5-column grid would have left three
   empty cells on the former and wrapped the latter into a ragged second row. */
.arc-card__meta-strip {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(128px, 1fr));
  gap: 12px;
  padding: 14px 0;
  border-bottom: 1px solid var(--line-subtle, #eee);
}
.arc-card__meta-tile {
  display: flex;
  flex-direction: column;
  gap: 3px;
  padding: 10px 12px;
}
.arc-card__meta-label {
  font-size: 12.5px;
  letter-spacing: 0.01em;
  text-transform: none;
  color: var(--text-muted, #686862);
  font-weight: 700;
}
.arc-card__meta-value {
  font-family: var(--font-serif, Georgia, serif);
  font-size: 1.5rem;
  font-weight: 800;
  color: var(--text-primary, #111);
  font-variant-numeric: tabular-nums;
}
.arc-card__meta-sub {
  font-size: .8rem;
  color: var(--text-muted, #686862);
}

/* ---------- Chart ---------- */
.arc-card__chart-frame {
  padding: 14px 0;
  border-bottom: 1px solid var(--line-subtle, #eee);
}
.arc-card__chart-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 12px;
  margin-bottom: 6px;
}
.arc-card__legend {
  display: flex;
  gap: 14px;
  flex-wrap: wrap;
}
.arc-card__legend-item {
  font-size: .8rem;
  letter-spacing: 0.01em;
  text-transform: none;
  font-weight: 600;
  color: var(--text-muted, #666);
  display: inline-flex;
  align-items: center;
  gap: 6px;
}
.arc-card__legend-item::before {
  content: "";
  display: inline-block;
  width: 14px;
  height: 2px;
  background: var(--legend-color, #111);
  border-radius: 1px;
}
.arc-card__legend-item--quality::before { height: 2.5px; }
.arc-card__legend-item--ap::before {
  background: #6b7280;
  border-top: 1.5px dotted #6b7280;
  background-color: transparent;
  height: 0;
}
.arc-card__legend-item--cfp::before {
  background: #d97706;
  width: 2px;
  height: 14px;
}
.arc-card__chart {
  width: 100%;
  height: 180px;
  display: block;
}
.arc-chart__grid { stroke: #e5e7eb; stroke-width: 1; }
.arc-chart__quality {
  fill: none;
  stroke-width: 2.5;
  stroke-linejoin: round;
  stroke-linecap: round;
  opacity: 0.95;
}
.arc-chart__ap {
  fill: none;
  stroke: #6b7280;
  stroke-width: 1.3;
  stroke-dasharray: 3 3;
  stroke-linejoin: round;
  opacity: 0.7;
}
.arc-chart__ap-dot {
  fill: #6b7280;
  opacity: 0.85;
}
.arc-chart__cfp {
  stroke: #d97706;
  stroke-width: 1;
  stroke-dasharray: 2 2;
  opacity: 0.55;
}
.arc-chart__cfp--title {
  stroke-width: 1.4;
  stroke-dasharray: none;
  opacity: 0.75;
}
.arc-chart__cfp-dot {
  fill: #d97706;
  stroke: #fff;
  stroke-width: 1;
}
.arc-chart__cfp-eyebrow {
  fill: #b45309;
  font-size: 12px;
  font-family: var(--font-sans, system-ui);
  font-weight: 600;
  letter-spacing: 0.01em;
}
.arc-chart__cfp-label {
  fill: #d97706;
  font-size: 12px;
  font-family: var(--font-sans, system-ui);
  font-weight: 600;
}
.arc-chart__cfp-label--won {
  font-weight: 700;
  fill: #b45309;
}
.arc-chart__xlabel {
  fill: #9ca3af;
  font-size: 12px;
  font-family: var(--font-sans, system-ui);
  font-weight: 500;
}
.arc-chart__xlabel--now {
  fill: var(--ink, #222);
  font-weight: 600;
  letter-spacing: 0.01em;
}
.arc-chart__ribbon-band {
  /* fill + opacity set inline per-band */
}
/* Regime names sit inside a faint ink band, so they are dark text on a near-
   white tint -- no halo stroke or shadow needed. */
.arc-chart__ribbon-label {
  fill: var(--ink-2, #45453f);
  font-size: 12px;
  font-family: var(--font-sans, system-ui);
  font-weight: 600;
  letter-spacing: 0.01em;
}
.arc-chart__annotation {
  font-family: Archivo, Helvetica Neue, Arial, sans-serif;

  font-size: 12px;
  /* fill set inline per annotation */
}
.arc-chart__annot-leader {
  stroke-width: 0.75;
  stroke-dasharray: 2 1.5;
  opacity: 0.7;
  fill: none;
}

/* ---------- Chapter bricks ---------- */
.arc-card__chapters {
  padding: 16px 0;
  border-bottom: 1px solid var(--line-subtle, #eee);
}
.arc-card__chapter-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(74px, 1fr));
  gap: 8px;
  margin-top: 10px;
}
.season-brick {
  display: flex;
  flex-direction: column;
  gap: 2px;
  padding: 10px 8px 8px 8px;
  border: 1px solid var(--line-subtle, #ddd);
  border-radius: var(--radius-sm, 2px);
  text-decoration: none;
  color: inherit;
  text-align: center;
  background: #fff;
  transition: opacity 0.1s ease-in;
  position: relative;
}
.season-brick:hover {
  opacity: 0.8;
}
.season-brick__year {
  font-family: Archivo, Helvetica Neue, Arial, sans-serif;
  font-size: 0.95rem;
  color: var(--text-primary, #111);
  font-variant-numeric: tabular-nums;
}
.season-brick__record {
  font-size: .8rem;
  color: var(--text-muted, #555);
  font-variant-numeric: tabular-nums;
  letter-spacing: 0.01em;
}
.season-brick__badge {
  position: absolute;
  top: 4px;
  right: 6px;
  font-size: .8rem;
  color: #d97706;
  line-height: 1;
}

.season-brick--winning   { background: rgba(15, 23, 42, 0.04); border-color: rgba(15, 23, 42, 0.2); }
.season-brick--peak      { background: rgba(217, 119, 6, 0.12); border-color: rgba(217, 119, 6, 0.45); }
.season-brick--title-era { background: rgba(217, 119, 6, 0.22); border-color: rgba(217, 119, 6, 0.7); }
.season-brick--title-era .season-brick__year { font-weight: 600; }
.season-brick--crisis    { background: rgba(220, 38, 38, 0.1); border-color: rgba(220, 38, 38, 0.35); }
.season-brick--current   { background: transparent; border: 1.5px solid var(--text-primary, #111); }
.season-brick--baseline  { background: #fff; }
.season-brick--data-gap {
  background: repeating-linear-gradient(45deg, #fafafa, #fafafa 4px, #eee 4px, #eee 8px);
  border-color: #ddd;
  color: var(--text-muted, #999);
}
.season-brick--partial-data {
  background: #fff;
  border-color: var(--line-subtle, #d8d8d8);
}
.season-brick--partial-data .season-brick__record,
.season-brick--is-partial .season-brick__record {
  /* Phase 9 a11y: WCAG AA — was #aaa (2.32:1 fail on #fff) */
  color: #707070;
}
.season-brick--partial-data .season-brick__year {
  /* Phase 9 a11y: WCAG AA — was #777 (4.48:1 borderline) */
  color: var(--text-muted, #595959);
}

/* ---------- Closing + peer footer ---------- */
.arc-card__closing {
  padding: 16px 0 4px 0;
}
.arc-card__closing-text {
  font-family: Archivo, Helvetica Neue, Arial, sans-serif;
  font-size: 1.05rem;
  line-height: 1.55;
  color: var(--text-primary, #222);
  margin: 0 0 14px 0;
  max-width: 72ch;
}
.arc-card__peer-footer {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 10px;
  margin: 10px 0 0 0;
  padding-top: 12px;
  border-top: 1px dashed var(--line-subtle, #eee);
}
.arc-card__peer-footer > div { display: flex; flex-direction: column; gap: 2px; }
.arc-card__peer-footer dt {
  font-size: 12.5px;
  letter-spacing: 0.01em;
  text-transform: none;
  color: var(--text-muted, #686862);
  font-weight: 700;
  margin: 0;
}
.arc-card__peer-footer dd {
  font-family: Archivo, Helvetica Neue, Arial, sans-serif;
  font-size: 1.15rem;
  color: var(--text-primary, #111);
  margin: 0;
  font-variant-numeric: tabular-nums;
}

/* ---------- Responsive ---------- */
@media (max-width: 720px) {
  .arc-card { padding: 14px 16px; }
  .arc-card__meta-strip { grid-template-columns: repeat(2, 1fr); }
  .arc-card__meta-value { font-size: 1.2rem; }
  .arc-card__peer-footer { grid-template-columns: 1fr; }
}

/* Phones: the drawing keeps its own size and scrolls, starting at the latest seasons, instead of
 shrinking to half so its labels print at 4px (2026-10-16 audit). */
.arc-card__chart-hint{display:none}
@media(max-width:600px){
  .arc-card__chart-scroll{overflow-x:auto;direction:rtl;-webkit-overflow-scrolling:touch}
  .arc-card__chart-scroll .arc-card__chart{min-width:640px;height:210px;direction:ltr}
  .arc-card__chart-hint{display:block;margin:4px 0 0;font:500 12px/1.3 Archivo,sans-serif;color:#686862}
}

/* Rituals strip (Sprint v5-8.5)
 * -------------------------------------------------------------------------
 * Live-site styles for the rituals strip rendered by
 * `cfb_rankings.team_pages.rituals_module`. Class names match the locked
 * mockup_02_team_alabama_v2.html structure so the renderer output is a
 * drop-in. Mockup tokens are mapped to the live team-pages token system:
 *   --color-surface-card → var(--bg-card)
 *   --color-line          → var(--stroke-default)
 *   --color-text-muted    → var(--fg-muted)
 *   --color-ink           → var(--fg-primary)
 *   --color-accent-primary → not mapped: DESIGN.md (2026-09-28) keeps team
 *                            colour in the logo only
 *   --font-ui             → var(--font-body)
 *   --font-tabular        → var(--font-mono)
 */

.rituals.program-section {
  margin: var(--sp-9) 0 var(--sp-7);
}

.rituals .program-section__head {
  margin-bottom: var(--sp-5);
}

.rituals .section-title {
  display: flex;
  align-items: center;
  gap: var(--sp-4);
  font-family: var(--font-display);
  font-size: var(--fs-headline-sm);
  font-weight: 600;
  letter-spacing: normal;
  color: var(--fg-primary);
  margin: 0 0 var(--sp-2);
}

.rituals .section-title__rule {
  flex: 1;
  height: 1px;
  background: var(--stroke-default);
}

.rituals .caption {
  font-family: Archivo,Helvetica Neue,Arial,sans-serif;
  font-size: var(--fs-serif-body);
  color: var(--fg-secondary);
  line-height: var(--lh-snug);
  margin: 0;
}

.rituals.program-section {
  overflow-x: clip;
}

.rituals-track {
  display: flex;
  gap: var(--sp-4);
  max-width: 100%;
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  padding-bottom: var(--sp-3);
  -webkit-overflow-scrolling: touch;
}

@media (min-width: 1024px) {
  .rituals-track {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: var(--sp-4);
    overflow: visible;
  }
}

.ritual-card {
  flex: 0 0 140px;
  scroll-snap-align: start;
  background: var(--bg-card);
  border: 1px solid var(--stroke-default);
  border-radius: var(--radius-md);
  padding: var(--sp-4);
  display: flex;
  flex-direction: column;
  gap: var(--sp-2);
  min-height: 180px;
}

@media (min-width: 1024px) {
  .ritual-card { flex: 1; }
}

.ritual-card__glyph {
  width: 100%;
  aspect-ratio: 1 / 1;
  background: #ffffff;border:1px solid #e7e7e2;
  border-radius: var(--radius-sm);
  display: grid;
  place-items: center;
  font-family: var(--font-display);
  font-size: 30px;
  color: var(--fg-primary, #222222);
  letter-spacing: 0.01em;
  text-align: center;
  line-height: 1;
  box-shadow: none;
}

.ritual-card__glyph small {
  display: block;
  font-family: var(--font-body);
  font-size: 12px;
  letter-spacing: 0.01em;
  color: var(--fg-muted, #8b8b8b);
  margin-top: 4px;
  font-weight: 600;
  text-transform: none;
}

.ritual-card__name {
  font-family: var(--font-serif);
  font-size: var(--fs-body);
  font-weight: 800;
  line-height: 1.25;
  color: var(--fg-primary);
  margin: 0;
}

.ritual-card__since {
  font-family: var(--font-mono);
  font-size: var(--fs-label);
  font-variant-numeric: tabular-nums;
  color: var(--fg-muted);
  letter-spacing: 0.01em;
  margin: 0;
}

/* Screen-reader-only fallback for a ritual with no description text (the
 * <details> disclosure below is the normal path once a description exists). */
.ritual-card__description.visually-hidden {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

/* Tap-to-reveal for the ritual's full description. Keeps the card's default
 * compact height (the mockup's own constraint) while making the writing
 * underneath -- often the best copy on the page -- actually reachable by a
 * sighted visitor instead of shipping it screen-reader-only forever. Native
 * <details>/<summary> keeps the same content available to AT either way.
 * Caught 2026-09-10 auditing Toledo. */
.ritual-card__details {
  margin-top: 2px;
}

.ritual-card__more {
  cursor: pointer;
  font-family: var(--font-body);
  font-size: 12px;
  font-weight: 600;
  color: var(--fg-muted);
  list-style: none;
  text-decoration: underline;
  text-underline-offset: 2px;
}

.ritual-card__more::-webkit-details-marker {
  display: none;
}

.ritual-card__details[open] .ritual-card__more {
  color: var(--fg-secondary);
}

.ritual-card__description {
  margin: 6px 0 0;
  font-family: var(--font-body);
  font-size: var(--fs-label);
  line-height: var(--lh-normal, 1.5);
  color: var(--fg-secondary);
}

/* Cultural anchors (renderer-only; rendered when profile YAML carries
 * `cultural_anchors.one_sentence`). Positioned as a quiet sidebar block
 * below the rituals strip in the page flow. */
.cultural-anchors {
  margin: var(--sp-6) 0 var(--sp-8);
  padding: var(--sp-5) var(--sp-6);
  background: var(--bg-card);
  border: 1px solid var(--stroke-default);
  border-radius: var(--radius-md);
}

.cultural-anchors__eyebrow {
  font-size: var(--fs-label);
  font-weight: 700;
  letter-spacing: 0.01em;
  color: var(--fg-muted);
  margin: 0 0 var(--sp-2);
}

.cultural-anchors__one-sentence {
  font-family: Archivo,Helvetica Neue,Arial,sans-serif;
  font-size: var(--fs-body-lg);
  line-height: var(--lh-snug);
  color: var(--fg-primary);
  margin: 0 0 var(--sp-4);
}

.cultural-anchors__archetypes {
  display: grid;
  gap: var(--sp-2) var(--sp-5);
  grid-template-columns: max-content 1fr;
  margin: 0 0 var(--sp-3);
  font-size: var(--fs-body);
}

.cultural-anchors__archetypes dt {
  font-family: var(--font-body);
  font-size: var(--fs-label);
  font-weight: 600;
  letter-spacing: var(--ls-label);
  text-transform: none;
  color: var(--fg-muted);
  align-self: center;
}

.cultural-anchors__archetypes dd {
  margin: 0;
  font-family: var(--font-body);
  color: var(--fg-primary);
}

.cultural-anchors__if-lost {
  margin: var(--sp-3) 0 0;
  font-family: var(--font-body);
  font-size: var(--fs-body);
  color: var(--fg-secondary);
  line-height: var(--lh-normal);
}

.cultural-anchors__if-lost strong {
  font-weight: 600;
  color: var(--fg-primary);
  margin-right: 0.4em;
}

/* Visual identity line — helmet stripe · colour combo as plain words
 * (DESIGN.md 2026-09-28: labels are words, not boxes). */
.vi-chip {
  display: inline-flex;
  flex-wrap: wrap;
  gap: var(--sp-2) var(--sp-3);
  align-items: center;
  font-family: var(--font-body);
  font-size: var(--fs-label);
  color: var(--fg-muted);
  letter-spacing: var(--ls-wide);
  text-transform: none;
}

.vi-chip__helmet,
.vi-chip__colors {
  font-weight: 500;
}


/* Division III Playoff Path — conference race + CFB Index (doc 78) */
.d3pp{margin:34px 0;padding:0}
.d3pp-headline{font-family:var(--font-serif,'Archivo Head','Archivo','Helvetica Neue',Arial,sans-serif);font-weight:800;
  font-size:clamp(20px,2.4vw,27px);line-height:1.25;margin:0 0 18px;color:var(--fg-strong,#222222)}
.d3pp-grid{display:grid;grid-template-columns:1.25fr 1fr;gap:22px}
@media (max-width:720px){.d3pp-grid{grid-template-columns:1fr}}
.d3pp-cap{font-family:var(--font-mono,monospace);font-size:12px;letter-spacing:.01em;color:var(--fg-muted,#8b8b8b);
  text-transform:none;margin-bottom:6px}
.d3pp-table{width:100%;border-collapse:collapse;font-size:14px}
.d3pp-table th{font-family:var(--font-mono,monospace);font-size:12px;letter-spacing:.01em;text-transform:none;
  color:var(--fg-muted,#8b8b8b);text-align:left;padding:4px 8px;border-bottom:1px solid var(--rule,#2a3142)}
.d3pp-table td{padding:6px 8px;border-bottom:1px solid var(--rule-faint,#1c2230);color:var(--fg,#222222);
  font-variant-numeric:tabular-nums}
.d3pp-pl{color:var(--fg-muted,#8b8b8b);width:1.5em}
.d3pp-tm{font-weight:600;color:var(--fg-strong,#222222)}
.d3pp-row--me td{background:var(--row,#f7f7f6)}
.d3pp-row--me .d3pp-tm{color:var(--fg-strong,#222222)}
/* Index facts read as one list ("57.3 CFB Zeitgeist · #12 of 250 D3 · ..."),
   not a row of boxes (DESIGN.md: labels are words). */
.d3pp-chips{display:flex;flex-wrap:wrap;gap:4px 0;margin-bottom:14px}
.d3pp-chip{font-family:var(--font-mono,monospace);font-size:12.5px;color:var(--fg,#222222)}
.d3pp-chip + .d3pp-chip::before{content:"·";margin:0 7px;color:#8b8b85}
.d3pp-chip b{color:var(--fg-strong,#222222)}
.d3pp-explainer{font-family:Archivo,Helvetica Neue,Arial,sans-serif;font-size:15px;line-height:1.5;
  color:var(--fg,#222222);margin:0 0 12px}
.d3pp-explainer b{color:var(--fg-strong,#222222)}
.d3pp-receipt{font-family:var(--font-mono,monospace);font-size:12px;color:var(--fg-muted,#8b8b8b);line-height:1.4}

/* The Season — game-by-game margin chart */
.d3s{margin:30px 0}
.d3s-eyebrow{font-family:var(--font-mono,'IBM Plex Mono',monospace);font-size:12.5px;letter-spacing:.01em;
  font-weight:700;color:var(--fg-muted,#686862);text-transform:none;margin-bottom:10px}
.d3s-chart{max-width:760px}
.d3s-svg{display:block}
.d3s-zero{stroke:var(--rule,#2a3142);stroke-width:1.5}
.d3s-bar rect{transition:opacity .1s ease-in}
.d3s-bar:hover rect{opacity:.78}
.d3s-win{fill:var(--green,#3a7a4b)}
.d3s-loss{fill:var(--red,#bf3b31)}
.d3s-mg{font-family:var(--font-mono,monospace);font-size:12px;fill:var(--fg-muted,#8b8b8b)}
.d3s-op{font-family:var(--font-mono,monospace);font-size:12px;fill:var(--fg-muted,#8b8b8b)}
.d3s-summary{font-family:Archivo,Helvetica Neue,Arial,sans-serif;font-size:14px;line-height:1.5;
  color:var(--fg,#222222);margin:12px 0 0}

/* The Rivalry -- a plain framed card; the kicker is the matchup (a fact the
   rivalry's name can't carry). No team-colour stripe (DESIGN.md 2026-09-28). */
.d3r{margin:30px 0;padding:20px 22px;border:1px solid var(--line,#e7e7e2);
  background:var(--bg-card,#fff);border-radius:3px}
.d3r-eyebrow{font-family:var(--font-mono,'IBM Plex Mono',monospace);font-size:12.5px;letter-spacing:.01em;
  font-weight:700;color:var(--fg-muted,#686862);text-transform:none;margin-bottom:6px}
.d3r-name{font-family:var(--font-serif,'Archivo Head','Archivo','Helvetica Neue',Arial,sans-serif);font-weight:800;
  font-size:clamp(20px,2.3vw,26px);line-height:1.2;margin:0 0 10px;color:var(--fg-strong,#222222)}
.d3r-allt{font-family:Archivo,Helvetica Neue,Arial,sans-serif;font-size:16px;line-height:1.45;font-weight:600;
  color:var(--fg-strong,#222222);margin:0 0 8px}
.d3r-since,.d3r-recent{font-family:Archivo,Helvetica Neue,Arial,sans-serif;font-size:14px;line-height:1.5;
  color:var(--fg,#222222);margin:0 0 6px}

/* Hero Arc 13-brick CFP-era stripe — Sprint E (Brief §20) */

/* Hero Arc Stripe — TEAM_PAGE_WORLD_CLASS_BRIEF §20, v1.0 CFP era */

.hero-arc-stripe {
  --has-cfp:        var(--accolade-gold);
  --brick-empty:    color-mix(in oklab, var(--bg-card-raised) 80%, var(--bg-card));
  --label-fg:       var(--fg-secondary);

  display: grid;
  gap: var(--sp-3, 12px);
  padding: clamp(16px, 2.2vw, 28px) clamp(16px, 2.6vw, 32px);
  background: #ffffff;
  border: 1px solid var(--stroke-default);
  border-radius: var(--radius-lg, 3px);
  margin-bottom: clamp(20px, 3vw, 32px);
}

.hero-arc-stripe__header {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  justify-content: space-between;
  gap: 8px 24px;
}
.hero-arc-stripe__title {
  font-family: var(--font-display);
  font-size: clamp(20px, 1.5vw + 10px, 28px);
  font-weight: 400;
  line-height: 1;
  letter-spacing: 0.01em;
  text-transform: none;
  color: var(--fg-primary);
  margin: 0;
}
.hero-arc-stripe__sub {
  font-family: var(--font-sans);
  font-size: 12.5px;
  font-weight: 700;
  letter-spacing: 0.01em;
  text-transform: none;
  color: var(--fg-muted);
  margin: 0;
}

.hero-arc-stripe__bricks {
  display: grid;
  grid-auto-flow: column;
  grid-auto-columns: minmax(0, 1fr);
  align-items: end;
  gap: 6px;
  height: 96px;
  padding: 4px 0;
}

.hero-arc-stripe__brick {
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  align-items: stretch;
  min-width: 0;
  height: 100%;
  cursor: default;
}
.hero-arc-stripe__bar {
  display: block;
  width: 100%;
  border-radius: 2px 2px 0 0;
  background: var(--brick-color, var(--brick-empty));
  border: 1px solid color-mix(in oklab, var(--brick-color, var(--brick-empty)) 60%, transparent);
  min-height: 16px;
  transition: opacity .1s ease-in;
}
.hero-arc-stripe__brick--cfp .hero-arc-stripe__bar {
  border: 2px solid var(--has-cfp);
}
.hero-arc-stripe__brick--current .hero-arc-stripe__bar {
  outline: 2px solid var(--ink, #222);
  outline-offset: 2px;
}
.hero-arc-stripe__brick:hover .hero-arc-stripe__bar {
  opacity: .8;
}

.hero-arc-stripe__brick-label {
  font-family: var(--font-mono);
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.01em;
  color: var(--fg-muted);
  text-align: center;
  margin-top: 4px;
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}
.hero-arc-stripe__brick--cfp .hero-arc-stripe__brick-label {
  /* Gold's text shade: the mark gold is below the text contrast floor. */
  color: var(--gold-text, #8a6200);
}

.hero-arc-stripe__legend {
  display: flex;
  flex-wrap: wrap;
  gap: 4px 18px;
  font-family: var(--font-sans);
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.01em;
  text-transform: none;
  color: var(--fg-muted);
  margin: 0;
}
.hero-arc-stripe__legend-dot {
  display: inline-block;
  width: 8px;
  height: 8px;
  border-radius: 2px;
  margin-right: 6px;
  vertical-align: middle;
}
.hero-arc-stripe__legend-dot--high { background: var(--pct-high); }
.hero-arc-stripe__legend-dot--mid  { background: var(--pct-mid); }
.hero-arc-stripe__legend-dot--low  { background: var(--pct-low); }
.hero-arc-stripe__legend-dot--cfp  {
  background: transparent;
  border: 2px solid var(--has-cfp);
  width: 10px; height: 10px;
}

@media (max-width: 540px) {
  .hero-arc-stripe__bricks { height: 72px; gap: 4px; }
  .hero-arc-stripe__brick-label { font-size: 12px; }
  .hero-arc-stripe__title { font-size: 20px; }
}


/* Season Standing Rail — Brief §3.1 (team-page analog) */

/* Season Standing Rail — Brief §3.1
 *
 * Visual sibling of the player Standing Rail. The current-rung marker is
 * ink: team colour appears only in the logo on web pages (DESIGN.md,
 * 2026-09-28); it used to read --accent-primary / --accent-secondary.
 */

.season-standing-rail {
  --rail-track:        rgba(34, 34, 34, 0.08);
  --rail-tick:         rgba(34, 34, 34, 0.18);
  --rail-marker:       var(--ink, #222222);
  --rail-marker-soft:  #8b8b85;
  --rail-ghost:        rgba(34, 34, 34, 0.22);
  --rail-tier-bg:      rgba(34, 34, 34, 0.03);
  --rail-champion:     #b7851a;

  display: grid;
  gap: clamp(12px, 1.5vw, 18px);
  padding: clamp(18px, 2.4vw, 28px) clamp(18px, 2.6vw, 32px);
  background: var(--bg-card, #ffffff);
  border: 1px solid var(--stroke-default, var(--rail-tick));
  border-radius: 3px;
  margin-bottom: clamp(20px, 3vw, 32px);
  font-variant-numeric: tabular-nums;
}

.season-standing-rail__header {
  display: grid;
  gap: 6px;
}
.season-standing-rail__eyebrow {
  font-family: var(--font-sans, system-ui, sans-serif);
  font-size: 12.5px;
  font-weight: 700;
  letter-spacing: 0.01em;
  text-transform: none;
  color: var(--fg-muted);
  margin: 0;
}
.season-standing-rail__rung-name {
  font-family: var(--font-display, 'Archivo', system-ui, sans-serif);
  font-size: var(--fs-headline, clamp(22px, 1.8vw + 14px, 30px));
  font-weight: 600;
  line-height: 1.2;
  letter-spacing: -0.005em;
  text-transform: none;
  color: var(--fg-primary);
  margin: 0;
  max-width: 48ch;
}
.season-standing-rail__rung-narrative {
  font-family: 'Archivo', 'Helvetica Neue', Arial, sans-serif;
  font-size: clamp(14px, 0.4vw + 13px, 17px);
  
  line-height: 1.45;
  color: var(--fg-secondary);
  margin: 0;
  max-width: 64ch;
}

/* === The rail itself: 10 ticks === */

.season-standing-rail__rail {
  position: relative;
  display: grid;
  grid-template-columns: repeat(10, 1fr);
  align-items: center;
  height: 56px;
  padding: 0 6px;
}
.season-standing-rail__rail::before {
  content: "";
  position: absolute;
  top: 50%;
  left: 0;
  right: 0;
  height: 4px;
  background: var(--rail-track);
  border-radius: 2px;
  transform: translateY(-50%);
}
.season-standing-rail__tick {
  position: relative;
  height: 12px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.season-standing-rail__tick::before {
  content: "";
  width: 2px;
  height: 12px;
  background: var(--rail-tick);
  border-radius: 1px;
}
.season-standing-rail__tick[data-current="true"]::before {
  width: 18px;
  height: 28px;
  background: var(--rail-marker);
  border-radius: 2px;
  box-shadow: none;
}
.season-standing-rail__tick[data-ghost="true"]::before {
  width: 8px;
  height: 18px;
  background: var(--rail-ghost);
  border-radius: 3px;
}
/* Championship rung (R9) — accolade gold even when not current. */
.season-standing-rail__tick[data-rung="9"]::before {
  background: var(--rail-champion);
  width: 4px;
  height: 16px;
}
.season-standing-rail__tick[data-rung="9"][data-current="true"]::before {
  background: var(--rail-champion);
  box-shadow: none;
}
.season-standing-rail__rung-num {
  position: absolute;
  bottom: -22px;
  font-family: var(--font-sans, system-ui, sans-serif);
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.01em;
  color: var(--fg-primary);
  white-space: nowrap;
}
.season-standing-rail__rung-num--ghost {
  font-weight: 500;
  color: var(--fg-muted);
}
.season-standing-rail__tick[data-rung="0"] .season-standing-rail__rung-num { left: 0; }
.season-standing-rail__tick[data-rung="9"] .season-standing-rail__rung-num { right: 0; }

/* === Tier row: the six tier names as words, the current one in bold ink.
   It used to be a row of boxes with the current one filled solid, which
   read as a control nobody could press (DESIGN.md: labels are words). === */

.season-standing-rail__tiers {
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  gap: 4px;
}
.season-standing-rail__tier {
  font-family: var(--font-sans, system-ui, sans-serif);
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.01em;
  text-transform: none;
  text-align: center;
  padding: 4px 2px;
  color: var(--fg-muted);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.season-standing-rail__tier[data-current="true"] {
  color: var(--fg-primary, #222222);
  font-weight: 800;
}

@media (max-width: 640px) {
  .season-standing-rail__tiers {
    grid-template-columns: repeat(3, 1fr);
  }
  .season-standing-rail__rung-name { font-size: 26px; }
}

/* Empty state — drawn when compute_season_rung returns None */
.season-standing-rail--empty {
  display: grid;
  gap: 4px;
  padding: 16px 18px;
  background: var(--bg-card, #ffffff);
  border: 1px dashed var(--rail-tick);
  border-radius: 3px;
  margin-bottom: clamp(20px, 3vw, 32px);
}
.season-standing-rail--empty p {
  margin: 0;
  font-family: 'Archivo', 'Helvetica Neue', Arial, sans-serif;
  
  color: var(--fg-muted);
  font-size: 14px;
}


/* Program Prestige Bar — Brief §3.2 */

/* Program Prestige Bar — Brief §3.2
 *
 * Sibling of the Season Standing rail. DESIGN.md (2026-09-28): the current
 * tier is marked in ink, not the program's brand colour (team colour lives
 * in the logo only).
 */

.program-prestige-bar {
  --pp-track:        rgba(34, 34, 34, 0.08);
  --pp-tier-bg:      rgba(34, 34, 34, 0.02);
  --pp-marker:       var(--ink, #222);
  --pp-marker-soft:  var(--ink, #222);
  --pp-ghost:        rgba(34, 34, 34, 0.22);

  display: grid;
  gap: clamp(12px, 1.5vw, 18px);
  padding: clamp(18px, 2.4vw, 28px) clamp(18px, 2.6vw, 32px);
  background: var(--bg-card, #fff);
  border: 1px solid var(--stroke-default, var(--pp-track));
  border-radius: 3px;
  margin-bottom: clamp(20px, 3vw, 32px);
}

.program-prestige-bar__header {
  display: grid;
  gap: 6px;
}
.program-prestige-bar__eyebrow {
  font-family: var(--font-sans, system-ui, sans-serif);
  font-size: 12.5px;
  font-weight: 700;
  letter-spacing: 0.01em;
  text-transform: none;
  color: var(--fg-muted);
  margin: 0;
}
.program-prestige-bar__tier-name {
  font-family: var(--font-display, 'Archivo', system-ui, sans-serif);
  font-size: clamp(32px, 3vw + 14px, 56px);
  font-weight: 400;
  line-height: 1;
  letter-spacing: 0.01em;
  text-transform: none;
  color: var(--fg-primary);
  margin: 0;
}
.program-prestige-bar__narrative {
  font-family: 'Archivo', 'Helvetica Neue', Arial, sans-serif;
  font-size: clamp(14px, 0.4vw + 13px, 17px);
  
  line-height: 1.45;
  color: var(--fg-secondary);
  margin: 0;
  max-width: 64ch;
}
.program-prestige-bar__peak {
  font-family: var(--font-sans, system-ui, sans-serif);
  font-size: 13px;
  color: var(--fg-secondary);
  margin: 0;
}
.program-prestige-bar__peak strong {
  color: var(--fg-primary);
  font-weight: 700;
}

/* === Tier-bar: 7 segments === */

.program-prestige-bar__bar {
  display: grid;
  grid-template-columns: repeat(7, 1fr);
  gap: 4px;
  padding: 5px;
  background: var(--pp-tier-bg);
  border-radius: 3px;
  border: 1px solid var(--pp-track);
}
.program-prestige-bar__segment {
  position: relative;
  font-family: var(--font-sans, system-ui, sans-serif);
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.01em;
  text-transform: none;
  text-align: center;
  padding: 12px 6px 26px 6px;
  color: var(--fg-muted);
  background: transparent;
  border-radius: 3px;
  border: 1px solid transparent;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  min-height: 56px;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: center;
  gap: 4px;
}
.program-prestige-bar__segment-num {
  font-family: var(--font-sans, system-ui, sans-serif);
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.01em;
  color: var(--fg-muted);
  opacity: 0.6;
}
.program-prestige-bar__segment[data-current="true"] {
  background: var(--pp-marker);
  color: #ffffff;
  border-color: var(--pp-marker);
}
.program-prestige-bar__segment[data-current="true"] .program-prestige-bar__segment-num {
  color: rgba(255, 255, 255, 0.75);
  opacity: 1;
}
.program-prestige-bar__segment[data-peak="true"]:not([data-current="true"]) {
  background: color-mix(in oklab, var(--pp-marker) 8%, transparent);
  border-color: color-mix(in oklab, var(--pp-marker) 40%, transparent);
  color: var(--fg-primary);
}
.program-prestige-bar__segment[data-peak="true"]:not([data-current="true"])::after {
  content: "Peak";
  position: absolute;
  bottom: 4px;
  left: 50%;
  transform: translateX(-50%);
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0.01em;
  color: var(--pp-marker);
}

@media (max-width: 640px) {
  .program-prestige-bar__tier-name { font-size: 32px; }
  .program-prestige-bar__bar {
    grid-template-columns: repeat(4, 1fr);
    grid-auto-rows: auto;
  }
}

.program-prestige-bar--empty {
  display: none; /* every team renders the bar; only override fully missing */
}


.stature-chip{--sc-muted:#686862;text-decoration:none;font-family:Archivo,system-ui,sans-serif}
.sc-inline,.sc-micro,.sc-standard{display:inline-flex;align-items:center;gap:6px;vertical-align:middle}
.sc-tick{display:inline-block;width:8px;height:8px;border-radius:50%;flex:none}
.sc-band{font-size:12.5px;font-weight:700;color:var(--ink,#222222)}
.sc-rank{font-size:11.5px;color:var(--sc-muted);font-variant-numeric:tabular-nums;font-weight:600}
.sc-traj{font-size:11px;color:var(--sc-muted)}
.sc-hero{display:inline-flex;gap:12px;align-items:stretch}
.sc-ladder{display:flex;flex-direction:column;gap:1.5px;justify-content:center;width:15px}
.sc-lt{height:2px;background:rgba(28,28,26,.13);border-radius:1px}
.sc-hbody{display:flex;flex-direction:column;gap:2px;justify-content:center}
.sc-eyebrow{font-size:12px;font-weight:700;color:var(--sc-muted)}
.sc-hband{font-family:Archivo,Helvetica Neue,Arial,sans-serif;font-size:21px;font-weight:600;line-height:1}
.sc-hmeta{display:flex;gap:10px;align-items:baseline;font-size:12px;color:var(--sc-muted);font-variant-numeric:tabular-nums}
.sc-at{font-weight:700;color:#1c1c1a}
.sc-note{font-size:12px;color:var(--sc-muted);margin-top:1px}
.sc-held{color:var(--ink,#222222);font-weight:600}
.sc-swing{font-size:11px;font-weight:700;white-space:nowrap;cursor:help}
.sc-swing-w{font-weight:600;letter-spacing:.005em}
.sc-note.sc-swing{font-size:13px;font-weight:700;line-height:1.4;white-space:normal;cursor:default;margin:3px 0 5px}
.sc-swingcard{border:1px solid rgba(34,34,34,.1);border-radius:3px;padding:14px 16px 12px;margin:12px 0;font-family:Archivo,system-ui,sans-serif;background:var(--page,#fff)}
.sc-swingcard-h{font-size:13px;font-weight:700;color:var(--sc-muted,#686862);margin-bottom:8px}
.sc-swingcard-claim{font-size:15px;font-weight:800;line-height:1.3;margin-bottom:5px}
.sc-swingcard-sum{font-size:13px;line-height:1.5;color:#3a3a36;margin-bottom:9px}
.sc-swingcard-link{font-size:12px;font-weight:600;color:#1c1c1a;text-decoration:underline;text-underline-offset:2px}


/* External Ratings / Model Consensus — surfaces SP+/FPI/Elo/SRS vs CFB Index */

/* DESIGN.md (2026-09-28): white, not tinted; no "Model Consensus" eyebrow
   over the heading (it only named the category); sentence-case heading;
   labels carry no tracking. */
.external-ratings {
  display: grid;
  gap: clamp(10px, 1.4vw, 14px);
  padding: clamp(14px, 1.8vw, 20px) clamp(16px, 2vw, 24px);
  background: var(--page, #ffffff);
  border: 1px solid var(--stroke-subtle, rgba(34, 34, 34, 0.08));
  border-radius: 3px;
  margin-bottom: clamp(20px, 3vw, 32px);
}
.external-ratings__title {
  font-family: var(--font-display, 'Archivo', system-ui, sans-serif);
  font-size: var(--fs-headline-sm, clamp(18px, 1.2vw + 12px, 22px)); font-weight: 600; line-height: 1.2;
  letter-spacing: normal; text-transform: none;
  color: var(--fg-primary, #222222); margin: 2px 0 0;
}
.external-ratings__grid {
  display: grid; gap: 10px;
  grid-template-columns: repeat(auto-fit, minmax(116px, 1fr));
}
.external-ratings__card {
  display: grid; gap: 4px; padding: 12px 10px; text-align: center;
  background: #ffffff;
  border: 1px solid var(--stroke-subtle, rgba(34, 34, 34, 0.08));
  border-radius: 3px;
}
.external-ratings__card--ours {
  background: #ffffff;
  border-color: var(--blue, #1d68a3);
}
.external-ratings__system {
  font-family: var(--font-sans, system-ui, sans-serif);
  font-size: 12px; font-weight: 600; letter-spacing: 0.01em;
  text-transform: none; color: var(--fg-secondary, #5b5b5b); margin: 0;
}
.external-ratings__rank {
  font-family: var(--font-display, 'Archivo', system-ui, sans-serif);
  font-size: 30px; font-weight: 400; line-height: 1; margin: 2px 0;
  color: var(--fg-primary, #222222); font-variant-numeric: tabular-nums;
}
.external-ratings__card--ours .external-ratings__rank { color: var(--blue, #1d68a3); }
.external-ratings__rating {
  font-family: var(--font-sans, system-ui, sans-serif);
  font-size: 12px; color: var(--fg-muted, #8b8b8b); margin: 0;
  font-variant-numeric: tabular-nums;
}
.external-ratings__note {
  font-family: 'Archivo', 'Helvetica Neue', Arial, sans-serif;
  font-size: 13px; line-height: 1.5; color: var(--fg-secondary, #5b5b5b); margin: 0;
}


/* Identity strip — doc 97 §3a Pass 1, the thin line above the Face-Off */

.idstrip{display:flex;align-items:center;gap:14px;flex-wrap:wrap;
  margin:12px 0 6px;font-family:var(--font-ui,'Archivo',system-ui,sans-serif)}
.tab-glyph{display:none}  /* 14px grey icons beside tab words read as faint specks (2026-10-15 audit) */
.idstrip__logo{width:48px;height:48px;object-fit:contain;flex:none}
.idstrip__name{font-family:var(--font-serif,'Archivo Head','Archivo','Helvetica Neue',Arial,sans-serif);font-weight:800;
  font-size:clamp(22px,3.4vw,30px);color:var(--fg-primary,#222);margin:0;display:inline;
  line-height:1.05;letter-spacing:-.01em}
.idstrip__record{font-size:15px;font-weight:600;color:var(--fg-secondary,#5b5b5b);
  font-variant-numeric:tabular-nums}
.idstrip__qualifier{font-size:12px;color:var(--fg-tertiary,#8b8b8b)}

/* Curated program blurb — doc 97 §3a Pass 1, moved to a History-tab drawer.
   DEAD as of 2026-09-10: nothing emits .history-blurb-drawer any more. The
   module is TIER_SECOND and owns its own inner disclosure (.ctb-more in
   curated_blurb.py). Kept, not deleted, so reverting the promotion is a
   one-line change at the construction site rather than a CSS rewrite. */
.history-blurb-drawer{margin:0 0 1.5rem;border-top:1px solid var(--stroke-default,#e4e4e1);
  padding-top:.6rem}
.history-blurb-drawer__toggle{font:600 .82rem/1 Archivo,sans-serif;color:var(--blue,#1d68a3);
  cursor:pointer;list-style:none;padding:.15rem 0}
.history-blurb-drawer__toggle::-webkit-details-marker{display:none}
.history-blurb-drawer__toggle::after{content:" ↓";font-size:.8rem}
details[open]>.history-blurb-drawer__toggle::after{content:" ↑"}
.history-blurb-drawer__body{margin-top:.85rem}


/* Team hero band — audit 2026-09-01 §5: nation / model / market, this week, the season strip */

/* Team hero band (audit 2026-09-01 §5): facts line, nation/model/market
   triplet, this week, the season strip. DESIGN.md: team colour is logo-only,
   results are a bold green W / red L with the score, labels are sentence
   case, hover is opacity. */
.th{margin:6px 0 14px;font-family:var(--font-ui,'Archivo',system-ui,sans-serif)}
.th__facts{font-size:13px;color:var(--fg-secondary,#5b5b5b);margin:0 0 10px}
.th__conf-link,.th__coach-link{color:inherit;text-decoration:underline;text-decoration-color:var(--stroke-default,#e4e4e1);text-underline-offset:2px;transition:opacity .1s ease-in}
.th__conf-link:hover,.th__coach-link:hover{opacity:.8;text-decoration-color:currentColor}
.th__triplet{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0;border:1px solid var(--stroke-default,#e4e4e1);border-radius:3px;margin:0 0 12px}
.th__cell{display:flex;flex-direction:column;gap:3px;padding:10px 14px;border-left:1px solid var(--stroke-default,#e4e4e1);min-width:0}
.th__cell:first-child{border-left:0}
.th__k{font-size:12px;font-weight:700;letter-spacing:.01em;color:var(--fg-tertiary,#686862)}
.th__v{font-family:var(--font-serif,'Archivo Head','Archivo','Helvetica Neue',Arial,sans-serif);font-size:clamp(18px,2.2vw,24px);font-weight:800;color:var(--fg-primary,#222);line-height:1.1;letter-spacing:-.01em}
.th__s{font-size:12px;color:var(--fg-tertiary,#8b8b8b)}
.th__week{margin:0 0 12px}
.th__line{margin:0 0 6px;font-size:14px;color:var(--fg-secondary,#5b5b5b);line-height:1.45}
/* The label hangs in its own column so a wrapped line stays under its own text, not under the label (reader tests 2026-10-14). */
.th__week .th__line{padding-left:72px;text-indent:-72px}
.th__week .th__kicker{text-indent:0;min-width:62px;width:62px;margin-right:10px}
.th__when{font-weight:600;color:var(--fg-primary,#222)}
.th__line strong{color:var(--fg-primary,#222);font-weight:700}
.th__line strong.is-win{color:var(--green,#3a7a4b)}
.th__line strong.is-loss{color:var(--red,#bf3b31)}
.th__line a{color:var(--fg-primary,#222);text-decoration:none;border-bottom:1px solid var(--stroke-default,#e4e4e1)}
.th__kicker{display:inline-block;font-size:12px;font-weight:700;letter-spacing:.01em;color:var(--fg-tertiary,#686862);margin:0 10px 4px 0;min-width:52px}
.th__season{margin:0 0 6px}
/* The season strip is a form guide: unboxed game cells, a hairline above. */
.th__games{list-style:none;margin:4px 0 0;padding:0;display:flex;flex-wrap:wrap;gap:6px 14px}
.th__g{display:flex;flex-direction:column;gap:1px;min-width:92px;padding:6px 0 4px;border-top:1px solid var(--stroke-default,#e4e4e1);font-size:12px;line-height:1.25}
.th__g-res{font-weight:800;color:var(--fg-primary,#222);font-variant-numeric:tabular-nums}
.th__g.is-win .th__g-res{color:var(--green,#3a7a4b)}
.th__g.is-loss .th__g-res{color:var(--red,#bf3b31)}
.th__g.is-next .th__g-res{color:var(--fg-tertiary,#8b8b8b);font-weight:600}
.th__g-opp{color:var(--fg-secondary,#5b5b5b);text-decoration:none;transition:opacity .1s ease-in}
.th__g-opp:hover{opacity:.8}
.th__g-line{color:var(--fg-tertiary,#8b8b8b);font-size:12px}
.th__updated{font-size:12px;color:var(--fg-tertiary,#8b8b8b);margin:8px 0 0}
@media(max-width:600px){
  .th__triplet{grid-template-columns:1fr}
  .th__cell{border-left:0;border-top:1px solid var(--stroke-default,#e4e4e1)}
  .th__cell:first-child{border-top:0}
  .th__g{min-width:calc(50% - 7px)}
}
.wps{display:block;width:100%;height:auto;overflow:visible}.wps-a{display:block;border-radius:2px}.wps-a:focus-visible{outline:2px solid var(--ink,#222);outline-offset:2px}
.mc__path{margin:12px 0 4px}
.mc__card p.mc__path-h{margin:0 0 2px;font-weight:700;font-size:15px;color:var(--ink,#222)}
.mc__card p.mc__path-sub{margin:0 0 6px;font-size:14px;color:var(--ink-3,#686862)}
.mc__path-sub strong{color:var(--blue,#1d68a3);font-weight:800}
.mc__card p.mc__path-k{margin:4px 0 0;font:500 12px/1.3 var(--font-ui,'Archivo',system-ui,sans-serif);color:var(--ink-3,#686862)}
.mc__cols{list-style:none;margin:6px 0 0;padding:0;display:flex;gap:4px;overflow-x:auto}
.mc__col{flex:1 1 0;min-width:36px;max-width:64px;display:flex;flex-direction:column;align-items:center}
.mc__col-plot{position:relative;display:flex;flex-direction:column;justify-content:flex-end;align-items:center;width:100%;height:calc(var(--mc-h,56px) + 18px)}
.mc__col-plot::before,.mc__col-plot::after{content:"";position:absolute;left:-3px;right:-3px;bottom:calc(var(--mc-h,56px) * .5);border-top:1px dashed var(--ink-3,#8a8a84)}
.mc__col-plot::after{z-index:2;left:0;right:0;border-top-color:#fff}
.mc__col-bar{z-index:1}
.mc__col-line{position:absolute;left:-2px;right:-2px;height:0;border-top:3px solid var(--ink,#222);z-index:4}
.mc__col-p{background:#fff;padding:0 2px;z-index:3;font:700 12px/1.2 var(--font-ui,'Archivo',system-ui,sans-serif);color:var(--ink,#222);margin-bottom:2px;position:relative;font-variant-numeric:tabular-nums}
.mc__col-bar{display:block;width:100%;background:var(--blue,#1d68a3);border-radius:2px 2px 0 0;position:relative}
.mc__col-n{margin-top:4px;font:700 12px/1.2 var(--font-ui,'Archivo',system-ui,sans-serif);color:var(--ink,#222)}
.mc__col-t{min-height:14px;font:500 12px/1.2 var(--font-ui,'Archivo',system-ui,sans-serif);color:var(--ink-3,#686862)}
.mc__series{margin:2px 0 8px}
.mc__ticks{list-style:none;margin:0;padding:0;display:flex;align-items:center;gap:1px;height:26px}
.mc__tick{flex:1 1 0;min-width:1px;background:var(--stroke-default,#c9c9c4);height:6px}
.mc__tick--w{background:var(--win,#3a7a4b);height:22px;align-self:flex-start}
.mc__tick--l{background:var(--loss,#bf3b31);height:22px;align-self:flex-end}
.mc__card p.mc__series-k{display:flex;justify-content:space-between;gap:8px;margin:2px 0 0;font:500 12px/1.3 var(--font-ui,'Archivo',system-ui,sans-serif);color:var(--ink-3,#686862)}
.mc__hist{margin:12px 0 2px}
.mc__card p.mc__hist-h{margin:0 0 2px;font-weight:700;font-size:14px;color:var(--ink,#222)}
.mc__hist svg{display:block;width:100%;height:auto;max-width:360px;font-family:var(--font-ui,'Archivo',system-ui,sans-serif)}
.mc__card p.mc__hist-k{margin:0;font:500 12px/1.3 var(--font-ui,'Archivo',system-ui,sans-serif);color:var(--ink-3,#686862)}
.mc__spark{max-width:320px;margin:8px 0 6px}
.mc__spark svg{display:block;width:100%;height:auto}
.mc__card p.mc__spark-h{margin:0 0 4px;font-weight:700;font-size:15px;color:var(--ink,#222)}
.mc__pins{list-style:none;margin:8px 0 0;padding:0}
.mc__pins li{display:grid;grid-template-columns:14px 28px 1fr;align-items:baseline;gap:0 4px;margin:0 0 4px;font:500 13px/1.35 var(--font-ui,'Archivo',system-ui,sans-serif);color:var(--ink,#222)}
.mc__pin-d{width:9px;height:9px;background:var(--gold,#b7851a);transform:rotate(45deg);align-self:start;margin:5px 0 0 2px}
.mc__pin-q{font-weight:700;color:var(--ink-3,#686862)}
.mc__spark-k{margin:2px 0 0;font:500 12px/1.3 var(--font-ui,'Archivo',system-ui,sans-serif);color:var(--ink-3,#686862)}
.mc{display:grid;grid-template-columns:1fr;gap:12px;margin:0 0 16px}
.mc__card{border:1px solid var(--stroke-default,#e4e4e1);border-radius:3px;padding:12px 14px;min-width:0;background:var(--page,#fff)}
.mc__k{margin:0 0 2px;font:700 12.5px/1.3 var(--font-ui,'Archivo',system-ui,sans-serif);color:var(--ink-3,#686862)}
.mc__h{margin:0 0 6px;font:800 24px/1.1 var(--font-serif,'Archivo Head','Archivo',sans-serif);font-stretch:78%;color:var(--ink,#222)}
.mc__h a{color:inherit;text-decoration:none;display:inline-block;min-height:44px;padding:8px 0;margin:-8px 0}
.mc__h a:hover{opacity:.8}
.mc__card p{margin:0 0 4px;font:400 14px/1.45 var(--font-ui,'Archivo',system-ui,sans-serif);color:var(--fg-secondary,#5b5b5b)}
.mc__when{font-weight:700;font-size:16px;color:var(--ink,#222)}
.mc__model{color:var(--blue,#1d68a3)!important;font-weight:700}
.mc__card p.mc__wx{font-weight:600;color:var(--ink,#222)}
.mc__wx a{color:var(--ink,#222);text-decoration:underline;text-underline-offset:3px}
.mc__line{color:var(--gold-text,#8a6200)!important;font-weight:600}
.mc__result{font-weight:700;font-size:16px;color:var(--ink,#222)}
.mc__result.is-win::first-letter{color:var(--win,#3a7a4b);font-weight:800}
.mc__result.is-loss::first-letter{color:var(--loss,#bf3b31);font-weight:800}
.mc__card p.mc__pregame{color:var(--blue,#1d68a3);font-weight:700}
.mc__asof{font-size:12.5px;color:var(--ink-3,#686862)}
.mc__links a{display:inline-block;min-height:44px;line-height:44px;color:var(--ink,#222);text-decoration:underline;text-underline-offset:3px;text-decoration-color:var(--stroke-default,#e4e4e1)}
.mc__sr{position:absolute!important;width:1px;height:1px;margin:-1px!important;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
.mc__swing{margin:10px 0 2px}
.mc__card p.mc__swing-h{margin:0 0 8px;font-weight:600;color:var(--ink,#222)}
.mc__swing-h strong{font-weight:800}
.mc__swing-pts{color:var(--ink-3,#686862);font-weight:400}
.mc__swing-track{position:relative;height:8px;background:var(--stroke-default,#e4e4e1);border-radius:2px;margin:0 7px}
.mc__swing-span{position:absolute;top:0;bottom:0;background:var(--blue,#1d68a3);opacity:.28;border-radius:2px}
.mc__swing-end{position:absolute;top:50%;width:12px;height:12px;margin:-6px 0 0 -6px;border-radius:50%;background:var(--page,#fff);box-sizing:border-box}
.mc__swing-end--l{border:2px solid var(--loss,#bf3b31)}
.mc__swing-end--w{border:2px solid var(--win,#3a7a4b)}
.mc__swing-now{position:absolute;top:50%;width:14px;height:14px;margin:-7px 0 0 -7px;border-radius:50%;background:var(--blue,#1d68a3);border:2px solid var(--page,#fff);box-sizing:border-box}
.mc__card p.mc__swing-key{display:flex;justify-content:space-between;gap:12px;margin:8px 0 0;font-weight:700;font-size:13px}
.mc__swing-l{color:var(--loss,#bf3b31)}
.mc__swing-w{color:var(--win,#3a7a4b)}
@media (min-width:720px){.mc{grid-template-columns:1fr 1fr;align-items:start}.mc__card--path{grid-column:1 / -1}}

.rl{margin:0 0 16px;padding:12px 14px;border:1px solid var(--stroke-default,#e4e4e1);border-radius:3px}
.rl__h{margin:0 0 6px;font:700 15px/1.3 var(--font-ui,'Archivo',system-ui,sans-serif);color:var(--ink,#222)}
.rl__ends{display:grid;grid-template-columns:104px 1fr 52px;font:500 12px/1.2 var(--font-ui,'Archivo',system-ui,sans-serif);color:var(--ink-3,#686862)}
.rl__ends-in{display:flex;justify-content:space-between}
.rl__rows{list-style:none;margin:2px 0 0;padding:0}
.rl__row{display:grid;grid-template-columns:104px 1fr 52px;align-items:center;min-height:30px}
.rl__l{font:500 13px/1.2 var(--font-ui,'Archivo',system-ui,sans-serif);color:var(--ink,#222)}
.rl__row--ours .rl__l,.rl__row--ours .rl__n{font-weight:800}
.rl__t{position:relative;height:2px;background:var(--stroke-default,#e4e4e1);margin:0 7px}
.rl__dot{position:absolute;top:50%;width:12px;height:12px;margin:-6px 0 0 -6px;border-radius:50%;background:var(--blue,#1d68a3)}
.rl__row--vote .rl__dot{background:var(--gold,#b7851a)}
.rl__row--ours .rl__dot{width:16px;height:16px;margin:-8px 0 0 -8px}
.rl__n{font:700 13px/1.2 var(--font-ui,'Archivo',system-ui,sans-serif);color:var(--ink,#222);text-align:right;font-variant-numeric:tabular-nums}
.rl__foot{margin:6px 0 0;font:500 12px/1.4 var(--font-ui,'Archivo',system-ui,sans-serif);color:var(--ink-3,#686862)}
.rl__foot a{color:var(--ink,#222)}


.follow-btn{font:600 13px/1 Archivo,sans-serif;padding:0 16px;min-height:44px;min-width:88px;
  display:inline-flex;align-items:center;justify-content:center;border:1px solid var(--line,#e4e4e1);
  border-radius:2px;background:var(--page,#fff);color:var(--ink,#222);cursor:pointer;
  white-space:nowrap}
.follow-btn:hover{background:var(--row,#f7f7f6)}
.follow-btn[aria-pressed="true"]{background:var(--blue,#1d68a3);border-color:var(--blue,#1d68a3);color:#fff}


/* Latest strip — plain-text explore links directly below the identity strip */

.latest{display:flex;align-items:center;gap:16px;padding:9px 18px;
  border-bottom:1px solid var(--stroke-default,#e4e4e1);overflow:hidden}
.latest__label{font-weight:800;font-size:12px;letter-spacing:.01em;
  color:var(--fg-muted,#686862);flex:none;position:relative;padding-right:16px}
.latest__label::after{content:"";position:absolute;right:0;top:-2px;bottom:-2px;width:1px;
  background:var(--stroke-default,#e4e4e1)}
.latest__row{display:flex;align-items:baseline;gap:16px;flex:1;overflow-x:auto;
  scrollbar-width:none;-webkit-overflow-scrolling:touch}
.latest__row::-webkit-scrollbar{display:none}
.latest__item{display:inline-flex;align-items:baseline;gap:6px;flex:none;white-space:nowrap}
.latest__row a,.latest__row .latest__fact{font-size:13px;white-space:nowrap;flex:none}
.latest__row a{color:var(--fg-tertiary,#686862);font-weight:600;text-decoration:none;transition:opacity .1s ease-in}
.latest__row a:hover{opacity:.8}
.latest__row a.now{color:var(--fg-primary,#222);font-weight:700;
  border-bottom:2px solid var(--gold,#b7851a);padding-bottom:1px}
.latest__row .latest__fact{color:var(--fg-tertiary,#8b8b8b);font-weight:600}
.latest--solo{gap:0}
.latest--solo a,.latest--solo .latest__fact{font-size:13px;color:var(--fg-tertiary,#686862);font-weight:600;text-decoration:none;transition:opacity .1s ease-in}
.latest--solo a:hover{opacity:.8}
@media(max-width:640px){
  .latest{gap:10px;padding:8px 14px}
  .latest__label{padding-right:10px}
}


/* The Walk-Off — bottom-of-page component, §19 */

.walkoff-rivalry{display:flex;flex-direction:column;gap:4px;margin:24px 0;
  padding:14px 18px;border:1px solid var(--line,#e4e4e1);border-radius:2px;
  background:var(--row,#f7f7f6)}
.walkoff-rivalry__claim{font:400 14px/1.5 Archivo,sans-serif;color:var(--ink,#222)}
.walkoff-rivalry__meta{font:400 12px/1.4 Archivo,sans-serif;color:var(--ink-3,#8b8b8b)}
.walkoff-chapter-next{display:flex;flex-direction:column;gap:6px;margin:24px 0;
  padding:14px 18px;border:1px solid var(--line,#e4e4e1);border-radius:2px}
.walkoff-chapter-next__label{font:600 11px/1 Archivo,sans-serif;letter-spacing:.04em;
  color:var(--ink-3,#8b8b8b)}
.walkoff-chapter-next__link{font:600 16px/1.3 Archivo,Helvetica Neue,Arial,sans-serif;color:var(--ink,#222);
  text-decoration:none}
.walkoff-chapter-next__link:hover{color:var(--blue,#1d68a3)}


/* Above-fold Belief Lead — doc 97 §3a/§11 */
.tnote{font:500 12.5px/1.45 "Archivo","Helvetica Neue",Arial,sans-serif;
  color:var(--ink-3,#686862);letter-spacing:0;text-transform:none;white-space:nowrap}
.xp{border:1px solid var(--rule,#d7d7d4);border-radius:2px}
.xp-btn{width:100%;text-align:left;display:flex;align-items:center;justify-content:space-between;
  gap:10px;background:none;border:none;padding:10px 14px;
  font-family:"Archivo",system-ui,sans-serif;font-size:13.5px;font-weight:600;
  color:var(--ink,#222);cursor:pointer;transition:background .12s ease}
.xp-btn:hover{background:var(--row,#f7f7f6)}
.xp-chev{font-size:15px;flex:0 0 auto;transition:transform .2s ease;
  display:inline-block}
.xp.open .xp-chev{transform:rotate(180deg)}
.xp-body{display:grid;grid-template-rows:0fr;grid-template-columns:minmax(0,1fr);overflow:hidden;
  transition:grid-template-rows .24s ease}
.xp.open .xp-body{grid-template-rows:1fr}
.xp-inner{min-width:0;min-height:0;padding:0 14px}
.xp.open .xp-inner{padding:10px 14px 14px}
.hfoot{display:flex;flex-wrap:wrap;gap:4px 10px;font-size:11.5px;line-height:1.5;
  color:var(--ink-3,#8b8b8b);font-family:"Archivo",system-ui,sans-serif;
  font-variant-numeric:tabular-nums;border-top:1px solid var(--line,#e4e4e1);
  padding-top:6px;margin-top:8px}
.hfoot b{color:var(--ink-2,#5b5b5b);font-weight:600}
/* Fan-vs-fan Face-Off (Conflict Index). Two real quotes, staged across a
   divide. Radius <=3px, flat, sentence case. The centre rule IS the divide;
   keep it. */
.cfo{margin:0 0 18px}
.cfo-lead{font-family:var(--font-ui,"Archivo",system-ui,sans-serif);font-size:13px;
  font-weight:700;color:var(--fg-primary,#222);margin:0 0 10px}
.cfo-pair{display:grid;grid-template-columns:1fr 1px 1fr;gap:0 18px;align-items:start}
.cfo-pair::before{content:"";grid-column:2;align-self:stretch;background:var(--rule,#e4e4e1)}
@media (max-width:620px){
  .cfo-pair{grid-template-columns:1fr;gap:12px}
  .cfo-pair::before{display:none}
}
.cfo-side{margin:0;padding:0}
.cfo-pos{grid-column:1}
.cfo-neg{grid-column:3}
@media (max-width:620px){.cfo-pos,.cfo-neg{grid-column:1}}
.cfo-txt{font-family:"Archivo","Helvetica Neue",Arial,sans-serif;font-size:15px;line-height:1.45;
  color:var(--fg-primary,#222);margin:0 0 6px}
/* A fan quote: a 40px Talk Gold rule above it (what people say), never a
   coloured side stripe; the lead line says which way each side leans. */
.cfo-txt::before{content:"";display:block;width:40px;height:3px;
  background:var(--gold,#b7851a);margin:0 0 8px}
.cfo-meta{display:flex;gap:8px;align-items:baseline;
  font-family:var(--font-ui,"Archivo",system-ui,sans-serif);font-size:12px;
  color:var(--fg-tertiary,#686862)}
.cfo-up{font-variant-numeric:tabular-nums;font-weight:700}
.cfo-src{color:var(--fg-tertiary,#8b8b8b)}
/* Institutional backdrop (D-109 off-field arc). Gray = context / not-the-
   subject per docs/design-system/100; it must NOT read as loud as the lead it
   sits under, and it must not borrow the discourse gold. */
.cfo-ctx{font-family:var(--font-ui,"Archivo",system-ui,sans-serif);font-size:12px;
  font-weight:400;line-height:1.5;color:var(--fg-tertiary,#8b8b8b);
  margin:-4px 0 10px;max-width:60ch}
/* The quoted headline is somebody else's reporting, so it links out and reads
   slightly stronger than the frame around it — but still stays under the lead.
   No accent colour: doc 100 binds every hue to a meaning and there is none this
   line is entitled to assert about a ruling. */
.cfo-ctx__src{color:var(--fg-secondary,#5b5b5b);font-weight:500;
  text-decoration:none;border-bottom:1px solid var(--line,#e4e4e1);transition:opacity .1s ease-in}
.cfo-ctx__src:hover{opacity:.8;border-bottom-color:currentColor}
.cfo-ctx__meta{white-space:nowrap}
/* Lopsided-but-real: the majority reads as primary, the minority stays on the
   page but is visibly subordinate. Fixed ratio, never data-scaled — a width
   derived from the real number would leak that number back through geometry,
   which is what the no-percentages ruling exists to prevent. */
.cfo-uneven{grid-template-columns:1.9fr 1px 1fr}
.cfo-uneven .cfo-major .cfo-txt{font-size:15px}
.cfo-uneven .cfo-minor .cfo-txt{font-size:13.5px;color:var(--fg-secondary,#5b5b5b)}
.cfo-uneven .cfo-minor .cfo-meta{font-size:12px}
@media (max-width:620px){.cfo-uneven{grid-template-columns:1fr}}
/* Reckoning: one dominant take, no opposing column implying a parity that
   the volume does not support. */
.cfo-solo{max-width:62ch}
.bf-lead{margin:18px 0 4px}
.bf-take{font-family:var(--serif,"Archivo Head","Archivo","Helvetica Neue",Arial,sans-serif);font-weight:800;
  font-size:clamp(24px,4vw,38px);line-height:1.1;color:var(--fg-primary,#222);
  margin:0 0 12px;max-width:20ch;letter-spacing:-.01em}
/* The program's name stays ink: team colour lives in the logo only. */
.bf-take .bf-ent{color:inherit}
.bf-tension{font-family:var(--font-ui,"Archivo",system-ui,sans-serif);font-size:14.5px;
  line-height:1.4;color:var(--fg-secondary,#5b5b5b);margin:0 0 14px;max-width:52ch}
.bf-trend{display:flex;align-items:center;gap:12px;margin:0 0 16px;flex-wrap:wrap}
/* The weekly belief move is a coloured word with its arrow, not a tinted
   chip: green up, red down (house palette), grey when flat. */
.bf-dchip{display:inline-flex;align-items:center;gap:4px;
  font-family:var(--font-ui,"Archivo",system-ui,sans-serif);font-size:12.5px;font-weight:700}
.bf-dchip.up{color:var(--green,#3a7a4b)}
.bf-dchip.down{color:var(--red,#bf3b31)}
.bf-dchip.flat{color:var(--fg-secondary,#5b5b5b)}
.bf-drilldown{display:inline-block;margin-top:10px;font:600 13px/1 var(--font-ui,"Archivo",system-ui,sans-serif);
  color:var(--blue,#1d68a3);text-decoration:none;transition:opacity .1s ease-in}
.bf-drilldown:hover{opacity:.75}
.bf-trend-note{font-size:12px;color:var(--fg-tertiary,#8b8b8b)}
.bf-spark{color:var(--fg-tertiary,#8b8b8b);display:block;margin-left:auto}
@media(max-width:560px){.bf-spark{margin-left:0}}
.bf-strip{display:flex;flex-wrap:wrap;gap:1px;
  background:var(--stroke-default,#e4e4e1);border:1px solid var(--stroke-default,#e4e4e1);
  border-radius:3px;overflow:hidden}
.bf-cell{flex:1 1 140px;background:var(--bg-0,#fff);padding:12px 16px}
.bf-cell .bf-lbl{display:block;font-family:var(--font-ui,"Archivo",system-ui,sans-serif);
  font-size:12px;font-weight:700;letter-spacing:.01em;
  color:var(--fg-tertiary,#686862)}
/* Fan-persona audit 2026-08-16 §3.1: "Grounding" and "Volatility: Chaotic"
   were named unprompted by 3-4 personas each as unexplained jargon (is
   Chaotic good or bad?). Same .gloss dotted-underline convention as
   recruiting_center.py -- links straight to the glossary's plain-English
   definition, title= gives the same answer on hover with zero clicks. */
.bf-cell .bf-lbl.gloss{text-decoration:underline;text-decoration-style:dotted;
  text-decoration-color:var(--fg-tertiary,#8b8b8b);text-decoration-thickness:1px;
  text-underline-offset:2px;color:inherit;cursor:help;transition:opacity .1s ease-in}
.bf-cell .bf-lbl.gloss:hover{opacity:.8}
.bf-cell .bf-val{font-family:"Archivo","Helvetica Neue",Arial,sans-serif;font-weight:600;
  font-size:22px;margin:2px 0 0;line-height:1.1;font-variant-numeric:tabular-nums}
.bf-cell .bf-val.bf-ground{font-family:var(--font-ui,"Archivo",system-ui,sans-serif);
  font-size:15px;font-weight:700;letter-spacing:-.005em;line-height:1.2}
.bf-cell .bf-sub{font-size:12px;color:var(--fg-tertiary,#686862);margin-top:1px;line-height:1.3}
/* The "✓ measured" / "~ our read" tags retired 2026-09-28 (D-144); the
   cell labels ("Fanbase belief", "The model", "Signal") say what each is. */
.bf-vol-chip{font-weight:700;font-size:12px;color:var(--fg-secondary,#5b5b5b)}


/* Program Trajectory chip — Brief §11.4 */

/* Program Trajectory Chip — Brief §11.4. DESIGN.md (2026-09-28): a plain
   framed card on white; the direction is a word (rising/declining keep the
   house green/red with a ▲/▼, the others are ink/gray); the sparkline's
   end dot is ink, not team colour. */
.trajectory-chip {
  display: grid;
  grid-template-columns: auto auto minmax(0, 1fr) auto;
  align-items: center;
  gap: 14px 18px;
  padding: 12px clamp(14px, 1.8vw, 20px);
  background: var(--bg-card, #fff);
  border: 1px solid var(--stroke-subtle, rgba(34, 34, 34,0.08));
  border-radius: 3px;
  margin-bottom: clamp(20px, 3vw, 32px);
}
.trajectory-chip__direction {
  font-family: var(--font-sans, 'Archivo', system-ui, sans-serif);
  font-size: clamp(18px, 1.2vw + 10px, 24px);
  font-weight: 600;
  line-height: 1.15;
  letter-spacing: -0.005em;
  text-transform: none;
  color: var(--fg-primary, #222222);
  white-space: nowrap;
  margin: 0;
}
.trajectory-chip__word { font-weight: 800; }
.trajectory-chip__direction--rising    { color: var(--green, #3a7a4b); }
.trajectory-chip__direction--declining { color: var(--red, #bf3b31); }
.trajectory-chip__direction--rising::before,
.trajectory-chip__direction--declining::before {
  font-size: 0.62em;
  margin-right: 0.2em;
  vertical-align: 0.12em;
}
.trajectory-chip__direction--rising::before    { content: "▲"; }
.trajectory-chip__direction--declining::before { content: "▼"; }
.trajectory-chip__direction--volatile  { color: var(--ink, #222); }
.trajectory-chip__direction--steady    { color: var(--ink-2, #45453f); }

.trajectory-chip__story {
  font-family: 'Archivo', 'Helvetica Neue', Arial, sans-serif;
  font-size: 14px;
  
  line-height: 1.45;
  color: var(--fg-secondary);
  margin: 0;
  max-width: 64ch;
}

.trajectory-chip__spark {
  display: block;
  height: 36px;
  width: clamp(80px, 12vw, 160px);
  font-variant-numeric: tabular-nums;
}
.trajectory-chip__spark path {
  fill: none;
  stroke: currentColor;
  stroke-width: 1.6;
  stroke-linejoin: round;
  stroke-linecap: round;
}
.trajectory-chip__spark circle {
  fill: var(--ink, #222);
}
.trajectory-chip__spark line.baseline {
  stroke: var(--fg-muted);
  stroke-dasharray: 2 3;
  stroke-width: 0.5;
  opacity: 0.5;
}

.trajectory-chip__glyph {
  width: 48px;
  height: 48px;
  object-fit: contain;
  opacity: 0.72;
  flex: none;
}

@media (max-width: 540px) {
  .trajectory-chip { grid-template-columns: auto auto 1fr; }
  .trajectory-chip__glyph { width: 36px; height: 36px; }
  .trajectory-chip__spark { display: none; }
}


/* Kickoff Countdown — Brief §22.1 */

/* Kickoff Countdown — Brief Part II §22.1
 * One-line presence chip that anchors every team page in calendar time.
 */

.kickoff-countdown {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 6px 14px;
  padding: 10px clamp(14px, 1.8vw, 18px);
  background: var(--bg-card, #ffffff);
  border: 1px solid var(--stroke-subtle, rgba(34, 34, 34, 0.08));
  border-radius: 3px;
  margin-bottom: clamp(16px, 2vw, 24px);
  font-variant-numeric: tabular-nums;
  transition: opacity .1s ease-in;
}
.kickoff-countdown__eyebrow {
  font-family: var(--font-sans, system-ui, sans-serif);
  font-size: 12.5px;
  font-weight: 700;
  letter-spacing: 0.01em;
  text-transform: none;
  color: var(--ink-3, #686862);
  margin: 0;
}
.kickoff-countdown__number {
  font-family: var(--font-display, 'Archivo', 'Archivo', system-ui, sans-serif);
  font-size: clamp(24px, 2.0vw + 10px, 32px);
  font-weight: 400;
  line-height: 1;
  letter-spacing: 0.01em;
  color: var(--fg-primary, #222222);
  margin: 0;
}
.kickoff-countdown__story {
  font-family: 'Archivo', 'Helvetica Neue', Arial, sans-serif;
  font-size: 13px;
  
  color: var(--fg-secondary);
  margin: 0;
}
/* The mode variants used to recolour a 3px side stripe (and pulse the live
   number in red); DESIGN.md retired both. The mode word itself carries it. */
.kickoff-countdown--offseason .kickoff-countdown__number {
  color: var(--fg-secondary);
}
.kickoff-countdown-link {
  display: block;
  color: inherit;
  text-decoration: none;
}
.kickoff-countdown-link:hover .kickoff-countdown {
  opacity: .8;
}



.gp-av{max-width:760px;margin:28px auto;padding:0 16px}
.gp-av[hidden]{display:none}
.gp-av h2{font-size:1.25rem;margin:0 0 4px}
.gp-av__src{margin:0 0 14px;font-size:.875rem;color:#5c5c5c}
.gp-av__cols{display:grid;grid-template-columns:1fr 1fr;gap:20px 32px}
@media (max-width:620px){.gp-av__cols{grid-template-columns:1fr}}
.gp-av__team h3{font-size:1rem;margin:0 0 6px}
.gp-av__cols--one{grid-template-columns:1fr}
.gp-av__row{margin:0 0 6px;font-size:.9375rem;line-height:1.45}
.gp-av__row b{font-weight:700;margin-right:2px}
.gp-av__p{white-space:nowrap}
.gp-av__p i{font-style:normal;font-weight:700;color:#5c5c5c}
.gp-av__p small{font-size:.8125rem;color:#5c5c5c}
.gp-av__v{margin:0 0 6px;font-size:1rem;font-weight:700;line-height:1.35}
.gp-av__key{margin:0 0 8px;font-size:.9375rem;line-height:1.45}
.gp-av__meta{margin:0 0 8px;font-size:.8125rem;color:#5c5c5c}
.gp-av__tm{font-weight:700}
.gp-av__none{margin:0;font-size:.9375rem;color:#5c5c5c}
.gp-av details{margin:0 0 6px;font-size:.9375rem}
.gp-av summary{cursor:pointer;text-decoration:underline}
.gp-av__h{font-size:1rem;margin:20px 0 6px}
.gp-av__chg{margin:0;padding:0;list-style:none;font-size:.9375rem}
.gp-av__chg li{margin:0 0 4px}
.gp-av__chg time{color:#5c5c5c;margin-left:6px}
.gp-av__note{margin:14px 0 0;font-size:.8125rem;color:#5c5c5c}


/* Refusal component — BUILD_PLAN.md Chunk D5, FACT_SHEET_DESIGN.md's "we
   don't know" primitive; shared across any TeamFactSheet consumer */

.tp-refusal {
  display: flex;
  align-items: baseline;
  gap: 6px;
  padding: 10px 12px;
  background: #ffffff;
  border: 1px solid var(--stroke-default);
  border-radius: 3px;
  font-family: var(--font-body);
}
.tp-refusal__icon {
  color: var(--fg-subtle);
  font-size: var(--fs-body);
  line-height: 1;
}
.tp-refusal__text {
  color: var(--fg-muted);
  font-size: var(--fs-body);
  line-height: var(--lh-snug);
}


/* Program Peer Comparator — Brief §26 */

/* Program Peer Comparator — Brief §26 */
.peer-comparator {
  display: grid;
  gap: clamp(8px, 1.2vw, 14px);
  padding: clamp(14px, 1.8vw, 22px) clamp(16px, 2.0vw, 26px);
  background: var(--bg-card, #fff);
  border: 1px solid var(--stroke-subtle, rgba(34, 34, 34,0.08));
  border-radius: 3px;
  margin-bottom: clamp(20px, 3vw, 32px);
}
/* Kicker that says what "Reads like" is about (and for which program): a
   plain sentence-case label, no tracking (DESIGN.md, 2026-09-28). */
.peer-comparator__eyebrow {
  font-family: var(--sans, "Archivo", system-ui, sans-serif);
  font-size: 12.5px;
  font-weight: 700;
  letter-spacing: 0.01em;
  text-transform: none;
  color: var(--ink-3, #686862);
  margin: 0;
}
.peer-comparator__title {
  font-family: var(--font-serif, 'Archivo Head', 'Archivo', 'Helvetica Neue', Arial, sans-serif);
  font-size: var(--fs-headline, clamp(22px, 1.8vw + 14px, 30px));
  font-weight: 800;
  line-height: 1.2;
  letter-spacing: normal;
  text-transform: none;
  color: var(--fg-primary);
  margin: 0;
}
.peer-comparator__peers {
  display: grid;
  gap: 8px;
  grid-template-columns: repeat(3, minmax(0, 1fr));
}
/* Each peer is a link, so it keeps a plain 1px box -- but no team-colour
   side stripe and no tint (DESIGN.md, 2026-09-28). */
.peer-comparator__peer {
  display: grid;
  gap: 4px;
  padding: 10px 12px;
  background: var(--bg-card, #fff);
  border: 1px solid var(--stroke-subtle, rgba(34, 34, 34,0.08));
  border-radius: 3px;
  text-decoration: none;
  color: inherit;
  transition: opacity .1s ease-in;
}
.peer-comparator__peer:hover {
  opacity: .8;
}
.peer-comparator__peer-name {
  font-family: var(--sans, "Archivo", system-ui, sans-serif);
  font-size: 14px;
  font-weight: 700;
  color: var(--fg-primary);
}
.peer-comparator__peer-conf {
  font-family: var(--sans, "Archivo", system-ui, sans-serif);
  font-size: 12px;
  font-weight: 500;
  color: var(--fg-muted);
}
.peer-comparator__peer-reason {
  font-family: "Archivo", "Helvetica Neue", Arial, sans-serif;
  font-size: 12px;
  
  color: var(--fg-secondary);
  line-height: 1.35;
}
.peer-comparator__caveat {
  font-family: var(--sans, "Archivo", system-ui, sans-serif);
  font-size: 12px;
  color: var(--fg-muted);
  margin: 0;
}
@media (max-width: 640px) {
  .peer-comparator__peers { grid-template-columns: 1fr; }
}


.hecho{margin:0 0 24px;border:1px solid rgba(34,34,34,.1);border-radius:3px;padding:18px 20px 16px;background:#fff}
.hecho__head{font-family:"Archivo","Helvetica Neue",Arial,sans-serif;font-weight:600;font-size:clamp(17px,2vw,21px);line-height:1.25;
  margin:0 0 3px;color:#1c1c1a;text-wrap:balance}
.hecho__sub{font-size:12.5px;color:#6d6d68;margin:0 0 14px}
.hecho__list{display:flex;flex-direction:column;gap:2px}
.hecho__row{display:grid;grid-template-columns:1fr 84px auto;gap:12px;align-items:center;
  padding:9px 2px;border-top:1px solid rgba(34,34,34,.07)}
.hecho__who{min-width:0}
.hecho__who a{font-family:"Archivo","Helvetica Neue",Arial,sans-serif;font-size:15.5px;font-weight:600;color:#1c1c1a;text-decoration:none;
  border-bottom:1px solid rgba(34,34,34,.16)}
.hecho__who a:hover{border-bottom-color:#1c1c1a}
.hecho__yrs{font-size:12px;color:#6d6d68;font-variant-numeric:tabular-nums}
.hecho__spark{width:84px;height:26px;display:block}
.hecho__verdict{font-size:12px;font-weight:700;text-align:right;white-space:nowrap}
.hecho__verdict.bad{color:#c2371c}.hecho__verdict.good{color:#3a7d34}.hecho__verdict.mid{color:#6d6d68}
.hecho__note{font-size:11.5px;color:#686862;margin:12px 0 0;line-height:1.5}


/* Wrapped stack — Brief §21.3 */

/* Wrapped stack — Brief §21.3
 * Vertical card stack. DESIGN.md (2026-09-28): flat (no gradient wash), no
 * coloured side stripe per card kind (the kind is named in words), sentence
 * case, untracked labels.
 */
.wrapped-stack {
  display: grid;
  gap: clamp(10px, 1.4vw, 18px);
  padding: clamp(18px, 2.4vw, 28px) clamp(18px, 2.6vw, 32px);
  background: var(--bg-card, #fff);
  border: 1px solid var(--stroke-default, rgba(34, 34, 34,0.10));
  border-radius: 3px;
  margin-bottom: clamp(20px, 3vw, 32px);
}
.wrapped-stack__header {
  display: grid;
  gap: 4px;
}
.wrapped-stack__eyebrow {
  font-family: var(--font-sans, system-ui, sans-serif);
  font-size: 12.5px;
  font-weight: 700;
  letter-spacing: 0.01em;
  text-transform: none;
  color: var(--fg-muted);
  margin: 0;
}
.wrapped-stack__title {
  font-family: var(--font-display, 'Archivo', 'Archivo', system-ui, sans-serif);
  font-size: clamp(28px, 2.5vw + 12px, 42px);
  font-weight: 400;
  line-height: 1;
  letter-spacing: 0.01em;
  text-transform: none;
  color: var(--fg-primary);
  margin: 0;
}
.wrapped-stack__cards {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: clamp(8px, 1.2vw, 14px);
}
.wrapped-stack__card {
  display: grid;
  gap: 6px;
  padding: 14px 16px;
  background: var(--bg-card, #fff);
  border: 1px solid var(--stroke-subtle, rgba(34, 34, 34,0.08));
  border-radius: 3px;
}
.wrapped-stack__card-kind {
  font-family: var(--font-sans, system-ui, sans-serif);
  font-size: 12.5px;
  font-weight: 700;
  letter-spacing: 0.01em;
  text-transform: none;
  color: var(--fg-muted);
}
.wrapped-stack__card-headline {
  font-family: var(--font-display, 'Archivo', 'Archivo', system-ui, sans-serif);
  font-size: clamp(18px, 1.2vw + 8px, 22px);
  font-weight: 400;
  line-height: 1.05;
  letter-spacing: 0.01em;
  text-transform: none;
  color: var(--fg-primary);
}
.wrapped-stack__card-story {
  font-family: 'Archivo', 'Helvetica Neue', Arial, sans-serif;
  font-size: 13px;
  
  line-height: 1.45;
  color: var(--fg-secondary);
}


/* Fanbase Health Index — Brief §11.1 */

/* Fanbase Health Index — Brief §11.1 (design pass 2026-09-08) */
.fanbase-health {
  display: grid;
  gap: clamp(10px, 1.2vw, 14px);
  padding: clamp(14px, 1.8vw, 20px) clamp(16px, 2.0vw, 24px);
  background: #ffffff;
  border: 1px solid var(--stroke-default, #e4e4e1);
  border-radius: 3px;
  margin-bottom: clamp(20px, 3vw, 32px);
  font-variant-numeric: tabular-nums;
}
/* DESIGN.md (2026-09-28): no team-colour side stripe; no "Fanbase health"
   eyebrow over the heading (it only restated the module's category). */
.fanbase-health__header {
  display: grid;
  gap: 6px;
}
.fanbase-health__band {
  font-family: var(--font-display, 'Archivo', system-ui, sans-serif);
  font-size: var(--fs-headline, clamp(22px, 1.8vw + 14px, 30px));
  font-weight: 600;
  line-height: 1.15;
  letter-spacing: -0.005em;
  text-transform: none;
  color: var(--fg-primary, #222222);
  margin: 0;
  max-width: 40ch;
}
.fanbase-health__band-word--declining { color: var(--red, #bf3b31); }
.fanbase-health__band-word--stable    { color: var(--fg-secondary, #5b5b5b); }
.fanbase-health__band-word--growing   { color: var(--green, #3a7a4b); }
.fanbase-health__band-word--surging   { color: var(--green, #3a7a4b); }
.fanbase-health__deck {
  font-family: 'Archivo', 'Helvetica Neue', Arial, sans-serif;
  font-size: clamp(14px, 0.4vw + 13px, 16px);
  line-height: 1.45;
  color: var(--fg-secondary, #5b5b5b);
  margin: 0;
  max-width: 62ch;
}
.fanbase-health__awaiting-art {
  display: flex;
  justify-content: center;
  padding: 8px 0 4px;
}
.fanbase-health__awaiting-art img {
  width: 120px;
  height: 120px;
  object-fit: contain;
  opacity: 0.72;
}

/* Banded scale — percentile-bar idiom: panel track, white band ticks, ink marker */
.fanbase-health__scale {
  display: grid;
  gap: 4px;
  margin-top: 2px;
}
.fanbase-health__track {
  position: relative;
  height: 12px;
  background: var(--panel, #f1f1ec);
  border-radius: 2px;
}
.fanbase-health__tick {
  position: absolute;
  top: 0;
  bottom: 0;
  width: 2px;
  background: #ffffff;
  transform: translateX(-50%);
}
.fanbase-health__marker {
  position: absolute;
  top: -4px;
  bottom: -4px;
  width: 3px;
  background: var(--fg-primary, #222222);
  border-radius: 1px;
  transform: translateX(-50%);
}
.fanbase-health__marker-label {
  position: absolute;
  top: -20px;
  transform: translateX(-50%);
  font-family: var(--font-sans, 'Archivo', system-ui, sans-serif);
  font-size: 12px;
  font-weight: 800;
  color: var(--fg-primary, #222222);
  white-space: nowrap;
}
.fanbase-health__marker-label--left  { transform: translateX(0); }
.fanbase-health__marker-label--right { transform: translateX(-100%); }
.fanbase-health__legend {
  display: grid;
  grid-template-columns: 26fr 25fr 25fr 24fr;
  font-family: var(--font-sans, 'Archivo', system-ui, sans-serif);
  font-size: 12px;
  font-weight: 500;
  color: var(--fg-muted, #8b8b8b);
}
.fanbase-health__legend span { text-align: center; }
.fanbase-health__legend span:first-child { text-align: left; }
.fanbase-health__legend span:last-child  { text-align: right; }
.fanbase-health__legend span[aria-current="true"] {
  color: var(--fg-primary, #222222);
  font-weight: 700;
}

.fanbase-health__components {
  display: grid;
  gap: 0;
  border-top: 1px solid var(--stroke-default, #e4e4e1);
  font-family: var(--font-sans, 'Archivo', system-ui, sans-serif);
  font-size: 13px;
  color: var(--fg-secondary, #5b5b5b);
}
.fanbase-health__components-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: baseline;
  gap: 12px;
  padding: 7px 0;
  border-bottom: 1px solid var(--stroke-default, #e4e4e1);
}
.fanbase-health__components-row:last-child { border-bottom: none; }
.fanbase-health__components-row strong {
  color: var(--fg-primary, #222222);
  font-weight: 700;
}
.fanbase-health__components-row em {
  font-style: normal;
  color: var(--fg-primary, #222222);
  font-weight: 700;
  font-variant-numeric: tabular-nums;
}
.fanbase-health__note {
  font-family: var(--font-sans, 'Archivo', system-ui, sans-serif);
  font-size: 12px;
  color: var(--fg-muted, #8b8b8b);
  margin: 0;
}


/* Experience module — doc 97 §11 */

/* Experience module — doc 97 §11 */
.exp-section{padding:20px 0 8px}
.exp-eyebrow{font:700 12.5px/1.3 var(--font-ui,'Archivo',system-ui);letter-spacing:.01em;color:var(--ink-3,#686862);margin-bottom:8px}
.exp-phrase{font:400 16px/1.55 var(--font-ui,'Archivo',system-ui);color:var(--fg-secondary,#5b5b5b);margin:0 0 12px;max-width:60ch}
.exp-axes{display:flex;flex-wrap:wrap}
.exp-axis{font:500 12.5px/1.3 var(--font-ui,'Archivo');color:var(--ink-3,#686862)}
.exp-axis + .exp-axis::before{content:"·";margin:0 6px;color:#8b8b85}


/* Stat Ledger fingerprint + full drawer (doc 97 P6) */

/* ── Stat Ledger (doc 97 P6) ── */
.sl-key{margin:2px 0 10px;font:400 12.5px/1.4 var(--font-ui,'Archivo',system-ui,sans-serif);color:var(--ink-3,#686862)}
.stat-ledger{margin:.5rem 0 1.5rem;padding:1rem 1.25rem;border-radius:3px;
  background:var(--bg-card,#f1f1ec)}
/* The module's only heading ("Key stats — 2026 — FBS rank"), a plain
   sentence-case label, not a tracked eyebrow (DESIGN.md, 2026-09-28). */
.sl-eyebrow{font:700 12.5px/1.3 Archivo,sans-serif;letter-spacing:.01em;
  color:var(--ink-3,#686862);margin-bottom:.85rem}

/* Fingerprint rows — label(+triplet) | bar | value, doc 97 §10a grammar */
.sl-fp-row{display:grid;grid-template-columns:11rem 1fr 4rem;
  align-items:center;gap:.5rem .75rem;padding:.3rem 0}
.sl-fp-row+.sl-fp-row{border-top:1px solid rgba(0,0,0,.04)}
.sl-fp-label{display:flex;flex-direction:column;min-width:0}
.sl-fp-lbl{font:500 .8rem/1.2 Archivo,sans-serif;color:var(--fg-secondary,#555)}
/* Crux row (Chunk F1) -- the stat the page's own tension turns on. Marked
   by the "Crux" word and a row tint (DESIGN.md row bleed), not a side stripe. */
.sl-fp-row--crux{background:var(--row,#f7f7f6);
  box-shadow:-8px 0 0 var(--row,#f7f7f6),8px 0 0 var(--row,#f7f7f6)}
.sl-fp-crux-tag{font:700 .8rem/1.4 Archivo,sans-serif;letter-spacing:.01em;
  color:var(--fg-secondary,#5b5b5b);margin-bottom:.05rem}
.sl-fp-val{font:700 .85rem/1 Archivo,sans-serif;color:var(--fg-primary,#222);text-align:right;
  font-variant-numeric:tabular-nums}

/* The context triplet — "#rank / cohort · pctth pct" — under every label,
   matching player_pages/box_savant.py's <small> exactly (doc 97 §10a-B). */
.sl-triplet{display:block;font:600 .8rem/1.3 Archivo,sans-serif;
  color:var(--fg-tertiary,#8b8b8b);letter-spacing:.01em;white-space:nowrap;
  overflow:hidden;text-overflow:ellipsis}

/* Bar — diverging red->neutral->blue scale with a pinned marker, now the
   shared theme/percentile_bar.py component (render_percentile_track(),
   .wcfb-percentile-bar__track/__fill/__dot — Phase 3 item 13 consolidation,
   2026-08-06) instead of this file's own sl-bar-track/-pin gradient.
   Percentile position is always goodness-oriented (see _bar_html
   docstring), so the fill never needs to flip direction.

   Team pages don't load the shared component's stylesheet
   (theme/assets/stats_table.css, shipped as /assets/stats_table.css and
   linked in _global_link_tags() — team_pages/renderer.py explicitly
   bypasses that function and inlines its own self-contained CSS bundle
   instead, see renderer.py's "doesn't go through _global_link_tags()"
   comment). So this file carries its own copy of the base track/fill/dot
   rules the shared markup needs — same class names and colors as
   theme/assets/stats_table.css (538 palette: #bf3b31/#e4e4e1/#1d68a3,
   matching this file's own pre-consolidation gradient) so the two stay
   visually identical even though they're two separate stylesheets. The
   compound selectors below (two classes required) make the height/sizing
   overrides win regardless of rule order within this bundle. */
.wcfb-percentile-bar__track{position:relative;height:4px;border-radius:2px;
  background:rgba(0,0,0,.12);overflow:hidden}
.wcfb-percentile-bar__fill{position:absolute;left:0;top:0;height:100%;
  border-radius:2px;min-width:3px}
.wcfb-percentile-bar__fill[data-pct-low="true"]{background:#bf3b31}
.wcfb-percentile-bar__fill[data-pct-medium="true"]{background:#e4e4e1}
.wcfb-percentile-bar__fill[data-pct-high="true"]{background:#1d68a3}
.wcfb-percentile-bar__dot{position:absolute;top:50%;width:14px;height:14px;
  background:#fff;border:2px solid #222;border-radius:50%;
  transform:translate(-50%,-50%)}
.wcfb-percentile-bar__dot--unknown{background:#fff;border-color:#bbb}
.wcfb-percentile-bar__track.sl-bar-track{height:8px;overflow:visible;min-width:60px}
.wcfb-percentile-bar__track.sl-bar-track--tall{height:12px}

/* Per-game toggle */
.sl-toggle-row{display:flex;gap:.35rem;margin:.75rem 0 0}
/* Segmented controls (DESIGN.md "View toggles"): squared, 1px rule border,
   the active option in solid ink. */
.sl-pg-btn{font:600 .8rem/1 Archivo,sans-serif;border:1px solid var(--rule,#d9d9d3);
  background:var(--page,#fff);color:var(--fg-secondary,#555);border-radius:2px;
  padding:.25rem .55rem;cursor:pointer;transition:opacity .1s ease-in}
.sl-pg-btn:hover:not(.sl-pg-active){opacity:.8}
.sl-pg-btn.sl-pg-active{background:var(--ink,#222);color:#fff;border-color:var(--ink,#222)}
/* 3-way normalization (doc 97 W8): Total (default) / Per game / Per play.
   Per-play (.sl-pp) only exists on rows _row_value_strs() gave one to
   (yardage stats) — everything else has no .sl-pp span to reveal, so
   switching to Per-play mode on a counting-stat row just shows nothing
   extra, never a wrong number. */
.sl-abs{display:inline}
.sl-pg,.sl-pp{display:none;font-variant-numeric:tabular-nums}
.sl-pg-sfx,.sl-pp-sfx{display:none;color:var(--fg-tertiary,#8b8b8b);font-weight:400;font-size:.8rem}
.stat-ledger.sl-mode-per-game .sl-abs,.stat-ledger.sl-mode-per-play .sl-abs{display:none}
.stat-ledger.sl-mode-per-game .sl-pg,.stat-ledger.sl-mode-per-game .sl-pg-sfx{display:inline}
/* Peer-set toggle (doc 97 W8, 2026-07-08): FBS / P4 / Conference / CFP Era.
   Independent of the Total/Per-game/Per-play toggle above -- this swaps
   which rank/bar/triplet variant is visible, never the value spans, so the
   two toggles compose without interference (see _peer_variants). */
.sl-peer-toggle-row{margin-top:.35rem}
.sl-peer-btn{font:600 .8rem/1 Archivo,sans-serif;border:1px solid var(--rule,#d9d9d3);
  background:var(--page,#fff);color:var(--fg-secondary,#555);border-radius:2px;
  padding:.25rem .55rem;cursor:pointer;transition:opacity .1s ease-in}
.sl-peer-btn:hover:not(.sl-peer-active){opacity:.8}
.sl-peer-btn.sl-peer-active{background:var(--ink,#222);color:#fff;border-color:var(--ink,#222)}
/* Each stat renders one .sl-peer-variant per peer set it can honestly answer
   (fbs always; p4/conf/cfp only when that row has real data — see
   _peer_variants). display:contents on the active one keeps the wrapper out
   of the CSS grid/flow entirely, so toggling never disturbs .sl-row's grid
   layout or .sl-name's stacked triplet -- only the real .sl-bar-track /
   .sl-triplet inside participates. */
.sl-peer-variant{display:none}
.stat-ledger.sl-peer-fbs .sl-peer-variant[data-peer="fbs"]{display:contents}
.stat-ledger.sl-peer-p4 .sl-peer-variant[data-peer="p4"]{display:contents}
.stat-ledger.sl-peer-conf .sl-peer-variant[data-peer="conf"]{display:contents}
.stat-ledger.sl-peer-cfp .sl-peer-variant[data-peer="cfp"]{display:contents}
/* A row with no variant for the active peer set (e.g. a stat with no CFP-era
   history yet) shows its value with no bar/triplet at all -- honest omission,
   never a fabricated or stale-peer-set number. */
.stat-ledger.sl-mode-per-play .sl-pp,.stat-ledger.sl-mode-per-play .sl-pp-sfx{display:inline}

/* Ledger sub-tabs (doc 97 W8) — real panes, not a flat scroll */
.sl-subtabs{display:flex;gap:2px;flex-wrap:wrap;border-bottom:1px solid var(--stroke-default,#e4e4e1);
  margin-bottom:.75rem}
.sl-subtab{font:600 .8rem/1 Archivo,sans-serif;color:var(--fg-secondary,#555);
  background:none;border:none;border-bottom:2px solid transparent;
  padding:.4rem .6rem;cursor:pointer;transition:opacity .1s ease-in}
.sl-subtab.sl-subtab-active{color:var(--ink,#222);
  border-bottom-color:var(--ink,#222)}
.sl-subtab:hover:not(.sl-subtab-active){opacity:.8}

/* Drawer */
.sl-drawer{margin-top:.85rem;border-top:1px solid var(--stroke-default,#e4e4e1);padding-top:.6rem}
.sl-drawer-toggle{font:600 .8rem/1 Archivo,sans-serif;color:var(--blue,#1d68a3);
  cursor:pointer;list-style:none;padding:.15rem 0;
  display:flex;align-items:center;gap:.35rem}
.sl-drawer-toggle::after{content:"↓";font-size:.8rem;transition:transform .2s}
details[open] .sl-drawer-toggle::after{transform:rotate(180deg)}
.sl-drawer-toggle::-webkit-details-marker{display:none}
.sl-drawer-body{margin-top:.7rem}
.sl-section{margin-bottom:.85rem}
.sl-sec-hdr{font:700 12.5px/1.2 Archivo,sans-serif;letter-spacing:.01em;
  color:var(--ink-3,#686862);
  border-bottom:1px solid var(--stroke-default,#e4e4e1);
  padding-bottom:.25rem;margin-bottom:.35rem}
.sl-pbp-note{font-weight:400;letter-spacing:0;text-transform:none;color:var(--fg-tertiary,#8b8b8b)}

/* Full-ledger rows — label(+triplet) | bar | value (doc 97 §10a triplet, no
   separate rank column — the triplet under the label already carries it) */
.sl-row{display:grid;grid-template-columns:10.5rem 1fr 5.5rem;
  align-items:center;gap:.4rem .6rem;padding:.22rem 0}
.sl-name{display:block;font:400 .8rem/1.3 Archivo,sans-serif;color:var(--fg-secondary,#555)}
.sl-val{font:500 .8rem/1 Archivo,sans-serif;color:var(--fg-primary,#222);
  text-align:right;font-variant-numeric:tabular-nums;white-space:nowrap}
.sl-foot{font:400 12px/1.4 Archivo,sans-serif;color:var(--fg-tertiary,#8b8b8b);
  margin:.75rem 0 0}

/* Team-vs-Opponent mirrored row (doc 97 §10b) — one stat, Team + Opp bars
   stacked beneath a shared label, instead of two separate sections. */
.sl-mrow{padding:.35rem 0;border-top:1px solid rgba(0,0,0,.04)}
.sl-mrow-name{display:block;font:600 .8rem/1.3 Archivo,sans-serif;
  color:var(--fg-primary,#222);margin-bottom:.2rem}
.sl-mrow-side{display:grid;grid-template-columns:2.6rem 1fr 6rem;
  align-items:center;gap:.4rem .6rem;padding:.1rem 0}
.sl-mrow-tag{font:700 .8rem/1 Archivo,sans-serif;letter-spacing:.01em;
  color:var(--fg-tertiary,#8b8b8b)}
.sl-mrow-valwrap{display:flex;flex-direction:column;align-items:flex-end}

/* ── Situational small-multiples (doc 97 P6) ── */
.sit-pair-label{font:600 .8rem/1 Archivo,sans-serif;color:var(--fg-secondary,#555);
  margin:.45rem 0 .2rem;letter-spacing:.01em}
.sit-pair{display:flex;flex-direction:column;gap:.15rem;margin-bottom:.5rem}
.sit-pair-row{display:grid;grid-template-columns:2.2rem 1fr 3rem 3rem;
  align-items:center;gap:.35rem .5rem}
.sit-side{font:700 .8rem/1 Archivo,sans-serif;color:var(--fg-tertiary,#8b8b8b);
  letter-spacing:.01em}
.sit-pct{font:600 .8rem/1 Archivo,sans-serif;color:var(--fg-primary,#222);
  text-align:right;font-variant-numeric:tabular-nums}
.sit-single-row{display:grid;grid-template-columns:9.5rem 1fr 5.5rem;
  align-items:center;gap:.35rem .5rem;padding:.22rem 0;margin-bottom:.15rem}
/* Turnover margin chip */
.sit-chip{font:700 .8rem/1 Archivo,sans-serif;text-align:right;
  font-variant-numeric:tabular-nums;color:var(--fg-secondary,#555)}
.sit-chip--pos{color:var(--green,#3a7a4b)}
.sit-chip--neg{color:var(--red,#bf3b31)}
/* The triplet doesn't fit a column in these compact rows — bump it to its
   own full-width line below (grid auto-flow pushes an overlapping span to
   the next row automatically). */
.sit-pair-row .sl-triplet,.sit-single-row .sl-triplet{grid-column:1/-1;margin-top:-.1rem}

@media(max-width:480px){
  .sl-fp-row{grid-template-columns:8rem 1fr 3.5rem;gap:.4rem .5rem}
  .sl-row{grid-template-columns:7.5rem 1fr 4.5rem}
  .sl-mrow-side{grid-template-columns:2.2rem 1fr 4.5rem}
  .sit-pair-row{grid-template-columns:1.8rem 1fr 2.8rem 2.5rem}
  .sit-single-row{grid-template-columns:7.5rem 1fr 3.5rem}
}


/* Scheme Identity claim cards — specs/18 Phase 1 (Team Closer/Boom-vs-Grind/fragility) */
.chart-card { margin: 0 0 1.5rem; padding: 0; border: 0; }
.chart-card__head { margin-bottom: .6rem; }
.chart-card__eyebrow {
  margin: 0 0 .2rem; font-size: .8rem; letter-spacing: .14em;
  text-transform: none; font-weight: 700;
  color: var(--chart-card-eyebrow, var(--fg-muted, #7a7a7a));
}
.chart-card__headline {
  margin: 0; font-size: 1.18rem; line-height: 1.2; font-weight: 700;
  color: var(--chart-card-fg, var(--fg, #1a1a1a));
}
.chart-card__lede {
  margin: .25rem 0 0; font-size: .9rem; line-height: 1.45;
  color: var(--chart-card-muted, var(--fg-secondary, #555));
}
.chart-card__body {
  display: grid; grid-template-columns: auto 1fr;
  grid-template-areas: "ylabel plot" ".  xlabel";
  align-items: center; gap: .35rem .5rem;
}
.chart-card__plot { grid-area: plot; position: relative; min-width: 0; }
.chart-card__plot > svg { max-width: 100%; height: auto; display: block; }
.chart-card__overlay { position: absolute; inset: 0; pointer-events: none; }
.chart-card__overlay > svg { width: 100%; height: 100%; display: block; }
.chart-card__ylabel {
  grid-area: ylabel; writing-mode: vertical-rl; transform: rotate(180deg);
  font-size: .8rem; letter-spacing: .1em; text-transform: none;
  color: var(--chart-card-muted, var(--fg-muted, #7a7a7a)); white-space: nowrap;
}
.chart-card__xlabel {
  grid-area: xlabel; text-align: center;
  font-size: .8rem; letter-spacing: .1em; text-transform: none;
  color: var(--chart-card-muted, var(--fg-muted, #7a7a7a));
}
.chart-card__source {
  margin-top: .5rem; font-size: .8rem; line-height: 1.4;
  color: var(--chart-card-muted, var(--fg-muted, #7a7a7a));
}
.chart-card__source-label {
  text-transform: none; letter-spacing: .1em; font-weight: 700;
  margin-right: .35rem;
}
@media (max-width: 360px) {
  .chart-card__body { grid-template-columns: 1fr; grid-template-areas: "plot" "xlabel"; }
  .chart-card__ylabel { display: none; }
}
.qs-svg{width:100%;height:auto;display:block}
.qs-panel{fill:var(--page,#ffffff)}
.qs-median{stroke:#bdbdb7;stroke-width:1.5}
.qs-quadrant-label{font-family:"Archivo",system-ui,sans-serif;font-size:12px;font-weight:600;
  fill:var(--ink-3,#8b8b8b);paint-order:stroke fill;stroke:#ffffff;
  stroke-width:3.5px;stroke-linejoin:round}
.qs-dot-context{opacity:.6;stroke:#ffffff;stroke-width:1.4}
.qs-dot-focal{stroke:#ffffff;stroke-width:2.5}
/* Identity rides the colored dot, not the type: #bf3b31 as 13px text is 3.3:1 on
   white. The label stays ink and the mark beside it carries the team color. */
.qs-focal-label{font-family:"Archivo",system-ui,sans-serif;font-size:13px;font-weight:700;
  fill:var(--ink,#222);paint-order:stroke fill;stroke:#ffffff;
  stroke-width:4px;stroke-linejoin:round}
.qs-axis-label{font-family:"Archivo",system-ui,sans-serif;font-size:12px;fill:var(--ink-3,#8b8b8b)}
.qs-leader{stroke:var(--ink-3,#8b8b8b);stroke-width:1}

/* Hover layer — sharp white box, 1px rule border, opacity as the only signal
   (doc 90 §3.6 + motion table). No JS: :hover on the transparent hit target. */
.qs-hit-target{fill:none;pointer-events:all}
.qs-tip{opacity:0;pointer-events:none;transition:opacity .1s ease-in}
.qs-hit:hover .qs-tip{opacity:1}
.qs-tip-box{fill:#ffffff;stroke:var(--rule,#d7d7d4);stroke-width:1;rx:2}
.qs-tip-name{font-family:"Archivo",system-ui,sans-serif;font-size:12.5px;font-weight:700;
  fill:var(--ink,#222)}
.qs-tip-detail{font-family:"Archivo",system-ui,sans-serif;font-size:12px;font-weight:500;
  fill:var(--ink-2,#5b5b5b)}
.db-svg{width:100%;height:auto;display:block}
.db-conn{stroke:var(--rule,#d7d7d4);stroke-width:2}
.db-taper{fill:var(--rule,#d7d7d4)}
.db-tick{stroke:var(--rule,#d7d7d4);stroke-width:1;stroke-dasharray:2 2}
.db-band{stroke-dasharray:3 3;stroke-width:1}
.db-lab{font-family:"Archivo",system-ui,sans-serif;font-size:12px;font-weight:600;fill:var(--ink,#222)}
.db-end{font-family:"Archivo",system-ui,sans-serif;font-size:12px;fill:var(--ink-3,#8b8b8b)}
.db-sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;
  clip:rect(0,0,0,0);white-space:nowrap;border:0}
.dlt-svg{width:100%;height:100%;display:block}
.dlt-grid{stroke:rgba(0,0,0,.08);stroke-width:1}
.dlt-axis{font-family:"Archivo",system-ui,sans-serif;font-size:12px;fill:var(--ink-2,#5b5b5b)}
.dlt-line{fill:none;stroke-width:2.25;stroke-linecap:round;stroke-linejoin:round}
.dlt-line-raw{stroke-width:2;stroke-dasharray:4 3}
.dlt-end-lab{font-family:"Archivo",system-ui,sans-serif;font-size:12px;font-weight:700}
.dlt-svg--lg .dlt-axis,.dlt-svg--lg .dlt-end-lab{font-size:13.7px}
.scheme-identity-claims{display:grid;gap:1rem;margin-top:.5rem}
.si-card-group{display:flex;flex-direction:column}
.si-table-fallback{margin-top:.5rem;font-family:"Archivo",system-ui,sans-serif;font-size:13px}
.si-table-fallback summary{cursor:pointer;color:var(--ink-2,#5b5b5b);font-weight:600}
.si-table-fallback table{width:100%;border-collapse:collapse;margin-top:.5rem;font-size:12.5px}
.si-table-fallback th,.si-table-fallback td{text-align:left;padding:4px 8px;border-bottom:1px solid var(--line,#e4e4e1)}
.si-table-fallback th{color:var(--ink-2,#5b5b5b);font-weight:600}
/* Mobile gate (specs/18 Phase 1): below md, the table view leads and the
   dense quadrant-scatter SVG is secondary — 130+ context dots at 320px is
   unreadable regardless of font-size tweaks. Reorder is scoped to each
   .si-card-group (flex column) so it flips locally without disturbing the
   top-to-bottom sequence of the three claim cards. */
@media (max-width: 640px) {
  .si-card-group .si-chart-slot { order: 2; margin-top: .5rem; }
  .si-card-group .si-table-fallback { order: 1; }
  .si-card-group .si-table-fallback[open] summary { margin-bottom: .25rem; }
}

/* National Spotlight — specs/18 Phase 3 */

/* National Spotlight card — specs/18 Phase 3 */
.ns{border:1px solid var(--line,#e4e4e1);
  border-radius:3px;padding:14px 16px 12px;margin:0 0 16px}
.ns-eyebrow{font:700 12.5px/1.3 var(--font-ui,'Archivo',system-ui);letter-spacing:.01em;
  color:var(--ink-3,#686862);margin:0 0 6px}
.ns-opener{font:600 16px/1.35 'Archivo','Helvetica Neue',Arial,sans-serif;color:var(--ink,#222);margin:0 0 4px}
.ns-sub{font:400 12.5px/1.4 var(--font-ui,'Archivo',system-ui);
  color:var(--fg-secondary,#5b5b5b);margin:0}
@media(max-width:460px){.ns-opener{font-size:14.5px}}


/* Weather identity (venue texture) — specs/18 Phase 4 */

.wxu { grid-column: 1 / -1; order: 4; text-align: center; font-family: 'Archivo', sans-serif; font-size: 13px; line-height: 1.45; color: var(--ink-2, #45453f); padding-top: 6px; }
.wxu p { margin: 0 auto; max-width: 44ch; text-wrap: balance; }
.wxu__src span { display: block; }
.wxu__n { color: var(--blue, #1d68a3); font-weight: 800; font-variant-numeric: tabular-nums lining-nums; }
.wxu__src { font-size: 12px; color: var(--ink-3, #686862); margin-top: 2px !important; }
.wxu__src a { color: inherit; text-decoration: underline; text-decoration-color: var(--ink-5, #bdbdb7); text-underline-offset: 2px; }
.wxu__bars { display: grid; grid-template-columns: 6.5em minmax(0, 1fr); gap: 4px 10px; align-items: center; max-width: 360px; margin: 8px auto 2px; text-align: left; }
.wxu__lab { font-size: 12.5px; color: var(--ink-3, #686862); white-space: nowrap; }
.wxu-bar { display: block; width: 100%; height: 12px; }
.wxu-bar .t-track { fill: var(--line, #e7e7e2); } .wxu-bar .t-band { fill: var(--blue, #1d68a3); } .wxu-bar .t-med { stroke: var(--ink-0, #191919); stroke-width: 2; fill: none; }
.wxu__axis { grid-column: 2; position: relative; height: 16px; font-size: 11.5px; color: var(--ink-3, #686862); font-variant-numeric: tabular-nums; }
.wxu__axis span { position: absolute; top: 0; transform: translateX(-50%); }
.wxu__axis span:first-child { transform: none; } .wxu__axis span:last-child { transform: translateX(-100%); }

/* Where this team plays (registry section 34): flat, ink and blue, no box */
.wxid { margin: 0 0 16px; }
.wxid-lead { font: 700 15px/1.35 var(--font-ui, 'Archivo', system-ui); color: var(--ink, #222); margin: 0 0 6px; }
.wxid-body a, .wxid-lead a, .wxid-honesty a { color: inherit; text-decoration: underline; text-decoration-color: var(--ink-5, #bdbdb7); text-underline-offset: 3px; }
.wxid-body { font: 400 14px/1.45 var(--font-ui, 'Archivo', system-ui); color: var(--ink, #222); margin: 0 0 6px; }
.wxid .wxid__bars { margin: 8px 0 4px; max-width: 360px; }
.wxid-honesty { font: 400 12.5px/1.45 var(--font-ui, 'Archivo', system-ui); color: var(--ink-3, #686862); margin: 6px 0; }
.wxid .wx-credit { font: 400 12.5px/1.45 var(--font-ui, 'Archivo', system-ui); color: var(--ink-3, #686862); margin: 0; }
.wxid .wx-credit a { color: var(--ink-3, #686862); }


/* Turnover luck — specs/18 Phase 5 */

/* Turnover luck — specs/18 Phase 5 */
.tol{border:1px solid var(--line,#e4e4e1);
  border-radius:3px;padding:14px 16px 12px;margin:0 0 16px}
.tol-eyebrow{font:700 12.5px/1.3 var(--font-ui,'Archivo',system-ui);letter-spacing:.01em;
  color:var(--ink-3,#686862);margin:0 0 6px}
.tol-body{font:600 15px/1.4 'Archivo','Helvetica Neue',Arial,sans-serif;color:var(--ink,#222);margin:0 0 6px}
.tol-honesty{font:400 12px/1.4 var(--font-ui,'Archivo',system-ui);
  color:var(--fg-tertiary,#8b8b8b);margin:0}


/* Takeaway conversion — companion to turnover luck */

/* Takeaway conversion — companion to turnover luck */
.tkc{border:1px solid var(--line,#e4e4e1);
  border-radius:3px;padding:14px 16px 12px;margin:0 0 16px}
.tkc-eyebrow{font:700 12.5px/1.3 var(--font-ui,'Archivo',system-ui);letter-spacing:.01em;
  color:var(--ink-3,#686862);margin:0 0 6px}
.tkc-body{font:600 15px/1.4 'Archivo','Helvetica Neue',Arial,sans-serif;color:var(--ink,#222);margin:0 0 6px}
.tkc-honesty{font:400 12px/1.4 var(--font-ui,'Archivo',system-ui);
  color:var(--fg-tertiary,#8b8b8b);margin:0}


/* Penalty discipline — companion to turnover luck */

/* Penalty discipline — companion to turnover luck */
.pdi{border:1px solid var(--line,#e4e4e1);
  border-radius:3px;padding:14px 16px 12px;margin:0 0 16px}
.pdi-eyebrow{font:700 12.5px/1.3 var(--font-ui,'Archivo',system-ui);letter-spacing:.01em;
  color:var(--ink-3,#686862);margin:0 0 6px}
.pdi-body{font:600 15px/1.4 'Archivo','Helvetica Neue',Arial,sans-serif;color:var(--ink,#222);margin:0 0 6px}
.pdi-honesty{font:400 12px/1.4 var(--font-ui,'Archivo',system-ui);
  color:var(--fg-tertiary,#8b8b8b);margin:0}


/* Ballot spread — AP voter spread, companion to turnover luck / penalty discipline */

/* Ballot spread — companion to turnover luck / penalty discipline */
.bsp{border:1px solid var(--line,#e4e4e1);
  border-radius:3px;padding:14px 16px 12px;margin:0 0 16px}
.bsp-eyebrow{font:700 12.5px/1.3 var(--font-ui,'Archivo',system-ui);letter-spacing:.01em;
  color:var(--ink-3,#686862);margin:0 0 6px}
.bsp-body{font:600 15px/1.4 'Archivo','Helvetica Neue',Arial,sans-serif;color:var(--ink,#222);margin:0 0 6px}
.bsp-honesty{font:400 12px/1.4 var(--font-ui,'Archivo',system-ui);
  color:var(--fg-tertiary,#8b8b8b);margin:0}


/* Player Stats Table — Tape tab individual stats (doc 97 P6) */

/* Player Stats Table — Tape tab (doc 97 P6) */
.pst-section{margin:.5rem 0 1.5rem}
/* The module's only heading ("Player stats — 2026 season"), set as a plain
   sentence-case label (DESIGN.md Label role), not a tracked eyebrow. */
.pst-eyebrow{font:700 12.5px/1.3 Archivo,sans-serif;letter-spacing:.01em;
  color:var(--ink-3,#686862);margin-bottom:.6rem}

/* Inner tab bar -- tabs are text with a 2px ink underline on the active one */
.pst-tabs{display:flex;border-bottom:2px solid var(--stroke-default,#e4e4e1);
  margin-bottom:.9rem;overflow-x:auto;scrollbar-width:none}
.pst-tabs::-webkit-scrollbar{display:none}
.pst-tab{flex:none;padding:7px 16px;font:600 12.5px/1 Archivo,sans-serif;
  color:var(--fg-secondary,#5b5b5b);background:none;border:none;
  border-bottom:2px solid transparent;cursor:pointer;white-space:nowrap;
  margin-bottom:-2px;transition:opacity .1s ease-in}
.pst-tab--active{color:var(--ink,#222);
  border-bottom-color:var(--ink,#222)}
.pst-tab:hover:not(.pst-tab--active){opacity:.75}

/* Position group */
.pst-group{margin-bottom:1.4rem}
.pst-group-hdr{font:700 12.5px/1.2 Archivo,sans-serif;letter-spacing:.01em;
  color:var(--ink-3,#686862);
  border-bottom:1px solid var(--stroke-default,#e4e4e1);
  padding:.25rem 0;margin-bottom:.35rem}

/* Horizontal-scroll wrapper */
.pst-table-wrap{overflow-x:auto;-webkit-overflow-scrolling:touch}
/* Phone: the columns a fan reads first (yards, TD, INT, rate) fit the screen; jersey number, percentage, per-attempt and
   model columns stay on desktop (team-page scan 2026-10-13: the passing table was 699px wide in a 358px box, TD and INT off screen). */
.pst-table{border-collapse:collapse;width:100%;min-width:480px;
  font:400 .8rem/1.3 Archivo,system-ui,sans-serif}

/* Headers -- sentence case, 12px 700 Caption Gray (DESIGN.md Tables) */
.pst-th{font:700 .8rem/1 Archivo,sans-serif;letter-spacing:.01em;
  color:var(--ink-3,#686862);padding:.3rem .5rem;
  border-bottom:2px solid var(--stroke-default,#e4e4e1);
  white-space:nowrap;text-align:right;background:var(--bg-0,#fff)}
.pst-name-col{text-align:left!important;position:sticky;left:0;
  background:var(--bg-0,#fff)!important;z-index:2;
  min-width:120px;max-width:175px}
.pst-sortable{cursor:pointer;user-select:none;transition:opacity .1s ease-in}
.pst-sortable:hover{opacity:.8}
.pst-th--sorted{color:var(--ink,#222)!important}

/* Data rows */
.pst-row{border-bottom:1px solid rgba(0,0,0,.05)}
.pst-row:hover{background:var(--row,#f7f7f6)}
.pst-leader td,.pst-leader .pst-name-col{background:rgba(29,104,163,.035)!important}
.pst-td{padding:.38rem .5rem;text-align:right;white-space:nowrap;
  color:var(--fg-primary,#222);vertical-align:top;
  font-variant-numeric:tabular-nums}
.pst-td.pst-name-col{text-align:left;position:sticky;left:0;
  background:var(--bg-0,#fff);z-index:1}

/* Player name button */
.pst-name-btn{background:none;border:none;padding:0;
  font:800 .8rem/1.25 Archivo Head,Archivo,Helvetica Neue,Arial,sans-serif;
  color:var(--fg-primary,#222);cursor:pointer;text-align:left;
  transition:opacity .1s ease-in}
.pst-name-btn:hover{opacity:.8}

/* Archetype + EPA sub-line */
.pst-subline{font:400 .8rem/1.4 Archivo,sans-serif;
  color:var(--fg-tertiary,#8b8b8b);display:block;margin-top:2px}
.pst-subline em{font-style:normal;font-weight:500}
.pst-epa-pos{color:var(--green,#3a7a4b);font-weight:600}
.pst-epa-neg{color:var(--red,#bf3b31);font-weight:600}

/* National rank ("#7 FBS") -- a plain word, not a badge: an FBS rank is
   something we measure, so the top 25 read in Measured Blue, the rest in
   Caption Gray. */
.pst-rnk{display:inline-block;font:600 12px/1 Archivo,sans-serif;
  white-space:nowrap;color:var(--ink-3,#686862)}
.pst-rnk-green{color:var(--blue,#1d68a3);font-weight:700}
.pst-rnk-blue{color:var(--blue,#1d68a3)}
.pst-rnk-grey{color:var(--ink-3,#686862)}
.pst-rank-line{display:block;margin-top:2px}

/* Inline bar */
.pst-bar-col{width:72px;min-width:72px;padding:.38rem .35rem!important}
.pst-bar-track{background:rgba(0,0,0,.08);border-radius:1px;height:5px;
  margin:7px 0;overflow:hidden;min-width:60px}
.pst-bar-fill{height:100%;background:var(--blue,#1d68a3);border-radius:1px}

/* Sparkline expand row */
.pst-exp-row{background:#f7f7f6}
.pst-exp-cell{padding:.5rem .75rem}
.pst-spark-wrap{display:flex;align-items:center;gap:.6rem}
.pst-spark-lbl{font:.63rem/1 Archivo,sans-serif;
  color:var(--fg-tertiary,#8b8b8b);white-space:nowrap}
.pst-spark rect{opacity:.82}
.pst-empty{font:.78rem/1.4 Archivo,sans-serif;
  color:var(--fg-tertiary,#8b8b8b);padding:.5rem 0;margin:0}

/* Archetype label in the name-cell subline (colored, no italic — replaces
   the old bare <em> treatment) */
.pst-arch-label{font-weight:600;font-style:normal}

/* Archetype drawer — appears inside the sparkline expand row, tiered depth
   (full/mid/minimal). The row is a hard hidden-attribute toggle (JS just
   flips .hidden) and the card renders complete and still when it opens: the
   spring-eased entrance and the archetype-coloured side stripe retired with
   DESIGN.md (2026-09-28). */
.pst-arch{padding:.1rem 0 .3rem 1rem;margin:.4rem 0 .1rem;
  display:flex;flex-direction:column;gap:.7rem;max-width:520px}
.pst-arch-h{font:600 1.2rem/1.2 Archivo,Helvetica Neue,Arial,sans-serif;margin:0 0 .15rem;
  text-wrap:balance}
.pst-arch-desc{font:400 .82rem/1.5 Archivo,sans-serif;
  color:var(--fg-secondary,#5b5b5b);margin:0;max-width:56ch}
.pst-arch-standing{font:400 .8rem/1.4 Archivo,sans-serif;
  color:var(--fg-tertiary,#8b8b8b);margin:.3rem 0 0}
.pst-arch-claim{font:400 .8rem/1.5 Archivo,sans-serif;
  color:var(--fg-secondary,#5b5b5b);margin:0}
.pst-arch-claim strong{color:var(--fg-primary,#222);font-weight:600}
.pst-arch-take{font:400 .8rem/1.5 Archivo,sans-serif;
  color:var(--fg-secondary,#5b5b5b);margin:0}
.pst-arch-slabel{display:block;font:600 .8rem/1.2 Archivo,sans-serif;
  letter-spacing:.01em;
  color:var(--fg-muted,#8b8b8b);margin:0 0 .4rem}

/* Style-lane beat-1 tag (research §22.2/§22.3) — words beside the leaf label
   ("Pocket Passer · Gunslinger"), not a chip: Archivo 600, sentence case,
   ink-2, no border, no fill (labels are words, DESIGN.md 2026-09-28). Quieter
   than "the rare part" lead-in and far quieter than the gold two-way star
   (R9.1). Renders at every drawer tier a style modifier fires -- a tag is
   beat-1 identity, not a beat-3 twist, so it never needs the "full"-tier
   promotion the receipts/radar do. */
.pst-arch-style-tag{display:inline-block;margin-left:.4rem;
  font:600 .8rem/1.2 Archivo,sans-serif;color:var(--fg-secondary,#5b5b5b);
  vertical-align:middle}
/* The style signature phrase -- only ever a second line when the card has
   no twist (rule 1, §22.5), so it never has to share the card with a
   compound/flaw sentence. Same voice as pst-arch-desc, one notch quieter. */
.pst-arch-style-phrase{font:400 .8rem/1.5 Archivo,sans-serif;
  color:var(--fg-tertiary,#8b8b8b);margin:0;max-width:56ch}

/* "The rare part" — additive compound-excellence callout (fable §19.4 /
   R4.2A). Lead-in is Archivo 600 ink inline (NOT an eyebrow, no badge/fill/
   border accent — the two full receipt bars below ARE the badge, per the
   R5.2 unification ruling: this is a label over the existing bars, not a
   second bar system). */
.pst-rare{font:400 .82rem/1.5 Archivo,sans-serif;color:var(--fg-secondary,#5b5b5b);
  margin:0;max-width:56ch}
.pst-rare__lead{font-weight:600;color:var(--fg-primary,#222)}
.pst-rare__clause{font-weight:400}

/* Receipts (percentile bars) — ONE Savant red→grey→blue value ramp for every
   bar on this card (fable R5.2/R5.4): replaces the old red/gold/green
   threshold fill so a compound bar and a flaw bar never disagree about what
   color means. The bars render at their value; the scaleX grow-in retired
   with DESIGN.md's "at rest, complete and still" (2026-09-28). */
.pst-arch-receipts{display:flex;flex-direction:column;gap:.6rem;max-width:380px}
.pst-rr-top{display:flex;justify-content:space-between;align-items:baseline;
  gap:.5rem;margin-bottom:.2rem}
.pst-rr-name{font:600 .8rem/1.2 Archivo,sans-serif;color:var(--fg-primary,#222)}
.pst-rr-val{font:800 1rem/1 Archivo,sans-serif;font-variant-numeric:tabular-nums;
  color:var(--fg-primary,#222);white-space:nowrap}
.pst-rr-track{background:var(--panel,#f1f1ec);border-radius:2px;height:8px;
  overflow:hidden}
.pst-rr-fill{height:100%;border-radius:2px}
.pst-rr-cap{margin-top:.25rem;font:400 .8rem/1.4 Archivo,sans-serif;
  color:var(--fg-tertiary,#8b8b8b)}

/* Trait fingerprint radar */
.pst-arch-radar{display:flex;flex-direction:column;align-items:flex-start}
.radar-svg{display:block;flex:none;margin-top:.35rem}

/* Plays-like comps -- a list of linked names with their avatars, not a row
   of boxed chips (DESIGN.md: a row of three or more boxes is a list) */
.pst-arch-comps{display:flex;flex-wrap:wrap;gap:.5rem 1rem}
.pst-arch-comp{display:flex;align-items:center;gap:.5rem;
  text-decoration:none;transition:opacity .1s ease-in}
.pst-arch-comp:hover{opacity:.7}
.pst-arch-comp-mono{width:26px;height:26px;border-radius:50%;flex:none;
  display:flex;align-items:center;justify-content:center;overflow:hidden;
  background:var(--bg-0,#fff);border:1px solid var(--stroke-default,#e4e4e1)}
.pst-arch-comp-mono img{width:100%;height:100%;object-fit:contain;display:block}
.pst-arch-comp-name{font:600 .8rem/1.2 Archivo,sans-serif;
  color:var(--fg-primary,#222);display:block}
.pst-arch-comp-meta{font:400 .8rem/1.2 Archivo,sans-serif;
  color:var(--fg-tertiary,#8b8b8b);display:block;margin-top:1px}

/* Minimal-tier local fact */
.pst-arch-local{font:400 .8rem/1.5 Archivo,sans-serif;
  color:var(--fg-secondary,#5b5b5b);margin:0}

/* The flaw note — additive, subordinate, always LAST (§20.5/R4.2B). One
   hairline above it, plain words (the `~our read` tag retired with D-144),
   body-sm ink-2, ONE bar on the same Savant ramp as everything else — no
   alert/status styling. The quietness is the point: strength gets two loud
   bars, the worry gets one small dim one. */
.pst-flaw{border-top:1px solid var(--stroke-default,#e4e4e1);
  padding-top:.6rem;margin-top:.1rem;display:flex;flex-direction:column;gap:.5rem}
.pst-flaw__line{font:400 .8rem/1.5 Archivo,sans-serif;
  color:var(--fg-secondary,#5b5b5b);margin:0;display:flex;align-items:baseline;
  gap:.4rem;flex-wrap:wrap}
.pst-flaw__body{color:var(--fg-secondary,#5b5b5b)}
.pst-flaw__bar{max-width:380px}
/* .pst-style-concern (§22.4, ball_security) reuses .pst-flaw/.pst-flaw__line/
   .pst-flaw__body verbatim -- same quiet register -- and simply
   never emits a .pst-flaw__bar child (no z-score to bar). No bespoke rule
   needed here; the marker class exists only so the concern block is
   greppable/testable as its own thing. Never renders alongside .pst-flaw on
   the same card: the QB-only flaw and the RB-only ball_security concern are
   disjoint pools by construction (§22.5). */

/* Footer player-page link — present on every tier */
.pst-arch-link{display:inline-flex;align-items:center;gap:.35rem;
  font:600 .8rem/1.2 Archivo,sans-serif;color:var(--blue,#1d68a3);
  text-decoration:none;transition:opacity .1s ease-in}
.pst-arch-link:hover{opacity:.7}
.pst-arch-link svg{width:12px;height:12px}

@media(max-width:480px){
  .pst-table{min-width:0}
  .pst-th{padding:.25rem .25rem;font-size:.8rem;white-space:normal}
  .pst-td{padding:.3rem .25rem;font-size:.8rem}
  .pst-name-col{min-width:100px;max-width:110px;white-space:normal}
  .pst-subline{white-space:normal}
  .pst-rnk{font-size:.8rem}
  .pst-x,.pst-bar-col{display:none}
  .pst-arch{max-width:100%}
}


/* Watch forecast — doc 97 §13 season preview card (Now tab) */

/* Watch forecast card — doc 97 §13 */
.wf{border:1px solid var(--line,#e4e4e1);
  border-radius:3px;padding:14px 16px 12px;margin:0 0 16px}
.wf-eyebrow{font:700 12.5px/1.3 var(--font-ui,'Archivo',system-ui);letter-spacing:.01em;
  color:var(--ink-3,#686862);margin:0 0 6px}
.wf-opener{font:600 18px/1.3 'Archivo','Helvetica Neue',Arial,sans-serif;color:var(--ink,#222);margin:0 0 3px}
.wf-sub{font:400 12.5px/1 var(--font-ui,'Archivo',system-ui);
  color:var(--fg-secondary,#5b5b5b);margin:0 0 10px}
.wf-line{display:flex;align-items:baseline;flex-wrap:wrap;gap:6px;margin:0 0 10px}
.wf-line-label{font:400 12px/1 var(--font-ui,'Archivo',system-ui);
  color:var(--fg-secondary,#5b5b5b)}
.wf-line-val{font:600 18px/1 'Archivo','Helvetica Neue',Arial,sans-serif;color:var(--ink,#222)}
.wf-line-price{font:700 12px/1 var(--font-ui,'Archivo',system-ui);
  color:var(--fg-secondary,#5b5b5b)}
.wf-axes{display:flex;flex-wrap:wrap;margin:0 0 10px}
.wf-axis{font:500 12.5px/1.3 var(--font-ui,'Archivo',system-ui);color:var(--ink-3,#686862)}
.wf-axis + .wf-axis::before{content:"·";margin:0 6px;color:#8b8b85}
.wf-honesty{font:400 12px/1.4 var(--font-ui,'Archivo',system-ui);
  color:var(--fg-tertiary,#8b8b8b);margin:0}
@media(max-width:460px){
  .wf-opener{font-size:16px}
  .wf-line-val{font-size:16px}
}


/* Program résumé — doc 97 §13 all-time facts card (History tab) */

/* Program résumé card — doc 97 §13. DESIGN.md (2026-09-28): the title is a
   sentence-case label, untracked; values are ink (team colour lives in the
   logo only), gold only for the Heisman count (an honor = what people vote). */
.pf-section{margin:0 0 20px}
.pf-eyebrow{font:700 12.5px/1.3 var(--font-ui,'Archivo',system-ui);letter-spacing:.01em;
  color:var(--fg-tertiary,#686862);margin:0 0 10px}
.pf-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(88px,1fr));
  gap:1px;background:var(--line,#e4e4e1);
  border:1px solid var(--line,#e4e4e1);border-radius:3px 3px 0 0;overflow:hidden}
.pf-grid--solo{border-radius:3px}
.pf-cell{background:var(--page,#fff);padding:12px 8px 10px;text-align:center}
.pf-val{display:block;font:600 22px/1 'Archivo','Helvetica Neue',Arial,sans-serif;
  color:var(--ink,#222);margin:0 0 4px}
.pf-val--team{color:var(--ink,#222)}
.pf-val--gold{color:#8a6200}
.pf-lbl{display:block;font:700 12px/1 var(--font-ui,'Archivo',system-ui);
  letter-spacing:.01em;color:var(--fg-tertiary,#8b8b8b)}
.pf-meta{display:flex;flex-wrap:wrap;gap:1px;
  background:var(--line,#e4e4e1);
  border:1px solid var(--line,#e4e4e1);border-top:none;
  border-radius:0 0 3px 3px;overflow:hidden}
.pf-meta-cell{flex:1 1 140px;background:var(--page,#fff);padding:9px 10px}
.pf-meta-lbl{display:block;font:700 12px/1 var(--font-ui,'Archivo',system-ui);
  letter-spacing:.01em;
  color:var(--fg-tertiary,#8b8b8b);margin-bottom:3px}
.pf-meta-val{display:block;font:400 13px/1.3 var(--font-ui,'Archivo',system-ui);
  color:var(--ink,#222);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
@media(max-width:400px){.pf-grid{grid-template-columns:repeat(3,1fr)}}


/* Sentiment River — fan memory visualization (Phase 0) */

/* Sentiment River — fan memory visualization (river.builder + sentiment-river.js) */
.sr-section{padding:20px 0 12px}
.sr-eyebrow{font:700 12.5px/1.3 var(--font-ui,'Archivo',system-ui);
  letter-spacing:.01em;color:var(--ink,#222);
  margin-bottom:8px}
/* Season selector (a control: squared, active option in solid ink) */
.sr-seasons{display:flex;gap:4px;margin-bottom:8px;flex-wrap:wrap}
.sr-stab{
  font:700 12px/1 'Archivo',system-ui;
  padding:3px 9px;border:1px solid #d9d9d3;border-radius:2px;
  background:#fff;color:#686862;cursor:pointer;
  transition:opacity .1s ease-in;
}
.sr-stab:hover{opacity:.8}
.sr-stab.active{border-color:#222;color:#fff;background:#222}
.sr-lede{font:400 12px/1.5 var(--font-ui,'Archivo',system-ui);
  color:var(--fg-secondary,#666);margin-bottom:4px}
.sr-provenance{font:400 12px/1.5 var(--font-ui,'Archivo',system-ui);
  color:var(--fg-tertiary,#8b8b8b);margin-bottom:8px}
[data-sentiment-river]{position:relative;width:100%}
.sr-loading{font:400 12px/1 'Archivo',system-ui;color:#999;padding:8px 0}
.sr-empty{font:400 12px/1.5 'Archivo',system-ui;color:#999;padding:8px 0}
/* Tooltip */
.sr-tooltip{
  position:absolute;top:4px;left:0;
  background:#fff;border:1px solid #e0e0e0;
  padding:7px 10px;
  font:400 12px/1.5 'Archivo',system-ui;
  pointer-events:none;display:none;
  z-index:20;max-width:220px;
}
/* Week card */
.sr-week-card{
  margin-top:8px;padding:12px 16px;
  background:#f9f9f9;border:1px solid #e4e4e1;
  border-radius:3px;position:relative;
  font:400 12px/1.5 'Archivo',system-ui;
}
.sr-wc-header{font-weight:600;margin-bottom:6px;line-height:1.4}
.sr-wc-week{font:700 13px/1 'Archivo',system-ui;color:#222}
.sr-wc-result{margin-left:6px;font-weight:700}
.sr-win{color:#3a7a4b}.sr-loss{color:#bf3b31}
.sr-wc-opp{margin-left:4px;color:#555}
.sr-wc-venue,.sr-wc-weather,.sr-wc-noGame{
  margin-left:4px;color:#888;font-weight:400;font-size:12px}
.sr-wc-sentiment{margin:6px 0;color:#444}
.sr-wc-conv{color:#888;font-size:12px;margin-left:4px}
.sr-wc-receipt{
  margin:10px 0 6px;padding:0;
  color:#333;
  font-size:12px;line-height:1.55;
}
/* A quote gets a short Talk Gold rule above it, never a side stripe. */
.sr-wc-receipt::before{content:"";display:block;width:40px;height:3px;
  background:var(--gold,#b7851a);margin:0 0 8px}
.sr-wc-receipt cite{
  display:block;margin-top:4px;
  font-style:normal;font-size:12px;
  color:#888;font-weight:600;letter-spacing:.01em
}
/* The words fans used that week: a plain list, not a row of chips. */
.sr-wc-terms{display:flex;gap:0 6px;flex-wrap:wrap;margin-top:6px}
.sr-wc-term{
  font:500 12.5px/1.4 'Archivo',system-ui;
  color:#686862;
}
.sr-wc-term + .sr-wc-term::before{content:"·";margin-right:6px;color:#8b8b85}
.sr-wc-close{
  position:absolute;top:8px;right:10px;
  background:none;border:none;
  font-size:18px;color:#686862;cursor:pointer;
  padding:0;line-height:1;transition:opacity .1s ease-in
}
.sr-wc-close:hover{opacity:.7}


/* Fever Year river v2 — position-as-sentiment, emotion-hue, logo rails */
.srv2-section .sr-lede{color:var(--fg-secondary,#666)}
[data-sentiment-river-v2]{position:relative}
.srv2-controls{display:flex;align-items:center;gap:8px;margin:0 0 8px}
.srv2-ctl-lbl{font:700 12px/1 'Archivo',system-ui;letter-spacing:.01em;color:#8b8b8b}
.srv2-lens{font:600 12.5px/1 'Archivo',system-ui;padding:7px 28px 7px 11px;border:1px solid #d3d2cb;border-radius:3px;background:#fff;color:#222;cursor:pointer;-webkit-appearance:none;appearance:none;background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='10' height='7'><path d='M1 1l4 4 4-4' fill='none' stroke='%236f6f6a' stroke-width='1.6'/></svg>");background-repeat:no-repeat;background-position:right 10px center}
.srv2-svg{width:100%;height:auto;display:block;overflow:visible}
.srv2-axis{font:600 12px/1 'Archivo',system-ui;fill:#9a9a94;letter-spacing:.01em}
.srv2-score{font:700 12px/1 'Archivo',system-ui;fill:#5a5a56;font-variant-numeric:tabular-nums}
.srv2-mk{cursor:pointer;transition:opacity .1s ease-in}
.srv2-mk:hover{opacity:.8}
.srv2-cap{margin-top:8px;min-height:20px;font:400 13px/1.45 'Archivo',system-ui;color:#6f6f6a;border-top:1px solid #e4e3dd;padding-top:8px}
.srv2-cap.srv2-empty2{color:#9a9a94}
.srv2-empty{color:#9a9a94;padding:8px 0;font:400 12px/1 'Archivo',system-ui}
.srv2-dossier{margin-top:14px;display:grid;grid-template-rows:0fr;opacity:0;transition:grid-template-rows .35s ease,opacity .25s}
.srv2-dossier.open{grid-template-rows:1fr;opacity:1}
.srv2-dossier > *{overflow:hidden;min-height:0}
.srv2-doshead{display:flex;flex-direction:column;gap:4px;border:1px solid #e4e3dd;border-bottom:none;border-radius:3px 3px 0 0;background:#f5f5f2;padding:16px 20px 12px}
.srv2-doshead-row{display:flex;justify-content:space-between;align-items:baseline}
.srv2-dostitle{font-family:'Archivo','Helvetica Neue',Arial,sans-serif;font-size:20px;font-weight:600}
.srv2-w{color:#3a7a4b}.srv2-l{color:#bf3b31}
/* River YAML overrides (Phase 3): rivalry/venue meta lines + moment note band */
.srv2-dosmeta{font:400 12px/1.4 'Archivo',system-ui;color:#6f6f6a}
.srv2-dosnote{border:1px solid #e4e3dd;background:#fff;
  font:400 13px/1.5 'Archivo',system-ui;color:#3c3c3c;padding:12px 20px}
.srv2-dosnote-src{display:block;margin-top:4px;font-size:12px;color:#9a9a94}
.srv2-close{cursor:pointer;border:1px solid #d3d2cb;background:#fff;border-radius:3px;font:600 12px/1 'Archivo',system-ui;padding:5px 9px;color:#6f6f6a}
.srv2-dosgrid{display:grid;grid-template-columns:210px 1fr;gap:22px;border:1px solid #e4e3dd;border-top:none;border-radius:0 0 3px 3px;background:#f5f5f2;padding:16px 20px 18px}
.srv2-lab{font:700 12px/1 'Archivo',system-ui;letter-spacing:.01em;color:#9a9a94;margin-bottom:9px}
.srv2-emo{display:grid;grid-template-columns:56px 1fr 60px;gap:8px;align-items:center;font:400 12px/1 'Archivo',system-ui;margin-bottom:6px}
.srv2-emo.hot span:first-child{font-weight:800}
.srv2-track{height:9px;background:#e6e5df;border-radius:3px;overflow:hidden}
.srv2-track>i{display:block;height:100%;width:100%;transform-origin:left}
.srv2-pv{text-align:right;color:#6f6f6a;font-size:12px}
.srv2-mult{color:#9a9a94}
.srv2-note{font:400 12px/1.45 'Archivo',system-ui;color:#6f6f6a;margin-top:9px}
.srv2-conv{font:400 12px/1.4 'Archivo',system-ui;color:#6f6f6a;margin-top:9px}
.srv2-quote{padding:2px 0;margin:0 0 10px;font:400 13.5px/1.5 'Archivo',system-ui;color:#2a2a2a}
.srv2-quote::before{content:"";display:block;width:40px;height:3px;background:var(--gold,#b7851a);margin:0 0 8px}
.srv2-quote span{display:block;margin-top:4px;font-size:12px;color:#9a9a94}
.srv2-related{margin-top:6px;font-size:12px}
.srv2-storyon .srv2-mk{transition:opacity .5s ease}
.srv2-storyon .srv2-mk.srv2-dim{opacity:.16}
/* Moments are SEASON-level landmarks, not chapter-local detail — the ★ signature
   win is the shape of the whole year, and you should be able to see where the
   season's peaks sit while reading any chapter. The 0.16 dim above is right for
   game dots but erased every moment on load: the guided scroll always opens on
   Chapter 1 ("The season begins"), and the big moments are essentially never in
   Chapter 1. Recede them, never below legible. */
.srv2-storyon .srv2-mk.srv2-moment.srv2-dim{opacity:.55}
.srv2-focus{fill:rgba(34,34,34,.05);stroke:rgba(34,34,34,.14);stroke-width:1;transition:transform .7s cubic-bezier(.4,0,.15,1),opacity .4s;transform-origin:0 0;opacity:0}
.srv2-playhead{transition:cx .6s cubic-bezier(.4,0,.15,1),cy .6s cubic-bezier(.4,0,.15,1),opacity .4s;stroke:#fff;stroke-width:1.5;opacity:0}
.srv2-story{margin-top:14px}
.srv2-story-card{border:1px solid #e4e3dd;border-radius:3px;background:#faf9f6;padding:15px 18px;min-height:92px}
.srv2-story-eyebrow{font:700 12px/1 'Archivo',system-ui;letter-spacing:.01em;color:var(--accent,#9a9a94);margin-bottom:6px}
.srv2-story-title{font-family:'Archivo','Helvetica Neue',Arial,sans-serif;font-size:19px;font-weight:600;margin-bottom:8px;line-height:1.15}
.srv2-story-chip{display:inline-block;font:600 12.5px/1.4 'Archivo',system-ui;color:#444;margin-bottom:2px}
.srv2-story-quote{margin:8px 0 0;padding:0;font:400 14px/1.5 'Archivo',system-ui;color:#2a2a2a}
.srv2-story-quote::before{content:"";display:block;width:40px;height:3px;background:var(--gold,#b7851a);margin:0 0 8px}
.srv2-story-quote span{display:block;margin-top:4px;font-size:12px;color:#9a9a94}
.srv2-story-nav{display:flex;align-items:center;gap:12px;margin-top:10px}
.srv2-prev,.srv2-next{font-size:13px;border:1px solid #d3d2cb;background:#fff;border-radius:3px;width:30px;height:26px;cursor:pointer;color:#444;transition:opacity .1s ease-in}
.srv2-prev:hover,.srv2-next:hover{opacity:.8}
.srv2-dots{display:flex;gap:7px;flex:1;justify-content:center}
.srv2-dot{width:8px;height:8px;border-radius:50%;border:0;background:#d3d2cb;cursor:pointer;padding:0;transition:background .3s}
.srv2-dot.on{background:#222}
@media(prefers-reduced-motion:reduce){.srv2-focus,.srv2-playhead,.srv2-storyon .srv2-mk,.srv2-dot{transition:none}}
/* offseason ledger (12-month layout) */
.srv2-oband{fill:#e9e8e1;opacity:.85}
.srv2-kick{fill:#a7a69f;letter-spacing:.01em}
.srv2-oglyph{font:700 13px/1 'Archivo',system-ui}
.srv2-omk polygon,.srv2-omk rect{transition:filter .15s}
.srv2-ologo{width:26px;height:26px;object-fit:contain;vertical-align:-7px;margin-right:8px}
.srv2-osub{font:400 13px/1.45 'Archivo',system-ui;color:#2a2a2a;margin-bottom:6px}
.srv2-odate{font:600 12px/1 'Archivo',system-ui;letter-spacing:.01em;color:#9a9a94;margin-bottom:12px}
.srv2-odrow{display:flex;justify-content:space-between;gap:12px;font:400 12.5px/1.5 'Archivo',system-ui;color:#3a3a36;border-bottom:1px solid #ecebe4;padding:4px 0}
.srv2-odrow span{color:#9a9a94;font-size:12px;text-align:right;white-space:nowrap}
.srv2-mglyph{font:700 15px/1 'Archivo',system-ui;paint-order:stroke;stroke:#fff;stroke-width:2.5px;stroke-linejoin:round}
.srv2-moment{cursor:pointer}
.srv2-mombadge{display:inline-block;font:700 12.5px/1 'Archivo',system-ui;margin-left:10px;vertical-align:2px}
.srv2-legend{display:flex;flex-wrap:wrap;align-items:center;gap:6px 14px;margin-top:8px;font:400 12px/1 'Archivo',system-ui;color:#6f6f6a}
.srv2-leg-lbl{font:700 12px/1 'Archivo',system-ui;letter-spacing:.01em;color:#9a9a94}
.srv2-leg-item{display:inline-flex;align-items:center;gap:5px}
.srv2-leg-item i{font-style:normal;font-size:13px;line-height:1}
.srv2-leg-note{color:#9a9a94;margin-left:auto}
@media(max-width:680px){.srv2-leg-note{margin-left:0;flex-basis:100%}}
@media(max-width:680px){.srv2-dosgrid{grid-template-columns:1fr}}


/* Rivalry Face-Off river — river family Package 3 (v1 static) */

.hero-river-block{margin:0 0 8px}
.hero-title{font-family:'Archivo','Helvetica Neue',Arial,sans-serif;font-weight:600;font-size:1.1rem;margin:0 0 4px}
.hero-dek{font-size:12.5px;color:var(--ink-2,#5b5b5b);margin:0 0 10px;display:flex;align-items:center;gap:6px;flex-wrap:wrap}
.cfb-hero-river{display:block;width:100%;height:auto;max-width:900px}
.cfb-hero-river .hr-mk{cursor:pointer}
.cfb-hero-river .hr-mk:focus{outline:2px solid var(--ink,#222222);outline-offset:2px}
.hero-cap{margin-top:8px;min-height:20px;font:400 13px/1.45 'Archivo',system-ui,sans-serif;color:var(--ink,#222222)}
.hero-cap.hero-cap-empty{color:var(--ink-3,#8b8b8b);font-style:italic}
.hero-foot{font-size:11.5px;color:var(--ink-3,#8b8b8b);margin:6px 0 0}


/* Related-content chips — arcs/storylines crosslink inside a river week card */

.rc-chips{display:flex;gap:4px 16px;flex-wrap:wrap;margin-top:8px}
.rc-chip{font:600 12.5px/1.3 var(--font-ui,'Archivo',system-ui);
  color:var(--blue,#1d68a3);text-decoration:underline;text-underline-offset:2px;
  text-decoration-color:var(--rule,#d9d9d3);letter-spacing:.01em;
  transition:opacity .1s ease-in}
.rc-chip:hover{opacity:.8}
.rc-chip[data-type="arc"]::before{content:"Arc: "}
.rc-chip[data-type="storyline"]::before{content:"Storyline: "}


/* Sentiment River guided-scroll — Season Storylines Tier 2 ("The Story") */

.srs-wrap{position:relative}
.srs-sticky{position:sticky;top:12px;z-index:1;background:var(--page,#fff)}
.srs-chapters{margin-top:-4px}
.srs-chapter{min-height:40vh;padding:24px 0;border-top:1px solid #eee;
  display:flex;flex-direction:column;justify-content:center}
.srs-chapter:first-child{border-top:none}
.srs-chapter-title{font:700 15px/1.3 'Archivo','Helvetica Neue',Arial,sans-serif;color:#222;margin:0 0 8px}
.srs-chapter-weeks{font:600 12px/1 var(--font-ui,'Archivo',system-ui);
  letter-spacing:.01em;color:#8b8b8b;margin-bottom:6px}
.srs-chapter-body{margin:10px 0 0;padding:0;color:#333;font-size:12.5px;line-height:1.55}
/* A quote gets a short Talk Gold rule above it, never a side stripe. */
.srs-chapter-body::before{content:"";display:block;width:40px;height:3px;
  background:var(--gold,#b7851a);margin:0 0 8px}
.srs-chapter-body cite{display:block;margin-top:4px;font-style:normal;
  font-size:12px;color:#888;font-weight:600;letter-spacing:.01em}
/* Hover PREVIEW disabled while a chapter is active -- pure CSS, scoped by
   the wrapper's data-active-chapter attribute. sentiment-river.js's own
   mousemove/click handlers are never modified or told this exists.
   Deliberately NOT pointer-events:none on the hit area: D-C requires that
   clicking to open a week card INSIDE a storyline's span still works (that
   click is what triggers the "Part of: <chapter> ->" membership chip) --
   only the hover-triggered tooltip/hairline/ghost-dot are suppressed, since
   those are the "two simultaneous highlight systems" the spec calls out as
   the actual scrollytelling failure mode, not click-to-open. */
.srs-wrap[data-active-chapter] [data-sentiment-river] .sr-tooltip{display:none !important}
.srs-wrap[data-active-chapter] [data-sentiment-river] svg line{opacity:0 !important}
.srs-wrap[data-active-chapter] [data-sentiment-river] svg circle[fill="#222"]{opacity:0 !important}
.srs-membership-chip{display:inline-block;font:600 12px/1 var(--font-ui,'Archivo',system-ui);
  color:#0072a8;text-decoration:none;margin:0 0 8px;cursor:pointer;transition:opacity .1s ease-in}
.srs-membership-chip:hover{opacity:.8}


/* Season Storylines panel — Tier 3 ("The Room") */

.stl-section{padding:16px 0 12px;border-top:1px solid #e4e4e1;margin-top:8px}
.stl-eyebrow{font:700 12.5px/1.3 var(--font-ui,'Archivo',system-ui);
  letter-spacing:.01em;color:var(--ink,#222);margin-bottom:10px}
.stl-flat{font:400 13px/1.5 var(--font-ui,'Archivo',system-ui);color:#888;padding:4px 0}
.stl-week{margin:0 0 16px;padding-bottom:14px;border-bottom:1px solid #eee}
.stl-week:last-child{border-bottom:none;margin-bottom:0;padding-bottom:0}
.stl-week-label{font:700 12px/1 'Archivo',system-ui;color:#222;margin-bottom:6px}
/* The week's words: a plain list, not a row of chips. */
.stl-terms{display:flex;gap:0 6px;flex-wrap:wrap;margin-bottom:8px}
.stl-term{font:500 12.5px/1.4 'Archivo',system-ui;color:#686862}
.stl-term + .stl-term::before{content:"·";margin-right:6px;color:#8b8b85}
.stl-quote{margin:0 0 6px;padding:0;color:#333;font-size:12px;line-height:1.55}
/* A quote gets a short Talk Gold rule above it, never a side stripe. */
.stl-quote::before{content:"";display:block;width:40px;height:3px;
  background:var(--gold,#b7851a);margin:0 0 8px}
.stl-quote cite{display:block;margin-top:4px;font-style:normal;font-size:12px;
  color:#888;font-weight:600;letter-spacing:.01em}
.stl-caption{font:400 12px/1.5 'Archivo',system-ui;color:#555;margin:0}


/* Belief EKG — doc 97 §11.2 annotated season sentiment arc */

/* Belief EKG — doc 97 §11.2 + Session J */
.bekg{padding:20px 0 8px}
.bekg-eyebrow{font:700 12.5px/1.3 var(--font-ui,'Archivo',system-ui);
  letter-spacing:.01em;color:var(--ink,#222);
  margin-bottom:8px}
.bekg-svg{display:block;width:100%;max-width:360px}
.bekg-meta{font:400 12px/1.4 var(--font-ui,'Archivo');
  color:var(--fg-tertiary,#8b8b8b);margin-top:6px}
.bekg-take{font:700 1.05rem/1.3 Archivo,system-ui,sans-serif;color:var(--ink,#222);margin:6px 0 8px}
.bekg-surprise{font:600 13.5px/1.4 Archivo,system-ui,sans-serif;color:#45453f;margin:0 0 8px}
.bekg-key{font:500 12px/1.4 Archivo,system-ui,sans-serif;color:#686862;margin:4px 0 0}

.bekg-yr-btn{all:unset;cursor:pointer;font:600 13px/1 Archivo,system-ui,sans-serif;color:#686862;margin-right:14px;padding:6px 0}

.bekg-yr-btn.active{color:var(--ink,#222);text-decoration:underline;text-underline-offset:3px}

.bekg-readout{font:500 13px/1.4 Archivo,system-ui,sans-serif;color:#45453f;margin:6px 0 0;min-height:2.8em}
.bekg-col{cursor:pointer}
.bekg-col:focus:not(:focus-visible){outline:none}
.bekg-col:focus-visible{outline:2px solid #1d68a3}
.bekg-legend{display:flex;gap:12px;margin-top:5px;align-items:center;flex-wrap:wrap}
.bekg-legend-dot{width:8px;height:8px;border-radius:50%;display:inline-block}
.bekg-legend-label{font:400 12px/1 var(--font-ui,'Archivo');
  color:var(--fg-tertiary,#8b8b8b)}
/* Season toggle buttons */
.bekg-seasons{display:flex;gap:0;margin-bottom:4px;flex-wrap:wrap}
.bekg-yr-btn:hover:not(.active){opacity:.7}
/* Season panels — only active panel visible */
.bekg-panel{display:none}
.bekg-panel.active{display:block}
/* Range sub-toggle */
.bekg-range{display:flex;gap:6px;margin:0 14px 5px}
.bekg-rng{font:500 12px/1 'Archivo',system-ui;padding:3px 9px;
  border-radius:2px;border:1px solid #d9d9d3;background:#fff;
  color:#444;cursor:pointer;transition:opacity .1s ease-in}
.bekg-rng.active{background:#222;color:#fff;border-color:#222}
.bekg-rng:hover:not(.active){opacity:.8}
/* Diamond legend icon for arc peaks */
.bekg-legend-diamond{width:9px;height:9px;background:#b7851a;display:inline-block;
  transform:rotate(45deg);flex-shrink:0;border:1px solid rgba(255,255,255,.7)}
/* Ghost prior-year lines */
.bekg-ghost-line{stroke:#c8c8c8;stroke-width:1.2;fill:none;
  stroke-linejoin:round;stroke-linecap:round;opacity:.55}
.bekg-legend-ghost{width:18px;height:2px;background:#c8c8c8;
  display:inline-block;vertical-align:middle;border-radius:1px}


.mood{margin:0 0 1.25rem;}
.mood-row{display:flex;gap:6px;align-items:stretch;}
.mood-col{flex:1 1 0;min-width:0;text-align:center;font-size:.8rem;line-height:1.25;}
.mood-plot{position:relative;height:88px;border-bottom:0;}
.mood-plot:before{content:"";position:absolute;left:0;right:0;top:44px;border-top:1px solid #d6d6d6;}
.mood-bar{position:absolute;left:22%;right:22%;background:var(--gold,#b7851a);border-radius:2px 2px 0 0;}
.mood-bar.neg{border-radius:0 0 2px 2px;}
.mood-few{position:absolute;left:0;right:0;top:34px;color:#6b6b6b;font-size:.8rem;}
.mood-res{font-weight:800;}
.mood-res.w{color:var(--win,#3a7a4b);}
.mood-res.l{color:var(--loss,#bf3b31);}
.mood-opp{color:#444;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.mood-key{color:#6b6b6b;font-size:.8rem;margin:.5rem 0 0;}
@media (min-width:900px){.mood-col{font-size:.8rem;}}


/* Belief history chip — historical high/low comparison (doc 97 Session F) */

/* Belief history chip — doc 97 Session F. DESIGN.md (2026-09-28): plain
   text with its arrow; no tinted box, no side stripe. The arrow keeps its
   green/red, paired with the arrow glyph. */
.bhc{
  display:flex;align-items:flex-start;gap:10px;
  margin:10px 0 4px;
  font-family:'Archivo',system-ui,sans-serif;
}
.bhc-arrow{font-size:18px;line-height:1.2;flex:0 0 auto}
.bhc-low .bhc-arrow,.bhc-below .bhc-arrow{color:var(--red,#bf3b31)}
.bhc-mid .bhc-arrow{color:#8b8b85}
.bhc-above .bhc-arrow,.bhc-high .bhc-arrow{color:var(--green,#3a7a4b)}
.bhc-body{min-width:0}
.bhc-text{font-size:13px;font-weight:600;color:#222;margin:0}
.bhc-sub{font-size:12.5px;font-weight:500;color:var(--ink-3,#686862);margin:2px 0 0}


/* Market divergence chip — fan mood vs. Vegas win total O/U */

/* Market divergence chip — fan vs. Vegas (team pages Now tab).
   DESIGN.md (2026-09-28): no team-colour side stripe. The verdict is ink:
   green means a win or an upward delta and blue means what we measure, and
   neither side here is either (fan mood and the market are both what people
   say or bet), so the words carry the direction. */
.mdc-wrap{
  border:1px solid rgba(34,34,34,.1);border-radius:3px;
  padding:14px 16px 12px;margin:12px 0;
  font-family:'Archivo',system-ui,sans-serif;
  background:var(--page,#fff);
}
.mdc-header{
  display:flex;justify-content:space-between;align-items:center;
  margin-bottom:12px;
}
.mdc-title{
  font-size:12.5px;font-weight:700;color:var(--ink-3,#686862);
  letter-spacing:.01em;
}
.mdc-dir{
  font-size:20px;font-weight:800;line-height:1;
  color:var(--ink-3,#686862);
}
.mdc-dir--fans{color:var(--ink,#222)}
.mdc-dir--mkt{color:var(--ink,#222)}
.mdc-dir--tied{color:#8b8b85}
.mdc-stats{
  display:grid;grid-template-columns:1fr 1fr;
  gap:0;margin-bottom:12px;
}
.mdc-stat{
  padding:0 12px;
}
.mdc-stat:first-child{
  border-right:1px solid rgba(34,34,34,.1);
  padding-left:0;
}
.mdc-stat__num{
  font-size:30px;font-weight:800;letter-spacing:-.04em;
  color:var(--ink);line-height:1;
  font-family:'Archivo',system-ui,sans-serif;
}
.mdc-stat__num sup{font-size:.45em;font-weight:700;vertical-align:super;letter-spacing:0}
.mdc-stat__label{
  font-size:12px;color:var(--ink-3,#888);margin-top:4px;line-height:1.3;
}
.mdc-verdict{
  font-size:12.5px;font-weight:600;color:var(--ink,#222);
  border-top:1px solid rgba(34,34,34,.08);
  padding-top:9px;line-height:1.4;
}
.mdc-verdict .fans-bull{color:var(--ink,#222);font-weight:700}
.mdc-verdict .mkt-bull{color:var(--ink,#222);font-weight:700}
.mdc-verdict .aligned{color:var(--ink-3,#686862)}
.mdc-foot{
  font-size:12px;color:var(--ink-3,#888);margin-top:3px;line-height:1.4;
}


/* Divergence chip — links to /topics/divergence/ when fanbase is 50/50 split */

/* Divergence chip (Session G) */
/* A plain line of words (DESIGN.md): no tint, side stripe or icon. */
.div-chip{margin:10px 0 4px;font-family:'Archivo',system-ui,sans-serif}
.div-chip-body{min-width:0}
.div-chip-text{font-size:13px;font-weight:600;color:#222;margin:0}
.div-chip-sub{font-size:12px;color:#686862;margin:2px 0 0}
.div-chip-sub a{color:#1d68a3;text-decoration:none}
.div-chip-sub a:hover{text-decoration:underline}


/* Fault Line — intra-fanbase divergence card (doc 94 §Tier-2) */
.tnote{font:500 12.5px/1.45 "Archivo","Helvetica Neue",Arial,sans-serif;
  color:var(--ink-3,#686862);letter-spacing:0;text-transform:none;white-space:nowrap}
.xp{border:1px solid var(--rule,#d7d7d4);border-radius:2px}
.xp-btn{width:100%;text-align:left;display:flex;align-items:center;justify-content:space-between;
  gap:10px;background:none;border:none;padding:10px 14px;
  font-family:"Archivo",system-ui,sans-serif;font-size:13.5px;font-weight:600;
  color:var(--ink,#222);cursor:pointer;transition:background .12s ease}
.xp-btn:hover{background:var(--row,#f7f7f6)}
.xp-chev{font-size:15px;flex:0 0 auto;transition:transform .2s ease;
  display:inline-block}
.xp.open .xp-chev{transform:rotate(180deg)}
.xp-body{display:grid;grid-template-rows:0fr;grid-template-columns:minmax(0,1fr);overflow:hidden;
  transition:grid-template-rows .24s ease}
.xp.open .xp-body{grid-template-rows:1fr}
.xp-inner{min-width:0;min-height:0;padding:0 14px}
.xp.open .xp-inner{padding:10px 14px 14px}
.hfoot{display:flex;flex-wrap:wrap;gap:4px 10px;font-size:11.5px;line-height:1.5;
  color:var(--ink-3,#8b8b8b);font-family:"Archivo",system-ui,sans-serif;
  font-variant-numeric:tabular-nums;border-top:1px solid var(--line,#e4e4e1);
  padding-top:6px;margin-top:8px}
.hfoot b{color:var(--ink-2,#5b5b5b);font-weight:600}.outlet-ic{width:12px;height:12px;flex-shrink:0}.fl-root{--blue:#1d68a3;--red:#bf3b31;--gold:#b7851a;--green:#3a7a4b;--ink:#222;--ink-2:#45453f;--ink-3:#686862;--line:#e7e7e2;--rule:#d9d9d3;--row:#f7f7f6;max-width:780px;margin:0 auto;padding:40px 24px 90px;font-family:"Archivo",system-ui,sans-serif;color:var(--ink);font-variant-numeric:tabular-nums}
.fl-root h1{font-family:"Archivo Head","Archivo","Helvetica Neue",Arial,sans-serif;font-weight:800;line-height:1.1;margin:0;letter-spacing:-.01em}
.fl-root a{color:var(--blue);text-decoration:none;transition:opacity .1s ease-in}.fl-root a:hover{opacity:.7}
/* .fl-tag (own copy of the shared honesty-tag chip) removed 2026-07-10 --
   migrated to common/components.py::render_trust_tag() (.ttag), pulled in
   via the _COMPONENT_CSS prefix above; identical hex values, zero visual
   change. */
.fl-eyebrow{font-size:12.5px;font-weight:700;color:var(--ink-3)}
.fl-verdict{font-size:clamp(30px,4.4vw,46px);margin:10px 0 0}
.fl-subhead{font-size:17px;line-height:1.5;color:var(--ink-2);margin:14px 0 0;max-width:60ch;font-family:"Archivo","Helvetica Neue",Arial,sans-serif}
.fl-subhead b{color:var(--ink);font-weight:500}
.fl-since{display:inline-flex;align-items:center;gap:7px;font-size:12.5px;color:var(--ink-2);margin:18px 0 0}
.fl-dchip{font-weight:700;display:inline-flex;align-items:center;gap:3px}
.fl-pulse{position:relative;width:8px;height:8px;border-radius:50%;background:var(--gold);flex:0 0 auto}
.fl-pile-row{display:flex;align-items:center;flex-wrap:wrap;gap:6px 14px;margin:22px 0 0}
.fl-vpile{display:flex;align-items:center}
.fl-ava{position:relative;width:34px;height:34px;border-radius:50%;border:2.5px solid #fff;margin-left:-11px;cursor:pointer;transform:rotate(var(--rot));transition:opacity .1s ease-in;background:var(--pc,#ccc)}
.fl-ava:first-child{margin-left:0}
.fl-ava>.fl-img{position:absolute;inset:0;border-radius:50%;overflow:hidden;background:var(--pc);color:#fff;font-size:12px;font-weight:700;display:flex;align-items:center;justify-content:center}
.fl-ava:hover{z-index:8;opacity:.82}
.fl-vlabel{position:absolute;bottom:calc(100% + 9px);left:50%;transform:translateX(-50%);background:#fff;color:var(--ink);border:1px solid var(--rule);font-size:12px;font-weight:600;padding:4px 9px;border-radius:3px;white-space:nowrap;opacity:0;pointer-events:none;transition:opacity .1s ease-in}
.fl-ava:hover .fl-vlabel{opacity:1}
.fl-pile-cap{font-size:13px;color:var(--ink-2)}.fl-pile-cap b{font-family:"Archivo","Helvetica Neue",Arial,sans-serif;font-weight:600;font-size:var(--fs-body-lg,19px);color:var(--ink)}
.fl-dot{position:relative;width:16px;height:16px;border-radius:3px;background:var(--pc,#999);color:#fff;font-size:12px;font-weight:700;display:inline-flex;align-items:center;justify-content:center;overflow:hidden;flex:0 0 auto}
.fl-mark{display:inline-flex;align-items:center;justify-content:center;color:#fff}
.fl-mark .outlet-ic{width:11px;height:11px}
.fl-mark-lg{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;color:#fff}
.fl-mark-lg .outlet-ic{width:26px;height:26px}
.fl-sec{margin:46px 0 0}.fl-sec-label{font-size:17px;font-weight:700;line-height:1.3;color:var(--ink);margin:0 0 16px}
.fl-faceoff{display:grid;grid-template-columns:1fr auto 1fr;align-items:stretch}
@media(max-width:620px){.fl-faceoff{grid-template-columns:1fr;row-gap:6px}.fl-side{padding:0!important}.fl-vs{flex-direction:row!important;padding:8px 0!important}.fl-vs-bar{width:54px!important;height:1px!important}.fl-pole-tag{font-size:12px}}
.fl-side{padding:0 20px;display:flex;flex-direction:column;text-align:left}
.fl-vs{align-self:center;display:flex;flex-direction:column;align-items:center;gap:7px;padding:0 6px}
/* Scoped as .fl-vs-bar, not bare .bar -- .bar is a dangerously generic class name already
   claimed by chronicle/reaction_card.py and morning_read/styles.py (a tag-row toolbar style:
   display:flex + padding-bottom:11px + border-bottom) for something unrelated. Those don't
   override this rule's own width/height/background (no shared properties, so the cascade
   MERGES both rule sets instead of one winning), so this decorative divider's
   `height:1px!important` box-sizing:border-box interacted with the other rule's
   `padding-bottom:11px` and rendered as an ~11.7px-tall solid gray block on mobile instead of
   a hairline divider. Caught 2026-09-10 auditing team pages at mobile width. */
.fl-vs-bar{width:1px;height:62px;background:var(--rule)}.fl-vs .vsx{font-family:"Archivo","Helvetica Neue",Arial,sans-serif;font-weight:600;font-size:14px;color:var(--ink-3);}
.fl-head{display:flex;align-items:center;gap:8px;margin:0 0 12px;font-size:12.5px;font-weight:700}
.fl-head .fl-pdot{width:10px;height:10px;border-radius:50%}.fl-head .fl-pv{font-size:14px;font-weight:700}
.fl-side.left .fl-pv{margin-left:auto}.fl-side.right .fl-head{flex-direction:row-reverse}.fl-side.right .fl-pv{margin-right:auto}.fl-side.right{text-align:right}
.fl-side.right .fl-nrd,.fl-side.right .fl-nart,.fl-side.right .fl-pole-card{text-align:left}
.fl-pole-card{background:#fff;border:1px solid var(--line);border-radius:3px;padding:14px 16px}
.fl-pole-name{font-family:"Archivo","Helvetica Neue",Arial,sans-serif;font-weight:600;font-size:20px;color:var(--ink);line-height:1.1}
.fl-pole-sub{font-size:12.5px;color:var(--ink-3);margin:5px 0 0}
.fl-loud{display:grid;gap:12px}
.fl-npod{display:flex;gap:13px;background:#fff;border:1px solid var(--line);border-radius:3px;padding:12px 13px}
.fl-npod-art{position:relative;width:52px;height:52px;border-radius:3px;flex:0 0 auto;overflow:hidden;background:#2b1a4a;display:flex;align-items:center;justify-content:center}
.fl-npod-play{position:absolute;inset:0;background:rgba(20,8,40,.42);color:#fff;display:flex;align-items:center;justify-content:center;font-size:17px;text-decoration:none;transition:background .12s}.fl-npod-play:hover{background:rgba(20,8,40,.6)}
.fl-npod-main{min-width:0;flex:1}.fl-npod-show{font-size:12px;font-weight:700;color:var(--ink-2);margin:0 0 3px}
.fl-npod-title{font-family:"Archivo","Helvetica Neue",Arial,sans-serif;font-size:14px;line-height:1.45;margin:0;color:var(--ink)}
.fl-npod-foot{display:flex;align-items:center;gap:12px;margin:9px 0 0;font-size:12px;color:var(--ink-3);font-weight:600}.fl-npod-foot .fl-readit{margin-left:auto;color:var(--blue)}
.fl-wave{display:inline-flex;align-items:flex-end;gap:2px;height:15px;color:var(--ink-3)}
.fl-wave span{width:2.5px;border-radius:1px;background:currentColor;display:block;height:6px}
.fl-wave span:nth-child(1){height:5px}.fl-wave span:nth-child(2){height:10px}.fl-wave span:nth-child(3){height:13px}.fl-wave span:nth-child(4){height:8px}.fl-wave span:nth-child(5){height:6px}
.fl-ctx{font-size:12.5px;line-height:1.45;color:var(--ink-2);margin:0 0 9px}.fl-ctx b{color:var(--ink)}
.fl-nrd,.fl-nart{background:#fff;border:1px solid var(--line);border-radius:3px;padding:12px 14px;text-align:left}
.fl-nrd-head{display:flex;align-items:center;gap:7px;font-size:12px;margin:0 0 8px}.fl-nrd-sub{font-weight:700}
.fl-nrd-body,.fl-nart-quote{font-family:"Archivo","Helvetica Neue",Arial,sans-serif;font-size:14.5px;line-height:1.5;margin:0;color:var(--ink)}
.fl-nrd-foot{display:flex;align-items:center;gap:14px;margin:11px 0 0;font-size:12px;color:var(--ink-3);font-weight:600}
.fl-vote .uv{color:#bf3b31;font-size:13px}.fl-vote .dv{color:var(--ink-3);opacity:.5;font-size:13px}.fl-nrd-foot .fl-readit{margin-left:auto;color:var(--blue)}
.fl-vibe-tag{margin-left:auto;font-size:12px;font-weight:700;color:var(--ink-3)}
.fl-vibe-note{font-size:12px;color:var(--ink-3);margin:9px 0 0;max-width:60ch}
.fl-nart{display:block;transition:opacity .1s ease-in}.fl-nart:hover{opacity:.82}
.fl-nart-head{display:flex;align-items:center;gap:7px;font-size:12px;margin:0 0 9px}.fl-nart-site{font-weight:700;color:var(--ink)}
.fl-nart-kind{margin-left:auto;font-size:12px;font-weight:600;color:var(--ink-3)}
.fl-nart-url{display:inline-flex;gap:4px;font-size:12px;font-weight:600;color:var(--blue);margin:11px 0 0}
.fl-axis{position:relative;height:108px;margin:22px 6px 0}
.fl-axis-line{position:absolute;left:0;right:0;top:54px;height:2px;background:var(--rule)}
.fl-pole{position:absolute;top:54px;width:13px;height:13px;border-radius:50%;transform:translate(-50%,-50%);border:2.5px solid #fff;z-index:3;transition:opacity .1s ease-in}
.fl-pole.lab{width:17px;height:17px}.fl-pole:hover{opacity:.82}
.fl-pole-tag{position:absolute;top:16px;transform:translateX(-50%);font-size:12.5px;font-weight:600;white-space:nowrap;text-align:center}.fl-pole-tag .n{font-size:12px;color:var(--ink-3);font-weight:400;display:block}.fl-pole-tag--both{top:4px;white-space:normal;width:max-content;max-width:92%;line-height:1.3}.fl-pole-tag--both .n{display:inline;margin-left:4px}
.fl-axis-zero{position:absolute;top:44px;height:22px;width:1px;background:var(--ink-3)}
.fl-axis-end{position:absolute;top:84px;font-size:12px;color:var(--ink-3);font-weight:600}
.fl-consensus{background:var(--row);border:1px solid var(--line);border-radius:3px;padding:20px 22px}
.fl-con-stat{display:flex;align-items:baseline;gap:12px}.fl-con-num{font-family:"Archivo Head","Archivo","Helvetica Neue",Arial,sans-serif;font-weight:800;font-size:40px;line-height:1}
.fl-con-cap{font-size:13px;color:var(--ink-3)}.fl-con-prose{font-family:"Archivo","Helvetica Neue",Arial,sans-serif;font-size:15px;line-height:1.5;color:var(--ink-2);margin:14px 0 12px}.fl-con-prose b{color:var(--ink)}
.fl-thin{display:grid;gap:0;max-width:380px}.fl-thin-row{display:flex;align-items:center;gap:10px;font-size:14px;padding:8px 2px;border-bottom:1px solid var(--line)}
.fl-thin-dot{width:10px;height:10px;border-radius:50%}.fl-thin-v{margin-left:auto;font-weight:600;color:var(--ink-2)}
.fl-more{margin:26px 0 0;border-top:1px solid var(--rule);padding:16px 0 0}
.fl-more>summary{font-size:13px;font-weight:600;color:var(--blue);cursor:pointer;list-style:none;display:inline-flex;align-items:center;gap:5px}.fl-more>summary::-webkit-details-marker{display:none}.fl-more[open]>summary{margin:0 0 16px}
.fl-chips{display:flex;flex-wrap:wrap;gap:6px 18px}
.fl-chip{display:inline-flex;align-items:center;gap:7px;padding:4px 0;background:none;border:0;font:inherit;font-size:13px;font-weight:600;color:var(--ink-2);cursor:pointer;transition:opacity .1s ease-in}
.fl-chip:hover{opacity:.82}.fl-chip .cdot{width:9px;height:9px;border-radius:50%;background:var(--cc,#999)}.fl-chip .csent{font-size:12px;color:var(--ink-3)}
.fl-mix{font-size:12px;color:var(--ink-3);margin:12px 0 0}
.fl-foot{margin:50px 0 0;padding:18px 0 0;border-top:1px solid var(--rule);font-size:12px;color:var(--ink-3);line-height:1.6}
.fl-conflict{margin:20px 0 0;font-size:14px;font-family:"Archivo","Helvetica Neue",Arial,sans-serif;color:var(--ink-2);line-height:1.5}.fl-conflict b{color:var(--ink);font-weight:600}
.fl-tp-sec{margin-top:40px}
.fl-tp-bars{margin:14px 0 10px;display:flex;flex-direction:column;gap:9px}
.fl-tp-row{display:grid;grid-template-columns:130px 1fr 36px;align-items:center;gap:10px}
.fl-tp-label{font-family:"Archivo";font-size:13px;color:var(--ink-2);line-height:1.25;overflow-wrap:anywhere}
.fl-tp-track{background:var(--row);border-radius:2px;height:6px;overflow:hidden}
.fl-tp-fill{height:100%;background:var(--blue);border-radius:2px;transition:width .6s ease-out}
.fl-tp-pct{font-family:"Archivo";font-size:12px;font-weight:700;color:var(--ink);text-align:right}
.fl-tp-note{font-size:12px;color:var(--ink-3);margin:0;line-height:1.5}
@media(max-width:480px){.fl-tp-row{grid-template-columns:132px 1fr 32px}}
@media(prefers-reduced-motion:reduce){.fl-root *{animation-duration:.001ms!important;transition-duration:.001ms!important}}

/* Belief Check — grounding story card (The Room, doc 97) */

.bc-card {
  position: relative; background: #fff; border: 1px solid #dcdcdc;
  border-radius: 3px; padding: 18px 20px 20px; max-width: 560px;
  font-family: 'Archivo', system-ui, sans-serif; color: #222222;
}
.bc-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.bc-eyebrow {
  font-size: 12.5px; font-weight: 700; color: #6b6b6b;
}
.bc-chip {
  font-size: 12.5px; font-weight: 700; color: #45453f;
}
.bc-take {
  font-family: 'Archivo', 'Helvetica Neue', Arial, sans-serif; font-weight: 600; font-size: 21px;
  line-height: 1.3; margin: 10px 0 16px;
}
.bc-viz { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; margin-bottom: 14px; }
@media (max-width: 460px) { .bc-viz { grid-template-columns: 1fr; } }
.bc-viz-h { font-size: 12px; font-weight: 700; color: #6b6b6b; margin-bottom: 7px; }
.bc-bar {
  position: relative; height: 10px; background: #f1f1ec;
  border-radius: 3px; overflow: hidden;
}
.bc-bar-fill { position: absolute; left: 0; top: 0; bottom: 0; border-radius: 3px; }
.bc-bar-tick {
  position: absolute; top: -2px; bottom: -2px; width: 2px; background: #222222;
  overflow: visible;
}
.bc-mood { display: flex; height: 10px; border-radius: 3px; overflow: hidden; }
.bc-mood span { display: block; height: 100%; }
.bc-bar-legend {
  display: flex; justify-content: space-between; font-size: 12px;
  margin-top: 6px; color: #222222;
}
.bc-mute, .bc-bar-legend .bc-mute { color: #6b6b6b; }
.bc-receipt { font-size: 13px; color: #222222; margin: 4px 0 0; }
.bc-thin { font-size: 14px; color: #6b6b6b; line-height: 1.5; margin: 6px 0 0; }


/* Arc Reactions — Fan Verdict module (The Room, doc 97) */

/* Arc reactions — Fan Verdict module (.arc-rx). DESIGN.md (2026-09-28): a
   white framed card rendered complete and still (no rise/blur/bar-grow
   entrances, no pulsing stripe); quotes get a gold rule above; the bar's
   caption says what it measures instead of a "~ our read" tag. */
.arc-rx {
  padding: clamp(14px, 1.8vw, 22px) clamp(16px, 2.0vw, 26px);
  background: var(--bg-card, #fff);
  border: 1px solid var(--stroke-subtle, rgba(34,34,34,.08));
  border-radius: 3px;
  margin-bottom: clamp(20px, 3vw, 32px);
}
.arc-rx__eyebrow {
  font: 700 12.5px/1 var(--sans, "Archivo", system-ui, sans-serif);
  letter-spacing: .01em;
  color: var(--fg-muted, #686862);
  margin: 0 0 4px;
}
.arc-rx__heading {
  font: 600 clamp(17px, 1.2vw + 8px, 22px)/1.15 var(--sans, "Archivo", system-ui, sans-serif);
  color: var(--fg-primary, #222);
  margin: 0 0 clamp(12px, 2vw, 20px);
}
.arc-rx__list {
  display: grid;
  gap: 0;
}
.arc-rx__item {
  padding-bottom: clamp(12px, 1.5vw, 18px);
}
.arc-rx__item + .arc-rx__item {
  padding-top: clamp(12px, 1.5vw, 18px);
  border-top: 1px solid var(--stroke-subtle, rgba(34,34,34,.08));
}
.arc-rx__question {
  font: 400 clamp(13px, .9vw + 7px, 16px)/1.4 "Archivo", "Helvetica Neue", Arial, sans-serif;
  color: var(--fg-primary, #222);
  margin: 0 0 8px;
}
.arc-rx__meta {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 7px;
}
.arc-rx__velocity {
  font: 700 12px/1 var(--sans, "Archivo", system-ui, sans-serif);
  letter-spacing: .01em;
  color: var(--fg-muted, #686862);
}
.arc-rx__velocity.gaining  { color: var(--green, #3a7a4b); }
.arc-rx__velocity.settling { color: var(--fg-muted, #686862); }
/* An unresolved storyline: a status word in Talk Gold (was a pulsing stripe). */
.arc-rx__pending {
  font: 700 12px/1 var(--sans, "Archivo", system-ui, sans-serif);
  color: var(--gold-text, #8a6200);
}
.arc-rx__freshness {
  font: 400 12px/1 var(--sans, "Archivo", system-ui, sans-serif);
  color: var(--fg-muted, #686862);
}
/* "Previously on" context line — sets up the arc before the question */
.arc-rx__context {
  font: 400 12.5px/1.45 var(--sans, "Archivo", system-ui, sans-serif);
  color: var(--fg-muted, #686862);
  margin: 0 0 5px;
}
.arc-rx__cta {
  font: 700 12px/1 var(--sans, "Archivo", system-ui, sans-serif);
  color: var(--blue, #1d68a3);
  text-decoration: none;
  margin-left: auto;
}
.arc-rx__cta:hover { text-decoration: underline; }
/* Diverging sentiment bar, captioned with its shares */
.arc-rx__bar-wrap {
  display: flex;
  flex-direction: column;
  gap: 3px;
  margin-bottom: 8px;
}
.arc-rx__bar {
  height: 4px;
  background: #e0e0e0;
  border-radius: 2px;
  display: flex;
  overflow: hidden;
}
.arc-rx__bar-neg {
  background: var(--red, #bf3b31);
}
.arc-rx__bar-pos {
  background: var(--green, #3a7a4b);
}
/* the bar's caption: the shares in words (the "~ our read" tag retired) */
.arc-rx__read-tag {
  font: 400 12px/1.2 var(--sans, "Archivo", system-ui, sans-serif);
  color: var(--fg-muted, #686862);
  align-self: flex-end;
}
/* Quotes: a short gold rule above each (what people say), no tinted box or
   side stripe */
.arc-rx__quotes {
  display: grid;
  gap: 12px;
}
.arc-rx__quotes.split { grid-template-columns: 1fr 1fr; }
.arc-rx__quote {
  margin: 0;
  padding: 0;
}
.arc-rx__quote::before {
  content: "";
  display: block;
  width: 40px;
  height: 3px;
  background: var(--gold, #b7851a);
  margin: 0 0 6px;
}
.arc-rx__quote-text {
  font: 400 12px/1.5 var(--sans, "Archivo", system-ui, sans-serif);
  color: var(--fg-primary, #222);
  display: block;
  margin: 0 0 4px;
}
.arc-rx__quote-src {
  display: flex;
  align-items: center;
  font: 400 12px/1 var(--sans, "Archivo", system-ui, sans-serif);
  color: var(--fg-muted, #686862);
}
.arc-rx__quote-src .src-ic { width: 10px; height: 10px; margin-right: 3px; }
/* Pending arc (unresolved storyline): marked by the .arc-rx__pending word in
   the meta row, not a pulsing side stripe. */
@media (max-width: 600px) {
  .arc-rx__quotes.split { grid-template-columns: 1fr; }
}
.src-ic{width:11px;height:11px;margin-right:3px;vertical-align:-1.5px;flex-shrink:0}

/* Discourse Arcs — "What fans are arguing" (The Room, Phase 6) */

/* Discourse Arcs — "What fans are saying" (Phase 6, doc-90 light) */
.da{margin:clamp(20px,3vw,30px) 0;}
.da-head{margin-bottom:14px;}
.da-title{font:600 1.15rem/1.25 'Archivo','Helvetica Neue',Arial,sans-serif;color:var(--ink,#222222);margin:0 0 4px;}
.da-honesty{font:400 .8rem/1.4 'Archivo',sans-serif;color:var(--ink-2,#5b5b5b);margin:0;}
.da-cards{display:flex;flex-direction:column;gap:12px;}
.da-card{background:#ffffff;border:1px solid var(--line,#e4e4e1);
  border-radius:3px;padding:14px 16px;border-left:1px solid var(--line,#e4e4e1);
  scroll-margin-top:52px;}
.da-card.da-media{border-left-color:var(--ink-3,#8b8b8b);}
.da-card:focus-visible{outline:2px solid var(--ink,#222222);outline-offset:2px;}
.da-eyebrow{display:flex;align-items:baseline;justify-content:space-between;
  gap:10px;margin-bottom:8px;flex-wrap:wrap;}
.da-aspect{font:600 .8rem/1 'Archivo',sans-serif;letter-spacing:.04em;
  text-transform:capitalize;color:var(--ink-2,#5b5b5b);}
.da-prevalence{font:600 .8rem/1 'Archivo',sans-serif;color:var(--ink-2,#5b5b5b);
  border-left:1px solid var(--line,#e4e4e1);padding-left:8px;}
.da-prevalence.da-single{font-style:italic;font-weight:500;}
.da-headline{font:600 1.05rem/1.3 'Archivo','Helvetica Neue',Arial,sans-serif;color:var(--ink,#222222);
  margin:0 0 8px;text-wrap:balance;}
.da-receipt{margin:0 0 10px;padding-left:12px;border-left:2px solid var(--line,#e4e4e1);}
.da-receipt p{font:400 .92rem/1.5 'Archivo',sans-serif;color:var(--ink,#222222);margin:0;}
.da-provenance{font:400 .8rem/1.4 'Archivo',sans-serif;color:var(--ink-2,#5b5b5b);margin:0;}
.da-more{margin-top:10px;}
.da-more summary{font:600 .82rem/1 'Archivo',sans-serif;color:#1a5dad;cursor:pointer;
  list-style:none;padding:6px 0;}
.da-more summary::-webkit-details-marker{display:none;}
.da-more summary:focus-visible{outline:2px solid var(--ink,#222222);outline-offset:2px;}
.da-extra{display:flex;flex-direction:column;gap:12px;margin-top:10px;}
@media(prefers-reduced-motion:reduce){.da-card{transition:none;}}


/* Aggregate mood card — Phase 7 half 1, reuses discourse_arcs.py's .da-card shell.
   DESIGN.md (2026-09-28): no green/red mood side stripe (and no "Fan mood"
   eyebrow over the headline, which says the mood in words). The left edge is
   the card's plain 1px frame whatever the shell's stripe does. */
.da-card.da-mood-positive,.da-card.da-mood-negative{border-left:1px solid var(--line,#e4e4e1);}


/* Conference Standing — Brief §10.2-10.3 */

/* Conference Standing — Brief §10.2-10.3 */
.conference-standing {
  display: grid;
  gap: clamp(10px, 1.4vw, 16px);
  padding: clamp(14px, 1.8vw, 20px) clamp(16px, 2.0vw, 24px);
  background: var(--bg-card, #ffffff);
  border: 1px solid var(--stroke-subtle, rgba(34, 34, 34, 0.08));
  border-radius: 3px;
  margin-bottom: clamp(20px, 3vw, 32px);
  font-variant-numeric: tabular-nums;
}
.conference-standing__header {
  display: grid;
  gap: 4px;
}
.conference-standing__eyebrow {
  font-family: var(--font-sans, system-ui, sans-serif);
  font-size: 12.5px;
  font-weight: 700;
  letter-spacing: 0.01em;
  text-transform: none;
  color: var(--ink-3, #686862);
  margin: 0;
}
.conference-standing__title {
  font-family: var(--font-display, 'Archivo', 'Archivo', system-ui, sans-serif);
  font-size: clamp(22px, 1.8vw + 10px, 30px);
  font-weight: 400;
  line-height: 1;
  letter-spacing: 0.01em;
  text-transform: none;
  color: var(--fg-primary);
  margin: 0;
}
.conference-standing__summary {
  font-family: 'Archivo', 'Helvetica Neue', Arial, sans-serif;
  font-size: 14px;
  
  line-height: 1.4;
  color: var(--fg-secondary);
  margin: 0;
}
.conference-standing__table {
  width: 100%;
  border-collapse: collapse;
  font-family: var(--font-sans, system-ui, sans-serif);
}
.conference-standing__table thead th {
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.01em;
  text-transform: none;
  color: var(--ink-3, #686862);
  text-align: left;
  padding: 6px 8px;
  border-bottom: 1px solid var(--stroke-subtle, rgba(34, 34, 34, 0.08));
}
.conference-standing__table tbody td {
  padding: 8px;
  font-size: 13px;
  color: var(--fg-secondary);
  border-bottom: 1px solid var(--stroke-subtle, rgba(34, 34, 34, 0.05));
}
.conference-standing__table tbody tr:last-child td {
  border-bottom: none;
}
/* The focal (this team's) row: the row tint and bold ink carry it; the 3px
   team-colour side stripe retired (DESIGN.md, 2026-09-28). */
.conference-standing__table .conference-standing__row--focal {
  background: var(--row, #f7f7f6);
}
.conference-standing__table .conference-standing__row--focal td {
  color: var(--fg-primary);
  font-weight: 700;
}
.conference-standing__table .conference-standing__rank {
  font-family: var(--font-display, 'Archivo', 'Archivo', system-ui, sans-serif);
  font-size: 16px;
  letter-spacing: 0.01em;
  color: var(--fg-secondary, #5b5b5b);
  font-weight: 400;
}
.conference-standing__table .conference-standing__team-link {
  color: inherit;
  text-decoration: none;
}
.conference-standing__table .conference-standing__team-link:hover {
  text-decoration: underline;
}
.conference-standing__table .conference-standing__record {
  font-family: var(--font-sans, 'Archivo', system-ui, sans-serif);
  font-size: 12px;
}


/* Ceiling/Floor projection — Brief §11.2 */

.cf-dist{margin:14px 0 6px}
.cf-dist__k{margin:0 0 6px;font:500 12px/1.3 var(--font-ui,'Archivo',system-ui,sans-serif);color:var(--ink-3,#686862)}
.cf-dist__cols{list-style:none;margin:0;padding:0;display:flex;align-items:flex-end;gap:4px;height:92px}
.cf-dist__col{flex:1;min-width:0;height:100%;display:flex;flex-direction:column;justify-content:flex-end;align-items:center}
.cf-dist__bar{display:block;width:100%;background:#1d68a3;border-radius:2px 2px 0 0}
.cf-dist__col--out .cf-dist__bar{opacity:.35}
.cf-dist__p{font:700 12px/1.4 var(--font-ui,'Archivo',system-ui,sans-serif);color:var(--ink,#222);min-height:16px}
.cf-dist__w{font:500 12px/1.6 var(--font-ui,'Archivo',system-ui,sans-serif);color:var(--ink-3,#686862);border-top:1px solid #d8d8d3;width:100%;text-align:center}

/* Ceiling/Floor projection — Brief §11.2 (design pass 2026-09-08) */
.ceiling-floor {
  display: grid;
  gap: clamp(12px, 1.4vw, 18px);
  padding: clamp(14px, 1.8vw, 20px) clamp(16px, 2.0vw, 24px);
  background: #ffffff;
  border: 1px solid var(--stroke-default, #e4e4e1);
  border-radius: 3px;
  margin-bottom: clamp(20px, 3vw, 32px);
  font-variant-numeric: tabular-nums;
}
.ceiling-floor__header {
  display: grid;
  gap: 6px;
}
.ceiling-floor__eyebrow {
  font-family: var(--font-sans, 'Archivo', system-ui, sans-serif);
  font-size: 12.5px;
  font-weight: 700;
  letter-spacing: 0.01em;
  text-transform: none;
  color: var(--ink-3, #686862);
  margin: 0;
}
.ceiling-floor__title {
  font-family: var(--font-display, 'Archivo', system-ui, sans-serif);
  font-size: var(--fs-headline, clamp(22px, 1.8vw + 14px, 30px));
  font-weight: 600;
  line-height: 1.2;
  letter-spacing: -0.005em;
  text-transform: none;
  color: var(--fg-primary, #222222);
  margin: 0;
  max-width: 52ch;
}
.ceiling-floor__title strong { font-weight: 800; }

/* Range bar — panel track, one white tick per win, grey floor→ceiling range, ink base marker */
.ceiling-floor__band {
  display: grid;
  gap: 4px;
  padding: 22px 0 0;
}
.ceiling-floor__track {
  position: relative;
  height: 14px;
  background: var(--panel, #f1f1ec);
  border-radius: 2px;
}
.ceiling-floor__tick {
  position: absolute;
  top: 0;
  bottom: 0;
  width: 1px;
  background: #ffffff;
}
.ceiling-floor__range {
  position: absolute;
  top: 0;
  bottom: 0;
  background: var(--stroke-strong, #d7d7d4);
}
.ceiling-floor__marker {
  position: absolute;
  top: -3px;
  bottom: -3px;
  width: 2px;
  background: var(--fg-primary, #222222);
  transform: translateX(-50%);
}
.ceiling-floor__marker--base {
  width: 3px;
  top: -5px;
  bottom: -5px;
}
.ceiling-floor__marker-label {
  position: absolute;
  font-family: var(--font-sans, 'Archivo', system-ui, sans-serif);
  font-size: 12px;
  font-weight: 700;
  line-height: 1;
  white-space: nowrap;
  transform: translateX(-50%);
  left: 50%;
  top: calc(100% + 6px);
  color: var(--fg-secondary, #5b5b5b);
}
.ceiling-floor__marker--floor .ceiling-floor__marker-label   { color: var(--red, #bf3b31); }
.ceiling-floor__marker--ceiling .ceiling-floor__marker-label { color: var(--green, #3a7a4b); }
.ceiling-floor__marker--base .ceiling-floor__marker-label {
  top: auto;
  bottom: calc(100% + 6px);
  font-weight: 800;
  color: var(--fg-primary, #222222);
}
.ceiling-floor__marker-label--left  { transform: translateX(0); left: 0; }
.ceiling-floor__marker-label--right { transform: translateX(-100%); left: 100%; }
.ceiling-floor__axis {
  display: flex;
  justify-content: space-between;
  padding-top: 18px;
  font-family: var(--font-sans, 'Archivo', system-ui, sans-serif);
  font-size: 12px;
  color: var(--fg-muted, #8b8b8b);
}

/* Scenario cards */
.ceiling-floor__more > summary { cursor: pointer; font-size: .85rem; color: #444; text-decoration: underline; margin: .5rem 0; }
.ceiling-floor__scenarios {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 10px;
}
.ceiling-floor__scenario {
  display: grid;
  gap: 4px;
  padding: 10px 12px 12px;
  background: #ffffff;
  border: 1px solid var(--stroke-default, #e4e4e1);
  border-radius: 3px;
}
/* The coloured 3px top bars per scenario (red floor / blue base / green
   ceiling) retired with DESIGN.md's "no coloured top or bottom bars"; the
   band above keeps the red floor / green ceiling marker labels. */
.ceiling-floor__scenario-kind {
  font-family: var(--font-sans, 'Archivo', system-ui, sans-serif);
  font-size: 12.5px;
  font-weight: 700;
  letter-spacing: 0.01em;
  text-transform: none;
  color: var(--ink-3, #686862);
}
.ceiling-floor__scenario-record {
  font-family: var(--font-sans, 'Archivo', system-ui, sans-serif);
  font-size: clamp(22px, 1.4vw + 12px, 30px);
  font-weight: 800;
  line-height: 1;
  letter-spacing: -0.01em;
  color: var(--fg-primary, #222222);
}
.ceiling-floor__scenario-story {
  font-family: 'Archivo', 'Helvetica Neue', Arial, sans-serif;
  font-size: 13px;
  
  line-height: 1.4;
  color: var(--fg-secondary, #5b5b5b);
}
.ceiling-floor__caveat {
  font-family: var(--font-sans, 'Archivo', system-ui, sans-serif);
  font-size: 12px;
  color: var(--fg-muted, #8b8b8b);
  margin: 0;
  max-width: 80ch;
}
@media (max-width: 640px) {
  .ceiling-floor__scenarios { grid-template-columns: 1fr; }
  .ceiling-floor__marker-label { font-size: 12px; }
}


/* Home-Field Advantage — Brief §11.3 */

/* Home-field advantage -- re-set 2026-09-08 (brainstorm R1/R2/R6). Doc 90:
   Fraunces display, Archivo data, flat, radius 3px, no tint. Doc 100: the
   edge is a box-score fact -> blue; "worse at home" -> red; everything
   contextual -> grey. The retired amber accent token is gone from this module. */
.home-field {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 10px 22px;
  padding: clamp(14px, 1.8vw, 20px) clamp(16px, 2.0vw, 24px);
  border: 1px solid var(--line, #e4e4e1);
  border-radius: 3px;
  margin-bottom: clamp(20px, 3vw, 32px);
  font-variant-numeric: tabular-nums;
}
.home-field__main { display: grid; gap: 6px; min-width: 0; }
/* DESIGN.md (2026-09-28): the eyebrow stays only for its facts (the window
   and the FBS-opponents scope), as a sentence-case label; the rank line is a
   word in ink, not green/red; labels carry no tracking. */
.home-field__eyebrow {
  font: 700 12.5px/1.3 var(--ui, 'Archivo'), system-ui, sans-serif;
  letter-spacing: .01em; color: var(--ink-3, #686862); margin: 0;
}
.home-field__band {
  font: 600 clamp(20px, 1.4vw + 10px, 26px)/1.15 var(--display, 'Archivo Head','Archivo','Helvetica Neue',Arial,sans-serif), Georgia, serif;
  color: var(--ink, #222); margin: 0; letter-spacing: -.005em;
}
.home-field__band b { color: var(--blue, #1d68a3); font-weight: 600; }
.home-field__band--reversed b { color: var(--red, #bf3b31); }
.home-field__band--none b { color: var(--ink-2, #5b5b5b); }
.home-field__rank {
  font: 700 12px/1.4 var(--ui, 'Archivo'), system-ui, sans-serif;
  color: var(--ink-2, #5b5b5b); margin: 0;
}
.home-field__rank--elite { color: var(--ink, #222); }
.home-field__rank--reversed { color: var(--ink, #222); }
.home-field__rank--none { color: var(--ink-3, #686862); }
.home-field__deck {
  font: 400 14px/1.5 var(--ui, 'Archivo'), system-ui, sans-serif;
  color: var(--ink-2, #5b5b5b); margin: 0; max-width: 62ch;
}
.home-field__deck b { color: var(--ink, #222); font-weight: 700; }
.home-field__bar { margin: 4px 0 0; max-width: 520px; }
.home-field__bar svg { width: 100%; height: auto; display: block; }
.home-field__bar--phone { display: none; }
@media (max-width: 600px) { .home-field__bar--wide { display: none; } .home-field__bar--phone { display: block; } }
.home-field__how { margin: 8px 0 0; }
.home-field__how > summary { font: 600 13px/1.4 'Archivo', system-ui, sans-serif; color: var(--ink, #222); cursor: pointer; text-decoration: underline; text-underline-offset: 3px; }
.home-field__how[open] > summary { margin-bottom: 8px; }
.home-field__market {
  font: 400 13.5px/1.5 var(--ui, 'Archivo'), system-ui, sans-serif;
  color: var(--ink-2, #5b5b5b); margin: 4px 0 0; max-width: 64ch;
  padding-top: 8px; border-top: 1px solid var(--line, #e4e4e1);
}
.home-field__market b { color: var(--ink, #222); font-weight: 700; }
.home-field__market a { color: inherit; text-decoration: none; border-bottom: 1px dotted currentColor; }
.home-field__stats { display: grid; gap: 4px; align-self: start; text-align: right; min-width: 130px; }
.home-field__stat-label {
  font: 700 12px/1.3 var(--ui, 'Archivo'), system-ui, sans-serif;
  letter-spacing: .01em; color: var(--ink-3, #686862);
}
.home-field__stat-value {
  font: 600 15px/1.2 var(--ui, 'Archivo'), system-ui, sans-serif;
  color: var(--ink, #222); font-variant-numeric: tabular-nums;
}
.home-field__travel {
  font: 400 12.5px/1.5 var(--ui, 'Archivo'), system-ui, sans-serif;
  color: var(--ink-2, #5b5b5b); margin: 6px 0 0; max-width: 62ch;
  border-top: 1px dashed var(--line, #e4e4e1); padding-top: 8px;
}
.home-field__travel b { font-weight: 700; color: var(--ink, #222); font-variant-numeric: tabular-nums; }
.home-field__note {
  font: 400 12px/1.45 var(--ui, 'Archivo'), system-ui, sans-serif;
  color: var(--ink-3, #686862); margin: 6px 0 0; max-width: 64ch;
}
@media (max-width: 640px) {
  .home-field { grid-template-columns: 1fr; }
  .home-field__stats { text-align: left; grid-template-columns: repeat(3, auto); justify-content: start; gap: 2px 18px; }
}


/* Moment of the Year — Brief §11.7 approximation */

/* Moment of the Year — Brief §11.7 adaptation. DESIGN.md (2026-09-28): a plain
   framed card, no team-colour stripe; the kicker keeps only the season; the
   headline is ink with the result word in bold green/red; the tags are words. */
.moment-of-year {
  display: grid;
  gap: clamp(10px, 1.2vw, 14px);
  padding: clamp(16px, 2.0vw, 22px) clamp(18px, 2.2vw, 26px);
  background: var(--bg-card, #fff);
  border: 1px solid var(--stroke-subtle, rgba(34, 34, 34,0.08));
  border-radius: 3px;
  margin-bottom: clamp(20px, 3vw, 32px);
  font-variant-numeric: tabular-nums;
}
.moment-of-year__eyebrow {
  font-family: var(--font-sans, system-ui, sans-serif);
  font-size: 12.5px;
  font-weight: 700;
  letter-spacing: 0.01em;
  text-transform: none;
  color: var(--fg-muted);
  margin: 0;
}
.moment-of-year__headline {
  font-family: var(--font-display, 'Archivo', system-ui, sans-serif);
  font-size: clamp(24px, 1.8vw + 12px, 34px);
  font-weight: 400;
  line-height: 1.05;
  letter-spacing: 0.01em;
  text-transform: none;
  color: var(--fg-primary);
  margin: 0;
}
.moment-of-year__result { font-weight: 800; }
.moment-of-year__headline--win  .moment-of-year__result { color: var(--win, #3a7a4b); }
.moment-of-year__headline--loss .moment-of-year__result { color: var(--loss, #bf3b31); }
.moment-of-year__story {
  font-family: 'Archivo', 'Helvetica Neue', Arial, sans-serif;
  font-size: clamp(14px, 0.4vw + 13px, 17px);
  line-height: 1.45;
  color: var(--fg-secondary);
  margin: 0;
  max-width: 64ch;
}
.moment-of-year .mq { max-width: 64ch; margin-top: 0; }
.moment-of-year__meta {
  display: flex;
  flex-wrap: wrap;
  gap: 6px 18px;
  font-family: var(--font-sans, system-ui, sans-serif);
  font-size: 12.5px;
  font-weight: 600;
  letter-spacing: 0.01em;
  text-transform: none;
  color: var(--fg-muted);
}
.moment-of-year__chip {
  color: var(--fg-secondary, #5b5b5b);
}

/* ── moments quote object (moments/quote_component.py) ─────────────────── */
.mq { display: block; margin: .5rem 0 0; padding: .1rem 0; }
.mq::before { content: ""; display: block; width: 40px; height: 3px; background: var(--gold, #b7851a);
              margin: 0 0 6px; }
.mq__q { display: block; font: 600 1.02rem/1.35 var(--ui, Archivo), system-ui, sans-serif;
         color: var(--ink, #222222); }
.mq__q::before { content: "\201C"; } .mq__q::after { content: "\201D"; }
.mq__src { display: block; margin: .3rem 0 0; font: 400 .74rem/1.4 var(--ui, Archivo), system-ui, sans-serif;
           color: var(--ink-3, #8b8b8b); font-variant-numeric: tabular-nums; }
.mq__src a { color: inherit; text-decoration: none; border-bottom: 1px dotted currentColor; }
.mq__src a:hover { opacity: .8; }
.mq__cap { display: block; margin: .35rem 0 0; font: 400 .82rem/1.45 var(--ui, Archivo), system-ui, sans-serif;
           color: var(--ink-2, #5b5b5b); }
.mq__tag { display: inline; font: 700 .74rem/1.3 var(--ui, Archivo), system-ui, sans-serif;
           color: var(--gold-text, #8a6200); margin-left: .45em; }
.mq--lg .mq__q { font-size: 1.18rem; line-height: 1.3; }
/* When the quote IS the row (the strip's aside): no top margin, it sits
   where the claim line would. */
.mq--lead { margin-top: .1rem; }
.mq--welfare::before { background: var(--line, #e7e7e2); }
.mq--welfare .mq__q { font-weight: 500; color: var(--ink-2, #5b5b5b); }
.mq--welfare .mq__q::before, .mq--welfare .mq__q::after { content: ""; }



/* Offseason Ledger — deterministic "what changed" event feed (no LLM). */
.offseason-ledger {
  margin-bottom: clamp(20px, 3vw, 32px);
  padding: clamp(16px, 2.2vw, 24px) clamp(18px, 2.4vw, 28px);
  background: var(--bg-card, #ffffff);
  border: 1px solid var(--stroke-subtle, rgba(34, 34, 34, 0.08));
  border-radius: 3px;
  font-variant-numeric: tabular-nums;
}
.olg-head {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  gap: 12px;
  margin-bottom: clamp(10px, 1.4vw, 16px);
  border-bottom: 1px dashed var(--stroke-subtle, rgba(34, 34, 34, 0.07));
  padding-bottom: 10px;
}
.olg-title {
  font-family: var(--font-display, 'Archivo', system-ui, sans-serif);
  font-size: var(--fs-headline, clamp(22px, 1.8vw + 14px, 30px));
  font-weight: 600;
  letter-spacing: normal;
  text-transform: none;
  color: var(--fg-primary);
  margin: 0;
}
.olg-sub {
  font-family: var(--font-sans, system-ui, sans-serif);
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.01em;
  text-transform: none;
  color: var(--ink-3, #686862);
  white-space: nowrap;
}
.olg-list { list-style: none; margin: 0; padding: 0; }
.olg-row {
  display: grid;
  grid-template-columns: 84px 1fr auto;
  gap: clamp(10px, 1.4vw, 16px);
  align-items: start;
  padding: clamp(10px, 1.3vw, 14px) 0;
  border-bottom: 1px solid var(--stroke-subtle, rgba(34, 34, 34, 0.05));
}
.olg-row:last-child { border-bottom: 0; padding-bottom: 0; }
/* The category is a word, not a tinted chip (DESIGN.md, labels are words);
   the old per-category tints borrowed win green / talk gold / measured blue
   for meanings those colours don't carry. The olg-portal/-recruit/-coach/-news
   classes stay on the markup as hooks. */
.olg-tag {
  font-family: var(--font-sans, system-ui, sans-serif);
  font-size: 12px;
  font-weight: 700;
  line-height: 1.3;
  letter-spacing: 0.01em;
  text-transform: none;
  color: var(--ink-3, #686862);
  align-self: start;
  white-space: nowrap;
  text-align: left;
  padding-top: 2px;
}
.olg-body { min-width: 0; }
.olg-action {
  font-family: 'Archivo', 'Helvetica Neue', Arial, sans-serif;
  font-size: clamp(14px, 0.5vw + 12px, 16px);
  line-height: 1.3;
  color: var(--fg-primary);
  margin: 0;
  overflow-wrap: anywhere;
}
.olg-why {
  font-family: var(--font-sans, system-ui, sans-serif);
  font-size: 12px;
  line-height: 1.4;
  color: var(--fg-secondary);
  margin: 4px 0 0 0;
}
.olg-meta {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 3px;
  text-align: right;
  white-space: nowrap;
}
.olg-date {
  font-family: var(--font-sans, 'Archivo', system-ui, sans-serif);
  font-size: 12px;
  color: var(--fg-secondary);
}
.olg-src {
  font-family: var(--font-sans, system-ui, sans-serif);
  font-size: 12px;
  color: var(--fg-muted);
  text-decoration: none;
}
a.olg-src:hover { opacity:.8; text-decoration: underline; }
@media (max-width: 560px) {
  .olg-row { grid-template-columns: 70px 1fr; }
  .olg-meta { grid-column: 2; align-items: flex-start; text-align: left;
              flex-direction: row; gap: 10px; margin-top: 2px; }
}


.bk{border-top:1px solid var(--stroke-default,#e4e4e1);margin:10px 0 0}
.bk__s{list-style:none;cursor:pointer;min-height:44px;display:flex;align-items:center;font:600 14px/1.3 var(--font-ui,'Archivo',system-ui,sans-serif);color:var(--ink,#222)}
.bk__s::-webkit-details-marker{display:none}
.bk__s::before{content:'\25B8';margin-right:8px;color:var(--ink-3,#686862)}
.bk[open] .bk__s::before{content:'\25BE'}
.bk__body{display:grid;grid-template-columns:auto 22px 1fr;align-items:center;margin:4px 0 6px}
.bk__l{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:14px}
.bk__t{font:500 14px/1.3 var(--font-ui,'Archivo',system-ui,sans-serif);color:var(--ink-3,#686862)}
.bk__t--me,.bk__me{font-weight:800;color:var(--ink,#222)}
.bk__c{align-self:stretch;margin:9px 0;border:2px solid var(--stroke-default,#cfcfca);border-left:0;position:relative}
.bk__c::after{content:"";position:absolute;left:100%;top:50%;width:6px;border-top:2px solid var(--stroke-default,#cfcfca)}
.bk__me{margin:0;font:800 14px/1.3 var(--font-ui,'Archivo',system-ui,sans-serif)}
.bk__sub{margin:2px 0 0;font:500 12px/1.3 var(--font-ui,'Archivo',system-ui,sans-serif);color:var(--ink-3,#686862)}
.bk__r{padding-left:6px}
.bk__k{margin:0 0 8px;font:500 12px/1.4 var(--font-ui,'Archivo',system-ui,sans-serif);color:var(--ink-3,#686862)}
.ahead__h{font:800 1.05rem/1.2 var(--font-ui,'Archivo',system-ui,sans-serif);margin:0 0 10px;color:var(--ink,#222)}.ahead__part+.ahead__part{margin-top:14px}.ahead__more{margin:14px 0 0;font:500 14px/44px var(--font-ui,'Archivo',system-ui,sans-serif)}.ahead__more a{color:var(--ink,#222);text-decoration:underline;text-underline-offset:3px;text-decoration-color:var(--stroke-default,#e4e4e1)}
.game-strip .gs-hint{display:none}
.tp-drawers__group{font:700 12.5px/1.3 var(--font-ui,'Archivo',system-ui,sans-serif);color:var(--ink-3,#686862);margin:20px 0 0;padding:0 0 4px}.tp-drawers__group:first-of-type{margin-top:8px}
.tp-sr-only{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}

/* Story Right Now — structured beat storyline surface (Tier-B story engine) */

:root{--page:#fff;--panel:#f1f1ec;--ink:#222;--mut:#666;--line:#dcdcdc;
 --blue:#1d68a3;--red:#bf3b31;--gold:#b7851a;--green:#3a7a4b;--navy:#23243f}
*{box-sizing:border-box}
.sn-wrap{max-width:1080px;margin:0 auto;padding:26px 20px 90px;
 font-family:Archivo,system-ui,sans-serif;color:var(--ink);line-height:1.45}
/* DESIGN.md (2026-09-28): team colour stays in the logo, so nothing here
   paints with the per-card --accent (still set inline, unused); labels are
   sentence-case words, not chips; no side stripes, no entrance motion. */
.sn-kicker{font:700 12.5px/1 Archivo;letter-spacing:.01em;color:var(--mut);
 display:inline-flex;gap:8px;align-items:center;text-transform:none}
.sn-dot{width:7px;height:7px;border-radius:50%;background:var(--ink);display:inline-block}

/* since-you-last-looked banner — display:flex so JS innerHTML reveals it;
   :empty keeps it invisible before JS runs (no flash of empty space). It is
   the page's one tinted block: what changed since your last visit. */
.sylb{display:flex;align-items:center;gap:12px;background:#f8f8f5;border:1px solid var(--line);
 border-radius:3px;padding:12px 15px;margin:0 0 22px;
 font:500 14px/1.4 Archivo;color:var(--ink)}
.sylb:empty{display:none}
.sylb b{font-weight:800}
.sylb-dot{width:8px;height:8px;border-radius:50%;background:var(--gold);display:inline-block;
 margin-right:6px;vertical-align:1px}
.sylb .reset,.sylb button.reset{margin-left:auto;font:600 12px Archivo;color:var(--mut);cursor:pointer;
 text-decoration:underline;background:none;border:none;padding:0}
.sylb.firsttime{color:#444}

/* section + team strip */
.story-now{border-top:2px solid var(--ink);padding-top:18px;margin:34px 0}
.team-now{border-top:1px solid var(--line);padding-top:16px}
.sn-head{display:flex;align-items:baseline;gap:12px}
.tn-kicker{color:var(--mut)}
.tn-kicker .sn-dot{background:var(--ink)}
.sn-count{font:600 12.5px Archivo;color:var(--mut)}
.sn-h{font:800 25px/1.15 Archivo Head,Archivo,Helvetica Neue,Arial,sans-serif;margin:8px 0 6px;letter-spacing:-.01em}
.sn-dek{font:400 15px/1.5 Archivo;color:#444;margin:0 0 16px;max-width:62ch}
/* open question: a labelled line, no tinted box or side stripe */
.sn-q{font:500 16px/1.45 Archivo,Helvetica Neue,Arial,sans-serif;color:#1a1a1a;margin:6px 0 16px}
.sn-q-lbl{display:block;font:700 12.5px Archivo;letter-spacing:.01em;color:var(--mut);
 margin-bottom:2px}
/* lede storyline: a framed card, no team-colour top bar */
.lede{border:1px solid var(--line);border-radius:3px;
 padding:16px 18px 24px;margin:0 0 14px;background:#fff}
.lede-top{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-bottom:8px}
.lede-sum{font:600 22px/1.25 Archivo,Helvetica Neue,Arial,sans-serif;color:#141414;margin:2px 0 10px;letter-spacing:-.01em}
.lede-fact{font:500 13px/1.4 Archivo;color:var(--ink-2,#5b5b5b);margin:0 0 10px;
  display:flex;align-items:baseline;gap:8px;flex-wrap:wrap}
.fact-lbl{font:700 12px Archivo;letter-spacing:.01em;color:var(--mut,#686862);
  white-space:nowrap;flex:0 0 auto}
.lede-ctx{font-size:14px}

/* the feed of beat cards */
.sn-feed,.desk-feed{display:grid;gap:12px;grid-template-columns:repeat(auto-fill,minmax(330px,1fr))}
.bcard{display:flex;border:1px solid var(--line);border-radius:3px;background:#fff;overflow:hidden}
.bc-ribbon{display:none}
.bc-body{flex:1;min-width:0;padding:12px 14px}
.bc-top{display:flex;align-items:center;gap:7px;flex-wrap:wrap;margin-bottom:5px}
/* the storyline type: a word, not a chip */
.chip{font:700 12px/1.2 Archivo;letter-spacing:.01em;color:var(--ink)}
.bc-when{font:600 12px Archivo;color:var(--mut)}
.infl{color:var(--gold-text,#8a6200);font-size:13px;line-height:1}
.bc-team{font:700 12px Archivo;letter-spacing:.01em;color:var(--ink);margin:0 0 2px}
.bc-sum{font:500 15px/1.4 Archivo,Helvetica Neue,Arial,sans-serif;color:#161616;margin:2px 0 8px}
.bc-fact{font:500 12.5px/1.4 Archivo;color:#5b5b5b;margin:0 0 8px;
 display:flex;align-items:baseline;gap:6px;flex-wrap:wrap}
.bc-ctx{font:500 13px/1.4 Archivo;color:#2a2a2a;margin:0 0 10px}
.ctx-lbl{display:block;font:700 12px Archivo;letter-spacing:.01em;color:var(--mut);
 margin-bottom:2px}
/* new since your last visit: an 8px Talk Gold dot (the word stays for
   screen readers) */
.newpill{display:none;width:8px;height:8px;border-radius:50%;background:var(--gold);
 overflow:hidden;text-indent:-999px;vertical-align:1px}
.bcard.isnew .newpill,.lede.isnew .newpill{display:inline-block}

/* liveness band — replaced the scale-less .meter bar 2026-09-10 */
.tension{display:inline-flex;align-items:baseline;gap:6px;margin:10px 0 0;
 font:600 12px Archivo;letter-spacing:.01em}
.tension-k{color:var(--mut)}
.tension-v{color:#6b6b6b;border-bottom:2px solid #e2e2df;padding-bottom:1px}
.tension[data-band="front-page"] .tension-v{color:var(--ink);border-bottom-color:var(--gold)}
.tension[data-band="developing"] .tension-v{border-bottom-color:#eddfb4}
.bc-body{padding-bottom:14px}

/* national desks */
.desk{margin:0 0 30px}
.desk-h{font:600 17px/1 Archivo,Helvetica Neue,Arial,sans-serif;margin:0 0 12px;display:flex;align-items:center;gap:9px}
/* a count is plain text, not a filled badge */
.desk-n{font:600 13px Archivo;color:var(--mut)}
.empty{color:var(--mut);font:500 14px Archivo}

/* compact ranked tail (de-monotonizes long leaderboards) */
.rest{margin-top:10px}
.rest>summary{font:600 12px Archivo;color:var(--blue);cursor:pointer;list-style:none;
 padding:6px 0;user-select:none}
.rest>summary::-webkit-details-marker{display:none}
.rest>summary::before{content:"▸ ";color:var(--mut)}
.rest[open]>summary::before{content:"▾ "}
.rest-grid{display:grid;gap:0;grid-template-columns:repeat(auto-fill,minmax(330px,1fr))}
.rest-row{display:flex;gap:8px;align-items:baseline;padding:5px 0;
 border-bottom:1px solid var(--line);margin:0}
.rest-team{font:700 12px Archivo;color:#222;white-space:nowrap}
.rest-sum{font:500 13px Archivo;color:#444}
.sn-foot{margin-top:30px;font:400 12px/1.55 Archivo;color:var(--mut);
 border-top:1px solid var(--line);padding-top:12px;max-width:80ch}

/* verdict strip -- how past storylines here turned out (D-081 Phase 2) */
.verdict-strip{margin-top:22px;padding-top:14px;border-top:1px solid var(--line)}
.verdict-strip h3{font:700 12.5px Archivo;letter-spacing:.01em;color:var(--mut);margin:0 0 10px}
.verdict-row{display:flex;align-items:baseline;gap:8px;flex-wrap:wrap;
 padding:4px 0;margin-bottom:6px}
.verdict-tag{font:700 12px/1.2 Archivo;letter-spacing:.01em;white-space:nowrap}
.verdict-txt{font:500 13px/1.4 Archivo;color:#333}
.verdict-txt a{color:var(--blue);font-weight:700;text-decoration:none}
.verdict-txt a:hover{text-decoration:underline}

/* Arc Hub entry — link to /arcs/teams/<slug>/ (§13.4) */
/* Arc hub — active storylines card list on team pages */
.team-arc-hub{margin:0 0 24px}
.team-arc-hub__h{font-family:"Archivo","Helvetica Neue",Arial,sans-serif;font-weight:600;font-size:var(--fs-headline-sm,clamp(18px,1.2vw + 12px,22px));
  color:var(--ink);margin-bottom:10px;padding-bottom:8px;
  border-bottom:1px solid rgba(34,34,34,.12)}
.team-arc-hub__list{display:flex;flex-direction:column;gap:8px}
/* Framed card, no side stripe (DESIGN.md); hover is opacity. Heat is how
   much people are talking, so it is Talk Gold, never loss red. */
.arc-entry{border:1px solid rgba(34,34,34,.12);
  border-radius:3px;padding:11px 14px;background:var(--page);text-decoration:none;color:inherit;
  display:block;transition:opacity .1s ease-in}
.arc-entry:hover{opacity:.8}
.arc-entry__heat{font-size:12px;font-weight:700;letter-spacing:.01em;
  margin-bottom:4px}
.arc-entry__heat--hot{color:var(--gold-text,#8a6200);font-weight:800}
.arc-entry__heat--active{color:var(--gold-text,#8a6200)}
.arc-entry__heat--cooling{color:var(--ink-3,#686862)}
.arc-entry__title{font-size:13.5px;font-weight:600;line-height:1.35;
  color:var(--ink);margin-bottom:3px}
.arc-entry__q{font-size:12.5px;color:var(--ink-2,#5b5b5b);line-height:1.4}
.team-arc-hub__footer{font-size:12.5px;margin-top:8px}
.team-arc-hub__footer a{color:var(--blue,#1d68a3);font-weight:600;text-decoration:none}
.team-arc-hub__footer a:hover{text-decoration:underline}
/* Team Canon hub — "Featured in The Canon" (2026-07-08) */
/* Team Canon hub — "Featured in The Canon" card list on team pages (2026-07-08) */
.team-canon-hub{margin:0 0 24px}
.team-canon-hub__h{font-family:"Archivo","Helvetica Neue",Arial,sans-serif;font-weight:600;font-size:var(--fs-headline-sm,clamp(18px,1.2vw + 12px,22px));
  color:var(--ink);margin-bottom:10px;padding-bottom:8px;
  border-bottom:1px solid rgba(34,34,34,.12)}
.team-canon-hub__list{display:flex;flex-direction:column;gap:8px}
.canon-hub-entry{border:1px solid rgba(34,34,34,.12);
  border-radius:3px;padding:11px 14px;background:var(--page);text-decoration:none;color:inherit;
  display:block;transition:opacity .1s ease-in}
.canon-hub-entry:hover{opacity:.8}
.canon-hub-entry__rank{font-size:12px;font-weight:700;letter-spacing:.01em;
  color:var(--gold-text,#8a6200);margin-bottom:4px}
.canon-hub-entry__title{font-size:13.5px;font-weight:600;line-height:1.35;
  color:var(--ink);margin-bottom:3px}
.canon-hub-entry__list-name{font-size:12.5px;color:var(--ink-2,#5b5b5b);line-height:1.4}
.team-canon-hub__footer{font-size:12.5px;margin-top:8px}
.team-canon-hub__footer a{color:var(--blue,#1d68a3);font-weight:600;text-decoration:none}
.team-canon-hub__footer a:hover{text-decoration:underline}
/* Portal snapshot chip (2026-07-08) */
/* Portal snapshot — links to /topics/portal/ + /portal-heat/ (2026-07-08) */
.portal-snapshot{border:1px solid rgba(34,34,34,.12);
  border-radius:3px;padding:12px 14px;margin:0 0 24px;background:var(--page)}
.portal-snapshot__h{font-family:"Archivo","Helvetica Neue",Arial,sans-serif;font-weight:600;font-size:var(--fs-headline-sm,clamp(18px,1.2vw + 12px,22px));
  color:var(--ink);margin-bottom:6px}
.portal-snapshot__net{font-size:15px;font-weight:700;margin-bottom:8px}
.portal-snapshot__net--up{color:var(--green,#3a7a4b)}
.portal-snapshot__net--down{color:var(--red,#bf3b31)}
.portal-snapshot__net--flat{color:var(--ink-3,#8b8b8b)}
.portal-snapshot__raw{display:block;font-size:12px;color:var(--ink-3,#8b8b8b);margin:-4px 0 8px}
.portal-snapshot__footer{font-size:12.5px;margin-top:8px}
.portal-snapshot__footer a{color:var(--blue,#1d68a3);font-weight:600;text-decoration:none;margin-right:12px}
.portal-snapshot__footer a:hover{text-decoration:underline}
/* Position ledger — dot+label+bar+signed-net row (fp-cs-rank-row shape,
   dm-bar's z-score-clamped-to-percent-track math, conference_pages/hub.py). */
.portal-ledger{display:flex;flex-direction:column}
.portal-ledger__row{display:grid;grid-template-columns:14px 32px 1fr 48px;
  gap:8px;align-items:center;padding:5px 0;border-bottom:1px solid rgba(34,34,34,.08)}
.portal-ledger__row:last-child{border-bottom:none}
.portal-ledger__dot{width:8px;height:8px;border-radius:50%;flex-shrink:0}
.portal-ledger__pos{font-family:"Archivo",system-ui,sans-serif;font-size:12px;font-weight:700;
  letter-spacing:.01em;color:var(--ink-2,#555)}
.portal-ledger__bar-wrap{height:6px;background:rgba(34,34,34,.06);border-radius:2px;
  position:relative;overflow:hidden}
.portal-ledger__bar-fill{position:absolute;top:0;height:100%;border-radius:2px}
.portal-ledger__net{font-family:"Archivo",system-ui,sans-serif;font-size:12px;font-weight:700;
  text-align:right;font-variant-numeric:tabular-nums}
/* Row notes are words set as a list ("early read · ▼ starter risk"), not
   boxed chips (DESIGN.md: labels are words). */
.portal-ledger__chips{grid-column:1 / -1;display:flex;flex-wrap:wrap;gap:0;margin:0 0 4px 22px}
.portal-ledger__chip{font-family:"Archivo",system-ui,sans-serif;font-size:12px;font-weight:600;
  color:var(--ink-3,#686862)}
.portal-ledger__chip+.portal-ledger__chip::before{content:"·";margin:0 6px;color:var(--ink-4,#8b8b85)}
.portal-ledger__chip--risk{color:var(--red,#bf3b31)}
.portal-ledger__chip--need{color:var(--green,#3a7a4b)}

.market-signals {
  display: grid;
  gap: clamp(10px, 1.2vw, 14px);
  padding: clamp(14px, 1.8vw, 20px) clamp(16px, 2vw, 24px);
  background: var(--bg-card, #ffffff);
  border: 1px solid var(--stroke-subtle, rgba(34, 34, 34, 0.08));
  border-radius: 3px;
  margin-bottom: clamp(20px, 3vw, 32px);
}
.market-signals__title {
  font-family: var(--font-display, 'Archivo', system-ui, sans-serif);
  font-size: var(--fs-headline-sm, clamp(18px, 1.2vw + 12px, 22px)); font-weight: 600; line-height: 1.2;
  color: var(--fg-primary, #222222); margin: 2px 0 0;
}
.market-signals__rows {
  display: grid;
  gap: 0;
  border-top: 1px solid var(--stroke-subtle, rgba(34, 34, 34, 0.08));
}
.market-signals__row {
  display: grid;
  grid-template-columns: 1fr auto;
  align-items: baseline;
  gap: 12px;
  padding: 9px 0;
  border-bottom: 1px solid var(--stroke-subtle, rgba(34, 34, 34, 0.07));
  font-variant-numeric: tabular-nums;
}
.market-signals__row:last-child { border-bottom: none; }
.market-signals__label {
  font-family: 'Archivo', var(--font-sans, system-ui, sans-serif);
  font-size: 13px; color: var(--fg-secondary, #5b5b5b);
}
.market-signals__sublabel {
  font-size: 12px; color: var(--fg-muted, #8b8b8b); margin-left: 6px;
}
.market-signals__value {
  font-family: 'Archivo','Helvetica Neue',Arial,sans-serif;
  font-size: 20px; font-weight: 600; line-height: 1;
  color: var(--fg-primary, #222222);
}
.market-signals__value--muted {
  color: var(--fg-muted, #8b8b8b); font-size: 16px;
}
.market-signals__foot {
  font-family: 'Archivo', var(--font-sans, system-ui, sans-serif);
  font-size: 12px; color: var(--fg-muted, #8b8b8b);
  border-top: 1px solid var(--stroke-subtle, rgba(34, 34, 34, 0.07));
  padding-top: 8px; margin: 0;
}
.market-signals__delta {
  font-family: 'Archivo', var(--font-sans, system-ui, sans-serif);
  font-size: 12px; font-weight: 700; margin-left: 8px;
}
.market-signals__delta--up   { color: #3a7a4b; }
.market-signals__delta--down { color: #bf3b31; }


/* Backometer night band — fanbase belief verdict (Group Chat Noir) */

/* Backometer night band (Group Chat Noir, embedded in the light team page) */
.bm-band {
  margin: clamp(20px, 3vw, 32px) 0;
  border-radius: 3px;
  background: #ffffff;
  border: 1px solid rgba(34,34,34,0.12);
  overflow: hidden;
}
.bm-band__inner { padding: clamp(18px, 2.6vw, 30px) clamp(18px, 2.8vw, 32px); }
.bm-band__head {
  display: flex; align-items: baseline; justify-content: space-between;
  gap: 12px; flex-wrap: wrap; margin-bottom: 14px;
}
.bm-eyebrow {
  font-family: 'Archivo', 'Helvetica Neue', Arial, sans-serif; font-size: 12.5px; font-weight: 700;
  letter-spacing: .01em; text-transform: none; color: #222222;
}
.bm-link {
  font-family: 'Archivo', 'Helvetica Neue', Arial, sans-serif; font-size: 12px; color: #5b5b5b;
  text-decoration: none; border-bottom: 1px solid rgba(34,34,34,0.12); transition: opacity .1s ease-in;
}
.bm-link:hover { opacity:.8; }
.bm-verdict {
  display: flex; align-items: baseline; justify-content: space-between;
  gap: 16px; flex-wrap: wrap; margin-bottom: 10px;
}
.bm-zone {
  font-family: 'Archivo', 'Arial Narrow', sans-serif; font-weight: 800; text-transform: none; line-height: 1;
  font-size: clamp(30px, 6vw, 52px); letter-spacing: .01em; color: var(--bm-zone);
}
.bm-score {
  font-family: 'Archivo', 'Arial Narrow', sans-serif; font-weight: 800; line-height: 1; color: var(--bm-zone);
  font-size: clamp(40px, 8vw, 68px); font-variant-numeric: tabular-nums;
  display: inline-flex; align-items: baseline; gap: 14px;
}
.bm-delta {
  font-family: 'Archivo', 'Helvetica Neue', Arial, sans-serif; font-size: 15px; font-weight: 500;
}
.bm-delta-unit { color: #5b5b5b; font-size: 12px; }
.bm-chart {
  background: #ffffff; border: 1px solid rgba(34,34,34,0.12); border-radius: 3px;
  padding: 8px 10px; margin: 4px 0 14px;
}
.bm-chart svg { display: block; width: 100%; height: auto; }
.bm-receipt {
  font-family: 'Archivo', 'Helvetica Neue', Arial, sans-serif; font-size: 12px; font-weight: 500; color: #5b5b5b;
}
@media (max-width: 520px) {
  .bm-chart { overflow-x: auto; -webkit-overflow-scrolling: touch; }
  .bm-chart svg { min-width: 520px; }
}


/* Rent Free night band — rival obsession readout (Group Chat Noir) */

/* Rent Free — two-sided rivalry obsession (doc-90 light, share-based) */
.rfx{margin:clamp(20px,3vw,30px) 0;background:var(--bg-card,#f1f1ec);
  border:1px solid var(--line,#e3e3e1);border-radius:3px;padding:clamp(16px,2.4vw,26px);}
.rfx-eyebrow{font:700 .8rem/1.3 Archivo,sans-serif;letter-spacing:.01em;
  color:var(--text-1,#222);margin-bottom:14px;}
.rfx-trend{font:400 .82rem/1.5 Archivo,sans-serif;color:var(--text-2,#444);
  margin:0 0 16px;padding-bottom:14px;border-bottom:1px solid var(--line,#e3e3e1);
  display:flex;flex-wrap:wrap;align-items:baseline;gap:5px 10px;}
.rfx-tlead{font-weight:700;color:var(--text-1,#222);}
.rfx-trate{font-variant-numeric:tabular-nums;}
.rfx-trank{color:var(--text-3,#6b6b6b);}
.rfx-trank b{color:var(--text-2,#444);font-weight:600;}
.rfx-tmv{font-weight:800;font-size:.8rem;font-variant-numeric:tabular-nums;letter-spacing:-.01em;}
.rfx-tmv.up{color:#3a7a4b;}.rfx-tmv.dn{color:#bf3b31;}
.rfx-cols{display:grid;grid-template-columns:1fr 1fr;gap:clamp(14px,2vw,26px);}
@media(max-width:560px){.rfx-cols{grid-template-columns:1fr;}}
.rfx-h{font:600 1.02rem/1.2 'Archivo','Helvetica Neue',Arial,sans-serif;
  color:var(--text-1,#222);margin-bottom:12px;}
.rfx-list{list-style:none;margin:0;padding:0;}
.rfx-list li{display:grid;grid-template-columns:118px 1fr auto;align-items:center;
  gap:10px;padding:7px 0;border-top:1px solid var(--line,#e3e3e1);}
.rfx-list li:first-child{border-top:none;}
.rfx-list a,.rfx-list span{color:var(--text-1,#222);text-decoration:none;
  font:600 .9rem/1.2 Archivo,sans-serif;}
.rfx-list a{transition:opacity .1s ease-in;}
.rfx-list a:hover{opacity:.8;}
.rfx-bar{height:7px;background:#e3e3e1;border-radius:3px;overflow:hidden;}
.rfx-fill{display:block;height:100%;background:var(--text-2,#444);}
.rfx-pct{font:700 .82rem/1 Archivo,sans-serif;color:var(--text-1,#222);
  font-variant-numeric:tabular-nums;text-align:right;min-width:34px;}
.rfx-sub{font:400 .8rem/1.4 Archivo,sans-serif;color:var(--text-3,#6b6b6b);margin-top:10px;}


/* Board Pulse — forum diehard thread feed */

/* Board Pulse — §board-pulse */
.board-pulse {
  padding: clamp(14px, 1.8vw, 20px) clamp(16px, 2vw, 24px);
  background: var(--page, #fff);
  border: 1px solid rgba(34,34,34,0.08);
  border-radius: 3px;
  margin-bottom: clamp(20px, 3vw, 32px);
}
.board-pulse__header {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 8px;
  margin-bottom: 12px;
}
.board-pulse__eyebrow {
  font-family: var(--font-sans, 'Archivo', system-ui, sans-serif);
  font-size: 12.5px;
  font-weight: 700;
  letter-spacing: 0.01em;
  color: var(--ink, #222);
  margin: 0;
  text-transform: none;
}
.board-pulse__attr {
  display: inline-flex;
  align-items: center;
  font-family: var(--font-sans, 'Archivo', system-ui, sans-serif);
  font-size: 12px;
  color: var(--fg-muted, #888);
  margin: 0;
}
.board-pulse__attr .src-ic { width: 10px; height: 10px; margin: 0 3px; }
.bp-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 10px;
}
.bp-thread {
  display: grid;
  gap: 3px;
}
.bp-thread__title {
  font-family: var(--font-sans, 'Archivo', system-ui, sans-serif);
  font-size: clamp(13px, 1.1vw + 8px, 15px);
  font-weight: 500;
  color: var(--fg-primary, #222);
  line-height: 1.35;
  text-decoration: none;
  transition: opacity .1s ease-in;
}
a.bp-thread__title:hover { opacity: .8; }
a.bp-thread__title { color: #1d68a3; }
.bp-thread__meta {
  display: flex;
  gap: 8px;
  align-items: center;
}
.bp-thread__replies,
.bp-thread__age {
  font-family: var(--font-sans, 'Archivo', system-ui, sans-serif);
  font-size: 12px;
  color: var(--fg-muted, #888);
}
.bp-thread + .bp-thread {
  padding-top: 10px;
  border-top: 1px solid rgba(34,34,34,0.06);
}
.src-ic{width:11px;height:11px;margin-right:3px;vertical-align:-1.5px;flex-shrink:0}

.press-pulse{margin:28px 0 0}
.press-pulse__header{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap;
  border-bottom:1px solid var(--rule,#d9d9d3);margin-bottom:12px;padding-bottom:10px}
.press-pulse__eyebrow{font-family:"Archivo","Helvetica Neue",Arial,sans-serif;font-weight:600;font-size:22px;
  color:var(--ink,#222);margin:0}
.press-pulse__attr{font-family:"Archivo",system-ui,sans-serif;font-size:12px;
  color:var(--ink-3,#686862);font-weight:500;margin:0 0 0 auto}
.press-pulse__lede{font-family:"Archivo",system-ui,sans-serif;font-size:13.5px;
  color:var(--ink-2,#5b5b5b);margin:0 0 14px}
.press-pulse .pp-list{display:flex;flex-direction:column;gap:10px}
.press-pulse .pp-card .pc-receipt{margin:0}


/* pc-* visual-grammar registry (player_pages/components.py) -- required by any
   page using render_receipt_card()/render_quote_card(). Press Pulse's own quote
   cards (.pc-receipt) call into it but this bundle never carried the registry
   itself, so every quote card on every team page rendered with zero border/
   background/padding -- caught 2026-09-10 auditing the same gap on coach pages,
   which had the identical miss (see coaching_board.py's own _CSS bundle). */

/* ── Player-page component registry (audit item 14) ─────────────────────── */
/* Card tiers. Doc 90 §2.7: white surface + mandatory 1px --line hairline,
   --r-2 radius, no shadow. The gray plot panel retired (DESIGN.md) and a
   gray fill is never a tier-2 card background -- that ban is what tier 2
   encodes. */
.pc-card {
  background: var(--page, #ffffff);
  border: 1px solid var(--line, #e4e4e1);
  border-radius: var(--r-2, 3px);
  padding: 16px 20px;
  margin: 0 0 24px;
}
/* Tier 1 -- "the site stands behind this". Its 4px ribbon retired with the
   No Side Stripe Rule (DESIGN.md); --pc-ribbon is still injected inline per
   card (strict hex only) but nothing draws it. */
.pc-card--t1 { }
/* Tier 2 -- "context / derived": white + hairline, NO ribbon, NO fill.
   Quietness is the absence of the ribbon plus the eyebrow-register title
   (P4 §7 disagreement #1 overriding P1 §5.1's gray-panel proposal). */
.pc-card--t2 { padding: 14px 18px; }
.pc-card--t2 .pc-card__title {
  font-family: var(--sans, 'Archivo', system-ui, sans-serif);
  font-size: 13px;
  font-weight: 600;
  color: var(--ink-2, #5b5b5b);
}
/* Tier 3 -- "model opinion / thin sample, labeled": thin box + the chip. */
.pc-card--t3 { padding: 12px 16px; border-color: var(--line, #e4e4e1); }
.pc-card--t3 .pc-card__title {
  font-family: var(--sans, 'Archivo', system-ui, sans-serif);
  font-size: 14px;
  font-weight: 600;
  color: var(--ink, #222222);
}
.pc-card__head {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 4px 10px;
  margin-bottom: 10px;
}
.pc-card__head > .pc-kicker { flex: 1 0 100%; }
.pc-card__title {
  font-family: 'Archivo', 'Helvetica Neue', Arial, sans-serif;
  font-size: 19px;
  font-weight: 600;
  line-height: 1.2;
  color: var(--ink, #222222);
  margin: 0;
}
.pc-card__sub {
  font-family: var(--sans, 'Archivo', system-ui, sans-serif);
  font-size: 13px;
  line-height: 18px;
  font-weight: 400;
  color: var(--ink-3, #8b8b8b);
  margin: 0;
}
.pc-card__conf { margin-left: auto; }
.pc-card__body { font-family: var(--sans, 'Archivo', system-ui, sans-serif); }

/* Kicker / eyebrow. Sentence case -- doc 90 bans all-caps tracked labels, so
   there is deliberately no text-transform here. */
.pc-kicker {
  font-family: var(--sans, 'Archivo', system-ui, sans-serif);
  font-size: 11.5px;
  font-weight: 600;
  letter-spacing: .04em;
  line-height: 1.5;
  color: var(--ink-3, #8b8b8b);
  margin: 0 0 2px;
}
.pc-kicker--accent { color: var(--gold-text,#8a6200); }
.pc-kicker--quiet  { color: var(--ink-3, #8b8b8b); opacity: .8; }

/* Stat-hero numeral -- doc 90 data-hero row: Archivo 30-74 / .85, weight 800,
   tabular-nums. Owner ruling 2026-08-06: Archivo, never Fraunces. */
.pc-hero { display: block; margin: 0 0 8px; }
.pc-hero__num {
  display: block;
  font-family: var(--sans, 'Archivo', system-ui, sans-serif);
  font-weight: 800;
  line-height: .85;
  font-variant-numeric: tabular-nums lining-nums;
  color: var(--ink, #222222);
}
.pc-hero--sm .pc-hero__num { font-size: 30px; }
.pc-hero--md .pc-hero__num { font-size: 40px; }
.pc-hero--lg .pc-hero__num { font-size: clamp(40px, 4vw, 56px); }
.pc-hero--xl .pc-hero__num { font-size: clamp(48px, 6vw, 74px); }
.pc-hero__label {
  display: block;
  margin-top: 6px;
  font-family: var(--sans, 'Archivo', system-ui, sans-serif);
  font-size: 13px;
  font-weight: 600;
  color: var(--ink-2, #5b5b5b);
}
.pc-hero__sub {
  display: block;
  font-family: var(--sans, 'Archivo', system-ui, sans-serif);
  font-size: 12px;
  line-height: 16px;
  color: var(--ink-3, #8b8b8b);
}

/* Receipt card -- pass 3 §5. The quote-tweet contract, flat: 1px border,
   <=3px radius, no shadow, and a mandatory date. */
.pc-receipt {
  border: 1px solid var(--line, #e4e4e1);
  border-radius: var(--r-2, 3px);
  background: var(--page, #ffffff);
  padding: 12px 14px;
  margin: 0 0 12px;
}
.pc-receipt__quote {
  font-family: var(--sans, 'Archivo', system-ui, sans-serif);
  font-size: 15px;
  line-height: 1.5;
  color: var(--ink, #222222);
  margin: 0 0 8px;
  quotes: '\201C' '\201D';
}
.pc-receipt__quote::before { content: open-quote; }
.pc-receipt__quote::after  { content: close-quote; }
.pc-receipt__meta {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 6px;
  font-family: var(--sans, 'Archivo', system-ui, sans-serif);
  font-size: 12px;
  color: #686862;
}
.pc-receipt__source { font-weight: 600; color: var(--ink-2, #5b5b5b); }
a.pc-receipt__source { text-decoration: none; }
a.pc-receipt__source:hover { text-decoration: underline; color: var(--ink, #222); }
.pc-receipt__sep { color: var(--ink-3, #8b8b8b); }
.pc-receipt__date { font-variant-numeric: tabular-nums lining-nums; }
.pc-receipt__context { color: var(--ink-3, #8b8b8b); }
/* Identity, never an accent -- doc 100: identity is not a data meaning. */
.pc-receipt__role { color: var(--ink-2, #5b5b5b); }

/* Relation accents -- bound once, here, instead of in each host module's
   private CSS. DESIGN.md (D-143) retires side stripes, so the relation rides
   on the 40px rule above the quote, the house quote mark: `own_words` = ink
   (the subject speaking is identity, not a data meaning); `about` = gold
   (what people say); `verdict` = green/red only once an outcome is actually
   known, since an unresolved claim is not a measured result; `context` =
   gray. A card with no data-relation has no rule. */
.pc-receipt[data-relation]::before { content: ""; display: block; width: 40px; height: 3px;
  margin: 0 0 8px; background: var(--line, #e7e7e2); }
.pc-receipt[data-relation="own_words"]::before { background: var(--ink, #222222); }
.pc-receipt[data-relation="about"]::before     { background: var(--gold, #b7851a); }
.pc-receipt[data-relation="context"]::before   { background: var(--ink-3, #686862); }
.pc-receipt[data-relation="verdict"][data-outcome="hit"]::before  { background: var(--green, #3a7a4b); }
.pc-receipt[data-relation="verdict"][data-outcome="miss"]::before { background: var(--red, #bf3b31); }

/* data-source-type -- emitted by render_receipt_card since it shipped and
   styled by NOTHING until 2026-09-09, so a fan comment, a podcast line and a
   beat-writer quote were visually identical. This is the user's "who is this
   and why should I trust them" signal, carried without a text label: a small
   glyph before the attribution, weight and colour only, no pill and no
   badge (doc 90: flat, radius <=3px, no capsules). Sentence-case glyphs are
   deliberately punctuation-like rather than emoji -- they must not read as
   decoration next to a 12px meta line. */
.pc-receipt__source::before {
  font-weight: 400;
  color: var(--ink-3, #8b8b8b);
  margin-right: 5px;
}
.pc-receipt[data-source-type="outlet"] .pc-receipt__source::before { content: "\25A0"; }
.pc-receipt[data-source-type="podcast"] .pc-receipt__source::before { content: "\25B6"; }
.pc-receipt[data-source-type="fan"] .pc-receipt__source::before { content: "\25CF"; }
/* Trust reads left-to-right in weight: a named outlet is the darkest, a
   podcast mid, an anonymous community comment the lightest. */
.pc-receipt[data-source-type="outlet"] .pc-receipt__source { color: var(--ink, #222222); }
.pc-receipt[data-source-type="podcast"] .pc-receipt__source { color: var(--ink-2, #5b5b5b); }
.pc-receipt[data-source-type="fan"] .pc-receipt__source { color: var(--ink-3, #8b8b8b); font-weight: 500; }

/* Field position -- "who's around you" on a rank ladder (part 10).
   A list, not a chart: no fills, no bars, no plot area. The only visual weight
   is on the subject row, and it comes from type weight plus a 2px identity
   accent -- doc 90 keeps team color to a thin accent that carries data, never
   a fill or a section tint. */
.pc-field { margin: 8px 0 0; }
.pc-field__list {
  list-style: none;
  margin: 0;
  padding: 0;
  border-top: 1px solid var(--line, #e4e4e1);
}
.pc-field__row {
  display: flex;
  align-items: baseline;
  gap: 10px;
  padding: 4px 0 4px 8px;
  border-bottom: 1px solid var(--line, #e4e4e1);
  font-family: var(--sans, 'Archivo', system-ui, sans-serif);
  font-size: 13px;
  line-height: 1.45;
  color: var(--ink-2, #5b5b5b);
}
.pc-field__row--subject {
  color: var(--ink, #222222);
  font-weight: 700;
}
.pc-field__rank {
  min-width: 3.2em;
  font-weight: 800;
  font-variant-numeric: tabular-nums lining-nums;
  color: var(--ink-3, #8b8b8b);
}
.pc-field__row--subject .pc-field__rank { color: var(--ink, #222222); }
.pc-field__name { flex: 1; min-width: 0; }
.pc-field__name a { color: inherit; text-decoration: none; }
.pc-field__name a:hover { text-decoration: underline; }
.pc-field__you {
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .04em;
  color: var(--ink-3, #8b8b8b);
}
/* The elision row states the count it swallowed -- a bare ellipsis would hide
   how big the gap is, which is exactly the number a reader is judging. */
.pc-field__gap {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 3px 0 3px 8px;
  border-bottom: 1px solid var(--line, #e4e4e1);
}
.pc-field__gap-rule {
  flex: 1;
  height: 0;
  border-top: 1px dotted var(--line, #e4e4e1);
}
.pc-field__gap-n {
  font-family: var(--sans, 'Archivo', system-ui, sans-serif);
  font-size: 11px;
  color: var(--ink-3, #8b8b8b);
  font-variant-numeric: tabular-nums lining-nums;
}
.pc-field__more {
  display: inline-block;
  margin-top: 6px;
  font-family: var(--sans, 'Archivo', system-ui, sans-serif);
  font-size: 12px;
  color: var(--blue, #1d68a3);
  text-decoration: none;
}
.pc-field__more:hover { text-decoration: underline; }

/* Keep-reading bar -- P4 §5.1. One row, hairline-topped, eyebrow register. */
.pc-keep {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  justify-content: space-between;
  gap: 8px 20px;
  margin-top: 32px;
  padding-top: 14px;
  border-top: 1px solid var(--line, #e4e4e1);
  font-family: var(--sans, 'Archivo', system-ui, sans-serif);
  font-size: 13px;
  line-height: 1.5;
  color: var(--ink-2, #5b5b5b);
}
.pc-keep a { color: var(--ink, #222222); text-decoration: none; }
.pc-keep a:hover { text-decoration: underline; }
.pc-keep__next { font-weight: 600; }
.pc-keep__teaser { font-weight: 400; color: var(--ink-2, #5b5b5b); }
.pc-keep__arrow { color: var(--ink-3, #8b8b8b); }
.pc-keep__pagers { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 12px; }
.pc-keep__eyebrow { flex: 1 0 100%; font-size: 11.5px; color: var(--ink-3, #8b8b8b); }
.pc-keep__pager { white-space: nowrap; }
.pc-keep__pager--prev { margin-right: auto; }
.pc-keep__pager--next { margin-left: auto; }
.pc-keep__more { color: var(--ink-3, #8b8b8b); }
.pc-keep__more-label { font-weight: 600; color: var(--ink-2, #5b5b5b); }
@media (max-width: 600px) {
  .pc-keep { flex-direction: column; align-items: flex-start; }
}

/* The close at the end of each tab (2026-10-04 audit S-17): a plain list of
   text links -- next game, team, coach, Heisman board, plays, the other tabs.
   No boxes, no arrows; hover is opacity (DESIGN.md). */
.pc-close {
  margin-top: 32px;
  padding-top: 14px;
  border-top: 1px solid var(--line, #e4e4e1);
  font-family: var(--sans, 'Archivo', system-ui, sans-serif);
  font-size: 15px;
  line-height: 1.5;
  color: var(--ink-2, #5b5b5b);
}
.pc-close__list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 0; }
/* 44px tap target without changing how the link looks (phone-width review, 2026-10-04: 17px tall). */
.pc-close a { display: inline-block; min-height: 44px; box-sizing: border-box; padding: 10px 4px; margin: 0 -4px; line-height: 24px; color: var(--ink, #222222); text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 3px; }
.pc-close a:hover { opacity: .72; }
.pc-close + .pc-keep { margin-top: 16px; }


/* Five Lenses — multi-source voice grid */

/* Five Lenses — §five-lenses */
.five-lenses {
  padding: clamp(14px, 1.8vw, 20px) clamp(16px, 2vw, 24px);
  background: var(--page, #ffffff);
  border: 1px solid rgba(34,34,34,0.10);
  border-radius: 3px;
  margin-bottom: clamp(20px, 3vw, 32px);
}
.five-lenses__header {
  display: flex;
  align-items: baseline;
  gap: 10px;
  margin-bottom: 14px;
  flex-wrap: wrap;
}
/* DESIGN.md (2026-09-28): the title is a sentence-case label; cards are not
   tinted (a thin rule separates them); the post count and the source are
   caption words, not boxed pills or a Reddit-orange badge; the quote is
   upright, with a short gold rule above it instead of a side stripe. */
.fl-eyebrow {
  font-family: var(--font-sans, 'Archivo', system-ui, sans-serif);
  font-size: 12.5px;
  font-weight: 700;
  letter-spacing: 0.01em;
  color: var(--ink, #222);
  margin: 0;
  flex-shrink: 0;
}
.fl-subhead {
  font-family: var(--font-sans, 'Archivo', system-ui, sans-serif);
  font-size: 12.5px;
  color: var(--fg-muted, #686862);
  margin: 0;
}
.fl-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
  gap: 12px;
}
@media (max-width: 600px) {
  .fl-grid {
    grid-template-columns: 1fr;
    gap: 1px;
    background: rgba(34,34,34,0.08);
    border: 1px solid rgba(34,34,34,0.08);
    border-radius: 3px;
    overflow: hidden;
  }
}
.fl-card {
  padding: 10px 0 0;
  border-top: 1px solid var(--line, #e7e7e2);
  display: grid;
  gap: 6px;
}
@media (max-width: 600px) {
  .fl-card {
    border-top: 0;
    padding: 12px 14px;
    background: var(--page, #ffffff);
  }
}
.fl-card__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 6px;
}
.fl-card__eyebrow {
  font-family: var(--font-sans, 'Archivo', system-ui, sans-serif);
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.01em;
  color: var(--ink, #222);
  line-height: 1.2;
}
.fl-card__count {
  font-family: var(--font-sans, 'Archivo', system-ui, sans-serif);
  font-size: 12px;
  font-weight: 500;
  color: var(--ink-3, #686862);
  white-space: nowrap;
}
.fl-card__title {
  font-family: var(--font-sans, 'Archivo', system-ui, sans-serif);
  font-size: clamp(12px, 1vw + 9px, 14px);
  font-weight: 500;
  line-height: 1.35;
  color: var(--ink, #222);
  text-decoration: none;
  display: block;
}
a.fl-card__title {
  color: #1d68a3;
}
a.fl-card__title:hover {
  text-decoration: underline;
}
.fl-card__meta {
  font-family: var(--font-sans, 'Archivo', system-ui, sans-serif);
  font-size: 12px;
  color: var(--fg-muted, #888);
  margin: 0;
  line-height: 1.3;
}

/* ── Native receipt body (doc 97 P4) ── */
.fll-receipt {
  display: grid;
  gap: 5px;
}
/* Reddit subreddit source (a caption word with its icon) */
.fll-sub {
  display: inline-flex;
  align-items: center;
  font: 600 12px/1.2 Archivo, system-ui, sans-serif;
  color: var(--ink-3, #686862);
  width: fit-content;
}
/* Non-Reddit source (a caption word with its icon) */
.fll-src-pill {
  display: inline-flex;
  align-items: center;
  font: 600 12px/1.2 Archivo, system-ui, sans-serif;
  color: var(--ink-3, #686862);
  width: fit-content;
}
/* Quote block */
.fll-quote {
  font: 400 .8rem/1.4 Archivo, system-ui, sans-serif;
  color: var(--fg-secondary, #555);
  margin: 0;
}
.fll-quote::before {
  content: "";
  display: block;
  width: 40px;
  height: 3px;
  background: var(--gold, #b7851a);
  margin: 0 0 8px;
}
.fll-quote-link {
  color: inherit;
  text-decoration: none;
  transition: opacity .1s ease-in;
}
.fll-quote-link:hover {
  text-decoration: underline;
  opacity: .8;
}
/* Footer attribution */
.fll-foot {
  display: flex;
  flex-wrap: wrap;
  gap: 2px 4px;
  align-items: center;
  font: 400 12px/1.3 Archivo, system-ui, sans-serif;
  color: var(--fg-tertiary, #8b8b8b);
}
.fll-user { font-weight: 600; color: var(--fg-secondary, #555); }
.fll-score { font-variant-numeric: tabular-nums; }
.fll-ago  { }
.fll-sub .src-ic, .fll-src-pill .src-ic { width: 11px; height: 11px; margin-right: 4px; vertical-align: -1px; }
.src-ic{width:11px;height:11px;margin-right:3px;vertical-align:-1.5px;flex-shrink:0}

.pcanon{margin:28px 0}
.pcanon__header{margin-bottom:14px}
.pcanon__title{font-family:'Archivo Head','Archivo','Helvetica Neue',Arial,sans-serif;font-weight:800;font-size:24px;
  line-height:1.15;color:#222;margin:0;text-wrap:balance}
.pcanon__sub{font-family:'Archivo',sans-serif;font-size:13px;color:#6a6a64;margin:4px 0 0}

/* Measured across the 158 PROFILED teams (not the corpus-wide spread, which is
   dominated by unprofiled trivia): 1 team has a single moment, 34 have two, 102
   have three, 9 have four, 10 have five, 2 have six. Three is the case to design
   for; one and six are the cases that must not break.
   Only n=1 breaks, so only n=1 is special-cased: a lone card with a 1fr track ate
   every column and rendered as a full-width banner (Central Michigan). Capping the
   TRACK instead looks like the tidier fix and is a trap — at 340px three cards
   need 1040px and the grid is 1036, so Harvard's six silently re-wrapped 2-per-row
   and left a dead column. 1fr keeps every row full at 2..6; :only-child fixes the
   one case that isn't. */
.pcanon__grid{display:grid;gap:10px;
  grid-template-columns:repeat(auto-fit,minmax(220px,1fr))}
.pcanon__card:only-child{max-width:340px}
/* DESIGN.md (2026-09-28): white framed cards; no handling-colour side stripe. */
.pcanon__card{position:relative;background:#fff;border:1px solid #e7e7e2;border-radius:3px;
  padding:14px 14px 14px 16px}
/* The slot is held open when the name already carries the year (~48% of
   moments), so every headline in the row starts on the same line. line-height
   and min-height must be the SAME explicit value: the filled chip's line box is
   17.75px at this size, so a min-height guessed at 14px still left the blank
   card's headline 4px high. */
.pcanon__year{font-family:'Archivo',sans-serif;font-size:12px;font-weight:700;
  font-variant-numeric:tabular-nums;color:#686862;
  margin:0 0 2px;line-height:18px;min-height:18px}
.pcanon__name{font-family:'Archivo','Helvetica Neue',Arial,sans-serif;font-weight:600;font-size:17px;
  line-height:1.2;color:#222;margin:0;text-wrap:balance}
.pcanon__name-link{color:inherit;text-decoration:none;border-bottom:1px solid #d9d9d3;
  transition:opacity .1s ease-in}
.pcanon__name-link:hover{opacity:.8}
.pcanon__what{font-family:'Archivo',sans-serif;font-size:13px;line-height:1.45;
  color:#4a4a44;margin:6px 0 0}
.pcanon__tag{font-family:'Archivo',sans-serif;font-size:12.5px;font-weight:700;
  letter-spacing:.01em;color:#686862;margin:8px 0 0}

@media (max-width:640px){
  .pcanon__grid{grid-template-columns:1fr}
  .pcanon__title{font-size:20px}
}


/* From the Booth — native podcast-episode embed (2026-07-14) */

.podcast-spotlight { margin: 28px 0 0 }
.podcast-spotlight__head {
  display: flex; align-items: baseline; gap: 10px;
  border-bottom: 2px solid var(--ink, #222);
  margin-bottom: 18px; padding-bottom: 10px;
}
.podcast-spotlight__lbl {
  font-family: "Archivo", "Helvetica Neue", Arial, sans-serif; font-weight: 600; font-size: 22px;
  color: var(--ink, #222); margin: 0;
}
.podcast-spotlight__meta { font-size: 12.5px; color: var(--ink-3, #686862); font-weight: 500 }
@font-face{font-family:"Reddit Sans";src:url(/assets/fonts/RedditSans-Bold.woff2) format("woff2");font-weight:700;font-style:normal;font-display:swap}@font-face{font-family:"Roboto";src:url(/assets/fonts/Roboto-Bold.woff2) format("woff2");font-weight:700;font-style:normal;font-display:swap}@font-face{font-family:"Inter";src:url(/assets/fonts/Inter-Bold.woff2) format("woff2");font-weight:700;font-style:normal;font-display:swap}.tlcard{border:1px solid var(--line);border-radius:var(--r2,3px);overflow:hidden;background:var(--page);transition:var(--card-hover-t,box-shadow .15s,transform .15s)}.tlcard:has(.tlface):hover{box-shadow:var(--card-hover-shadow,0 2px 10px rgba(0,0,0,.07));transform:var(--card-hover-lift,translateY(-1px))}.tlface{display:flex;flex-direction:column;width:100%;padding:0;border:0;background:none;text-align:left;font:inherit;color:inherit;cursor:pointer}.tlthumb{display:block;width:100%;aspect-ratio:16/9;background:#000 center/cover no-repeat;position:relative}.tlplay{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-size:22px;color:#fff;text-shadow:0 1px 6px rgba(0,0,0,.6)}.tlmeta{display:flex;flex-direction:column;gap:4px;padding:12px}.tlprov{display:inline-flex;align-items:center;gap:4px;font-size:11px;font-weight:700}.tlprov svg{width:13px;height:13px;margin-right:0;flex-shrink:0}.tlc-bluesky{color:var(--blue-text,var(--blue,#006ba3));font-family:"Inter","Archivo",sans-serif}.tlc-threads{color:var(--ink)}.tlc-youtube{color:var(--red-text,var(--red,#c23a20));font-family:"Roboto","Archivo",sans-serif}.tlc-podcast{color:var(--gold-text,var(--gold,#96690f))}.tlc-reddit{color:#c0340b;font-family:"Reddit Sans","Archivo",sans-serif}.tlaudio{width:100%;display:block;margin:6px 0 2px}.tlauthor{font-weight:600;font-size:13px}.tlsnip{font-size:12.5px;line-height:1.4;color:var(--ink-2);margin:0;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}.tlcta{font-size:11px;font-weight:700;color:var(--red-text,var(--red,#c23a20));margin-top:2px}.tlframe{display:block;width:100%;aspect-ratio:16/9;border:0}.tlcard.tl-loaded .tlface{display:none}

/* Who this fanbase talks about — keyness specimen, entity-filtered (was "The Lexicon") */

/* Who this fanbase talks about — keyness specimen, entity-filtered (was "The Lexicon") */
.lexicon-module {
  display: grid;
  gap: clamp(10px, 1.2vw, 14px);
  padding: clamp(14px, 1.8vw, 20px) clamp(16px, 2.0vw, 24px);
  background: var(--page, #fff);
  border: 1px solid var(--stroke-subtle, rgba(34, 34, 34, 0.08));
  border-radius: 3px;
  margin-bottom: clamp(20px, 3vw, 32px);
}
.lexicon-module__head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 12px;
  flex-wrap: wrap;
}
.lexicon-module__eyebrow {
  font-family: var(--font-sans, system-ui, sans-serif);
  font-size: 12.5px;
  font-weight: 700;
  letter-spacing: 0.01em;
  text-transform: none;
  color: var(--ink, #222);
}
.lexicon-module__cohort {
  font-family: var(--font-mono, ui-monospace, monospace);
  font-size: 12px;
  letter-spacing: 0.01em;
  text-transform: none;
  color: var(--fg-muted);
  font-variant-numeric: tabular-nums;
}
.lexicon-module__lede {
  font-family: var(--font-sans, system-ui, sans-serif);
  font-size: 13px;
  line-height: 1.5;
  color: var(--fg-muted, #8b8b8b);
  max-width: 62ch;
  margin: 0;
}
.lexicon-module__specimen {
  text-align: center;
  padding: clamp(10px, 1.6vw, 20px) 0 4px;
}
.lexicon-module__specimen-term {
  font-family: var(--font-display, 'Archivo', Impact, sans-serif);
  font-size: clamp(44px, 9vw, 88px);
  line-height: 0.95;
  letter-spacing: 0.01em;
  text-transform: none;
  color: var(--fg-primary, #222222);
  overflow-wrap: anywhere;
}
/* The specimen's reference ("×2.3 the field"): a caption, not a boxed chip. */
.lexicon-module__specimen-chip {
  display: inline-block;
  margin-top: 10px;
  font-family: var(--font-mono, ui-monospace, monospace);
  font-size: 12.5px;
  font-weight: 500;
  letter-spacing: 0.01em;
  text-transform: none;
  color: var(--ink-3, #686862);
  font-variant-numeric: tabular-nums;
}
.lexicon-module__wall {
  display: grid;
  gap: 0;
}
.lexicon-module__band {
  font-family: var(--font-mono, ui-monospace, monospace);
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.01em;
  text-transform: none;
  color: var(--fg-muted);
  padding: 14px 0 4px;
}
.lexicon-module__band--sig { color: var(--gold-text, #8a6200); }
.lexicon-module__row {
  display: flex;
  align-items: baseline;
  gap: 14px;
  padding: 6px 0;
  border-bottom: 1px solid var(--stroke-subtle, rgba(34, 34, 34, 0.08));
}
.lexicon-module__row:last-child { border-bottom: none; }
.lexicon-module__term {
  font-family: 'Archivo', 'Helvetica Neue', Arial, sans-serif;
  color: var(--fg-primary);
  line-height: 1.1;
  min-width: 0;
  overflow-wrap: anywhere;
}
.lexicon-module__chip {
  font-family: var(--font-mono, ui-monospace, monospace);
  font-size: 12px;
  font-weight: 600;
  color: var(--gold-text, #8a6200);
  white-space: nowrap;
  font-variant-numeric: tabular-nums;
}
.lexicon-module__count {
  font-family: var(--font-mono, ui-monospace, monospace);
  font-size: 12px;
  color: var(--fg-muted);
  margin-left: auto;
  white-space: nowrap;
  font-variant-numeric: tabular-nums;
}
.lexicon-module__receipt {
  border-top: 1px dashed var(--stroke-subtle, rgba(34, 34, 34, 0.08));
  padding-top: 12px;
}
.lexicon-module__quote {
  font-family: 'Archivo', 'Helvetica Neue', Arial, sans-serif;
  font-size: 15px;
  line-height: 1.55;
  color: var(--fg-primary);
  margin: 0;
}
.lexicon-module__hl {
  color: inherit; /* override the UA's <mark> marktext default */
  background: color-mix(in srgb, var(--gold, #b7851a) 22%, transparent);
  box-shadow: inset 0 -2px 0 var(--gold, #b7851a);
  padding: 0 2px;
  border-radius: 2px;
}
.lexicon-module__prov {
  font-family: var(--font-mono, ui-monospace, monospace);
  font-size: 12px;
  letter-spacing: 0.01em;
  text-transform: none;
  color: var(--fg-muted);
  margin-top: 8px;
}
/* Name of the week — Language Layer Wave 2 (C1). Absent => no row at all.
   Framed by a 1px line only: no side stripe, no tint (DESIGN.md). */
.lexicon-module__wow {
  display: flex;
  align-items: baseline;
  gap: 10px;
  flex-wrap: wrap;
  padding: 8px 12px;
  border: 1px solid var(--stroke-default, #e4e4e1);
  border-radius: 3px;
}
.lexicon-module__wow-eyebrow {
  font-family: var(--font-mono, ui-monospace, monospace);
  font-size: 12.5px;
  font-weight: 700;
  letter-spacing: 0.01em;
  text-transform: none;
  color: var(--gold-text, #8a6200);
}
.lexicon-module__wow-term {
  font-family: var(--font-display, 'Archivo', Impact, sans-serif);
  font-size: clamp(20px, 3.6vw, 30px);
  line-height: 1;
  letter-spacing: 0.01em;
  text-transform: none;
  color: var(--fg-primary);
  overflow-wrap: anywhere;
}
.lexicon-module__wow-chip {
  font-family: var(--font-mono, ui-monospace, monospace);
  font-size: 12px;
  font-weight: 600;
  color: var(--gold-text, #8a6200);
  white-space: nowrap;
  font-variant-numeric: tabular-nums;
}
.lexicon-module__wow-wk {
  font-family: var(--font-mono, ui-monospace, monospace);
  font-size: 12px;
  letter-spacing: 0.01em;
  text-transform: none;
  color: var(--fg-muted);
  margin-left: auto;
  white-space: nowrap;
  font-variant-numeric: tabular-nums;
}
.kwic { margin-top: .75rem; }
.kwic__summary { cursor: pointer; font-size: .8rem; color: var(--color-muted, #8b8b8b); }
.kwic__list { margin: .5rem 0 0; padding-left: 1.2rem; }
.kwic__item { margin-bottom: .4rem; font-size: .82rem; }
.kwic__q { quotes: none; }
.kwic__src { color: var(--color-muted, #8b8b8b); font-size: .8rem; }


/* What the sport calls them — cross-link into /words/<word>/ (2026-09-15) */

/* What the sport calls them — cross-link into /words/<word>/.
   DESIGN.md (2026-09-28): no gold side stripe; the multiple is Talk Gold
   text (#8a6200), since it counts what people say. */
.slang-xl {
  display: grid;
  gap: clamp(8px, 1vw, 12px);
  padding: clamp(14px, 1.8vw, 20px) clamp(16px, 2.0vw, 24px);
  border: 1px solid var(--stroke-subtle, rgba(34, 34, 34, 0.08));
  border-radius: 3px;
  font-family: "Archivo", system-ui, sans-serif;
}
.slang-xl__head { display: flex; flex-wrap: wrap; gap: 6px 14px; align-items: baseline; }
.slang-xl__eyebrow { font-weight: 700; font-size: 0.95rem; color: #222; }
.slang-xl__cohort { font-size: .8rem; color: #666; }
.slang-xl__lede { margin: 0; font-size: 0.92rem; line-height: 1.5; color: #444; max-width: 62ch; }
.slang-xl__list { list-style: none; margin: 0; padding: 0; display: grid; gap: 6px; }
.slang-xl__item {
  display: grid; grid-template-columns: minmax(0, 1fr) auto; grid-template-areas: "word num" "lab lab";
  column-gap: 12px; row-gap: 2px; padding: 8px 0; border-top: 1px solid rgba(34, 34, 34, 0.08); align-items: baseline;
}
.slang-xl__word { grid-area: word; font-family: "Archivo", "Helvetica Neue", Arial, sans-serif; font-weight: 600; font-size: 1.15rem; color: #222; text-decoration: none; }
.slang-xl__word:hover, .slang-xl__word:focus-visible { text-decoration: underline; text-underline-offset: 3px; }
.slang-xl__num { grid-area: num; font-variant-numeric: tabular-nums; font-weight: 800; font-size: 1.15rem; color: var(--gold-text, #8a6200); }
.slang-xl__lab { grid-area: lab; font-size: 0.8rem; color: #666; }
.slang-xl__more { font-size: 0.85rem; font-weight: 700; color: #222; text-decoration: none; }
.slang-xl__more:hover, .slang-xl__more:focus-visible { text-decoration: underline; text-underline-offset: 3px; }
@media (min-width: 560px) {
  .slang-xl__item { grid-template-columns: minmax(0, 1fr) auto minmax(0, 1.4fr); grid-template-areas: "word num lab"; }
  .slang-xl__lab { text-align: left; }
}


/* Rivalry words — head-to-head slang staging vs. tier-1 rival (2026-09-16) */

/* Rivalry words — head-to-head staging of the slang board's lift figures.
   DESIGN.md (2026-09-28): no gold side stripe; the higher multiple is Talk
   Gold text (#8a6200). */
.slang-riv {
  display: grid;
  gap: clamp(8px, 1vw, 12px);
  padding: clamp(14px, 1.8vw, 20px) clamp(16px, 2.0vw, 24px);
  border: 1px solid var(--stroke-subtle, rgba(34, 34, 34, 0.08));
  border-radius: 3px;
  font-family: "Archivo", system-ui, sans-serif;
}
.slang-riv__head { display: flex; flex-wrap: wrap; gap: 6px 14px; align-items: baseline; }
.slang-riv__eyebrow { font-weight: 700; font-size: 0.95rem; color: #222; }
.slang-riv__cohort { font-size: .8rem; color: #666; }
.slang-riv__lede { margin: 0; font-size: 0.9rem; line-height: 1.5; color: #444; max-width: 66ch; }
.slang-riv__cols { display: grid; grid-template-columns: 64px 1fr 64px; gap: 8px;
                    font-size: .8rem; font-weight: 700; color: #666; margin-top: 4px; }
.slang-riv__colname { text-align: left; }
.slang-riv__colname--r { text-align: right; }
.slang-riv__list { list-style: none; margin: 0; padding: 0; display: grid; gap: 2px; }
.slang-riv__row {
  display: grid; grid-template-columns: 64px 1fr 64px; gap: 8px; align-items: center;
  padding: 8px 0; border-top: 1px solid rgba(34, 34, 34, 0.08);
}
.slang-riv__word { font-family: "Archivo", "Helvetica Neue", Arial, sans-serif; font-weight: 600; font-size: 1.0rem;
                    color: #222; text-decoration: none; text-align: center; }
.slang-riv__word:hover, .slang-riv__word:focus-visible { text-decoration: underline; text-underline-offset: 3px; }
.slang-riv__val { font-variant-numeric: tabular-nums; font-weight: 800; font-size: 0.95rem; color: #666; }
.slang-riv__val--gold { color: var(--gold-text, #8a6200); }
.slang-riv__val--dash { color: #bbb; font-weight: 600; }
.slang-riv__row .slang-riv__val:last-child { text-align: right; }
.slang-riv__more { font-size: 0.85rem; font-weight: 700; color: #222; text-decoration: none; }
.slang-riv__more:hover, .slang-riv__more:focus-visible { text-decoration: underline; text-underline-offset: 3px; }


/* Beat Coverage — "Who covers this team" reporter grid */
.beat-cov{margin:28px 0 0}
.beat-cov__head{display:flex;align-items:baseline;gap:10px;
  border-bottom:2px solid var(--ink,#222);margin-bottom:18px;padding-bottom:10px}
.beat-cov__lbl{font-family:"Archivo","Helvetica Neue",Arial,sans-serif;font-weight:600;font-size:22px;
  color:var(--ink,#222)}
.beat-cov__grid{display:grid;
  grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:12px}
.bc-card{background:#fff;border:1px solid var(--line,#e4e4e1);border-radius:3px;
  padding:12px 14px;display:flex;flex-direction:column}
.bc-card-head{display:flex;align-items:center;gap:7px;font-size:12px;margin:0 0 9px}
.bc-card-dot{position:relative;width:20px;height:20px;border-radius:2px;
  background:#e8e8e5;color:#555;font-size:12px;font-weight:700;
  display:inline-flex;align-items:center;justify-content:center;
  overflow:hidden;flex:0 0 auto}
.bc-card-outlet{font-weight:700;color:var(--ink,#222)}
.bc-card-paywall{margin-left:auto;font-size:12.5px;font-weight:500;
  color:var(--ink-3,#686862)}
.bc-card-name{font-family:"Archivo","Helvetica Neue",Arial,sans-serif;font-weight:600;font-size:16px;
  color:var(--ink,#222);margin:0 0 2px}
.bc-card-title{font-size:12.5px;color:var(--ink-2,#5b5b5b);margin:0 0 10px;flex:1}
.bc-card-foot{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-top:auto}
.bc-card-link,.bc-card-follow{font-size:12px;font-weight:600;color:var(--blue,#1d68a3);
  text-decoration:none;display:inline-flex;align-items:center;gap:3px;
  transition:opacity .1s ease-in}
.bc-card-link:hover,.bc-card-follow:hover{opacity:.8}
.bc-card-follow{color:var(--ink-3,#686862)}
.beat-cov__notice{font-size:12.5px;color:var(--ink-3,#686862);margin-top:14px;
  line-height:1.6}
.beat-cov__xp-wrap{margin-top:12px}

/* Rivalry Mirror night band — fight card (Group Chat Noir, Language Layer Wave 2) */

/* Rivalry Mirror night band (Group Chat Noir, Language Layer Wave 2) */
.mirror-band {
  margin: clamp(20px, 3vw, 32px) 0; border-radius: 3px;
  background: #ffffff; border: 1px solid rgba(34,34,34,0.12); overflow: hidden;
}
.mirror-band__inner { padding: clamp(18px, 2.6vw, 30px) clamp(18px, 2.8vw, 32px); }
.mirror-band__head {
  display: flex; align-items: baseline; justify-content: space-between;
  gap: 12px; flex-wrap: wrap; margin-bottom: 8px;
}
.mirror-band__eyebrow {
  font-family: 'Archivo', 'Helvetica Neue', Arial, sans-serif; font-size: 12.5px; font-weight: 700;
  letter-spacing: .01em; text-transform: none; color: #222222;
}
.mirror-band__season {
  font-family: 'Archivo', 'Helvetica Neue', Arial, sans-serif; font-size: 12px; color: #5b5b5b;
  font-variant-numeric: tabular-nums;
}
.mirror-band__tape {
  display: grid; grid-template-columns: 1fr 56px 1fr; align-items: center;
  padding: 14px 0 8px; gap: 6px;
}
.mirror-band__name {
  font-family: Archivo, 'Arial Narrow', 'Helvetica Neue', sans-serif; text-transform: none; line-height: .95;
  letter-spacing: .01em; font-size: clamp(24px, 5vw, 44px);
}
.mirror-band__name--l { text-align: right; color: var(--mirror-l, #222222); }
.mirror-band__name--r { text-align: left; color: var(--mirror-r, #222222); }
.mirror-band__x {
  font-family: Archivo, 'Arial Narrow', 'Helvetica Neue', sans-serif; font-size: clamp(18px, 3.6vw, 30px);
  color: #5b5b5b; text-align: center;
}
.mirror-band__sub {
  text-align: center; font-family: 'Archivo', 'Helvetica Neue', Arial, sans-serif; font-size: 12px;
  color: #5b5b5b; letter-spacing: .01em; text-transform: none;
  padding: 0 0 16px; font-variant-numeric: tabular-nums;
}
.mirror-band__tug { padding: 6px 0; }
.mirror-band__tug-head {
  display: grid; grid-template-columns: 1fr 1fr; padding: 0 0 10px; gap: 12px;
}
.mirror-band__tug-head div {
  font-family: 'Archivo', 'Helvetica Neue', Arial, sans-serif; font-size: 12px; letter-spacing: .01em;
  text-transform: none; color: #5b5b5b;
}
.mirror-band__tug-head div:last-child { text-align: right; }
.mirror-band__row {
  display: grid; grid-template-columns: 1fr 1fr; align-items: center; min-height: 30px;
}
.mirror-band__cell { position: relative; height: 24px; }
.mirror-band__spine {
  position: absolute; top: -4px; bottom: -4px; width: 1px;
  background: rgba(237, 230, 214, 0.18);
}
.mirror-band__cell--l .mirror-band__spine { right: 0; }
.mirror-band__cell--r .mirror-band__spine { left: 0; }
.mirror-band__stem {
  position: absolute; top: 50%; height: 2px; transform: translateY(-50%);
}
.mirror-band__cell--l .mirror-band__stem {
  right: 0;
  background: color-mix(in srgb, var(--mirror-l, #222222) 60%, transparent);
}
.mirror-band__cell--r .mirror-band__stem {
  left: 0;
  background: color-mix(in srgb, var(--mirror-r, #222222) 60%, transparent);
}
.mirror-band__tdot {
  position: absolute; top: 50%; transform: translate(-50%, -50%);
  width: 11px; height: 11px; border-radius: 50%; border: 2px solid #ffffff;
}
.mirror-band__cell--l .mirror-band__tdot { background: var(--mirror-l, #222222); }
.mirror-band__cell--r .mirror-band__tdot { background: var(--mirror-r, #222222); }
/* The term is a word, not a chip: a white knockout keeps the stem from
   running through it. */
.mirror-band__tlabel {
  position: absolute; top: 50%; transform: translateY(-50%);
  font-size: 12.5px; font-weight: 600; white-space: nowrap; color: #222222;
  background: #ffffff; padding: 0 6px;
}
.mirror-band__tz {
  font-family: 'Archivo', 'Helvetica Neue', Arial, sans-serif; font-size: 12px; color: #5b5b5b;
  font-weight: 400; margin-left: 6px; font-variant-numeric: tabular-nums;
}
.mirror-band__asym {
  font-family: 'Archivo', 'Helvetica Neue', Arial, sans-serif; font-size: 12px; color: #5b5b5b;
  padding: 10px 0 4px; letter-spacing: .01em;
}
.mirror-band__asym--l { text-align: left; }
.mirror-band__asym--r { text-align: right; }
.mirror-band__receipt {
  border-top: 1px dashed rgba(34,34,34,0.12); margin-top: 14px; padding-top: 12px;
}
.mirror-band__quote {
  font-family: 'Archivo', 'Helvetica Neue', Arial, sans-serif;
  font-size: 15px; line-height: 1.55; color: #222222; margin: 0;
}
.mirror-band__prov {
  font-family: 'Archivo', 'Helvetica Neue', Arial, sans-serif; font-size: 12px; letter-spacing: .01em;
  text-transform: none; color: #5b5b5b; margin-top: 8px;
}
.mirror-band__foot {
  font-family: 'Archivo', 'Helvetica Neue', Arial, sans-serif; font-size: 12px; color: #5b5b5b; margin-top: 14px;
  letter-spacing: .01em;
}
@media (max-width: 540px) {
  .mirror-band__tlabel { font-size: 12px; }
  .mirror-band__tug-head div { font-size: 12px; }
}


/* Fanbase Voice — personality percentile card (Language Layer Wave 2) */

/* Fanbase Voice — personality percentile card (Language Layer Wave 2) */
.voice-profile {
  display: grid;
  gap: clamp(10px, 1.2vw, 14px);
  padding: clamp(14px, 1.8vw, 20px) clamp(16px, 2.0vw, 24px);
  background: var(--page, #fff);
  border: 1px solid var(--stroke-subtle, rgba(34, 34, 34,0.08));
  border-radius: 3px;
  margin-bottom: clamp(20px, 3vw, 32px);
  font-variant-numeric: tabular-nums;
}
.voice-profile__head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 12px;
  flex-wrap: wrap;
}
.voice-profile__mentions {
  font-family: var(--font-mono, ui-monospace, monospace);
  font-size: 12px;
  letter-spacing: 0.01em;
  text-transform: none;
  color: var(--fg-muted);
}
.voice-profile__arch {
  font-family: var(--font-display, 'Archivo', Impact, sans-serif);
  font-size: clamp(22px, 1.8vw + 10px, 30px);
  line-height: 1.05;
  letter-spacing: 0.01em;
  text-transform: none;
  color: var(--fg-primary);
}
.voice-profile__bars { display: grid; gap: 2px; }
.voice-profile__row {
  display: grid;
  grid-template-columns: 84px 1fr 44px;
  gap: 10px;
  align-items: center;
  padding: 5px 0;
}
.voice-profile__lbl {
  font-family: var(--font-sans, system-ui, sans-serif);
  font-size: 12.5px;
  font-weight: 600;
  color: var(--fg-primary);
}
.voice-profile__track {
  position: relative;
  height: 8px;
  background: rgba(34, 34, 34, 0.06);
  border-radius: 3px;
}
.voice-profile__med {
  position: absolute;
  left: 50%;
  top: -3px;
  bottom: -3px;
  width: 1px;
  background: var(--stroke-strong, #d7d7d4);
}
.voice-profile__dot {
  position: absolute;
  top: 50%;
  transform: translate(-50%, -50%);
  width: 15px;
  height: 15px;
  border-radius: 50%;
  /* The subject is drawn in ink (DESIGN.md: team colour lives in the logo only). */
  background: var(--ink, #222);
  border: 2px solid var(--bg-primary, #ffffff);
}
.voice-profile__pct {
  font-family: var(--font-mono, ui-monospace, monospace);
  font-size: 12px;
  text-align: right;
  color: var(--fg-primary);
}
.voice-profile__cohort {
  font-family: var(--font-mono, ui-monospace, monospace);
  font-size: 12px;
  letter-spacing: 0.01em;
  text-transform: none;
  color: var(--fg-muted);
}
@media (max-width: 480px) {
  .voice-profile__row { grid-template-columns: 72px 1fr 40px; gap: 8px; }
  .voice-profile__lbl { font-size: 12px; }
}


/* Fan-voice era chapter bands (Language Layer Wave 4) */

/* === Era Chapter Module === */
.era-ch {
  margin: 2rem 0;
  padding: 0;
}

.era-ch__heading {
  font-family: 'Archivo', 'Impact', sans-serif;
  font-size: 1.1rem;
  font-weight: 700;
  letter-spacing: 0.01em;
  text-transform: none;
  color: var(--ink, #222);
  margin: 0 0 1rem 0;
}

/* One season per band, separated by a 1px rule: no side stripe, no tint. */
.era-ch__band {
  border-top: 1px solid var(--line, #e7e7e2);
  padding: 0.85rem 0;
  margin-bottom: 0.25rem;
}

.era-ch__year {
  font-family: 'Archivo', 'Impact', sans-serif;
  font-size: 1.35rem;
  letter-spacing: 0.01em;
  color: var(--fg-primary, #222222);
  display: block;
  margin-bottom: 0.25rem;
}

.era-ch__label {
  font-family: 'Archivo', 'Impact', sans-serif;
  font-size: 1.05rem;
  letter-spacing: 0.01em;
  color: var(--text-primary, #222222);
  display: block;
  margin-bottom: 0.55rem;
}

/* The season's words: a plain list (weight still encodes distinctiveness). */
.era-ch__chips {
  display: flex;
  flex-wrap: wrap;
  gap: 0.35rem 0.4rem;
  margin-bottom: 0.6rem;
}

.era-ch__chip {
  font-family: 'Archivo', 'Helvetica Neue', Arial, sans-serif;
  font-size: 0.82rem;
  color: var(--text-primary, #222222);
  white-space: nowrap;
  line-height: 1.5;
}

.era-ch__chip + .era-ch__chip::before {
  content: "·";
  margin-right: 0.4rem;
  color: #8b8b85;
  font-weight: 400;
}

/* A quote gets a short Talk Gold rule above it, never a side stripe. */
.era-ch__receipt {
  margin: 0.5rem 0 0 0;
  padding: 0;
  font-family: 'Archivo', 'Helvetica Neue', Arial, sans-serif;
  font-size: 0.82rem;
  line-height: 1.55;
  color: var(--ink-2, #45453f);
}

.era-ch__receipt::before {
  content: "";
  display: block;
  width: 40px;
  height: 3px;
  background: var(--gold, #b7851a);
  margin: 0 0 8px;
}

.era-ch__hl {
  background: color-mix(in srgb, var(--gold, #b7851a) 22%, transparent);
  color: var(--text-primary, #222222);
  font-style: normal;
  padding: 0 0.15em;
  border-radius: 2px;
}

@media (max-width: 640px) {
  .era-ch__band {
    padding: 0.7rem 0;
  }

  .era-ch__year {
    font-size: 1.15rem;
  }

  .era-ch__label {
    font-size: 0.95rem;
  }

  .era-ch__chip {
    font-size: .8rem;
  }

  .era-ch__receipt {
    font-size: .8rem;
  }
}


/* Current-chapter spine — doc 97 §13 */

/* Chapter spine — doc 97 §13 */
.ch-wrap{margin:0 0 12px}
.chapter{display:flex;align-items:stretch;background:var(--row,#f7f7f6);
  border:1px solid var(--line,#e4e4e1);
  border-radius:var(--r-2,3px);overflow:hidden;transition:opacity .1s ease-in}
.chapter:hover{opacity:.93}
.ch-n{flex:0 0 60px;display:flex;flex-direction:column;align-items:center;
  justify-content:center;gap:5px;padding:14px 0 12px;
  border-right:1px solid var(--line,#e4e4e1)}
.ch-logo{width:24px;height:24px;object-fit:contain;display:block}
.ch-n-val{font-family:'Archivo Head','Archivo','Helvetica Neue',Arial,sans-serif;font-weight:800;font-size:28px;
  line-height:1;color:var(--ink,#222)}
.ch-body{flex:1;min-width:0;padding:13px 18px 12px}
.ch-cat{display:inline-block;font-family:'Archivo',system-ui,sans-serif;
  font-size:12.5px;font-weight:700;letter-spacing:.01em;line-height:1.3;
  color:var(--ink-3,#686862);margin-bottom:4px}
.ch-headline{font-family:'Archivo','Helvetica Neue',Arial,sans-serif;font-size:19px;font-weight:600;
  line-height:1.3;color:var(--ink,#222);margin:0 0 7px}
.ch-headline a{color:inherit;text-decoration:none}
.ch-take{font-family:'Archivo','Helvetica Neue',Arial,sans-serif;font-size:13.5px;
  font-weight:400;line-height:1.65;color:var(--ink-2,#5b5b5b);margin:0 0 11px}
.ch-footer{display:flex;align-items:baseline;gap:10px;
  font-family:'Archivo',system-ui,sans-serif;font-size:12px;
  color:var(--ink-3,#686862)}
.ch-status{flex:1;min-width:0}
.ch-status::before{content:'— '}
.ch-cta{font-size:12px;font-weight:700;font-family:'Archivo',system-ui,sans-serif;
  color:var(--ink,#222);text-decoration:none;white-space:nowrap;
  flex-shrink:0;transition:opacity .1s ease-in}
.ch-cta:hover{opacity:.75}
@media(max-width:460px){
  .ch-n{flex:0 0 50px}
  .ch-logo{width:20px;height:20px}
  .ch-n-val{font-size:24px}
  .ch-headline{font-size:17px}
  .ch-take{font-size:13px}
  .ch-footer{flex-wrap:wrap}
  .ch-status{flex:1 1 100%;order:2}
  .ch-cta{order:1}
}


/* Discourse Atlas fanbase cluster chip (Language Layer Wave 4) */

.atlas-chip {
    display: inline-flex;
    flex-direction: column;
    gap: 6px;
    border: 1px solid var(--stroke-default, #e4e4e1);
    border-radius: 3px;
    padding: 12px 16px;
    background: var(--bg-card, #ffffff);
    min-width: 200px;
    max-width: 100%;
}

.atlas-chip__label {
    font-family: 'Archivo', system-ui, sans-serif;
    font-size: 12.5px;
    font-weight: 700;
    letter-spacing: 0.01em;
    text-transform: none;
    color: var(--ink, #222);
    line-height: 1.3;
}

.atlas-chip__name {
    font-family: 'Archivo', Impact, sans-serif;
    font-size: 22px;
    font-weight: 700;
    letter-spacing: 0.01em;
    color: var(--fg-primary, #222222);
    line-height: 1.1;
}

.atlas-chip__terms {
    display: flex;
    flex-wrap: wrap;
    gap: 0 6px;
    margin-top: 2px;
}

/* The shared words are words, not pills (DESIGN.md: labels are words; boxes
   are for things you can press). Talk Gold text = what fans say. */
.atlas-chip__term-pill {
    font-family: 'Archivo', system-ui, sans-serif;
    font-size: 12.5px;
    font-weight: 500;
    color: var(--gold-text, #8a6200);
    line-height: 1.5;
    white-space: nowrap;
}

.atlas-chip__term-pill + .atlas-chip__term-pill::before {
    content: "·";
    margin-right: 6px;
    color: #8b8b85;
}

.atlas-chip__count {
    font-family: 'Archivo', system-ui, sans-serif;
    font-size: 12px;
    color: var(--fg-muted, #8b8b8b);
    margin-top: 2px;
}

@media (max-width: 600px) {
    .atlas-chip {
        width: 100%;
        box-sizing: border-box;
    }
}


/* Delusion Premium night band — belief vs market (Group Chat Noir) */

/* Delusion Premium night band (Group Chat Noir) */
.dp-band { margin: clamp(20px,3vw,32px) 0; border-radius: 3px; background: #ffffff;
  border: 1px solid rgba(34,34,34,0.12); overflow: hidden; }
.dp-band__inner { padding: clamp(18px,2.6vw,30px) clamp(18px,2.8vw,32px); }
.dp-band__head { display: flex; align-items: baseline; justify-content: space-between;
  gap: 12px; flex-wrap: wrap; margin-bottom: 14px; }
.dp-eyebrow { font-family: 'Archivo', 'Helvetica Neue', Arial, sans-serif; font-size: 12.5px; font-weight: 700;
  letter-spacing: .01em; text-transform: none; color: #222222; }
.dp-link { font-family: 'Archivo', 'Helvetica Neue', Arial, sans-serif; font-size: 12px; color: #5b5b5b;
  text-decoration: none; border-bottom: 1px solid rgba(34,34,34,0.12); transition: opacity .1s ease-in; }
.dp-link:hover { opacity:.8; }
.dp-verdict { display: flex; align-items: baseline; justify-content: space-between;
  gap: 16px; flex-wrap: wrap; margin-bottom: 14px; }
.dp-word { font-family: Archivo, 'Arial Narrow', 'Helvetica Neue', sans-serif; text-transform: none; line-height: 1;
  font-size: clamp(28px,5vw,46px); letter-spacing: .01em; color: var(--dp-accent); }
.dp-rank { font-family: Archivo, 'Arial Narrow', 'Helvetica Neue', sans-serif; font-size: clamp(30px,5vw,46px); line-height: 1;
  color: var(--dp-accent); font-variant-numeric: tabular-nums; }
.dp-rank-unit { font-family: 'Archivo', 'Helvetica Neue', Arial, sans-serif; font-size: 13px; color: #5b5b5b; }
.dp-rows { display: flex; flex-direction: column; gap: 10px; }
.dp-row { display: grid; grid-template-columns: 130px 1fr 52px; align-items: center; gap: 12px; }
.dp-label { font-family: 'Archivo', 'Helvetica Neue', Arial, sans-serif; font-size: 12px; }
.dp-track { background: #f1f1ec; border-radius: 3px; height: 16px; overflow: hidden; }
.dp-track > i { display: block; height: 100%; border-radius: 3px; }
.dp-val { font-family: 'Archivo', 'Helvetica Neue', Arial, sans-serif; font-size: 15px; color: #222222; text-align: right;
  font-variant-numeric: tabular-nums; }
.dp-receipt { font-family: 'Archivo', 'Helvetica Neue', Arial, sans-serif; font-size: 12px; color: #5b5b5b; margin-top: 14px; }
@media (max-width: 520px) { .dp-row { grid-template-columns: 110px 1fr 46px; } }


/* Roster Reload - separated continuity, portal, draft, and recruiting */

/* Roster Reload dashboard. DESIGN.md (2026-09-28): a white framed card with
   no team-colour stripe; metrics are a plain row of facts; labels sentence
   case; the transfer identity is a word, not a chip. */
.roster-reload {
  margin-bottom: clamp(20px, 3vw, 32px);
  padding: clamp(16px, 2.2vw, 24px) clamp(18px, 2.4vw, 28px);
  background: var(--bg-card, #ffffff);
  border: 1px solid var(--stroke-subtle, rgba(34, 34, 34,0.08));
  border-radius: 3px;
  font-variant-numeric: tabular-nums;
}
.roster-reload__head {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  gap: 12px;
  margin-bottom: clamp(12px, 1.6vw, 18px);
  border-bottom: 1px dashed var(--stroke-subtle, rgba(34, 34, 34,0.07));
  padding-bottom: 10px;
}
.roster-reload__title {
  font-family: var(--font-serif, 'Archivo Head', 'Archivo', 'Helvetica Neue', Arial, sans-serif);
  font-size: var(--fs-headline, clamp(22px, 1.8vw + 14px, 30px));
  font-weight: 800;
  letter-spacing: normal;
  text-transform: none;
  color: var(--fg-primary);
  margin: 0;
}
.roster-reload__tag {
  font-family: var(--font-sans, system-ui, sans-serif);
  font-size: 12.5px;
  font-weight: 700;
  letter-spacing: 0.01em;
  text-transform: none;
  color: var(--fg-muted);
  white-space: nowrap;
}
.roster-reload__grid {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: clamp(8px, 1.2vw, 12px);
}
@media (max-width: 1100px) {
  .roster-reload__grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
.roster-reload__metric {
  min-height: 102px;
  padding: 10px 0 0;
  border-top: 1px solid var(--stroke-subtle, rgba(34, 34, 34,0.1));
  overflow-wrap: anywhere;
}
.roster-reload__metric-label {
  display: block;
  font-family: var(--font-sans, system-ui, sans-serif);
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.01em;
  text-transform: none;
  color: var(--fg-muted);
  margin-bottom: 7px;
}
.roster-reload__metric-value {
  display: block;
  font-family: var(--font-display, 'Archivo', system-ui, sans-serif);
  /* 2026-09-01 fan audit §3: "#2 nationally" still split "nationall / y" at
     desktop width in the six-track grid at the old 36px ceiling. Smaller
     responsive ceiling so the longest value fits a ~150px track, and
     overflow-wrap:normal + word-break:keep-all so a token is NEVER split
     mid-word (overriding the parent's overflow-wrap:anywhere) -- wrapping
     between "#2" and "nationally" is fine, inside a word is not. */
  font-size: clamp(20px, 1.2vw + 8px, 28px);
  line-height: 1;
  color: var(--fg-primary);
  overflow-wrap: normal;
  word-break: keep-all;
}
.roster-reload__metric-value--add { color: var(--green, #3a7a4b); }
.roster-reload__metric-value--loss { color: var(--red, #bf3b31); }
.roster-reload__metric-note {
  display: block;
  margin-top: 6px;
  font-family: 'Archivo', 'Helvetica Neue', Arial, sans-serif;
  font-size: 12px;
  line-height: 1.35;
  color: var(--fg-secondary);
}
.roster-reload__positions {
  margin-top: clamp(12px, 1.8vw, 18px);
  display: grid;
  gap: 8px;
}
.roster-reload__position {
  display: grid;
  grid-template-columns: minmax(48px, 0.4fr) repeat(2, minmax(0, 1fr)) minmax(0, 1.1fr);
  gap: 10px;
  align-items: center;
  padding: 9px 10px;
  border: 1px solid var(--stroke-subtle, rgba(34, 34, 34,0.06));
  border-radius: 3px;
}
.roster-reload__pos {
  font-family: var(--font-sans, 'Archivo', system-ui, sans-serif);
  font-size: 12px;
  font-weight: 800;
  color: var(--fg-primary);
}
.roster-reload__flow {
  font-family: var(--font-sans, system-ui, sans-serif);
  font-size: 12px;
  color: var(--fg-secondary);
}
.roster-reload__flow strong {
  color: var(--fg-primary);
  font-weight: 800;
}
.roster-reload__player-link {
  color: var(--fg-secondary);
  text-decoration: none;
  transition: opacity .1s ease-in;
}
.roster-reload__player-link:hover {
  opacity: .8;
  text-decoration: underline;
}
.roster-reload__flag {
  justify-self: end;
  font-family: var(--font-sans, system-ui, sans-serif);
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0.01em;
  text-transform: none;
  color: var(--fg-muted, #686862);
}
.roster-reload__flag--up { color: var(--green, #3a7a4b); }
.roster-reload__flag--down { color: var(--red, #bf3b31); }
.roster-reload__flag--even { color: var(--fg-muted); }
.roster-reload__rating {
  font-family: var(--font-sans, 'Archivo', system-ui, sans-serif);
  font-size: 12px;
  font-weight: 700;
  color: var(--fg-muted);
  margin-left: 2px;
}
@media (max-width: 900px) {
  .roster-reload__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .roster-reload__position { grid-template-columns: minmax(42px, 0.35fr) minmax(0, 1fr); }
  .roster-reload__flag { justify-self: start; }
}
@media (max-width: 480px) {
  .roster-reload__head { flex-direction: column; align-items: flex-start; }
  .roster-reload__grid { grid-template-columns: 1fr; }
  .roster-reload__metric { min-height: 0; }
  .roster-reload__position {
    grid-template-columns: minmax(38px, auto) minmax(0, 1fr);
    gap: 8px;
  }
  .roster-reload__flow { font-size: 12px; }
}

/* Incoming-transfer identity line (player-quality-signals-fable R3.2/R4.2D).
   Strictly nano: leaf label + signature phrase, no bars. Archivo, ink/ink-2/
   line hex, like the rest of the module since the 2026-09-28 DESIGN.md pass.
   Spans the position row's full grid width as its own line. */
.roster-reload__transfer {
  grid-column: 1 / -1;
  margin-top: 6px;
  padding-top: 6px;
  border-top: 1px dashed var(--stroke-subtle, rgba(34, 34, 34, 0.07));
  font-family: 'Archivo', system-ui, sans-serif;
}
.roster-reload__size {
  grid-column: 1 / -1;
  font-family: var(--font-sans, system-ui, sans-serif);
  font-size: 12px;
  color: var(--fg-muted);
}
.roster-reload__size-note { font-style: normal; }
/* The transfer's identity is a bold word, not a bordered chip. */
.roster-reload__transfer-chip {
  display: inline-block;
  font-size: 13px;
  font-weight: 700;
  color: var(--ink, #222222);
}
.roster-reload__transfer-star {
  margin-left: 4px;
  font-size: 13px;
  color: var(--gold-text,#8a6200);
}
.roster-reload__transfer-season {
  margin-left: 6px;
  font-size: 12px;
  color: var(--ink-3, #8b8b8b);
}
.roster-reload__transfer-phrase {
  display: block;
  margin-top: 3px;
  font-size: 13px;
  line-height: 1.4;
  color: var(--ink-2, #5b5b5b);
}
.roster-reload__transfer-flaw {
  display: block;
  margin-top: 4px;
  font-size: 13px;
  line-height: 1.4;
  color: var(--ink-2, #5b5b5b);
}
/* Style-lane beat-1 tag (research §22.6.B), one of the four positive
   modifiers: a caption word after a middle dot, not a bordered chip
   (DESIGN.md). Never shown for ball_security, which reroutes to its own
   concern sub-line (.roster-reload__transfer-flaw, reused below).
   (.roster-reload__transfer-tag, the "our read" tag, retired with D-144.)
*/
.roster-reload__transfer-style {
  margin-left: 4px;
  display: inline-block;
  font-size: 12px;
  font-weight: 700;
  color: var(--fg-muted);
}
.roster-reload__transfer-style::before { content: "· "; font-weight: 400; }

/* Draft-loss succession (Next Man Up) Face-Off cards -- native 538 tokens
   (--ink/--line/--blue/--red), the same deliberate, minimal reconciliation
   the transfer-identity block above already establishes for this otherwise
   legacy-token module. Doc 94 Move 2 (stage conflict side-by-side) applied
   to a place that never used it: departed-vs-heir, not a bare count. */
.roster-reload__succession {
  grid-column: 1 / -1;
  margin-top: clamp(12px, 1.8vw, 18px);
  display: grid;
  gap: 8px;
}
.roster-reload__succession-head {
  font-family: 'Archivo', system-ui, sans-serif;
  font-size: 12.5px;
  font-weight: 700;
  letter-spacing: 0.01em;
  color: var(--ink-3, #686862);
}
.roster-reload__faceoff {
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: center;
  gap: 10px;
  padding: 10px 12px;
  border: 1px solid var(--line, #e4e4e1);
  border-radius: 3px;
  background: #ffffff;
  font-family: 'Archivo', system-ui, sans-serif;
}
.roster-reload__fo-side { min-width: 0; }
.roster-reload__fo-side--right { text-align: right; }
.roster-reload__fo-pos {
  display: block;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.01em;
  color: var(--ink-3, #686862);
  margin-bottom: 2px;
}
.roster-reload__fo-name {
  font-size: 14px;
  font-weight: 600;
  color: var(--ink, #222222);
  text-decoration: none;
}
a.roster-reload__fo-name:hover { text-decoration: underline; }
.roster-reload__fo-meta {
  display: block;
  font-size: 12px;
  color: var(--ink-2, #5b5b5b);
  margin-top: 2px;
}
.roster-reload__fo-arrow {
  font-size: 13px;
  color: var(--ink-3, #8b8b8b);
}
.roster-reload__fo-read {
  grid-column: 1 / -1;
  margin-top: 4px;
  padding-top: 8px;
  border-top: 1px dashed var(--line, #e4e4e1);
}

/* The depth chart's own read on the heir ("Confirmed starter", "Projected
   starter") as a caption. It replaced render_band_chip()'s coloured
   ``.confidence`` chip, whose copied CSS lived here, on 2026-09-28
   (DESIGN.md: no confidence chips). */
.roster-reload__fo-note {
  font-size: 12.5px;
  font-weight: 500;
  color: var(--ink-3, #686862);
}

/* Full-roster drawer (2026-08-25, SEO pass) -- native <details>, no JS.
   Collapsed by default so it adds zero visible layout/paint cost; content
   is still present in the DOM for crawlers regardless of open state. */
.roster-reload__full {
  grid-column: 1 / -1;
  margin-top: clamp(10px, 1.6vw, 16px);
  font-family: 'Archivo', system-ui, sans-serif;
}
.roster-reload__full > summary {
  cursor: pointer;
  font-size: 12.5px;
  font-weight: 700;
  letter-spacing: 0.01em;
  color: var(--ink-2, #5b5b5b);
  list-style: none;
}
.roster-reload__full > summary::-webkit-details-marker { display: none; }
.roster-reload__full > summary::before { content: "+ "; color: var(--ink-3, #8b8b8b); }
.roster-reload__full[open] > summary::before { content: "\2212 "; }
.roster-reload__full-body {
  margin-top: 8px;
  padding-top: 8px;
  border-top: 1px dashed var(--line, #e4e4e1);
  display: grid;
  gap: 6px;
}
.roster-reload__full-group {
  display: grid;
  grid-template-columns: minmax(42px, 0.2fr) 1fr;
  gap: 8px;
  font-size: 12px;
  line-height: 1.5;
}
.roster-reload__full-pos {
  font-weight: 800;
  font-size: 12px;
  letter-spacing: 0.01em;
  color: var(--ink-3, #686862);
  padding-top: 2px;
}
.roster-reload__full-names { color: var(--ink-2, #5b5b5b); }
.roster-reload__full-names a {
  color: var(--ink, #222222);
  text-decoration: none;
}
.roster-reload__full-names a:hover { text-decoration: underline; }


/* Evidence-gated preview thesis */

/* Evidence-gated preview thesis */
.preview-thesis {
  border: 1px solid var(--line, #e4e4e1);
  border-radius: 3px;
  padding: clamp(1rem, 2vw, 1.4rem);
  background: #ffffff;
  overflow-wrap: anywhere;
}
.preview-thesis__meta {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: .4rem .7rem;
  font: 700 12.5px/1.3 var(--font-sans);
  letter-spacing: .01em;
  text-transform: none;
  color: var(--ink-3, #686862);
  margin-bottom: .2rem;
}
.preview-thesis__title {
  margin: .45rem 0 .4rem;
  font: 700 clamp(1.28rem, 2.2vw, 1.95rem)/1.08 var(--font-display);
  letter-spacing: 0;
  color: var(--text);
}
.preview-thesis__body {
  max-width: 76ch;
  margin: 0 0 .75rem;
  font: 500 clamp(.98rem, 1.25vw, 1.08rem)/1.55 var(--font-sans);
  color: var(--text);
}
.preview-thesis__chips {
  list-style: none;
  margin: 0 0 .8rem;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: .35rem;
}
.preview-thesis__chip {
  display: flex;
  align-items: baseline;
  gap: .5rem;
  font-size: .84rem;
  line-height: 1.45;
  color: var(--text);
}
.preview-thesis__chip-label {
  flex-shrink: 0;
  font: 700 12px/1.3 var(--font-sans);
  letter-spacing: .01em;
  text-transform: none;
  color: var(--ink-3, #686862);
  min-width: 6rem;
}
.preview-thesis__chip-text {
  color: var(--text-secondary, var(--text-muted));
  font-size: .88rem;
}
.preview-thesis__receipt {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: .4rem .6rem;
  font: 400 .8rem/1.2 var(--font-sans);
  letter-spacing: .01em;
  color: var(--ink-3, #686862);
  border-top: 1px solid color-mix(in srgb, var(--border) 60%, transparent);
  padding-top: .65rem;
  margin-top: .2rem;
}
@media (max-width: 540px) {
  .preview-thesis {
    padding: 1rem;
  }
  .preview-thesis__meta {
    gap: .35rem .55rem;
  }
  .preview-thesis__title {
    font-size: 1.28rem;
    line-height: 1.12;
  }
  .preview-thesis__chip-label {
    min-width: 5rem;
  }
}


/* Recent Form chip — last 10 games */

.season-ribbon { display: block; }
.sr-row { list-style: none; margin: 14px 0 0; padding: 0; display: grid;
  grid-template-columns: repeat(var(--n), minmax(0, 36px)); gap: 4px; align-items: end; }
.sr-c { display: flex; flex-direction: column; align-items: center; gap: 3px; min-width: 0; }
.sr-d { display: flex; flex-direction: column-reverse; align-items: center; gap: 0; min-height: 24px; }
/* The tap target is 24px (Lighthouse target-size; the drawn dot stays 12px). */
.sr-dot { display: block; width: 24px; height: 24px; position: relative; }
.sr-dot::before { content: ""; position: absolute; inset: 6px; border-radius: 50%; background: #b7851a; }
.sr-tick { display: block; width: 100%; height: 22px; border-radius: 3px; background: rgba(34, 34, 34, .14); }
.sr-tick.sr-w { background: var(--green, #3a7a4b); }
.sr-tick.sr-l { background: var(--red, #bf3b31); }
.sr-tick.sr-t { background: #c98c1a; }
.sr-tick.sr-next { background: transparent; border: 1px dashed rgba(34, 34, 34, .35); }
.sr-l { font-size: 12px; font-weight: 700; color: var(--ink-3, #686862); }
.sr-wl { color: var(--green, #3a7a4b); }
.sr-ll { color: var(--red, #bf3b31); }
.sr-top { list-style: none; margin: 14px 0 0; padding: 0; display: grid; gap: 6px; }
.sr-top a { font-weight: 700; }
.sr-m { font-size: 12.5px; color: #8a6200; }
.sr-key { margin: 6px 0 0; font-size: 12.5px; color: var(--ink-3, #686862); }
.sr-all { margin: 10px 0 0; font-size: 13px; }

/* The sideline quote (E5) spans the module's full two-column grid and sits
   under the glyph row, so it reads as a footnote to the results rather than
   a third column of chrome. The card itself is `.pc-receipt` -- its accent
   and trust styling live in player_pages/components.py, not here. */
.recent-form__sideline { grid-column: 1 / -1; margin-top: 4px; }
.recent-form__sideline .pc-receipt { margin: 0; background: transparent; }
/* Recent Form chip */
.recent-form {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 14px 22px;
  align-items: center;
  padding: clamp(14px, 1.8vw, 20px) clamp(16px, 2.0vw, 24px);
  background: var(--bg-card, #ffffff);
  border: 1px solid var(--stroke-subtle, rgba(34, 34, 34,0.08));
  border-radius: 3px;
  margin-bottom: clamp(20px, 3vw, 32px);
  font-variant-numeric: tabular-nums;
}
.recent-form__head {
  display: grid;
  gap: 4px;
}
.recent-form__eyebrow {
  font-family: var(--font-sans, system-ui, sans-serif);
  font-size: 12.5px;
  font-weight: 700;
  letter-spacing: 0.01em;
  text-transform: none;
  color: var(--ink-3, #686862);
  margin: 0;
}
.recent-form__verdict {
  font-family: var(--font-display, 'Archivo', system-ui, sans-serif);
  font-size: var(--fs-headline, clamp(22px, 1.8vw + 14px, 30px));
  font-weight: 600;
  letter-spacing: -0.005em;
  text-transform: none;
  line-height: 1.15;
  color: var(--fg-primary, #222222);
  margin: 0;
}
.recent-form__word { font-style: normal; font-weight: 700; }
.recent-form__verdict--hot         { color: var(--green, #3a7a4b); }
.recent-form__verdict--warming     { color: var(--green, #3a7a4b); }
.recent-form__verdict--mixed       { color: var(--fg-primary); }
.recent-form__verdict--cooling     { color: var(--red, #bf3b31); }
.recent-form__verdict--cold        { color: var(--red, #bf3b31); }
.recent-form__verdict--hibernating { color: var(--fg-secondary); }
.recent-form__story {
  font-family: 'Archivo', 'Helvetica Neue', Arial, sans-serif;
  font-size: 13px;
  
  line-height: 1.4;
  color: var(--fg-secondary);
  margin: 0;
  max-width: 56ch;
}

.recent-form__glyphs {
  display: flex;
  gap: 5px;
  align-items: end;
}
.recent-form__glyph {
  width: 14px;
  height: 28px;
  border-radius: 3px;
  background: rgba(34, 34, 34, 0.08);
}
.recent-form__glyph--w { background: var(--green, #3a7a4b); }
.recent-form__glyph--l { background: var(--red, #bf3b31); }
.recent-form__glyph--t { background: #c98c1a; }
.recent-form__glyph-row { display: flex; gap: 5px; align-items: end; }

.recent-form__meta {
  display: grid;
  gap: 4px;
  margin-top: 6px;
}
/* Streak and last-5/last-10 records: plain words in a row, not boxed chips
   (DESIGN.md, labels are words). The streak keeps its result colour, paired
   with its W/L letter. */
.recent-form__chips {
  display: flex;
  gap: 4px 16px;
  flex-wrap: wrap;
  font-family: var(--font-sans, system-ui, sans-serif);
  font-size: 12.5px;
  line-height: 1.3;
  color: var(--fg-secondary);
}
.recent-form__chip {
  font-weight: 600;
}
.recent-form__chip--win  { color: var(--green, #3a7a4b); font-weight: 700; }
.recent-form__chip--loss { color: var(--red, #bf3b31); font-weight: 700; }

@media (max-width: 640px) {
  .recent-form { grid-template-columns: 1fr; }
}


/* Bowl History chip — postseason ledger */

/* Bowl History -- DESIGN.md (2026-09-28): a plain framed card, no team-colour
   stripe; the verdict is the heading with nothing above it; each recent
   postseason is the bowl's logo, the year and a bold W/L letter (green/red),
   not a coloured box. */
.bowl-history {
  display: grid;
  gap: 8px;
  padding: clamp(14px, 1.8vw, 20px) clamp(16px, 2.0vw, 24px);
  background: var(--bg-card, #fff);
  border: 1px solid var(--stroke-subtle, rgba(34, 34, 34, 0.08));
  border-radius: 3px;
  margin-bottom: clamp(20px, 3vw, 32px);
  font-variant-numeric: tabular-nums;
}
.bowl-history__verdict {
  font-family: var(--font-display, 'Archivo', system-ui, sans-serif);
  font-size: var(--fs-headline, clamp(22px, 1.8vw + 14px, 30px));
  font-weight: 600;
  letter-spacing: normal;
  text-transform: none;
  line-height: 1.2;
  color: var(--fg-primary);
  margin: 0;
}
.bowl-history__recent {
  font-family: 'Archivo', 'Helvetica Neue', Arial, sans-serif;
  font-size: 13px;
  line-height: 1.4;
  color: var(--fg-secondary);
  margin: 0;
}
.bowl-history__row {
  display: flex;
  gap: 6px 16px;
  flex-wrap: wrap;
}
.bowl-history__year {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  font-family: var(--font-mono, ui-monospace, monospace);
  font-size: 12.5px;
  color: var(--fg-primary, #222);
}
/* that year's logo for the bowl (specs/historical-logos.md); mostly wide wordmarks */
.bowl-history__mark { height: 16px; width: auto; max-width: 40px; object-fit: contain; }
a.bowl-history__year { text-decoration: none; transition: opacity .1s ease-in; }
a.bowl-history__year:hover { opacity: .8; }
.bowl-history__result { font-weight: 800; }
.bowl-history__year--win  .bowl-history__result { color: var(--win, #3a7a4b); }
.bowl-history__year--loss .bowl-history__result { color: var(--loss, #bf3b31); }


/* All-Time Record card — full-history W-L + splits + by-decade */

/* All-Time Record card -- DESIGN.md (2026-09-28): a plain framed card, no
   team-colour stripe; the headline states the record with nothing above it;
   the home/away/neutral splits are a row of facts, not boxed tiles. */
.all-time-record {
  display: grid;
  gap: 10px;
  padding: clamp(14px, 1.8vw, 20px) clamp(16px, 2.0vw, 24px);
  background: var(--bg-card, #fff);
  border: 1px solid var(--stroke-subtle, rgba(34, 34, 34, 0.08));
  border-radius: 3px;
  margin-bottom: clamp(20px, 3vw, 32px);
  font-variant-numeric: tabular-nums;
}
.all-time-record__hero {
  font-family: var(--font-display, 'Archivo', system-ui, sans-serif);
  font-size: var(--fs-headline, clamp(22px, 1.8vw + 14px, 30px));
  font-weight: 600;
  letter-spacing: -0.005em;
  line-height: 1.2;
  color: var(--fg-primary);
  margin: 0;
  max-width: 44ch;
}
.all-time-record__sub {
  font-family: var(--font-sans, 'Archivo', system-ui, sans-serif);
  font-size: 13px;
  font-weight: 500;
  line-height: 1.4;
  color: var(--fg-secondary);
  margin: 0;
}
.all-time-record__splits {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
}
.all-time-record__split {
  display: grid;
  gap: 2px;
  min-width: 84px;
}
.all-time-record__split-label {
  font-family: var(--font-sans, 'Archivo', system-ui, sans-serif);
  font-size: 12.5px;
  font-weight: 700;
  letter-spacing: 0.01em;
  color: var(--fg-muted);
}
.all-time-record__split-value {
  font-family: var(--font-sans, 'Archivo', system-ui, sans-serif);
  font-size: 14px;
  font-weight: 600;
  color: var(--fg-primary);
}
.all-time-record__decades {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(46px, 1fr));
  gap: 4px;
  margin-top: 4px;
}
.all-time-record__decade {
  display: grid;
  gap: 3px;
  text-align: center;
}
.all-time-record__decade-label {
  font-family: var(--font-sans, 'Archivo', system-ui, sans-serif);
  font-size: 12px;
  color: var(--fg-muted);
}
.all-time-record__decade-pct {
  font-family: var(--font-sans, 'Archivo', system-ui, sans-serif);
  font-size: 12px;
  font-weight: 700;
  color: var(--fg-primary);
  font-variant-numeric: tabular-nums;
}
.all-time-record__decade-bar {
  height: 40px;
  border-radius: 2px;
  background: var(--panel, #f1f1ec);
  display: flex;
  align-items: flex-end;
  overflow: hidden;
}
.all-time-record__decade-fill {
  width: 100%;
  background: var(--blue, #1d68a3);
}
.all-time-record__decade-fill--losing {
  background: var(--red, #bf3b31);
}
.all-time-record__decade-fill--thin {
  background: var(--stroke-strong, #d7d7d4);
}
.all-time-record__decade-pct--thin {
  color: var(--fg-muted, #8b8b8b);
  font-weight: 500;
}


/* Positional competition — Second Signal Phase 5 (specs/17) */
.tnote{font:500 12.5px/1.45 "Archivo","Helvetica Neue",Arial,sans-serif;
  color:var(--ink-3,#686862);letter-spacing:0;text-transform:none;white-space:nowrap}
.xp{border:1px solid var(--rule,#d7d7d4);border-radius:2px}
.xp-btn{width:100%;text-align:left;display:flex;align-items:center;justify-content:space-between;
  gap:10px;background:none;border:none;padding:10px 14px;
  font-family:"Archivo",system-ui,sans-serif;font-size:13.5px;font-weight:600;
  color:var(--ink,#222);cursor:pointer;transition:background .12s ease}
.xp-btn:hover{background:var(--row,#f7f7f6)}
.xp-chev{font-size:15px;flex:0 0 auto;transition:transform .2s ease;
  display:inline-block}
.xp.open .xp-chev{transform:rotate(180deg)}
.xp-body{display:grid;grid-template-rows:0fr;grid-template-columns:minmax(0,1fr);overflow:hidden;
  transition:grid-template-rows .24s ease}
.xp.open .xp-body{grid-template-rows:1fr}
.xp-inner{min-width:0;min-height:0;padding:0 14px}
.xp.open .xp-inner{padding:10px 14px 14px}
.hfoot{display:flex;flex-wrap:wrap;gap:4px 10px;font-size:11.5px;line-height:1.5;
  color:var(--ink-3,#8b8b8b);font-family:"Archivo",system-ui,sans-serif;
  font-variant-numeric:tabular-nums;border-top:1px solid var(--line,#e4e4e1);
  padding-top:6px;margin-top:8px}
.hfoot b{color:var(--ink-2,#5b5b5b);font-weight:600}.dbs-stack{display:flex;flex-direction:column;gap:10px}
.dbs-legend{display:flex;gap:14px;font-family:"Archivo",system-ui,sans-serif;
  font-size:12px;font-weight:600;color:var(--ink-2,#5b5b5b);margin-bottom:2px}
.dbs-leg-item{display:inline-flex;align-items:center;gap:5px}
.dbs-dot{width:8px;height:8px;border-radius:50%;display:inline-block}
.dbs-row{display:grid;grid-template-columns:104px 1fr;align-items:center;gap:8px}
/* The dumbbell SVG is drawn on a 340x70 viewBox and .db-svg is width:100%;
   inside a full-width card that stretched every stack row to ~3x its
   designed size (40px labels, 220px per row -- the 2026-09-01 player-page
   audit). Cap it at its native width; the row grid keeps it left-aligned. */
.dbs-row .db-svg{max-width:360px}
.dbs-label{font-family:"Archivo",system-ui,sans-serif;font-size:12.5px;
  font-weight:600;color:var(--ink,#222)}
/* phones: label above the drawing, so the 340-unit drawing keeps its size and its 12px labels */
@media (max-width:520px){.dbs-row{grid-template-columns:1fr;gap:2px}.dbs-row .dbs-annotation{grid-column:1}}
.dbs-annotation{grid-column:2;font-family:"Archivo",system-ui,sans-serif;
  font-size:12px;color:var(--ink-3,#8b8b8b);margin-top:-4px}.sht-svg{width:100%;height:100%;display:block}
.sht-ref{stroke:#d7d7d4;stroke-width:1.5;stroke-dasharray:4 3}
.sht-ref-lab{font-family:"Archivo",system-ui,sans-serif;font-size:9.5px;fill:#8b8b8b}
.sht-axis{font-family:"Archivo",system-ui,sans-serif;font-size:10px;fill:#5b5b5b}
.sht-line{fill:none;stroke-width:2.25;stroke-linecap:round;stroke-linejoin:round}
.sht-dot{stroke:#fff;stroke-width:1.5}
.sht-end-lab{font-family:"Archivo",system-ui,sans-serif;font-size:11px;font-weight:700}
.poscomp{margin:1rem 0 1.5rem 0;padding:clamp(14px,1.8vw,20px) clamp(16px,2.0vw,24px);
  background:#ffffff;border:1px solid #e4e4e1;
  border-radius:3px;font-variant-numeric:tabular-nums}
/* Kicker: only the fact the heading can't carry (which room), as a plain
   sentence-case label -- no category repeat, no tracking (DESIGN.md). */
.poscomp__eyebrow{font-size:12.5px;font-weight:700;letter-spacing:.01em;color:#686862;margin:0 0 4px 0;
  font-family:"Archivo",system-ui,sans-serif}
.poscomp__title{font-family:"Archivo","Helvetica Neue",Arial,sans-serif;font-size:1.3rem;font-weight:600;
  margin:0 0 8px 0;color:#222222}
.poscomp__take{font-size:.86rem;line-height:1.5;color:#5b5b5b;margin:0 0 12px 0;
  font-family:"Archivo",system-ui,sans-serif}
.poscomp__chart{margin-bottom:8px}
.poscomp__trend{margin:4px 0 10px 0;border-top:1px solid #e4e4e1;padding-top:8px}
.poscomp__trend summary{font-family:"Archivo",system-ui,sans-serif;font-size:.8rem;
  font-weight:600;color:#1d68a3;cursor:pointer}
.poscomp__trend-caption{font-family:"Archivo",system-ui,sans-serif;font-size:.8rem;
  color:#8b8b8b;margin:8px 0 4px 0}
.poscomp__trend-chart{max-width:460px}


/* Pass-zone defense — Second Signal Phase 7 item 7d (specs/17) */
.tnote{font:500 12.5px/1.45 "Archivo","Helvetica Neue",Arial,sans-serif;
  color:var(--ink-3,#686862);letter-spacing:0;text-transform:none;white-space:nowrap}
.xp{border:1px solid var(--rule,#d7d7d4);border-radius:2px}
.xp-btn{width:100%;text-align:left;display:flex;align-items:center;justify-content:space-between;
  gap:10px;background:none;border:none;padding:10px 14px;
  font-family:"Archivo",system-ui,sans-serif;font-size:13.5px;font-weight:600;
  color:var(--ink,#222);cursor:pointer;transition:background .12s ease}
.xp-btn:hover{background:var(--row,#f7f7f6)}
.xp-chev{font-size:15px;flex:0 0 auto;transition:transform .2s ease;
  display:inline-block}
.xp.open .xp-chev{transform:rotate(180deg)}
.xp-body{display:grid;grid-template-rows:0fr;grid-template-columns:minmax(0,1fr);overflow:hidden;
  transition:grid-template-rows .24s ease}
.xp.open .xp-body{grid-template-rows:1fr}
.xp-inner{min-width:0;min-height:0;padding:0 14px}
.xp.open .xp-inner{padding:10px 14px 14px}
.hfoot{display:flex;flex-wrap:wrap;gap:4px 10px;font-size:11.5px;line-height:1.5;
  color:var(--ink-3,#8b8b8b);font-family:"Archivo",system-ui,sans-serif;
  font-variant-numeric:tabular-nums;border-top:1px solid var(--line,#e4e4e1);
  padding-top:6px;margin-top:8px}
.hfoot b{color:var(--ink-2,#5b5b5b);font-weight:600}
.pzd{margin:1rem 0 1.5rem 0;padding:clamp(14px,1.8vw,20px) clamp(16px,2.0vw,24px);
  background:#ffffff;border:1px solid #e4e4e1;
  border-radius:3px;font-variant-numeric:tabular-nums}
/* .pzd__eyebrow ("Pass-depth identity") retired 2026-09-28: a category
   label over the real heading (DESIGN.md Plain Heading Rule). */
.pzd__title{font-family:"Archivo","Helvetica Neue",Arial,sans-serif;font-size:1.3rem;font-weight:600;
  margin:0 0 8px 0;color:#222222}
.pzd__take{font-size:.86rem;line-height:1.5;color:#5b5b5b;margin:0 0 8px 0;
  font-family:"Archivo",system-ui,sans-serif}
.pzd__refusal{font-size:.8rem;line-height:1.4;color:#686862;margin:0 0 10px 0;
  font-family:"Archivo",system-ui,sans-serif}


/* Havoc & trenches — 2026-09-02 PBP/advanced-stats deep dive */
.tnote{font:500 12.5px/1.45 "Archivo","Helvetica Neue",Arial,sans-serif;
  color:var(--ink-3,#686862);letter-spacing:0;text-transform:none;white-space:nowrap}
.xp{border:1px solid var(--rule,#d7d7d4);border-radius:2px}
.xp-btn{width:100%;text-align:left;display:flex;align-items:center;justify-content:space-between;
  gap:10px;background:none;border:none;padding:10px 14px;
  font-family:"Archivo",system-ui,sans-serif;font-size:13.5px;font-weight:600;
  color:var(--ink,#222);cursor:pointer;transition:background .12s ease}
.xp-btn:hover{background:var(--row,#f7f7f6)}
.xp-chev{font-size:15px;flex:0 0 auto;transition:transform .2s ease;
  display:inline-block}
.xp.open .xp-chev{transform:rotate(180deg)}
.xp-body{display:grid;grid-template-rows:0fr;grid-template-columns:minmax(0,1fr);overflow:hidden;
  transition:grid-template-rows .24s ease}
.xp.open .xp-body{grid-template-rows:1fr}
.xp-inner{min-width:0;min-height:0;padding:0 14px}
.xp.open .xp-inner{padding:10px 14px 14px}
.hfoot{display:flex;flex-wrap:wrap;gap:4px 10px;font-size:11.5px;line-height:1.5;
  color:var(--ink-3,#8b8b8b);font-family:"Archivo",system-ui,sans-serif;
  font-variant-numeric:tabular-nums;border-top:1px solid var(--line,#e4e4e1);
  padding-top:6px;margin-top:8px}
.hfoot b{color:var(--ink-2,#5b5b5b);font-weight:600}
.hveff{margin:1rem 0 1.5rem 0;padding:clamp(14px,1.8vw,20px) clamp(16px,2.0vw,24px);
  background:#ffffff;border:1px solid #e4e4e1;
  border-radius:3px;font-variant-numeric:tabular-nums}
/* .hveff__eyebrow ("Havoc & trenches") retired 2026-09-28: it only repeated
   the module's name above its real heading (DESIGN.md Plain Heading Rule). */
.hveff__title{font-family:"Archivo","Helvetica Neue",Arial,sans-serif;font-size:1.3rem;font-weight:600;
  margin:0 0 10px 0;color:#222222}
.hveff__grid{display:grid;grid-template-columns:1fr 1fr;gap:.5rem 1.25rem}
@media(max-width:560px){.hveff__grid{grid-template-columns:1fr}}
.hveff-bar{padding:.35rem 0}
.hveff-bar__label{display:flex;justify-content:space-between;align-items:baseline;
  font-family:"Archivo",system-ui,sans-serif;margin-bottom:.2rem}
.hveff-bar__label-text{font-size:.8rem;color:#5b5b5b}
.hveff-bar__raw{font-size:.8rem;color:#8b8b8b}
.hveff-bar__track{position:relative;height:6px;background:#f1f1ec;border-radius:3px;overflow:hidden}
.hveff-bar__fill{height:100%;border-radius:3px;background:#8b8b8b}
.hveff-bar[data-band="elite"] .hveff-bar__fill{background:#1d68a3}
.hveff-bar[data-band="strong"] .hveff-bar__fill{background:#3a7a4b}
.hveff-bar[data-band="average"] .hveff-bar__fill{background:#b7851a}
.hveff-bar[data-band="concern"] .hveff-bar__fill{background:#bf3b31}
.hveff-bar[data-band="bottom"] .hveff-bar__fill{background:#b23a25}
.hveff-bar__value{font-size:.8rem;color:#8b8b8b;margin-top:.15rem}
.hveff-bar__pct{font-weight:700;color:#222222}
.hveff-bar__pct-sup{font-size:.8rem;vertical-align:super}


/* Top Commits — 3 highest-rated recruits per class */

/* Top Commits module */
.top-commits {
  padding: clamp(14px, 1.8vw, 20px) clamp(16px, 2.0vw, 24px);
  background: var(--bg-card, #ffffff);
  border: 1px solid var(--stroke-subtle, rgba(34, 34, 34,0.08));
  border-radius: 3px;
  margin-bottom: clamp(20px, 3vw, 32px);
  font-variant-numeric: tabular-nums;
}
.top-commits__head {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  gap: 12px;
  margin-bottom: 10px;
}
.top-commits__eyebrow {
  font-family: var(--font-sans, system-ui, sans-serif);
  font-size: 12.5px;
  font-weight: 700;
  letter-spacing: 0.01em;
  text-transform: none;
  color: var(--ink-3, #686862);
  margin: 0;
}
/* "2027 class" is a plain caption, not a boxed tag (DESIGN.md). */
.top-commits__class-tag {
  font-family: var(--font-sans, system-ui, sans-serif);
  font-size: 12.5px;
  font-weight: 500;
  letter-spacing: 0.01em;
  text-transform: none;
  color: var(--ink-3, #686862);
}
.top-commits__list {
  display: grid;
  gap: 0;
}
/* Rows are ruled, not boxed: a framed row inside a framed card was a nested
   card (DESIGN.md, Cards: never nested cards). */
.top-commits__row {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: 12px 14px;
  padding: 10px 0;
  border-bottom: 1px solid var(--stroke-subtle, rgba(34, 34, 34,0.08));
}
.top-commits__row:last-child { border-bottom: 0; }
.top-commits__stars {
  font-family: var(--font-sans, 'Archivo', system-ui, sans-serif);
  font-size: 14px;
  letter-spacing: 0.01em;
  color: var(--blue, #1d68a3);
  font-weight: 600;
  min-width: 56px;
}
.top-commits__name {
  font-family: var(--font-display, 'Archivo', system-ui, sans-serif);
  font-size: clamp(15px, 0.9vw + 9px, 19px);
  letter-spacing: 0.01em;
  color: var(--fg-primary);
  line-height: 1.1;
}
.top-commits__meta {
  font-family: var(--font-sans, system-ui, sans-serif);
  font-size: 12px;
  color: var(--fg-secondary);
  margin-top: 2px;
}
.top-commits__rank {
  font-family: var(--font-sans, 'Archivo', system-ui, sans-serif);
  font-size: 12px;
  color: var(--fg-muted);
  text-align: right;
}
.top-commits__rank strong {
  color: var(--fg-primary);
  font-weight: 600;
}
@media (max-width: 540px) {
  .top-commits__row { grid-template-columns: auto minmax(0, 1fr); }
  .top-commits__rank { grid-column: 2 / 3; text-align: left; }
}
/* Projection lane (research §8/§23.4, render owner-confirmed 2026-07-23):
   gray ink always, never an archetype color -- the structural marker that
   this is a projection, not an earned classification (§8's "no drawer at
   all" rule -- no color, no interactivity, one fixed line). Spans the full
   row width under the name/meta column, State A (chip) and State B
   (sentence-only) share the same wrapper/honesty-suffix styling. The suffix
   used to open with a "~our read" tag; since D-144 (2026-09-28) it says
   what the line is in words. */
.top-commits__projection {
  grid-column: 1 / -1;
  margin-top: 4px;
  font-family: var(--font-sans, system-ui, sans-serif);
  font-size: 12px;
  line-height: 1.45;
  color: var(--fg-secondary);
}
.top-commits__projection-tag {
  font-weight: 700;
  color: var(--fg-primary);
}
.top-commits__projection-honesty {
  display: block;
  color: var(--fg-muted);
  margin-top: 1px;
}


/* NFL Draft Pipeline — last 5 cycles of draft picks */

/* NFL Draft Pipeline -- DESIGN.md (2026-09-28): a plain framed card, no
   team-colour stripe; the headline sentence is the heading (the "NFL Draft
   Pipeline" eyebrow only repeated it) and the draft window is a plain date
   caption; the marquee picks are ruled rows, not boxed ones. */
.nfl-draft-pipeline {
  padding: clamp(14px, 1.8vw, 20px) clamp(16px, 2.0vw, 24px);
  background: var(--bg-card, #fff);
  border: 1px solid var(--stroke-subtle, rgba(34, 34, 34,0.08));
  border-radius: 3px;
  margin-bottom: clamp(20px, 3vw, 32px);
  font-variant-numeric: tabular-nums;
  display: grid;
  gap: 10px;
}
.nfl-draft-pipeline__head {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  gap: 12px;
  border-bottom: 1px dashed var(--stroke-subtle, rgba(34, 34, 34,0.07));
  padding-bottom: 8px;
}
.nfl-draft-pipeline__window {
  font-family: var(--font-sans, system-ui, sans-serif);
  font-size: 12.5px;
  font-weight: 700;
  letter-spacing: 0.01em;
  text-transform: none;
  color: var(--fg-muted);
}
.nfl-draft-pipeline__verdict {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 8px 16px;
  align-items: baseline;
}
.nfl-draft-pipeline__band {
  font-family: var(--font-display, 'Archivo', system-ui, sans-serif);
  font-size: var(--fs-headline, clamp(22px, 1.8vw + 14px, 30px));
  font-weight: 600;
  line-height: 1.2;
  letter-spacing: -0.005em;
  color: var(--fg-primary);
  margin: 0 0 4px;
  max-width: 44ch;
}
.nfl-draft-pipeline__band-word { font-style: normal; font-weight: 700; }
/* Green means wins and upward deltas only (DESIGN.md One Meaning Rule), so the
   top bands are bold ink, not green. */
.nfl-draft-pipeline__band--elite      { color: var(--fg-primary, #222); }
.nfl-draft-pipeline__band--strong     { color: var(--fg-primary, #222); }
.nfl-draft-pipeline__band--steady     { color: var(--fg-primary); }
.nfl-draft-pipeline__band--developing { color: var(--fg-secondary); }
.nfl-draft-pipeline__band--thin       { color: var(--fg-secondary); }

.nfl-draft-pipeline__count {
  font-family: var(--font-display, 'Archivo', system-ui, sans-serif);
  font-size: clamp(28px, 2vw + 10px, 40px);
  font-weight: 400;
  line-height: 1;
  color: var(--fg-primary, #222222);
}
.nfl-draft-pipeline__count-label {
  font-family: var(--font-sans, system-ui, sans-serif);
  font-size: 12.5px;
  letter-spacing: 0.01em;
  color: var(--fg-muted);
  text-transform: none;
  text-align: right;
  display: block;
}

.nfl-draft-pipeline__story {
  font-family: 'Archivo', 'Helvetica Neue', Arial, sans-serif;
  font-size: 13px;
  
  line-height: 1.4;
  color: var(--fg-secondary);
  margin: 0;
  max-width: 56ch;
}
.nfl-draft-pipeline__marquee {
  display: grid;
  gap: 6px;
  margin-top: 4px;
}
.nfl-draft-pipeline__row {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  gap: 10px;
  align-items: baseline;
  font-family: var(--font-mono, ui-monospace, monospace);
  font-size: 12px;
  padding: 4px 0;
  border-bottom: 1px solid var(--stroke-subtle, rgba(34, 34, 34,0.06));
}
.nfl-draft-pipeline__pick {
  color: var(--blue, #1d68a3);
  font-weight: 600;
  font-variant-numeric: tabular-nums;
}
.nfl-draft-pipeline__name {
  color: var(--fg-primary);
  font-family: var(--font-sans, system-ui, sans-serif);
  font-weight: 600;
}
.nfl-draft-pipeline__pos {
  color: var(--fg-muted);
  font-size: 12px;
  text-transform: none;
  letter-spacing: 0.01em;
}
/* Narrow screens: the detail line (position · year · franchise) takes its own line under the
   name instead of squeezing the name column to nothing and overprinting it. */
@media (max-width: 560px) {
  .nfl-draft-pipeline__row { grid-template-columns: auto minmax(0, 1fr); row-gap: 2px; }
  .nfl-draft-pipeline__pos { grid-column: 2 / -1; }
}
.nfl-draft-pipeline__receipt {
  grid-column: 1 / -1;
  margin-top: 3px;
  font-family: 'Archivo', system-ui, sans-serif;
  font-size: 12px;
  color: var(--ink-2, #5b5b5b);
}
.nfl-draft-pipeline__receipt a {
  color: var(--blue, #1d68a3);
  text-decoration: none;
  font-weight: 600;
}
.nfl-draft-pipeline__receipt a:hover { text-decoration: underline; }


/* Coaching Era Strip — current HC + tenure */

/* Coaching Era Strip -- DESIGN.md (2026-09-28): a plain framed card, no
   team-colour stripe; the staff facts read as one list, not a row of boxes. */
.coaching-era {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 14px 22px;
  align-items: center;
  padding: clamp(14px, 1.8vw, 20px) clamp(16px, 2.0vw, 24px);
  background: var(--bg-card, #fff);
  border: 1px solid var(--stroke-subtle, rgba(34, 34, 34, 0.08));
  border-radius: 3px;
  margin-bottom: clamp(20px, 3vw, 32px);
  font-variant-numeric: tabular-nums;
}
.coaching-era__head { display: grid; gap: 4px; }
.coaching-era__name {
  font-family: var(--font-display, 'Archivo', system-ui, sans-serif);
  font-size: var(--fs-headline, clamp(22px, 1.8vw + 14px, 30px));
  font-weight: 600;
  letter-spacing: normal;
  line-height: 1.2;
  color: var(--fg-primary);
  margin: 0;
}
.coaching-era__story {
  font-family: 'Archivo', 'Helvetica Neue', Arial, sans-serif;
  font-size: 13px;
  
  line-height: 1.4;
  color: var(--fg-secondary);
  margin: 0;
  max-width: 56ch;
}
.coaching-era__chips {
  display: flex;
  gap: 4px 0;
  margin-top: 4px;
  flex-wrap: wrap;
}
.coaching-era__chip {
  font-family: var(--font-mono, ui-monospace, monospace);
  font-size: 12.5px;
  color: var(--fg-secondary);
}
.coaching-era__chip + .coaching-era__chip::before {
  content: "·";
  margin: 0 7px;
  color: #8b8b85;
}
.coaching-era__chip--era {
  color: var(--fg-primary, #222);
  font-weight: 600;
}
.coaching-era__chip a { color: inherit; text-decoration: underline; text-decoration-color: rgba(34, 34, 34, 0.25); transition: opacity .1s ease-in; }
.coaching-era__chip a:hover { opacity: .8; }
.coaching-era__era-link {
  display: inline-block;
  margin-top: 10px;
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.01em;
  color: var(--blue, #1d68a3);
  text-decoration: none;
  transition: opacity .1s ease-in;
}
.coaching-era__era-link:hover { opacity: .8; }
.coaching-era__links { display: flex; flex-wrap: wrap; gap: 6px 18px; margin-top: 10px; }
.coaching-era__links .coaching-era__era-link { margin-top: 0; }
.coaching-era__tenure {
  display: grid;
  gap: 4px;
  text-align: right;
}
.coaching-era__tenure-years {
  font-family: var(--font-display, 'Archivo', system-ui, sans-serif);
  font-size: clamp(28px, 2vw + 10px, 40px);
  line-height: 1;
  color: var(--fg-primary, #222222);
}
.coaching-era__tenure-label {
  font-family: var(--font-sans, system-ui, sans-serif);
  font-size: 12.5px;
  letter-spacing: 0.01em;
  color: var(--fg-muted);
  text-transform: none;
}
@media (max-width: 640px) {
  .coaching-era { grid-template-columns: 1fr; }
  .coaching-era__tenure { text-align: left; }
}


/* Coaching History — receipts strip of every hire/departure on record */

/* Coaching History strip -- DESIGN.md (2026-09-28): a plain framed card, no
   team-colour stripe; the title is a sentence-case label, untracked. */
.coaching-history {
  display: grid;
  gap: 8px;
  padding: clamp(14px, 1.8vw, 20px) clamp(16px, 2.0vw, 24px);
  background: var(--bg-card, #fff);
  border: 1px solid var(--stroke-subtle, rgba(34, 34, 34, 0.08));
  border-radius: 3px;
  margin-bottom: clamp(20px, 3vw, 32px);
  font-variant-numeric: tabular-nums;
}
.coaching-history__eyebrow {
  font-family: var(--font-sans, system-ui, sans-serif);
  font-size: 12.5px;
  font-weight: 700;
  letter-spacing: 0.01em;
  text-transform: none;
  color: var(--fg-muted);
  margin: 0;
}
.coaching-history__list {
  list-style: none;
  margin: 4px 0 0;
  padding: 0;
  display: grid;
  gap: 0;
}
.coaching-history__row {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  gap: 12px;
  padding: 6px 0;
  font-family: var(--font-sans, system-ui, sans-serif);
  font-size: 13px;
  color: var(--fg-secondary);
}
.coaching-history__row + .coaching-history__row {
  border-top: 1px solid var(--stroke-subtle, rgba(34, 34, 34, 0.08));
}
.coaching-history__label { color: var(--fg-primary); }
.coaching-history__meta {
  flex: none;
  color: var(--fg-muted);
  font-family: var(--font-mono, ui-monospace, monospace);
  font-size: 12px;
}


/* Program Ledger — RANK_MOVE + coaching events on one dated timeline */

/* Program Ledger -- dated ledger events, newest first. DESIGN.md (2026-09-28):
   a plain framed card; the gold side stripe went with the no-side-stripe rule. */
.program-ledger {
  --pl-gold: #b7851a;
  display: grid;
  gap: 10px;
  padding: clamp(14px, 1.8vw, 20px) clamp(16px, 2.0vw, 24px);
  background: #ffffff;
  border: 1px solid var(--stroke-default, #e4e4e1);
  border-radius: 3px;
  margin-bottom: clamp(20px, 3vw, 32px);
  font-variant-numeric: tabular-nums;
}
.program-ledger__eyebrow {
  font-family: var(--font-sans, 'Archivo', system-ui, sans-serif);
  font-size: 12.5px;
  font-weight: 700;
  letter-spacing: 0.01em;
  text-transform: none;
  color: var(--fg-primary, #222222);
  margin: 0;
}
.program-ledger__head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 12px;
}
.program-ledger__window {
  font-family: var(--font-mono, ui-monospace, monospace);
  font-size: 12px;
  color: var(--fg-muted, #8b8b8b);
  white-space: nowrap;
}
.program-ledger__list {
  list-style: none;
  margin: 2px 0 0;
  padding: 0;
  display: grid;
  gap: 0;
}
.program-ledger__row {
  display: grid;
  grid-template-columns: 88px 1fr auto;
  align-items: baseline;
  gap: 10px;
  padding: 8px 0;
  font-family: var(--font-sans, 'Archivo', system-ui, sans-serif);
  font-size: 13px;
  line-height: 1.4;
  color: var(--fg-secondary, #5b5b5b);
}
.program-ledger__row + .program-ledger__row {
  border-top: 1px solid var(--stroke-subtle, rgba(34, 34, 34, 0.05));
}
.program-ledger__when {
  font-family: var(--font-mono, ui-monospace, monospace);
  font-size: 12px;
  color: var(--fg-muted, #8b8b8b);
  white-space: nowrap;
}
.program-ledger__body {
  display: grid;
  gap: 2px;
  min-width: 0;
}
.program-ledger__label { color: var(--fg-primary, #222222); }
.program-ledger__note,
.program-ledger__game {
  font-size: 12px;
  line-height: 1.35;
  color: var(--fg-muted, #8b8b8b);
}
.program-ledger__gweek {
  font-family: var(--font-mono, ui-monospace, monospace);
  font-size: 12px;
}
.program-ledger__meta {
  justify-self: end;
  text-align: right;
  font-family: var(--font-mono, ui-monospace, monospace);
  font-size: 12px;
  color: var(--fg-muted, #8b8b8b);
}
/* Gold marks perception/discourse (doc 100) -- the poll numbers. Green and red
   are bound to wins and losses by the same contract, so they appear here on
   exactly one thing: the result token of the game line. Gold says an opinion
   moved; green/red says what the scoreboard did. They never cross. */
.program-ledger__row--rank .program-ledger__meta { color: var(--gold-text, #8a6200); }
.program-ledger__result { font-weight: 700; }
.program-ledger__result--win  { color: var(--green, #3a7a4b); }
.program-ledger__result--loss { color: var(--red, #bf3b31); }
.program-ledger__result--tie  { color: var(--fg-secondary, #5b5b5b); }
.program-ledger__arrow {
  color: var(--pl-gold);
  font-family: var(--font-sans, 'Archivo', system-ui, sans-serif);
  padding-right: 2px;
}
/* Narrow screens pair the date with the poll number on one line and give the
   body the full width beneath. Stacking all three in source order instead
   would put "at No. 25" AFTER the game line, separating the poll fact from
   its own number by an unrelated sentence. */
@media (max-width: 540px) {
  .program-ledger__row {
    grid-template-columns: 1fr auto;
    gap: 2px 10px;
  }
  .program-ledger__when { grid-column: 1; grid-row: 1; }
  .program-ledger__meta { grid-column: 2; grid-row: 1; }
  .program-ledger__body { grid-column: 1 / -1; grid-row: 2; }
}


/* Unit Lineage Timeline — offense/defense percentile history by coordinator */

/* Unit Lineage Timeline — offense/defense percentile history + coordinator tenures */
.unit-lineage {
  padding: clamp(14px, 1.8vw, 20px) clamp(16px, 2.0vw, 24px);
  background: var(--bg-card, #fff);
  border: 1px solid var(--stroke-subtle, rgba(34, 34, 34, 0.08));
  border-radius: 3px;
  margin-bottom: clamp(20px, 3vw, 32px);
}
/* .unit-lineage__eyebrow ("Unit lineage") retired 2026-09-28: it repeated
   the module's name above its real heading (DESIGN.md Plain Heading Rule). */
.unit-lineage__title {
  font-family: var(--font-display, 'Archivo', system-ui, sans-serif);
  font-size: var(--fs-headline, clamp(22px, 1.8vw + 14px, 30px));
  font-weight: 600;
  color: var(--fg-primary);
  margin: 0 0 4px;
}
.unit-lineage__note {
  font-family: 'Archivo', 'Helvetica Neue', Arial, sans-serif;
  font-size: 12.5px;
  
  color: var(--fg-secondary);
  margin: 0 0 14px;
  max-width: 68ch;
}
.unit-lineage__panel { margin-top: 16px; }
.unit-lineage__panel-head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 10px;
  margin-bottom: 4px;
}
.unit-lineage__panel-label {
  font-family: var(--font-sans, system-ui, sans-serif);
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.01em;
  color: var(--fg-primary);
}
.unit-lineage__panel-range {
  font-family: 'Archivo', system-ui, sans-serif;
  font-size: 12px;
  color: var(--fg-muted);
  font-variant-numeric: tabular-nums;
}
.unit-lineage__svg-wrap { width: 100%; overflow-x: auto; }
.ult-svg { display: block; height: 84px; }
/* Encoding fix (2026-09-10 module-craft audit): the connecting line used to
   be colored by SIDE (offense=blue, defense=red via ult-line--{side}),
   while every dot on it is colored by PERFORMANCE via _percentile_color()
   using the SAME one-hue blue vocabulary the legend defines (Elite/
   Average/Poor). The two systems collided directly -- an elite (blue-dot)
   defense drew a red line straight through it, reading as "Poor" in its
   own legend. The line is now a single neutral connector; only the dots
   (and the legend) carry the performance color. Offense/defense are
   already distinguished by their own panel headers, so no identity signal
   is lost. */
.ult-line { stroke-width: 1.8; stroke-linejoin: round; stroke-linecap: round; stroke: var(--fg-muted, #999); opacity: 0.55; }
.ult-ref { stroke: var(--fg-muted, #999); stroke-width: 0.75; stroke-dasharray: 2 3; opacity: 0.6; }
.ult-transition { stroke: var(--fg-muted, #999); stroke-width: 1; stroke-dasharray: 3 2; opacity: 0.55; }
.ult-year-label {
  font-family: 'Archivo', system-ui, sans-serif;
  font-variant-numeric: tabular-nums;
  font-size: 12px;
  fill: var(--fg-muted, #999);
}
/* Coordinator stints ("2019–2022 · Joe Smith") read as a list of phrases,
   not a row of boxed chips (DESIGN.md: labels are words). */
.unit-lineage__chips { display: flex; flex-wrap: wrap; gap: 4px 16px; margin-top: 8px; }
.unit-lineage__chip {
  font-family: 'Archivo', system-ui, sans-serif;
  font-variant-numeric: tabular-nums;
  font-size: 12px;
  color: var(--fg-secondary);
}
.unit-lineage__pending {
  font-family: var(--font-sans, system-ui, sans-serif);
  font-size: 12px;
  color: var(--fg-muted);
  margin-top: 4px;
}
.unit-lineage__legend {
  display: flex;
  gap: 16px;
  margin-top: 12px;
  font-family: var(--font-sans, system-ui, sans-serif);
  font-size: 12px;
  color: var(--fg-muted);
}
.unit-lineage__legend-swatch {
  display: inline-block;
  width: 8px; height: 8px;
  border-radius: 2px;
  margin-right: 4px;
  vertical-align: middle;
}
@media (max-width: 640px) {
  .unit-lineage__panel-head { flex-direction: column; align-items: flex-start; gap: 2px; }
}


/* Coordinator Tendency Change — predecessor vs. successor play-calling fingerprint */
.db-svg{width:100%;height:auto;display:block}
.db-conn{stroke:var(--rule,#d7d7d4);stroke-width:2}
.db-taper{fill:var(--rule,#d7d7d4)}
.db-tick{stroke:var(--rule,#d7d7d4);stroke-width:1;stroke-dasharray:2 2}
.db-band{stroke-dasharray:3 3;stroke-width:1}
.db-lab{font-family:"Archivo",system-ui,sans-serif;font-size:12px;font-weight:600;fill:var(--ink,#222)}
.db-end{font-family:"Archivo",system-ui,sans-serif;font-size:12px;fill:var(--ink-3,#8b8b8b)}
.db-sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;
  clip:rect(0,0,0,0);white-space:nowrap;border:0}

/* Coordinator Tendency Change — predecessor vs. successor play-calling fingerprint.
   Fonts/colors hardcoded to the proven team_pages convention (Fraunces headline,
   Archivo UI, --ink/--ink-3/--line from TOKENS_CSS) rather than var(--font-sans)/
   var(--font-display)/var(--fg-primary)/var(--fg-muted) -- confirmed 2026-07-26 those
   custom properties are never defined at :root in team_pages/renderer.py's rendered
   <style> cascade, so every element here was silently rendering in the literal
   fallback values (Inter for body/label text, Archivo instead of Fraunces for the
   title) rather than the intended tokens. See coordinator_tendency_drift.py's CSS
   comment for the full verification.
   DESIGN.md (2026-09-28): a white card, not a tinted one; no "What changed"
   eyebrow over the heading (it only named the category). */
.tend-change {
  padding: clamp(14px, 1.8vw, 20px) clamp(16px, 2.0vw, 24px);
  background: var(--page, #ffffff);
  border: 1px solid var(--line, #e4e4e1);
  border-radius: 3px;
  margin-bottom: clamp(20px, 3vw, 32px);
}
.tend-change__title {
  font-family: 'Archivo Head', 'Archivo', 'Helvetica Neue', Arial, sans-serif;
  font-weight: 800;
  font-size: clamp(18px, 1.1vw + 10px, 24px);
  color: var(--ink, #222222);
  margin: 0 0 14px;
}
.tend-change__block { margin-top: 18px; }
.tend-change__block-head {
  font-family: 'Archivo', system-ui, sans-serif;
  font-size: 12px;
  font-weight: 700;
  color: var(--ink, #222222);
  margin-bottom: 2px;
}
.tend-change__block-sub {
  font-family: 'Archivo', system-ui, sans-serif;
  font-size: 12px;
  color: var(--ink-3, #8b8b8b);
  margin: 0 0 8px;
}
.tend-change__row { margin-top: 10px; }
.tend-change__row-label {
  font-family: 'Archivo', system-ui, sans-serif;
  font-size: 12px;
  font-weight: 600;
  color: var(--ink-2, #5b5b5b);
  margin-bottom: 2px;
}


/* Coordinator Tendency Drift — current OC/DC's season-by-season trajectory */

/* Coordinator Tendency Drift — season-by-season play-calling trajectory.
   Fonts/colors hardcoded to the proven team_pages convention (Fraunces headline,
   Archivo UI, --ink/--ink-3/--line from TOKENS_CSS) rather than var(--font-sans)/
   var(--font-display)/var(--fg-primary)/var(--fg-muted) -- those custom properties are
   never defined at :root anywhere in team_pages/renderer.py's rendered <style> cascade
   (verified live via getComputedStyle 2026-07-26: --font-sans resolves to an EMPTY
   string), so every element using them was silently falling back to their literal
   fallback values instead -- Inter for body/label text (a font this site's design
   system explicitly retired) and Archivo instead of Fraunces for the section title.
   This module and its sibling (coordinator_tendency_change.py) both had this bug;
   fixed here, flagged as a broader site-wide finding rather than fixed everywhere.
   DESIGN.md (2026-09-28): a white card, not a tinted one; no "Season by season"
   eyebrow over the heading (it only named the category); the current
   coordinator's line is ink on both sides (it was blue for offense and red for
   defense, and red means a loss). The block heads already say which side. */
.tend-drift {
  padding: clamp(14px, 1.8vw, 20px) clamp(16px, 2.0vw, 24px);
  background: var(--page, #ffffff);
  border: 1px solid var(--line, #e4e4e1);
  border-radius: 3px;
  margin-bottom: clamp(20px, 3vw, 32px);
}
.tend-drift__title {
  font-family: 'Archivo Head', 'Archivo', 'Helvetica Neue', Arial, sans-serif;
  font-weight: 800;
  font-size: clamp(18px, 1.1vw + 10px, 24px);
  color: var(--ink, #222222);
  margin: 0 0 14px;
}
.tend-drift__block { margin-top: 18px; }
.tend-drift__block-head {
  font-family: 'Archivo', system-ui, sans-serif;
  font-size: 12px;
  font-weight: 700;
  color: var(--ink, #222222);
  margin-bottom: 2px;
}
.tend-drift__row {
  display: grid;
  grid-template-columns: 130px 100px 1fr;
  align-items: center;
  gap: 10px;
  margin-top: 8px;
}
@media (max-width: 480px) {
  /* The 3-column grid crushes the caption column to ~90px on a real phone width,
     wrapping "2023: 46% -> 2025: 41% - 10-pt range - #74 of 171 - a typical amount"
     across 8 lines (verified live via a simulated 326px container, 2026-07-26) --
     stack instead, same re-encode-don't-shrink rule doc 90 SS5 gives for tables. */
  .tend-drift__row {
    grid-template-columns: 1fr;
    gap: 2px;
    margin-top: 14px;
  }
  .tend-drift__spark { width: 140px; }
}
.tend-drift__row-label {
  font-family: 'Archivo', system-ui, sans-serif;
  font-size: 12px;
  font-weight: 600;
  color: var(--ink-2, #5b5b5b);
}
.tend-drift__spark { display: block; width: 100px; height: 28px; overflow: visible; }
.tend-drift__spark path { fill: none; stroke: currentColor; stroke-width: 1.6; }
.tend-drift__spark .baseline { stroke: var(--line, #e4e4e1); stroke-width: 1; stroke-dasharray: 2 2; }
.tend-drift__spark circle { fill: currentColor; }
.tend-drift__spark--offense { color: #222222; }
.tend-drift__spark--defense { color: #222222; }
.tend-drift__row-sub {
  font-family: 'Archivo', system-ui, sans-serif;
  font-size: 12px;
  color: var(--ink-3, #686862);
}


/* Recruiting Footprint — geographic class distribution */

/* Recruiting Footprint chip */
.recruit-footprint {
  padding: clamp(14px, 1.8vw, 20px) clamp(16px, 2.0vw, 24px);
  background: var(--bg-card, #ffffff);
  border: 1px solid var(--stroke-subtle, rgba(34, 34, 34,0.08));
  border-radius: 3px;
  margin-bottom: clamp(20px, 3vw, 32px);
  font-variant-numeric: tabular-nums;
}
.recruit-footprint__head {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  gap: 12px;
  margin-bottom: 10px;
  border-bottom: 1px dashed var(--stroke-subtle, rgba(34, 34, 34,0.07));
  padding-bottom: 8px;
}
.recruit-footprint__eyebrow {
  font-family: var(--font-sans, system-ui, sans-serif);
  font-size: 12.5px;
  font-weight: 700;
  letter-spacing: 0.01em;
  text-transform: none;
  color: var(--ink-3, #686862);
  margin: 0;
}
.recruit-footprint__total {
  font-family: var(--font-display, 'Archivo', system-ui, sans-serif);
  font-size: clamp(22px, 1.4vw + 8px, 28px);
  color: var(--blue, #1d68a3);
  line-height: 1;
}
/* State counts read as a plain row of words ("TX · 12   OH · 5"), not boxed
   chips (DESIGN.md, labels are words). The home state is bold ink. */
.recruit-footprint__states {
  display: flex;
  gap: 4px 14px;
  flex-wrap: wrap;
  margin-top: 6px;
}
.recruit-footprint__state {
  font-family: var(--font-sans, 'Archivo', system-ui, sans-serif);
  font-size: 12.5px;
  line-height: 1.3;
  color: var(--fg-secondary);
}
.recruit-footprint__state--home {
  color: var(--ink, #222);
  font-weight: 700;
}
.recruit-footprint__story {
  font-family: 'Archivo', 'Helvetica Neue', Arial, sans-serif;
  font-size: 13px;
  
  line-height: 1.4;
  color: var(--fg-secondary);
  margin: 8px 0 0 0;
  max-width: 56ch;
}
.recruit-footprint__map {
  margin: 12px 0 4px 0;
  /* Match home_state_share's 680px cap — the two geography maps sit on the
     same tab, and full-column width dwarfs the chip's own headline. */
  max-width: 680px;
}
.recruit-footprint__capture {
  font-family: var(--font-sans, 'Archivo', system-ui, sans-serif);
  font-size: 12px;
  line-height: 1.5;
  color: var(--fg-secondary);
  margin: 8px 0 0 0;
  max-width: 58ch;
}
.recruit-footprint__capture a {
  color: var(--fg-primary, #222);
  font-weight: 700;
  text-decoration: none;
}
.recruit-footprint__capture a:hover { text-decoration: underline; }

/* Choropleth (statebins tile grid) — WS-08. Light-only (docs/design-system/90
   + 91: dark is retired, no dark islands). */
.choropleth { margin: 0; }
.choropleth__title {
  font-family: var(--font-sans, 'Archivo', system-ui, sans-serif);
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.13em;
  text-transform: none;
  color: var(--fg-muted);
  margin-bottom: 8px;
}
.choropleth__svg {
  width: 100%;
  height: auto;
  max-width: 420px;
  display: block;
}
.choropleth__legend {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-top: 8px;
}
.choropleth__legend-ramp {
  flex: 1;
  max-width: 160px;
  height: 8px;
  border-radius: 3px;
  /* Fallback only -- the real ramp is always set inline (pale tint -> peak
     accent), computed per-call from the actual accent color. */
  background: linear-gradient(90deg, #f0e6cc, var(--accent-primary, #b7851a));
}
.choropleth__legend-label {
  font-family: var(--font-mono, ui-monospace, monospace);
  font-size: 10px;
  color: var(--fg-muted);
  white-space: nowrap;
}
.choropleth__caption {
  font-family: 'Archivo', 'Helvetica Neue', Arial, sans-serif;
  font-size: 12px;
  
  line-height: 1.4;
  color: var(--fg-secondary);
  margin: 8px 0 0 0;
  max-width: 56ch;
}
.chart-card { margin: 0 0 1.5rem; padding: 0; border: 0; }
.chart-card__head { margin-bottom: .6rem; }
.chart-card__eyebrow {
  margin: 0 0 .2rem; font-size: .8rem; letter-spacing: .14em;
  text-transform: none; font-weight: 700;
  color: var(--chart-card-eyebrow, var(--fg-muted, #7a7a7a));
}
.chart-card__headline {
  margin: 0; font-size: 1.18rem; line-height: 1.2; font-weight: 700;
  color: var(--chart-card-fg, var(--fg, #1a1a1a));
}
.chart-card__lede {
  margin: .25rem 0 0; font-size: .9rem; line-height: 1.45;
  color: var(--chart-card-muted, var(--fg-secondary, #555));
}
.chart-card__body {
  display: grid; grid-template-columns: auto 1fr;
  grid-template-areas: "ylabel plot" ".  xlabel";
  align-items: center; gap: .35rem .5rem;
}
.chart-card__plot { grid-area: plot; position: relative; min-width: 0; }
.chart-card__plot > svg { max-width: 100%; height: auto; display: block; }
.chart-card__overlay { position: absolute; inset: 0; pointer-events: none; }
.chart-card__overlay > svg { width: 100%; height: 100%; display: block; }
.chart-card__ylabel {
  grid-area: ylabel; writing-mode: vertical-rl; transform: rotate(180deg);
  font-size: .8rem; letter-spacing: .1em; text-transform: none;
  color: var(--chart-card-muted, var(--fg-muted, #7a7a7a)); white-space: nowrap;
}
.chart-card__xlabel {
  grid-area: xlabel; text-align: center;
  font-size: .8rem; letter-spacing: .1em; text-transform: none;
  color: var(--chart-card-muted, var(--fg-muted, #7a7a7a));
}
.chart-card__source {
  margin-top: .5rem; font-size: .8rem; line-height: 1.4;
  color: var(--chart-card-muted, var(--fg-muted, #7a7a7a));
}
.chart-card__source-label {
  text-transform: none; letter-spacing: .1em; font-weight: 700;
  margin-right: .35rem;
}
@media (max-width: 360px) {
  .chart-card__body { grid-template-columns: 1fr; grid-template-areas: "plot" "xlabel"; }
  .chart-card__ylabel { display: none; }
}

/* Miles From Home — median roster distance from campus */

/* Miles From Home -- white framed card, no team-colour side stripe, no tint
   (DESIGN.md, 2026-09-28). The eyebrow is the module's only heading, set as
   a plain sentence-case label. */
.miles-home{padding:clamp(14px,1.8vw,20px) clamp(16px,2.0vw,24px);
  background:var(--bg-card,#fff);
  border:1px solid var(--stroke-subtle,rgba(34,34,34,.08));
  border-radius:3px;margin-bottom:clamp(20px,3vw,32px);
  font-variant-numeric:tabular-nums}
.miles-home__eyebrow{font-family:var(--font-sans,'Archivo',system-ui,sans-serif);
  font-size:12.5px;font-weight:700;letter-spacing:.01em;text-transform:none;
  color:var(--ink-3,#686862);margin:0 0 10px;
  border-bottom:1px dashed var(--stroke-subtle,rgba(34,34,34,.07));padding-bottom:8px}
.miles-home__lede{font-family:'Archivo','Helvetica Neue',Arial,sans-serif;
  font-size:clamp(15px,1.1vw+9px,19px);line-height:1.35;color:var(--fg-primary,#222);
  margin:0 0 4px;max-width:54ch}
.miles-home__figure{font-family:var(--font-display,'Archivo',system-ui,sans-serif);
  font-weight:800;color:var(--blue,#1d68a3)}
.miles-home__sub{font-family:var(--font-sans,'Archivo',system-ui,sans-serif);
  font-size:12px;line-height:1.45;color:var(--fg-secondary);margin:0 0 14px;max-width:58ch}
.miles-home__rank{display:flex;align-items:baseline;justify-content:space-between;
  gap:12px;margin:0 0 5px;font-family:var(--font-sans,'Archivo',system-ui,sans-serif);
  font-size:12px;font-weight:700;color:var(--fg-secondary)}
.miles-home__rank-end{color:var(--fg-tertiary,#8b8b8b);font-weight:600}
.miles-home__rank-end a{color:inherit;text-decoration:none}
.miles-home__rank-end a:hover{color:var(--fg-primary,#222);text-decoration:underline}
.wcfb-percentile-bar__track.miles-home__track{height:10px;overflow:visible;margin:2px 0 8px}
/* Neutralise the shared component's diverging red->grey->blue fill on this
   bar. Doc 100 binds red/blue to loss/verified-production; distance from home
   has no good-or-bad axis, so colouring a close-to-home roster red and a
   far-travelled one blue would assert a value judgment the data doesn't carry.
   Gray is doc 100's "context" hue, which is exactly what this fill is — the
   marker dot carries the position. Two classes + the attribute always outrank
   the component's own single-class + attribute rule, so this wins regardless
   of where the two land in the shared team-pages bundle. */
.wcfb-percentile-bar__track.miles-home__track .wcfb-percentile-bar__fill[data-pct-low="true"],
.wcfb-percentile-bar__track.miles-home__track .wcfb-percentile-bar__fill[data-pct-medium="true"],
.wcfb-percentile-bar__track.miles-home__track .wcfb-percentile-bar__fill[data-pct-high="true"]{
  background:rgba(139,139,139,.45)}
.miles-home__scale{display:flex;justify-content:space-between;
  font-family:'Archivo',system-ui,sans-serif;font-variant-numeric:tabular-nums;font-size:12px;
  color:var(--fg-tertiary,#8b8b8b);margin:0 0 14px}
/* The spread reads as a plain row of facts, not a row of boxed tiles. */
.miles-home__spread{display:grid;grid-template-columns:repeat(auto-fit,minmax(112px,1fr));
  gap:8px 16px;margin:0 0 10px}
.miles-home__cell{padding:4px 0}
.miles-home__cell-k{display:block;font-family:var(--font-sans,'Archivo',system-ui,sans-serif);
  font-size:12px;font-weight:700;letter-spacing:.01em;color:var(--fg-tertiary,#8b8b8b);
  margin-bottom:3px}
.miles-home__cell-v{display:block;font-family:var(--font-display,'Archivo',system-ui,sans-serif);
  font-size:16px;font-weight:700;color:var(--fg-primary,#222);line-height:1.1}
.miles-home__cell-n{display:block;font-family:var(--font-sans,'Archivo',system-ui,sans-serif);
  font-size:12px;color:var(--fg-tertiary,#8b8b8b);margin-top:2px;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.miles-home__note{font-family:var(--font-sans,'Archivo',system-ui,sans-serif);
  font-size:12px;line-height:1.45;color:var(--fg-tertiary,#8b8b8b);margin:0;max-width:60ch}


/* Who Owns Their State — in-state share of the current roster */

/* Who Owns Their State -- white framed card, no team-colour side stripe, no
   tint (DESIGN.md, 2026-09-28). The eyebrow is the module's only heading,
   set as a plain sentence-case label. */
.own-state{padding:clamp(14px,1.8vw,20px) clamp(16px,2.0vw,24px);
  background:var(--bg-card,#fff);
  border:1px solid var(--stroke-subtle,rgba(34,34,34,.08));
  border-radius:3px;margin-bottom:clamp(20px,3vw,32px);
  font-variant-numeric:tabular-nums}
.own-state__eyebrow{font-family:var(--font-sans,'Archivo',system-ui,sans-serif);
  font-size:12.5px;font-weight:700;letter-spacing:.01em;text-transform:none;
  color:var(--ink-3,#686862);margin:0 0 10px;
  border-bottom:1px dashed var(--stroke-subtle,rgba(34,34,34,.07));padding-bottom:8px}
.own-state__lede{font-family:'Archivo','Helvetica Neue',Arial,sans-serif;
  font-size:clamp(15px,1.1vw+9px,19px);line-height:1.35;color:var(--fg-primary,#222);
  margin:0 0 4px;max-width:54ch}
.own-state__figure{font-family:var(--font-display,'Archivo',system-ui,sans-serif);
  font-weight:800;color:var(--blue,#1d68a3)}
.own-state__sub{font-family:var(--font-sans,'Archivo',system-ui,sans-serif);
  font-size:12px;line-height:1.45;color:var(--fg-secondary);margin:0 0 12px;max-width:58ch}
.own-state__delta{font-family:'Archivo','Helvetica Neue',Arial,sans-serif;
  font-size:12.5px;line-height:1.5;color:var(--fg-secondary);margin:0 0 12px;max-width:58ch}
/* State counts ("OH · 45") read as a list of words, not a row of boxed
   chips; the home state is the subject, so it is ink and bold. */
.own-state__states{display:flex;gap:4px 14px;flex-wrap:wrap;margin:0 0 12px}
.own-state__chip{font-family:'Archivo',system-ui,sans-serif;font-variant-numeric:tabular-nums;
  font-size:12px;color:var(--fg-secondary)}
.own-state__chip--home{color:var(--ink,#222);font-weight:700}
/* Cap the tile map — full-column width dwarfs the headline; ~680px keeps
   every tile label legible while the chip stays a chip. */
.own-state__map{margin:12px 0 10px;max-width:680px}
.own-state__more{display:inline-block;font-family:var(--font-sans,'Archivo',system-ui,sans-serif);
  font-size:12px;font-weight:700;color:var(--fg-secondary);text-decoration:none;
  margin:0 0 10px}
.own-state__more:hover{color:var(--fg-primary,#222);text-decoration:underline}
.own-state__note{font-family:var(--font-sans,'Archivo',system-ui,sans-serif);
  font-size:12px;line-height:1.45;color:var(--fg-tertiary,#8b8b8b);margin:0;max-width:60ch}


/* Class Autopsy teaser — links to the full per-signing-class outcome page */

.class-autopsy-teaser{margin:14px 0;padding:14px 16px;background:#fff;
  border:1px solid var(--line);border-radius:3px}
.class-autopsy-teaser__row{display:flex;align-items:center;justify-content:space-between;gap:10px}
.class-autopsy-teaser__line{font-size:13px;color:var(--ink);line-height:1.4}
.class-autopsy-teaser__line b{font-weight:700}
.class-autopsy-teaser__link{font-size:12px;font-weight:700;color:var(--blue);
  text-decoration:none;white-space:nowrap}
.class-autopsy-teaser__link:hover{text-decoration:underline}


/* Recruiting & portal buzz — top r/cfb community posts */

/* Recruiting & portal buzz module */
.rcrt-buzz{margin:0 0 28px}
.rcrt-buzz__h{font-family:"Archivo","Helvetica Neue",Arial,sans-serif;font-weight:600;font-size:var(--fs-headline-sm,clamp(18px,1.2vw + 12px,22px));
  color:var(--ink);margin-bottom:10px;padding-bottom:8px;
  border-bottom:1px solid var(--stroke-subtle,rgba(34,34,34,.12))}
/* Posts are ruled rows, not tinted cards with a team-colour side stripe
   (DESIGN.md, 2026-09-28). */
.rcrt-buzz__list{display:flex;flex-direction:column;gap:0}
.rcrt-item{padding:9px 0;border-bottom:1px solid var(--stroke-subtle,rgba(34,34,34,.08))}
.rcrt-item:last-child{border-bottom:0}
.rcrt-item__title{font-size:13.5px;line-height:1.45;color:var(--ink);margin-bottom:3px}
.rcrt-item__meta{font-size:12px;color:var(--ink-3,#686862)}
.rcrt-item__meta b{color:var(--ink-2,#5b5b5b);font-weight:600}
.rcrt-buzz__src{font-size:12px;color:var(--ink-3,#686862);margin-top:8px}
/* empty state: plain text, no box */
.rcrt-buzz--empty .rcrt-buzz__empty{
  font-size:13px;color:var(--ink-3,#686862);margin-top:0}


/* r/cfb cultural moments — History tab */

/* r/cfb cultural moments — History tab */
.cfb-moments{margin:0 0 28px}
.cfb-moments__h{font-family:"Archivo","Helvetica Neue",Arial,sans-serif;font-weight:600;
  font-size:var(--fs-headline-sm,clamp(18px,1.2vw + 12px,22px));color:var(--ink);margin-bottom:10px;padding-bottom:8px;
  border-bottom:1px solid var(--stroke-subtle,rgba(34,34,34,.12))}
.cfb-moments__list{display:flex;flex-direction:column;gap:0}
.cfb-moment{display:flex;align-items:baseline;gap:12px;padding:9px 0;
  border-bottom:1px solid var(--stroke-subtle,rgba(34,34,34,.08))}
.cfb-moment:last-child{border-bottom:none}
.cfb-moment__score{font-family:"Archivo",sans-serif;font-weight:800;
  font-size:18px;color:var(--ink);min-width:54px;text-align:right;
  flex-shrink:0;letter-spacing:-.03em}
.cfb-moment__body{min-width:0}
.cfb-moment__title{font-size:13.5px;line-height:1.45;color:var(--ink);
  margin-bottom:2px}
.cfb-moment__meta{font-size:12px;color:var(--ink-3,#8b8b8b)}
.cfb-moments__src{font-size:12px;color:var(--ink-3,#8b8b8b);margin-top:8px}


/* Rival watchlist — current fan belief for top rivals */

/* Rival watchlist — Now tab */
.rw-section{margin:0 0 28px}
.rw-section__h{font-family:"Archivo","Helvetica Neue",Arial,sans-serif;font-weight:600;
  font-size:var(--fs-headline-sm,clamp(18px,1.2vw + 12px,22px));color:var(--ink);margin-bottom:10px;padding-bottom:8px;
  border-bottom:1px solid var(--stroke-subtle,rgba(34,34,34,.12))}
.rw-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:10px}
/* DESIGN.md (2026-09-28): no team-colour side stripe; the mood word is a
   caption word, not a tinted badge; the mood score is ink (it is a level,
   not a result or an up/down delta, so it takes no green/red). */
.rw-card{border:1px solid rgba(34,34,34,.12);border-radius:3px;padding:12px 14px}
.rw-card__name{font-size:13px;font-weight:700;color:var(--ink);margin-bottom:5px}
.rw-card__badge{display:inline-block;font-size:12.5px;font-weight:500;
  color:var(--ink-3,#686862);margin-bottom:6px}
.rw-card__score{font-family:"Archivo",sans-serif;font-weight:800;font-size:22px;
  letter-spacing:-.04em;color:var(--ink)}
.rw-card__tier{font-size:12px;color:var(--ink-3,#686862);margin-top:4px}
.rw-section__src{font-size:12px;color:var(--ink-3,#686862);margin-top:8px}
.rw-card__cmp{display:inline-block;margin-top:8px;font-size:12px;font-weight:700;
  color:var(--blue,#1d68a3);text-decoration:none}
.rw-card__cmp:hover{text-decoration:underline}


/* Top Players — 5-row stat leaders */

/* Top Players -- a white framed card with ruled rows: no team-colour side
   stripe, no tint, no boxed rows nested in the card (DESIGN.md, 2026-09-28). */
.top-players {
  padding: clamp(14px, 1.8vw, 20px) clamp(16px, 2.0vw, 24px);
  background: var(--bg-card, #fff);
  border: 1px solid var(--stroke-subtle, rgba(34, 34, 34,0.08));
  border-radius: 3px;
  margin-bottom: clamp(20px, 3vw, 32px);
  font-variant-numeric: tabular-nums;
}
.top-players__head {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  gap: 12px;
  border-bottom: 1px dashed var(--stroke-subtle, rgba(34, 34, 34,0.07));
  padding-bottom: 8px;
  margin-bottom: 10px;
}
/* The module's only heading ("2026 stat leaders · Ohio State"): a plain
   sentence-case label, not a tracked eyebrow. */
.top-players__eyebrow {
  font-family: var(--font-sans, system-ui, sans-serif);
  font-size: 12.5px;
  font-weight: 700;
  letter-spacing: 0.01em;
  text-transform: none;
  color: var(--ink-3, #686862);
  margin: 0;
}
/* "Through 1 game" / "Final": a date-ish status in words, not a tinted box. */
.top-players__year {
  font-family: var(--font-sans, system-ui, sans-serif);
  font-size: 12.5px;
  font-weight: 500;
  letter-spacing: 0.01em;
  text-transform: none;
  color: var(--ink-3, #686862);
}
.top-players__lede {
  font-family: var(--font-sans, 'Archivo', system-ui, sans-serif);
  font-size: clamp(16px, 1vw + 9px, 20px);
  font-weight: 600;
  line-height: 1.25;
  color: var(--fg-primary, #222222);
  margin: 0 0 10px;
  max-width: 48ch;
}
.top-players__list {
  display: grid;
  gap: 6px;
}
.top-players__row {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto auto;
  gap: 12px 14px;
  padding: 8px 0;
  border-bottom: 1px solid var(--stroke-subtle, rgba(34, 34, 34,0.06));
  align-items: baseline;
}
.top-players__row:last-child { border-bottom: none; }
.top-players__rank {
  font-family: 'Archivo', system-ui, sans-serif;
  font-variant-numeric: tabular-nums;
  font-size: 13px;
  color: var(--fg-secondary, #5b5b5b);
  font-weight: 700;
  min-width: 22px;
}
.top-players__name {
  font-family: var(--font-display, 'Archivo', system-ui, sans-serif);
  font-size: clamp(14px, 0.9vw + 8px, 17px);
  letter-spacing: 0.01em;
  color: var(--fg-primary);
  line-height: 1.1;
}
.top-players__pos {
  font-family: 'Archivo', system-ui, sans-serif;
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.01em;
  text-transform: none;
  color: var(--ink-3, #686862);
}
.top-players__stat {
  font-family: var(--font-sans, 'Archivo', system-ui, sans-serif);
  font-size: 12.5px;
  color: var(--fg-secondary);
  text-align: right;
  min-width: 96px;
}
.top-players__stat strong {
  color: var(--fg-primary, #222222);
  font-weight: 700;
}


/* Team-Specific Positions — bespoke roster position names */

/* Team-Specific Positions — bespoke roster position names.
   DESIGN.md (2026-09-28): a white framed card with no team-colour side
   stripe; the title is a sentence-case label; the note is upright; each
   group's players are a plain "·" list, not boxed monospace chips. */
.team-specific-positions {
  display: grid;
  gap: clamp(10px, 1.2vw, 14px);
  padding: clamp(14px, 1.8vw, 20px) clamp(16px, 2.0vw, 24px);
  background: var(--page, #ffffff);
  border: 1px solid var(--stroke-subtle, rgba(34, 34, 34, 0.08));
  border-radius: 3px;
  margin-bottom: clamp(20px, 3vw, 32px);
}
.team-specific-positions__head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 12px;
  flex-wrap: wrap;
}
.team-specific-positions__eyebrow {
  font-family: var(--font-sans, 'Archivo', system-ui, sans-serif);
  font-size: 12.5px;
  font-weight: 700;
  letter-spacing: 0.01em;
  color: var(--ink, #222);
}
.team-specific-positions__sub {
  font-family: var(--font-sans, 'Archivo', system-ui, sans-serif);
  font-size: 12.5px;
  color: var(--fg-muted, #686862);
}
.team-specific-positions__list {
  display: grid;
  gap: clamp(12px, 1.6vw, 18px);
}
.team-specific-positions__row {
  display: grid;
  gap: 4px;
  padding-top: clamp(10px, 1.4vw, 14px);
  border-top: 1px solid var(--stroke-subtle, rgba(34, 34, 34, 0.08));
}
.team-specific-positions__row:first-child {
  padding-top: 0;
  border-top: none;
}
.team-specific-positions__name {
  font-family: var(--font-display, 'Archivo Head', 'Archivo', 'Helvetica Neue', Arial, sans-serif);
  font-weight: 800;
  font-size: clamp(20px, 2.6vw, 28px);
  color: var(--fg-primary, #222222);
  line-height: 1.1;
}
.team-specific-positions__def {
  font-family: var(--font-sans, 'Archivo', system-ui, sans-serif);
  font-size: 13.5px;
  line-height: 1.45;
  color: var(--fg-secondary, #5b5b5b);
  max-width: 62ch;
}
.team-specific-positions__note {
  font-family: var(--font-sans, 'Archivo', system-ui, sans-serif);
  font-size: 12px;
  color: var(--fg-muted, #686862);
  max-width: 62ch;
}
.team-specific-positions__players {
  display: flex;
  flex-wrap: wrap;
  gap: 4px 0;
  margin-top: 4px;
}
.team-specific-positions__player {
  display: inline-block;
  font-family: 'Archivo', 'Helvetica Neue', Arial, sans-serif;
  font-size: 12.5px;
  color: var(--fg-primary, #222222);
  font-variant-numeric: tabular-nums;
}
.team-specific-positions__player + .team-specific-positions__player::before {
  content: "·";
  margin: 0 6px;
  color: #8b8b85;
}
.team-specific-positions__player--more {
  color: var(--fg-muted, #686862);
}


/* CFB Index Roster — qualified-score count + rank per team */

/* CFB Index Roster chip */
.roster-rollup {
  padding: clamp(14px, 1.8vw, 20px) clamp(16px, 2.0vw, 24px);
  background: rgba(34, 34, 34, 0.025);
  border: 1px solid var(--stroke-subtle, rgba(34, 34, 34,0.08));
  border-left: 1px solid var(--stroke-subtle, rgba(34, 34, 34,0.08));
  border-radius: 3px;
  margin-bottom: clamp(20px, 3vw, 32px);
  font-variant-numeric: tabular-nums;
  display: grid;
  gap: 10px;
}
.roster-rollup__head {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  gap: 12px;
  border-bottom: 1px dashed var(--stroke-subtle, rgba(34, 34, 34,0.07));
  padding-bottom: 8px;
}
.roster-rollup__eyebrow {
  font-family: var(--font-sans, system-ui, sans-serif);
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: none;
  color: var(--fg-muted);
  margin: 0;
}
.roster-rollup__year {
  font-family: var(--font-sans, system-ui, sans-serif);
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.10em;
  text-transform: none;
  color: var(--fg-muted);
  padding: 3px 8px;
  border-radius: 3px;
  background: rgba(34, 34, 34, 0.04);
}
.roster-rollup__verdict {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 8px 16px;
  align-items: baseline;
}
.roster-rollup__count {
  font-family: var(--font-display, 'Archivo', system-ui, sans-serif);
  font-size: clamp(28px, 2vw + 10px, 40px);
  font-weight: 400;
  line-height: 1;
  color: var(--fg-primary, #222222);
}
.roster-rollup__count-label {
  font-family: var(--font-sans, system-ui, sans-serif);
  font-size: 12px;
  letter-spacing: 0.02em;
  color: var(--fg-secondary);
  line-height: 1.3;
}
.roster-rollup__list {
  display: grid;
  gap: 6px;
}
.roster-rollup__row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto auto;
  gap: 10px;
  align-items: baseline;
  font-family: var(--font-mono, ui-monospace, monospace);
  font-size: 12px;
  padding: 4px 8px;
  background: rgba(34, 34, 34, 0.02);
  border-radius: 3px;
  border: 1px solid var(--stroke-subtle, rgba(34, 34, 34,0.06));
}
.roster-rollup__name {
  color: var(--fg-primary);
  font-family: var(--font-sans, system-ui, sans-serif);
  font-weight: 600;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.roster-rollup__pos {
  color: var(--fg-muted);
  font-size: 12px;
  text-transform: none;
  letter-spacing: 0.08em;
}
.roster-rollup__rank {
  color: var(--fg-secondary, #5b5b5b);
  font-weight: 600;
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}
.roster-rollup__more {
  font-family: var(--font-sans, system-ui, sans-serif);
  font-size: 12px;
  color: var(--fg-muted);
  margin: 0;
}


/* LLM Chronicle AI Narratives — Mistral Nemo + Qwen3 pipeline */

.llm-chronicle {
  margin: 32px 0;
  padding-top: 24px;
  border-top: 1px solid rgba(34,34,34,0.08);
}
.llm-chronicle__header {
  display: flex;
  align-items: baseline;
  gap: 12px;
  margin-bottom: 16px;
  flex-wrap: wrap;
}
.llm-chronicle__title {
  font-family: 'Archivo', 'Helvetica Neue', Arial, sans-serif;
  font-size: 22px;
  font-weight: 700;
  color: var(--ink, #222222);
  margin: 0;
}
.llm-chronicle__meta {
  font-size: 12.5px;
  color: var(--fg-muted, #686862);
}
.llm-chronicle__more {
  margin-left: auto;
  font-size: 12.5px;
  color: var(--blue, #1d68a3);
  text-decoration: none;
  transition: opacity .1s ease-in;
}
.llm-chronicle__more:hover { opacity: .8; }
/* Arc framing — "where things stand" context above the card grid: a plain
   line, no side stripe or cream tint (DESIGN.md). */
.llm-arc {
  margin-bottom: 18px;
}
.llm-arc__text {
  margin: 0;
  font-family: 'Archivo', 'Helvetica Neue', Arial, sans-serif;
  font-size: 1.02rem;
  font-weight: 600;
  line-height: 1.5;
  color: var(--ink, #222222);
}
.llm-chronicle__grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
  gap: 14px;
}
.llm-card {
  background: var(--bg-card, #ffffff);
  border: 1px solid var(--line, #e7e7e2);
  border-radius: 3px;
  padding: 14px 18px;
}
.llm-card__type {
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.01em;
  text-transform: none;
  color: var(--fg-muted, #686862);
  margin-bottom: 6px;
}
.llm-card__headline {
  font-family: 'Archivo', sans-serif;
  font-size: 16px;
  font-weight: 700;
  color: var(--fg-primary, #222222);
  margin: 0 0 8px 0;
}
.llm-card__body {
  font-family: 'Archivo', 'Helvetica Neue', Arial, sans-serif;
  font-size: 14px;
  line-height: 1.55;
  color: var(--fg-primary, #222222);
  margin: 0 0 10px 0;
}
.llm-card__footer {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  border-top: 1px solid rgba(34,34,34,0.06);
  padding-top: 8px;
}
/* The card's date, as caption words (was a boxed monospace badge). */
.llm-badge {
  font-size: 12.5px;
  font-weight: 500;
  color: var(--fg-muted, #686862);
  font-variant-numeric: tabular-nums;
}


/* Chronicle Visuals — v3 visual-first deterministic SVG cards */

.chronicle-visuals {
  display: block;
  margin-top: var(--sp-8, 32px);
  padding-top: var(--sp-6, 24px);
  border-top: 1px solid var(--border, rgba(0,0,0,0.1));
}
/* Shared data-point tooltip (works on hover, touch, and keyboard focus). The
   inline-SVG <title> is the zero-JS fallback; this is the enhanced layer. */
.chronicle-visuals .cv-tip {
  position: fixed; z-index: 60; pointer-events: none; opacity: 0;
  transition: opacity .12s ease; transform: translateZ(0);
  background: #ffffff; color: #222222; border: 1px solid #d7d7d4;
  font: 500 12px/1.45 'Archivo', 'Helvetica Neue', Arial, sans-serif;
  font-variant-numeric: tabular-nums;
  padding: 6px 9px; border-radius: 2px;
  box-shadow: 0 2px 8px rgba(0,0,0,.12);
  max-width: 260px;
}
@media (prefers-reduced-motion: reduce) { .chronicle-visuals .cv-tip { transition: none; } }
.chronicle-visuals__header {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: var(--sp-3, 12px);
  flex-wrap: wrap;
  margin-bottom: var(--sp-5, 20px);
}
.chronicle-visuals__title {
  font-size: clamp(20px, 2.4vw, 28px);
  font-family: var(--font-head, 'Archivo Head', 'Archivo', 'Helvetica Neue', Arial, sans-serif);
  font-weight: 800;
  margin: 0;
  text-transform: none;
}
.chronicle-visuals__meta {
  font-size: 12.5px;
  color: var(--fg-2, #686862);
}
.chronicle-visuals__grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--sp-5, 20px);
}
@media (min-width: 960px) {
  .chronicle-visuals__grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
.visual-card {
  background: var(--bg-card, #fff);
  border: 1px solid var(--border, rgba(0,0,0,0.08));
  border-radius: 3px;
  padding: var(--sp-4, 16px);
  display: flex;
  flex-direction: column;
  gap: var(--sp-3, 12px);
}
.visual-card__headline {
  font-size: 15px;
  font-weight: 700;
  line-height: 1.3;
  margin: 0;
  color: var(--fg-0, #111);
}
.visual-card__svg {
  width: 100%;
  overflow: hidden;
  border-radius: 2px;
}
.visual-card__svg svg {
  display: block;
  width: 100%;
  height: auto;
  max-height: 400px;
}
.visual-card__meta {
  display: flex;
  gap: var(--sp-3, 12px);
  flex-wrap: wrap;
  font-size: 12.5px;
  color: var(--fg-2, #686862);
}
/* The card's season and its share link are words, not boxed badges
   (DESIGN.md: labels are words; boxes are for things you press). */
.visual-card__badge {
  font-size: 12.5px;
  font-weight: 500;
  color: var(--fg-2, #686862);
  text-transform: none;
}
.visual-card__badge--share {
  color: var(--blue, #1d68a3);
  font-weight: 600;
  text-decoration: underline;
  text-underline-offset: 2px;
  cursor: pointer;
  transition: opacity .1s ease-in;
}
.visual-card__badge--share:hover {
  opacity:.8;
}
.visual-card__badge--preview,
.visual-card__badge--retro {
  font-weight: 700;
  color: var(--fg-2, #686862);
}


/* 3-Act page structure — Profile-archetype zoning (Octopus review) */

.act { display: block; }
.act + .act { margin-top: var(--sp-9, 40px); }
.act__head {
  display: flex;
  align-items: baseline;
  gap: var(--sp-3, 12px);
  flex-wrap: wrap;
  margin: var(--sp-6, 24px) 0 var(--sp-4, 16px);
  padding-bottom: var(--sp-2, 8px);
  border-bottom: 2px solid var(--stroke-strong, #d7d7d4);
}
.act__num {
  font-family: 'Archivo', 'Helvetica Neue', Arial, sans-serif;
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 0.01em;
  text-transform: none;
  color: var(--fg-muted, #686862);
}
.act__title {
  font-family: var(--font-head, 'Archivo Head', 'Archivo', 'Helvetica Neue', Arial, sans-serif);
  font-size: clamp(24px, 3vw, 36px);
  font-weight: 800;
  text-transform: none;
  margin: 0;
  line-height: 1;
}
.act__hint {
  font-size: 12.5px;
  color: var(--fg-2, #686862);
  margin-left: auto;
}
/* Act III review drawer */
details.act--review { margin-top: var(--sp-9, 40px); }
details.act--review > summary {
  list-style: none;
  cursor: pointer;
  display: flex;
  align-items: baseline;
  gap: var(--sp-3, 12px);
  flex-wrap: wrap;
  margin: var(--sp-6, 24px) 0 0;
  padding-bottom: var(--sp-2, 8px);
  border-bottom: 2px dashed var(--border, rgba(0,0,0,0.2));
}
details.act--review > summary::-webkit-details-marker { display: none; }
details.act--review > summary::after {
  content: "▸";
  margin-left: var(--sp-2, 8px);
  color: var(--fg-2, #6a6a6a);
  transition: transform 0.18s ease;
}
details.act--review[open] > summary::after { transform: rotate(90deg); }
details.act--review > summary:hover .act__title { opacity:.8; }
.act--review .act__body { margin-top: var(--sp-5, 20px); }
.act--review .act__body > * { opacity: 0.94; }
@media (max-width: 640px) {
  .act__head, details.act--review > summary { margin-top: var(--sp-5, 20px); }
}


/* Tier-1 masthead now comes from render_global_nav_block() (nav.py), which
   bundles its own CSS + markup + toggle JS -- replacing the hand-rolled
   .cfbi-site-header that used to live here. See CLAUDE.md-adjacent history:
   this was a scoped, verified swap (2026-07-17), not a drive-by; the
   sticky-strip (.tp-sticky) and tab-spine.js have no dependency on the
   header's internal structure -- confirmed by direct grep before this
   change, since neither references any cfbi-site-header/-nav/-brand class. */

/* The floating search + theme buttons (top-right, bottom-right on a phone) are gone as of 2026-10-11: the shared
   header carries the search box, and the site is light only. The rules stay for any cached page that still has them. */
.profile-page-controls {
  position: fixed;
  top: var(--sp-3, 12px);
  right: var(--sp-4, 16px);
  display: flex;
  gap: var(--sp-2, 8px);
  z-index: 50;
}
.profile-page-controls .nav-action,
.profile-page-controls .theme-toggle,
.profile-page-controls .cmdk-trigger {
  background: var(--bg-card, var(--bg-1));
  /* Solid white, no backdrop blur (DESIGN.md: no glassmorphism).
     2026-09-19 chrome audit: this button is position:fixed and can end up
     resting over any card's text as the page scrolls (confirmed via
     bounding-box overlap on two different team pages). Doc 90 section 1.5
     allows exactly one shadow for "genuinely floating layers" -- applying
     it here is the sanctioned fix: it reads as a layer sitting above the
     page rather than a stray collision with whatever happens to be under it. */
  box-shadow: 0 2px 8px rgba(0,0,0,.12);
}
@media (max-width: 640px) {
  .profile-page-controls {
    top: auto;
    bottom: var(--sp-3, 12px);
    right: var(--sp-3, 12px);
  }
}
/* Sticky belief strip — pins on scroll past .bf-lead section. A short
   crossfade, not a slide-in (DESIGN.md: no scroll-triggered slide-ins). */
.tp-sticky{position:fixed;top:0;left:0;right:0;z-index:99;height:40px;
  background:var(--bg-0,#fff);border-bottom:1px solid var(--stroke-default,#e4e4e1);
  display:flex;align-items:center;padding:0 24px;gap:16px;
  opacity:0;visibility:hidden;transition:opacity .15s ease-out,visibility .15s;}
.tp-sticky--visible{opacity:1;visibility:visible;}
.tp-sticky__name{font-family:'Archivo','Helvetica Neue',Arial,sans-serif;font-weight:600;font-size:14px;
  color:var(--fg-primary,#222);}
.tp-sticky__score{font-size:12px;color:var(--fg-secondary,#666);}
/* Horizontal-scroll fade affordance (2026-09-19 chrome audit) -- for any
   row that scrolls sideways with no other visible cue that it does: the
   Latest strip (.latest__row), the tab spine (.team-tabs), and its sub-nav
   (.tp-subnav). All three hid their native scrollbar with nothing
   replacing it, silently clipping content (a headline mid-word, a whole
   nav tab) with zero signal there was more.
   .team-tabs/.tp-subnav previously tried to fix this with a background-
   image gradient on the scrolling element itself -- that CAN'T work: an
   element's own background always paints BEHIND its children, so it can
   only dim empty space, never fade text rendered on top of it (confirmed
   live: a cropped screenshot of the "fixed" version showed zero visible
   change). This uses ::before/::after pseudo-elements instead, which
   paint on top of the row's real content and visibly fade it (confirmed
   live the same way -- the crop shows actual letters fading to white).
   JS toggles --scrolled/--end so a mask never lies about which side still
   has more to reveal. */
.hscroll-fade{position:relative;}
.hscroll-fade::before,.hscroll-fade::after{content:"";position:absolute;top:0;bottom:0;
  width:28px;pointer-events:none;transition:opacity .15s ease-out;}
.hscroll-fade::before{left:0;background:linear-gradient(to right, var(--bg-0,#fff), transparent);opacity:0;}
.hscroll-fade::after{right:0;background:linear-gradient(to left, var(--bg-0,#fff), transparent);}
.hscroll-fade--scrolled::before{opacity:1;}
.hscroll-fade--end::after{opacity:0;}

/* Return Brief — localStorage returning-visitor panel. A floating layer, so
   it fades in like a toast (200ms) instead of sliding down. */
#brief{position:fixed;top:0;left:0;right:0;z-index:9000;
  background:var(--bg-0,#fff);border-bottom:2px solid var(--fg-primary,#222);
  padding:10px 18px;
  opacity:0;visibility:hidden;transition:opacity .2s ease-out,visibility .2s;
  font-family:'Archivo',system-ui,sans-serif}
#brief.visible{opacity:1;visibility:visible}
.brief-hdr{display:flex;justify-content:space-between;align-items:center;margin-bottom:6px}
.brief-since{font-size:12px;color:var(--fg-secondary,#666);font-weight:500}
.brief-close{background:none;border:none;cursor:pointer;font-size:15px;
  color:var(--fg-secondary,#686862);padding:2px 4px;line-height:1;transition:opacity .1s ease-in}
.brief-close:hover{opacity:.8}
.brief-rows{display:flex;flex-wrap:wrap;gap:8px 20px}
.brief-row{display:flex;align-items:center;gap:8px}
.brief-lbl{font-size:12px;color:var(--fg-secondary,#666);margin-right:2px}
.brief-val{font-size:12px;font-weight:600;color:var(--fg-primary,#222)}
.brief-rival-name,.brief-rival-val,.brief-wire-val,.brief-arcs-val{font-size:12px}


.footer{background:var(--page,#fff);border-top:1px solid var(--rule,var(--border,#e0e0e0));
  margin-top:40px;font-family:var(--sans,'Archivo',system-ui,sans-serif);color:var(--ink,#222)}
.footer .page{max-width:1200px;margin:0 auto;padding:32px 20px 20px}
.footer .chrome{display:flex;justify-content:space-between;font-size:12px;
  font-weight:700;letter-spacing:.01em;color:#686862;
  border-bottom:1px solid var(--rule,var(--border,#e0e0e0));padding-bottom:16px;margin-bottom:24px}
.footer-cols{display:grid;grid-template-columns:repeat(4,1fr);gap:24px;margin-bottom:24px}
@media(max-width:680px){.footer-cols{grid-template-columns:1fr 1fr}}
@media(max-width:400px){.footer-cols{grid-template-columns:1fr}}
.footer-col__heading{font-size:12.5px;font-weight:700;letter-spacing:.01em;
  color:#686862;margin-bottom:10px}
.footer-col ul{list-style:none;margin:0;padding:0}
.footer-col ul li{font-size:12px;color:var(--ink-2,#555);margin-bottom:5px}
.footer-col ul li a{color:var(--ink-2,#555);text-decoration:none}
.footer-col ul li a:hover{color:var(--ink,#222)}
.bottom-chrome{display:flex;justify-content:space-between;flex-wrap:wrap;gap:8px 16px;
  font-size:12px;color:#686862;
  border-top:1px solid var(--rule,var(--border,#e0e0e0));
  padding-top:14px}
.bottom-chrome a{color:inherit;text-decoration:none}
.bottom-chrome a:hover{color:var(--ink,#222);text-decoration:underline}
.footer-social{white-space:nowrap}
.footer-lines{margin:0 0 24px}
.footer-line{display:flex;flex-wrap:wrap;gap:4px 18px;margin:0 0 10px;font-size:13px;line-height:1.5}
.footer-line__label{flex:0 0 76px;font-weight:700;color:var(--ink,#222)}
.footer-line a{color:var(--ink-2,#555);text-decoration:none;display:inline-block;min-height:24px;line-height:24px}
.footer-line a:hover{color:var(--ink,#222);text-decoration:underline}
@media(max-width:560px){.footer-line__label{flex-basis:100%}}

