/* elsewards — design tokens
   Every colour, size, radius and timing used by the product lives here.
   Components never hard-code these values. */

:root{
  color-scheme:light;

  /* Surfaces */
  --paper:#f5f2eb;          /* page */
  --paper-2:#ebe6dc;        /* quiet fill */
  --paper-3:#ded7ca;        /* track, disabled */
  --cream:#fbf9f4;          /* raised surface */
  --line:#d8d1c5;
  --line-strong:#bdb4a5;

  /* Text */
  --ink:#1c1d19;
  --ink-2:#34352f;
  --muted:#66655c;          /* 5.2:1 on paper */

  /* Accents — each one has a job */
  --accent:#a8533b;         /* terracotta: corrections, emphasis, links */
  --accent-soft:#efe1d9;
  --moss:#30473c;           /* hosting, minutes, go-live */
  --moss-soft:#dce5df;
  --on-moss:#ffffff;
  --sky:#4f7190;            /* scheduled, calm info */
  --sky-soft:#e4edf1;
  --sun:#8a6526;            /* soon, demand */
  --sun-soft:#f2e7cf;
  --live:#3f8a62;
  --live-bright:#7fd0a3;    /* dots on photography */
  --danger:#b0412e;
  --danger-soft:#f6e4de;

  /* Actions */
  --action:var(--ink);
  --action-hover:var(--ink-2);
  --on-action:var(--paper);

  /* Type */
  --font:"Manrope",ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif;
  --serif:"Cormorant Garamond",Georgia,"Times New Roman",serif;
  --t-xs:12px;
  --t-sm:13.5px;
  --t-md:15px;
  --t-lg:19px;
  --t-xl:26px;
  --t-2xl:clamp(34px,3.6vw,52px);
  --t-3xl:clamp(52px,5vw,84px);

  /* Space (4pt) */
  --s-1:4px;--s-2:8px;--s-3:12px;--s-4:16px;--s-5:20px;
  --s-6:24px;--s-7:32px;--s-8:40px;--s-9:56px;--s-10:80px;
  --gutter:clamp(16px,4vw,64px);

  /* Shape */
  --r-sm:6px;
  --r-lg:12px;
  --r-pill:999px;

  /* Depth */
  --shadow-1:0 16px 44px rgba(34,31,26,.05);
  --shadow-2:0 40px 120px rgba(0,0,0,.28);

  /* Motion */
  --ease:cubic-bezier(.2,.7,.2,1);
  --dur:180ms;

  --topbar:72px;
}

:root[data-theme="dark"]{
  color-scheme:dark;
  --paper:#151611;
  --paper-2:#1f211b;
  --paper-3:#2c2e26;
  --cream:#1b1c17;
  --line:#33352c;
  --line-strong:#4a4c41;
  --ink:#f1eee4;
  --ink-2:#dcd8cc;
  --muted:#a9a69a;
  --accent:#dd7a58;
  --accent-soft:#35251f;
  --moss:#9eb8a6;
  --moss-soft:#243129;
  --on-moss:#10160f;
  --sky:#9ab6c9;
  --sky-soft:#222d35;
  --sun:#d4b06c;
  --sun-soft:#312a1d;
  --live:#86c9a2;
  --danger:#e98a74;
  --danger-soft:#3a2420;
  --shadow-1:0 16px 44px rgba(0,0,0,.25);
  --shadow-2:0 40px 120px rgba(0,0,0,.6);
}