/* Palette (RGB triplets) — light values from DESIGN.md */
:root {
  --c-primary: 20 11 5; --c-on-primary: 255 255 255; --c-primary-container: 43 33 24; --c-on-primary-container: 151 135 123;
  --c-secondary: 129 85 27; --c-on-secondary: 255 255 255; --c-secondary-container: 255 196 128; --c-on-secondary-container: 122 79 21;
  --c-secondary-fixed: 255 221 186; --c-secondary-fixed-dim: 246 187 120;
  --c-tertiary: 74 93 78; --c-tertiary-container: 21 39 27; --c-on-tertiary-container: 123 143 127;
  --c-surface: 251 249 246; --c-surface-container-lowest: 255 255 255; --c-surface-container-low: 245 243 240;
  --c-surface-container: 239 238 235; --c-surface-container-high: 234 232 229; --c-surface-container-highest: 228 226 223;
  --c-surface-variant: 228 226 223; --c-on-surface: 27 28 26; --c-on-surface-variant: 77 69 63;
  --c-outline: 127 117 110; --c-outline-variant: 208 196 188; --c-error: 186 26 26;
  --c-walnut: 43 33 24; --c-linen: 251 249 246; --c-ink: 20 11 5; --c-white-fixed: 255 255 255;
  color-scheme: light;
}
html.dark {
  --c-primary: 242 230 218; --c-on-primary: 30 22 15; --c-primary-container: 58 46 36; --c-on-primary-container: 190 175 162;
  --c-secondary: 220 170 108; --c-on-secondary: 36 22 4; --c-secondary-container: 102 62 3; --c-on-secondary-container: 255 221 186;
  --c-tertiary: 160 185 165; --c-on-tertiary-container: 160 185 165;
  --c-surface: 22 19 16; --c-surface-container-lowest: 30 26 22; --c-surface-container-low: 35 30 26;
  --c-surface-container: 42 37 32; --c-surface-container-high: 50 44 38; --c-surface-container-highest: 60 53 46;
  --c-surface-variant: 60 53 46; --c-on-surface: 236 230 222; --c-on-surface-variant: 200 189 178;
  --c-outline: 150 140 130; --c-outline-variant: 84 76 69; --c-error: 255 180 171;
  color-scheme: dark;
}
html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; }
body { overflow-x: hidden; }
[id] { scroll-margin-top: 130px; }
.no-scrollbar { scrollbar-width: none; } .no-scrollbar::-webkit-scrollbar { display: none; }
.material-symbols-outlined { font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 24; line-height: 1; user-select: none; }
.icon-fill { font-variation-settings: 'FILL' 1, 'wght' 400, 'GRAD' 0, 'opsz' 24; }
.pb-safe { padding-bottom: env(safe-area-inset-bottom, 0px); }
/* Stretched link: whole card clickable while inner buttons stay usable */
.stretched::after { content: ""; position: absolute; inset: 0; z-index: 1; }
.above-stretch { position: relative; z-index: 2; }
/* Signature arch (DESIGN.md › Shapes) */
.arch { border-radius: 120px 120px 4px 4px; }
@media (max-width: 639px) { .arch { border-radius: 80px 80px 4px 4px; } }
.hairline { border: 1px solid rgb(var(--c-walnut) / 0.1); }
html.dark .hairline { border-color: rgb(255 255 255 / 0.08); }
.shadow-walnut { box-shadow: 0 16px 40px -12px rgba(43, 33, 24, 0.12); }
.link-editorial { text-decoration: underline; text-decoration-color: rgb(var(--c-secondary)); text-underline-offset: 4px; text-decoration-thickness: 1px; }
:focus-visible { outline: 2px solid rgb(var(--c-secondary)); outline-offset: 2px; }
#drawer-panel { transition: transform .35s cubic-bezier(.16, 1, .3, 1); }
#drawer-backdrop { transition: opacity .3s ease; }
@media (prefers-reduced-motion: reduce) { * { scroll-behavior: auto !important; transition: none !important; } }

/* Long-form body typography */
.prose-article { font-family: "Plus Jakarta Sans", sans-serif; font-size: 17px; line-height: 30px; color: rgb(var(--c-on-surface)); }
.prose-article > * + * { margin-top: 1.1em; }
.prose-article h2 { font-family: "Playfair Display", serif; font-size: 28px; line-height: 38px; font-weight: 500; margin-top: 1.8em; color: rgb(var(--c-primary)); }
.prose-article h3 { font-family: "Playfair Display", serif; font-size: 21px; line-height: 30px; font-weight: 500; margin-top: 1.5em; color: rgb(var(--c-primary)); }
.prose-article ul, .prose-article ol { padding-left: 1.4em; }
.prose-article ul { list-style: disc; } .prose-article ol { list-style: decimal; }
.prose-article li { margin-top: .45em; padding-left: .2em; } .prose-article li::marker { color: rgb(var(--c-secondary)); font-weight: 700; }
.prose-article strong { font-weight: 700; color: rgb(var(--c-primary)); }
.prose-article blockquote { border-left: 2px solid rgb(var(--c-secondary)); background: rgb(var(--c-surface-container-low)); padding: 16px 22px; border-radius: 0 .5rem .5rem 0; font-family: "Playfair Display", serif; font-size: 19px; line-height: 31px; font-style: italic; color: rgb(var(--c-primary)); }
.prose-article table { width: 100%; border-collapse: collapse; font-size: 15px; line-height: 22px; display: block; overflow-x: auto; }
.prose-article th, .prose-article td { border: 1px solid rgb(var(--c-outline-variant) / .7); padding: 10px 12px; text-align: left; vertical-align: top; }
.prose-article th { background: rgb(var(--c-surface-container)); font-weight: 600; }
@media (max-width: 767px) { .prose-article { font-size: 16px; line-height: 28px; } .prose-article h2 { font-size: 23px; line-height: 31px; } }