:root {
  --ink:#0f172a; --muted:#64748b; --line:#e2e8f0; --bg:#f8fafc;
  --brand:#b91c1c; --card:#fff; --accent:#0284c7; --big:#9a3412;
}
* { box-sizing:border-box; }
body { margin:0; font-family:"Segoe UI",system-ui,-apple-system,sans-serif;
  color:var(--ink); background:var(--bg); line-height:1.5; }
a { color:var(--accent); }
.top { background:linear-gradient(135deg,#0f172a,#7c2d12); color:#fff; }
.top-inner { max-width:960px; margin:0 auto; padding:28px 20px 32px; }
.logo { font-size:12px; letter-spacing:.1em; text-transform:uppercase;
  color:#fdba74; font-weight:700; display:flex; align-items:center; gap:8px; }
.logo img { width:28px; height:28px; }
h1 { margin:8px 0 8px; font-size:clamp(1.6rem, 3vw, 2rem); }
.tagline { color:#e2e8f0; max-width:680px; margin:0; }
.pills { margin-top:14px; display:flex; flex-wrap:wrap; gap:8px; }
.pills span { background:rgba(154,52,18,.45); border:1px solid #fb923c; color:#fff7ed;
  font-size:12px; font-weight:600; padding:4px 10px; border-radius:999px; }
.nav { margin-top:18px; display:flex; gap:12px; flex-wrap:wrap; }
.btn { color:#fff; text-decoration:none; background:#1e293b; padding:10px 16px;
  border-radius:8px; font-size:14px; font-weight:600; display:inline-block; border:0; cursor:pointer; }
.btn-primary { background:var(--big); }
.btn-primary:hover { background:#c2410c; }
.wrap { max-width:960px; margin:0 auto; padding:24px 20px 40px; }
.panel { background:var(--card); border:1px solid var(--line); border-radius:12px;
  padding:18px; margin-bottom:20px; }
.big3 { display:grid; gap:10px; }
@media (min-width:720px) { .big3 { grid-template-columns:repeat(3,1fr); } }
.big3 .card { border-color:#fed7aa; background:#fff7ed; height:100%; }
.rank { font-size:11px; font-weight:800; color:var(--big); text-transform:uppercase; }
.search-row { display:flex; gap:10px; flex-wrap:wrap; }
#q { flex:1; min-width:200px; padding:12px 14px; border:1px solid var(--line);
  border-radius:8px; font-size:15px; }
select { padding:12px 14px; border:1px solid var(--line); border-radius:8px; font-size:14px; background:#fff; }
#count { color:var(--muted); font-size:13px; margin:10px 0 0; }
.card { border:1px solid var(--line); border-radius:10px; padding:14px 16px;
  margin-bottom:10px; background:var(--card); }
.card h3 { margin:0 0 6px; font-size:16px; }
.meta { font-size:13px; color:var(--muted); margin-bottom:8px; }
.badge { display:inline-block; background:#fee2e2; color:#991b1b; font-size:11px;
  font-weight:700; padding:2px 8px; border-radius:999px; margin-right:6px; }
.warn { background:#b91c1c; color:#fff; font-size:10px; font-weight:800;
  padding:2px 6px; border-radius:4px; margin-right:4px; }
.subscribe-box { text-align:center; }
.subscribe-box p { color:var(--muted); margin:0 0 14px; }
.site-footer { background:#0f172a; color:#94a3b8; padding:32px 20px; font-size:13px; }
.site-footer .inner { max-width:960px; margin:0 auto; display:grid; gap:20px; }
@media (min-width:720px) { .site-footer .inner { grid-template-columns:2fr 1fr 1fr; } }
.site-footer h3 { color:#fdba74; font-size:12px; letter-spacing:.08em; text-transform:uppercase; margin:0 0 8px; }
.site-footer a { color:#e2e8f0; }
.site-footer p { margin:0 0 8px; }
.about { font-size:14px; color:var(--muted); }