/* Brutal Duck — colour primitives and semantic aliases.
   Hex values transcribed verbatim from the Figma file. */
:root{
  /* ── Ink / stroke ─────────────────────────────────────────── */
  --bd-plum:#43273B;            /* rgb(67,39,59) — the stroke colour on everything */
  --bd-plum-ink:#43283C;        /* body text (ACSS `base`) */
  --bd-black:#000000;
  --bd-white:#FFFFFF;

  /* ── Brand accents ────────────────────────────────────────── */
  --bd-teal:#00B0A5;            /* Brand/Accent 1 */
  --bd-teal-light:#3FD3CE;      /* Accent 1 lighter — button faces */
  --bd-teal-dark:#008E97;       /* Accent 1 darker — links */
  --bd-teal-100:#B6ECEA;        /* Brand/100 — light stroke */
  --bd-teal-700:#0F5452;        /* Brand/700 */
  --bd-yellow:#FFC233;          /* Brand/Accent 2 — the signature duck yellow */
  --bd-orange:#F69220;          /* Brand/Accent 3 */
  --bd-flame:#F05A26;           /* Brand/Accent 4 */
  --bd-deep:#006072;            /* Brand/Accent 5 — deep teal, button shadows */
  --bd-deep-dark:#002F37;       /* Accent 5 darker */
  --bd-rust:#C75503;            /* yellow-button shadow */
  --bd-eggshell:#F9F4E8;        /* Brand/Light 2 — the default page ground */
  --bd-navy:#2E3A59;            /* documentation / slide body ink */
  --bd-grey:#D9D9D9;            /* disabled fills */
  --bd-neutral-900:#1A1A1A;

  /* ── Semantic surfaces (Figma "Tokens" collection) ────────── */
  --surface-primary:var(--bd-white);
  --surface-secondary:var(--bd-eggshell);
  --surface-tertiary:var(--bd-plum);
  --surface-brand:var(--bd-teal);
  --surface-brand-2:var(--bd-yellow);
  --surface-invert:var(--bd-deep);

  /* ── Semantic text ────────────────────────────────────────── */
  --text-primary:var(--bd-plum);
  --text-secondary:var(--bd-plum);
  --text-invert:var(--bd-white);
  --text-link:var(--bd-teal-dark);
  --text-link-hover:var(--bd-plum);

  /* ── Stroke ───────────────────────────────────────────────── */
  --colour-stroke:var(--bd-plum);
  --stroke-primary:var(--bd-teal-100);

  /* ── Button surfaces ──────────────────────────────────────── */
  --button-teal:var(--bd-teal-light);
  --button-teal-shadow:var(--bd-deep);
  --button-yellow:var(--bd-yellow);
  --button-yellow-shadow:var(--bd-rust);
}

/* Dark mode, as defined by the Figma variable collection. */
:root[data-theme="dark"],.bd-dark{
  --surface-primary:var(--bd-deep);
  --surface-secondary:var(--bd-deep-dark);
  --surface-tertiary:var(--bd-eggshell);
  --surface-brand:var(--bd-yellow);
  --surface-brand-2:var(--bd-teal-dark);
  --surface-invert:var(--bd-eggshell);
  --text-primary:var(--bd-white);
  --text-secondary:var(--bd-eggshell);
  --text-invert:var(--bd-plum);
  --text-link:var(--bd-teal-light);
  --stroke-primary:var(--bd-teal-700);
  --button-teal:var(--bd-teal-dark);
  --button-yellow:var(--bd-flame);
}