:root{--ink:#14243b;--muted:#66778e;--nav:#101e34;--nav2:#1a2e4a;--blue:#347cf6;--blue2:#2359ca;--teal:#10ab9e;--line:#e7edf4;--bg:#f4f7fb;--paper:#fff;--ok:#109e77;--warn:#a46912;--fail:#c83f51;--shadow:0 3px 18px rgba(20,36,59,.035);font-family:Inter,"Segoe UI",Tahoma,system-ui,sans-serif}*{box-sizing:border-box}html,body{margin:0;min-height:100%;color:var(--ink);background:var(--bg);font-size:14px}button,input,select,textarea{font:inherit}button{cursor:pointer;border:1px solid #d8e2ed;background:white;border-radius:9px;padding:9px 13px;color:#244061;font-weight:650;transition:background .15s,border-color .15s}button:hover:not(:disabled){background:#edf4ff;border-color:#b5c9e9}button:disabled{opacity:.42;cursor:not-allowed}.hidden{display:none!important}.shell{display:grid;grid-template-columns:251px minmax(0,1fr);min-height:100vh}aside{background:linear-gradient(178deg,#112039 0%,#142744 75%,#0c1b31 100%);color:#d4e2f8;display:flex;flex-direction:column;position:sticky;top:0;height:100vh;overflow:auto;scrollbar-width:none}aside::-webkit-scrollbar{width:0}.brand{height:88px;display:flex;align-items:center;gap:12px;padding:18px 21px;border-bottom:1px solid #ffffff10}.brand-icon,.logo{display:grid;place-items:center;border-radius:13px;background:linear-gradient(135deg,#417df5,#23b4e2);font-size:27px;font-weight:800;color:#fff;box-shadow:0 9px 25px #0c265d55;width:43px;height:43px;flex-shrink:0}.brand b{font-size:15px;letter-spacing:1.05px;color:white}.brand span{display:block;letter-spacing:2px;font-size:10.5px;color:#91a5c4;margin-top:5px}.sidebar-label{font-size:11px;letter-spacing:2px;padding:22px 24px 9px;color:#6f89a9;font-weight:800}#nav{padding:1px 11px 20px;display:grid;gap:2px}.navbutton{background:transparent;color:#aebfd6;border:0;border-radius:8px;width:100%;padding:10px 13px;font-weight:570;text-align:left;display:flex;align-items:center;gap:12px;min-height:37px}.navbutton:hover:not(:disabled){background:#ffffff12;color:white;border:0}.navbutton.active{color:white;background:#3067d2;box-shadow:inset 3px 0 #73bafc}.navicon{display:grid;place-items:center;font-size:17px;width:19px;color:#8eacd0}.active .navicon{color:#fff}.sidebar-foot{margin-top:auto;padding:19px 20px 24px;border-top:1px solid #ffffff12}.sidebar-foot small{color:#718eac;font-size:12px;display:block;margin-top:10px}.sidebar-system{display:flex;align-items:center;gap:7px;font-size:13px}.pulse,.live-dot{width:7px;height:7px;border-radius:100%;background:#25c8ae;box-shadow:0 0 0 4px #25c8ae19;flex-shrink:0}.mode{margin-left:auto;letter-spacing:.4px;border-radius:5px;padding:5px 6px;font-size:11px;background:#20406c;color:#aaceff;font-weight:800}.mode.live{color:#f5b7c4;background:#813947}.content{min-width:0}.topbar{position:sticky;top:0;background:#ffffffee;backdrop-filter:blur(14px);z-index:6;border-bottom:1px solid var(--line);height:74px;display:flex;justify-content:space-between;align-items:center;padding:0 31px;gap:12px}.heading,.header-right{display:flex;align-items:center;gap:14px;white-space:nowrap}.heading{font-size:14px}.heading strong{font-weight:750}.breadcrumb-parent{color:#94a1b0}.slash{padding:0 11px;color:#c5ced8}.header-right{gap:13px}.status-pill{border:1px solid #bbe9d9;background:#eaf9f2;color:#118b69;padding:7px 10px;border-radius:7px;font-size:13px;font-weight:700}.sync-time{color:#8d99a8;font-size:12px}.quiet{background:transparent;border:1px solid var(--line);padding:8px 11px}.identity{display:flex;align-items:center;gap:8px;color:#3d5067;font-weight:650}.avatar{display:grid;place-items:center;width:30px;height:30px;border-radius:50%;background:#d7e6ff;color:#3262b2;font-size:14px;font-weight:800}main{max-width:1720px;margin:auto;padding:27px 30px 55px}.page-heading{display:flex;align-items:center;justify-content:space-between;gap:18px;margin-bottom:22px}.eyebrow{font-size:12px;letter-spacing:2.1px;font-weight:850;color:#4f8be9;margin:0 0 9px}.page-heading h1{font-size:26px;line-height:1.3;margin:0 0 5px;font-weight:780;letter-spacing:-.6px}.description{color:#76869a;margin:0;font-size:14px}.page-controls{display:flex;align-items:center;gap:8px;color:#3c647e;font-size:13px;white-space:nowrap;background:white;border:1px solid var(--line);border-radius:22px;padding:9px 13px}.cards{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:15px;margin-bottom:18px}.metric{border:1px solid var(--line);background:white;border-radius:13px;padding:18px 20px;position:relative;overflow:hidden;min-height:118px;box-shadow:var(--shadow)}.metric:before{content:'';position:absolute;right:-12px;top:-18px;width:75px;height:75px;border-radius:50%;background:#e9f1ff75}.metric-title{font-size:13px;color:#748296;font-weight:680;position:relative}.metric-value{font-size:29px;line-height:1.4;letter-spacing:-1.1px;font-weight:800;margin-top:8px;position:relative}.metric-sub{font-size:12px;color:#9aa7b7;margin-top:1px;position:relative}.panel{border:1px solid var(--line);border-radius:13px;background:var(--paper);box-shadow:var(--shadow);margin-bottom:17px;overflow:hidden}.panel-top{padding:17px 20px;border-bottom:1px solid #eef2f7;display:flex;align-items:center;justify-content:space-between;gap:12px}.panel h2,.panel-top h2{font-size:14px;font-weight:800;letter-spacing:.1px;margin:0}.panel-inner{padding:18px 20px}.table-wrap{width:100%;overflow-x:auto;scrollbar-width:thin}table{width:100%;border-collapse:collapse;font-size:13.5px;white-space:nowrap}thead{background:#fafcfe}th{text-align:left;padding:12px 16px;color:#8997a7;font-size:12px;letter-spacing:.4px;font-weight:780;text-transform:uppercase;border-bottom:1px solid var(--line)}td{padding:13px 16px;border-bottom:1px solid #f0f3f7;color:#42546b}tbody tr:last-child td{border-bottom:0}tbody tr:hover{background:#f9fbfe}td .actions{display:flex;align-items:center;gap:4px}td button{padding:5px 8px;border-radius:6px;font-size:12px}.tag{border-radius:6px;font-size:12px;display:inline-block;padding:5px 8px;background:#fff4dd;color:#a16c22;border:1px solid #f2d9a1;font-weight:700}.tag.ok{color:#10916e;background:#e7f8f0;border-color:#c4ebdb}.tag.fail{color:#bd4551;background:#ffedef;border-color:#f3d1d5}.notice{padding:12px 16px;margin-bottom:17px;background:#eef6ff;border:1px solid #d5e7fa;border-radius:9px;color:#36608b;font-size:13.5px;line-height:1.6}.empty{color:#93a3b4;text-align:center;padding:30px 18px}.error-box{background:#fff1f2;padding:18px;border-radius:10px;color:#ba4053;border:1px solid #f1c2c8;margin:14px 0}.form-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:15px 18px}label{display:grid;gap:6px;font-size:13px;color:#66788d;font-weight:700}input,select,textarea{width:100%;background:white;border:1px solid #dce5ee;padding:10px 11px;border-radius:8px;color:#1e3651;outline:none;font-weight:500}input:focus,select:focus,textarea:focus{border-color:#6d9cf5;box-shadow:0 0 0 3px #347cf61a}textarea{resize:vertical}input[readonly]{background:#f6f8fb}.form-footer{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-top:18px;flex-wrap:wrap}.form-footer small,.muted{color:#8390a0}.primary{border:1px solid #347cf6;color:white;background:linear-gradient(135deg,#377ff8,#255dcc);font-weight:770;padding:11px 16px;box-shadow:0 6px 17px #225fd222}.primary:hover:not(:disabled){background:#225bca;border-color:#225bca}.info-line{display:flex;justify-content:space-between;gap:18px;border-bottom:1px solid #edf1f6;padding:10px 2px;font-size:13.5px}.info-line:last-child{border:0}.info-line b{text-align:right;max-width:65%;overflow-wrap:anywhere}.telemetry-grid{display:grid;grid-template-columns:minmax(0,1.7fr) minmax(260px,1fr);gap:17px}.chart-shell{padding:17px 21px 22px;min-height:255px}.chart-head{display:flex;align-items:center;gap:14px;flex-wrap:wrap;margin-bottom:12px}.legend{font-size:12px;color:#7a8797;display:flex;align-items:center;gap:5px}.legend i{display:inline-block;width:8px;height:8px;border-radius:50%}.legend i.cpu{background:#347cf6}.legend i.mem{background:#1cb9a4}.legend i.disk{background:#dfa14a}#usage-chart{width:100%;height:204px;display:block}.live-resource{padding:17px 21px 10px}.resource-row{display:grid;gap:10px;margin-bottom:21px}.resource-row>.top{display:flex;align-items:center;justify-content:space-between;font-size:13px}.resource-row .top strong{font-size:14px}.progress{height:8px;background:#edf2f8;border-radius:20px;overflow:hidden}.progress i{height:100%;display:block;width:0;background:#397cf7;transition:width .65s ease;border-radius:20px}.progress.mem i{background:#14b8a6}.progress.disk i{background:#e5a64f}.chart-caption{font-size:12px;color:#a3adba}.rules-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}.rule-item{border:1px solid #e7edf4;background:#fafcfe;border-radius:10px;padding:14px;display:flex;gap:10px;align-items:center}.rule-item input{width:17px;height:17px;accent-color:#3279f4;cursor:pointer}.rule-item span{font-weight:700;color:#3d5470}.permission-table{overflow:auto}.permission-table input{width:17px;height:17px;accent-color:#347cf6}.permission-table input:disabled{opacity:.45}.section-hint{color:#8998aa;font-size:12px;margin:0 20px 15px}.policy-warning{border-left:3px solid #eeac44;background:#fff8e9;color:#8d641a;padding:12px 15px;font-size:13px;margin-bottom:16px}.inline-actions{display:flex;gap:8px;flex-wrap:wrap;align-items:center}.danger-button{color:#b34b58;background:#fff4f4;border-color:#f1cfd4}.login-wrap{display:grid;grid-template-columns:minmax(320px,1.05fr) minmax(340px,.95fr);min-height:100vh;background:white}.login-illustration{padding:8vw;display:flex;flex-direction:column;justify-content:center;background:radial-gradient(ellipse at 80% 15%,#25538b 0%,transparent 54%),linear-gradient(155deg,#08192f,#19365c);color:#fff;position:relative;overflow:hidden}.login-illustration:after{content:'';width:440px;height:440px;border:1px solid #ffffff28;border-radius:50%;position:absolute;bottom:-220px;right:-180px;box-shadow:0 0 0 55px #ffffff06,0 0 0 110px #ffffff05}.login-visual-badge{font-size:14px;letter-spacing:3px;font-weight:800;color:#80b9f7}.login-illustration h2{font-size:clamp(38px,4vw,62px);line-height:1.14;letter-spacing:-2px;margin:44px 0 14px}.login-illustration p{max-width:370px;line-height:1.9;color:#adbed6;font-size:15px}.login-dots{display:flex;gap:8px;margin-top:40px}.login-dots span{width:7px;height:7px;border-radius:50%;background:#6c95ca}.login-dots span:first-child{width:23px;border-radius:7px;background:#42d6ca}.login-card{width:min(430px,85%);margin:auto;display:grid;gap:17px}.login-card .logo{width:52px;height:52px}.login-card h1{font-size:28px;margin:-10px 0}.login-hint{color:#8292a3;margin:-8px 0 19px}.login-submit{margin-top:7px;display:flex;justify-content:space-between;align-items:center}.login-card small{color:#8b9aa9;line-height:1.8}.error{color:#ba3c4b;font-size:13px;line-height:1.6}.toast{position:fixed;bottom:22px;right:22px;background:#112c4d;color:white;border-radius:10px;box-shadow:0 15px 40px #0003;padding:15px 19px;max-width:min(500px,94vw);z-index:50;line-height:1.6}.modal-shade{position:fixed;inset:0;background:#091627b8;backdrop-filter:blur(5px);z-index:40;display:grid;place-items:center;padding:18px}.modal-panel{width:min(470px,100%);max-height:90vh;overflow:auto;box-shadow:0 15px 70px #0004;background:white;padding:30px;border-radius:18px;display:grid;gap:16px}.modal-panel h2{margin:0}.modal-panel p{line-height:1.75;color:#60738a;margin:0}.modal-panel .modal-icon{font-size:28px}.detail-panel{width:min(760px,100%)}.detail-panel pre{font-size:13px;line-height:1.65;overflow:auto;padding:16px;border:1px solid #e8eef5;background:#f5f8fc;border-radius:10px;max-height:65vh}.mobile-toggle{display:none}@media(max-width:1250px){.cards{grid-template-columns:repeat(2,minmax(0,1fr))}.telemetry-grid{grid-template-columns:1fr}.header-right{gap:8px}}@media(max-width:900px){.shell{grid-template-columns:1fr}aside{position:fixed;z-index:12;left:-260px;width:251px;transition:left .2s}body.menu-open aside{left:0}.mobile-toggle{display:block}.topbar{padding:0 15px}.header-right{gap:6px}.breadcrumb-parent,.sync-time,.hide-mobile{display:none}main{padding:23px 16px}.form-grid,.rules-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.login-illustration{display:none}.login-wrap{grid-template-columns:1fr}}@media(max-width:620px){.cards,.form-grid,.rules-grid{grid-template-columns:1fr}.topbar{height:65px}.logout,.identity #identity{display:none}.metric-value{font-size:25px}.page-heading h1{font-size:22px}.page-controls{display:none}.panel-top{padding:14px}.login-card{width:85%}.form-footer{flex-direction:column;align-items:stretch}}

/* CSP-safe QR modal: visual values copied exactly from former inline styles. */
.qr-payment-panel{text-align:center}
.qr-payment-amount{font-size:26px;font-weight:800;margin:12px}
.qr-payment-image{display:block;max-width:260px;width:100%;margin:12px auto;border-radius:12px}
.qr-payment-note{color:#6b7890;font-size:14px}
/* CSP-safe live gauges backed by native HTML progress. */
.progress progress{display:block;width:100%;height:8px;appearance:none;-webkit-appearance:none;border:0;background:#edf2f8;border-radius:20px;overflow:hidden}
.progress progress::-webkit-progress-bar{background:#edf2f8;border-radius:20px}
.progress progress::-webkit-progress-value{background:#397cf7;border-radius:20px}
.progress.mem progress::-webkit-progress-value{background:#14b8a6}
.progress.disk progress::-webkit-progress-value{background:#e5a64f}
.progress progress::-moz-progress-bar{background:#397cf7;border-radius:20px}
.progress.mem progress::-moz-progress-bar{background:#14b8a6}
.progress.disk progress::-moz-progress-bar{background:#e5a64f}

/* V7.2.6: keep the existing Billing Reliability toolbar inside narrow screens
   after the one-step type increase; does not change the main Admin topbar. */
@media(max-width:620px){
 body:has(#bank-evidence) .topbar{height:auto;min-height:65px;flex-wrap:wrap;align-content:center;gap:6px;padding:10px 15px}
 body:has(#bank-evidence) .topbar .header-right{max-width:100%;white-space:normal;flex-wrap:wrap;justify-content:flex-start;gap:6px}
}
