/* Sprout is opt-in. Apply this scope to the root of a page or a subtree. */
.sprout {
  --sp-background: #f8f9f5;
  --sp-surface: #ffffff;
  --sp-foreground: #25352d;
  --sp-muted: #edf0e9;
  --sp-muted-foreground: #616d64;
  --sp-border: #dce2d8;
  --sp-control-border: #7e8c80;
  --sp-primary: #315c40;
  --sp-primary-hover: #234730;
  --sp-primary-foreground: #ffffff;
  --sp-accent: #dbeaac;
  --sp-accent-foreground: #30401c;
  --sp-peach: #f7dfcc;
  --sp-peach-foreground: #794627;
  --sp-lilac: #e7e0f3;
  --sp-lilac-foreground: #624685;
  --sp-success: #e3eedf;
  --sp-success-foreground: #305737;
  --sp-warning: #fff0c5;
  --sp-warning-foreground: #725011;
  --sp-danger: #b13d37;
  --sp-danger-soft: #fbe9e5;
  --sp-danger-foreground: #ffffff;
  --sp-ring: #467445;
  --sp-font: "Trebuchet MS", "Avenir Next", "Segoe UI", sans-serif;
  --sp-font-display: "Palatino Linotype", "Book Antiqua", Palatino, Georgia, serif;
  --sp-font-mono: "SFMono-Regular", Consolas, "Liberation Mono", monospace;
  --sp-text-xs: 0.75rem;
  --sp-text-sm: 0.875rem;
  --sp-text-base: 1rem;
  --sp-text-lg: 1.25rem;
  --sp-text-xl: 1.5rem;
  --sp-text-2xl: 2rem;
  --sp-text-display: clamp(2.75rem, 5vw, 4.5rem);
  --sp-space-1: 0.25rem;
  --sp-space-2: 0.5rem;
  --sp-space-3: 0.75rem;
  --sp-space-4: 1rem;
  --sp-space-6: 1.5rem;
  --sp-space-8: 2rem;
  --sp-space-12: 3rem;
  --sp-space-16: 4rem;
  --sp-radius-sm: 0.5rem;
  --sp-radius-md: 0.75rem;
  --sp-radius-lg: 1.25rem;
  --sp-radius-pill: 999px;
  --sp-shadow: 0 3px 0 rgb(37 53 45 / 7%);
  --sp-duration: 140ms;
  --sp-ease: cubic-bezier(0.2, 0.8, 0.2, 1);
  color-scheme: light;
  color: var(--sp-foreground);
  background: var(--sp-background);
  font-family: var(--sp-font);
  font-size: var(--sp-text-base);
  line-height: 1.5;
}

.sprout[data-theme="dark"] {
  --sp-background: #19231e;
  --sp-surface: #222e26;
  --sp-foreground: #eef2e8;
  --sp-muted: #303c33;
  --sp-muted-foreground: #b0bdae;
  --sp-border: #425044;
  --sp-control-border: #7e927e;
  --sp-primary: #dbeaac;
  --sp-primary-hover: #e9f4ca;
  --sp-primary-foreground: #25352d;
  --sp-accent: #394a2b;
  --sp-accent-foreground: #dbeaac;
  --sp-peach: #523d30;
  --sp-peach-foreground: #f7cfb0;
  --sp-lilac: #44394f;
  --sp-lilac-foreground: #dfcfef;
  --sp-success: #304932;
  --sp-success-foreground: #cce7c2;
  --sp-warning: #514525;
  --sp-warning-foreground: #f4db98;
  --sp-danger: #f4a39b;
  --sp-danger-soft: #4c302e;
  --sp-danger-foreground: #3b201d;
  --sp-ring: #dbeaac;
  color-scheme: dark;
}