/* Cutout design tokens — generated from tokens.json. Themes: light, dark (default: light).
   Switch theme with <html data-theme="dark">. */
:root, [data-theme="light"] {
  --page: #f3ead9;
  --page-ink: #1c2340;
  --page-ink-soft: #585c70;
  --paper: #fffaf0;
  --paper-sunk: #ebdfcb;
  --ink: #1c2340;
  --ink-soft: #575b6e;
  --cobalt: #2944c2;
  --coral: #ee6b52;
  --ochre: #eaa92b;
  --leaf: #4aa871;
  --on-pigment: #fffaf0;
  --focus: #2944c2;
  --shadow-rest: 0 1px 1px #1c23401f, 0 3px 6px -2px #1c23402e, 0 8px 14px -10px #1c234040;
  --shadow-lift: 0 2px 2px #1c23401a, 0 14px 22px -10px #1c234059, 0 26px 38px -20px #1c234040;
  --shadow-flat: 0 0 0 1px #1c234014;
  --shadow-slot: inset 0 1px 2px #1c23402e, inset 0 0 0 1px #1c23400f;
  --shadow-float: 0 3px 4px #1c23401f, 0 24px 48px -16px #1c234066;
  color-scheme: light;
}
[data-theme="dark"] {
  --page: #131b3b;
  --page-ink: #f4ecdc;
  --page-ink-soft: #aeb6d4;
  --paper: #f1e7d3;
  --paper-sunk: #d8cab0;
  --ink: #1c2340;
  --ink-soft: #4d5165;
  --cobalt: #3a56dc;
  --coral: #f27a61;
  --ochre: #f0b43a;
  --leaf: #55b37b;
  --on-pigment: #fffaf0;
  --focus: #f0b43a;
  --shadow-rest: 0 1px 1px #00000059, 0 4px 8px -2px #00000073, 0 10px 18px -10px #00000099;
  --shadow-lift: 0 2px 2px #00000052, 0 16px 26px -10px #000000a6, 0 30px 44px -20px #00000080;
  --shadow-flat: 0 0 0 1px #00000033;
  --shadow-slot: inset 0 1px 2px #1c234059, inset 0 0 0 1px #1c23401a;
  --shadow-float: 0 3px 4px #00000066, 0 28px 56px -16px #000000b3;
  color-scheme: dark;
}
:root {
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-6: 24px;
  --space-10: 40px;
  --radius-sm: 7px 10px 6px 9px / 9px 6px 10px 7px;
  --radius-md: 12px 17px 11px 15px / 15px 11px 17px 12px;
  --radius-lg: 20px 28px 18px 26px / 26px 18px 28px 20px;
  --radius-round: 50% 47% 52% 48% / 48% 53% 47% 52%;
  --font-display: "Fraunces", "Iowan Old Style", Georgia, serif;
  --font-body: "Jost", "Futura", ui-sans-serif, system-ui, sans-serif;
  --type-display-family: var(--font-display);
  --type-display-size: 56px;
  --type-display-line: 58px;
  --type-display-weight: 600;
  --type-display-tracking: -0.02em;
  --type-title-family: var(--font-display);
  --type-title-size: 32px;
  --type-title-line: 38px;
  --type-title-weight: 600;
  --type-title-tracking: -0.01em;
  --type-heading-family: var(--font-display);
  --type-heading-size: 21px;
  --type-heading-line: 26px;
  --type-heading-weight: 600;
  --type-body-family: var(--font-body);
  --type-body-size: 16px;
  --type-body-line: 24px;
  --type-body-weight: 400;
  --type-label-family: var(--font-body);
  --type-label-size: 15px;
  --type-label-line: 20px;
  --type-label-weight: 500;
  --type-label-tracking: 0.01em;
  --type-caption-family: var(--font-body);
  --type-caption-size: 12px;
  --type-caption-line: 16px;
  --type-caption-weight: 500;
  --type-caption-tracking: 0.06em;
}
/* Type styles as utility classes (optional) */
.type-display { font-family: var(--type-display-family); font-size: var(--type-display-size); line-height: var(--type-display-line); font-weight: var(--type-display-weight); letter-spacing: var(--type-display-tracking); }
.type-title { font-family: var(--type-title-family); font-size: var(--type-title-size); line-height: var(--type-title-line); font-weight: var(--type-title-weight); letter-spacing: var(--type-title-tracking); }
.type-heading { font-family: var(--type-heading-family); font-size: var(--type-heading-size); line-height: var(--type-heading-line); font-weight: var(--type-heading-weight); }
.type-body { font-family: var(--type-body-family); font-size: var(--type-body-size); line-height: var(--type-body-line); font-weight: var(--type-body-weight); }
.type-label { font-family: var(--type-label-family); font-size: var(--type-label-size); line-height: var(--type-label-line); font-weight: var(--type-label-weight); letter-spacing: var(--type-label-tracking); }
.type-caption { font-family: var(--type-caption-family); font-size: var(--type-caption-size); line-height: var(--type-caption-line); font-weight: var(--type-caption-weight); letter-spacing: var(--type-caption-tracking); }
