/* ==========================================================================
   hi-baseline.css — "This week vs the week before", the equal-length
   baseline strip.
   --------------------------------------------------------------------------
   Per NHL gamelogs/pulse.md:120-135 (the Pressure Suite's `/pulse` newsroom)
   and PORT_LEDGER_hockeyinsights.md pitch #1: a window is only ever compared
   to the immediately preceding window of the SAME length — never to season
   totals — and when that window is not loaded, the strip says so in plain
   language instead of drawing a trend from one window.

   HOUSE LAW OBSERVED HERE
     - NO ITALICS anywhere; every <em>/<i> is reset upright.
     - NO GOLD. No composite score, no count-up.
     - Mint/coral appear ONLY where the direction has an agreed meaning
       (fewer average-margin blowouts, more goals is not "good" or "bad" —
       it stays ink). See hi-baseline.js DIRECTION_MEANS_GOOD for exactly
       which figures ever carry colour.
     - Tokens read the host page's local names first, falling through to the
       canonical --hi- token — same cascade as hi-recap.css. Load AFTER
       hi-tokens.css and the page's own sheet.
   ========================================================================== */
:root{
  --bl-ink:    var(--ink,      var(--hi-ink, #0d1f3c));
  --bl-ink-2:  var(--ink2,     var(--hi-ink-2, #28405f));
  --bl-muted:  var(--hi-muted, #556a80);
  --bl-hair:   var(--hairline, var(--hi-hair, #e4dac7));
  --bl-line:   var(--border,   var(--hi-line, #d7cbb7));
  --bl-card:   var(--card,     var(--hi-surface-1, #fffaf1));
  --bl-card-2: var(--card2,    var(--hi-surface-2, #f7f1e2));
  --bl-mint:   var(--mint,     var(--hi-mint, #1e6b52));
  --bl-coral:  var(--coral,    var(--hi-coral, #a3402f));
  --bl-serif:  var(--serif,    var(--hi-serif, 'Newsreader', Georgia, serif));
  --bl-sans:   var(--sans,     var(--hi-sans, 'Source Sans 3', system-ui, sans-serif));
  --bl-mono:   var(--mono,     var(--hi-mono, 'JetBrains Mono', ui-monospace, monospace));
}

.hi-bl{display:block;margin:14px 0 0}
.hi-bl em,.hi-bl i,.hi-bl cite{font-style:normal}

.hi-bl-head{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;
  gap:6px 14px;margin:0 0 10px}
.hi-bl-t{font-family:var(--bl-serif);font-weight:700;font-size:1.02rem;line-height:1.2;
  color:var(--bl-ink);margin:0}
.hi-bl-t small{display:block;font-family:var(--bl-mono);font-size:.55rem;font-weight:700;
  letter-spacing:.13em;text-transform:uppercase;color:var(--bl-muted);margin-top:3px}

.hi-bl-box{border:1px solid var(--bl-line);border-radius:14px;background:var(--bl-card);
  padding:14px 16px}

/* --- the honest line, when the prior window is not on file -------------- */
.hi-bl-honest{margin:0;font-family:var(--bl-sans);font-size:.86rem;line-height:1.5;
  color:var(--bl-ink-2)}
.hi-bl-honest strong{color:var(--bl-ink)}

/* --- the note, shown alongside a comparison that is not night-for-night - */
.hi-bl-note{margin:0 0 10px;font-family:var(--bl-sans);font-size:.76rem;line-height:1.5;
  color:var(--bl-muted);padding:0 0 10px;border-bottom:1px solid var(--bl-hair)}

/* --- the pairs strip ------------------------------------------------------ */
.hi-bl-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));
  gap:12px}
.hi-bl-pair{display:grid;gap:3px;padding:0 12px 0 0;border-right:1px solid var(--bl-hair)}
.hi-bl-pair:last-child{border-right:0;padding-right:0}
.hi-bl-lbl{font-family:var(--bl-mono);font-size:.52rem;font-weight:700;letter-spacing:.11em;
  text-transform:uppercase;color:var(--bl-muted)}
.hi-bl-vals{display:flex;align-items:baseline;gap:8px;flex-wrap:wrap}
.hi-bl-now{font-family:var(--bl-serif);font-weight:700;font-size:1.5rem;line-height:1;
  color:var(--bl-ink);letter-spacing:-.01em;font-variant-numeric:tabular-nums}
.hi-bl-prior{font-family:var(--bl-sans);font-size:.78rem;color:var(--bl-muted);
  font-variant-numeric:tabular-nums}
.hi-bl-delta{font-family:var(--bl-mono);font-size:.68rem;font-weight:700;
  font-variant-numeric:tabular-nums;color:var(--bl-ink-2)}
/* direction only earns colour where the module has decided that direction
   carries an agreed meaning (see hi-baseline.js) — everything else, incl.
   plain "more goals" or "more games", stays ink */
.hi-bl-delta.is-good{color:var(--bl-mint)}
.hi-bl-delta.is-bad{color:var(--bl-coral)}
.hi-bl-windows{margin:10px 0 0;font-family:var(--bl-mono);font-size:.52rem;font-weight:600;
  letter-spacing:.06em;color:var(--bl-muted);line-height:1.6;padding-top:10px;
  border-top:1px solid var(--bl-hair)}

@media (max-width:600px){
  .hi-bl-pair{border-right:0;border-bottom:1px solid var(--bl-hair);padding:0 0 10px}
  .hi-bl-pair:last-child{border-bottom:0;padding-bottom:0}
}
@media (prefers-reduced-motion:reduce){ .hi-bl *{transition:none} }