/**
 * Design tokens — 99digest Design System v2 (Canonical).
 * Source of intent: docs/05-design/99digest-design-system-v2.md
 * Supersedes the v1 token set (docs/05-design/design-foundations.md,
 * now marked superseded) per founder-approved C7 breaking change
 * (RC-6 Sprint 1, 2026-07-06) — see that doc's governance note.
 *
 * Every value below traces to Design System v2 EXCEPT where marked
 * DERIVED — v2 doesn't specify every token this platform needs (exact
 * primary-hover/active hex; H4/Body Large/Navigation/Button type
 * sizes; panel/modal/chip radius; dropdown/modal/tooltip shadow and
 * motion timings; a full dark-mode text/border ramp; opacity/blur/
 * z-index scales). DERIVED values follow v2's stated proportions and
 * philosophy (§2-3), not founder-specified numbers — flagged inline
 * and listed again in engineering-changelog.md for review.
 *
 * No hard-coded visual values are permitted anywhere else in this
 * theme (dev-standards §5) — everything must resolve to a token here.
 */

/* ---- Self-hosted fonts (Design System v2 §10) — NOT a Google Fonts /
   CDN reference (founder rule: self-host only). font-display: swap
   means text renders immediately in the fallback stack and reflows
   once the local file loads — never a blocked/invisible paint.
   Real files (TD-10, closed 2026-08-10): both Geist and Inter are
   genuinely free/open-source (SIL Open Font License) — no paid-asset
   issue ever existed. Real WOFF2 binaries are copied at build time
   from the @fontsource/geist-sans and @fontsource-variable/inter npm
   packages (build/make-fonts.mjs, run automatically by `npm run
   build`) — build-time-only devDependencies, never a runtime/CDN
   dependency, same pattern as lucide-static for the icon sprite. */
@font-face {
  font-family: "Geist";
  src: url("../fonts/geist/Geist-Regular.woff2") format("woff2");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Geist";
  src: url("../fonts/geist/Geist-Medium.woff2") format("woff2");
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Geist";
  src: url("../fonts/geist/Geist-SemiBold.woff2") format("woff2");
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Geist";
  src: url("../fonts/geist/Geist-Bold.woff2") format("woff2");
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Inter";
  src: url("../fonts/inter/Inter-Variable.woff2") format("woff2-variations");
  font-weight: 400 700;
  font-style: normal;
  font-display: swap;
}

:root {
  color-scheme: light dark;

  /* ---- Breakpoints — unchanged by Design System v2 (not redefined
     there); carried forward from the superseded v1 token set. CSS
     custom properties cannot be read inside @media, so these remain
     documentation anchors for the literal px values used in media
     queries throughout the CSS: sm 480 / md 768 / lg 1024 / xl 1280 / 2xl 1600 */

  /* ---- Containers (Design System v2 §12, explicit) ---- */
  --nn-container-content: 47.5rem;  /* 760px — "Reading Width" */
  --nn-container-tool: 51.25rem;    /* 820px — "Tool Width" */
  --nn-container-wide: 82.5rem;     /* 1320px — "Maximum Content Width" */
  --nn-container-sidebar: 20rem;    /* 320px — "Sidebar Width" */

  /* ---- Spacing scale (Design System v2 §11, explicit — the 10-step
     scale, corrected: RC-6's execution doc previously listed a
     conflicting 13-step scale including 20/40/80; that document has
     been corrected to match this one so exactly one scale exists) ---- */
  --nn-space-1: 0.25rem;  /* 4px */
  --nn-space-2: 0.5rem;   /* 8px */
  --nn-space-3: 0.75rem;  /* 12px */
  --nn-space-4: 1rem;     /* 16px */
  --nn-space-5: 1.5rem;   /* 24px */
  --nn-space-6: 2rem;     /* 32px */
  --nn-space-7: 3rem;     /* 48px */
  --nn-space-8: 4rem;     /* 64px */
  --nn-space-9: 6rem;     /* 96px */
  --nn-space-10: 8rem;    /* 128px */
  --nn-flow: var(--nn-space-5);

  /* ---- Typography: families (Design System v2 §10, explicit) ---- */
  --nn-font-sans: "Geist", "Inter", system-ui, -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  --nn-font-mono: ui-monospace, "Cascadia Code", Consolas, Menlo, monospace;

  /* ---- Typography: dedicated heading/display scale (Design System
     v2 §10). Hero/H1/H2/H3/Section Title/Body/Small/Caption are
     explicit; H4/Body Large/Navigation/Button are DERIVED (v2 names
     them as needed categories but gives no px value). Kept as their
     own dedicated tokens — NOT folded into the generic xs..4xl scale
     below — because that generic scale is shared by non-heading UI
     (badges, buttons, alerts) whose sizing must not move just because
     a heading size changed. */
  --nn-text-hero: 4rem;               /* 64px — explicit */
  --nn-text-h1: 3rem;                 /* 48px — explicit */
  --nn-text-h2: 2.25rem;              /* 36px — explicit */
  --nn-text-h3: 1.75rem;              /* 28px — explicit */
  --nn-text-h4: 1.375rem;             /* 22px — DERIVED (reuses Section Title; no separate H4 given) */
  --nn-text-section-title: 1.375rem;  /* 22px — explicit */
  --nn-text-body-lg: 1.25rem;         /* 20px — DERIVED (between Section Title 22 and Body 18) */
  --nn-text-nav: 0.9375rem;           /* 15px — DERIVED (reuses Small; no separate nav size given) */
  --nn-text-button: 0.9375rem;        /* 15px — DERIVED (reuses Small; no separate button size given) */

  /* ---- Typography: generic scale — used by non-heading UI (badges,
     inputs, alerts, meta text). Recalibrated to Design System v2's
     Body/Small/Caption values (explicit) at the names' closest
     existing semantic role; names unchanged so no component file
     needed to change to inherit the new sizes. */
  --nn-text-xs: 0.8125rem;   /* 13px — v2 "Caption" */
  --nn-text-sm: 0.9375rem;   /* 15px — v2 "Small" */
  --nn-text-base: 1.125rem;  /* 18px — v2 "Body". NOTE: this changes the
                                 platform's default body text size from
                                 16px to 18px everywhere — an intended
                                 consequence of Design System v2 §10,
                                 not a side effect; flagged for review. */
  --nn-text-lg: 1.25rem;     /* 20px — DERIVED, aligned to Body Large above */
  --nn-text-xl: 1.375rem;    /* 22px — DERIVED, aligned to Section Title above */
  --nn-text-2xl: 1.75rem;    /* 28px — DERIVED, aligned to H3 above */
  --nn-text-3xl: 2.25rem;    /* 36px — DERIVED, aligned to H2 above */
  --nn-text-4xl: 3rem;       /* 48px — DERIVED, aligned to H1 above */

  --nn-leading-body: 1.6;      /* carried forward — v2 doesn't respecify */
  --nn-leading-heading: 1.15;  /* DERIVED: tightened from 1.25 for v2's larger headline sizes */
  --nn-leading-mono: 1.45;

  --nn-tracking-heading: -0.01em; /* DERIVED: v2's "precision" register (§3.4) reads better slightly tightened at large sizes */
  --nn-tracking-body: 0;

  --nn-weight-regular: 400;
  --nn-weight-medium: 500;
  --nn-weight-semibold: 600;
  --nn-weight-bold: 700;
  --nn-weight-heading: var(--nn-weight-bold);     /* carried forward — v2 doesn't respecify */
  --nn-weight-h2: var(--nn-weight-bold);
  --nn-weight-h3: var(--nn-weight-semibold);

  /* ---- Primitive palette — Design System v2 gives specific semantic
     hex values (§6), not a full 50–900 ramp. Primitives below are
     DERIVED tiers around each explicit v2 value, needed for hover/
     active/subtle states the same way the superseded v1 ramp worked;
     the explicit v2 numbers anchor the tier marked "v2 explicit". ---- */
  --nn-blue-50: #EFF4FF;
  --nn-blue-100: #DCE7FF;
  --nn-blue-400: #6690FF;
  --nn-blue-500: #2563FF;   /* v2 explicit — "Primary" */
  --nn-blue-600: #1E4FE0;   /* DERIVED — "Primary Hover" (no hex given) */
  --nn-blue-700: #1840B8;   /* DERIVED — "Primary Active" (no hex given) */
  --nn-blue-900: #122F8C;

  --nn-gray-0: #FFFFFF;             /* v2 explicit — "Background Primary" */
  --nn-gray-25: #FBFCFE;            /* v2 explicit — "Background Cards" */
  --nn-gray-50: #F8FAFC;            /* v2 explicit — "Background Secondary" */
  --nn-gray-75: #F3F6FA;            /* v2 explicit — "Background Panels" */
  --nn-gray-100: #E5E7EB;           /* v2 explicit — "Border Default" */
  --nn-gray-150: #D6DAE3;           /* v2 explicit — "Border Hover" */
  --nn-gray-300: #9CA3AF;           /* v2 explicit — "Text Disabled" */
  --nn-gray-500: #6B7280;           /* v2 explicit — "Text Muted" */
  --nn-gray-600: #4B5563;           /* v2 explicit — "Text Secondary" */
  --nn-gray-900: #111827;           /* v2 explicit — "Text Primary" */

  --nn-green-500: #22C55E;
  --nn-green-600: #16A34A;   /* v2 explicit — "Success" */
  --nn-green-700: #15803D;
  --nn-green-900: #052E16;

  --nn-amber-50: #FFFBEB;
  --nn-amber-500: #F59E0B;   /* v2 explicit — "Warning" */
  --nn-amber-600: #D97706;
  --nn-amber-900: #451A03;

  --nn-red-50: #FEF2F2;
  --nn-red-500: #EF4444;    /* v2 explicit — "Error" */
  --nn-red-600: #DC2626;
  --nn-red-700: #B91C1C;
  --nn-red-900: #450A0A;

  /* ---- Semantic tokens — light (default) — components use ONLY these ---- */
  --nn-bg: var(--nn-gray-0);
  --nn-bg-subtle: var(--nn-gray-50);
  --nn-bg-raised: var(--nn-gray-25);   /* "Cards" per v2 §6 */
  --nn-bg-panel: var(--nn-gray-75);    /* "Panels" per v2 §6 */

  --nn-text: var(--nn-gray-900);          /* on --nn-bg: ~16.1:1 */
  --nn-text-secondary: var(--nn-gray-600);/* on --nn-bg: ~7.6:1 */
  --nn-text-muted: var(--nn-gray-500);    /* on --nn-bg: ~5.0:1 */
  --nn-text-disabled: var(--nn-gray-300); /* UI-only; never body text (a11y) */

  --nn-border: var(--nn-gray-100);
  --nn-border-strong: var(--nn-gray-150);

  --nn-primary: var(--nn-blue-500);         /* on --nn-bg: 4.6:1 */
  --nn-primary-hover: var(--nn-blue-600);   /* DERIVED — see primitive note above */
  --nn-primary-active: var(--nn-blue-700);  /* DERIVED — see primitive note above */
  --nn-primary-strong: var(--nn-blue-600);  /* alias kept for existing components.css references */
  --nn-primary-subtle: var(--nn-blue-50);
  --nn-on-primary: var(--nn-gray-0);

  --nn-success: var(--nn-green-600);
  --nn-success-text: var(--nn-green-700);
  --nn-success-subtle: #F0FDF4;

  --nn-warning: var(--nn-amber-500);
  --nn-warning-text: #92400E;               /* DERIVED — kept from v1 for AA contrast on light bg; v2 gives no separate warning-text value */
  --nn-warning-subtle: var(--nn-amber-50);

  --nn-error: var(--nn-red-500);
  --nn-error-text: var(--nn-red-700);       /* DERIVED — kept from v1 for AA contrast on light bg; v2 gives no separate error-text value */
  --nn-error-subtle: var(--nn-red-50);

  --nn-focus: var(--nn-primary);
  --nn-focus-ring-width: 2px;               /* DERIVED — not respecified by v2; carried from a11y-standards */
  --nn-focus-ring-offset: 2px;

  --nn-link: var(--nn-primary);
  --nn-link-visited: var(--nn-blue-900);

  --nn-backdrop: rgb(15 23 42 / 0.5);       /* DERIVED — overlay scrim behind modals/search; not given by v2, kept from existing usage (was hardcoded, now tokenized) */

  /* ---- Gradient (Design System v2 §7, explicit — restricted to hero
     accents/logo/signature highlights only; never buttons/cards/bg) ---- */
  --nn-gradient-signature: linear-gradient(135deg, #3B82F6, #6366F1);

  /* ---- Radius (Design System v2 §9) — per-component-type tokens.
     Buttons/Cards/Inputs/Badges are explicit; Panel/Modal/Chip are
     DERIVED (v2 names them as needed categories, no separate px). ---- */
  --nn-radius-button: 0.875rem; /* 14px — explicit */
  --nn-radius-card: 1.25rem;    /* 20px — explicit */
  --nn-radius-input: 1rem;      /* 16px — explicit */
  --nn-radius-badge: 999px;     /* explicit */
  --nn-radius-panel: 1.25rem;   /* 20px — DERIVED, same as card */
  --nn-radius-modal: 1.25rem;   /* 20px — DERIVED, same as card */
  --nn-radius-chip: 999px;      /* DERIVED, same as badge */
  /* legacy generic names — kept so nothing referencing them breaks;
     mapped to the closest v2 role for each name's ACTUAL dominant use
     in components.css (checked directly, not assumed): --md is used by
     .nn-card/.nn-stats__cell/toast/mega-panel/empty-state boxes — all
     card-like surfaces, not buttons (the one real button, .nn-btn,
     was repointed to --nn-radius-button directly, not through this
     alias) — so --md maps to --card, not --button. */
  --nn-radius-sm: var(--nn-radius-input);
  --nn-radius-md: var(--nn-radius-card);
  --nn-radius-lg: var(--nn-radius-card);
  --nn-radius-full: var(--nn-radius-badge);

  /* ---- Shadows (Design System v2 §8) — Card/Hover/Hero are explicit;
     Dropdown/Modal/Tooltip are DERIVED, scaled proportionally between
     Card (tightest) and Hero (loosest), matching v2's "almost
     invisible" elevation philosophy rather than dramatic shadows. ---- */
  --nn-shadow-card: 0 4px 16px rgb(15 23 42 / 0.05);      /* explicit */
  --nn-shadow-hover: 0 8px 30px rgb(15 23 42 / 0.08);     /* explicit */
  --nn-shadow-hero: 0 24px 80px rgb(37 99 255 / 0.08);    /* explicit */
  --nn-shadow-dropdown: 0 6px 20px rgb(15 23 42 / 0.07);  /* DERIVED */
  --nn-shadow-modal: 0 16px 48px rgb(15 23 42 / 0.10);    /* DERIVED */
  --nn-shadow-tooltip: 0 2px 8px rgb(15 23 42 / 0.06);    /* DERIVED */
  /* legacy generic names — kept so nothing referencing them breaks */
  --nn-shadow-1: var(--nn-shadow-card);
  --nn-shadow-2: var(--nn-shadow-hover);

  /* ---- Motion (Design System v2 §14) — Hover/Standard/Page are
     explicit; Fast/Normal/Slow/Dropdown/Modal/Tooltip are DERIVED
     mappings onto those three explicit timings (RC-6 Phase 1 asks for
     these names; v2 gives only three numbers to map them onto). ---- */
  --nn-motion-hover: 150ms;     /* explicit */
  --nn-motion-standard: 180ms;  /* explicit */
  --nn-motion-page: 250ms;      /* explicit */
  --nn-motion-fast: var(--nn-motion-hover);        /* DERIVED alias */
  --nn-motion-normal: var(--nn-motion-standard);   /* DERIVED alias */
  --nn-motion-slow: var(--nn-motion-page);         /* DERIVED alias */
  --nn-motion-dropdown: var(--nn-motion-standard); /* DERIVED */
  --nn-motion-modal: var(--nn-motion-page);        /* DERIVED */
  --nn-motion-tooltip: 120ms;                      /* DERIVED — faster than hover; tooltips should feel instant */
  --nn-motion-ease: ease-out;
  --nn-motion-accordion: var(--nn-motion-standard); /* legacy name kept for existing components.css references */

  /* ---- Opacity scale — DERIVED in full; neither v2 nor RC-6 gives
     specific values, only names the category as needed. Standard
     8-step scale, unitless (CSS opacity convention). ---- */
  --nn-opacity-0: 0;
  --nn-opacity-5: 0.05;
  --nn-opacity-10: 0.1;
  --nn-opacity-20: 0.2;
  --nn-opacity-40: 0.4;
  --nn-opacity-60: 0.6;
  --nn-opacity-80: 0.8;
  --nn-opacity-100: 1;

  /* ---- Blur scale — DERIVED in full; not specified by either new
     doc. Minimal set for glass/overlay surfaces only (v2 §3 "calm,
     restrained" — blur is not a general decorative tool here). ---- */
  --nn-blur-sm: 4px;
  --nn-blur-md: 12px;
  --nn-blur-lg: 24px;

  /* ---- Z-index — DERIVED scale, but constrained to match the EXACT
     stacking values already live in components.css/layout.css (header
     50, mega-panel 60, toast 100, search-overlay 200, back-to-top 40)
     so tokenizing them is a pure rename with zero stacking-order
     change. Modal/tooltip are new slots, not yet used by any shipped
     component. ---- */
  --nn-z-back-to-top: 40;
  --nn-z-header: 50;
  --nn-z-dropdown: 60;
  --nn-z-toast: 100;
  --nn-z-tooltip: 150;
  --nn-z-search-overlay: 200;
  --nn-z-modal: 300;
}

/* ---- Dark mode (Design System v2 §23) — Background/Cards/Borders are
   explicit; every other dark-mode value below is DERIVED (v2 gives
   only those three, plus "the same blue accent is retained" and
   "should feel premium, not merely inverted" as the design intent).
   Remaps SEMANTICS only, never component code. ---- */
@media (prefers-color-scheme: dark) {
  :root {
    --nn-bg: #0B1220;              /* explicit */
    --nn-bg-subtle: #0F1729;       /* DERIVED — between bg and cards */
    --nn-bg-raised: #111827;       /* explicit — "Cards" */
    --nn-bg-panel: #161F33;        /* DERIVED — one step up from cards, for panel-level surfaces */

    --nn-text: #F3F4F6;            /* DERIVED — near-white, not pure white (v2 "premium, not inverted") */
    --nn-text-secondary: #C3C8D1;  /* DERIVED */
    --nn-text-muted: #9AA1AE;      /* DERIVED */
    --nn-text-disabled: #5B6472;   /* DERIVED */

    --nn-border: rgb(255 255 255 / 0.08);  /* explicit */
    --nn-border-strong: rgb(255 255 255 / 0.14); /* DERIVED, strengthened per the frozen "borders strengthen in dark" rule */

    --nn-primary: var(--nn-blue-500);        /* v2: "the same blue accent is retained" */
    --nn-primary-hover: var(--nn-blue-400);  /* DERIVED — lightened for dark-bg contrast, mirrors the retired v1 dark-mode pattern */
    --nn-primary-active: var(--nn-blue-600); /* DERIVED */
    --nn-primary-strong: var(--nn-blue-400);
    --nn-primary-subtle: var(--nn-blue-900);
    --nn-on-primary: var(--nn-gray-0);

    --nn-success: var(--nn-green-500);
    --nn-success-text: #4ADE80;
    --nn-success-subtle: var(--nn-green-900);

    --nn-warning: var(--nn-amber-500);
    --nn-warning-text: #FCD34D;
    --nn-warning-subtle: var(--nn-amber-900);

    --nn-error: var(--nn-red-500);
    --nn-error-text: #F87171;
    --nn-error-subtle: var(--nn-red-900);

    --nn-focus: var(--nn-primary-hover);

    --nn-link: var(--nn-primary-hover);
    --nn-link-visited: #93C5FD;

    --nn-backdrop: rgb(0 0 0 / 0.6); /* DERIVED — darker scrim reads correctly against a dark page */

    /* shadows weaken in dark (frozen rule, carried forward — v2 doesn't
       respecify dark-mode shadow values) */
    --nn-shadow-card: 0 1px 3px rgb(0 0 0 / 0.3);
    --nn-shadow-hover: 0 4px 16px rgb(0 0 0 / 0.4);
    --nn-shadow-hero: 0 24px 80px rgb(0 0 0 / 0.35);
    --nn-shadow-dropdown: 0 6px 20px rgb(0 0 0 / 0.35);
    --nn-shadow-modal: 0 16px 48px rgb(0 0 0 / 0.45);
    --nn-shadow-tooltip: 0 2px 8px rgb(0 0 0 / 0.3);
    --nn-shadow-1: var(--nn-shadow-card);
    --nn-shadow-2: var(--nn-shadow-hover);
  }
}

/* ---- Manual theme override (RC-6 Header: "Theme Toggle") — a real,
   working toggle, not decorative: shell.js sets data-theme on <html>
   and persists the choice (storage.js), independent of OS preference.
   Attribute-selector specificity (0,2,0) outranks the plain :root
   inside the media query above (0,1,0), so this correctly wins
   regardless of source order or which the OS reports. Values are
   var() references to the same primitives already defined above —
   this duplicates SELECTORS, not literal color values, so there is
   still exactly one place each hex value is ever written. */
:root[data-theme="dark"] {
  --nn-bg: #0B1220;
  --nn-bg-subtle: #0F1729;
  --nn-bg-raised: #111827;
  --nn-bg-panel: #161F33;

  --nn-text: #F3F4F6;
  --nn-text-secondary: #C3C8D1;
  --nn-text-muted: #9AA1AE;
  --nn-text-disabled: #5B6472;

  --nn-border: rgb(255 255 255 / 0.08);
  --nn-border-strong: rgb(255 255 255 / 0.14);

  --nn-primary: var(--nn-blue-500);
  --nn-primary-hover: var(--nn-blue-400);
  --nn-primary-active: var(--nn-blue-600);
  --nn-primary-strong: var(--nn-blue-400);
  --nn-primary-subtle: var(--nn-blue-900);
  --nn-on-primary: var(--nn-gray-0);

  --nn-success: var(--nn-green-500);
  --nn-success-text: #4ADE80;
  --nn-success-subtle: var(--nn-green-900);

  --nn-warning: var(--nn-amber-500);
  --nn-warning-text: #FCD34D;
  --nn-warning-subtle: var(--nn-amber-900);

  --nn-error: var(--nn-red-500);
  --nn-error-text: #F87171;
  --nn-error-subtle: var(--nn-red-900);

  --nn-focus: var(--nn-primary-hover);
  --nn-link: var(--nn-primary-hover);
  --nn-link-visited: #93C5FD;
  --nn-backdrop: rgb(0 0 0 / 0.6);

  --nn-shadow-card: 0 1px 3px rgb(0 0 0 / 0.3);
  --nn-shadow-hover: 0 4px 16px rgb(0 0 0 / 0.4);
  --nn-shadow-hero: 0 24px 80px rgb(0 0 0 / 0.35);
  --nn-shadow-dropdown: 0 6px 20px rgb(0 0 0 / 0.35);
  --nn-shadow-modal: 0 16px 48px rgb(0 0 0 / 0.45);
  --nn-shadow-tooltip: 0 2px 8px rgb(0 0 0 / 0.3);
  --nn-shadow-1: var(--nn-shadow-card);
  --nn-shadow-2: var(--nn-shadow-hover);
}
/* Covers the one case the media query alone can't: OS prefers dark,
   but the visitor explicitly chose light. Re-asserts the exact light
   values from the default :root block above. */
:root[data-theme="light"] {
  --nn-bg: var(--nn-gray-0);
  --nn-bg-subtle: var(--nn-gray-50);
  --nn-bg-raised: var(--nn-gray-25);
  --nn-bg-panel: var(--nn-gray-75);

  --nn-text: var(--nn-gray-900);
  --nn-text-secondary: var(--nn-gray-600);
  --nn-text-muted: var(--nn-gray-500);
  --nn-text-disabled: var(--nn-gray-300);

  --nn-border: var(--nn-gray-100);
  --nn-border-strong: var(--nn-gray-150);

  --nn-primary: var(--nn-blue-500);
  --nn-primary-hover: var(--nn-blue-600);
  --nn-primary-active: var(--nn-blue-700);
  --nn-primary-strong: var(--nn-blue-600);
  --nn-primary-subtle: var(--nn-blue-50);
  --nn-on-primary: var(--nn-gray-0);

  --nn-success: var(--nn-green-600);
  --nn-success-text: var(--nn-green-700);
  --nn-success-subtle: #F0FDF4;

  --nn-warning: var(--nn-amber-500);
  --nn-warning-text: #92400E;
  --nn-warning-subtle: var(--nn-amber-50);

  --nn-error: var(--nn-red-500);
  --nn-error-text: var(--nn-red-700);
  --nn-error-subtle: var(--nn-red-50);

  --nn-focus: var(--nn-primary);
  --nn-link: var(--nn-primary);
  --nn-link-visited: var(--nn-blue-900);

  --nn-shadow-card: 0 4px 16px rgb(15 23 42 / 0.05);
  --nn-shadow-hover: 0 8px 30px rgb(15 23 42 / 0.08);
  --nn-shadow-hero: 0 24px 80px rgb(37 99 255 / 0.08);
  --nn-shadow-dropdown: 0 6px 20px rgb(15 23 42 / 0.07);
  --nn-shadow-modal: 0 16px 48px rgb(15 23 42 / 0.10);
  --nn-shadow-tooltip: 0 2px 8px rgb(15 23 42 / 0.06);
  --nn-shadow-1: var(--nn-shadow-card);
  --nn-shadow-2: var(--nn-shadow-hover);
}