:root { --bg:#0b0f17; --panel:#121a26; --text:#e8eefc; --muted:#98a6c7; --accent:#5aa6ff; --danger:#ff5a7a; --ok:#3ddc97; }
*{box-sizing:border-box} body{margin:0;font-family:system-ui,-apple-system,Segoe UI,Roboto,Arial;background:var(--bg);color:var(--text)}
a{color:var(--accent);text-decoration:none} a:hover{text-decoration:underline}
.topbar{display:flex;align-items:center;justify-content:space-between;padding:14px 18px;background:var(--panel);border-bottom:1px solid #1d2a40}
.brand{font-weight:700}
.nav a{margin-left:14px;color:var(--text);opacity:.9}
.container{max-width:1100px;margin:22px auto;padding:0 14px}
.card{background:var(--panel);border:1px solid #1d2a40;border-radius:12px;padding:16px;margin:14px 0;box-shadow:0 12px 24px rgba(0,0,0,.25)}
.h1{font-size:22px;margin:0 0 10px}
.muted{color:var(--muted)}
.grid{display:grid;grid-template-columns:repeat(12,1fr);gap:12px}
.col-4{grid-column:span 4} .col-6{grid-column:span 6} .col-8{grid-column:span 8} .col-12{grid-column:span 12}
@media(max-width:860px){.col-4,.col-6,.col-8{grid-column:span 12}}
.table{width:100%;border-collapse:collapse}
.table th,.table td{padding:10px;border-bottom:1px solid #1d2a40;text-align:left}
.btn{display:inline-block;background:var(--accent);color:#06101f;padding:9px 12px;border-radius:10px;font-weight:650;border:none;cursor:pointer}
.btn.secondary{background:#273a59;color:var(--text)}
.btn.danger{background:var(--danger);color:#fff}
.input, textarea{width:100%;padding:10px;border-radius:10px;border:1px solid #233452;background:#0d1420;color:var(--text)}
textarea{min-height:160px}
.kpi{font-size:24px;font-weight:750}
.footer{padding:18px;text-align:center;color:var(--muted)}
.form-row{margin:10px 0}
.small{font-size:12px}