/* Wingwall design tokens. Core values are defined in oklch; hex values are their sRGB equivalents.
   Default theme: dark content surfaces with light chrome (banner, header, footer).
   Product (app/dashboard) themes and data colors are at the end. */
@font-face{font-family:"Geist Pixel";src:url(fonts/GeistPixel-Square.woff2) format("woff2");font-display:swap}
@font-face{font-family:"Geist";src:url(fonts/Geist-Variable.woff2) format("woff2");font-weight:100 900;font-display:swap}
:root{
  /* Page (dark) */
  --paper:#0b0c0e;          /* oklch(0.155 0.004 260)  page background */
  --paper-2:#151618;        /* oklch(0.2 0.004 260)    panels, inputs, ask box */
  --line:#2d2e30;           /* oklch(0.3 0.004 260)    borders/dividers on dark */
  --text:#eeeef0;           /* oklch(0.95 0.002 260)   primary text on dark */
  --muted:#a9abad;          /* oklch(0.74 0.004 260)   secondary text on dark */
  /* Chrome (light: banner, header, footer) */
  --light:#f6f7f8;          /* oklch(0.975 0.002 260)  header + footer bg */
  --light-2:#e7e8ea;        /* oklch(0.93 0.003 260)   banner bg, hover fills; theme-color ~#e9eaec */
  --on-light:#111213;       /* oklch(0.18 0.004 260)   text on light, dark buttons */
  --on-light-muted:#4b4d50; /* oklch(0.42 0.005 260)   nav links, footer links */
  --line-light:#d0d1d3;     /* oklch(0.86 0.003 260)   borders on light */
  /* Ink (base layer, still referenced) */
  --ink:#0c0d0f; --ink-2:#17181a; --line-ink:#2d2e30; --muted-ink:#a3a5a7;
  /* States */
  --error:#b3261e;          /* newsletter error text/border */
  --btn-dark-hover:#2a2b2d; /* oklch(0.3 0.004 260) hover on dark pill buttons (approx) */
  /* Type */
  --pixel:"Geist Pixel",ui-monospace,monospace;  /* headings, labels, buttons, nav, links-as-UI */
  --sans:"Geist",system-ui,-apple-system,"Segoe UI",sans-serif; /* body, card titles, forms */
  --t-xs:.8125rem;   /* 13px */
  --t-sm:.9375rem;   /* 15px */
  --t-base:1.0625rem;/* 17px */
  --t-lg:1.25rem;    /* 20px */
  --t-xl:clamp(1.5rem,1.2rem + 1vw,2rem);   /* 24-32px section h2 */
  --t-2xl:clamp(2.4rem,1.6rem + 3vw,4rem);  /* 38-64px hero h1 */
  /* Spacing */
  --s-1:4px;--s-2:8px;--s-3:12px;--s-4:16px;--s-5:24px;--s-6:32px;--s-7:48px;--s-8:72px;--s-9:112px;
  /* Radii */
  --r-sm:3px;--r-md:6px;--r-lg:10px;--r-pill:999px;
  /* Layout */
  --wrap:1240px; --header-h:68px; --banner-min-h:40px;
  /* Elevation */
  --shadow-menu:0 10px 30px rgba(0,0,0,.18); /* dropdowns only */
  /* Z-index */
  --z-raised:1; --z-raised-2:2; --z-pin:60; --z-skip:100; --z-menu:1000;
  /* Motion */
  --dur-fast:.15s; --dur-base:.2s; --dur-slow:.45s; --ease:ease;

  /* Status (products: badges, toasts, inline validation). Use with a text label, never color alone. */
  --ok:#3fb27f; --warn:#d9a441; --danger:#e5484d; --info:#5b8def; --neutral:#8b8d90;
  /* Data visualization: categorical, in order. Max 6 series; beyond that, group as "Other". */
  --chart-1:#eeeef0; --chart-2:#5b8def; --chart-3:#3fb27f; --chart-4:#d9a441; --chart-5:#b07ce8; --chart-6:#8b8d90;
  --chart-grid:#2d2e30; --chart-axis:#a9abad;
}
/* Light theme for products (dashboards, apps). Mirrors roles; chrome stays light. */
[data-theme="light"]{
  --paper:#ffffff; --paper-2:#f6f7f8; --line:#dddee0; --text:#151618; --muted:#5c5e60;
  --chart-1:#151618; --chart-grid:#dddee0; --chart-axis:#5c5e60;
  --ok:#1a7a50; --warn:#8f5b00; --danger:#c62f35; --info:#2f63d1;
}
@media (prefers-reduced-motion:reduce){:root{--dur-fast:0s;--dur-base:0s;--dur-slow:0s}}