/* ============================================================================
   DESIGN TOKENS — profound.af
   ----------------------------------------------------------------------------
   This is the file to edit for a reskin. Every colour, typeface, size and
   rhythm decision lives here; style.css only consumes these and handles layout.
   Retheming the whole site should not require opening style.css.

   Theme rules that must be preserved:
     :root                         complete LIGHT palette
     prefers-color-scheme: dark    dark palette, guarded so an explicit light
                                   choice still wins
     [data-theme="dark"|"light"]   explicit override in both directions
   Never define a colour ONLY inside a media query or [data-theme] block.
   ========================================================================== */

:root {
  /* ---- surfaces & ink (light) ---- */
  --bg:          #fbfaf8;
  --surface:     #ffffff;
  --surface-2:   #f2efe9;
  --ink:         #16150f;
  --ink-soft:    #55524a;
  --ink-faint:   #6e6c60;
  --rule:        #e2ded4;
  --rule-strong: #cfc9bb;

  /* ---- accent ---- */
  --accent:       #8a2f1d;
  --accent-hover: #a83a24;
  --accent-soft:  #f3e7e2;
  --accent-ink:   #ffffff;

  /* ---- selection & marks ---- */
  --mark-bg: #fbe9a7;
  --mark-ink: #16150f;

  /* ---- type ---- */
  --serif: "Iowan Old Style", "Palatino Linotype", Palatino, Charter, Georgia,
           "Times New Roman", serif;
  --sans:  ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", Inter,
           Roboto, Helvetica, Arial, sans-serif;
  --mono:  ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;

  --font-body: var(--serif);
  --font-ui:   var(--sans);
  --font-display: var(--serif);

  /* ---- scale ---- */
  --text-base: 1.125rem;
  --text-sm:   0.9rem;
  --text-xs:   0.8rem;
  --leading:   1.7;
  --leading-tight: 1.2;

  --h1: clamp(2rem, 5.5vw, 3rem);
  --h2: 1.65rem;
  --h3: 1.7rem;
  --h4: 1.05rem;

  /* ---- measure & rhythm ---- */
  --measure:      40rem;   /* article text column */
  --measure-wide: 48rem;   /* chrome, lists, page furniture */
  --bleed:        3rem;    /* how far figures break out on wide screens */
  --space:        1.4rem;  /* paragraph rhythm */
  --gutter:       1.5rem;

  /* ---- shape & motion ---- */
  --radius: 3px;
  --radius-lg: 6px;
  --border: 1px solid var(--rule);
  --shadow: 0 1px 2px rgba(0,0,0,.04), 0 8px 24px rgba(0,0,0,.06);
  --ease: cubic-bezier(.2,.6,.3,1);
  --dur: 160ms;
}

@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --bg:          #12120f;
    --surface:     #191814;
    --surface-2:   #21201a;
    --ink:         #ece8de;
    --ink-soft:    #a7a196;
    --ink-faint:   #898979;
    --rule:        #2e2c26;
    --rule-strong: #423f36;

    --accent:       #e08a6f;
    --accent-hover: #f0a189;
    --accent-soft:  #2a201c;
    --accent-ink:   #17110e;

    --mark-bg: #6b5a1f;
    --mark-ink: #f7f2e2;

    --shadow: 0 1px 2px rgba(0,0,0,.4), 0 8px 24px rgba(0,0,0,.45);
  }
}

:root[data-theme="dark"] {
  --bg:          #12120f;
  --surface:     #191814;
  --surface-2:   #21201a;
  --ink:         #ece8de;
  --ink-soft:    #a7a196;
  --ink-faint:   #898979;
  --rule:        #2e2c26;
  --rule-strong: #423f36;

  --accent:       #e08a6f;
  --accent-hover: #f0a189;
  --accent-soft:  #2a201c;
  --accent-ink:   #17110e;

  --mark-bg: #6b5a1f;
  --mark-ink: #f7f2e2;

  --shadow: 0 1px 2px rgba(0,0,0,.4), 0 8px 24px rgba(0,0,0,.45);
}