:root{
  --bg:#0b1220;
  --panel:#111a2e;
  --panel-2:#0f172a;
  --line:#25324a;
  --text:#e5e7eb;
  --muted:#8fa1bf;
  --ok:#22c55e;
  --ok2:#16a34a;
  --info:#3b82f6;
}
*{box-sizing:border-box}
body{
  margin:0;
  background:radial-gradient(circle at 20% 0%, #17233f 0%, var(--bg) 35%);
  color:var(--text);
  font-family:"Segoe UI",Tahoma,Arial,sans-serif;
}
.topbar{
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  padding:20px;
  border-bottom:1px solid var(--line);
  background:rgba(10,16,30,.7);
  backdrop-filter: blur(6px);
  position:sticky;
  top:0;
  z-index:10;
}
.topbar h1{margin:0 0 4px}
.container{
  max-width:1280px;
  margin:18px auto;
  padding:0 14px 24px;
  display:grid;
  gap:16px;
}
.card{
  background:linear-gradient(180deg,var(--panel),var(--panel-2));
  border:1px solid var(--line);
  border-radius:14px;
  padding:16px;
}
.row{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:12px;
}
.form-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(220px,1fr));
  gap:10px;
}
input,select,button{
  width:100%;
  border-radius:10px;
  border:1px solid #334155;
  background:#0a1325;
  color:var(--text);
  padding:10px 12px;
}
button{
  cursor:pointer;
  border:none;
  background:linear-gradient(135deg,var(--ok),var(--ok2));
  font-weight:600;
}
button.secondary{background:linear-gradient(135deg,#3b82f6,#1d4ed8)}
.btn.ghost{
  display:inline-block;
  text-decoration:none;
  color:var(--text);
  border:1px solid #334155;
  padding:8px 12px;
  border-radius:10px;
}
table{width:100%;border-collapse:collapse;margin-top:10px}
th,td{padding:9px 8px;border-bottom:1px solid var(--line);font-size:13px;vertical-align:top}
th{text-align:left;color:#c4d2ea}
.inline-form{
  display:inline-grid;
  grid-template-columns:220px 110px;
  gap:8px;
  margin:3px 0;
}
.bulk-update{
  margin-top:12px;
  display:grid;
  grid-template-columns:1fr 220px;
  gap:8px;
}
.muted{color:var(--muted);font-size:12px}
.log-item{margin-bottom:12px}
.log-body{
  margin:6px 0 0;
  white-space:pre-wrap;
  background:#050b18;
  border:1px solid #2c3c59;
  border-radius:10px;
  padding:10px;
  max-height:240px;
  overflow:auto;
}
.chip{
  background:#12213d;
  border:1px solid #28406f;
  color:#cfe2ff;
  padding:7px 10px;
  border-radius:999px;
  font-size:12px;
}
.top-actions{display:flex;align-items:center;gap:8px}

.auth-body{
  min-height:100vh;
  display:grid;
  place-items:center;
}
.auth-wrap{width:min(420px,92vw)}
.auth-card{
  border:1px solid var(--line);
  border-radius:14px;
  padding:20px;
  background:linear-gradient(180deg,var(--panel),var(--panel-2));
}
.auth-card h1{margin-top:0}
.auth-form{display:grid;gap:8px}
.alert{
  background:#3f1d1d;
  border:1px solid #7f1d1d;
  color:#fecaca;
  padding:8px 10px;
  border-radius:8px;
  margin:10px 0;
}

@media (max-width: 900px){
  .row,.form-grid,.bulk-update{grid-template-columns:1fr}
  .inline-form{grid-template-columns:1fr}
}