/* ============================================================
   BURNT THUMB WORKS — Brand Tokens (Parchment / Editorial)
   v06 2026-05-29: warm paper backgrounds, near-black ink text,
   fine dark borders, muted copper/umber/brass accents.
   Self-contained: no CDN, no @import, no external requests.
   Variable NAMES are unchanged so existing markup/CSS adapt.
   ============================================================ */

/* ---- FONTS — system fallbacks (no external requests). Drop licensed
   .woff2 into assets/fonts/ and uncomment @font-face to use brand type. ---- */

:root {
  /* ===== PARCHMENT / PAPER (backgrounds) ===== */
  --paper-page:   #F4EBD7;   /* page background — warm parchment */
  --paper-panel:  #ECE0C6;   /* alt sections, footer, insets */
  --paper-card:   #FAF3E2;   /* card / panel surface (lifts off page) */
  --paper-inset:  #E7D9BC;   /* icon wells, feature panels */
  --paper-50:  #FBF4E3;
  --paper-100: #F4EBD7;
  --parchment-100: #F1E6CD;

  /* ===== INK (text) ===== */
  --ink-strong: #211B12;     /* headings — near-black warm ink */
  --ink:        #2C2519;     /* body */
  --ink-soft:   #5C5039;     /* muted body / lede */
  --ink-faint:  #897B60;     /* meta / captions */

  /* ===== LINES (fine dark borders on paper) ===== */
  --line-subtle: #DCCBA6;
  --line:        #CBB890;
  --line-strong: #B19A6E;

  /* ===== COPPER / UMBER (primary accent — muted, brand burnt tone) ===== */
  --copper-700: #743514;
  --copper-600: #8A4220;
  --copper-500: #9C4D26;
  --copper-400: #B05E31;
  --copper-300: #BE6E3F;

  /* ===== BRASS / OCHRE (secondary, readable on paper) ===== */
  --brass-deep: #8A6A22;
  --brass-mid:  #A07F2E;
  --brass-300:  #8A6A22;   /* eyebrows + footer headings (darkened for paper) */
  --brass-600:  #7C5E1E;
  --brass-400:  #A07F2E;
  --brass-tint: #EFE3C4;   /* light brass wash (button/tag fill) */

  /* ===== legacy "ember-*" names kept, remapped to muted copper ===== */
  --ember-700: var(--copper-700);
  --ember-600: var(--copper-600);
  --ember-500: var(--copper-500);
  --ember-400: var(--copper-400);
  --ember-300: var(--copper-500);
  --ember-tint:#F0DEC8;

  /* ===== STATUS HUES (paired with icon + label; tuned for paper) ===== */
  --rust-500:  #A8392B;  --rust-tint:  #F1DAD3;
  --gold-500:  #9A7320;  --gold-tint:  #F0E4BE;
  --pine-500:  #3C6B45;  --pine-tint:  #DDE9DC;
  --slate-500: #3E6470;  --slate-tint: #DBE6EA;

  /* ===== SEMANTIC ROLES ===== */
  --bg-base:    var(--paper-page);
  --bg-shell:   var(--paper-panel);
  --surface-1:  var(--paper-inset);
  --surface-2:  var(--paper-card);
  --surface-3:  var(--paper-panel);

  --fg-1:        var(--ink);
  --fg-strong:   var(--ink-strong);
  --fg-2:        var(--ink-soft);
  --fg-3:        var(--ink-faint);
  --fg-disabled: #A99B7E;

  --border-subtle:  var(--line-subtle);
  --border-default: var(--line);
  --border-strong:  var(--line-strong);

  --accent:       var(--copper-500);
  --accent-hover: var(--copper-400);
  --accent-press: var(--copper-700);
  --accent-fg:    #FBF4E3;
  --secondary:    var(--brass-deep);
  --link:         var(--copper-600);
  --link-hover:   var(--copper-700);

  --success: var(--pine-500); --success-soft: var(--pine-tint);
  --warning: var(--gold-500); --warning-soft: var(--gold-tint);
  --danger:  var(--rust-500); --danger-soft:  var(--rust-tint);
  --info:    var(--slate-500);--info-soft:    var(--slate-tint);

  /* ===== TYPE FAMILIES (real brand fonts preferred, system fallbacks) ===== */
  --font-display: 'IM Fell English SC', 'Trajan Pro', 'Cochin', Georgia, 'Times New Roman', serif;
  --font-serif:   'Spectral', 'Iowan Old Style', 'Palatino Linotype', Palatino, Georgia, serif;
  --font-sans:    'Hanken Grotesk', system-ui, -apple-system, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
  --font-mono:    'JetBrains Mono', ui-monospace, 'SF Mono', 'Cascadia Code', Consolas, 'Liberation Mono', monospace;

  /* ===== TYPE SCALE ===== */
  --text-xs:12px; --text-sm:14px; --text-base:16px; --text-md:18px;
  --text-lg:20px; --text-xl:24px; --text-2xl:30px; --text-3xl:38px;
  --text-4xl:48px; --text-5xl:62px;

  --leading-tight:1.12; --leading-snug:1.3; --leading-normal:1.55; --leading-relaxed:1.7;
  --tracking-display:0.03em; --tracking-eyebrow:0.18em; --tracking-tight:-0.01em;
  --weight-regular:400; --weight-medium:500; --weight-semibold:600; --weight-bold:700;

  /* ===== SPACING (4px base) ===== */
  --space-1:4px; --space-2:8px; --space-3:12px; --space-4:16px; --space-5:20px;
  --space-6:24px; --space-8:32px; --space-10:40px; --space-12:48px;
  --space-16:64px; --space-20:80px; --space-24:96px;

  /* ===== RADIUS ===== */
  --radius-xs:2px; --radius-sm:4px; --radius-md:6px; --radius-lg:10px; --radius-xl:14px; --radius-pill:999px;

  /* ===== ELEVATION (soft, light theme) ===== */
  --shadow-sm:0 1px 2px rgba(50,38,18,.10);
  --shadow-md:0 3px 12px rgba(60,45,20,.10), 0 1px 0 rgba(255,255,255,.5) inset;
  --shadow-lg:0 16px 40px rgba(60,45,20,.16);
  --shadow-ember:0 5px 16px rgba(150,70,30,.16);

  /* ===== LAYOUT ===== */
  --maxw: 1120px;
  --maxw-prose: 680px;
}
