:root{
  --bg:#0b0f14; --card:#101824; --text:#e8eef6; --muted:#a7b5c7; --link:#8ec5ff;
  --border:#1e2a3b; --shadow: 0 10px 30px rgba(0,0,0,.25);
  --sevCrit:#ff6b6b; --sevWarn:#ffd166; --sevInfo:#7bdff2;
}
*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{font-family: system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif; background:var(--bg); color:var(--text); line-height:1.55}
a{color:var(--link); text-decoration:none}
a:hover{text-decoration:underline}
.wrap{max-width: 980px; margin:0 auto; padding: 16px}
.site-header{position:sticky; top:0; z-index:10; background:rgba(11,15,20,.9); backdrop-filter: blur(10px); border-bottom:1px solid var(--border)}
.site-header .wrap{display:flex; align-items:center; justify-content:space-between; gap:12px}
.logo{font-weight:800; letter-spacing:.2px}
.nav{display:flex; gap:14px; flex-wrap:wrap}
.nav a{color:var(--text); opacity:.9}
.card{background:var(--card); border:1px solid var(--border); border-radius:16px; padding:16px; box-shadow:var(--shadow)}
.grid{display:grid; gap:14px}
.grid.cols-2{grid-template-columns: repeat(2, minmax(0,1fr))}
@media (max-width: 760px){ .grid.cols-2{grid-template-columns: 1fr} }
h1{font-size: clamp(26px, 3vw, 34px); margin: 10px 0 8px}
h2{font-size: 18px; margin: 18px 0 8px}
p{margin: 10px 0}
.muted{color:var(--muted)}
.small{font-size: 12px}
.crumbs{font-size: 13px; color: var(--muted); margin: 10px 0 12px}
.crumbs a{color: var(--muted)}
.crumbs .sep{margin: 0 6px; opacity:.6}
.kv{display:flex; gap:10px; flex-wrap:wrap; align-items:center; margin: 10px 0 0}
.sev{display:inline-flex; align-items:center; gap:8px; padding:6px 10px; border-radius:999px; font-size: 13px; border:1px solid var(--border); background: rgba(255,255,255,.03)}
.sev::before{content:""; width:10px; height:10px; border-radius:50%}
.sev-critical::before{background: var(--sevCrit)}
.sev-warning::before{background: var(--sevWarn)}
.sev-info::before{background: var(--sevInfo)}
.pills a{display:inline-block; padding:8px 10px; border:1px solid var(--border); border-radius:999px; margin:6px 8px 0 0; background: rgba(255,255,255,.03)}
.hr{height:1px; background: var(--border); margin: 18px 0}
.list{margin: 0; padding-left: 18px}
.list li{margin: 6px 0}
.search{display:flex; gap:10px; flex-wrap:wrap}
.search input{flex:1; min-width:240px; padding:12px 12px; border-radius:12px; border:1px solid var(--border); background: rgba(255,255,255,.02); color: var(--text)}
.search button{padding:12px 14px; border-radius:12px; border:1px solid var(--border); background: rgba(255,255,255,.05); color: var(--text); cursor:pointer}
.search button:hover{background: rgba(255,255,255,.08)}
.ad{margin: 14px 0; padding: 10px; border:1px dashed rgba(255,255,255,.15); border-radius: 14px; color: var(--muted); font-size: 12px}
.site-footer{border-top:1px solid var(--border); margin-top: 18px}
.footer-grid{display:grid; grid-template-columns: 2fr 1fr 2fr; gap: 14px}
@media (max-width: 760px){ .footer-grid{grid-template-columns: 1fr} }
.footer-title{font-weight:700; margin-bottom: 8px}
.footer-links{list-style:none; padding:0; margin:0}
.footer-links li{margin: 6px 0}
.notice{padding:12px 14px; border:1px solid var(--border); border-radius:14px; background: rgba(255,255,255,.03)}