/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
   RAVESTREAMS — FONT LOADING (Trio 3)
   All three families are FREE and served from public CDNs.
   In production, self-host the woff2s in /static/fonts/ — see
   the follow-up note in /docs/design-system-v1.md.

   Display: PP Neue Machina    (Pangram Pangram via Fontshare)
   Body:    Hubot Sans         (GitHub variable, per-weight woff2s)
   Mono:    Monaspace Neon Var (GitHub Next, single variable woff2)

   Load order:
     1. <link rel="preconnect"> in HTML head to api.fontshare.com,
        cdn.fontshare.com (crossorigin), cdn.jsdelivr.net (crossorigin)
     2. <link rel="stylesheet" href="/static/css/fonts.css">  <-- this
     3. <link rel="stylesheet" href="/static/css/design-tokens.css">
     4. component / page stylesheets
   ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */

/* ━━━ Neue Machina (display) — Fontshare API ━━━
   Weights used: 500 / 700 / 800 / 900. Skips 300/400 to keep
   the file payload down — display sizes only. */
@import url('https://api.fontshare.com/v2/css?f[]=neue-machina@500,700,800,900&display=swap');

/* ━━━ Hubot Sans (body) — GitHub via jsdelivr ━━━
   Six discrete weights. We avoid the variable axes file because
   not all browsers cache it efficiently. */
@font-face {
  font-family: 'Hubot Sans';
  src: url('https://cdn.jsdelivr.net/gh/github/hubot-sans/fonts/webfonts/HubotSans-Light.woff2') format('woff2');
  font-weight: 300;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Hubot Sans';
  src: url('https://cdn.jsdelivr.net/gh/github/hubot-sans/fonts/webfonts/HubotSans-Regular.woff2') format('woff2');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Hubot Sans';
  src: url('https://cdn.jsdelivr.net/gh/github/hubot-sans/fonts/webfonts/HubotSans-Medium.woff2') format('woff2');
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Hubot Sans';
  src: url('https://cdn.jsdelivr.net/gh/github/hubot-sans/fonts/webfonts/HubotSans-SemiBold.woff2') format('woff2');
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Hubot Sans';
  src: url('https://cdn.jsdelivr.net/gh/github/hubot-sans/fonts/webfonts/HubotSans-Bold.woff2') format('woff2');
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Hubot Sans';
  src: url('https://cdn.jsdelivr.net/gh/github/hubot-sans/fonts/webfonts/HubotSans-ExtraBold.woff2') format('woff2');
  font-weight: 800;
  font-style: normal;
  font-display: swap;
}

/* ━━━ Monaspace Neon (mono) — GitHub Next variable ━━━
   Single variable woff2 covers weight 200-800 and the
   width axis 100-125%. Use for numbers / latency / timestamps /
   viewer counts only — NOT for chrome at <11px (it goes choppy). */
@font-face {
  font-family: 'Monaspace Neon';
  src: url('https://cdn.jsdelivr.net/gh/githubnext/monaspace/fonts/Web%20Fonts/Variable%20Web%20Fonts/Monaspace%20Neon/Monaspace%20Neon%20Var.woff2') format('woff2-variations');
  font-weight: 200 800;
  font-stretch: 100% 125%;
  font-style: normal;
  font-display: swap;
}

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
   SMALL-LABEL OVERRIDES
   Monaspace at 7-10px gets chunky and choppy on tier badges + pills.
   Hubot Sans ExtraBold at slightly tighter letterspacing reads
   cleaner. Reserve mono for actual data — numbers, latency,
   viewer counts, timestamps, durations, lap clocks.

   Any component author writing a new badge / pill class smaller
   than 11px should add their selector here.
   ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
.live-pill,
.tier-badge,
.cmd-item-badge,
.st-tier,
.nav-center .live-now {
  font-family: var(--label);
  font-weight: 800;
  letter-spacing: 0.12em;
}

.cta-eyebrow,
.section-eyebrow,
.section-label,
.hero-eyebrow {
  font-family: var(--label);
  font-weight: 700;
  letter-spacing: 0.14em;
}
