/* E. Warm Paper | tokens. Aged-yellow paper, warm serif headlines, hyperlegible sans body. Calm, not a newspaper. */
@font-face{font-family:'Young Serif';font-style:normal;font-weight:400;font-display:swap;src:url(/assets/fonts/young-serif-400.woff2) format('woff2')}
/* note: file names from the earlier download are shuffled; mapping below is verified by rendering */
@font-face{font-family:'Atkinson Hyperlegible';font-style:normal;font-weight:400;font-display:swap;src:url(/assets/fonts/atkinson-hyperlegible-700.woff2) format('woff2')}
@font-face{font-family:'Atkinson Hyperlegible';font-style:italic;font-weight:400;font-display:swap;src:url(/assets/fonts/atkinson-hyperlegible-400.woff2) format('woff2')}
@font-face{font-family:'Atkinson Hyperlegible';font-style:normal;font-weight:700;font-display:swap;src:url(/assets/fonts/atkinson-hyperlegible-400-italic.woff2) format('woff2')}
@font-face{font-family:'IBM Plex Mono';font-style:normal;font-weight:400;font-display:swap;src:url(/assets/fonts/ibm-plex-mono-400.woff2) format('woff2')}

:root{
  /* brand */
  --yellow:#FFD400; --orange:#FF8C1A; --black:#0B0B0B;
  /* paper scale: aged yellow, sun through a window, never grey */
  --paper-0:#FDF8E7; --paper-1:#F9F0D2; --paper-2:#F4E7BC; --paper-3:#EEDCA3; --paper-4:#E2CC86;
  /* yellow + orange accents */
  --y-300:#FFE566; --y-500:#FFD400; --y-700:#8F6F00; --y-900:#3A2E00;
  --o-500:#FF8C1A; --o-700:#A8480A; --o-800:#7A3606;
  /* warm ink scale */
  --ink-0:#1A1710; --ink-1:#2E2A1F; --ink-2:#4A4534; --ink-3:#6B6550; --ink-4:#8F8870;
  /* one cool counterpoint for the phone thread */
  --sky:#1C6DB5;
  /* the bird's two stages. never yellow behind the bird, never outlined */
  --cream:#FDF8E7; --stage-blue:#9CC6E6;

  /* semantic */
  --bg:var(--paper-1);
  --bg-deep:var(--paper-2);
  --bg-light:var(--paper-0);
  --bg-ink:#2E2014;
  --surface:var(--paper-0);
  --ink:var(--ink-0);
  --ink-soft:var(--ink-2);
  --ink-muted:var(--ink-3);
  --rule:rgba(26,23,16,.16);
  --rule-soft:rgba(26,23,16,.09);
  --accent:var(--y-500);
  --accent-ink:var(--ink-0);
  --time:var(--o-700);
  --focus:var(--ink-0);
  --on-ink:#FDF8E7;
  --on-ink-muted:rgba(253,248,231,.72);

  /* type */
  --font-display:'Young Serif',Georgia,'Iowan Old Style','Times New Roman',serif;
  --font-body:'Atkinson Hyperlegible',system-ui,-apple-system,'Helvetica Neue',Arial,sans-serif;
  --font-mono:'IBM Plex Mono',Menlo,Consolas,monospace;
  --fs-hero:clamp(2.5rem,1.7rem + 3.2vw,4.75rem);
  --fs-h2:clamp(2rem,1.5rem + 1.8vw,3.125rem);
  --fs-h3:clamp(1.375rem,1.2rem + .5vw,1.625rem);
  --fs-lead:clamp(1.1875rem,1.1rem + .35vw,1.375rem);
  --fs-body:1.125rem;
  --fs-small:1rem;
  --fs-caption:.875rem;
  --lh-tight:1.06; --lh-heading:1.12; --lh-body:1.7; --lh-loose:1.8;
  --tr-display:-.015em;

  /* 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;
  --section:clamp(72px,9vw,128px);
  --wrap:1120px; --gutter:clamp(20px,5vw,72px);

  /* radii: soft, bookish */
  --r-1:4px; --r-2:10px; --r-3:18px; --r-4:28px; --r-pill:999px;

  /* shadow: paper on paper */
  --shadow-1:0 1px 0 rgba(26,23,16,.06),0 6px 18px rgba(90,70,20,.10);
  --shadow-2:0 12px 32px rgba(90,70,20,.16);
  --shadow-phone:0 32px 60px rgba(60,45,10,.35),0 4px 12px rgba(60,45,10,.2);

  /* motion */
  --t-fast:160ms; --t-base:260ms; --ease:cubic-bezier(.2,.8,.2,1);
}

/* dark: ink paper, kept for a future toggle */
@media (prefers-color-scheme:dark){
  :root[data-theme="auto"]{
    --bg:#1C1913; --bg-deep:#231F17; --bg-light:#26221A; --surface:#26221A;
    --ink:var(--paper-0); --ink-soft:#E6DDBE; --ink-muted:#CFC6A6;
    --rule:rgba(253,248,231,.18); --rule-soft:rgba(253,248,231,.1);
    --time:#FFB067; --focus:var(--y-500);
  }
}
