/* ==========================================================================
   TinkySpeak brand design tokens — PORTABLE :root block.
   --------------------------------------------------------------------------
   2026-06-25 (Luke): the games + Learn surfaces render on /use.html, which
   does NOT load builder/base.css (that's builder-only). So var(--brand-blue)
   etc. were undefined there and the game/Learn UI drifted to a hardcoded cold
   palette. This file is the canonical token source for /use.html so those
   surfaces inherit the SAME brand as the builder.

   MIRROR of the :root block in builder/base.css — keep the two in sync. (The
   builder loads base.css; /use.html loads THIS. Single source of truth is a
   later cleanup; for now both carry identical values.) Consumers should still
   use var(--token, #fallback) so a missing stylesheet never renders unstyled.

   LABEL: PILOT-READY (pure tokens, no behavior).
   ========================================================================== */
:root {
  --bg:#FBF7F0;--bg-warm:#F5EDE0;--bg-cool:#F0EBE3;
  --ink:#1A1A2E;--ink-soft:#4A4A5A;--ink-muted:#8A8A9A;
  /* Tinky brand blue — the platform's primary CTA / focus color. */
  --brand-blue:#7C3AED;
  --brand-blue-dark:#5B21B6;
  --brand-blue-light:#DDD6FE;
  --brand-ink:#0C1530;
  --brand-bg-soft:#F3EEFF;
  /* Amber = warning / save-state / active accent (NOT the primary CTA). */
  --amber:#E8A838;--amber-light:#F5C563;--amber-dark:#C48A20;
  /* Soft amber-cream wash for selected/active states (games, tiles). */
  --amber-bg:#FFF8E1;
  --nav-bg:#1A1A2E;--nav-text:#F5EDE0;
  --surface:#FFFFFF;--surface-hover:#FAFAF5;--surface-active:#F5F0E8;
  --border:#E5DDD0;--border-light:#EDE8E0;
  --shadow-sm:0 1px 3px rgba(26,26,46,0.06);
  --shadow-md:0 4px 12px rgba(26,26,46,0.08);
  --shadow-lg:0 8px 30px rgba(26,26,46,0.12);
  --shadow-xl:0 16px 50px rgba(26,26,46,0.16);
  --radius-sm:8px;--radius-md:12px;--radius-lg:18px;--radius-xl:24px;
  /* Fitzgerald Key — AAC part-of-speech tile colors + soft backgrounds. */
  --fk-verb:#FF8C00;--fk-noun:#FFD700;--fk-adj:#4169E1;
  --fk-social:#FF69B4;--fk-question:#32CD32;--fk-misc:#FFFFFF;--fk-neg:#DC143C;
  --fk-verb-bg:#FFF3E0;--fk-noun-bg:#FFFDE7;--fk-adj-bg:#E3F2FD;
  --fk-social-bg:#FCE4EC;--fk-question-bg:#E8F5E9;--fk-misc-bg:#FAFAFA;--fk-neg-bg:#FFEBEE;
  --transition:0.2s cubic-bezier(0.4,0,0.2,1);
  --motion-slide:0.25s ease-out;
  --motion-fade:0.25s ease-out;
  --motion-enter:0.22s ease-out;
}