:root { --fg:#111; --muted:#666; --bg:#f7f7f7; --card:#fff; --border:#e5e5e5; --danger:#b00020; --warn:#b26a00; --ok:#1b7f3a; }
*{box-sizing:border-box}
body{margin:0;font-family:system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;color:var(--fg);background:var(--bg)}
a{color:inherit}
.wrap{max-width:1100px;margin:0 auto;padding:18px}
.topbar{background:#fff;border-bottom:1px solid var(--border)}
.topbar .wrap{display:flex;align-items:center;gap:14px;justify-content:space-between}
.brand{font-weight:800;letter-spacing:.3px}
.nav a{margin-right:12px;text-decoration:none;color:var(--muted)}
.nav a.active{color:var(--fg);font-weight:700}
.card{background:var(--card);border:1px solid var(--border);border-radius:14px;padding:16px;margin:14px 0;box-shadow:0 2px 8px rgba(0,0,0,.03)}
h1{font-size:22px;margin:6px 0 10px}
h2{font-size:18px;margin:0 0 10px}
.small{font-size:13px;color:var(--muted)}
.row{display:flex;gap:12px;flex-wrap:wrap}
.row > *{flex:1 1 220px}
label{display:block;font-size:13px;color:var(--muted);margin-bottom:6px}
input,select,textarea{width:100%;padding:10px 11px;border:1px solid var(--border);border-radius:10px;background:#fff}
textarea{min-height:120px;resize:vertical}
.btn{display:inline-block;padding:9px 12px;border-radius:10px;border:1px solid var(--border);background:#fff;cursor:pointer;text-decoration:none}
.btn.primary{background:#111;color:#fff;border-color:#111}
.btn.danger{background:var(--danger);color:#fff;border-color:var(--danger)}
.btn.warn{background:var(--warn);color:#fff;border-color:var(--warn)}
.btn.ok{background:var(--ok);color:#fff;border-color:var(--ok)}
.btn:disabled{opacity:.55;cursor:not-allowed}
.table{width:100%;border-collapse:collapse}
.table th,.table td{padding:10px;border-bottom:1px solid var(--border);text-align:left;font-size:14px}
.badge{display:inline-flex;align-items:center;gap:6px;padding:4px 9px;border-radius:999px;border:1px solid var(--border);font-size:12px;color:var(--muted)}
.badge.ok{border-color:rgba(27,127,58,.35);color:var(--ok);background:rgba(27,127,58,.06)}
.badge.warn{border-color:rgba(178,106,0,.35);color:var(--warn);background:rgba(178,106,0,.06)}
.badge.danger{border-color:rgba(176,0,32,.35);color:var(--danger);background:rgba(176,0,32,.06)}
.kpi{display:grid;grid-template-columns:repeat(4,minmax(160px,1fr));gap:12px}
@media (max-width:820px){ .kpi{grid-template-columns:repeat(2,minmax(160px,1fr));} }
.kpi .card{margin:0}
hr{border:0;border-top:1px solid var(--border);margin:12px 0}
.actions{display:flex;gap:8px;flex-wrap:wrap}
code{background:#f2f2f2;padding:2px 6px;border-radius:8px}