:root{
  --bg:#0b0d12; --bg2:#11141c; --card:#151925; --card2:#1b2130;
  --bd:#252c3b; --tx:#e8eaf0; --mut:#8b93a7; --gold:#c9a227; --gold2:#a8851a;
  --grn:#22c55e; --red:#ef4444; --blu:#3b82f6; --org:#f59e0b;
}
*{box-sizing:border-box;margin:0;padding:0;}
body{font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;background:var(--bg);color:var(--tx);-webkit-font-smoothing:antialiased;}
a{color:inherit;text-decoration:none;}
.hidden{display:none !important;}

/* ── LOGIN ── */
.login-wrap{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:24px;background:radial-gradient(1200px 600px at 50% -10%,rgba(201,162,39,.12),transparent),var(--bg);}
.login-card{width:100%;max-width:400px;background:var(--card);border:1px solid var(--bd);border-radius:20px;padding:36px 30px;}
.login-card .brand{text-align:center;margin-bottom:26px;}
.login-card .brand .crown{font-size:34px;color:var(--gold);margin-bottom:10px;}
.login-card .brand h1{font-size:22px;letter-spacing:.5px;}
.login-card .brand p{color:var(--mut);font-size:13px;margin-top:4px;}
.fld{margin-bottom:14px;}
.fld label{display:block;font-size:12px;color:var(--mut);margin-bottom:6px;font-weight:600;}
.inp{width:100%;padding:12px 14px;background:var(--bg2);border:1px solid var(--bd);border-radius:11px;color:var(--tx);font-size:15px;}
.inp:focus{outline:none;border-color:var(--gold);}
.btn-gold{width:100%;padding:13px;background:linear-gradient(135deg,var(--gold),var(--gold2));border:none;border-radius:12px;color:#1a1a1a;font-size:15px;font-weight:800;cursor:pointer;}
.btn-gold:disabled{opacity:.5;cursor:not-allowed;}
.login-msg{margin-top:14px;text-align:center;font-size:13px;font-weight:600;min-height:18px;color:var(--red);}

/* ── LAYOUT ── */
.shell{display:flex;min-height:100vh;}
.side{width:240px;background:var(--bg2);border-right:1px solid var(--bd);display:flex;flex-direction:column;position:fixed;inset:0 auto 0 0;z-index:50;transition:transform .25s;}
.side-top{padding:22px 20px;border-bottom:1px solid var(--bd);}
.side-top h1{font-size:18px;letter-spacing:.5px;display:flex;align-items:center;gap:9px;}
.side-top h1 .crown{color:var(--gold);}
.side-top p{color:var(--mut);font-size:11px;margin-top:3px;text-transform:uppercase;letter-spacing:1px;}
.side-menu{flex:1;padding:14px 12px;display:flex;flex-direction:column;gap:4px;}
.side-menu a{display:flex;align-items:center;gap:11px;padding:11px 14px;border-radius:11px;color:var(--mut);font-size:14px;font-weight:600;cursor:pointer;}
.side-menu a i{width:18px;text-align:center;}
.side-menu a:hover{background:var(--card);color:var(--tx);}
.side-menu a.active{background:linear-gradient(135deg,rgba(201,162,39,.18),rgba(201,162,39,.06));color:var(--gold);}
.side-foot{padding:14px;border-top:1px solid var(--bd);}
.side-foot .who{font-size:12px;color:var(--mut);margin-bottom:10px;padding:0 4px;}
.side-foot .who b{color:var(--tx);}
.btn-logout{width:100%;padding:10px;background:var(--card);border:1px solid var(--bd);border-radius:10px;color:var(--mut);font-size:13px;font-weight:600;cursor:pointer;}
.btn-logout:hover{color:var(--red);border-color:var(--red);}

.main{flex:1;margin-left:240px;padding:26px 30px;max-width:1200px;}
.topbar{display:flex;align-items:center;justify-content:space-between;margin-bottom:24px;}
.topbar h2{font-size:22px;}
.topbar .burger{display:none;background:var(--card);border:1px solid var(--bd);color:var(--tx);border-radius:10px;padding:9px 12px;cursor:pointer;}
.overlay{display:none;position:fixed;inset:0;background:rgba(0,0,0,.5);z-index:40;}

/* ── CARDS / GRID ── */
.section{display:none;}
.section.active{display:block;}
.grid{display:grid;gap:16px;}
.grid-4{grid-template-columns:repeat(4,1fr);}
.grid-3{grid-template-columns:repeat(3,1fr);}
.grid-2{grid-template-columns:repeat(2,1fr);}
.card{background:var(--card);border:1px solid var(--bd);border-radius:16px;padding:18px 20px;}
.stat .lbl{font-size:12px;color:var(--mut);text-transform:uppercase;letter-spacing:.5px;font-weight:700;display:flex;align-items:center;gap:7px;}
.stat .val{font-size:28px;font-weight:900;margin-top:8px;}
.stat .sub{font-size:12px;color:var(--mut);margin-top:4px;}
.pill{display:inline-flex;align-items:center;gap:6px;font-size:12px;font-weight:700;padding:4px 11px;border-radius:99px;}
.pill-grn{background:rgba(34,197,94,.14);color:var(--grn);}
.pill-red{background:rgba(239,68,68,.14);color:var(--red);}
.pill-org{background:rgba(245,158,11,.14);color:var(--org);}
.pill-gold{background:rgba(201,162,39,.16);color:var(--gold);}
.pill-mut{background:var(--card2);color:var(--mut);}

.panel-h{display:flex;align-items:center;justify-content:space-between;margin:6px 0 16px;}
.panel-h h3{font-size:17px;}
.panel-h .desc{color:var(--mut);font-size:13px;margin-top:2px;}

/* ── TABLE ── */
.tbl{width:100%;border-collapse:collapse;font-size:14px;}
.tbl th{text-align:left;color:var(--mut);font-size:11px;text-transform:uppercase;letter-spacing:.5px;padding:10px 12px;border-bottom:1px solid var(--bd);font-weight:700;}
.tbl td{padding:12px;border-bottom:1px solid var(--bd);vertical-align:middle;}
.tbl tr:last-child td{border-bottom:none;}
.tbl .inp{padding:8px 10px;font-size:13px;}
.mini{font-size:12px;color:var(--mut);}

.btn-sm{padding:8px 13px;border-radius:9px;border:none;font-size:13px;font-weight:700;cursor:pointer;}
.btn-sm.gold{background:var(--gold);color:#1a1a1a;}
.btn-sm.ghost{background:var(--card2);color:var(--tx);border:1px solid var(--bd);}
.btn-sm.danger{background:rgba(239,68,68,.14);color:var(--red);}
.btn-sm:hover{opacity:.9;}
.row-msg{font-size:12px;font-weight:600;margin-left:8px;}

select.inp{appearance:none;background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%238b93a7' stroke-width='3'><path d='M6 9l6 6 6-6'/></svg>");background-repeat:no-repeat;background-position:right 12px center;padding-right:32px;}
textarea.inp{resize:vertical;font-family:inherit;line-height:1.6;}

.toast{position:fixed;bottom:24px;right:24px;background:var(--card2);border:1px solid var(--bd);border-left:3px solid var(--grn);border-radius:12px;padding:14px 18px;font-size:14px;font-weight:600;z-index:200;opacity:0;transform:translateY(10px);transition:.25s;}
.toast.show{opacity:1;transform:none;}
.toast.err{border-left-color:var(--red);}

@media(max-width:900px){
  .grid-4{grid-template-columns:repeat(2,1fr);}
  .grid-3,.grid-2{grid-template-columns:1fr;}
  .side{transform:translateX(-100%);}
  .side.open{transform:none;}
  .main{margin-left:0;padding:18px 16px;}
  .topbar .burger{display:block;}
  .tbl{display:block;overflow-x:auto;white-space:nowrap;}
}