/**
 * Edventures Design System
 * GENERATED FILE — do NOT edit by hand.
 * Source of truth: tokens/src/*.json   ·   Rebuild: npm run tokens
 * Tiers: primitive → semantic → component. See docs/tokens.md.
 */

:root {
  --violet-50: #F4EFFF; /** Faintest violet wash — large tinted backgrounds, hero gradient start. */
  --violet-100: #E9DEFF; /** Subtle violet — chips, soft fills, gradient mid. */
  --violet-500: #7100FF; /** BASE brand colour. Locked, never modernised. Primary buttons, links, focus. */
  --violet-700: #5400BF; /** Pressed / hover violet. */
  --violet-900: #2E0066; /** Deepest violet — strong contrast on light tints. */
  --violet-on-muted: #E6DCFF; /** Muted text on violet surfaces (e.g. featured card body). */
  --lime: #C6FF3D; /** Lime accent — ONE highlight moment per screen. Never body text, never on white. */
  --lime-soft: #EAFFC2; /** Soft lime — gradient end, gentle fills. */
  --pink: #FF3D9A; /** Pink accent — punctuation, tags, sparing emphasis. */
  --pink-soft: #FFD9EC; /** Soft pink — badge fills. */
  --pink-deep: #9B0F50; /** Deep pink — AA-legible text on pink-soft. */
  --ink: #120B22; /** Near-black ink — default text and the signature 2px borders. */
  --ink-50: #5B5470; /** Secondary text. */
  --ink-30: #8079A0; /** Muted / placeholder text. */
  --line: #E7E2F2; /** Hairline dividers inside cards. */
  --paper: #FBFAFF; /** Page background. */
  --surface: #FFFFFF; /** Card / input surface. */
  --white: #FFFFFF; /** Pure white — text on violet. */
  --grey-fill: #F1EEF7; /** Off-system grey — disabled background only. */
  --grey-text: #A39CB5; /** Off-system grey — disabled text only. */
  --grey-border: #C9C3D6; /** Off-system grey — disabled border only. */
  --green: #16A34A; /** Success hue. */
  --amber: #FFB020; /** Warning hue. */
  --red: #FF3D5D; /** Error hue. */
  --ff-display: "Funnel Display", "General Sans", sans-serif; /** Headings / display. */
  --ff-body: "General Sans", system-ui, sans-serif; /** Body + UI. */
  --fs-display: 64px;
  --fs-h1: 40px;
  --fs-h2: 28px;
  --fs-h3: 20px;
  --fs-body: 16px;
  --fs-small: 14px;
  --fs-label: 12px;
  --fw-display: 800;
  --fw-h1: 800;
  --fw-h2: 700;
  --fw-h3: 600;
  --fw-body: 400;
  --fw-small: 500;
  --fw-label: 700;
  --lh-display: 1;
  --lh-h1: 1.02;
  --lh-h2: 1.1;
  --lh-h3: 1.25;
  --lh-body: 1.6;
  --lh-small: 1.5;
  --ls-tight: -0.02em; /** Display & H1 tracking. */
  --ls-label: 1.5px; /** Uppercase label tracking. */
  --r-sm: 9px;
  --r-md: 12px;
  --r-lg: 16px;
  --r-pill: 999px;
  --bw-hairline: 1.5px; /** Badges / pills. */
  --bw-default: 2px; /** The signature ink border. */
  --s-1: 4px;
  --s-2: 8px;
  --s-3: 12px;
  --s-4: 16px;
  --s-5: 24px;
  --s-6: 32px;
  --s-7: 48px;
  --s-8: 64px;
  --s-9: 96px;
  --button-pad-y: 13px;
  --button-pad-x: 26px;
  --card-pad: 26px;
  --nav-gap: 20px;
  --badge-pad-y: 6px;
  --badge-pad-x: 12px;
  --input-radius: 11px; /** Component exception — between r-sm and r-md. */
  --section-tag-size: 42px; /** The sticker section marker. */
  --section-tag-radius: 11px;
  --violet: var(--violet-500); /** Convenience alias for the base brand colour. */
  --color-primary: var(--violet-500); /** Primary actions, links, brand surfaces. */
  --color-primary-hover: var(--violet-700); /** Primary hover / pressed. */
  --color-primary-subtle: var(--violet-100); /** Soft violet fills / chips. */
  --color-primary-faint: var(--violet-50); /** Faint violet backgrounds, gradient start. */
  --color-primary-strong: var(--violet-900); /** Deepest violet for high-contrast text on tints. */
  --color-link: var(--violet-500); /** Inline links, violet text, interactive icons (not fills). */
  --color-on-primary-muted: var(--violet-on-muted); /** Muted text on violet surfaces. */
  --color-accent: var(--lime); /** The one highlight moment per screen. Never body text. */
  --color-accent-soft: var(--lime-soft); /** Gentle lime fill / gradient end. */
  --color-punctuation: var(--pink); /** Pink emphasis — tags, punctuation, sparing. */
  --color-punctuation-soft: var(--pink-soft); /** Soft pink fill. */
  --color-text: var(--ink); /** Default body / heading text. */
  --color-text-muted: var(--ink-50); /** Secondary text. */
  --color-text-subtle: var(--ink-30); /** Muted / placeholder text. */
  --color-on-primary: var(--white); /** Text on violet. AA ✓. */
  --color-on-accent: var(--ink); /** Text on lime. AA ✓. Never violet text on lime. */
  --color-on-punctuation: var(--ink); /** Text on pink. AA ✓. */
  --color-on-punctuation-soft: var(--pink-deep); /** Text on pink-soft. AA ✓. */
  --color-bg: var(--paper); /** Page background. */
  --color-surface: var(--surface); /** Card / input surface. */
  --color-border: var(--ink); /** The signature ink border colour. */
  --color-divider: var(--line); /** Hairline dividers. */
  --color-focus: var(--violet-500); /** Focus ring colour (violet focus shadow). */
  --color-disabled-bg: var(--grey-fill); /** Disabled background. */
  --color-disabled-text: var(--grey-text); /** Disabled text. */
  --color-disabled-border: var(--grey-border); /** Disabled border. */
  --color-success: var(--green);
  --color-warning: var(--amber);
  --color-error: var(--red);
  --success: var(--green); /** Status — success. Also exposed as color-success. */
  --warning: var(--amber); /** Status — warning. Also exposed as color-warning. */
  --error: var(--red); /** Status — error. Also exposed as color-error. */
  --font-display: var(--ff-display); /** Heading / display family. */
  --font-body: var(--ff-body); /** Body / UI family. */
  --border: var(--bw-default) solid var(--ink); /** Signature border shorthand: 2px solid ink. */
  --shadow: 4px 4px 0 var(--ink); /** Default hard offset shadow. NEVER blurred. */
  --shadow-sm: 3px 3px 0 var(--ink); /** Small hard shadow. */
  --shadow-lg: 5px 5px 0 var(--ink); /** Large hard shadow. */
  --shadow-lime: 4px 4px 0 var(--lime); /** Lime-tinted hard shadow — rhythm/variety. */
  --shadow-violet: 4px 4px 0 var(--violet-500); /** Violet-tinted hard shadow — also the input focus ring. */
  --shadow-pink: 4px 4px 0 var(--pink); /** Pink-tinted hard shadow. */
  --button-radius: var(--r-md);
  --button-shadow-hover: 6px 6px 0 var(--ink); /** Hover lift — paired with translate(-2px,-2px). */
  --button-shadow-active: 1px 1px 0 var(--ink); /** Press — paired with translate(2px,2px). */
  --card-radius: var(--r-lg);
  --nav-radius: var(--r-lg);
  --badge-radius: var(--r-sm);
  --badge-border: var(--bw-hairline) solid var(--ink); /** 1.5px ink border — lighter than the 2px default. */
  --button-border: var(--border);
  --button-shadow: var(--shadow);
  --button-primary-bg: var(--color-primary);
  --button-primary-text: var(--color-on-primary);
  --button-secondary-bg: var(--color-accent);
  --button-secondary-text: var(--color-on-accent);
  --button-disabled-bg: var(--color-disabled-bg);
  --button-disabled-text: var(--color-disabled-text);
  --button-disabled-border: var(--color-disabled-border);
  --card-bg: var(--color-surface);
  --card-border: var(--border);
  --card-shadow: var(--shadow); /** Swap for shadow-lime / shadow-violet for rhythm. */
  --card-featured-bg: var(--color-primary);
  --card-featured-text: var(--color-on-primary);
  --nav-bg: var(--color-surface);
  --nav-border: var(--border);
  --nav-shadow: var(--shadow);
  --badge-violet-bg: var(--color-primary);
  --badge-violet-text: var(--color-on-primary);
  --badge-lime-bg: var(--color-accent);
  --badge-lime-text: var(--color-on-accent);
  --badge-pink-bg: var(--color-punctuation-soft);
  --badge-pink-text: var(--color-on-punctuation-soft);
  --input-border: var(--border);
  --input-focus-shadow: var(--shadow-violet); /** Violet focus ring. */
  --section-tag-bg: var(--color-accent);
  --section-tag-border: var(--border);
  --section-tag-shadow: var(--shadow-sm);
}