.admin-body{background:#f4f8f5;display:grid;grid-template-columns:240px 1fr;min-height:100vh;margin:0}
.sidebar{background:#fff;border-right:1px solid var(--border);padding:20px 16px;display:flex;flex-direction:column;gap:6px;position:sticky;top:0;height:100vh}
.sidebar nav{display:flex;flex-direction:column;gap:4px;flex:1}
.sidebar nav a{padding:10px 14px;border-radius:10px;color:var(--ink);font-weight:500;font-size:14px}
.sidebar nav a:hover{background:var(--green-50);color:var(--green-700)}
.sidebar nav a.active{background:var(--green-500);color:#fff}
.sidebar .back{color:var(--muted);font-size:13px;padding:10px 14px}
.sidebar .back:hover{color:var(--green-700)}
.admin-main{padding:32px 40px}
.admin-top{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:28px}
.admin-top h1{margin:0 0 4px;font-size:26px}
.muted{color:var(--muted);margin:0;font-size:14px}
.admin-user{display:flex;gap:12px;align-items:center;background:#fff;padding:10px 16px;border-radius:12px;border:1px solid var(--border);font-size:13px}

.kpis{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-bottom:24px}
.kpi{background:#fff;border:1px solid var(--border);border-radius:14px;padding:20px;display:flex;flex-direction:column;gap:6px}
.kpi span{color:var(--muted);font-size:13px}
.kpi strong{font-size:26px;color:var(--ink)}
.kpi em{font-style:normal;font-size:12px;font-weight:600}
.kpi .up{color:var(--green-600)}

.grid-2{display:grid;grid-template-columns:1.4fr 1fr;gap:16px;margin-bottom:24px}
.panel{background:#fff;border:1px solid var(--border);border-radius:14px;padding:22px;margin-bottom:16px}
.panel h3{margin:0 0 16px;font-size:16px}
.panel-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:16px}
.panel-head h3{margin:0}

.chart{display:flex;align-items:flex-end;gap:14px;height:200px;padding:20px 0 30px}
.chart .b{flex:1;background:linear-gradient(180deg,var(--green-400),var(--green-600));border-radius:8px 8px 0 0;position:relative;transition:all .3s;min-height:20px}
.chart .b:hover{opacity:.85}
.chart .b::after{content:attr(data-day);position:absolute;bottom:-22px;left:0;right:0;text-align:center;font-size:11px;color:var(--muted)}
.chart .b::before{content:attr(data-val);position:absolute;top:-20px;left:0;right:0;text-align:center;font-size:11px;color:var(--ink);font-weight:600}

.bars{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:14px}
.bars li{display:grid;grid-template-columns:110px 1fr 40px;align-items:center;gap:12px;font-size:14px}
.bar{background:var(--green-50);height:8px;border-radius:999px;overflow:hidden}
.bar i{display:block;height:100%;background:var(--green-500);border-radius:999px}
.bars b{text-align:right;color:var(--green-700);font-size:13px}

table{width:100%;border-collapse:collapse;font-size:14px}
table th,table td{text-align:left;padding:12px 10px;border-bottom:1px solid var(--border)}
table th{color:var(--muted);font-weight:600;font-size:12px;text-transform:uppercase;letter-spacing:.05em}
table tr:last-child td{border-bottom:0}
.badge{display:inline-block;padding:4px 10px;border-radius:999px;font-size:12px;font-weight:600}
.badge.ok{background:var(--green-100);color:var(--green-700)}
.badge.warn{background:#fff4d6;color:#8a6100}
.badge.err{background:#fde3e3;color:#a11212}

@media (max-width:900px){
  .admin-body{grid-template-columns:1fr}
  .sidebar{position:relative;height:auto;flex-direction:row;overflow-x:auto}
  .sidebar nav{flex-direction:row}
  .sidebar .back{display:none}
  .kpis,.grid-2{grid-template-columns:1fr 1fr}
  .admin-main{padding:20px}
}