/* AI Pulled — /news — dense layout, 0 vertical body margin */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{
  font-family:'Inter',system-ui,-apple-system,sans-serif;
  background:#0b0f1a;color:#e2e8f0;
  line-height:1.6;-webkit-font-smoothing:antialiased;
  margin:0;padding:0;
}
a{color:#fbbf24;text-decoration:none}
a:hover{color:#fde68a;text-decoration:underline}

/* TOP NAV (compact) */
#topnav{position:sticky;top:0;z-index:100;background:rgba(11,15,26,0.96);backdrop-filter:blur(10px);border-bottom:1px solid #1f2937}
.nav-inner{max-width:1280px;margin:0 auto;padding:0 1rem;height:48px;display:flex;align-items:center;justify-content:space-between}
.nav-brand{font-weight:800;color:#fbbf24;font-size:0.95rem;letter-spacing:-0.01em;display:flex;align-items:center;gap:0.4rem}
.nav-brand:hover{color:#fde68a;text-decoration:none}
.nav-right{display:flex;gap:1rem;font-size:0.8rem;color:#94a3b8}
.nav-right a{color:#94a3b8}
.nav-right a:hover{color:#fbbf24}

/* TAB STRIP + FILTER BAR (single combined row, sticky just under nav) */
.bar{position:sticky;top:48px;z-index:90;background:#0d1220;border-bottom:1px solid #1f2937;padding:0}
.bar-inner{max-width:1280px;margin:0 auto;padding:0 1rem;display:flex;flex-wrap:wrap;align-items:center;gap:0.5rem;min-height:46px}
.tabs{display:flex;gap:0}
.tab-btn{background:none;border:none;color:#94a3b8;font-weight:700;font-size:0.85rem;padding:0.65rem 0.9rem;cursor:pointer;border-bottom:2px solid transparent;font-family:inherit;letter-spacing:-0.01em}
.tab-btn:hover{color:#fde68a}
.tab-btn.active{color:#fbbf24;border-bottom-color:#fbbf24}
.tab-btn .count{display:inline-block;background:#1e293b;color:#94a3b8;border-radius:8px;padding:1px 6px;font-size:0.7rem;margin-left:4px;font-weight:600}
.tab-btn.active .count{background:#fbbf24;color:#0b0f1a}
.filter-wrap{margin-left:auto;display:flex;align-items:center;gap:0.4rem;flex:1;max-width:520px;min-width:200px}
#filter{flex:1;background:#0b0f1a;border:1px solid #1f2937;color:#e2e8f0;padding:0.4rem 0.7rem;font-size:0.8rem;border-radius:6px;font-family:inherit}
#filter:focus{outline:none;border-color:#fbbf24}
#filter::placeholder{color:#64748b}
.filter-clear{background:none;border:none;color:#64748b;font-size:1.1rem;cursor:pointer;padding:0 0.3rem;line-height:1}
.filter-clear:hover{color:#fbbf24}

/* MAIN — zero vertical margin, content-first */
main{max-width:1280px;margin:0 auto;padding:0 1rem}
.tab-section{display:none}
.tab-section.active{display:block}
.empty-state{padding:1.5rem 1rem;text-align:center;color:#64748b;font-size:0.85rem;border:1px dashed #1f2937;border-radius:6px;margin:1rem 0}

/* ARTICLE GRID — dense, 0 vert margin between rows */
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:0.6rem;padding:0.6rem 0}
.card{background:#0d1220;border:1px solid #1f2937;border-radius:8px;padding:0.85rem;transition:transform 0.12s,border-color 0.12s;display:flex;flex-direction:column}
.card:hover{transform:translateY(-1px);border-color:#fbbf24}
.card .meta{display:flex;justify-content:space-between;align-items:center;font-size:0.7rem;color:#64748b;margin-bottom:0.4rem;text-transform:uppercase;letter-spacing:0.04em}
.card .meta .badge{background:rgba(251,191,36,0.12);color:#fbbf24;padding:1px 6px;border-radius:4px;font-weight:700}
.card .meta .badge.news{background:rgba(96,165,250,0.12);color:#60a5fa}
.card h2{font-size:1.05rem;line-height:1.25;font-weight:800;color:#f1f5f9;margin:0 0 0.4rem;letter-spacing:-0.015em}
.card h2 a{color:#f1f5f9}
.card h2 a:hover{color:#fbbf24;text-decoration:none}
.card .summary{color:#94a3b8;font-size:0.82rem;line-height:1.5;flex:1;margin-bottom:0.5rem}
.card .tags{display:flex;flex-wrap:wrap;gap:0.25rem;margin-bottom:0.4rem}
.card .tag{font-size:0.65rem;background:#1e293b;color:#cbd5e1;padding:1px 5px;border-radius:3px;text-transform:lowercase}
.card .read{font-size:0.75rem;color:#fbbf24;font-weight:700;align-self:flex-start}
.card .hero{font-size:1.6rem;margin-bottom:0.3rem;line-height:1}

/* ARTICLE PAGE (per-article view) */
article.post{max-width:780px;margin:0 auto;padding:0.5rem 1rem 1.5rem}
article.post .post-meta{font-size:0.72rem;color:#64748b;text-transform:uppercase;letter-spacing:0.04em;margin:0.5rem 0 0.3rem;display:flex;gap:0.6rem;flex-wrap:wrap;align-items:center}
article.post .post-meta .badge{background:rgba(251,191,36,0.12);color:#fbbf24;padding:1px 6px;border-radius:4px;font-weight:700}
article.post h1{font-size:1.9rem;line-height:1.15;font-weight:800;color:#fbbf24;letter-spacing:-0.02em;margin-bottom:0.4rem}
article.post .lede{font-size:1.0rem;color:#cbd5e1;margin-bottom:0.8rem;line-height:1.55}
article.post h2{font-size:1.25rem;font-weight:800;color:#fde68a;margin:1.2rem 0 0.4rem;letter-spacing:-0.015em;padding-bottom:0.2rem;border-bottom:1px solid #1f2937}
article.post h3{font-size:1.0rem;font-weight:700;color:#f1f5f9;margin:0.8rem 0 0.25rem}
article.post p{margin:0.45rem 0;color:#d1d5db;font-size:0.95rem}
article.post ul,article.post ol{margin:0.4rem 0 0.6rem 1.3rem;color:#d1d5db}
article.post li{margin:0.18rem 0;font-size:0.93rem}
article.post strong{color:#fde68a;font-weight:700}
article.post em{color:#cbd5e1;font-style:italic}
article.post blockquote{border-left:3px solid #fbbf24;padding:0.4rem 0.8rem;margin:0.6rem 0;background:rgba(251,191,36,0.04);color:#cbd5e1;font-style:italic;font-size:0.93rem}
article.post code{background:#0b0f1a;border:1px solid #1f2937;padding:1px 5px;border-radius:3px;font-size:0.85em;color:#fde68a;font-family:ui-monospace,Consolas,monospace}
article.post .callout{background:#0d1220;border:1px solid #1f2937;border-left:3px solid #60a5fa;padding:0.6rem 0.9rem;margin:0.7rem 0;border-radius:4px;font-size:0.9rem}
article.post .callout strong{color:#60a5fa}
article.post .callout.warn{border-left-color:#f59e0b}
article.post .callout.warn strong{color:#f59e0b}
article.post .examples{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:0.5rem;margin:0.6rem 0}
article.post .ex{background:#0d1220;border:1px solid #1f2937;border-radius:6px;padding:0.6rem}
article.post .ex .h{font-weight:700;color:#fbbf24;font-size:0.85rem;margin-bottom:0.2rem}
article.post .ex .s{color:#94a3b8;font-size:0.75rem;margin-bottom:0.25rem}
article.post .ex .d{color:#cbd5e1;font-size:0.8rem;line-height:1.45}
article.post .sources{margin-top:1rem;padding:0.7rem 0.9rem;background:#0d1220;border:1px solid #1f2937;border-radius:6px;font-size:0.82rem}
article.post .sources h2{font-size:0.95rem;border:none;margin:0 0 0.3rem;padding:0;color:#fbbf24}
article.post .sources ol{margin:0 0 0 1.2rem}
article.post .sources li{margin:0.15rem 0;font-size:0.8rem;color:#94a3b8}
article.post .sources a{color:#fde68a}
article.post .faq{margin-top:1rem}
article.post .faq h2{margin-bottom:0.4rem}
article.post .faq details{background:#0d1220;border:1px solid #1f2937;border-radius:6px;padding:0.5rem 0.7rem;margin:0.3rem 0}
article.post .faq details[open]{border-color:#fbbf24}
article.post .faq summary{cursor:pointer;font-weight:700;color:#fde68a;font-size:0.9rem;list-style:none}
article.post .faq summary::-webkit-details-marker{display:none}
article.post .faq summary::before{content:"▸ ";color:#fbbf24}
article.post .faq details[open] summary::before{content:"▾ "}
article.post .faq .a{margin-top:0.35rem;color:#cbd5e1;font-size:0.88rem;line-height:1.55}
article.post .back{display:inline-block;margin:0.5rem 0;font-size:0.8rem;color:#94a3b8}
article.post .back:hover{color:#fbbf24}

/* HERO STRIP for article page */
.post-hero{display:flex;align-items:center;gap:0.8rem;background:linear-gradient(135deg,#1a1a2e 0%,#2d1e12 100%);padding:0.9rem 1rem;margin-bottom:0;border-bottom:1px solid #1f2937}
.post-hero .icon{font-size:2.2rem;line-height:1}
.post-hero .meta{font-size:0.7rem;color:#94a3b8;text-transform:uppercase;letter-spacing:0.05em}

/* FOOTER (compact) */
footer{background:#070a12;border-top:1px solid #1f2937;color:#94a3b8;padding:0.8rem 1rem;text-align:center;font-size:0.75rem;margin-top:1rem}
footer a{color:#fbbf24}
footer .links{margin-bottom:0.3rem}
footer .links a{margin:0 0.3rem}

/* MOBILE */
@media (max-width:640px){
  .nav-inner{height:44px}
  .bar-inner{padding:0 0.6rem}
  .tab-btn{padding:0.55rem 0.55rem;font-size:0.78rem}
  .filter-wrap{max-width:100%;width:100%;order:99;padding:0.3rem 0 0.4rem}
  .grid{grid-template-columns:1fr;gap:0.5rem;padding:0.5rem 0}
  main{padding:0 0.6rem}
  article.post{padding:0.4rem 0.7rem 1.2rem}
  article.post h1{font-size:1.5rem}
  article.post .lede{font-size:0.95rem}
}
