/* Look-independent scales: spacing, radius, sizes, motion, TV stage geometry.
 * Source: design-system.md 1.3-1.4 (type scale, TV scale, spacing). All structure CSS reads these. */
:root {
  /* spacing scale (design-system 1.4): nothing in between */
  --space-1: 4px; --space-2: 8px; --space-3: 12px; --space-4: 16px;
  --space-5: 24px; --space-6: 32px; --space-7: 48px; --space-8: 64px;
  --hairline: 1px;

  /* radius: square corners everywhere (Build board, D-006). Only status pills and dots are round (--radius-pill). */
  --radius-sm: 0; --radius-md: 0; --radius-tv: 0; --radius-pill: 999px;

  /* type scale, phone and desktop */
  --fs-hero: 56px;   --lh-hero: 56px;
  --fs-num-lg: 32px; --lh-num-lg: 36px;
  --fs-h1: 32px;     --lh-h1: 36px;
  --fs-h2: 22px;     --lh-h2: 28px;
  --fs-h3: 17px;     --lh-h3: 24px;
  --fs-body: 16px;   --lh-body: 24px;
  --fs-small: 14px;  --lh-small: 20px;
  --fs-caption: 13px; --lh-caption: 18px;   /* nothing smaller than 13 */
  --fs-rank-phone: 20px;

  /* content widths */
  --w-phone-col: 480px;
  --w-desktop-col: 960px;
  --touch-min: 44px;

  /* TV stage: fixed 1920x1080, scaled by ONE factor to the screen by js/tv.js (js/lib/stage.js); letterboxed in --c-bg */
  --tv-stage-w: 1920px; --tv-stage-h: 1080px;
  --tv-margin-x: var(--space-8); --tv-margin-y: 40px; --tv-gap: var(--space-4);
  --tv-header-h: 96px; --tv-strip-h: 152px; --tv-footer-h: 40px;
  --tv-stand-h: 664px;   /* height of the standings area (1080 - margins - header - strip - footer - gaps); rows shrink to fit when more than 18 teams */
  --tv-row-h: 70px; --tv-row-gap: 4px; --tv-col-w: 872px; --tv-col-gap: 48px;
  --tv-rank-w: 120px; --tv-stripe-w: 12px; --tv-name-w: 460px; --tv-name-pad: 20px;
  --tv-chip-w: 104px; --tv-score-w: 176px; --tv-strip-label-w: 232px; --tv-logo-w: 280px; --tv-logo-h: 80px;

  /* TV type (px on the 1920x1080 stage). Team name: starts at --tv-fs-team, shrinks in steps to --tv-fs-team-min,
     then ellipsis. js/lib/fit.js reads these three, so changing a token changes the fit. */
  --tv-fs-team: 56px; --tv-fs-team-min: 44px; --tv-fs-team-step: 4px;
  --tv-fs-score: 66px; --tv-fs-rank: 56px; --tv-fs-rank-prefix: 34px;
  --tv-fs-contest: 52px; --tv-fs-countdown: 60px; --tv-fs-title: 36px;
  --tv-fs-strip-team: 40px; --tv-fs-strip-team-min: 32px; --tv-fs-strip-item: 40px;
  --tv-fs-meta: 28px;      /* minimum text size on the TV */
  --tv-fs-chip: 42px; --tv-fs-band: 56px;

  /* motion (design-system 1.8) */
  --ease: cubic-bezier(.2, .8, .2, 1);
  --dur-fast: 150ms; --dur-panel: 200ms; --dur-count: 800ms; --dur-slide: 600ms; --dur-fade: 400ms; --dur-scene: 500ms;
  --chip-hold: 8s;
}
