:root{
  --bg:#0b1020;
  --card:#121a33;
  --text:#e9eefb;
  --muted:#9fb3d2;
  --accent:#4ea1ff;
  --ok:#2ecc71;
  --warn:#f39c12;
  --err:#e74c3c;
}

*{box-sizing:border-box}
html,body{height:100%}
body{
  margin:0;
  font-family: system-ui, -apple-system, Segoe UI, Roboto, Ubuntu, Cantarell, 'Helvetica Neue', Arial, 'Apple Color Emoji','Segoe UI Emoji';
  background: radial-gradient(1200px 800px at 20% -20%, #1b2a5b, transparent), var(--bg);
  color:var(--text);
}

.container{max-width:1040px;margin:0 auto;padding:24px}
.header{
  display:flex;align-items:center;justify-content:space-between;margin-bottom:16px
}
.brand{font-size:20px;font-weight:700;letter-spacing:.3px}
.card{
  background:linear-gradient(180deg, rgba(255,255,255,.05), rgba(255,255,255,.02));
  border:1px solid rgba(255,255,255,.08);
  border-radius:16px;padding:20px;margin:12px 0;box-shadow:0 10px 30px rgba(0,0,0,.25);
}
.card h2{margin:0 0 12px 0;font-size:18px}
input,select,button,textarea{
  width:100%;padding:12px 14px;margin:8px 0;border-radius:12px;border:1px solid rgba(255,255,255,.15);
  background:#0f1731;color:var(--text);outline:none
}
input:focus,select:focus,textarea:focus{border-color:var(--accent);box-shadow:0 0 0 3px rgba(78,161,255,.15)}
button{
  background:linear-gradient(135deg, #3a7bd5, #00d2ff);
  border:none;font-weight:700;cursor:pointer;transition:transform .06s ease, filter .2s;
}
button:hover{filter:brightness(1.05)}
button:active{transform:translateY(1px)}
.row{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.row-3{display:grid;grid-template-columns:1fr 1fr 1fr;gap:12px}
@media (max-width:720px){.row,.row-3{grid-template-columns:1fr}}
.badge{display:inline-block;padding:4px 10px;border-radius:999px;font-size:12px;background:#111c3b;border:1px solid rgba(255,255,255,.08);color:var(--muted)}
.table{width:100%;border-collapse:collapse}
.table th,.table td{padding:10px;border-bottom:1px dashed rgba(255,255,255,.1);text-align:left;vertical-align:top;word-break:break-word}
.grid{display:grid;grid-template-columns:1fr 1fr;gap:18px}
@media (max-width:980px){.grid{grid-template-columns:1fr}}
.mono{font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace}
.small{font-size:13px;color:var(--muted)}
.footer{margin-top:24px;color:var(--muted);font-size:12px;text-align:center}
.alert{padding:10px 14px;border-radius:10px;margin:10px 0}
.alert.ok{background:rgba(46,204,113,.15);border:1px solid rgba(46,204,113,.4)}
.alert.err{background:rgba(231,76,60,.15);border:1px solid rgba(231,76,60,.4)}
.no-overflow{overflow-wrap:anywhere;word-break:break-word}