:root{--blue:#0b63f6;--blue2:#0052df;--ink:#101828;--muted:#66738f;--line:#e4eaf3;--soft:#f6f9ff;--bg:#fbfcff;--ok:#07983f;--red:#f04438}*{box-sizing:border-box}html,body{margin:0;min-height:100%;font-family:Inter,ui-sans-serif,system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;color:#17233c;background:var(--bg)}a{color:var(--blue);text-decoration:none}button,input{font:inherit}.hp-app{display:grid;grid-template-columns:290px 1fr;min-height:100vh}.hp-side{background:white;border-right:1px solid var(--line);padding:28px 16px;position:sticky;top:0;height:100vh}.hp-logo{display:flex;align-items:center;gap:12px;font-size:31px;font-weight:800;color:var(--ink);margin:0 10px 34px}.hp-logo b{color:var(--blue)}.hp-logo.login{margin:0 0 20px;justify-content:center}.hp-logo-icon{color:var(--blue);font-size:34px;line-height:1}.hp-side nav{display:grid;gap:8px}.hp-side nav a{display:flex;align-items:center;gap:18px;color:#263654;padding:16px 18px;border-radius:13px;font-weight:600;font-size:16px}.hp-side nav a span{font-size:25px;width:28px;text-align:center;color:#243655}.hp-side nav a.active,.hp-side nav a:hover{background:#eef5ff;color:var(--blue)}.hp-side nav a.active span,.hp-side nav a:hover span{color:var(--blue)}.hp-page{min-width:0;display:flex;flex-direction:column}.hp-head{height:98px;background:white;border-bottom:1px solid var(--line);display:flex;align-items:center;gap:24px;padding:0 24px 0 44px}.hp-menu{border:0;background:white;font-size:30px;color:#31415f}.hp-search{width:min(680px,45vw);height:58px;border:1px solid #d7dfeb;border-radius:14px;display:flex;align-items:center;gap:12px;padding:0 18px;color:#7d8aa5;font-size:26px}.hp-search input{border:0;outline:0;width:100%;font-size:16px;color:#30405e}.hp-actions{margin-left:auto;display:flex;align-items:center;gap:18px}.hp-bell{position:relative;font-size:27px;color:#263654}.hp-bell b{position:absolute;right:-8px;top:-10px;background:var(--blue);color:#fff;border-radius:999px;font-size:12px;min-width:22px;height:22px;display:grid;place-items:center}.hp-avatar{width:50px;height:50px;border-radius:50%;display:grid;place-items:center;background:#eef2f7;font-size:28px}.hp-hello{font-weight:800;color:#111827;display:grid;line-height:1.2}.hp-hello small{font-weight:500;color:#66738f;margin-top:4px}.hp-cta{height:52px;border-radius:10px;background:var(--blue);color:white;display:flex;align-items:center;gap:10px;padding:0 20px;font-weight:800;box-shadow:0 10px 20px rgba(11,99,246,.2)}.hp-cta span{font-size:30px;font-weight:300}.hp-content{padding:28px 30px 18px;flex:1}.hp-foot{text-align:center;color:#66738f;padding:0 0 18px}.metric-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:24px;margin-bottom:24px}.metric,.panel{background:white;border:1px solid var(--line);border-radius:14px;box-shadow:0 8px 28px rgba(16,24,40,.05)}.metric{min-height:150px;padding:30px;display:flex;gap:26px;align-items:center}.metric>span{width:74px;height:74px;border-radius:22px;background:#eef5ff;color:var(--blue);display:grid;place-items:center;font-size:45px}.metric p{margin:0 0 8px;font-size:16px;color:#111827;font-weight:800}.metric strong{display:block;font-size:34px;color:#05070d;letter-spacing:0}.metric small{display:block;margin-top:8px;color:#65728d;font-size:14px}.dash-grid{display:grid;grid-template-columns:minmax(0,1.45fr) minmax(360px,.95fr);gap:24px}.panel{padding:26px}.panel.wide{min-width:0}.panel header{display:flex;align-items:center;justify-content:space-between;margin-bottom:18px}.panel h2{font-size:21px;margin:0 0 18px;color:#111827}.panel header h2{margin:0}.table-wrap{border:1px solid var(--line);border-radius:10px;overflow:auto}table{border-collapse:collapse;width:100%;min-width:700px}th,td{padding:15px 14px;text-align:left;border-bottom:1px solid var(--line);font-size:14px}th{color:#34425f;background:#fbfcff;font-weight:700}tr:last-child td{border-bottom:0}.badge{background:#e8f8ee;color:var(--ok);padding:7px 14px;border-radius:999px;font-weight:800;font-size:13px}.oktxt{color:var(--ok);font-weight:700}.red{color:var(--red)!important}.status-list{list-style:none;padding:0;margin:0;display:grid;gap:20px}.status-list li{display:grid;grid-template-columns:54px 1fr auto;gap:16px;align-items:center}.status-list li>span{width:50px;height:50px;border-radius:13px;background:#eef5ff;color:var(--blue);display:grid;place-items:center;font-size:26px;font-weight:800}.status-list b{display:block;font-size:16px}.status-list small{color:#66738f}.status-list em{font-style:normal;color:var(--blue);font-weight:900}.usage{display:grid;grid-template-columns:190px 1fr 130px 50px;gap:18px;align-items:center;margin:16px 0;color:#31415f}.usage div{height:7px;background:#e8edf5;border-radius:999px;overflow:hidden}.usage i{display:block;height:100%;background:linear-gradient(90deg,var(--blue),#5ba4ff);border-radius:999px}.usage b,.usage em{font-style:normal;font-weight:600;text-align:right}.quick{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.quick a{min-height:82px;border:1px solid var(--line);border-radius:10px;display:grid;place-items:center;color:var(--blue);font-size:35px}.quick small{display:block;color:#34425f;font-size:13px;font-weight:600}.notice,.empty,.flash{padding:14px 16px;border-radius:12px;margin-bottom:16px}.notice.ok{background:#ecfdf3;color:#087443;border:1px solid #abefc6}.empty{background:white;border:1px solid var(--line)}.flash{background:#fef3f2;color:#b42318;border:1px solid #fecdca}.hp-title{margin:0 0 20px}.form{display:grid;gap:14px;max-width:720px}.form label{display:grid;gap:7px;font-weight:700}.form input,.form textarea,input,textarea,select{width:100%;border:1px solid #d7dfeb;border-radius:10px;padding:13px 14px;background:white}.btn,button,.form button{border:0;border-radius:10px;background:var(--blue);color:white;padding:13px 18px;font-weight:800;cursor:pointer}.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.card{background:white;border:1px solid var(--line);border-radius:14px;padding:20px;box-shadow:0 8px 28px rgba(16,24,40,.05);color:#17233c}.bar{height:8px;background:#e8edf5;border-radius:999px;overflow:hidden}.bar div{height:100%;background:var(--blue)}.hp-login{min-height:100vh;display:grid;place-items:center;background:linear-gradient(135deg,#eef5ff,#fff)}.hp-login-card{width:min(420px,92vw);background:white;border:1px solid var(--line);border-radius:18px;padding:34px;box-shadow:0 18px 50px rgba(16,24,40,.12);display:grid;gap:14px}.hp-login-card h1{text-align:center;margin:0 0 8px}.hp-login-card label{display:grid;gap:7px;font-weight:700}.hp-login-card input{border:1px solid #d7dfeb;border-radius:10px;padding:13px}.hp-login-card button{height:48px}@media(max-width:1200px){.metric-grid{grid-template-columns:repeat(2,1fr)}.dash-grid{grid-template-columns:1fr}.hp-search{width:42vw}.quick{grid-template-columns:repeat(2,1fr)}}@media(max-width:820px){.hp-app{grid-template-columns:1fr}.hp-side{position:fixed;z-index:50;transform:translateX(-105%);transition:.2s;width:290px}.nav-open .hp-side{transform:none}.hp-dim{display:none}.nav-open .hp-dim{display:block;position:fixed;inset:0;background:rgba(15,23,42,.45);z-index:40}.hp-head{padding:0 14px;height:auto;min-height:82px;flex-wrap:wrap}.hp-search{order:3;width:100%;margin-bottom:12px}.hp-hello,.hp-cta{display:none}.metric-grid,.cards{grid-template-columns:1fr}.metric{padding:22px}.usage{grid-template-columns:1fr}.usage b,.usage em{text-align:left}.hp-content{padding:18px 14px}.quick{grid-template-columns:1fr 1fr}.hp-side{height:100vh}} 
/* v2.18.0 — admin pages */
.page-head{display:flex;align-items:center;justify-content:space-between;gap:16px;margin:0 0 18px;flex-wrap:wrap}
.page-head h1{margin:0;font-size:22px}
.page-head .inline{display:flex;gap:8px;flex-wrap:wrap}
.page-head .inline input{padding:8px 10px;border:1px solid #243049;background:#0f1626;color:#e7ecf5;border-radius:8px;font-size:13px}
.page-head .inline button{padding:8px 14px}
.muted{color:#8895ad;font-size:12px}
.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px;max-width:720px}
.form-grid label{display:flex;flex-direction:column;gap:6px;font-size:13px;color:#aab4c8}
.form-grid input{padding:8px 10px;border:1px solid #243049;background:#0f1626;color:#e7ecf5;border-radius:8px}
.form-grid button{grid-column:1/-1;justify-self:start}
button.link{background:transparent;border:0;color:#7ea7ff;cursor:pointer;font-size:12px}
@media (max-width:640px){.form-grid{grid-template-columns:1fr}}
.card-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:12px;margin:12px 0}
.card-grid .card{background:#fff;border:1px solid #e5e7eb;border-radius:10px;padding:14px}
.form-inline{display:flex;gap:8px;align-items:center;margin:12px 0;flex-wrap:wrap}
.form-grid{display:grid;grid-template-columns:repeat(6,auto);gap:8px;margin:12px 0;align-items:center}
.tbl{width:100%;border-collapse:collapse;background:#fff;border-radius:10px;overflow:hidden}
.tbl th,.tbl td{padding:10px 12px;border-bottom:1px solid #eef0f3;text-align:left;font-size:14px}
.btn{background:#0ea5e9;color:#fff;border:0;padding:8px 14px;border-radius:8px;cursor:pointer}
.btn-sm{background:#ef4444;color:#fff;border:0;padding:5px 10px;border-radius:6px;cursor:pointer}
.alert{background:#ecfeff;border:1px solid #06b6d4;padding:12px;border-radius:10px;margin:12px 0}
.ext-list{background:#0f172a;color:#a7f3d0;padding:10px;border-radius:8px;font-size:12px;line-height:1.5;word-break:break-word}
.page-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:14px}