/* tokens.css — the ONE place to adjust Collage brand. Change values here; every
   component reads them. Colors are the four official Collage brand colors plus a
   dark canvas + off-white reading color derived for the dark ("Blueprint Command")
   treatment. To flip the red/black balance or lighten the canvas, edit here only. */
:root {
  /* ---- Brand colors (verbatim from Collage Brand Standards Manual) ---- */
  --collage-red:   #da3836;   /* primary — energy / action / active states */
  --collage-black: #000000;   /* authority */
  --collage-gray:  #97a2a6;   /* neutral — secondary text, hairlines */
  --collage-gold:  #f7cb53;   /* accent — reserved for peak moments only */

  /* ---- Dark-canvas derived tones ---- */
  --canvas:     #0b0d0e;      /* near-black stage */
  --canvas-2:   #14181a;      /* raised surface (cards, fields) */
  --canvas-3:   #1c2225;      /* hover / active surface */
  --ink:        #e9edee;      /* off-white body text (readable on canvas) */
  --ink-dim:    #9aa5a8;      /* muted text */
  --line:       #262c2f;      /* hairline on dark */
  --red-bright: #ff4b47;      /* red nudged brighter for small-text legibility if needed */

  /* ---- Semantic roles ---- */
  --accent:      var(--collage-red);   /* exact brand red — large text, buttons, borders */
  --accent-text: #e5433f;              /* barely-brighter red for SMALL text — clears WCAG AA (4.8:1) on the dark canvas */
  --accent-2:    var(--collage-gold);
  --gold-text:   #f7cb53;              /* gold reads well on dark at any size (~12:1) */
  --error:       #ff6b5e;
  --ok:          #7fd1a3;

  /* ---- Policy tier colors (the Red/Yellow/Green classification from the AI Use Policy).
     Functional, not decorative — they mirror the policy's own traffic-light system. */
  --tier-green:  #5fce93;   /* GREEN  — any reasonable tool */
  --tier-amber:  #f7cb53;   /* YELLOW — company-approved tools only (brand gold) */
  --tier-red:    #ff5a54;   /* RED    — approved tools + check the contract */
  --tier-never:  #aab4b7;   /* NEVER  — hard stop (graphite, paired with red) */

  /* ---- Type ---- */
  --font: "Open Sans", system-ui, -apple-system, "Segoe UI", sans-serif;

  /* ---- Geometry ---- */
  --tile: 22px;               /* the logo's square module = base spacing unit */
  --radius: 4px;
  --maxw: 820px;
}