:root {
  /* ── Brand core ─────────────────────────────── */
  --ctf-orange: #FD7217;        /* primary accent — rules, highlights, active states (deck) */
  --ctf-orange-logo: #EC7404;   /* logo / theme accent variant */
  --ctf-navy: #002B4D;          /* logo ground, dark surfaces */
  --ctf-white: #FFFFFF;

  /* ── Orange tint ramp (from deck timeline) ──── */
  --ctf-orange-600: #EE821D;
  --ctf-orange-300: #F3A963;
  --ctf-orange-100: #F9D2AE;
  --ctf-orange-050: #FDEEDF;

  /* ── Text / neutrals ────────────────────────── */
  --ctf-ink: #403833;           /* body copy (warm dark brown-gray) */
  --ctf-gray: #4D4D4D;          /* titles, slide numbers, secondary text */
  --ctf-gray-300: #DCDCDC;      /* hairlines, quiet borders (theme lt2) */
  --ctf-gray-100: #F2F2F2;      /* quiet fills */

  /* ── Theme blues (secondary, charts only) ───── */
  --ctf-blue: #4F81BD;
  --ctf-blue-300: #95B3D7;
  --ctf-blue-100: #DCE6F2;

  /* ── Semantic aliases ───────────────────────── */
  --text-body: var(--ctf-ink);
  --text-heading: var(--ctf-gray);
  --text-muted: var(--ctf-gray);
  --text-inverse: var(--ctf-white);
  --surface-page: var(--ctf-white);
  --surface-card: var(--ctf-white);
  --surface-dark: var(--ctf-navy);
  --surface-tint: var(--ctf-orange-050);
  --accent: var(--ctf-orange);
  --accent-hover: var(--ctf-orange-600);
  --rule: var(--ctf-orange);          /* slide hairlines are ORANGE */
  --border-quiet: var(--ctf-gray-300);
  --link: var(--ctf-orange);
  --link-hover: var(--ctf-orange-600);
  --scrim-accent: rgba(253, 114, 23, 0.75);  /* title-slide trapezoid: orange @ 75% */
}