/* Design tokens shared by the reader and the studio. The reader overrides
   --gold / --gold-deep per guide (branding); everything else is the product.
   Palette, type and marks: docs/brand/DESIGN.md. */
:root {
  /* Brand — docs/brand/2026-10-27-brand-board.webp */
  --brand-ink:     #171A1C;
  --brand-oxblood: #7B2E2E;
  --brand-sand:    #C9B6A3;
  --brand-stone:   #E4DDD3;
  --brand-ivory:   #F7F4ED;
  --brand-accent:  var(--brand-oxblood); /* the chrome's accent; a guide's accent never replaces it */

  /* Ink. The --navy names stay for older rules; they are ink now. */
  --ink:         var(--brand-ink);
  --ink-soft:    #45484B;
  --ink-muted:   #686B6E;
  --navy:        var(--brand-ink);
  --navy-deep:   #0E1012;
  --navy-soft:   var(--ink-soft);

  /* Paper */
  --paper:       var(--brand-ivory);
  --paper-tint:  #F0EBE2;
  --paper-deep:  var(--brand-stone);
  --paper-card:  #FCFAF6;
  --line:        var(--brand-sand);
  --line-soft:   var(--brand-stone);
  --line-strong: #A89480;

  /* The trip's accent slot. Defaults to the house oxblood; the reader sets --gold and
     --gold-deep per guide (lib/accents.js) and the two tints follow whatever it set. */
  --gold:        var(--brand-oxblood);
  --gold-deep:   var(--brand-oxblood);
  --gold-light:  color-mix(in oklch, var(--gold), white 18%);
  --gold-soft:   color-mix(in oklch, var(--gold), var(--paper) 60%);

  --warm-gray:   oklch(54% 0.012 70);  /* "A confirmar" — tracked, not alarming */
  --green:       oklch(45% 0.08 155);
  --green-deep:  oklch(32% 0.06 155);
  --red:         oklch(48% 0.13 27);
  --red-soft:    oklch(60% 0.10 27);

  /* 4pt scale */
  --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;

  /* Type. Fraunces carries the serif at every size (its optical size axis picks the
     text or display cut); --display pins the wordmark's cut for titles. Inter for UI. */
  --serif:   'Fraunces', 'Iowan Old Style', Georgia, serif;
  --display: 'Fraunces', Georgia, serif;
  --display-settings: 'opsz' 144, 'SOFT' 0, 'WONK' 1;
  --sans:    'Inter', -apple-system, BlinkMacSystemFont, 'Helvetica Neue', 'Segoe UI', system-ui, sans-serif;

  --text-display: clamp(2.25rem, 7vw, 3rem); /* wordmark-sized titles, 1.05 */
  --text-h1:   2rem;      /* 1.15 */
  --text-h2:   1.5rem;    /* 1.2 */
  --text-h3:   1.25rem;   /* 1.25 */
  --text-body: 1.0625rem; /* 1.55; the reader reads at 1.125rem+ */
  --text-meta: 0.75rem;   /* Inter 600, uppercase, tracking 0.12em */

  --shadow-sm: 0 1px 3px rgb(23 26 28 / 0.07);
  --shadow-md: 0 4px 18px rgb(23 26 28 / 0.10), 0 1px 3px rgb(23 26 28 / 0.05);
  --shadow-lg: 0 14px 38px rgb(23 26 28 / 0.13), 0 2px 6px rgb(23 26 28 / 0.06);

  --radius-sm: 6px;
  --radius:    10px;
  --radius-lg: 16px;

  --tap: 48px; /* minimum touch target */

  /* Slow, gentle transitions */
  --ease: cubic-bezier(0.2, 0.8, 0.2, 1);
  --t: 350ms var(--ease);
}