:root { --bg:#0b1020; --panel:#121a2f; --muted:#9fb0d4; --text:#eef3ff; --accent:#5ea0ff; --danger:#ff6b6b; --ok:#2ecc71; }
* { box-sizing:border-box; }
body { margin:0; font-family:Inter,Arial,sans-serif; background:var(--bg); color:var(--text); }
a { color:var(--text); text-decoration:none; display:block; padding:10px 12px; border-radius:10px; }
a:hover { background:rgba(255,255,255,.06); }
.shell { display:flex; min-height:100vh; }
.sidebar { width:230px; padding:24px 16px; background:#0f1730; border-right:1px solid rgba(255,255,255,.08); }
.content { flex:1; padding:28px; max-width:1200px; }
.card { background:var(--panel); border:1px solid rgba(255,255,255,.08); border-radius:18px; padding:20px; box-shadow:0 10px 30px rgba(0,0,0,.2); }
.center-card { min-height:90vh; display:grid; place-items:center; }
.narrow { max-width:420px; width:100%; }
.grid { display:grid; gap:18px; margin-bottom:18px; }
.grid.three { grid-template-columns:repeat(3,1fr); }
.grid.two { grid-template-columns:repeat(2,1fr); }
.stack { display:grid; gap:14px; }
label { display:grid; gap:8px; color:var(--muted); font-size:14px; }
input, textarea, button { width:100%; border-radius:12px; border:1px solid rgba(255,255,255,.12); padding:12px 14px; font:inherit; }
input, textarea { background:#0c1428; color:var(--text); }
textarea { min-height:110px; }
button { background:var(--accent); color:white; border:none; cursor:pointer; font-weight:600; }
button:hover { opacity:.95; }
button.danger, .ghost.danger { background:var(--danger); }
.ghost { background:transparent; border:1px solid rgba(255,255,255,.12); }
.alert { padding:14px 16px; border-radius:12px; margin-bottom:16px; }
.alert.success { background:rgba(46,204,113,.15); border:1px solid rgba(46,204,113,.35); }
.alert.error { background:rgba(255,107,107,.15); border:1px solid rgba(255,107,107,.35); }
.row { display:flex; gap:14px; align-items:center; }
.between { justify-content:space-between; }
.big { font-size:40px; margin:0; }
.muted, small { color:var(--muted); }
.list-item { padding:12px 0; border-bottom:1px solid rgba(255,255,255,.06); display:flex; justify-content:space-between; gap:12px; }
code { background:#0b1225; padding:2px 6px; border-radius:8px; }
@media (max-width: 900px) {
  .shell { display:block; }
  .sidebar { width:auto; }
  .grid.two, .grid.three { grid-template-columns:1fr; }
}
