:root { font-family: system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif; }
body { margin: 0; background: #0b0f17; color: #e6e9f2; }
a { color: #8ab4ff; text-decoration: none; }
.container { max-width: 980px; margin: 0 auto; padding: 28px 18px; }
.card { background: #121a2a; border: 1px solid #1f2a44; border-radius: 16px; padding: 18px; box-shadow: 0 10px 30px rgba(0,0,0,.25); }
.row { display: flex; gap: 16px; flex-wrap: wrap; }
.row > .card { flex: 1; min-width: 280px; }
h1,h2 { margin: 0 0 12px; }
.muted { color: #a8b0c2; }
.btn { display:inline-block; background:#2b61ff; color:white; padding:10px 14px; border-radius:12px; border:0; cursor:pointer; font-weight:600; }
.btn.secondary { background: #273149; }
.btn.danger { background: #d84747; }
input { width:100%; padding:10px 12px; border-radius:12px; border:1px solid #24314e; background:#0b0f17; color:#e6e9f2; }
label { display:block; margin:10px 0 6px; color:#cbd2e3; font-size: 14px; }
.progress-wrap { background:#0b0f17; border:1px solid #223152; border-radius: 999px; overflow:hidden; height: 22px; }
.progress-bar { height: 22px; background: linear-gradient(90deg, #2b61ff, #6bdaff); width: 0%; }
.kpi { font-size: 28px; font-weight: 800; }
.topbar { display:flex; justify-content:space-between; align-items:center; margin-bottom: 16px; }
code { background:#0b0f17; padding:2px 6px; border-radius:8px; border:1px solid #223152; }
hr { border:0; border-top:1px solid #223152; margin: 16px 0; }
.small { font-size: 13px; }