/* Palette (RGB triplets) — light values from DESIGN.md */
:root {
  --c-primary: 183 0 17; --c-primary-container: 220 38 38; --c-tertiary: 178 22 24; --c-on-primary: 255 255 255;
  --c-secondary: 86 94 116; --c-on-surface: 11 28 48; --c-on-surface-variant: 92 64 60;
  --c-surface: 248 249 255; --c-surface-container-lowest: 255 255 255; --c-surface-container-low: 239 244 255;
  --c-surface-container: 229 238 255; --c-surface-container-high: 220 233 255; --c-surface-variant: 211 228 254;
  --c-inverse-surface: 33 49 69; --c-live-indicator: 16 185 129; --c-text-muted: 148 163 184;
  --c-text-secondary: 71 85 105; --c-border-subtle: 226 232 240; --c-border-strong: 203 213 225;
  --c-primary-fixed: 255 218 214; --c-ink: 11 28 48; --c-white-fixed: 255 255 255;
  color-scheme: light;
}
html.dark {
  --c-primary: 248 91 82; --c-primary-container: 220 38 38; --c-tertiary: 252 120 110; --c-secondary: 160 170 192;
  --c-on-surface: 230 236 246; --c-on-surface-variant: 214 196 192;
  --c-surface: 9 15 27; --c-surface-container-lowest: 17 25 41; --c-surface-container-low: 22 33 52;
  --c-surface-container: 30 43 64; --c-surface-container-high: 38 53 77; --c-surface-variant: 190 205 230;
  --c-text-muted: 125 138 160; --c-text-secondary: 170 180 197; --c-border-subtle: 38 51 73; --c-border-strong: 55 70 95;
  --c-primary-fixed: 70 20 22;
  color-scheme: dark;
}
html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; }
body { overflow-x: hidden; }
.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; }
@keyframes marquee { from { transform: translateX(0); } to { transform: translateX(-50%); } }
.marquee { display: inline-flex; animation: marquee 40s linear infinite; }
.marquee:hover { animation-play-state: paused; }
@media (prefers-reduced-motion: reduce) { .marquee { animation: none; } * { scroll-behavior: auto !important; } }
.fade-edge { -webkit-mask-image: linear-gradient(90deg, #000 88%, transparent); mask-image: linear-gradient(90deg, #000 88%, transparent); }
:focus-visible { outline: 2px solid rgb(var(--c-primary-container)); outline-offset: 2px; }

/* Article body typography (replaces @tailwindcss/typography) */
.prose-article { font-family: Inter, 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: 26px; line-height: 34px; font-weight: 700; margin-top: 1.8em; letter-spacing: -0.01em; scroll-margin-top: 140px; }
.prose-article h3 { font-family: "Playfair Display", serif; font-size: 20px; line-height: 28px; font-weight: 600; margin-top: 1.5em; }
.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-primary-container)); font-weight: 700; }
.prose-article strong { font-weight: 700; }
.prose-article blockquote { border-left: 3px solid rgb(var(--c-primary-container)); background: rgb(var(--c-surface-container-low)); padding: 16px 20px; border-radius: 0 .5rem .5rem 0; font-family: "Playfair Display", serif; font-size: 19px; line-height: 30px; font-style: italic; }
.prose-article table { width: 100%; border-collapse: collapse; font-size: 15px; display: block; overflow-x: auto; }
.prose-article th, .prose-article td { border: 1px solid rgb(var(--c-border-subtle)); padding: 8px 10px; text-align: left; }
@media (max-width: 767px) { .prose-article { font-size: 16px; line-height: 28px; } .prose-article h2 { font-size: 22px; line-height: 30px; } }
