:root{--bg:#070b14;--card:#121b2e;--card2:#0a1020;--muted:#8aa0c2;--text:#e9f0ff;--accent:#fedb3e;--danger:#ff5c5c;--ok:#5affb2}
*{box-sizing:border-box}body{margin:0;font-family:system-ui,-apple-system,Segoe UI,Roboto,Arial;background:linear-gradient(180deg,var(--bg),#0b1220);color:var(--text)}
a{color:var(--accent);text-decoration:none}
.container{max-width:1180px;margin:0 auto;padding:22px}
.card{background:rgba(18,27,46,.92);border:1px solid rgba(138,160,194,.2);border-radius:18px;padding:16px;box-shadow:0 10px 30px rgba(0,0,0,.25)}
.card.soft{background:rgba(10,16,32,.6)}
.grid{display:grid;gap:16px}
@media(min-width:980px){.grid.cols-2{grid-template-columns:1fr 1fr}.grid.cols-3{grid-template-columns:1fr 1fr 1fr}}
.h1{font-size:24px;margin:0 0 6px}.h2{font-size:18px;margin:0 0 10px}.muted{color:var(--muted)}
.input,.select{width:100%;padding:12px 12px;border-radius:12px;border:1px solid rgba(138,160,194,.25);background:var(--card2);color:var(--text)}
.btn{display:inline-flex;align-items:center;gap:8px;padding:10px 14px;border-radius:12px;border:1px solid rgba(138,160,194,.25);background:var(--card2);color:var(--text);cursor:pointer}
.btn.primary{background:var(--accent);color:#111;border-color:rgba(0,0,0,.1);font-weight:800}
.btn.danger{background:transparent;border-color:rgba(255,92,92,.5);color:var(--danger)}
.btn.ok{background:transparent;border-color:rgba(90,255,178,.45);color:var(--ok)}
.row{display:flex;gap:12px;align-items:center;flex-wrap:wrap}
.table{width:100%;border-collapse:collapse}
.table th,.table td{padding:10px;border-bottom:1px solid rgba(138,160,194,.18);text-align:left;font-size:14px;vertical-align:top}
.badge{display:inline-block;padding:4px 10px;border-radius:999px;border:1px solid rgba(138,160,194,.25);color:var(--muted);font-size:12px}
.badge.accent{border-color:rgba(254,219,62,.45);color:var(--accent)}
.toast{margin-top:10px;padding:10px;border-radius:12px;border:1px solid rgba(138,160,194,.2);background:rgba(10,16,32,.9)}
.toast.ok{border-color:rgba(90,255,178,.35)}.toast.err{border-color:rgba(255,92,92,.45)}
.nav{display:flex;gap:10px;flex-wrap:wrap;margin:10px 0 16px}
.nav a{padding:8px 12px;border-radius:999px;border:1px solid rgba(138,160,194,.2);background:rgba(10,16,32,.5)}
.nav a.active{border-color:rgba(254,219,62,.45);color:var(--accent)}
hr{border:none;border-top:1px solid rgba(138,160,194,.18);margin:14px 0}
