/* ROA Credit — design tokens
   Source: AESTHETIC-THESIS.md §3 (measured, not chosen). Every ratio computed.
   DO NOT add a colour, a gradient, or a third text colour. */

:root {
  color-scheme: light;

  /* surfaces */
  --surface:          #FCFBF7;
  --surface-raised:   #F4F1E8;
  --surface-sunken:   #EDE9DC;

  /* borders — NOT interchangeable */
  --border:           #A89E88;  /* decorative only — 2.56:1 */
  --border-strong:    #7A7163;  /* inputs/controls  — 4.64:1 */

  /* text — there is no third text colour, by design */
  --ink:              #1C1917;  /* 16.89:1 */
  --ink-muted:        #4A443E;  /*  9.27:1 */
  --disabled-ink:     #7D776D;  /*  4.29:1 — disabled controls ONLY */

  /* brand + action */
  --primary:          #0B4A50;
  --primary-hover:    #08424A;
  --primary-active:   #06383F;
  --on-primary:       #FFFFFF;  /* 9.95:1 on --primary */

  /* states — always paired with an icon AND a word. Colour is redundant. */
  --green:            #1F5130;  --green-tint:   #E4EFE6;
  --warning:          #733C05;  --warning-tint: #F6EAD8;
  --danger:           #961710;  --danger-tint:  #F7E4E2;
  --info:             #15406E;  --info-tint:    #E3EAF2;

  /* LOGO MARK ONLY. Never text, fill, border, icon, or gradient. */
  --brand-gold:       #C59136;  /* 2.71:1 — information-bearing use is a BUG */

  --elevation: 0 1px 2px rgba(28,25,23,.06), 0 2px 8px rgba(28,25,23,.04);

  /* ── TYPE ──────────────────────────────────────────────────────────
     Floors are COMPUTED (design-psych-typo-layout.md §2), not chosen:
     viewing distance 32.2cm × ~0.19mm physical CSS px on mid-range
     Android × the 0.2°–2° fluent-reading range. 16px falls BELOW the
     fluent floor for this reader. Do not shrink these. */
  --font-display: "Bitter", Georgia, serif;
  --font-ui:      "Atkinson Hyperlegible Next", system-ui, -apple-system, sans-serif;

  --t-body:     20px;   /* absolute floor for any prose */
  --t-decision: 22px;   /* text someone decides on */
  --t-question: 24px;   /* form questions */
  --t-small:    18px;   /* the smallest permitted size, anywhere */
  --t-h3:       26px;
  --t-h2:       32px;
  --t-h1:       40px;

  --lh-tight: 1.25;
  --lh-body:  1.6;
  --measure:  43ch;     /* measured cap — not 50–55 */

  /* ── SPACE ───────────────────────────────────────────────────────── */
  --s-1: 4px;  --s-2: 8px;   --s-3: 12px; --s-4: 16px;
  --s-5: 24px; --s-6: 32px;  --s-7: 48px; --s-8: 64px; --s-9: 96px;

  --tap: 48px;          /* Fitts — minimum thumb target, never smaller */
  --radius: 6px;
  --container: 680px;

  /* ── MOTION — austerity is the point ──────────────────────────────
     High arousal decreases attention to deception indicators
     (Langenderfer & Shimp 2001). Our job is arousal REDUCTION. */
  --ease: cubic-bezier(.2,.0,.2,1);
  --dur:  180ms;        /* Doherty <400ms; nothing here needs more */
}

@media (min-width: 720px) {
  :root { --t-h1: 52px; --t-h2: 38px; }
}

@media (prefers-reduced-motion: reduce) {
  :root { --dur: 0ms; }
  *, *::before, *::after {
    animation-duration: .01ms !important;
    transition-duration: .01ms !important;
    scroll-behavior: auto !important;
  }
}

/* Dual-tone focus ring — no single colour passes 3:1 against BOTH
   the cream canvas and the teal button. Verified on all five surfaces. */
*:focus-visible {
  outline: 2px solid #1C1917;
  outline-offset: 0;
  box-shadow: 0 0 0 4px #FCFBF7;
}