/* Strict responsive dark UI, driven by CSS variables (set from data/theme.json) */
:root{
  --brand: "МУДРиС.Армия";
  --accent:#2b2f36;
  --accent2:#111318;
  --bg:#0b0c0f;
  --card:#12141a;
  --text:#e8eaed;
  --muted:#b4b9c3;
  --border:#2a2f3a;
  --link:#cfd6ff;
  --success:#7ee787;
  --warning:#f2cc60;
  --danger:#ff7b72;
  --radius:14px;
  --font:system-ui, -apple-system, Segoe UI, Roboto, Arial, "Noto Sans", sans-serif;
}
*{box-sizing:border-box}
html,body{margin:0;padding:0;background:var(--bg);color:var(--text);font-family:var(--font);line-height:1.55}
a{color:var(--link);text-decoration:none}
a:hover{text-decoration:underline}
.container{max-width:1100px;margin:0 auto;padding:0 16px}
header{
  position:sticky;top:0;z-index:50;
  background: var(--bg);
  background: color-mix(in srgb, var(--bg) 92%, transparent);
  background: color-mix(in srgb, var(--bg) 88%, transparent);
  backdrop-filter: blur(10px);
  border-bottom:1px solid var(--border);
}
.navbar{display:flex;align-items:center;gap:14px;padding:12px 0}
.brand{display:flex;align-items:center;gap:10px;min-width:200px}
.logo{width:40px;height:40px;border-radius:12px;background:linear-gradient(180deg,var(--accent),var(--accent2));border:1px solid var(--border);}
.brand .t1{font-weight:700;font-size:14px;letter-spacing:.6px;text-transform:uppercase}
.brand .t2{font-size:12px;color:var(--muted)}
nav{flex:1;display:flex;align-items:center;gap:8px;justify-content:flex-end}
.navlinks{display:flex;gap:10px;flex-wrap:wrap;justify-content:flex-end}
.navlinks a{
  font-size:13px;color:var(--muted);
  padding:8px 10px;border-radius:10px;
  border:1px solid transparent;
}
.navlinks a.active, .navlinks a:hover{
  color:var(--text);
  border-color:var(--border);
  background: color-mix(in srgb, var(--card) 88%, transparent);
}
.burger{display:none;cursor:pointer;margin-left:auto}
.burger button{
  background:transparent;border:1px solid var(--border);
  color:var(--text);border-radius:12px;padding:8px 10px;
}
@media (max-width: 920px){
  .brand{min-width:auto}
  .navlinks{display:none}
  .burger{display:block}
  nav{justify-content:flex-end}
}
.drawer{
  display:none;
  border-top:1px solid var(--border);
  background: var(--bg);
  background: color-mix(in srgb, var(--bg) 88%, transparent);
}
.drawer.open{display:block}
.drawer a{
  display:block;padding:12px 16px;
  border-bottom:1px solid var(--border);
  color:var(--muted);
}
.drawer a:hover{color:var(--text);background:rgba(255,255,255,.03)}
main{padding:28px 0 60px}
.section{padding:36px 0;border-bottom:1px solid rgba(42,47,58,.55)}
.section:last-child{border-bottom:none}
.grid{display:grid;gap:14px}
.grid.cols-2{grid-template-columns:repeat(2,1fr)}
.grid.cols-3{grid-template-columns:repeat(3,1fr)}
@media (max-width: 900px){
  .grid.cols-2,.grid.cols-3{grid-template-columns:1fr}
}
.card{
  background: var(--card);
  border:1px solid var(--border);
  border-radius:var(--radius);
  padding:16px;
}
.card h3{margin:0 0 8px 0;font-size:16px}
.card p{margin:0;color:var(--muted)}
.kicker{font-size:12px;text-transform:uppercase;letter-spacing:.6px;color:var(--muted);margin:0 0 8px}
h1{font-size:38px;line-height:1.1;margin:0 0 10px}
@media (max-width: 520px){h1{font-size:30px}}
h2{font-size:26px;margin:0 0 10px}
.lead{color:var(--muted);max-width:780px}
.badges{display:flex;flex-wrap:wrap;gap:8px;margin-top:14px}
.badge{
  font-size:12px;color:var(--muted);
  border:1px solid var(--border);
  padding:6px 10px;border-radius:999px;
  background: color-mix(in srgb, var(--card) 92%, transparent);
}
.actions{display:flex;gap:10px;flex-wrap:wrap;margin:16px 0 4px}
.btn{
  display:inline-flex;align-items:center;gap:8px;
  padding:10px 14px;border-radius:12px;
  border:1px solid var(--border);
  color:var(--text);
  background: color-mix(in srgb, var(--card) 88%, transparent);
  font-size:14px;
}
.btn.primary{
  background:linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,.02));
  border-color:rgba(255,255,255,.12);
}
.btn:hover{filter:brightness(1.05)}
.list{margin:10px 0 0 0;padding-left:18px;color:var(--muted)}
.list li{margin:7px 0}
.split{display:grid;grid-template-columns:1.2fr .8fr;gap:14px;align-items:start}
@media (max-width: 900px){.split{grid-template-columns:1fr}}
hr.sep{border:none;border-top:1px solid rgba(42,47,58,.55);margin:16px 0}
.footer{
  padding:20px 0 34px;color:var(--muted);
  border-top:1px solid var(--border);
  font-size:13px;
}
.notice{
  border-left:3px solid var(--warning);
  padding:12px 14px;background:rgba(242,204,96,.06);
  border-radius:12px;border:1px solid rgba(242,204,96,.18);
}
.small{font-size:12px;color:var(--muted)}
.code{
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
  background: color-mix(in srgb, var(--card) 88%, transparent);border:1px solid var(--border);
  padding:10px 12px;border-radius:12px;overflow:auto;
}
