:root{
  --bg:#f6f7fb; --card:#fff; --ink:#242433; --muted:#7b7b8f; --line:#e8e8f0;
  --brand:#e8665a; --brand2:#7c5cff; --ok:#12996b; --warn:#d98613; --bad:#d64545;
  --radius:16px; --shadow:0 2px 12px rgba(40,40,90,.06); --side:250px;
}
*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--ink);
  font:15px/1.55 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif}
aside.side{position:fixed;inset:0 auto 0 0;width:var(--side);background:#fff;border-right:1px solid var(--line);
  padding:18px 14px;display:flex;flex-direction:column;gap:14px;overflow:auto}
.brand{display:flex;align-items:center;gap:9px;font-weight:700}
.brand img{height:34px;display:block}
.brand span{background:linear-gradient(90deg,var(--brand),var(--brand2));color:#fff;border-radius:999px;padding:2px 9px;font-size:11.5px}
aside nav{display:grid;gap:3px}
aside nav a{padding:10px 12px;border-radius:11px;color:#4a4a5e;text-decoration:none;font-size:14.5px}
aside nav a:hover{background:#f4f2ff;color:#3a2f7a}
aside nav a.on{background:linear-gradient(90deg,#fff0ec,#f3f0ff);font-weight:600;color:#3a2f7a}
.note{font-size:12px;color:var(--muted);margin:auto 0 0}
main{margin-left:var(--side);padding:20px 24px 60px;max-width:1200px}
.top{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:18px}
h1{font-size:22px;margin:0}
h2{font-size:17px;margin:26px 0 12px}
h3{font-size:15px;margin:0 0 8px}
.who{color:var(--muted);font-size:13.5px}
.kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:12px}
.kpi{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:14px;box-shadow:var(--shadow)}
.kpi .n{font-size:25px;font-weight:700}
.kpi .l{color:var(--muted);font-size:12.5px;margin-top:3px}
.kpi .d{font-size:12px;margin-top:6px}
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-top:14px}
.card{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:16px;box-shadow:var(--shadow);margin-top:14px}
.grid2 .card{margin-top:0}
.bars{display:grid;gap:9px}
.bar{display:grid;grid-template-columns:78px 1fr 42px;align-items:center;gap:9px;font-size:13.5px}
.bar .t{background:#f0eefb;border-radius:7px;height:11px;overflow:hidden}
.bar .t i{display:block;height:100%;background:linear-gradient(90deg,var(--brand),var(--brand2))}
.donut{width:118px;height:118px;border-radius:50%;margin:6px auto;
  background:conic-gradient(var(--ok) 0 82%,#eceaf6 82% 100%);display:grid;place-items:center}
.donut span{width:82px;height:82px;background:#fff;border-radius:50%;display:grid;place-items:center;font-weight:700;font-size:19px}
.todo{margin:0;padding-left:18px}
.todo li{margin-bottom:6px}
.search{width:100%;max-width:380px;padding:10px 13px;border:1px solid var(--line);border-radius:12px;font:inherit;margin-bottom:10px}
.tablewrap{overflow:auto;background:var(--card);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow)}
table{border-collapse:collapse;width:100%;min-width:620px;font-size:14px}
th,td{text-align:left;padding:10px 12px;border-bottom:1px solid var(--line);white-space:nowrap}
th{background:#faf9ff;font-size:12.5px;color:#5c5a72;text-transform:uppercase;letter-spacing:.04em}
tr:last-child td{border-bottom:0}
.tag{display:inline-block;border-radius:999px;padding:2px 9px;font-size:12px;font-weight:600}
.tag.ok{background:#e6f7f0;color:#0d7a55}
.tag.warn{background:#fdf3e2;color:#96631a}
.tag.bad{background:#fdeaea;color:#a72d2d}
.btn{border:0;border-radius:11px;padding:10px 15px;font:inherit;font-weight:600;color:#fff;
  background:linear-gradient(90deg,var(--brand),var(--brand2));cursor:pointer}
.btn.ghost{background:#fff;color:#3a2f7a;border:1px solid var(--line)}
.lock{font-size:12px;color:var(--warn);font-weight:600}
.report{background:#20202c;color:#d7d7e6;padding:16px;border-radius:12px;font-size:13px;overflow:auto;white-space:pre-wrap}
@media(max-width:900px){
  aside.side{position:static;width:auto;flex-direction:column;border-right:0;border-bottom:1px solid var(--line)}
  aside nav{grid-auto-flow:column;grid-auto-columns:max-content;overflow:auto}
  .note{display:none}
  main{margin-left:0;padding:16px}
  .grid2{grid-template-columns:1fr}
}
