:root{
  --bg:#ecebef;
  --panel:#f7f6f8;
  --panel2:#efedf0;
  --sidebar:#414858;
  --sidebar2:#363d4c;
  --sidebarLine:#515969;
  --head:#444c5b;
  --head2:#586174;
  --line:#c9c8cd;
  --lineDark:#aeb0b6;
  --text:#30343b;
  --muted:#737986;
  --primary:#7189b3;
  --primaryDark:#566f9c;
  --green:#2d8a5a;
  --red:#a44750;
  --amber:#a57a26;
  --shadow:0 6px 16px rgba(35,39,48,.18);
}
*{box-sizing:border-box}
html,body{margin:0;min-height:100%;font-family:"Segoe UI",Tahoma,Arial,sans-serif;background:var(--bg);color:var(--text)}
body{min-height:100vh}
button,input,textarea,select{font:inherit}.hidden{display:none!important}
.shell{min-height:100vh;margin:0;padding:0}.muted{color:var(--muted);font-size:12px}.eyebrow{font-size:10px;font-weight:800;letter-spacing:.12em;color:#657086}

/* Login */
.loginWrap{min-height:100vh;display:grid;place-items:center;align-content:center;gap:18px;background:linear-gradient(135deg,#d9d9dd,#f3f2f4)}
.loginBrand{text-align:center}.brandMark{width:60px;height:60px;border-radius:50%;display:grid;place-items:center;margin:0 auto 12px;background:linear-gradient(#d95b61,#8c333c);color:white;border:4px solid #d2d3d7;box-shadow:0 3px 8px rgba(0,0,0,.28);font-weight:900}.loginBrand h1{margin:0;font-size:28px;color:#343b49}.loginBrand p{margin:6px 0;color:#747a84}
.loginCard{width:min(440px,calc(100vw - 28px));padding:22px;background:#f7f6f8;border:1px solid #b9bbc1;box-shadow:var(--shadow);display:grid;gap:14px}.loginCard small{text-align:center;color:#727987;line-height:1.45}

/* Main layout inspired by classic game admin panels */
.appFrame{min-height:100vh;display:grid;grid-template-columns:230px minmax(0,1fr)}
.sidePanel{background:linear-gradient(180deg,var(--sidebar),var(--sidebar2));color:#fff;min-height:100vh;box-shadow:5px 0 12px rgba(0,0,0,.22);position:sticky;top:0;height:100vh;display:flex;flex-direction:column;z-index:30}
.sideBrand{height:64px;display:flex;align-items:center;gap:12px;padding:0 16px;border-bottom:1px solid var(--sidebarLine);background:rgba(0,0,0,.08)}
.powerLogo{width:34px;height:34px;border-radius:50%;display:grid;place-items:center;background:linear-gradient(#d65e64,#863039);border:3px solid rgba(255,255,255,.28);font-weight:900;font-size:19px;box-shadow:0 2px 7px rgba(0,0,0,.35)}
.sideBrand strong{display:block;font-size:16px;text-shadow:0 1px 0 rgba(0,0,0,.45)}.sideBrand small{display:block;color:#c8ccd4;font-size:10px;margin-top:2px}
.sideAccount{padding:12px 15px;border-bottom:1px solid var(--sidebarLine);background:rgba(255,255,255,.025)}.sideAccountText{font-size:10px;color:#c9ced7;margin-top:7px;line-height:1.35;word-break:break-word}
.roleBadge{display:inline-flex;font-size:9px;font-weight:800;letter-spacing:.06em;padding:4px 7px;border-radius:3px;background:#65799e;color:#fff;border:1px solid rgba(255,255,255,.18)}.roleBadge.customer{background:#54745f}
.mainNav{display:flex;flex-direction:column;overflow:auto;padding:0;margin:0;flex:1}
.navBtn{height:42px;width:100%;display:grid;grid-template-columns:25px 1fr 20px;align-items:center;text-align:left;gap:4px;border:0;border-bottom:1px solid var(--sidebarLine);border-radius:0;padding:0 13px;color:#f2f3f5;background:transparent;font-size:13px;cursor:pointer;text-shadow:0 1px 0 rgba(0,0,0,.42)}
.navBtn:hover,.navBtn.active{background:rgba(255,255,255,.08)}.navBtn.active{box-shadow:inset 4px 0 0 #8aa2cc}.navIcon{font-size:15px;color:#e6e8ec}.navPlus{text-align:center;font-size:18px;color:#e1e3e8;font-weight:300}
.sideFooter{text-align:center;padding:14px 8px;color:#d7dae0;font-size:10px;border-top:1px solid var(--sidebarLine)}.sideFooter span{color:#aeb6c6}

.workspace{min-width:0;background:var(--bg);padding:8px 12px 40px}
.topbar{min-height:54px;display:flex;justify-content:space-between;align-items:center;gap:15px;padding:7px 10px 7px 14px;margin-bottom:14px;background:linear-gradient(180deg,var(--head2),var(--head));border:1px solid #7a7f89;box-shadow:0 3px 8px rgba(0,0,0,.22);color:white}
.topbar .eyebrow{color:#d5d9e0}.topbar h1{font-size:18px;margin:2px 0 0;font-weight:700;text-shadow:0 1px 0 rgba(0,0,0,.45)}.topActions{display:flex;align-items:center;gap:6px}

.tabpane{max-width:1480px;margin:0 auto}.pageTitle{display:flex;justify-content:space-between;align-items:flex-end;gap:14px;margin:0 0 10px;padding:0 3px}.pageTitle h2{font-size:18px;margin:0 0 3px;color:#333944}.pageTitle p{margin:0;color:#727783;font-size:12px}.pageActions{display:flex;gap:7px;align-items:center}.pageActions select{min-width:220px}

button{border:1px solid #596c8b;border-radius:2px;padding:7px 11px;font-size:12px;font-weight:700;cursor:pointer;color:white;background:linear-gradient(#8299bf,#657da7);text-shadow:0 1px 0 rgba(0,0,0,.25);box-shadow:inset 0 1px rgba(255,255,255,.2)}button:hover{filter:brightness(1.05)}button.primary{background:linear-gradient(#8299bf,#657da7)}button.ghost{background:linear-gradient(#6c7584,#535d6d);border-color:#4b5361}.dangerSoft,button.danger{background:linear-gradient(#b45b64,#93404a);border-color:#7f3640}.wide{width:100%}
input,textarea,select{width:100%;border:1px solid #b8bac0;background:#fff;color:#353941;border-radius:2px;padding:7px 8px;outline:none;box-shadow:inset 0 1px 3px rgba(0,0,0,.08)}input:focus,textarea:focus,select:focus{border-color:#758db6;box-shadow:0 0 0 2px rgba(113,137,179,.16),inset 0 1px 3px rgba(0,0,0,.08)}textarea{min-height:78px;resize:vertical}label{display:grid;gap:5px;color:#3e424a;font-size:12px;font-weight:700}label small{font-size:10px;font-weight:500;line-height:1.35;color:#777d88}

.card,dialog{background:linear-gradient(180deg,#f8f7f9,#efedef);border:1px solid #bdbec4;box-shadow:var(--shadow)}
.statsGrid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:10px;margin-bottom:12px}.statCard{padding:13px;display:flex;align-items:center;gap:10px;min-height:76px}.statIcon{width:38px;height:38px;display:grid;place-items:center;background:#434b5a;color:white;border:1px solid #303642;font-size:18px;box-shadow:inset 0 1px rgba(255,255,255,.18)}.statCard b{display:block;font-size:20px;color:#353a44}.statCard span{display:block;color:#535963;font-size:11px;margin-top:2px}.statCard small{display:block;color:#818691;font-size:9px;margin-top:2px}
.infoCard{padding:14px 16px;display:flex;justify-content:space-between;align-items:center;margin-bottom:12px}.infoCard h3{margin:2px 0 4px}.infoCard p{margin:0;color:#737985}.quota{text-align:right}.quota span{display:block;color:#777e88;font-size:10px}.quota b{font-size:20px}
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(330px,1fr));gap:11px}.botCard,.customerCard,.providerCard{padding:0 14px 14px;overflow:hidden}.botCard:before,.customerCard:before,.providerCard:before{content:"";display:block;height:27px;background:linear-gradient(180deg,#555e6e,#3f4756);margin:0 -14px 12px;border-bottom:1px solid #303644}.cardTop{display:flex;justify-content:space-between;align-items:flex-start;gap:9px}.cardTop h3{margin:0 0 3px;color:#353a43}.titleLine{display:flex;align-items:center;gap:6px;flex-wrap:wrap}.ownerPill{font-size:9px;padding:3px 5px;background:#e7edf6;color:#536b96;border:1px solid #bdcbe1}.status{font-size:9px;font-weight:800;padding:4px 6px;background:#eee1e3;color:#8c434b;border:1px solid #d3afb3}.status.ok{background:#dcecdf;color:#39714c;border-color:#a8c9b0}.status.off{background:#eee1e3;color:#91454e}.status.expired{background:#f3e9cf;color:#856721;border-color:#dac591}
.badgeRow{display:flex;gap:5px;flex-wrap:wrap;margin-top:10px}.badge{font-size:9px;padding:4px 6px;background:#e9e9ec;border:1px solid #c7c8cd;color:#535862}.badge.fast{background:#f3e6b8;border-color:#d6bc62;color:#725b12}.dangerBadge{background:#eed9dd;border-color:#d7aab2;color:#87434c}.metricRow{display:grid;grid-template-columns:repeat(3,1fr);gap:7px;margin-top:10px}.metricRow>div{background:#fff;border:1px solid #c9cbd0;padding:8px}.metricRow small{display:block;color:#777d87;font-size:9px}.metricRow b{font-size:15px}.providerMeta{margin-top:8px;background:#f9f9fa;border:1px solid #c9cbd0;padding:8px;color:#626873;font-size:10px;line-height:1.45}.cardActions{display:flex;gap:5px;flex-wrap:wrap;margin-top:10px}.cardActions button{padding:6px 9px;font-size:10px}
.customerMeta{display:grid;grid-template-columns:1fr 1fr;gap:7px;margin-top:10px}.customerMeta>div{background:#fff;border:1px solid #c9cbd0;padding:8px}.customerMeta small{display:block;color:#777d87;font-size:9px}.customerMeta b{display:block;margin-top:2px;font-size:12px}.permissionPills{display:flex;gap:4px;flex-wrap:wrap;margin-top:8px}.permissionPills span{font-size:8px;background:#deebdf;color:#43714d;border:1px solid #b6ccb9;padding:3px 5px}.adminNote{margin-top:8px;padding:7px;border-left:3px solid #7189b3;background:#edf1f7;color:#616874;font-size:10px}.emptyState{padding:24px;color:#737984;text-align:center}

.formCard{padding:0 14px 14px}.panelHeader{background:linear-gradient(180deg,#565e6d,#404756);color:#fff;margin:0 -14px 14px;padding:5px 10px;text-align:center;font-weight:700;font-size:13px;text-shadow:0 1px rgba(0,0,0,.4)}.formGrid{display:grid;grid-template-columns:1fr 1fr;gap:11px}.formGrid.four{grid-template-columns:repeat(4,1fr)}.full{grid-column:1/-1}.switch{display:flex;align-items:center;gap:7px}.switch input{width:auto;accent-color:#657ca6}.switch span{line-height:1.35}.highlight{padding:10px;background:#fbf5db;border:1px solid #d7c47b}.highlight small{color:#7f713d}.fastBox{padding:11px;border:1px solid #cdb562;background:#f6edc9;display:grid;grid-template-columns:1.25fr .75fr;gap:11px;align-items:center}.formFooter{display:flex;justify-content:flex-end;margin-top:13px}.fixedRules{display:flex;gap:5px;flex-wrap:wrap;margin-bottom:13px}.fixedRules span{font-size:9px;background:#e0ede2;color:#3f724d;border:1px solid #b2ceb7;padding:4px 6px}
.brandingCard{max-width:900px}.lockedBranding{background:#edf1f7;border:1px solid #bcc9dd;padding:10px}.brandPreview{display:flex;gap:11px;align-items:flex-start;margin-top:13px;padding:12px;background:white;border:1px solid #c4c6cb}.previewAvatar{width:42px;height:42px;border-radius:50%;display:grid;place-items:center;background:linear-gradient(#d45b61,#8e343d);color:white;font-weight:900;border:3px solid #d4d5d9}.brandPreview b{font-size:12px}.brandPreview p{margin:5px 0 0;white-space:pre-line;color:#5d626b;font-size:11px;line-height:1.45}

/* Dialogs */
dialog{width:min(960px,calc(100vw - 20px));max-height:92vh;padding:0;color:#343840;border-radius:0}dialog::backdrop{background:rgba(29,33,41,.65)}.modalForm{padding:14px}.modalHead{display:flex;align-items:center;justify-content:space-between;gap:10px;background:linear-gradient(180deg,#555e6d,#404756);color:#fff;margin:-14px -14px 14px;padding:9px 12px}.modalHead h2{margin:0 0 2px;font-size:17px}.modalHead .muted{color:#d8dce3}.modalActions{display:flex;align-items:center;justify-content:flex-end;gap:7px;margin-top:16px}.x{background:transparent;border:0;box-shadow:none;font-size:25px;padding:0 6px}.formSection{font-size:12px;margin:18px 0 9px;padding:5px 8px;background:linear-gradient(180deg,#555e6d,#404756);color:#fff;text-align:center;border:0;text-shadow:0 1px rgba(0,0,0,.4)}.formSectionWrap .formSection{margin-top:4px}.permissionGrid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.permissionGrid label{background:#fff;border:1px solid #c4c6cb;padding:8px}.notesLabel{margin-top:12px}.manageActions{margin-top:14px;padding:11px;border:1px solid #c2c4c9;background:#fff}.manageTitle{display:flex;justify-content:space-between;gap:10px;align-items:center;margin-bottom:8px}.buttonRow{display:flex;gap:5px;flex-wrap:wrap}.identityGrid{display:grid;grid-template-columns:1fr 1fr auto;gap:8px;align-items:end}
.logs{padding:6px}.log{display:grid;grid-template-columns:150px 55px 1fr auto;align-items:center;gap:8px;padding:8px;border-bottom:1px solid #d0d1d5;font-size:10px}.log:last-child{border-bottom:0}.log time{color:#777e88}.logLevel{font-size:8px;color:#666d78}.logLevel.error{color:#a8444f}.logLevel.warn{color:#8c6a20}.log code{color:#7a8089;font-size:8px}
#toast{position:fixed;right:16px;bottom:16px;z-index:999;background:#414958;border:1px solid #707786;color:white;padding:10px 13px;max-width:470px;opacity:0;transform:translateY(8px);pointer-events:none;transition:.2s;box-shadow:var(--shadow);font-size:12px}#toast.show{opacity:1;transform:none}

@media(max-width:1080px){.statsGrid{grid-template-columns:repeat(3,1fr)}.formGrid.four{grid-template-columns:1fr 1fr}.appFrame{grid-template-columns:205px minmax(0,1fr)}}
@media(max-width:760px){.appFrame{display:block}.sidePanel{position:relative;height:auto;min-height:auto}.sideBrand{height:56px}.sideAccount{display:none}.mainNav{display:grid;grid-template-columns:1fr 1fr}.navBtn{border-right:1px solid var(--sidebarLine)}.sideFooter{display:none}.workspace{padding:8px 8px 35px}.topbar,.pageTitle{align-items:flex-start;flex-direction:column}.topActions{width:100%;justify-content:flex-end}.statsGrid{grid-template-columns:1fr 1fr}.grid{grid-template-columns:1fr}.formGrid,.formGrid.four,.permissionGrid,.fastBox,.identityGrid{grid-template-columns:1fr}.full{grid-column:auto}.pageActions{width:100%;flex-direction:column}.pageActions select,.pageActions button{width:100%}.infoCard{align-items:flex-start}.log{grid-template-columns:1fr}.brandPreview{align-items:center}}
@media(max-width:430px){.statsGrid{grid-template-columns:1fr}.mainNav{grid-template-columns:1fr}.loginBrand h1{font-size:24px}.workspace{padding:5px}.topbar{margin-bottom:9px}.topbar h1{font-size:16px}}
