:root { font-family: Inter, system-ui, Arial, sans-serif; color:#172033; background:#f5f7fb; }
* { box-sizing:border-box; }
body { margin:0; }
header { height:64px; background:#14213d; color:white; display:flex; align-items:center; justify-content:space-between; padding:0 32px; }
.brand { font-weight:800; font-size:20px; }
nav { display:flex; gap:20px; } nav a { color:white; text-decoration:none; opacity:.9; }
main { max-width:1400px; margin:0 auto; padding:30px; }
h1 { margin-top:0; }
.cards { display:grid; grid-template-columns:repeat(auto-fit,minmax(190px,1fr)); gap:16px; }
.card,.panel { background:white; border:1px solid #e3e8f0; border-radius:14px; box-shadow:0 3px 14px rgba(20,33,61,.05); }
.card { padding:20px; } .card span { display:block; color:#667085; font-size:13px; margin-bottom:8px; } .card strong { font-size:28px; } .card .small { font-size:16px; }
.actions { display:flex; flex-wrap:wrap; gap:10px; margin:22px 0; }
button,.button { border:1px solid #cbd5e1; background:white; padding:10px 14px; border-radius:9px; cursor:pointer; text-decoration:none; color:#172033; font-weight:600; }
button:hover,.button:hover { background:#f8fafc; } button.primary { background:#2154d6; color:white; border-color:#2154d6; } button.danger { color:#b42318; border-color:#f3b5b0; } button.compact { padding:6px 9px; font-size:12px; }
.panel { padding:20px; margin:18px 0; }.panel h2 { margin-top:0; font-size:18px; }
.progress { height:12px; background:#edf2f7; border-radius:8px; overflow:hidden; }.progress div { height:100%; background:#2154d6; transition:width .3s; }
.muted { color:#667085; font-size:13px; }
.filters { display:flex; gap:10px; flex-wrap:wrap; margin-bottom:10px; }.filters input,.filters select { min-height:40px; border:1px solid #cbd5e1; border-radius:8px; padding:0 10px; background:white; }.filters input { min-width:300px; }
.table-wrap { overflow:auto; background:white; border:1px solid #e3e8f0; border-radius:12px; } table { width:100%; border-collapse:collapse; min-width:1050px; } th,td { text-align:left; padding:10px 12px; border-bottom:1px solid #eef2f6; vertical-align:top; } th { background:#f8fafc; position:sticky; top:0; font-size:13px; } td { font-size:13px; }
.badge { padding:4px 8px; border-radius:999px; font-size:12px; }.badge.active { background:#e8f7ee; color:#19733b; }.badge.excluded { background:#fff0ef; color:#b42318; }
.pager { display:flex; gap:18px; justify-content:center; margin:20px; }.pager a { color:#2154d6; text-decoration:none; }
code { background:#f1f5f9; padding:2px 5px; border-radius:4px; }
nav { align-items:center; }
.nav-form { margin:0; }
.nav-logout { border:0; padding:0; color:white; background:transparent; font-weight:500; opacity:.9; }
.nav-logout:hover { background:transparent; opacity:1; }
.auth-page { min-height:100vh; display:grid; place-items:center; background:#eef2f8; }
.auth-shell { width:min(100%, 460px); padding:24px; }
.auth-card { background:white; border:1px solid #e3e8f0; border-radius:16px; padding:30px; box-shadow:0 12px 40px rgba(20,33,61,.10); }
.auth-brand { color:#2154d6; font-weight:800; margin-bottom:22px; }
.auth-card h1 { margin-bottom:8px; }
.auth-form { display:grid; gap:16px; margin-top:22px; }
.auth-form label { display:grid; gap:7px; font-size:13px; font-weight:600; }
.auth-form input { width:100%; min-height:44px; border:1px solid #cbd5e1; border-radius:9px; padding:0 12px; font:inherit; }
.auth-form input:focus { border-color:#2154d6; outline:3px solid rgba(33,84,214,.12); }
.auth-submit { min-height:44px; }
.auth-error { margin-top:16px; padding:11px 12px; border-radius:9px; background:#fff0ef; color:#b42318; font-size:13px; }