:root{
  color-scheme:dark;
  --bg:#07111d;--bg2:#0b1726;--panel:#0f1d2d;--panel2:#132235;--line:#22364c;
  --text:#eef5fb;--muted:#8fa3b8;--blue:#2d8cff;--green:#35c878;--yellow:#e3ad3a;--red:#ef5b67;--cyan:#42c7d9;
  --sidebar:238px;--radius:14px;--shadow:0 18px 50px rgba(0,0,0,.24)
}
*{box-sizing:border-box}html,body{margin:0;min-height:100%;background:var(--bg);color:var(--text);font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}
button,input,select,textarea{font:inherit;color:inherit}button{cursor:pointer}.hidden{display:none!important}
a{color:inherit}.muted{color:var(--muted)}.mono{font-family:ui-monospace,SFMono-Regular,Menlo,monospace}.nowrap{white-space:nowrap}
.login-shell{min-height:100vh;display:grid;place-items:center;padding:24px;background:radial-gradient(circle at 20% 10%,rgba(45,140,255,.12),transparent 32%),linear-gradient(145deg,#07111d,#0b1827)}
.login-card{width:min(430px,100%);background:rgba(15,29,45,.96);border:1px solid var(--line);border-radius:20px;padding:30px;box-shadow:var(--shadow)}
.brand-mark{width:54px;height:54px;border-radius:14px;display:grid;place-items:center;background:linear-gradient(145deg,#1f72e5,#2ca8ff);font-weight:900;letter-spacing:-1px;box-shadow:0 8px 24px rgba(45,140,255,.25)}.brand-mark.small{width:38px;height:38px;border-radius:10px}
.login-card h1{margin:18px 0 4px}.login-card h1 span{color:var(--muted);font-size:.55em}.login-card p{color:var(--muted);margin-top:0}.login-card label{display:block;margin:18px 0 8px;color:#c6d4e2;font-size:.9rem}.login-card input[type=password]{width:100%;margin-top:7px}.check{display:flex!important;gap:8px;align-items:center;color:var(--muted)!important}.check input{width:auto}.security-notes{display:grid;gap:8px;margin-top:22px;color:var(--muted);font-size:.82rem}.security-notes span:before{content:'•';color:var(--green);margin-right:8px}
.app-shell{min-height:100vh}.sidebar{position:fixed;inset:0 auto 0 0;width:var(--sidebar);background:#091522;border-right:1px solid var(--line);padding:16px 12px;display:flex;flex-direction:column;z-index:20}.brand{display:flex;gap:11px;align-items:center;padding:2px 7px 18px;border-bottom:1px solid var(--line);margin-bottom:12px}.brand strong{display:block}.brand small{display:block;color:var(--muted);margin-top:2px}.sidebar nav{display:grid;gap:3px;overflow:auto;padding-right:2px}.nav-group{margin-top:15px;color:#71879c;font-size:.68rem;font-weight:800;letter-spacing:.12em;padding:0 10px}.nav-link{border:0;background:transparent;width:100%;text-align:left;padding:9px 10px;border-radius:9px;color:#aebfd0;display:flex;gap:9px;align-items:center}.nav-link:hover{background:#101f30;color:#fff}.nav-link.active{background:#12335b;color:#fff;box-shadow:inset 3px 0 0 var(--blue)}.nav-link .count{margin-left:auto;background:#263a4d;padding:1px 7px;border-radius:999px;font-size:.72rem}.sidebar-foot{margin-top:auto;border-top:1px solid var(--line);padding-top:10px}.danger-link{color:#f09aa1}
.main{margin-left:var(--sidebar);min-width:0}.topbar{height:74px;position:sticky;top:0;z-index:15;background:rgba(7,17,29,.92);backdrop-filter:blur(14px);border-bottom:1px solid var(--line);display:flex;justify-content:space-between;align-items:center;padding:10px 22px}.topbar h1{font-size:1.3rem;margin:0}.topbar p{font-size:.82rem;color:var(--muted);margin:4px 0 0}.top-status{display:flex;gap:7px;align-items:center;flex-wrap:wrap;justify-content:flex-end}.content{padding:22px;max-width:1680px;margin:0 auto}
.badge{display:inline-flex;align-items:center;gap:5px;padding:4px 8px;border-radius:999px;font-size:.72rem;font-weight:800;border:1px solid transparent;white-space:nowrap}.badge.success{color:#71e6a2;background:rgba(53,200,120,.12);border-color:rgba(53,200,120,.28)}.badge.warning{color:#ffd071;background:rgba(227,173,58,.12);border-color:rgba(227,173,58,.28)}.badge.danger{color:#ff8b95;background:rgba(239,91,103,.12);border-color:rgba(239,91,103,.3)}.badge.info{color:#73baff;background:rgba(45,140,255,.12);border-color:rgba(45,140,255,.28)}.badge.neutral{color:#a9bacb;background:#152537;border-color:#26394d}
.grid{display:grid;gap:14px}.grid.kpi{grid-template-columns:repeat(4,minmax(0,1fr))}.grid.two{grid-template-columns:repeat(2,minmax(0,1fr))}.grid.three{grid-template-columns:repeat(3,minmax(0,1fr))}.card,.panel{background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);box-shadow:0 4px 16px rgba(0,0,0,.08)}.card{padding:16px}.card .label{color:var(--muted);font-size:.78rem}.card .value{font-size:1.6rem;font-weight:850;margin-top:7px;letter-spacing:-.02em}.card .sub{color:var(--muted);font-size:.78rem;margin-top:6px}.panel{padding:16px;margin-top:14px}.panel:first-child{margin-top:0}.panel-head{display:flex;justify-content:space-between;gap:12px;align-items:center;margin-bottom:13px}.panel-head h2,.panel-head h3{margin:0;font-size:1rem}.panel-head p{color:var(--muted);font-size:.8rem;margin:3px 0 0}.actions{display:flex;gap:8px;align-items:center;flex-wrap:wrap}.toolbar{display:flex;gap:9px;align-items:end;flex-wrap:wrap;margin-bottom:12px}.toolbar .grow{flex:1 1 260px}.field{display:grid;gap:5px;min-width:135px}.field label{font-size:.72rem;color:var(--muted)}
input,select,textarea{background:#0b1827;border:1px solid #294158;border-radius:9px;padding:9px 10px;outline:none;min-width:0}input:focus,select:focus,textarea:focus{border-color:#357fcb;box-shadow:0 0 0 2px rgba(45,140,255,.11)}textarea{min-height:90px;resize:vertical}.full{width:100%}.btn{border:1px solid #2c465e;border-radius:9px;background:#15283a;padding:9px 12px;font-weight:760}.btn:hover{filter:brightness(1.08)}.btn.primary{background:#1674e8;border-color:#2e8cff;color:#fff}.btn.success{background:#136a42;border-color:#25855b}.btn.warning{background:#674d18;border-color:#8f6c25}.btn.danger{background:#68242c;border-color:#8e333e}.btn.ghost{background:transparent}.btn.small{padding:6px 9px;font-size:.78rem}.btn:disabled{opacity:.45;cursor:not-allowed}.icon-btn{width:34px;height:34px;border-radius:9px;border:1px solid var(--line);background:#102032;color:#c8d6e3;display:grid;place-items:center}.form-error{min-height:20px;color:#ff8b95;font-size:.82rem;margin-top:8px}
.table-wrap{overflow:auto;border:1px solid var(--line);border-radius:11px}.data-table{width:100%;border-collapse:collapse;min-width:760px}.data-table th{font-size:.7rem;letter-spacing:.03em;color:#8fa3b8;background:#0c1928;text-transform:uppercase;position:sticky;top:0;z-index:1}.data-table th,.data-table td{padding:10px 11px;text-align:left;border-bottom:1px solid #1e3145;vertical-align:top}.data-table tr:last-child td{border-bottom:0}.data-table tbody tr:hover{background:#112337}.data-table td{font-size:.84rem}.empty{padding:36px;text-align:center;color:var(--muted)}.link-btn{border:0;background:transparent;color:#62adff;padding:0;text-align:left}.link-btn:hover{text-decoration:underline}.status-dot{width:8px;height:8px;border-radius:50%;display:inline-block;background:var(--green);margin-right:5px}.status-dot.bad{background:var(--red)}.status-dot.warn{background:var(--yellow)}
.tabs{display:flex;gap:5px;border-bottom:1px solid var(--line);margin:-4px 0 14px;overflow:auto}.tab{border:0;background:transparent;padding:10px 11px;color:var(--muted);border-bottom:2px solid transparent;white-space:nowrap}.tab.active{color:#fff;border-bottom-color:var(--blue)}.kv{display:grid;grid-template-columns:170px 1fr;gap:8px 14px;font-size:.84rem}.kv>div:nth-child(odd){color:var(--muted)}.divider{height:1px;background:var(--line);margin:14px 0}.notice{padding:11px 13px;border-radius:10px;border:1px solid #3c4d5f;background:#101e2c;color:#b8c9d7;font-size:.82rem}.notice.warning{border-color:#6e5528;background:#251f12;color:#e5c67d}.notice.danger{border-color:#6f3137;background:#281518;color:#ef9ba2}.notice.info{border-color:#234c72;background:#0d2032;color:#9dcaf1}.metric-row{display:flex;gap:12px;align-items:center;justify-content:space-between}.code-block{background:#07121e;border:1px solid var(--line);border-radius:10px;padding:12px;white-space:pre-wrap;word-break:break-word;max-height:360px;overflow:auto;font-size:.78rem;color:#abc0d3}
.chart-bars{height:210px;display:flex;gap:10px;align-items:end;padding:18px 4px 4px}.bar{flex:1;background:linear-gradient(180deg,#2f95ff,#215da0);border-radius:5px 5px 0 0;min-height:3px;position:relative}.bar span{position:absolute;left:50%;transform:translateX(-50%);bottom:calc(100% + 4px);font-size:.67rem;color:var(--muted)}
.toast-stack{position:fixed;right:18px;bottom:18px;display:grid;gap:8px;z-index:100}.toast{width:min(390px,calc(100vw - 36px));padding:11px 13px;border:1px solid var(--line);border-radius:10px;background:#102032;box-shadow:var(--shadow);font-size:.84rem}.toast.success{border-color:#256a4a}.toast.error{border-color:#7b3037}
dialog{border:1px solid var(--line);border-radius:16px;padding:0;background:var(--panel);color:var(--text);box-shadow:var(--shadow);width:min(650px,94vw)}dialog::backdrop{background:rgba(0,0,0,.62);backdrop-filter:blur(2px)}.modal-head{padding:16px 17px;border-bottom:1px solid var(--line);display:flex;justify-content:space-between;gap:12px;align-items:flex-start}.modal-head h3{margin:0}.modal-head p{margin:4px 0 0;color:var(--muted);font-size:.8rem}.modal-body{padding:17px}.modal-actions{padding:13px 17px;border-top:1px solid var(--line);display:flex;justify-content:flex-end;gap:8px}.drawer{width:min(900px,96vw);margin-right:0;height:100vh;max-height:100vh;border-radius:15px 0 0 15px}.drawer-body{padding:17px;overflow:auto;height:calc(100vh - 76px)}
.pagination{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-top:11px;color:var(--muted);font-size:.78rem}.pager{display:flex;gap:6px}.row-actions{display:flex;gap:6px;flex-wrap:wrap}.section-title{font-size:.76rem;font-weight:800;letter-spacing:.1em;color:#71879c;margin:20px 0 8px}.danger-zone{border:1px solid #63313a;background:#211418;border-radius:12px;padding:14px}
@media(max-width:1100px){:root{--sidebar:208px}.grid.kpi{grid-template-columns:repeat(2,minmax(0,1fr))}.grid.three{grid-template-columns:1fr 1fr}.top-status .badge:nth-child(2){display:none}}
@media(max-width:760px){.sidebar{transform:translateX(-100%);width:250px}.main{margin-left:0}.topbar{height:auto;min-height:68px;padding:10px 14px}.top-status .badge{display:none}.top-status #buyBadge,.top-status #rechargeBadge{display:inline-flex}.content{padding:12px}.grid.kpi,.grid.two,.grid.three{grid-template-columns:1fr}.panel{padding:12px}.toolbar{align-items:stretch}.toolbar>*{flex:1 1 150px}.drawer{width:100vw;border-radius:0}.data-table{min-width:680px}.kv{grid-template-columns:1fr}.kv>div:nth-child(odd){margin-top:8px}.mobile-nav{display:block}}
