/* The Ken colour master: the ONE place the shared colour names are defined for
   the public site and the family portal (website/ and website/portal/).
   Every page links this file; no page, stylesheet or script redefines a name
   held here. Held by tests/the-ken-has-one-token-table.mjs.

   Howard's five choices, 3 Oct 2026 ("All of your recommendations ... are
   fine"; mock-up: Big Brain Ltd/The Ken/Design/colour-master-choices-2026-10-03):
     1. Main text         soft black  #252322   (--ink, --text)
     2. Secondary text    darker grey #4A4440   (--mid, --ink-3)
     3. Softer text       #3F3933               (--ink-2)
     4. Dividing lines    22% gold    rgba(154,123,79,0.22)   (--line, --rule)
     5. Portal green buttons take the site green #3FB67E, hover #2AA06A
                          (--cta, --cta-hover)

   The code is the master; the Claude Design system is a mirror refreshed from
   this file. The Ken device (device/device.css) is its own surface family with
   its own table, and its high-contrast and colour-blind modes keep their own
   colours by design. Roles for gold are split by 29 Aug 2026: --gold is a
   fill, --gold-line a line or icon, --gold-deep gold text on a pale ground. */
:root {
  --cream: #F5F0E8;
  --warm-white: #FDFAF5;

  --ink: #252322;
  --text: #252322;
  --mid: #4A4440;
  --ink-3: #4A4440;
  --ink-2: #3F3933;

  --gold-line: #9A7B4F;            /* accent only: hairlines, borders, icons */
  --gold: #C4A962;                 /* the action-button gold: ink on it is 6.85:1 */
  --gold-light: #D9C48A;
  --gold-deep: #7A5F3A;
  --gold-pale: #E7D9B8;
  --gold-soft: rgba(154,123,79,0.08);

  --line: rgba(154,123,79,0.22);
  --rule: rgba(154,123,79,0.22);

  --cta: #3FB67E;                  /* primary CTA, lighter and greener than gold. The label on it is --warm-white: about 2.46:1, a recorded exception to 4.5:1 (U-161, Howard 3 Oct 2026, 1b) */
  --cta-hover: #2AA06A;            /* darker on press: the brand green */
  --green: #2AA06A;                /* state green (U-075), always with an icon or a word */
  --red: #D94A3D;
  --pine: #394C3E;
  --espresso: #4F453A;             /* text and border use only */
}
