/* Generated by dev/scripts/design-system.mjs from preset `sakura`. Do not edit by hand —
 * change dev/docs/design-tokens.json and re-render, so the doc, the json and this file agree. */
:root {
  --color-bg: #fff8fa;
  --color-surface: #ffffff;
  --color-surface-2: #fdeef3;
  --color-border: #f3d6e0;
  --color-border-strong: #a8738a;
  --color-text: #2b1d24;
  --color-text-muted: #6b4f5c;
  --color-primary: #b8336a;
  --color-primary-hover: #962a56;
  --color-primary-fg: #ffffff;
  --color-success: #2e7d4f;
  --color-warning: #9a5a00;
  --color-danger: #b3261e;
  --color-danger-fg: #ffffff;
  --color-info: #3a5fa8;
  --color-focus: #b8336a;
  --color-tint-success: #e6efea;
  --color-tint-warning: #f3ebe0;
  --color-tint-danger: #f6e5e4;
  --color-tint-info: #e7ecf5;
  --color-code-highlight: #eae0ec;
  --color-code-keyword: #b23267;
  --color-code-string: #2e7049;
  --color-code-function: #3a5fa8;
  --color-code-number: #915503;
  --color-code-comment: #6b4f5c;
  --color-fox-ink: #2b1d24;
  --color-fox-white: #ffffff;
  --color-fox-shadow: #000000;
  --color-fox-coral: #c2345f;
  --color-fox-ember: #e2663f;
  --color-fox-rust: #f07a45;
  --color-fox-rust-2: #f47a45;
  --color-fox-flame: #f2804a;
  --color-fox-orange: #ff8a4c;
  --color-fox-tangerine: #ff9a5c;
  --color-fox-apricot: #ff9c66;
  --color-fox-peach: #ffad78;
  --color-fox-blush: #ffc4a3;
  --color-fox-blush-2: #ffd2b8;
  --color-fox-blush-3: #ffd6bf;
  --color-fox-cream: #ffe0cc;
  --color-fox-cream-2: #ffe6d6;
  --color-fox-cream-3: #fff1e8;
  --color-fox-cream-4: #fff4ec;
  --color-fox-laptop-lid: #4a3540;
  --color-fox-laptop-screen: #5b4450;
  --color-fox-laptop-base: #3a2a32;
  --font-sans: "Zen Kaku Gothic New", "Source Sans 3", system-ui, sans-serif;
  --font-mono: "Source Code Pro", ui-monospace, Menlo, monospace;
  --font-display: "M PLUS Rounded 1c", "Nunito", ui-rounded, system-ui, sans-serif;
  --text-xs: 13px;
  --leading-xs: 1.5;
  --text-sm: 15px;
  --leading-sm: 1.6;
  --text-md: 18px;
  --leading-md: 1.7;
  --text-lg: 21px;
  --leading-lg: 1.5;
  --text-xl: 26px;
  --leading-xl: 1.3;
  --text-2xl: 34px;
  --leading-2xl: 1.2;
  --text-3xl: 48px;
  --leading-3xl: 1.1;
  --weight-regular: 400;
  --weight-medium: 500;
  --weight-semibold: 600;
  --weight-bold: 700;
  --space-0: 0px;
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 24px;
  --space-6: 32px;
  --space-7: 48px;
  --space-8: 64px;
  --space-9: 96px;
  --space-10: 128px;
  --radius-none: 0px;
  --radius-sm: 4px;
  --radius-md: 16px;
  --radius-lg: 20px;
  --radius-xl: 32px;
  --radius-full: 9999px;
  --shadow-0: none;
  --shadow-1: none;
  --shadow-2: 0 1px 3px rgb(26 26 26 / 0.08);
  --shadow-3: 0 8px 24px rgb(26 26 26 / 0.10);
  --shadow-sm: var(--shadow-1);
  --shadow-md: var(--shadow-2);
  --shadow-lg: var(--shadow-3);
  --motion-fast: 120ms;
  --motion-base: 200ms;
  --motion-slow: 400ms;
  --motion-easing: cubic-bezier(0.25, 0.1, 0.25, 1);
  --control-height-sm: 36px;
  --control-height-md: 44px;
  --control-height-lg: 52px;
  --control-row-height: 52px;
  --control-target-min: 24px;
  --control-sidebar-width: 260px;
  --control-content-max: 720px;
  --color-scrim: rgba(9, 9, 11, 0.45);
  --type-display-size: 48px;
  --type-display-line: 1.1;
  --type-display-weight: 700;
  --type-display-tracking: -0.02em;
  --type-h1-size: 38px;
  --type-h1-line: 1.2;
  --type-h1-weight: 600;
  --type-h1-tracking: -0.015em;
  --type-h2-size: 30px;
  --type-h2-line: 1.25;
  --type-h2-weight: 600;
  --type-h2-tracking: -0.01em;
  --type-h3-size: 24px;
  --type-h3-line: 1.35;
  --type-h3-weight: 600;
  --type-h3-tracking: 0em;
  --type-body-size: 18px;
  --type-body-line: 1.5;
  --type-body-weight: 400;
  --type-body-tracking: 0em;
  --type-small-size: 15px;
  --type-small-line: 1.45;
  --type-small-weight: 400;
  --type-small-tracking: 0.005em;
  --type-mono-size: 15px;
  --type-mono-line: 1.5;
  --type-mono-weight: 400;
  --type-mono-tracking: 0em;
  --type-tabular-size: 18px;
  --type-tabular-line: 1.5;
  --type-tabular-weight: 400;
  --type-tabular-tracking: 0em;
  --neutral-50: #fafaf9;
  --neutral-100: #f5f5f4;
  --neutral-200: #e7e5e4;
  --neutral-300: #d6d3d1;
  --neutral-400: #a8a29e;
  --neutral-500: #78716c;
  --neutral-600: #57534e;
  --neutral-700: #44403c;
  --neutral-800: #292524;
  --neutral-900: #1c1917;
  --neutral-950: #0c0a09;
  --dataviz-1: #2a78d6;
  --dataviz-2: #eb6834;
  --dataviz-3: #1baf7a;
  --dataviz-4: #c98500;
  --dataviz-5: #e87ba4;
  --dataviz-6: #008300;
  --dataviz-7: #6250d6;
  --dataviz-8: #e34948;
  --icon-sm: 16px;
  --icon-md: 18px;
  --icon-lg: 24px;
  --icon-stroke: 1.5;
  --density-row-height: 52px;
  --density-control-height: 44px;
  --density-cell-pad-x: 20px;
  --density-cell-pad-y: 16px;
  color-scheme: light;
}
[data-density="spacious"] {
  --density-row-height: 52px;
  --density-control-height: 44px;
  --density-cell-pad-x: 20px;
  --density-cell-pad-y: 16px;
}
[data-density="comfortable"] {
  --density-row-height: 44px;
  --density-control-height: 40px;
  --density-cell-pad-x: 16px;
  --density-cell-pad-y: 12px;
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --color-bg: #1c1418;
    --color-surface: #251a20;
    --color-surface-2: #31222a;
    --color-border: #3d2b34;
    --color-border-strong: #9a7686;
    --color-text: #f7e8ee;
    --color-text-muted: #c9a9b7;
    --color-primary: #f49bbf;
    --color-primary-hover: #f8bdd4;
    --color-primary-fg: #2b0d1a;
    --color-success: #7fd1a0;
    --color-warning: #f0b35a;
    --color-danger: #f28b82;
    --color-danger-fg: #2b0a07;
    --color-info: #9db8f0;
    --color-focus: #f8bdd4;
    --color-tint-success: #353b37;
    --color-tint-warning: #4a362a;
    --color-tint-danger: #4a2e32;
    --color-tint-info: #3b3645;
    --color-code-highlight: #423a4a;
    --color-code-keyword: #f49bbf;
    --color-code-string: #7fd1a0;
    --color-code-function: #9db8f0;
    --color-code-number: #f0b35a;
    --color-code-comment: #c9a9b7;
    --color-fox-ink: #2b1d24;
    --color-fox-white: #ffffff;
    --color-fox-shadow: #000000;
    --color-fox-coral: #c2345f;
    --color-fox-ember: #e2663f;
    --color-fox-rust: #f07a45;
    --color-fox-rust-2: #f47a45;
    --color-fox-flame: #f2804a;
    --color-fox-orange: #ff8a4c;
    --color-fox-tangerine: #ff9a5c;
    --color-fox-apricot: #ff9c66;
    --color-fox-peach: #ffad78;
    --color-fox-blush: #ffc4a3;
    --color-fox-blush-2: #ffd2b8;
    --color-fox-blush-3: #ffd6bf;
    --color-fox-cream: #ffe0cc;
    --color-fox-cream-2: #ffe6d6;
    --color-fox-cream-3: #fff1e8;
    --color-fox-cream-4: #fff4ec;
    --color-fox-laptop-lid: #4a3540;
    --color-fox-laptop-screen: #5b4450;
    --color-fox-laptop-base: #3a2a32;
    --color-scrim: rgba(0, 0, 0, 0.6);
    --shadow-0: none;
    --shadow-1: none;
    --shadow-2: 0 1px 3px rgb(0 0 0 / 0.5);
    --shadow-3: 0 8px 24px rgb(0 0 0 / 0.6);
    --shadow-sm: var(--shadow-1);
    --shadow-md: var(--shadow-2);
    --shadow-lg: var(--shadow-3);
    --dataviz-1: #3987e5;
    --dataviz-2: #d95926;
    --dataviz-3: #199e70;
    --dataviz-4: #c98500;
    --dataviz-5: #d55181;
    --dataviz-6: #008300;
    --dataviz-7: #9085e9;
    --dataviz-8: #e66767;
    color-scheme: dark;
  }
}
:root[data-theme="dark"] {
  --color-bg: #1c1418;
  --color-surface: #251a20;
  --color-surface-2: #31222a;
  --color-border: #3d2b34;
  --color-border-strong: #9a7686;
  --color-text: #f7e8ee;
  --color-text-muted: #c9a9b7;
  --color-primary: #f49bbf;
  --color-primary-hover: #f8bdd4;
  --color-primary-fg: #2b0d1a;
  --color-success: #7fd1a0;
  --color-warning: #f0b35a;
  --color-danger: #f28b82;
  --color-danger-fg: #2b0a07;
  --color-info: #9db8f0;
  --color-focus: #f8bdd4;
  --color-tint-success: #353b37;
  --color-tint-warning: #4a362a;
  --color-tint-danger: #4a2e32;
  --color-tint-info: #3b3645;
  --color-code-highlight: #423a4a;
  --color-code-keyword: #f49bbf;
  --color-code-string: #7fd1a0;
  --color-code-function: #9db8f0;
  --color-code-number: #f0b35a;
  --color-code-comment: #c9a9b7;
  --color-fox-ink: #2b1d24;
  --color-fox-white: #ffffff;
  --color-fox-shadow: #000000;
  --color-fox-coral: #c2345f;
  --color-fox-ember: #e2663f;
  --color-fox-rust: #f07a45;
  --color-fox-rust-2: #f47a45;
  --color-fox-flame: #f2804a;
  --color-fox-orange: #ff8a4c;
  --color-fox-tangerine: #ff9a5c;
  --color-fox-apricot: #ff9c66;
  --color-fox-peach: #ffad78;
  --color-fox-blush: #ffc4a3;
  --color-fox-blush-2: #ffd2b8;
  --color-fox-blush-3: #ffd6bf;
  --color-fox-cream: #ffe0cc;
  --color-fox-cream-2: #ffe6d6;
  --color-fox-cream-3: #fff1e8;
  --color-fox-cream-4: #fff4ec;
  --color-fox-laptop-lid: #4a3540;
  --color-fox-laptop-screen: #5b4450;
  --color-fox-laptop-base: #3a2a32;
  --color-scrim: rgba(0, 0, 0, 0.6);
  --shadow-0: none;
  --shadow-1: none;
  --shadow-2: 0 1px 3px rgb(0 0 0 / 0.5);
  --shadow-3: 0 8px 24px rgb(0 0 0 / 0.6);
  --shadow-sm: var(--shadow-1);
  --shadow-md: var(--shadow-2);
  --shadow-lg: var(--shadow-3);
  --dataviz-1: #3987e5;
  --dataviz-2: #d95926;
  --dataviz-3: #199e70;
  --dataviz-4: #c98500;
  --dataviz-5: #d55181;
  --dataviz-6: #008300;
  --dataviz-7: #9085e9;
  --dataviz-8: #e66767;
  color-scheme: dark;
}
@media (prefers-reduced-motion: reduce) {
  :root { --motion-fast: 0ms; --motion-base: 0ms; --motion-slow: 0ms; }
}