/* PROPOSED redesign token file — awaiting Steven's approval at Gate 3 (AGENTS.md section 9: new colors/fonts need his approval before use). Values taken from the Redesign Flow Map.

   Every color, font family, radius and shadow used by assets/site.css,
   assets/admin.css and the mockup pages' inline styles lives here. Those files
   reference these values only through var(--...). Load this file BEFORE
   site.css / admin.css on every page. Values are unchanged from the mockup as
   built (mechanical extraction, Oct 22, 2026) — nothing here is approved yet. */
@import url('https://fonts.googleapis.com/css2?family=Fredoka:wght@500;600&family=Nunito+Sans:opsz,wght@6..12,400;6..12,600;6..12,700;6..12,800&display=swap');
:root{
  /* core palette (from the original site.css :root) */
  --bg:#dfeef9; --panel:#ffffff; --panel-soft:#f2f8fd; --ink:#0f1a46; --muted:#4d6a8b;
  --line:#c7dcee; --brand:#0a68d8; --brand-dark:#0854ad; --accent-yellow:#f6c344;
  --teal:#18b89a; --coral:#e8492f; --gold:#b8860b;
  --white:#fff;
  --violet:#7a4fd6;                 /* My Studio gradient midpoint */

  /* fonts */
  --display:'Fredoka','Nunito Sans',system-ui,sans-serif; --body:'Nunito Sans',system-ui,sans-serif;
  --mono:ui-monospace,Menlo,Consolas,monospace;

  /* status / tier tints */
  --info-bg:#e6f1fb;   --info-ink:#185fa5;
  --warn-bg:#fff7e0;   --warn-ink:#8a6400;  --warn-line:#f0d58a; --warn-ink-strong:#5c4700;
  --ok-bg:#e7f6ef;     --ok-ink:#117a53;
  --err-bg:#fdeaea;    --err-ink:#a32d2d;
  --premium-bg:#e9e5fa;   --premium-ink:#5a43b5;
  --signature-bg:#fdf1dc; --signature-ink:#9a6b00;
  --pink-tint:#ffeefc;              /* share-to-earn gradient end */

  /* neutral tints */
  --dot-bg:#e4edf6;                 /* stepper dots */
  --thumb-bg:#e8f1fa;               /* placeholder thumbs */
  --art-from:#cfe6f8; --art-to:#b8d9f2;   /* .art-ph gradient */
  --chip-gray:#eef2f7;
  --tint-blue-1:#dce9f8; --tint-blue-2:#f3f8fe; --tint-blue-3:#f4f9fe;
  --soon-bg:#e7edf3; --soon-line:#d8e0e8; --soon-ink:#8b98a8;   /* "coming soon" cards */

  /* admin dark nav */
  --nav-accent:#8fc1ff; --nav-ink:#cfe0f4; --nav-muted:#8aa3c4;

  /* translucent */
  --brand-ring:rgba(10,104,216,.15); --brand-ring-soft:rgba(10,104,216,.18); --brand-a20:rgba(10,104,216,.2);
  --ink-a14:rgba(15,26,70,.14); --ink-a18:rgba(15,26,70,.18); --ink-a35:rgba(15,26,70,.35);
  --ink-a45:rgba(15,26,70,.45); --ink-a75:rgba(15,26,70,.75);
  --on-dark-08:rgba(255,255,255,.08); --on-dark-14:rgba(255,255,255,.14); --on-dark-16:rgba(255,255,255,.16);
  --white-75:rgba(255,255,255,.75);

  /* customer color-picker sample swatches (page 11 / 31) */
  --swatch-blue:#2563eb; --swatch-red:#ef4444; --swatch-yellow:#facc15; --swatch-black:#1b1b1b;
  --swatch-charcoal:#222;
  --swatch-rainbow:conic-gradient(red,orange,yellow,green,blue,purple,red);

  /* gradients */
  --cube:conic-gradient(from 45deg,var(--coral) 0 25%,var(--accent-yellow) 0 50%,var(--teal) 0 75%,var(--brand) 0 100%);

  /* logo heights (locked live-site logo, DEC-UI-06) */
  --logo-h:34px; --logo-h-sm:26px; --logo-h-xs:28px;

  /* Existing frozen order artwork slot heights (pages 72/75 and 168). */
  --order-detail-art-height:220px; --order-figurine-art-height:150px;
  /* Page18 frozen sidebar frame, independent of the supplied image aspect. */
  --order-selection-art-aspect:114 / 144;

  /* Page174 frozen 275x262 reference image at the existing 200px slot width. */
  --account-download-art-aspect:275 / 262;
  /* Frozen selected/shared concept slots on pages64/65; image bytes cannot resize them. */
  --sharing-concept-art-height:160px;

  /* radii */
  --radius:16px; --radius-lg:24px;
  --radius-4:4px; --radius-5:5px; --radius-6:6px; --radius-7:7px; --radius-8:8px; --radius-9:9px;
  --radius-10:10px; --radius-12:12px; --radius-14:14px; --radius-pill:99px; --radius-round:50%;

  /* shadows */
  --shadow:0 2px 10px rgba(15,26,70,.07);
  --shadow-ring-2:0 0 0 2px var(--brand-ring-soft);
  --shadow-ring-3:0 0 0 3px var(--brand-ring);
  --shadow-drawer:-6px 0 20px var(--ink-a18);
  --shadow-drawer-right:6px 0 20px var(--ink-a18);
}
