/* Porchnote — generated from tokens.json. Do not edit by hand. */
:root, [data-theme="light"] {
  color-scheme: light;
  --pn-bg: #F4EFE6;
  --pn-surface: #FBF8F2;
  --pn-fg: #23302B;
  --pn-fg-muted: #4A5852;
  --pn-border: #D8CFBF;
  --pn-accent: #E2A03F;
  --pn-accent-fg: #23302B;
  --pn-cta-bg: #964E33;
  --pn-cta-fg: #FFFFFF;
  --pn-link: #964E33;
  --pn-focus-ring: #23302B;
  --pn-plate: #FBF8F2;
  --pn-stroke-hi: #23302B;
  --pn-stroke-edge: #6F7A73;
  --pn-stroke-mid: #A7ADA3;
  --pn-stroke-lo: #D8CFBF;
  --pn-ink: #23302B;
  --pn-linen: #F4EFE6;
  --pn-lamp: #E2A03F;
  --pn-sage: #8FA58C;
  --pn-clay: #B9694A;
}
[data-theme="dark"] {
  color-scheme: dark;
  --pn-bg: #1A2420;
  --pn-surface: #23302B;
  --pn-fg: #F4EFE6;
  --pn-fg-muted: #C9CFC8;
  --pn-border: #3D4A44;
  --pn-accent: #E2A03F;
  --pn-accent-fg: #23302B;
  --pn-cta-bg: #E2A03F;
  --pn-cta-fg: #1A2420;
  --pn-link: #E2A03F;
  --pn-focus-ring: #E2A03F;
  --pn-plate: #23302B;
  --pn-stroke-hi: #F4EFE6;
  --pn-stroke-edge: #98A39B;
  --pn-stroke-mid: #5E6B64;
  --pn-stroke-lo: #3D4A44;
}
/* No explicit choice: follow the system setting. */
@media (prefers-color-scheme: dark) {
  :root:not([data-theme]) {
    color-scheme: dark;
    --pn-bg: #1A2420;
    --pn-surface: #23302B;
    --pn-fg: #F4EFE6;
    --pn-fg-muted: #C9CFC8;
    --pn-border: #3D4A44;
    --pn-accent: #E2A03F;
    --pn-accent-fg: #23302B;
    --pn-cta-bg: #E2A03F;
    --pn-cta-fg: #1A2420;
    --pn-link: #E2A03F;
    --pn-focus-ring: #E2A03F;
    --pn-plate: #23302B;
    --pn-stroke-hi: #F4EFE6;
    --pn-stroke-edge: #98A39B;
    --pn-stroke-mid: #5E6B64;
    --pn-stroke-lo: #3D4A44;
  }
}
:root {
  --pn-space-1: 4px;
  --pn-space-2: 8px;
  --pn-space-3: 12px;
  --pn-space-4: 16px;
  --pn-space-6: 24px;
  --pn-space-8: 32px;
  --pn-space-12: 48px;
  --pn-space-16: 64px;
  --pn-radius-sm: 6px;
  --pn-radius-md: 10px;
  --pn-radius-lg: 14px;
  --pn-hairline: 1px;
  --pn-figure-stroke: 1.1px;
  --pn-focus-width: 2px;
  --pn-dur-answer: 140ms;
  --pn-dur-settle: 460ms;
  --pn-dur-stagger: 40ms;
  --pn-ease-answer: cubic-bezier(0.2, 0.8, 0.2, 1);
  --pn-ease-settle: cubic-bezier(0.3, 1.45, 0.5, 1);
  --pn-lift: 2px;
  --pn-press: 1px;
  --pn-lean: 6px;
  --font-display: Petrona, Georgia, 'Times New Roman', serif;
  --font-sans: 'DM Sans', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --font-mono: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
}
.pn-display { font-family: var(--font-display); font-size: 56px; line-height: 60px; font-weight: 600; letter-spacing: -0.01em; }
.pn-h1 { font-family: var(--font-display); font-size: 40px; line-height: 44px; font-weight: 600; letter-spacing: -0.01em; }
.pn-h2 { font-family: var(--font-display); font-size: 28px; line-height: 34px; font-weight: 600; letter-spacing: -0.01em; }
.pn-h3 { font-family: var(--font-sans); font-size: 18px; line-height: 26px; font-weight: 700; }
.pn-body { font-family: var(--font-sans); font-size: 16px; line-height: 26px; font-weight: 400; }
.pn-small { font-family: var(--font-sans); font-size: 14px; line-height: 22px; font-weight: 400; }
.pn-label { font-family: var(--font-sans); font-size: 12px; line-height: 16px; font-weight: 700; letter-spacing: 0.08em; }
.pn-code { font-family: var(--font-mono); font-size: 15px; line-height: 22px; font-weight: 500; }