/* ============================================================
   TOKENS.CSS — DESIGN SYSTEM
   The ONLY file to edit for colour, type scale, spacing.
   Change a value here → it propagates across every view.
   ============================================================ */

:root {
  /* ---- Colour: drafting-paper & graphite, single pine accent ---- */
  --paper:        #F7F7F5;   /* cool drafting paper — base */
  --paper-2:      #EFEFEC;   /* recessed panels */
  --surface:      #FFFFFF;   /* raised cards */
  --ink:          #16181B;   /* graphite — primary text */
  --ink-2:        #3D434B;   /* secondary text */
  --ink-3:        #5D636C;   /* tertiary / captions — darkened for AA contrast on paper */
  --rule:         #DCDCD7;   /* hairlines */
  --rule-strong:  #C4C4BE;

  --accent:       #14503F;   /* deep pine — the single accent */
  --accent-soft:  #E7EFEB;
  --accent-line:  #B9CFC5;

  --tier-verified:#0F3D30;
  --tier-record:  #4B515A;
  --tier-active:  #6B4F1A;

  /* ---- Type ---- */
  --f-display: "Archivo", "Helvetica Neue", sans-serif;
  --f-body:    "Spectral", Georgia, serif;
  --f-mono:    "IBM Plex Mono", ui-monospace, monospace;

  --t-xs:   0.8125rem;  /* 13 — was 12, still the smallest text on the page (tags, mono labels) */
  --t-sm:   0.9375rem;  /* 15 */
  --t-base: 1rem;       /* 16 — body prose, dialed back from 17 */
  --t-md:   1.125rem;   /* 18 */
  --t-lg:   1.5rem;     /* 24 */
  --t-xl:   2rem;       /* 32 */
  --t-2xl:  2.625rem;   /* 42 */
  --t-3xl:  3.5rem;     /* 56 */
  --t-4xl:  clamp(2.75rem, 6.5vw, 5.25rem);

  /* ---- 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;  --s-10: 128px;

  /* ---- Structure ---- */
  --rail-w: 244px;
  --margin-w: 168px;
  --measure: 68ch;
  --radius: 3px;
  --radius-lg: 6px;

  --shadow-sm: 0 1px 2px rgba(26,29,33,.05);
  --shadow-md: 0 2px 8px rgba(26,29,33,.07), 0 1px 2px rgba(26,29,33,.04);
  --shadow-lg: 0 12px 40px rgba(26,29,33,.10), 0 2px 8px rgba(26,29,33,.05);

  --ease: cubic-bezier(.22,.68,.28,1);
  --dur: .38s;
}

/* ---- Dark theme ---- */
[data-theme="dark"] {
  --paper:        #14161A;
  --paper-2:      #1B1E23;
  --surface:      #1F2329;
  --ink:          #EDEDE8;
  --ink-2:        #B4BAC2;
  --ink-3:        #8A919B;
  --rule:         #2C3037;
  --rule-strong:  #3A3F47;

  --accent:       #6FBF9C;
  --accent-soft:  #17322A;
  --accent-line:  #2F5A4A;

  --tier-verified:#6FBF9C;
  --tier-record:  #8A9099;
  --tier-active:  #C9A55E;

  --shadow-sm: 0 1px 2px rgba(0,0,0,.3);
  --shadow-md: 0 2px 10px rgba(0,0,0,.36);
  --shadow-lg: 0 16px 48px rgba(0,0,0,.46);
}