/* Fieldwake theme — the creator's visual-identity brief, as tokens.
   Motion comes from the shared layer; this file only supplies the dialect:
   paper, ink, the five regional accents, the four emotional-state page
   treatments, and slower durations ("quiet, not noise"). */
@import "../shared/motion.css";
@import url("https://fonts.googleapis.com/css2?family=EB+Garamond:ital,wght@0,400;0,500;0,600;1,400&family=Cormorant+Garamond:wght@500;600&family=IM+Fell+English:ital@0;1&family=Alegreya+Sans:wght@400;500;700&display=swap");

:root {
  /* paper (never pure white) and iron-gall ink (never pure black) */
  --paper: #EDE4D1; --paper-light: #F3ECDC; --paper-aged: #DFD2B6;
  --ink: #3A2E22; --ink-soft: #5A4632;
  /* master mineral accents */
  --azurite: #3E5A6E; --azurite-muted: #5E7C8A;
  --copper: #5E6E45; --copper-corroded: #7A855A;
  --ochre-red: #9B4A2F; --ochre-red-faded: #B56954;   /* reserved: index marks */
  --ochre: #C8992E; --ochre-pale: #D9B860;

  /* the current region's accent — every interaction blots in this colour */
  --accent: var(--azurite); --accent-soft: var(--azurite-muted);
  --motion-flash: color-mix(in srgb, var(--accent) 45%, transparent);

  /* type roles */
  --font-body: "EB Garamond", Georgia, serif;
  --font-display: "Cormorant Garamond", "EB Garamond", serif;   /* 18pt and up only */
  --font-hand: "IM Fell English", "EB Garamond", serif;          /* in-world captions, marginalia */
  --font-ui: "Alegreya Sans", system-ui, sans-serif;             /* tables, stat lines */

  /* quiet: the whole system slows, the vocabulary stays the same */
  --motion-quick: 0.32s; --motion-normal: 0.5s; --motion-arrive: 0.7s;
  --motion-heavy: 0.95s; --motion-slow: 1.25s; --motion-breath: 4.2s;
  --motion-stagger-step: 0.08s;
}

/* five regional sub-identities (brief §3): one palette, five accents */
[data-region="netherward"] { --accent: #6E8088; --accent-soft: #93A6AA; }
[data-region="scar"]       { --accent: #9B4A2F; --accent-soft: #C8992E; }
[data-region="reach"]      { --accent: #5E6E45; --accent-soft: #7A855A; }
[data-region="seamlands"]  { --accent: #3E5A6E; --accent-soft: #5E7C8A; }
[data-region="mirror"]     { --accent: #7E7684; --accent-soft: #A59DAA; }

body {
  margin: 0; color: var(--ink); background: var(--paper);
  font: 18px/1.5 var(--font-body);
  font-variant-numeric: oldstyle-nums;
  transition: filter var(--motion-slow) ease, background-color var(--motion-slow) ease;
}
h1, h2, .display { font-family: var(--font-display); font-weight: 600; line-height: 1.05; }
.hand { font-family: var(--font-hand); font-style: italic; color: var(--ink-soft); }
.ui   { font-family: var(--font-ui); }

/* emotional state as page state (plan §4) */
[data-state="steady"]     { --wash: 0; }
[data-state="heightened"] { --wash: 0.14; }
[data-state="volatile"]   { --wash: 0.22; }
[data-state="depleted"]   { --wash: 0; }
body[data-state] {
  background:
    radial-gradient(120% 90% at 50% 0%, color-mix(in srgb, var(--accent) calc(var(--wash) * 100%), transparent), transparent 70%),
    var(--paper);
}
body[data-state="depleted"] { filter: saturate(0.35) brightness(1.02); }
/* at Volatile the hidden numbers are cipher, not a label: "you fly with no instruments" */
.cipher { font-family: var(--font-hand); letter-spacing: 0.04em; color: var(--ink-soft); }

/* buttons are ink on paper; the click blots in the region accent */
.btn {
  position: relative; overflow: hidden; cursor: pointer;
  font: 500 15px/1 var(--font-ui); letter-spacing: 0.02em;
  color: var(--ink); background: var(--paper-light);
  border: 1px solid var(--ink-soft); border-radius: 3px; padding: 10px 16px; white-space: nowrap;
}
.btn:hover { border-color: var(--accent); }
.btn .tri-bleed { position: absolute; inset: 0; background: var(--accent); }
.btn.ghost { background: transparent; border-style: dashed; }