/* Sayne design tokens. One system, layered era skins. Source of truth for the brand guide (see BRAND-NOTES.md). */
:root{
  /* ---- core palette (Sayne) ---- */
  --s-ivory:#FBF6EE; --s-blush:#F7CFD4; --s-blush-soft:#FDE7EA; --s-rose:#DC93A0;
  --s-plum:#522545; --s-plum-2:#7A3D68; --s-plum-deep:#2E1028; --s-ink:#1A1921;
  --s-peach:#FCDDC7; --s-peach-soft:#FEEDE2; --s-apricot:#F8B48A; /* apricot = peach accent text on plum only. warm partner to blush. No yellow in the Sayne palette */
  --s-thread:var(--s-plum);               /* the Sayne thread: cursor, mark dot, focus ring */

  /* ---- type ---- */
  --f-display:Anton,Impact,sans-serif;     /* every era headline, uppercase */
  --f-serif:"Instrument Serif",Georgia,serif; /* wordmark, Today headlines, accents */
  --f-sans:Geist,system-ui,sans-serif;     /* body and UI */
  --f-mono:"Geist Mono",ui-monospace,monospace; /* kickers, labels, years in Today */
  --t-xs:12.5px; --t-sm:14px; --t-md:16px; --t-lg:clamp(18px,1.6vw,22px); --t-xl:clamp(22px,2vw,30px);
  --t-h2:clamp(58px,7.4vw,140px); --t-h1:clamp(64px,9vw,170px); --t-giant:clamp(72px,19vw,300px);
  --lh-tight:.9; --lh-body:1.5; --tr-kicker:.14em;

  /* ---- spacing (8 pt rhythm) and section rhythm ---- */
  --sp-1:4px; --sp-2:8px; --sp-3:12px; --sp-4:16px; --sp-5:24px; --sp-6:32px; --sp-7:48px; --sp-8:72px; --sp-9:112px;
  --sec-top:16vh; --sec-bot:14vh; --sec-top-band:9vh; --sec-bot-band:9vh; --blend:18vh;

  /* ---- radii ---- */
  --r-sm:6px; --r-md:14px; --r-lg:18px; --r-pill:999px;

  /* ---- motion ---- */
  --ease-punch:cubic-bezier(.32,.72,0,1); --ease-main:cubic-bezier(.625,.05,0,1); --ease-out:cubic-bezier(.22,1,.36,1);
  --d-fast:.2s; --d-base:.45s; --d-slow:.8s; --d-scene:1.2s;

  /* ---- era skin: 1996, the paper years ---- */
  --e96-desk:#0E6F6F; --e96-desk-deep:#0B3A3A; --e96-desk-2:#3C8F8F; --e96-bg:#E7DDC4; --e96-paper:#FFFDF3; --e96-cream:#F4ECD6;
  --e96-ink:#2A2520; --e96-ink-2:#5B5648; --e96-ink-3:#8B8576; --e96-manila:#CFC4A8; --e96-plastic:#D8CEB3;
  --e96-hi:#FFE45C; --e96-rule:#B8C7E8; --e96-pen:#2A3B8F; --e96-red:#D23B3B; --e96-carbon:#141C30; --e96-amber:#C9921C; --e96-brass:#8A6D12;
  --e96-lcd:#B9CC8A; --e96-window:#C0C0C0; --e96-title:#000080; --e96-phosphor:#C8D6C0; --e96-lcd-dark:#3A3D42;

  /* ---- era skin: 2003, the desktop years ---- */
  --e03-blue:#245BC9; --e03-blue-2:#3A7BE0; --e03-blue-deep:#0B3B9B; --e03-sky:#8DBBF0; --e03-sky-2:#C5D3EE;
  --e03-grass:#3F8D24; --e03-grass-deep:#2F7419; --e03-start:#2C7A2A; --e03-chrome:#ECE9D8; --e03-chrome-edge:#ACA899;
  --e03-win:#D4D0C8; --e03-gray:#808080; --e03-silver:#C0C0C0; --e03-navy:#000080; --e03-title:#0A5EDB;
  --e03-xls:#1E7B34; --e03-tip:#FFFFE1; --e03-white:#FFFFFF; --e03-ink:#1D1D1D; --e03-sun:#FFD23F; --e03-orange:#E9805F;

  /* ---- era skin: 2010, the app years ---- */
  --e10-blue:#3B5998; --e10-blue-2:#5B76B3; --e10-blue-deep:#1E2A55; --e10-mist:#EEF1F7; --e10-line:#DCE3EC; --e10-gloss:#D7E0F2;
  --e10-white:#FFFFFF; --e10-ink:#1C1E21; --e10-gray:#8A8F98; --e10-gray-2:#4B4F57; --e10-alu:#C3C7CE; --e10-black:#0A0A0C;
  --e10-badge:#E2241B; --e10-green:#3BAF5A; --e10-sky:#5A9BFF;

  /* ---- era blends (ombre midpoints between skins) ---- */
  --px-white:#FFFFFF; --px-black:#000000; /* pixel primitives, era skins only */
  --mix-hero-96:#7AA699; --mix-96-03:#849CC6; --mix-03-grass:#66A48A; --mix-grass-10:#356758; --mix-10-now:#9BA7C3;
}