/* Property XI: the brand layer.
   EXTRACTED VERBATIM from Site/index.html by Media/99-Source-Scripts/extract-theme.py.
   Do not edit here and do not edit there without re-running it.

   This file is deliberately standalone. The application shell is disposable;
   these tokens are not. When the platform is ported to a framework, this file
   is imported unchanged, so the contrast ratios documented in the comments
   below are never re-derived by hand. Re-deriving them is how a theme drifts.

   :root IS the dark theme. There is no [data-theme="dark"] block; dark is the
   default and light overrides it. verify.sh asserts token parity between the
   two and the contrast floors of both. */

:root {
  color-scheme: dark;

  --ink:        #06080c;
  --ink-1:      #0a0d13;
  --ink-2:      #0f1219;
  --ink-3:      #161a23;
  --ink-4:      #1d222d;

  --bone:       #f4f1ea;
  --bone-2:     #e8e3d5;
  --bone-dim:   rgba(244, 241, 234, 0.62);
  /* was 0.42 -> composited #6a6a69 -> 3.70:1 on --ink, and it carries 9-12px
     micro-labels in nine places. That failed AA the whole time the page has
     been live. 0.58 composites to #8e8d8b -> 6.19:1. Do not lower it. */
  --bone-soft:  rgba(244, 241, 234, 0.58);
  --bone-faint: rgba(244, 241, 234, 0.22);

  --gold:       #c9a961;
  --gold-bright:#d4b876;
  --gold-deep:  #a88a45;
  --gold-dim:   rgba(201, 169, 97, 0.20);
  --gold-line:  rgba(201, 169, 97, 0.34);
  --gold-wash:  rgba(201, 169, 97, 0.06);
  --gold-pale:  #e8d48b;

  /* Chrome surfaces. These were raw rgba(6,8,12,...) in the rules below, so
     they stayed dark on a white page - the nav bar was the visible tell. */
  --nav-bg:        rgba(6, 8, 12, 0.55);
  --nav-bg-shrunk: rgba(6, 8, 12, 0.82);
  --hero-vignette: var(--hero-vignette);

  --op-green:   #7a9670;
  --op-green-dim: rgba(122, 150, 112, 0.65);

  --rule:        rgba(244, 241, 234, 0.07);
  --rule-strong: rgba(244, 241, 234, 0.14);

  /* Text that sits ON a gold or tier fill. It must NOT follow --ink: in
     light mode --ink becomes white, and every gold button would invert to
     white-on-gold at 2.25:1. Fixed in both themes, on purpose. */
  --on-accent:  #06080c;
  /* Component boundaries, WCAG SC 1.4.11 (3:1). --rule-strong is 1.37:1
     and was being used for the form border. */
  --edge:       rgba(244, 241, 234, 0.45);
  /* The focus ring. Gold is 2.25:1 on white, so it cannot be shared. */
  --focus:      #c9a961;
  /* Functional, screen-only. Not an identity colour. See COLOUR-SPEC. */
  --alert:      #dc7878;
  --alert-wash: var(--alert-wash);
  --alert-line: var(--alert-line);

  --tier-p0: #c9a961;
  --tier-p1: #a8b89f;
  --tier-p2: #8896a8;
  /* was #6b7280 -> Bone on it = 4.29:1 at 10px, failed AA. */
  --tier-p3: #585d65;

  --font-display: 'Fraunces', 'Times New Roman', Georgia, serif;
  --font-body:    'Instrument Sans', -apple-system, BlinkMacSystemFont, system-ui, sans-serif;
  --font-mono:    'JetBrains Mono', ui-monospace, 'SF Mono', Consolas, monospace;

  --container-max: 1440px;
  --gutter:        clamp(20px, 4vw, 56px);
  --section-y:     clamp(96px, 11vw, 168px);
  --section-y-tight: clamp(64px, 7vw, 96px);

  --ease:        cubic-bezier(0.22, 1, 0.36, 1);
  --ease-out:    cubic-bezier(0.16, 1, 0.3, 1);
  --ease-in-out: cubic-bezier(0.65, 0, 0.35, 1);

  --nav-h:       72px;
  --nav-h-shrunk: 56px;
}

[data-theme="light"] {
  color-scheme: light;

  --ink:        #ffffff;   /* Pure White - the ground */
  --ink-1:      #fbfaf6;   /* Ink on it 19.19:1 */
  --ink-2:      #f4f1ea;   /* Bone White      17.77:1 */
  --ink-3:      #ece8dc;   /*                 16.36:1 */
  --ink-4:      #e8e3d5;   /* Bone-2          15.63:1 */

  --bone:       #06080c;   /* Ink Black - 20.04:1 on white, 15.63:1 worst */
  --bone-2:     #1d222d;   /* Graphite  - 15.92:1 on white, 12.42:1 worst */
  --bone-dim:   rgba(6, 8, 12, 0.74);  /* -> #47484b  9.14:1 / 7.97:1 worst */
  --bone-soft:  rgba(6, 8, 12, 0.60);  /* -> #6a6b6d  5.33:1 / 4.93:1 worst */
  --bone-faint: rgba(6, 8, 12, 0.25);  /* non-text only - never set type in this */

  --gold:       #c9a961;   /* light mode: only ever a fill or a mark, never type */
  --gold-bright:#d4b876;
  --gold-deep:  #a88a45;
  --gold-dim:   rgba(168, 138, 69, 0.35);  /* dL* 14.2, matched to dark */
  --gold-line:  rgba(168, 138, 69, 0.61);  /* dL* 24.7 */
  --gold-wash:  rgba(168, 138, 69, 0.08);  /* dL*  3.4 */
  --gold-pale:  #a88a45;   /* #e8d48b on white is 1.5:1 - invisible */

  /* Slightly more opaque than the dark values: a translucent white bar over
     a white page needs more body to read as a bar at all. */
  --nav-bg:        rgba(255, 255, 255, 0.72);
  --nav-bg-shrunk: rgba(255, 255, 255, 0.90);
  --hero-vignette: rgba(255, 255, 255, 0.75);

  --op-green:   #4f6a46;   /* #7a9670 is 3.27:1 on white - fails AA body */
  --op-green-dim: rgba(79, 106, 70, 0.55);

  --rule:        rgba(6, 8, 12, 0.07);  /* dL* 6.2, matched to dark's 6.1 */
  --rule-strong: rgba(6, 8, 12, 0.16);  /* dL* 14.3, matched to dark's 14.3 */

  --on-accent:  #06080c;   /* MUST match :root. Gold fills invert without this. */
  --edge:       rgba(6, 8, 12, 0.43);  /* -> #949597, 3.00:1 exactly */
  --focus:      #06080c;   /* gold focus ring is 2.25:1 on white - fails 1.4.11 */
  --alert:      #a63f3f;
  --alert-wash: rgba(166, 63, 63, 0.06);
  --alert-line: rgba(166, 63, 63, 0.45);

  --tier-p0: #c9a961;
  --tier-p1: #8a9c80;
  --tier-p2: #6b7c8e;
  --tier-p3: #585d65;
}