/* Tin Xã Hội VN — palette (RGB triplets) from DESIGN.md; html.dark swaps the neutrals/accents. */
:root {
  --c-surface: 250 248 255; --c-on-secondary-container: 0 114 98; --c-surface-container-highest: 218 226 253; --c-tertiary-container: 152 109 0; --c-primary-fixed-dim: 255 180 162; --c-primary-container: 216 57 13; --c-on-primary-fixed-variant: 138 29 0; --c-secondary-fixed: 101 250 222; --c-on-surface-variant: 91 64 58; --c-surface-container-lowest: 255 255 255; --c-error: 186 26 26; --c-on-error: 255 255 255; --c-on-background: 19 27 46; --c-error-container: 255 218 214; --c-outline-variant: 228 190 181; --c-surface-container-high: 226 231 255; --c-inverse-surface: 40 48 68; --c-background: 250 248 255; --c-surface-container-low: 242 243 255; --c-on-secondary: 255 255 255; --c-on-tertiary-container: 255 251 255; --c-on-tertiary-fixed: 39 25 0; --c-surface-bright: 250 248 255; --c-outline: 144 112 104; --c-surface-container: 234 237 255; --c-on-primary-fixed: 60 7 0; --c-on-primary-container: 255 251 255; --c-secondary-container: 101 250 222; --c-tertiary-fixed-dim: 255 186 32; --c-surface-dim: 210 217 244; --c-on-secondary-fixed: 0 32 27; --c-primary: 176 39 0; --c-on-surface: 19 27 46; --c-on-error-container: 147 0 10; --c-primary-fixed: 255 218 210; --c-tertiary-fixed: 255 222 168; --c-surface-tint: 180 40 0; --c-on-primary: 255 255 255; --c-secondary: 0 107 92; --c-on-tertiary-fixed-variant: 94 66 0; --c-inverse-on-surface: 238 240 255; --c-inverse-primary: 255 180 162; --c-surface-variant: 218 226 253; --c-secondary-fixed-dim: 65 221 194; --c-on-tertiary: 255 255 255; --c-on-secondary-fixed-variant: 0 80 69; --c-tertiary: 121 86 0; --c-ink: 15 23 42; --c-white-fixed: 255 255 255; --c-brand: 216 57 13; --c-brand-dark: 176 39 0; --c-teal-fixed: 0 107 92;
  color-scheme: light;
}
html.dark {
  --c-surface: 15 20 36; --c-background: 15 20 36; --c-surface-bright: 42 49 70; --c-surface-dim: 11 15 28; --c-surface-container-lowest: 10 14 26; --c-surface-container-low: 23 29 48; --c-surface-container: 28 35 56; --c-surface-container-high: 38 45 68; --c-surface-container-highest: 49 56 82; --c-on-surface: 230 233 246; --c-on-background: 230 233 246; --c-on-surface-variant: 214 191 184; --c-outline: 169 138 130; --c-outline-variant: 91 64 58; --c-primary: 255 143 114; --c-on-primary: 60 7 0; --c-primary-container: 216 57 13; --c-on-primary-container: 255 255 255; --c-primary-fixed: 74 26 15; --c-on-primary-fixed: 255 218 210; --c-primary-fixed-dim: 255 180 162; --c-on-primary-fixed-variant: 255 180 162; --c-secondary: 65 221 194; --c-on-secondary: 0 32 27; --c-secondary-container: 0 80 69; --c-on-secondary-container: 101 250 222; --c-secondary-fixed: 0 67 58; --c-on-secondary-fixed: 101 250 222; --c-secondary-fixed-dim: 65 221 194; --c-on-secondary-fixed-variant: 101 250 222; --c-tertiary: 255 186 32; --c-on-tertiary: 39 25 0; --c-tertiary-container: 152 109 0; --c-on-tertiary-container: 255 255 255; --c-tertiary-fixed: 77 53 0; --c-on-tertiary-fixed: 255 222 168; --c-tertiary-fixed-dim: 255 186 32; --c-on-tertiary-fixed-variant: 255 222 168; --c-inverse-surface: 8 12 24; --c-inverse-on-surface: 230 233 246; --c-inverse-primary: 176 39 0; --c-surface-variant: 49 56 82; --c-surface-tint: 255 143 114; --c-error: 255 180 171; --c-on-error: 105 0 5; --c-error-container: 147 0 10; --c-on-error-container: 255 218 214;
  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::after { content: ""; position: absolute; inset: 0; z-index: 1; }
.above-stretch { position: relative; z-index: 2; }
.fade-edge { -webkit-mask-image: linear-gradient(90deg, #000 90%, transparent); mask-image: linear-gradient(90deg, #000 90%, transparent); }
:focus-visible { outline: 2px solid rgb(var(--c-primary-container)); outline-offset: 2px; }
.line-clamp-1 { display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical; overflow: hidden; }
.line-clamp-2 { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.line-clamp-3 { display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
/* Ticker: one headline at a time, cross-fade every 6s (JS toggles .is-on) */
.ticker-item { display: none; }
.ticker-item.is-on { display: inline-flex; animation: tickIn .5s ease; }
@keyframes tickIn { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: none; } }
@media (prefers-reduced-motion: reduce) { .ticker-item.is-on { animation: none; } * { scroll-behavior: auto !important; } }
.poll-bar > i { display: block; height: 100%; border-radius: 9999px; }

/* Article body typography (replaces @tailwindcss/typography) */
.prose-article { font-family: "Be Vietnam Pro", 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: "Plus Jakarta Sans", sans-serif; font-size: 26px; line-height: 34px; font-weight: 700; margin-top: 1.8em; letter-spacing: -0.01em; scroll-margin-top: 150px; }
.prose-article h3 { font-family: "Plus Jakarta Sans", sans-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 a { color: rgb(var(--c-primary)); text-decoration: underline; }
.prose-article blockquote { border-left: 4px solid rgb(var(--c-primary-container)); background: rgb(var(--c-surface-container-low)); padding: 14px 18px; border-radius: 0 .75rem .75rem 0; font-size: 15px; line-height: 25px; }
.prose-article blockquote p { margin: 0; }
@media (max-width: 767px) { .prose-article { font-size: 16px; line-height: 28px; } .prose-article h2 { font-size: 22px; line-height: 30px; } }