/* Generated by scripts/build-kit-css.mjs from assets/brand/kit-two/tokens-stemmy.json (kit two).
   Do not edit by hand: change the generator and run `npm run brand:tokens`. */

/* Spacing, radius, sizes, type and motion: the same in both themes. */
:root {
  --kit-space-1: 4px;
  --kit-space-2: 8px;
  --kit-space-3: 12px;
  --kit-space-4: 16px;
  --kit-space-5: 20px;
  --kit-space-6: 24px;
  --kit-space-8: 32px;
  --kit-space-10: 40px;
  --kit-space-14: 56px;
  --kit-gutter: 16px;
  --kit-radius-xs: 6px;
  --kit-radius-md: 12px;
  --kit-radius-input: 16px;
  --kit-radius-card: 24px;
  --kit-radius-sheet: 28px;
  --kit-radius-pill: 999px;
  --kit-size-icon: 24px;
  --kit-size-touch: 48px;
  --kit-size-lookup: 56px;
  --kit-size-dash: 8px;
  --kit-font-sans: "Stemmy Figtree", system-ui, -apple-system, "Segoe UI", sans-serif;
  --kit-font-serif: "Stemmy Fraunces", "Iowan Old Style", Charter, Georgia, serif;
  --kit-display-soft: "opsz" 144, "SOFT" 100, "WONK" 1;
  --kit-type-title-size: 34px;
  --kit-type-title-line-height: 40px;
  --kit-type-title-weight: 700;
  --kit-type-numeral-xl-size: 56px;
  --kit-type-numeral-xl-line-height: 60px;
  --kit-type-numeral-xl-weight: 700;
  --kit-type-numeral-size: 40px;
  --kit-type-numeral-line-height: 44px;
  --kit-type-numeral-weight: 700;
  --kit-type-headword-size: 28px;
  --kit-type-headword-line-height: 34px;
  --kit-type-headword-weight: 600;
  --kit-type-row-word-size: 20px;
  --kit-type-row-word-line-height: 26px;
  --kit-type-row-word-weight: 600;
  --kit-type-quote-size: 17px;
  --kit-type-quote-line-height: 26px;
  --kit-type-quote-weight: 400;
  --kit-type-title-md-size: 20px;
  --kit-type-title-md-line-height: 28px;
  --kit-type-title-md-weight: 600;
  --kit-type-title-sm-size: 16px;
  --kit-type-title-sm-line-height: 24px;
  --kit-type-title-sm-weight: 600;
  --kit-type-meaning-size: 18px;
  --kit-type-meaning-line-height: 27px;
  --kit-type-meaning-weight: 400;
  --kit-type-body-size: 16px;
  --kit-type-body-line-height: 24px;
  --kit-type-body-weight: 400;
  --kit-type-body-sm-size: 15px;
  --kit-type-body-sm-line-height: 22px;
  --kit-type-body-sm-weight: 400;
  --kit-type-label-size: 14px;
  --kit-type-label-line-height: 20px;
  --kit-type-label-weight: 600;
  --kit-type-caption-size: 13px;
  --kit-type-caption-line-height: 18px;
  --kit-type-caption-weight: 400;
  --kit-type-label-sm-size: 13px;
  --kit-type-label-sm-line-height: 18px;
  --kit-type-label-sm-weight: 600;
  --kit-ease-out: cubic-bezier(.16,1,.3,1);
  --kit-dur-micro: 120ms;
  --kit-dur-short: 220ms;
  --kit-dur-long: 420ms;
}

/* Light by default. */
:root {
  color-scheme: light;
  --kit-bg: #f9f6f0;
  --kit-surface: #fefdfa;
  --kit-surface-2: #f0eae2;
  --kit-line: #e0dad0;
  --kit-outline: #7e766d;
  --kit-text: #1c2730;
  --kit-text-muted: #535c64;
  --kit-action: #7a3f50;
  --kit-on-action: #ffffff;
  --kit-hero: #c0ee61;
  --kit-on-hero: #1c2730;
  --kit-hero-pill: #1c2730;
  --kit-on-hero-pill: #f9f6f0;
  --kit-dash-on-hero: #1c273033;
  --kit-dash: #e0dad0;
  --kit-brand-text: #7a3f50;
  --kit-mark-fill: #fee5ee;
  --kit-mark-line: #8c1654;
  --kit-time: #015c5c;
  --kit-time-fill: #d9f5f3;
  --kit-on-time-fill: #015c5c;
  --kit-growth: #4f7059;
  --kit-error: #b3261e;
  --kit-focus: #1c2730;
  --kit-scrim: #1c273066;
  --kit-plum: #7a3f50;
  --kit-plum-light: #dda8b6;
  --kit-rose: #b96b7d;
  --kit-moss: #4f7059;
  --kit-moss-light: #b9d0b8;
  --kit-leaf: #c0ee61;
  --kit-petal: #fea0c5;
  --kit-petal-wash: #fee5ee;
  --kit-petal-ink: #8c1654;
  --kit-dusk: #60dbd4;
  --kit-dusk-wash: #d9f5f3;
  --kit-dusk-ink: #015c5c;
  --kit-dusk-icon: #018683;
  --kit-ink: #1c2730;
  --kit-night-ink: #141a1d;
  --kit-paper: #f9f6f0;
  --kit-card-ivory: #f7f3ee;
  --kit-card-line: #ded7cb;
  --kit-shadow-sheet: 0 -8px 24px rgba(28,39,48,0.12);
  --stemmy-logo-stem: var(--kit-plum);
  --stemmy-logo-leaf: var(--kit-moss);
  --stemmy-logo-bloom: var(--kit-petal);
  --stemmy-logo-heart: var(--kit-plum);
  --stemmy-logo-ink: var(--kit-ink);
}

/* Dark when the reader prefers it, unless the page is set to light. */
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    color-scheme: dark;
    --kit-bg: #130c10;
    --kit-surface: #1e171b;
    --kit-surface-2: #2a2327;
    --kit-line: #3e353a;
    --kit-outline: #8c8388;
    --kit-text: #f2f0eb;
    --kit-text-muted: #bab3ac;
    --kit-action: #c0ee61;
    --kit-on-action: #130c10;
    --kit-hero: #c0ee61;
    --kit-on-hero: #130c10;
    --kit-hero-pill: #130c10;
    --kit-on-hero-pill: #c0ee61;
    --kit-dash-on-hero: #130c1040;
    --kit-dash: #3e353a;
    --kit-brand-text: #dda8b6;
    --kit-mark-fill: #fea0c538;
    --kit-mark-line: #fea0c5;
    --kit-time: #60dbd4;
    --kit-time-fill: #60dbd4;
    --kit-on-time-fill: #130c10;
    --kit-growth: #b9d0b8;
    --kit-error: #f2b8b5;
    --kit-focus: #f2f0eb;
    --kit-scrim: #000000a6;
    --kit-plum: #7a3f50;
    --kit-plum-light: #dda8b6;
    --kit-rose: #b96b7d;
    --kit-moss: #4f7059;
    --kit-moss-light: #b9d0b8;
    --kit-leaf: #c0ee61;
    --kit-petal: #fea0c5;
    --kit-petal-wash: #fee5ee;
    --kit-petal-ink: #8c1654;
    --kit-dusk: #60dbd4;
    --kit-dusk-wash: #d9f5f3;
    --kit-dusk-ink: #015c5c;
    --kit-dusk-icon: #018683;
    --kit-ink: #1c2730;
    --kit-night-ink: #141a1d;
    --kit-paper: #f9f6f0;
    --kit-card-ivory: #f7f3ee;
    --kit-card-line: #ded7cb;
    --kit-shadow-sheet: 0 -8px 24px rgba(0,0,0,0.5);
    --stemmy-logo-stem: var(--kit-plum-light);
    --stemmy-logo-leaf: var(--kit-leaf);
    --stemmy-logo-bloom: var(--kit-petal);
    --stemmy-logo-heart: var(--kit-plum);
    --stemmy-logo-ink: var(--kit-text);
  }
}

/* Dark when the page is set to dark, and always in .kit-night, the letter session's room. */
:root[data-theme="dark"],
.kit-night {
  color-scheme: dark;
  --kit-bg: #130c10;
  --kit-surface: #1e171b;
  --kit-surface-2: #2a2327;
  --kit-line: #3e353a;
  --kit-outline: #8c8388;
  --kit-text: #f2f0eb;
  --kit-text-muted: #bab3ac;
  --kit-action: #c0ee61;
  --kit-on-action: #130c10;
  --kit-hero: #c0ee61;
  --kit-on-hero: #130c10;
  --kit-hero-pill: #130c10;
  --kit-on-hero-pill: #c0ee61;
  --kit-dash-on-hero: #130c1040;
  --kit-dash: #3e353a;
  --kit-brand-text: #dda8b6;
  --kit-mark-fill: #fea0c538;
  --kit-mark-line: #fea0c5;
  --kit-time: #60dbd4;
  --kit-time-fill: #60dbd4;
  --kit-on-time-fill: #130c10;
  --kit-growth: #b9d0b8;
  --kit-error: #f2b8b5;
  --kit-focus: #f2f0eb;
  --kit-scrim: #000000a6;
  --kit-plum: #7a3f50;
  --kit-plum-light: #dda8b6;
  --kit-rose: #b96b7d;
  --kit-moss: #4f7059;
  --kit-moss-light: #b9d0b8;
  --kit-leaf: #c0ee61;
  --kit-petal: #fea0c5;
  --kit-petal-wash: #fee5ee;
  --kit-petal-ink: #8c1654;
  --kit-dusk: #60dbd4;
  --kit-dusk-wash: #d9f5f3;
  --kit-dusk-ink: #015c5c;
  --kit-dusk-icon: #018683;
  --kit-ink: #1c2730;
  --kit-night-ink: #141a1d;
  --kit-paper: #f9f6f0;
  --kit-card-ivory: #f7f3ee;
  --kit-card-line: #ded7cb;
  --kit-shadow-sheet: 0 -8px 24px rgba(0,0,0,0.5);
  --stemmy-logo-stem: var(--kit-plum-light);
  --stemmy-logo-leaf: var(--kit-leaf);
  --stemmy-logo-bloom: var(--kit-petal);
  --stemmy-logo-heart: var(--kit-plum);
  --stemmy-logo-ink: var(--kit-text);
}