:root{color-scheme:light;--nav:#10182a;--nav2:#172337;--accent:#4b65e9;--accent2:#4159d0;--surface:#fff;--page:#f5f7fb;--ink:#16213b;--muted:#72809a;--border:#e6eaf2;--green:#099b6b;--red:#d84a64;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}
*{box-sizing:border-box}body{margin:0;background:var(--page);color:var(--ink);font-size:14px;-webkit-font-smoothing:antialiased}a{text-decoration:none;color:inherit}button,input,select,textarea{font:inherit}button{cursor:pointer;border:0}button:disabled{opacity:.55;cursor:default}input,select,textarea{border:1px solid #dde4ee;color:#202b42;border-radius:10px;background:white;padding:11px 12px;width:100%;min-width:0;outline:none}input:focus,select:focus,textarea:focus{border-color:#8392ef;box-shadow:0 0 0 3px #4b65e91c}input[type=number]{font-variant-numeric:tabular-nums}label{display:block;color:#394560;font-size:12px;font-weight:650;margin:0 0 6px}.field{margin-bottom:15px}.field:last-child{margin-bottom:0}.form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 14px}.full{grid-column:1/-1}.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:11px 16px;border:1px solid transparent;border-radius:10px;background:var(--accent);color:white;font-weight:720;white-space:nowrap;transition:transform .16s,background .16s}.btn:hover{background:var(--accent2)}.btn:active{transform:scale(.98)}.btn.light{background:#eff2ff;color:#485fd3}.btn.light:hover{background:#e4e9ff}.btn.ghost{background:white;color:#36415a;border-color:#e2e8f2}.btn.danger{background:#fff0f2;color:#bb3d52}.btn.sm{padding:7px 10px;font-size:12px;border-radius:8px}.btn.wide{width:100%}.muted{color:var(--muted)}.small{font-size:12px}.mono{font-family:ui-monospace,SFMono-Regular,Consolas,monospace}.layout{display:flex;min-height:100vh}.sidebar{position:fixed;inset:0 auto 0 0;width:246px;background:var(--nav);color:#9facbf;display:flex;flex-direction:column;z-index:30;transition:transform .25s;overflow-y:auto}.brand{display:flex;align-items:center;gap:11px;padding:26px 19px 22px;color:#fff;font-weight:800;font-size:16px;letter-spacing:.2px}.brand-mark{display:grid;place-items:center;width:37px;height:37px;background:#526cf5;border-radius:11px;color:white;font-size:20px;box-shadow:0 10px 25px #4b65e933}.brand small{display:block;font-size:10px;font-weight:600;color:#9ba9c4;letter-spacing:1.1px;margin-top:2px}.nav-title{padding:20px 22px 8px;font-size:10px;letter-spacing:1.6px;font-weight:800;color:#65758f;text-transform:uppercase}.nav-link{display:flex;align-items:center;gap:12px;padding:12px 15px;margin:2px 10px;border-radius:9px;font-size:13px;font-weight:600;transition:background .2s}.nav-link:hover{background:#1a2b46;color:#eff5ff}.nav-link.active{background:#28375b;color:white;box-shadow:inset 3px 0 #8090ff}.nav-ico{width:20px;text-align:center;font-size:16px}.sidebar-bottom{margin-top:auto;padding:14px 18px;border-top:1px solid #28334a;display:flex;gap:10px;align-items:center}.avatar{width:38px;height:38px;border-radius:12px;background:#304568;color:#fff;display:grid;place-items:center;font-weight:800}.sidebar-bottom b{display:block;color:white;font-size:13px}.sidebar-bottom small{display:block;color:#95a3bd;font-size:11px;margin-top:3px}.main-area{margin-left:246px;min-width:0;width:calc(100% - 246px)}.topbar{display:flex;align-items:center;justify-content:space-between;height:72px;padding:0 28px;background:#fff;border-bottom:1px solid var(--border);position:sticky;top:0;z-index:12}.topbar-left{display:flex;align-items:center;gap:14px}.hamburger{display:none;border:1px solid var(--border);background:#fff;border-radius:10px;width:42px;height:42px;font-size:22px;color:#34405b}.crumb{font-size:12px;color:var(--muted)}.topbar-right{display:flex;align-items:center;gap:12px;color:#6c7891}.role-pill{display:inline-flex;padding:6px 10px;border-radius:8px;background:#eef1ff;color:#4f60c5;font-weight:800;font-size:10px;letter-spacing:.6px}.content{max-width:1400px;margin:0 auto;padding:30px 32px 80px}.pagehead{display:flex;justify-content:space-between;align-items:flex-start;gap:14px;margin-bottom:23px}.pagehead h1{font-size:26px;letter-spacing:-.9px;margin:0 0 7px;font-weight:800}.pagehead p{margin:0;color:var(--muted);font-size:13px;line-height:1.7}.cards{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:15px;margin:0 0 23px}.stat{background:white;border:1px solid var(--border);border-radius:15px;padding:20px;min-width:0;box-shadow:0 5px 25px #12233a05}.stat-top{display:flex;align-items:center;justify-content:space-between;color:#77839b;font-size:12px;font-weight:650}.stat-symbol{display:grid;place-items:center;width:34px;height:34px;border-radius:10px;background:#eef0ff;font-size:16px}.stat-symbol.green{background:#e5f8f1}.stat-symbol.orange{background:#fff3dd}.stat-symbol.red{background:#fff0f0}.stat-number{font-size:29px;font-weight:830;letter-spacing:-1px;margin:15px 0 3px;overflow-wrap:anywhere}.stat-foot{font-size:11px;color:#8a96aa}.twocol{display:grid;grid-template-columns:1.28fr 1fr;gap:17px}.card{background:white;border:1px solid var(--border);border-radius:15px;box-shadow:0 5px 25px #12233a05;padding:22px;margin-bottom:18px;min-width:0}.card-head{display:flex;justify-content:space-between;align-items:flex-start;gap:16px;margin-bottom:19px}.card-head h2{font-size:16px;margin:0 0 5px;letter-spacing:-.3px}.card-head p{margin:0;font-size:12px;color:var(--muted);line-height:1.6}.card h3{margin:3px 0 12px;font-size:14px}.table-wrap{overflow-x:auto}.table{width:100%;border-collapse:collapse;font-size:12px;white-space:nowrap}.table thead{background:#f8f9fd;color:#77849a;text-transform:uppercase;letter-spacing:.7px;font-size:10px}.table th,.table td{text-align:left;padding:13px 12px;border-bottom:1px solid #edf0f6;vertical-align:middle}.table tr:last-child td{border-bottom:0}.table tbody tr:hover{background:#fcfdff}.badge{display:inline-flex;align-items:center;gap:5px;border-radius:999px;padding:5px 9px;font-size:11px;font-weight:800;background:#eff2f9;color:#62718a}.badge:before{content:'';width:6px;height:6px;background:currentColor;border-radius:50%}.badge.ok{background:#e5f8f1;color:#0f9266}.badge.warn{background:#fff5de;color:#b57b16}.badge.bad{background:#fff0f1;color:#c75062}.td-actions{display:flex;gap:6px;align-items:center}.td-actions form{margin:0}.td-actions input{display:none}.alert{border:1px solid #c8d2fa;background:#eef1ff;color:#344897;padding:13px 15px;border-radius:12px;margin-bottom:20px}.alert.good{border-color:#b6ebd5;background:#eafaf2;color:#187857}.alert.error{border-color:#f0c8cf;background:#fff0f2;color:#a52c45}.codebox{padding:16px;border:1px solid #dfe6f3;border-radius:11px;background:#f7f9fc;color:#253351;overflow:auto;font:12px/1.8 ui-monospace,Consolas,monospace;white-space:pre-wrap;overflow-wrap:anywhere}.pill-row{display:flex;gap:8px;flex-wrap:wrap}.pill{display:inline-block;padding:7px 10px;border-radius:8px;background:#f1f4fa;color:#52617c;font-size:12px;font-weight:650}.bars .barrow{display:grid;grid-template-columns:110px minmax(0,1fr) 40px;gap:12px;align-items:center;margin:15px 0;color:#65748e;font-size:12px}.track{background:#edf0f7;height:9px;border-radius:99px;overflow:hidden}.fill{background:#6377e7;border-radius:99px;height:100%;min-width:2px}.empty{color:#8995a9;text-align:center;padding:30px 12px;font-size:13px}.flex{display:flex;align-items:center;justify-content:space-between;gap:10px}.api-guide{background:#f8f9ff;border:1px solid #e6e9fd;border-radius:12px;padding:17px}.fresh-keys{min-height:110px;width:100%;font:13px ui-monospace,monospace;resize:vertical}.backdrop{display:none}.login-wrap{min-height:100vh;display:grid;grid-template-columns:1fr 1fr}.login-left{background:linear-gradient(130deg,#10172b,#172c55);color:#fff;padding:10%;display:flex;flex-direction:column;justify-content:center}.login-left h1{font-size:clamp(30px,4vw,52px);line-height:1.13;letter-spacing:-2px;margin:30px 0 18px}.login-left p{color:#c0cbe0;line-height:1.9;max-width:480px}.login-right{display:grid;place-items:center;padding:30px}.login-panel{width:min(410px,100%)}.login-panel h2{font-size:27px;letter-spacing:-.7px;margin:0 0 8px}.login-panel .sub{color:#7b88a0;margin-bottom:34px}.login-panel .btn{margin-top:10px}.login-mini{display:flex;gap:9px;align-items:center;color:#8190aa;font-size:12px;margin-top:25px}.login-shape{width:95px;height:95px;display:grid;place-items:center;font-size:39px;background:#4d67ed;border-radius:25px;box-shadow:0 22px 50px #294ca355}@media(max-width:1250px){.cards{grid-template-columns:repeat(2,minmax(0,1fr))}.twocol{grid-template-columns:1fr}}@media(max-width:860px){.sidebar{transform:translateX(-100%);box-shadow:0 12px 40px #08122455}.sidebar.open{transform:translateX(0)}.backdrop.open{display:block;position:fixed;inset:0;background:#0b132b86;z-index:29}.main-area{margin-left:0;width:100%}.topbar{height:64px;padding:0 16px}.hamburger{display:block}.content{padding:22px 16px 70px}.pagehead h1{font-size:22px}.login-wrap{grid-template-columns:1fr}.login-left{display:none}}@media(max-width:540px){.cards{grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}.stat{padding:15px 12px}.stat-number{font-size:23px}.stat-top{font-size:11px}.stat-symbol{width:30px;height:30px}.form-grid{grid-template-columns:1fr}.card{padding:17px 14px}.pagehead{align-items:center}.pagehead .btn{padding:9px 11px;font-size:12px}.role-pill{display:none}.table th,.table td{padding:12px 9px}.login-right{padding:18px}}

/* Single role-aware dashboard: one shared layout and a toggleable hamburger on all screens. */
.hamburger{display:grid;place-items:center;flex:none}
@media(min-width:861px){
  body.menu-collapsed .sidebar{transform:translateX(-100%)}
  body.menu-collapsed .main-area{margin-left:0;width:100%}
}

/* V2.1.1 UI hotfix: mobile spacing and focus/accessibility */
:focus-visible{outline:3px solid #92a4ff;outline-offset:2px}
@media(max-width:540px){.topbar-right{gap:6px}.topbar-right .muted.small{display:none}.crumb{max-width:45vw;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.content{padding:18px 12px 60px}.sidebar{width:min(290px,88vw)}.pagehead h1{line-height:1.2}.btn{white-space:normal;text-align:center}}

/* KEY MANAGER V2.3: compact KEY table, action dropdown */
.table.key-table{white-space:normal;font-size:12px;min-width:820px}
.table.key-table th,.table.key-table td{padding:9px 8px;line-height:1.3}
.key-code{display:inline-block;max-width:290px;overflow-wrap:anywhere;word-break:break-word;font-size:12px;font-weight:750;color:#263454}
.key-meta{font-size:10px;color:#8490a6;margin-top:2px}
.key-copy{background:none;border:0;color:#4b65e9;cursor:pointer;font-weight:700;font-size:11px;padding:3px 4px}
.device-badge{display:inline-block;border-radius:7px;padding:5px 8px;background:#f0f3ff;color:#4a5dc9;font-weight:800;white-space:nowrap}
.key-action-menu{position:relative;display:inline-block}.key-action-menu>summary{list-style:none;display:flex;gap:7px;align-items:center;justify-content:center;min-width:48px;padding:6px 10px;background:#f0f3ff;border-radius:9px;color:#475fd4;cursor:pointer;font-size:18px;font-weight:800}.key-action-menu>summary::-webkit-details-marker{display:none}.action-arrow{font-size:12px}
.key-dropdown{position:fixed;top:0;left:0;width:212px;z-index:1000;background:#fff;border:1px solid #e2e8f2;border-radius:12px;padding:6px;box-shadow:0 16px 38px #1a315125}.key-dropdown form{margin:0}.key-dropdown form>button,.key-dropdown-link,.key-dropdown-extend button{display:block;background:#fff;border:0;width:100%;text-decoration:none;text-align:left;font-size:12px;font-weight:650;padding:9px 10px;border-radius:7px;color:#30405d;cursor:pointer}.key-dropdown-link:hover,.key-dropdown button:hover{background:#f4f6ff}.key-dropdown .delete-option{color:#c14756}.key-dropdown-extend{display:flex;align-items:center;gap:4px;border-top:1px solid #edf0f6;padding:7px 2px}.key-dropdown-extend input[type=number]{display:block!important;flex:1;width:75px!important;min-width:0;padding:8px 5px;font-size:12px}.key-dropdown-extend button{width:auto;flex:none;background:#eef1ff;color:#475ad1}.key-table tr:has(.key-action-menu[open]){position:relative;z-index:3}.table-wrap.key-scroll{overflow-x:auto;overflow-y:auto}.km-device-list td{word-break:break-all}@media(max-width:600px){.key-code{max-width:205px}.table.key-table th,.table.key-table td{padding:8px 7px}}

/* KEY MANAGER V2.4: compact single-icon action menu and API plan documentation. */
.key-action-menu>summary{display:inline-flex;justify-content:center;align-items:center;min-width:36px;width:36px;height:36px;padding:0;border:1px solid #e4e9ff;border-radius:10px;background:#eff2ff;color:#4259c8}
.key-action-menu>summary:hover,.key-action-menu[open]>summary{background:#e3e9ff}
.dots-icon{font-size:25px;line-height:1;transform:translateY(-1px)}
.menu-glyph{display:inline-flex;justify-content:center;width:19px;font-size:16px;font-weight:800;vertical-align:middle;margin-right:5px}
.plan-id-badge{display:inline-flex;min-width:34px;justify-content:center;align-items:center;padding:6px 9px;border:1px solid #dce3ff;background:#eef2ff;color:#4058cd;border-radius:8px;font-weight:800}
.api-example-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.api-example{min-width:0;border:1px solid #e5eaf3;border-radius:12px;padding:14px}
.api-example h3{margin:0 0 6px}
.api-example .codebox{margin:12px 0 0}
.plan-api-table th,.plan-api-table td{padding:11px 10px}
@media(max-width:900px){.api-example-grid{grid-template-columns:1fr}}