:root { color-scheme: dark; --bg:#101312; --panel:#171b19; --panel-hover:#1d221f; --ink:#f1efe8; --muted:#9aa39d; --line:#2b312e; --accent:#c8f06b; --max:1180px; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; background:var(--bg); color:var(--ink); font-family:Inter,ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif; font-size:16px; line-height:1.55; }
a { color:inherit; } button,input { font:inherit; }
.skip-link { position:fixed; left:1rem; top:-5rem; z-index:20; padding:.75rem 1rem; background:var(--accent); color:#0b0d0c; }
.skip-link:focus { top:1rem; }
.shell { width:min(calc(100% - 40px),var(--max)); margin:0 auto; }
.masthead { min-height:86px; display:flex; align-items:center; justify-content:space-between; border-bottom:1px solid var(--line); }
.brand { display:inline-flex; gap:.7rem; align-items:center; text-decoration:none; font-size:.88rem; font-weight:750; letter-spacing:.08em; text-transform:uppercase; }
.brand-mark { color:var(--accent); font-size:1.2rem; }
.nav { display:flex; gap:1.5rem; }
.nav a { color:var(--muted); text-decoration:none; font-size:.82rem; }
.nav a:hover,.nav a:focus-visible { color:var(--ink); }
.hero { min-height:590px; display:grid; grid-template-columns:1.25fr .75fr; gap:5rem; align-items:center; border-bottom:1px solid var(--line); }
.eyebrow,.section-number { color:var(--accent); font-size:.7rem; font-weight:800; letter-spacing:.16em; text-transform:uppercase; }
h1 { margin:1.2rem 0 1.5rem; max-width:790px; font-size:clamp(3.4rem,7.2vw,6.8rem); line-height:.92; letter-spacing:-.065em; font-weight:590; }
h1 em { color:var(--muted); font-family:Georgia,serif; font-weight:400; }
.lede { max-width:610px; color:var(--muted); font-size:1.08rem; }
.search-wrap label { display:block; margin-bottom:.7rem; color:var(--muted); font-size:.76rem; text-transform:uppercase; letter-spacing:.12em; }
.search-field { display:flex; align-items:center; gap:.8rem; padding:.9rem 1rem; border:1px solid var(--line); background:var(--panel); }
.search-field:focus-within { border-color:#66725e; }
.search-field input { min-width:0; flex:1; border:0; outline:0; background:transparent; color:var(--ink); }
.search-field input::placeholder { color:#707872; }
kbd { border:1px solid var(--line); border-radius:3px; padding:.05rem .35rem; color:var(--muted); font-size:.7rem; }
.search-status { min-height:1.4em; color:var(--muted); font-size:.75rem; }
.section { padding:6.5rem 0; border-bottom:1px solid var(--line); scroll-margin-top:1rem; }
.section-heading { display:grid; grid-template-columns:1fr 1fr; align-items:end; gap:2rem; margin-bottom:2.5rem; }
.section-heading h2 { margin:.25rem 0 0; font-family:Georgia,serif; font-size:clamp(2.2rem,4vw,3.6rem); font-weight:400; letter-spacing:-.035em; }
.section-heading>p { justify-self:end; max-width:410px; color:var(--muted); }
.live-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:1px; padding:1px; margin-bottom:1.1rem; background:var(--line); }
.live-card { min-height:210px; display:flex; flex-direction:column; align-items:flex-start; gap:.85rem; padding:1.5rem; background:var(--panel); text-decoration:none; transition:background .18s ease; }
a.live-card:hover { background:var(--panel-hover); }
.live-source { display:flex; align-items:center; gap:.5rem; color:var(--muted); font-size:.72rem; letter-spacing:.08em; text-transform:uppercase; }
.source-dot { width:7px; height:7px; border-radius:50%; background:var(--accent); box-shadow:0 0 0 4px rgba(200,240,107,.08); }
.live-card h3 { margin:auto 0 0; max-width:30ch; font-size:1.15rem; line-height:1.35; }
.live-meta { color:var(--muted); font-size:.74rem; }
.is-loading { color:var(--muted); animation:breathe 1.8s ease-in-out infinite; }
@keyframes breathe { 50% { opacity:.55; } }
.resource-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:1px; padding:1px; background:var(--line); }
.compact-grid { grid-template-columns:repeat(4,1fr); }
.resource-card { position:relative; min-height:250px; display:flex; flex-direction:column; padding:1.5rem; background:var(--panel); text-decoration:none; transition:background .18s ease,transform .18s ease; }
.compact-grid .resource-card { min-height:190px; }
.resource-card:hover { z-index:1; background:var(--panel-hover); transform:translateY(-2px); }
.card-top { display:flex; align-items:center; justify-content:space-between; gap:1rem; }
.tag { color:var(--accent); font-size:.67rem; font-weight:750; letter-spacing:.12em; text-transform:uppercase; }
.arrow { color:var(--muted); transition:transform .18s ease; }
.resource-card:hover .arrow { transform:translate(3px,-3px); color:var(--accent); }
.resource-card h3 { margin:auto 0 .65rem; font-size:1.22rem; }
.resource-card p { margin:0; color:var(--muted); font-size:.86rem; }
.later-section { padding-bottom:5rem; }
.later-list { border-top:1px solid var(--line); }
.later-item { display:grid; grid-template-columns:auto 1fr auto; gap:1rem; align-items:center; padding:1.15rem 0; border-bottom:1px solid var(--line); }
.later-item input { width:18px; height:18px; accent-color:var(--accent); }
.later-item label { cursor:pointer; }
.later-item label span { display:block; color:var(--muted); font-size:.78rem; }
.later-item a { color:var(--muted); text-decoration:none; font-size:.8rem; }
.later-item:has(input:checked) label { opacity:.42; text-decoration:line-through; }
.text-button { margin-top:1.2rem; padding:0; border:0; background:transparent; color:var(--muted); cursor:pointer; font-size:.75rem; text-decoration:underline; text-underline-offset:4px; }
.hidden { display:none!important; }
footer { min-height:150px; display:flex; align-items:center; justify-content:space-between; color:var(--muted); font-size:.75rem; }
footer a { text-decoration:none; }
@media (max-width:850px) { .nav{display:none}.hero{min-height:650px;grid-template-columns:1fr;gap:2rem;align-content:center}.section-heading{grid-template-columns:1fr}.section-heading>p{justify-self:start;margin:0}.live-grid,.resource-grid,.compact-grid{grid-template-columns:1fr 1fr} }
@media (max-width:560px) { .shell{width:min(calc(100% - 28px),var(--max))}h1{font-size:3.25rem}.hero{min-height:590px}.section{padding:4.5rem 0}.live-grid,.resource-grid,.compact-grid{grid-template-columns:1fr}.live-card{min-height:180px}.resource-card{min-height:210px}footer{align-items:flex-start;flex-direction:column;justify-content:center;gap:.5rem} }
@media (prefers-reduced-motion:reduce) { *,*::before,*::after{scroll-behavior:auto!important;animation:none!important;transition:none!important} }
