:root { color-scheme: dark; font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; background: #08111f; color: #dbeafe; }
* { box-sizing: border-box; }
body { margin: 0; min-height: 100vh; background: radial-gradient(circle at top left, rgba(96,165,250,.24), transparent 32rem), radial-gradient(circle at 80% 10%, rgba(167,139,250,.18), transparent 28rem), #08111f; }
a { color: inherit; text-decoration: none; }
.hero { padding: 3rem clamp(1rem, 4vw, 4rem) 1.5rem; max-width: 1400px; margin: 0 auto; }
.brand-lockup { display: flex; gap: 1rem; align-items: center; }
.site-icon { flex: 0 0 auto; width: clamp(4rem, 8vw, 6rem); height: clamp(4rem, 8vw, 6rem); filter: drop-shadow(0 0 24px rgba(147,197,253,.38)); }
.eyebrow { color: #93c5fd; text-transform: uppercase; letter-spacing: .16em; font-weight: 700; font-size: .78rem; }
h1 { margin: .2rem 0; font-size: clamp(2.2rem, 6vw, 5.5rem); line-height: .95; }
.subtitle { color: #b6c6dd; max-width: 820px; font-size: 1.1rem; }
.toolbar { display: flex; gap: 1rem; align-items: center; margin-top: 1.5rem; flex-wrap: wrap; }
button { background: #dbeafe; border: 0; color: #08111f; padding: .8rem 1rem; border-radius: 999px; font-weight: 800; cursor: pointer; }
#status { color: #9fb3cc; }
.grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1rem; max-width: 1400px; padding: 1rem clamp(1rem, 4vw, 4rem) 4rem; margin: 0 auto; }
.category { min-width: 0; border: 1px solid rgba(219,234,254,.14); border-radius: 28px; padding: 1rem; background: rgba(8,17,31,.72); backdrop-filter: blur(14px); box-shadow: 0 24px 80px rgba(0,0,0,.25); }
.category-heading { min-width: 0; display: flex; justify-content: space-between; gap: .75rem; align-items: start; border-bottom: 1px solid rgba(219,234,254,.1); padding-bottom: .85rem; margin-bottom: .85rem; }
h2 { min-width: 0; margin: 0; font-size: 1.25rem; overflow-wrap: anywhere; }
.count { flex: 0 0 auto; color: #9fb3cc; font-size: .85rem; white-space: nowrap; }
.rationale { margin: .25rem 0 1rem; color: #9ff0c6; font-size: .9rem; overflow-wrap: anywhere; }
.items { min-width: 0; display: grid; gap: .75rem; }
.card { min-width: 0; max-width: 100%; display: block; padding: .9rem; border-radius: 18px; background: rgba(255,255,255,.045); border: 1px solid rgba(255,255,255,.06); transition: transform .16s ease, background .16s ease; overflow: hidden; }
.card:hover { transform: translateY(-2px); background: rgba(255,255,255,.075); }
.source { min-width: 0; display: flex; justify-content: space-between; color: #9fb3cc; font-size: .78rem; margin-bottom: .4rem; gap: .5rem; }
.source span { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.source time { flex: 0 0 auto; white-space: nowrap; }
.title { min-width: 0; font-weight: 800; line-height: 1.25; overflow-wrap: anywhere; word-break: normal; }
.summary { min-width: 0; color: #b6c6dd; font-size: .9rem; margin: .5rem 0 0; overflow-wrap: anywhere; word-break: normal; }
.errors { color: #fca5a5; font-size: .82rem; min-height: 1em; }
@media (max-width: 1050px) { .grid { grid-template-columns: 1fr; } }