/* GENERATED FILE — do not edit. Source: tokens/tokens.json */
/* MumPA DS tokens v1.1.0 */

/* === LAYER 1 — PRIMITIVES === */
:root {
  --palette-1-50: #e9f8f6;
  --palette-1-100: #c4ede8;
  --palette-1-300: #6cd5cb;
  --palette-1-400: #4ed4c8;
  --palette-1-500: #3ec5bc;
  --palette-1-600: #2ca59c;
  --palette-1-700: #1f857d;
  --palette-2-300: #ff9a9a;
  --palette-2-400: #ff8585;
  --palette-2-500: #ff6b6b;
  --palette-2-600: #e8505b;
  --palette-2-700: #c43a44;
  --palette-3-300: #ffc680;
  --palette-3-400: #ffb55c;
  --palette-3-500: #ffa940;
  --palette-3-600: #f08c1f;
  --palette-3-700: #c66f14;
  --palette-4-300: #a48ff0;
  --palette-4-400: #8e72ed;
  --palette-4-500: #7c5ce8;
  --palette-4-600: #5d3ec9;
  --palette-4-700: #4730a3;
  --palette-5-400: #ff95c0;
  --palette-5-500: #ff7eb1;
  --palette-5-600: #ff5e9e;
  --palette-6-400: #94d4ff;
  --palette-6-500: #74c8ff;
  --palette-6-600: #4ea2e8;
  --palette-7-400: #a5e1b6;
  --palette-7-500: #8dd9a5;
  --palette-7-600: #5fb87a;
  --palette-7-700: #4a9a63;
  --palette-8-400: #ffe49a;
  --palette-8-500: #ffd76f;
  --palette-8-600: #f5b53f;
  --neutral-dark-600: #2c2b3a;
  --neutral-dark-700: #232230;
  --neutral-dark-800: #18171f;
  --neutral-dark-900: #0f0e15;
  --neutral-light-50: #ffffff;
  --neutral-light-100: #faf7f1;
  --neutral-light-200: #f6f3ed;
  --neutral-light-300: #f0ebe1;
  --neutral-light-400: #ebe6dc;
  --neutral-mid-300: #b8b6c4;
  --neutral-mid-500: #8a8898;
  --neutral-mid-700: #4a4858;
  --neutral-darkest: #1f1d2b;
  --white: #ffffff;
}

/* === LAYER 2 — SEMANTIC (light theme, default) === */
:root,
[data-theme="light"] {
  --brand: #3ec5bc;
  --brand-strong: #2ca59c;
  --brand-soft: #e9f8f6;
  --brand-bright: #4ed4c8;
  --brand-on: #ffffff;
  --accent-1: #ff6b6b;
  --accent-1-strong: #e8505b;
  --accent-1-soft: rgba(255, 107, 107, 0.12);
  --accent-1-on: #ffffff;
  --accent-2: #ffa940;
  --accent-2-strong: #f08c1f;
  --accent-2-soft: rgba(255, 169, 64, 0.14);
  --accent-2-on: #ffffff;
  --accent-3: #7c5ce8;
  --accent-3-strong: #5d3ec9;
  --accent-3-soft: rgba(124, 92, 232, 0.12);
  --accent-3-on: #ffffff;
  --accent-4: #74c8ff;
  --accent-4-strong: #4ea2e8;
  --accent-4-soft: rgba(116, 200, 255, 0.16);
  --accent-4-on: #ffffff;
  --accent-5: #8dd9a5;
  --accent-5-strong: #4a9a63;
  --accent-5-soft: rgba(141, 217, 165, 0.20);
  --accent-5-on: #1f1d2b;
  --accent-6: #ff7eb1;
  --accent-6-strong: #ff5e9e;
  --accent-6-soft: rgba(255, 126, 177, 0.14);
  --accent-6-on: #ffffff;
  --accent-7: #ffd76f;
  --accent-7-strong: #f5b53f;
  --accent-7-soft: rgba(255, 215, 111, 0.22);
  --accent-7-on: #1f1d2b;
  --bg-app: #ebe6dc;
  --bg-screen: #f6f3ed;
  --surface-card: #ffffff;
  /* The orb is a fixed, colourful sticker — these never change with dark mode */
  --orb-petal: #ffffff;
  --orb-face: #fbf8ca;
  --orb-ink: #364047;
  --surface-soft: #faf7f1;
  --surface-sunken: #f0ebe1;
  --surface-inverse: #1f1d2b;
  --text-primary: #1f1d2b;
  --text-secondary: #4a4858;
  --text-muted: #8a8898;
  --text-faint: #b8b6c4;
  --text-on-color: #ffffff;
  --divider: rgba(31, 29, 43, 0.06);
  --border: rgba(31, 29, 43, 0.10);
  --shadow-sm: 0 2px 8px rgba(31, 29, 43, 0.06);
  --shadow-md: 0 8px 24px rgba(31, 29, 43, 0.08);
  --shadow-lg: 0 12px 36px rgba(31, 29, 43, 0.12);
  --shadow-brand: 0 12px 28px rgba(62, 197, 188, 0.35);
  --status-success: #4a9a63;
  --status-warning: #ffa940;
  --status-danger: #ff6b6b;
  --status-info: #74c8ff;
  --nav-bg: #1f1d2b;
  --nav-fg-active: #ffffff;
  --nav-fg-inactive: rgba(255,255,255,0.5);
  --scrim: rgba(15, 14, 21, 0.40);
  --size-xs: 10px;
  --size-sm: 11px;
  --size-md: 13px;
  --size-lg: 15px;
  --size-xl: 17px;
  --size-2xl: 22px;
  --size-3xl: 28px;
  --size-display: 38px;
  --size-hero: 46px;
  --weight-regular: 400;
  --weight-medium: 500;
  --weight-semibold: 600;
  --weight-bold: 700;
  --weight-heavy: 800;
  --track-tight: -0.015em;
  --track-tighter: -0.025em;
  --track-tightest: -0.04em;
  --track-wide: normal;
  --track-wider: normal;
  --leading-tight: 1.05;
  --leading-snug: 1.15;
  --leading-normal: 1.45;
  --font-display: Plus Jakarta Sans, system-ui, sans-serif;
  --font-body: Plus Jakarta Sans, system-ui, sans-serif;
  --font-mono: JetBrains Mono, ui-monospace, monospace;
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 20px;
  --space-6: 24px;
  --space-7: 32px;
  --space-8: 40px;
  --space-9: 56px;
  --space-10: 72px;
  --radius-2: 7px;
  --radius-3: 12px;
  --radius-4: 14px;
  --radius-5: 20px;
  --radius-6: 24px;
  --radius-7: 28px;
  --radius-8: 36px;
  --radius-pill: 100px;
  --duration-fast: 150ms;
  --duration-med: 250ms;
  --duration-slow: 400ms;
  --ease: cubic-bezier(0.2, 0.8, 0.2, 1);
  --ease-out: cubic-bezier(0.2, 0.8, 0.2, 1);
  --ease-in-out: cubic-bezier(0.65, 0, 0.35, 1);
  --ease-spring: cubic-bezier(0.34, 1.56, 0.64, 1);
  --z-base: 0;
  --z-card-stack: 2;
  --z-nav: 100;
  --z-overlay: 300;
  --z-toast: 500;
  --z-modal: 700;
}

/* === LAYER 2 — DARK THEME OVERRIDES === */
[data-theme="dark"] {
  --bg-app: #0f0e15;
  --bg-screen: #18171f;
  --surface-card: #232230;
  --surface-soft: #18171f;
  --surface-sunken: #2c2b3a;
  --surface-inverse: #ffffff;
  --text-primary: #f4f3ef;
  --text-secondary: #c8c6d0;
  --text-muted: #8a8898;
  --text-faint: #56556a;
  --divider: rgba(244, 243, 239, 0.07);
  --border: rgba(244, 243, 239, 0.10);
  --shadow-sm: 0 2px 8px rgba(0, 0, 0, 0.3);
  --shadow-md: 0 8px 24px rgba(0, 0, 0, 0.35);
  --shadow-lg: 0 12px 36px rgba(0, 0, 0, 0.5);
  --brand-soft: rgba(62, 197, 188, 0.18);
  --accent-1-soft: rgba(255, 107, 107, 0.20);
  --accent-2-soft: rgba(255, 169, 64, 0.22);
  --accent-3-soft: rgba(124, 92, 232, 0.22);
  --accent-4-soft: rgba(116, 200, 255, 0.24);
  --accent-5-soft: rgba(141, 217, 165, 0.26);
  --accent-6-soft: rgba(255, 126, 177, 0.22);
  --accent-7-soft: rgba(255, 215, 111, 0.28);
  --scrim: rgba(0, 0, 0, 0.55);
}

/* === BRAND PRESET — preset-a === */
[data-brand="preset-a"] {
  --brand: #ff6b6b;
  --brand-strong: #e8505b;
  --brand-soft: rgba(255, 107, 107, 0.10);
  --brand-bright: #ff8585;
  --shadow-brand: 0 12px 28px rgba(255, 107, 107, 0.35);
}

/* === BRAND PRESET — preset-b === */
[data-brand="preset-b"] {
  --brand: #5fb87a;
  --brand-strong: #4a9a63;
  --brand-soft: rgba(141, 217, 165, 0.14);
  --brand-bright: #8dd9a5;
  --shadow-brand: 0 12px 28px rgba(95, 184, 122, 0.35);
}

/* === BRAND PRESET — preset-c === */
[data-brand="preset-c"] {
  --brand: #7c5ce8;
  --brand-strong: #5d3ec9;
  --brand-soft: rgba(124, 92, 232, 0.12);
  --brand-bright: #a48ff0;
  --shadow-brand: 0 12px 28px rgba(124, 92, 232, 0.35);
}