/* Filsa design system — vendored verbatim from the design export
 * 'Fills Design System Light and Dark Moods-3.zip'.
 * Dark is the default (:root); light is scoped to [data-theme="light"].
 * Only change here vs the export: @font-face src URLs point at assets/fonts/,
 * and non-latin subsets (cyrillic, greek, devanagari, vietnamese) are dropped.
 * Hand-written site styles live in site.css — edit that, not this file.
 */

@font-face{font-family:'JetBrains Mono';font-style:normal;font-weight:400;font-display:swap;src:url('../assets/fonts/JetBrainsMono-400-latin.woff2') format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:'JetBrains Mono';font-style:normal;font-weight:400;font-display:swap;src:url('../assets/fonts/JetBrainsMono-400-latin-ext.woff2') format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF}
@font-face{font-family:'JetBrains Mono';font-style:normal;font-weight:500;font-display:swap;src:url('../assets/fonts/JetBrainsMono-400-latin.woff2') format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:'JetBrains Mono';font-style:normal;font-weight:500;font-display:swap;src:url('../assets/fonts/JetBrainsMono-400-latin-ext.woff2') format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF}
@font-face{font-family:'JetBrains Mono';font-style:normal;font-weight:600;font-display:swap;src:url('../assets/fonts/JetBrainsMono-400-latin.woff2') format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:'JetBrains Mono';font-style:normal;font-weight:600;font-display:swap;src:url('../assets/fonts/JetBrainsMono-400-latin-ext.woff2') format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF}
@font-face{font-family:'JetBrains Mono';font-style:normal;font-weight:700;font-display:swap;src:url('../assets/fonts/JetBrainsMono-400-latin.woff2') format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:'JetBrains Mono';font-style:normal;font-weight:700;font-display:swap;src:url('../assets/fonts/JetBrainsMono-400-latin-ext.woff2') format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF}
@font-face{font-family:'Poppins';font-style:italic;font-weight:400;font-display:swap;src:url('../assets/fonts/Poppins-400-italic-latin.woff2') format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:'Poppins';font-style:italic;font-weight:400;font-display:swap;src:url('../assets/fonts/Poppins-400-italic-latin-ext.woff2') format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF}
@font-face{font-family:'Poppins';font-style:italic;font-weight:500;font-display:swap;src:url('../assets/fonts/Poppins-500-italic-latin.woff2') format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:'Poppins';font-style:italic;font-weight:500;font-display:swap;src:url('../assets/fonts/Poppins-500-italic-latin-ext.woff2') format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF}
@font-face{font-family:'Poppins';font-style:normal;font-weight:400;font-display:swap;src:url('../assets/fonts/Poppins-400-latin.woff2') format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:'Poppins';font-style:normal;font-weight:400;font-display:swap;src:url('../assets/fonts/Poppins-400-latin-ext.woff2') format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF}
@font-face{font-family:'Poppins';font-style:normal;font-weight:500;font-display:swap;src:url('../assets/fonts/Poppins-500-latin.woff2') format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:'Poppins';font-style:normal;font-weight:500;font-display:swap;src:url('../assets/fonts/Poppins-500-latin-ext.woff2') format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF}
@font-face{font-family:'Poppins';font-style:normal;font-weight:600;font-display:swap;src:url('../assets/fonts/Poppins-600-latin.woff2') format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:'Poppins';font-style:normal;font-weight:600;font-display:swap;src:url('../assets/fonts/Poppins-600-latin-ext.woff2') format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF}
@font-face{font-family:'Poppins';font-style:normal;font-weight:700;font-display:swap;src:url('../assets/fonts/Poppins-700-latin.woff2') format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:'Poppins';font-style:normal;font-weight:700;font-display:swap;src:url('../assets/fonts/Poppins-700-latin-ext.woff2') format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF}
@font-face{font-family:'Poppins';font-style:normal;font-weight:800;font-display:swap;src:url('../assets/fonts/Poppins-800-latin.woff2') format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:'Poppins';font-style:normal;font-weight:800;font-display:swap;src:url('../assets/fonts/Poppins-800-latin-ext.woff2') format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF}

/* Filsa — Color tokens (dark-first, AI gradient brand)
 * The brand is the gradient speech-bubble: green -> cyan -> blue -> violet -> purple,
 * shown on near-black. Surfaces are dark; the gradient is the signature accent.
 */

:root {
  /* ============ Brand gradient stops (sampled from the mark) ============ */
  --c-green:  #7CEA8A;
  --c-mint:   #6FE0A8;
  --c-cyan:   #5FD3D6;
  --c-blue:   #77B2EE;
  --c-violet: #A98EF9;
  --c-purple: #B983FD;

  /* Signature gradient — top-right green to bottom-left purple, like the logo */
  --gradient-brand: linear-gradient(217deg, #7CEA8A 0%, #6FD9B0 24%, #77B2EE 54%, #A98EF9 80%, #B983FD 100%); /* @kind color */
  --gradient-brand-soft: linear-gradient(217deg, rgba(124,234,138,0.18), rgba(119,178,238,0.18) 54%, rgba(185,131,253,0.18)); /* @kind color */
  --gradient-text: linear-gradient(110deg, #8DEDA0 0%, #77B2EE 50%, #C29CFA 100%); /* @kind color */

  /* ============ Neutrals (dark) ============ */
  --n-0:  #0A0A0C;   /* app background */
  --n-1:  #141417;   /* card */
  --n-2:  #1C1C21;   /* raised card */
  --n-3:  #26262C;   /* input / control */
  --n-4:  #34343C;   /* track / hairline-strong */
  --n-5:  #4A4A53;
  --n-6:  #76767F;   /* muted text */
  --n-7:  #ADADB6;   /* secondary text */
  --n-8:  #D6D6DA;
  --n-9:  #F3F2EE;   /* primary text / off-white (matches wordmark) */
  --white: #FFFFFF;
  --black: #0A0A0C;

  /* ============ Accent (solid) — periwinkle blend of blue+violet ============ */
  --accent-strong: #A2AEF7;
  --accent:        #8E9DF4;
  --accent-deep:   #6E7CE8;
  --accent-fg:     #AEB8F8;   /* bright accent text on dark */

  /* ============ Finance semantics (bright-on-dark) ============ */
  --positive: #4ED99A;
  --negative: #F87171;
  --pending:  #F2B33C;
  --info:     #77B2EE;

  /* ============ Semantic aliases ============ */
  /* Surfaces */
  --bg-app:          var(--n-0);
  --surface-card:    var(--n-1);
  --surface-raised:  var(--n-2);
  --surface-sunken:  #0F0F12;
  --surface-inverse: var(--n-9);   /* rare LIGHT surface (e.g. highlight chip/card) */

  /* Text */
  --text-primary:   var(--n-9);
  --text-secondary: var(--n-7);
  --text-muted:     var(--n-6);
  --text-faint:     var(--n-5);
  --text-inverse:   var(--n-0);    /* text on a light surface */
  --text-on-accent: #0B0B12;       /* dark text on bright accent/gradient */

  /* Borders */
  --border-subtle: rgba(255,255,255,0.07);
  --border-strong: rgba(255,255,255,0.13);
  --border-focus:  var(--accent);

  /* Accent roles */
  --accent-hover:    var(--accent-strong);
  --accent-tint:     rgba(142,157,244,0.16);
  --accent-contrast: var(--text-on-accent);

  /* Financial roles + tints */
  --positive-tint: rgba(78,217,154,0.15);
  --negative-tint: rgba(248,113,113,0.15);
  --pending-tint:  rgba(242,179,60,0.15);
  --info-tint:     rgba(119,178,238,0.15);

  /* Focus ring */
  --ring: 0 0 0 3px rgba(142,157,244,0.32);

  /* ===== Legacy ramp names, remapped to dark-appropriate values =====
     (so existing components keep rendering correctly on dark) */
  --green-700: #5FE0A0;  --green-500: #4ED99A;  --green-300: #8DEDA0;  --green-100: rgba(78,217,154,0.15);
  --coral-600: #FF8E8E;  --coral-500: #F87171;  --coral-100: rgba(248,113,113,0.15);
  --amber-600: #F5C46A;  --amber-500: #F2B33C;  --amber-100: rgba(242,179,60,0.15);
  --blue-600:  #9CC6F5;  --blue-500:  #77B2EE;  --blue-100:  rgba(119,178,238,0.15);
  --ink-900: #0A0A0C;  --ink-800: #141417;  --ink-700: #26262C;  --ink-600: #76767F;
  --ink-500: #76767F;  --ink-400: #54545C;  --ink-300: #34343C;
  --paper-50: #1C1C21; --paper-100: #141417; --paper-200: #1C1C21; --paper-300: rgba(255,255,255,0.07);
  --paper-400: #34343C;
}

/* Filsa Business — Typography tokens */

:root {
  /* Families — Poppins is the Filsa brand font */
  --font-display: 'Poppins', system-ui, sans-serif;
  --font-sans:    'Poppins', system-ui, -apple-system, sans-serif;
  --font-mono:    'JetBrains Mono', ui-monospace, 'SF Mono', monospace;

  /* Type scale (px) — display uses --font-display, the rest --font-sans */
  --text-display-xl: 48px;  /* hero balance, marketing */
  --text-display-lg: 40px;
  --text-h1: 32px;
  --text-h2: 26px;
  --text-h3: 21px;
  --text-h4: 18px;
  --text-body-lg: 18px;
  --text-body: 16px;
  --text-body-sm: 14px;
  --text-caption: 13px;
  --text-micro: 11px;

  /* Line heights */
  --leading-tight: 1.1;
  --leading-snug: 1.25;
  --leading-normal: 1.5;
  --leading-relaxed: 1.65;

  /* Weights */
  --weight-regular: 400;
  --weight-medium: 500;
  --weight-semibold: 600;
  --weight-bold: 700;
  --weight-extrabold: 800;

  /* Letter spacing */
  --tracking-tight: -0.02em;   /* display & large headings */
  --tracking-snug: -0.01em;
  --tracking-normal: 0;
  --tracking-wide: 0.04em;     /* eyebrows / labels (uppercase) */
  --tracking-wider: 0.12em;
}

/* Filsa Business — Spacing & layout tokens (4px base grid) */

:root {
  --space-0: 0;
  --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: 48px;
  --space-10: 64px;
  --space-11: 80px;
  --space-12: 96px;

  /* Component paddings */
  --pad-card: 20px;
  --pad-screen: 20px;     /* mobile screen gutter */
  --gap-list: 12px;

  /* Layout */
  --screen-max: 430px;    /* mobile design width */
  --tabbar-h: 84px;
}

/* Filsa Business — Radius & shadow tokens
 * Approachable fintech: generous rounding, soft warm shadows (no harsh black).
 */

:root {
  /* Corner radii */
  --radius-xs: 6px;
  --radius-sm: 10px;
  --radius-md: 14px;
  --radius-lg: 20px;     /* cards */
  --radius-xl: 28px;     /* sheets, large panels */
  --radius-2xl: 36px;
  --radius-pill: 999px;  /* buttons, chips, avatars */

  /* Shadows — deep black for dark surfaces */
  --shadow-xs: 0 1px 2px rgba(0, 0, 0, 0.30);
  --shadow-sm: 0 2px 8px rgba(0, 0, 0, 0.36);
  --shadow-md: 0 8px 24px rgba(0, 0, 0, 0.42);
  --shadow-lg: 0 18px 44px rgba(0, 0, 0, 0.50);
  --shadow-xl: 0 32px 70px rgba(0, 0, 0, 0.60);

  /* Brand glows */
  --shadow-accent: 0 10px 30px rgba(110, 124, 232, 0.40);
  --shadow-glow:   0 12px 40px rgba(119, 178, 238, 0.32);

  /* Hairline border helper */
  --hairline: 1px solid var(--border-subtle);
}

/* Filsa — Base resets & primitives (dark, AI brand) */

*, *::before, *::after { box-sizing: border-box; }

html { -webkit-text-size-adjust: 100%; }

body {
  margin: 0;
  font-family: var(--font-sans);
  font-size: var(--text-body);
  line-height: var(--leading-normal);
  color: var(--text-primary);
  background: var(--bg-app);
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
  font-feature-settings: "ss01" on, "cv01" on;
}

h1, h2, h3, h4, h5 {
  font-family: var(--font-display);
  font-weight: var(--weight-semibold);
  letter-spacing: var(--tracking-tight);
  line-height: var(--leading-tight);
  margin: 0;
  color: var(--text-primary);
}

p { margin: 0; }
a { color: var(--accent-fg); text-decoration: none; }
button { font-family: inherit; }

::selection { background: rgba(142,157,244,0.32); color: #fff; }

/* Tabular figures for any money/ledger numerals */
.tnum, .money { font-variant-numeric: tabular-nums; }

/* Money amounts use the mono family for crisp alignment */
.amount {
  font-family: var(--font-mono);
  font-variant-numeric: tabular-nums;
  letter-spacing: -0.01em;
}

/* Eyebrow / label helper */
.eyebrow {
  font-size: var(--text-caption);
  font-weight: var(--weight-semibold);
  letter-spacing: var(--tracking-wide);
  text-transform: uppercase;
  color: var(--text-muted);
}

/* Brand gradient utilities */
.gradient-text {
  background: var(--gradient-text);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}
.gradient-surface { background: var(--gradient-brand); }
.gradient-ring {
  background: var(--gradient-brand);
  padding: 1px;
  border-radius: inherit;
}


/* Filsa — LIGHT theme token scope
 * Dark stays the default (:root, from the design system).
 * Apply light by scoping: <div data-theme="light"> … </div>  or  <html data-theme="light">
 * Load AFTER the design system's styles.css.
 */

[data-theme="light"] {
  /* ============ Neutrals (light, warm paper — matches the wordmark off-white) ============ */
  --n-0:  #F7F6F2;   /* app background */
  --n-1:  #FFFFFF;   /* card */
  --n-2:  #FFFFFF;   /* raised card */
  --n-3:  #F0EFEA;   /* input / control */
  --n-4:  #E2E1DA;   /* track */
  --n-5:  #B6B5AE;
  --n-6:  #5F5F68;   /* muted text — 4.5:1 on white */
  --n-7:  #55555F;   /* secondary text */
  --n-8:  #2C2C34;
  --n-9:  #14141A;   /* primary text */

  /* ============ Surfaces ============ */
  --bg-app:          var(--n-0);
  --surface-card:    #FFFFFF;
  --surface-raised:  #FFFFFF;
  --surface-sunken:  #EFEEE9;
  --surface-inverse: #141417;   /* rare DARK highlight chip/card on light */

  /* ============ Text ============ */
  --text-primary:   #14141A;
  --text-secondary: #55555F;
  --text-muted:     #5F5F68;
  --text-faint:     #767680;
  --text-inverse:   #F3F2EE;    /* text on the dark inverse surface */
  --text-on-accent: #0B0B12;    /* unchanged: the brand gradient stays bright */

  /* ============ Borders ============ */
  --border-subtle: rgba(16,16,28,0.09);
  --border-strong: rgba(16,16,28,0.16);
  --border-focus:  var(--accent);

  /* ============ Accent — Filsa green (#4ED99A) / teal (#00C7BE) ============ */
  --accent:        #00C7BE;   /* brand teal — fills, switches, meters */
  --accent-strong: #4ED99A;   /* brand green — hover / lighter step */
  --accent-deep:   #00918B;
  --accent-fg:     #00726D;   /* links & accent text: 4.6:1 on white */
  --accent-hover:  var(--accent-strong);
  --accent-tint:   rgba(0,199,190,0.12);
  --accent-contrast: #04302E;   /* deep teal-black text on bright teal fills */

  /* ============ Finance semantics (dark-on-light) ============ */
  --positive: #0A6E4C;
  --negative: #D24545;
  --pending:  #A9741A;
  --info:     #2A6FB5;
  --positive-tint: rgba(10,110,76,0.10);
  --negative-tint: rgba(210,69,69,0.10);
  --pending-tint:  rgba(169,116,26,0.12);
  --info-tint:     rgba(42,111,181,0.10);

  /* ============ Gradient ============ */
  /* --gradient-brand is untouched — it is the brand asset and stays identical. */
  --gradient-brand-soft: linear-gradient(217deg, rgba(124,234,138,0.22), rgba(119,178,238,0.22) 54%, rgba(185,131,253,0.22));
  /* Text fill needs deeper stops to stay legible on paper */
  --gradient-text: linear-gradient(110deg, #1F9A63 0%, #2F76D6 50%, #8348DE 100%);

  /* ============ Elevation — soft blue-grey, not black ============ */
  --shadow-xs: 0 1px 2px rgba(20,20,40,0.05);
  --shadow-sm: 0 2px 8px rgba(20,20,40,0.07);
  --shadow-md: 0 8px 24px rgba(20,20,40,0.08);
  --shadow-lg: 0 18px 44px rgba(20,20,40,0.11);
  --shadow-xl: 0 32px 70px rgba(20,20,40,0.14);
  --shadow-accent: 0 10px 30px rgba(0,199,190,0.30);
  --shadow-glow:   0 12px 40px rgba(119,178,238,0.30);

  --ring: 0 0 0 3px rgba(0,199,190,0.28);

  /* ===== Legacy ramp names, remapped for light ===== */
  --green-700: #0B7A53;  --green-500: #0E8A5E;  --green-300: #57C495;  --green-100: rgba(14,138,94,0.10);
  --coral-600: #B93A3A;  --coral-500: #D24545;  --coral-100: rgba(210,69,69,0.10);
  --amber-600: #8C5F14;  --amber-500: #A9741A;  --amber-100: rgba(169,116,26,0.12);
  --blue-600:  #235C97;  --blue-500:  #2A6FB5;  --blue-100:  rgba(42,111,181,0.10);
  --ink-900: #14141A;  --ink-800: #2C2C34;  --ink-700: #55555F;  --ink-600: #5F5F68;
  --ink-500: #5F5F68;  --ink-400: #767680;  --ink-300: #E2E1DA;
  --paper-50: #FBFAF7; --paper-100: #F7F6F2; --paper-200: #F0EFEA; --paper-300: rgba(16,16,28,0.09);
  --paper-400: #E2E1DA;
}

/* Light surfaces need a lighter selection + link color */
[data-theme="light"] ::selection { background: rgba(0,199,190,0.22); color: #14141A; }
[data-theme="light"] a { color: var(--accent-fg); }