/* Grapes v2 · jetons, copiés du design system Grapes (claude.ai/artifact/SaDRqsYUdiCCEzkTyChLMi).
   Clair par défaut, sombre selon le réglage du visiteur ; data-theme force l'un ou l'autre. */
:root {
  --paper: #F2F4F8;
  --paper-raised: #FFFFFF;
  --paper-sunken: #E8ECF2;
  --night: #070C18;
  --night-raised: #111A2E;
  --ink: #0B1424;
  --ink-2: #3E4A5E;
  --ink-3: #5B6679;
  --ink-quiet: #7D879A;
  --ink-quiet-top: #66718A;
  --on-night: #EEF1F7;
  --on-night-2: #9AA6BA;
  --line: #0B142414;
  --line-strong: #0B142426;
  --line-control: #7D879A;
  --accent: #2447F5;
  --accent-strong: #1A36D6;
  --on-accent: #FFFFFF;
  --accent-text: #2447F5;
  --accent-tint: #E6ECFF;
  --accent-on-night: #8FA8FF;
  --halo: #9DB2FF;
  --focus: #2447F5;
  --positive: #0F7A50;
  --positive-tint: #E3F4EC;
  --caution: #9A5800;
  --caution-tint: #FFF1DD;
  --critical: #C2342B;
  --critical-tint: #FDE8E6;
  --shadow-card: inset 0 1px 0 0 rgba(255,255,255,0.9), 0 1px 2px 0 rgba(11,20,36,0.04), 0 14px 36px -6px rgba(11,20,36,0.08);
  --shadow-float: inset 0 1px 0 0 rgba(255,255,255,0.7), 0 2px 6px 0 rgba(11,20,36,0.05), 0 10px 28px -8px rgba(11,20,36,0.14);
  --shadow-glow: 0 10px 30px -8px rgba(36,71,245,0.45);
  --shadow-press: inset 0 1px 0 0 rgba(255,255,255,0.16), inset 0 -1px 0 0 rgba(0,0,0,0.2);
  --space-4: 4px;
  --space-8: 8px;
  --space-12: 12px;
  --space-16: 16px;
  --space-20: 20px;
  --space-24: 24px;
  --space-28: 28px;
  --space-32: 32px;
  --space-40: 40px;
  --space-48: 48px;
  --space-64: 64px;
  --space-104: 104px;
  --space-144: 144px;
  --radius-xs: 6px;
  --radius-sm: 10px;
  --radius-md: 16px;
  --radius-lg: 28px;
  --radius-xl: 36px;
  --radius-pill: 9999px;
  --layout-wrap: 1120px;
  --layout-measure: 640px;
  --layout-nav: 64px;
  --duration-fast: 160ms;
  --duration-base: 320ms;
  --duration-slow: 600ms;
  --duration-loop: 9000ms;
  --ease-out: cubic-bezier(0.2, 0.7, 0.2, 1);
  --ease-in-out: cubic-bezier(0.65, 0, 0.35, 1);
  --font-sans: Manrope, "Helvetica Neue", Arial, system-ui, sans-serif;
  color-scheme: light;
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
  --paper: #070B14;
  --paper-raised: #0F1626;
  --paper-sunken: #0B111E;
  --night: #0E1735;
  --night-raised: #16204A;
  --ink: #F1F4FA;
  --ink-2: #C3CBDA;
  --ink-3: #98A3B7;
  --ink-quiet: #6F7B92;
  --ink-quiet-top: #C9D0DC;
  --on-night: #EEF1F7;
  --on-night-2: #A9B4C8;
  --line: #E8EDF714;
  --line-strong: #E8EDF729;
  --line-control: #6E7A90;
  --accent: #3354FF;
  --accent-strong: #2945EE;
  --on-accent: #FFFFFF;
  --accent-text: #8FA8FF;
  --accent-tint: #16224A;
  --accent-on-night: #8FA8FF;
  --halo: #3D5BFF;
  --focus: #8FA8FF;
  --positive: #4CC991;
  --positive-tint: #0F2A21;
  --caution: #F0A84A;
  --caution-tint: #2E2210;
  --critical: #FF8A80;
  --critical-tint: #34171A;
  --shadow-card: inset 0 1px 0 0 rgba(255,255,255,0.05), 0 1px 2px 0 rgba(0,0,0,0.4), 0 18px 44px -10px rgba(0,0,0,0.6);
  --shadow-float: inset 0 1px 0 0 rgba(255,255,255,0.06), 0 2px 6px 0 rgba(0,0,0,0.4), 0 12px 32px -8px rgba(0,0,0,0.7);
  --shadow-glow: 0 12px 38px -8px rgba(61,91,255,0.6);
  --shadow-press: inset 0 1px 0 0 rgba(255,255,255,0.5), inset 0 -1px 0 0 rgba(7,11,20,0.12);
    color-scheme: dark;
  }
}
:root[data-theme="dark"] {
  --paper: #070B14;
  --paper-raised: #0F1626;
  --paper-sunken: #0B111E;
  --night: #0E1735;
  --night-raised: #16204A;
  --ink: #F1F4FA;
  --ink-2: #C3CBDA;
  --ink-3: #98A3B7;
  --ink-quiet: #6F7B92;
  --ink-quiet-top: #C9D0DC;
  --on-night: #EEF1F7;
  --on-night-2: #A9B4C8;
  --line: #E8EDF714;
  --line-strong: #E8EDF729;
  --line-control: #6E7A90;
  --accent: #3354FF;
  --accent-strong: #2945EE;
  --on-accent: #FFFFFF;
  --accent-text: #8FA8FF;
  --accent-tint: #16224A;
  --accent-on-night: #8FA8FF;
  --halo: #3D5BFF;
  --focus: #8FA8FF;
  --positive: #4CC991;
  --positive-tint: #0F2A21;
  --caution: #F0A84A;
  --caution-tint: #2E2210;
  --critical: #FF8A80;
  --critical-tint: #34171A;
  --shadow-card: inset 0 1px 0 0 rgba(255,255,255,0.05), 0 1px 2px 0 rgba(0,0,0,0.4), 0 18px 44px -10px rgba(0,0,0,0.6);
  --shadow-float: inset 0 1px 0 0 rgba(255,255,255,0.06), 0 2px 6px 0 rgba(0,0,0,0.4), 0 12px 32px -8px rgba(0,0,0,0.7);
  --shadow-glow: 0 12px 38px -8px rgba(61,91,255,0.6);
  --shadow-press: inset 0 1px 0 0 rgba(255,255,255,0.5), inset 0 -1px 0 0 rgba(7,11,20,0.12);
  color-scheme: dark;
}
