:root { font-family: ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Arial; }
body { margin:0; background:#0b1220; color:#e7eaf0; }
.wrap { max-width: 980px; margin: 32px auto; padding: 0 16px; }
h1 { margin: 0 0 8px; }
.muted { color:#aab3c5; margin-top: 0; }
.card { background:#121a2b; border:1px solid rgba(255,255,255,0.08); border-radius: 14px; padding: 16px; margin: 14px 0; }
label { display:block; font-size: 12px; color:#b7c0d4; margin: 10px 0 6px; }
input, select { width:100%; padding:10px 12px; border-radius: 10px; border:1px solid rgba(255,255,255,0.12); background:#0b1220; color:#e7eaf0; outline:none; }
.grid { display:grid; grid-template-columns: repeat(5, 1fr); gap: 10px; }
.grid2 { display:grid; grid-template-columns: 2fr 1fr; gap: 10px; margin-top: 8px; }
.row { display:flex; gap: 10px; align-items: center; }
.actions { display:flex; gap: 10px; margin-top: 14px; }
button { padding: 10px 12px; border-radius: 10px; border: 1px solid rgba(255,255,255,0.12); background:#1a2440; color:#e7eaf0; cursor:pointer; }
button.primary { background:#2a5bd7; border-color:#2a5bd7; }
pre { white-space: pre-wrap; word-wrap: break-word; background:#0b1220; padding: 12px; border-radius: 10px; border:1px solid rgba(255,255,255,0.08); max-height: 360px; overflow:auto; }
a { color:#7fb0ff; }
@media (max-width: 980px) {
  .grid { grid-template-columns: 1fr 1fr; }
  .grid2 { grid-template-columns: 1fr; }
}
