@import url('https://api.fontshare.com/v2/css?f[]=general-sans@400,500,600,700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Fraunces:ital,opsz,wght@0,9..144,400;0,9..144,500;0,9..144,600;0,9..144,700;1,9..144,500&display=swap');

:root, [data-theme="light"] {
  --color-bg: #faf8f3; --color-surface: #ffffff; --color-surface-2: #f4f1e8;
  --color-surface-offset: #ede8da; --color-surface-offset-2: #e3ddc9; --color-surface-dynamic: #d9d1b8;
  --color-divider: #ddd6c2; --color-border: #d0c8ae;
  --color-text: #292a1f; --color-text-muted: #6b6a58; --color-text-faint: #a5a28a; --color-text-inverse: #faf8f3;
  --color-primary: #5c6e34; --color-primary-hover: #4a5a29; --color-primary-active: #3a471f; --color-primary-highlight: #dde3cb;
  --color-warning: #a3672c; --color-error: #9c3b3b; --color-error-highlight: #ecd6d6;
  --color-success: #4f7942; --color-success-highlight: #dbe6d3;
  --radius-sm: .375rem; --radius-md: .5rem; --radius-lg: .75rem; --radius-xl: 1.25rem; --radius-full: 9999px;
  --transition-interactive: 180ms cubic-bezier(.16,1,.3,1);
  --shadow-sm: 0 1px 2px oklch(.25 .03 100/.08); --shadow-md: 0 4px 14px oklch(.25 .03 100/.10); --shadow-lg: 0 14px 36px oklch(.25 .03 100/.14);
  --content-narrow: 640px; --content-default: 980px; --content-wide: 1200px; --content-full: 100%;
  --font-display: 'Fraunces', Georgia, serif; --font-body: 'General Sans', 'Helvetica Neue', sans-serif;
}
[data-theme="dark"] {
  --color-bg: #1b1c14; --color-surface: #212217; --color-surface-2: #26271b;
  --color-surface-offset: #2b2c1f; --color-surface-offset-2: #333422; --color-surface-dynamic: #3d3e28;
  --color-divider: #38392a; --color-border: #45462f;
  --color-text: #eae7d8; --color-text-muted: #a5a28f; --color-text-faint: #6f6d5b; --color-text-inverse: #21221a;
  --color-primary: #a3bb6e; --color-primary-hover: #b7cd87; --color-primary-active: #8fa55c; --color-primary-highlight: #333a24;
  --color-warning: #d19257; --color-error: #d3807f; --color-error-highlight: #3a2727;
  --color-success: #8fbf7a; --color-success-highlight: #263626;
  --shadow-sm: 0 1px 2px oklch(0 0 0/.3); --shadow-md: 0 4px 14px oklch(0 0 0/.35); --shadow-lg: 0 14px 36px oklch(0 0 0/.45);
}
:root {
  --text-xs: clamp(.75rem,.7rem+.25vw,.875rem); --text-sm: clamp(.875rem,.8rem+.35vw,1rem);
  --text-base: clamp(1rem,.95rem+.25vw,1.125rem); --text-lg: clamp(1.125rem,1rem+.75vw,1.5rem);
  --text-xl: clamp(1.5rem,1.2rem+1.25vw,2.25rem); --text-2xl: clamp(2rem,1.2rem+2.5vw,3.5rem);
  --text-3xl: clamp(2.5rem,1rem+4vw,5rem); --text-hero: clamp(2.75rem,.5rem+6.5vw,7rem);
  --space-1:.25rem; --space-2:.5rem; --space-3:.75rem; --space-4:1rem; --space-5:1.25rem; --space-6:1.5rem;
  --space-8:2rem; --space-10:2.5rem; --space-12:3rem; --space-16:4rem; --space-20:5rem; --space-24:6rem; --space-32:8rem;
}
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;scroll-behavior:smooth;scroll-padding-top:var(--space-16)}
body{min-height:100dvh;line-height:1.6;font-family:var(--font-body);font-size:var(--text-base);color:var(--color-text);background:var(--color-bg)}
img,picture,video,canvas,svg{display:block;max-width:100%;height:auto}
ul[role="list"],ol[role="list"]{list-style:none}
input,button,textarea,select{font:inherit;color:inherit}
h1,h2,h3,h4,h5,h6{font-family:var(--font-display);text-wrap:balance;line-height:1.15}
p,li,figcaption{text-wrap:pretty;max-width:72ch}
::selection{background:color-mix(in oklch,var(--color-primary) 25%,transparent);color:var(--color-text)}
:focus-visible{outline:2px solid var(--color-primary);outline-offset:3px;border-radius:var(--radius-sm)}
button{cursor:pointer;background:none;border:none}
a,button,[role="button"],input,textarea,select{transition:color var(--transition-interactive),background var(--transition-interactive),border-color var(--transition-interactive),box-shadow var(--transition-interactive)}
.container{max-width:var(--content-default);margin-inline:auto;padding-inline:var(--space-4)}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--space-2);padding:var(--space-3) var(--space-6);border-radius:var(--radius-md);font-size:var(--text-sm);font-weight:600;text-decoration:none;white-space:nowrap;min-height:44px}
.btn-primary{background:var(--color-primary);color:var(--color-text-inverse)}
.btn-primary:hover{background:var(--color-primary-hover)}
.btn-outline{background:transparent;color:var(--color-primary);border:1px solid var(--color-primary)}
.btn-outline:hover{background:var(--color-primary-highlight)}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border-width:0}
@media (prefers-reduced-motion: reduce){*,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}}