*{box-sizing:border-box}body{margin:0;background:#edf2f7;color:#172c42;font-family:Inter,"Segoe UI",Arial,sans-serif;font-size:13px}.sidebar{position:fixed;inset:0 auto 0 0;width:250px;background:#101d30;color:white}.main{margin-left:250px;padding:24px 28px;max-width:1920px}.overview-header{display:flex;justify-content:space-between;align-items:center;gap:18px;padding-bottom:17px;border-bottom:1px solid #d6e0ea}.eyebrow{font-size:10px;letter-spacing:1.7px;font-weight:700;color:#678199}h1{font-size:29px;letter-spacing:-1px;margin:5px 0 6px;display:flex;gap:13px;align-items:center}#companyName{color:#6b7e92;margin:0}.live-badge{font-size:9px;letter-spacing:.8px;color:#146b58;background:#d7eee6;border:1px solid #bce2d6;padding:5px 8px;border-radius:5px}.header-actions{display:flex;gap:8px;align-items:center;flex-wrap:wrap}.header-actions span{color:#687c90;font-size:12px}button,.quick-links a{font:inherit;border:1px solid #ccd8e3;border-radius:5px;background:white;color:#29425b;padding:8px 12px;cursor:pointer;text-decoration:none}button:hover,.quick-links a:hover{border-color:#23978e;color:#097b73}button:disabled{opacity:.5;cursor:wait}.status-row{display:flex;justify-content:space-between;gap:10px;color:#6c8093;font-size:11px;padding:12px 0}.quick-links{display:flex;gap:7px;flex-wrap:wrap;margin:0 0 16px}.quick-links a:first-child{background:#137e78;color:white;border-color:#137e78}.kpi-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:13px;margin-bottom:17px}.kpi{border-radius:7px;background:#22394c;color:white;padding:17px 18px;position:relative;overflow:hidden;min-height:109px;border:1px solid #354c5e}.kpi:after{content:"";width:68px;height:68px;border:15px solid #ffffff06;border-radius:50%;position:absolute;right:-13px;top:-16px}.kpi-label{font-size:10px;text-transform:uppercase;letter-spacing:1px;color:#b3c5d4}.kpi-value{font-size:28px;font-weight:650;margin:8px 0 4px;letter-spacing:-.6px;overflow-wrap:anywhere}.kpi small{font-size:10px;color:#a4bdcf}.kpi.teal{background:#146e6c;border-color:#287e79}.kpi.amber .kpi-value{color:#f1bd65}.dashboard-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:17px}.panel{background:white;border:1px solid #dce5ec;border-radius:7px;overflow:hidden;box-shadow:0 2px 4px #23364d03;min-width:0}.wide{grid-column:1/-1}.panel-heading{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:15px 18px;border-bottom:1px solid #e7edf3;background:#f9fbfd}.panel h2{font-size:14px;margin:0;font-weight:650}.panel a{color:#16877e;text-decoration:none;font-size:11px}.panel a:hover{text-decoration:underline}.tag{font-size:9px;color:#7c91a5;letter-spacing:.9px}.metric-rows{padding:5px 18px 9px}.metric-row{display:flex;justify-content:space-between;gap:16px;padding:9px 0;border-bottom:1px solid #edf1f5;font-size:12px}.metric-row:last-child{border-bottom:0}.metric-row span{color:#647e93}.metric-row strong{font-variant-numeric:tabular-nums;font-weight:600;text-align:right}.metric-row strong.warn{color:#b77919}.metric-row strong.good{color:#148975}.chart-summary{padding:16px 18px 0;display:flex;align-items:baseline;gap:10px}.chart-summary strong{font-size:25px;font-weight:650}.chart-summary span{color:#889bab;font-size:11px}.chart{padding:8px 14px 0;min-height:155px}.chart svg{width:100%;height:auto;display:block;overflow:visible}.chart text{fill:#8a9aab;font:10px "Segoe UI",sans-serif}.footnote{font-size:10px;color:#7b8d9f;line-height:1.65;margin:11px 18px 14px}.empty{padding:26px 18px;color:#8b9bab;text-align:center;font-size:12px}.package-bars{padding:16px 18px}.package-line{margin-bottom:17px}.package-line div{display:flex;justify-content:space-between;font-size:12px;margin-bottom:7px}.package-line span{color:#60768c}.bar-track{height:7px;background:#edf2f5;border-radius:5px;overflow:hidden}.bar-track i{display:block;height:100%;background:#21a69b;border-radius:5px}.health-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0}.health-item{padding:20px;text-align:center;border-right:1px solid #e7edf3}.health-item:last-child{border:0}.health-item h3{font-size:12px;font-weight:500;color:#657e93;margin:0 0 12px}.gauge{width:96px;height:96px;margin:auto;border-radius:50%;background:conic-gradient(#22a59a var(--pct),#edf2f5 0);display:grid;place-items:center}.gauge>div{border-radius:50%;background:white;width:77px;height:77px;display:grid;place-items:center;font-size:21px;font-weight:650}.load-value{font-size:32px;font-weight:600;padding-top:14px}.health-item small{color:#8397a8;font-size:10px;display:block;margin-top:12px}.health-footer{padding:12px 18px;border-top:1px solid #e7edf3;color:#72879a;font-size:11px;display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap}.table-scroll{overflow-x:auto}table{border-collapse:collapse;width:100%;font-size:12px;text-align:left}th{color:#8a9dae;font-size:10px;letter-spacing:.5px;font-weight:500;padding:12px 18px;background:#fcfdfe}td{padding:11px 18px;border-top:1px solid #edf1f5;white-space:nowrap}td small{display:block;color:#8a9eaf;font-size:10px;margin-top:4px}.pill{display:inline-block;font-size:10px;padding:4px 7px;background:#e5f4ed;color:#258265;border-radius:4px}.pill.warning{background:#fff3df;color:#a9721d}.dashboard-footer{display:flex;justify-content:space-between;padding:20px 0 0;font-size:10px;color:#8da0b0}#error{background:#fff0e7;color:#925221;border:1px solid #f4d0b7;padding:12px;border-radius:5px}[hidden]{display:none!important}
.mobile-menu{display:none}
@media(min-width:1550px){.main{padding:26px 34px}.dashboard-grid{grid-template-columns:repeat(3,minmax(0,1fr))}#onlinePanel{grid-column:span 2}#collectionPanel{grid-column:span 2}.wide{grid-column:1/-1}#expiryPanel{grid-column:span 2}}
@media(max-width:1100px){.main{padding:20px}.kpi-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.dashboard-grid{gap:12px}.panel-heading{padding:13px}.metric-rows{padding-left:13px;padding-right:13px}.header-actions span{display:none}.overview-header{align-items:flex-start}h1{font-size:26px}}
@media(max-width:800px){.dashboard-grid{grid-template-columns:1fr}.overview-header{flex-wrap:wrap}.health-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.health-item{padding:15px 8px}.gauge{width:78px;height:78px}.gauge>div{width:62px;height:62px;font-size:17px}.main{margin-left:250px;padding:16px}}
@media(max-width:640px){.main{margin-left:0!important;padding:66px 14px 18px}.kpi{padding:14px}.kpi-value{font-size:24px}.status-row{flex-wrap:wrap}.header-actions{margin-top:3px}.health-grid{grid-template-columns:1fr}.health-item{border-right:0;border-bottom:1px solid #e7edf3}.dashboard-footer{gap:15px}.panel-heading a{font-size:10px}}
@media(max-width:768px){body .sidebar{position:fixed!important;top:0!important;left:0!important;width:250px!important;height:100vh!important;z-index:1000!important;transform:translateX(-100%);transition:transform .15s ease}body.nav-open .sidebar{transform:translateX(0)}.mobile-menu{display:block;position:fixed;left:14px;top:12px;z-index:1001;background:#172d43;color:white;border:0;box-shadow:0 2px 8px #14273c30}body.nav-open .mobile-menu{left:258px}.main{margin-left:0!important;padding-top:62px}}

/* Viewer preference; leaves other users and pages unchanged. */
body.compact-view{zoom:.8}body.compact-view .main{padding-top:18px}body.compact-view .kpi{min-height:88px;padding:12px 14px}body.compact-view .kpi-value{font-size:25px}body.compact-view .metric-row{padding:7px 0}body.compact-view .panel-heading{padding:11px 14px}body.compact-view .overview-header{padding-bottom:10px}body.compact-view .chart{min-height:120px}
@media(min-width:600px) and (max-width:1100px){body.compact-view .kpi-grid{grid-template-columns:repeat(4,minmax(0,1fr))}body.compact-view .dashboard-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:768px){body.compact-view .main{padding-top:58px}}

/* Dashboard visual refresh. Existing panel visibility and data rendering remain authoritative. */
body{background:#f3f6fa;color:#183047;font-size:14px}
.main{padding:28px 30px 24px}
.overview-header{position:relative;isolation:isolate;overflow:hidden;padding:27px 28px;border:1px solid #23465b;border-radius:20px;background:linear-gradient(115deg,#112b43 0%,#183b50 65%,#126c70 100%);box-shadow:0 12px 28px #14324912;min-height:150px;color:#fff}
.overview-header:after{content:"";position:absolute;z-index:-1;width:280px;height:280px;border:1px solid #ffffff12;border-radius:50%;right:65px;top:-170px;box-shadow:0 0 0 40px #ffffff04,0 0 0 80px #ffffff03;pointer-events:none}
.eyebrow{font-size:10px;font-weight:600;letter-spacing:2px;color:#9ec7d4}h1{font-size:32px;letter-spacing:-1px;margin:9px 0 8px;flex-wrap:wrap;gap:12px;font-weight:700}
#companyName{font-size:13px;color:#c2d7e3;line-height:1.6}.live-badge{color:#baf5dd;background:#ffffff0d;border:1px solid #80d6b63d;border-radius:20px;letter-spacing:.6px;padding:6px 10px;font-size:9px}
.header-actions{justify-content:flex-end;gap:8px;max-width:370px}.header-actions span{color:#c3dbe5;width:100%;text-align:right;margin-bottom:4px}.header-actions button{background:#ffffff0b;color:#edfaff;border-color:#ffffff26;border-radius:9px;padding:10px 13px}.header-actions button:hover{background:#ffffff1b;border-color:#ffffff60;color:white}#refresh{background:#ecfffa;color:#0c6260;border-color:#ecfffa;font-weight:600}#refresh:hover{background:white;color:#084a48}#logout{background:transparent;color:#c7dce5}
.status-row{padding:15px 3px;color:#64788d;font-size:11px}.status-row span:last-child{font-variant-numeric:tabular-nums}.quick-links{gap:9px;margin-bottom:22px}.quick-links a{border-radius:9px;padding:10px 15px;font-size:12px;font-weight:600;border-color:#dce5ec;box-shadow:0 2px 3px #19304703}.quick-links a:first-child{background:#117a74;border-color:#117a74;box-shadow:0 4px 10px #147b7524}.quick-links a:first-child:hover{background:#0c655f;color:#fff}
.kpi-grid{gap:16px;margin-bottom:23px}.kpi{background:white;border:1px solid #e0e7ef;border-radius:15px;color:#17334d;min-height:137px;padding:21px 22px;box-shadow:0 5px 16px #17364d05}.kpi:before{content:"";position:absolute;right:22px;top:23px;width:9px;height:9px;border-radius:50%;background:#7288ce;box-shadow:0 0 0 6px #7288ce12}.kpi:after{width:96px;height:96px;border:20px solid #1d537003;right:-25px;top:auto;bottom:-37px}.kpi-label{font-size:10px;color:#526c83;font-weight:700;letter-spacing:1.2px;padding-right:20px}.kpi-value{font-size:32px;line-height:1.25;font-weight:700;letter-spacing:-1.1px;margin:13px 0 7px;font-variant-numeric:tabular-nums}.kpi small{color:#667e91;line-height:1.5;font-size:10px;display:block}.kpi.teal{background:linear-gradient(120deg,#116c68,#14887e);border-color:#16776f;box-shadow:0 5px 18px #137b7521;color:white}.kpi.teal .kpi-label{color:#d4f3ed}.kpi.teal small{color:#d0eae6}.kpi.teal:before{background:#adf8d5;box-shadow:0 0 0 6px #b2ffe115}.kpi.teal:after{border-color:#ffffff05}.kpi.amber .kpi-value{color:#a56917}.kpi.amber:before{background:#d9a142;box-shadow:0 0 0 6px #d9a14214}
.dashboard-grid{gap:20px}.panel{border-color:#dfe7ef;border-radius:15px;box-shadow:0 4px 15px #18374d04}.panel-heading{padding:18px 21px;background:white;border-bottom:1px solid #edf1f5;min-height:60px}.panel h2{font-size:14px;font-weight:650;letter-spacing:-.2px}.panel-heading h2:before{content:"";display:inline-block;width:4px;height:14px;background:#159187;border-radius:3px;margin-right:10px;vertical-align:-2px}.panel a{font-size:11px;font-weight:600;color:#087c75}.tag{background:#f1f5f9;border:1px solid #e7edf3;padding:5px 8px;border-radius:6px;color:#647d92;font-weight:600;font-size:9px;white-space:nowrap}
.metric-rows{padding:7px 21px 13px}.metric-row{padding:11px 0;font-size:12px;border-bottom-color:#eff3f6}.metric-row span{color:#62788c}.metric-row strong{color:#203c52}.metric-row strong.good{color:#0b8274}.metric-row strong.warn{color:#a36c20}.chart-summary{padding:21px 22px 3px;flex-wrap:wrap}.chart-summary strong{font-size:29px;color:#153b50;letter-spacing:-.9px;font-variant-numeric:tabular-nums}.chart-summary span{color:#607c90}.chart{padding:10px 19px 1px}.chart text{fill:#637e92}.footnote{color:#6d8092;font-size:10px;margin:12px 21px 16px}.package-bars{padding:21px}.package-line{margin-bottom:22px}.package-line:last-child{margin-bottom:5px}.package-line span{color:#45627b}.package-line strong{color:#183d54;font-size:12px}.bar-track{height:9px;background:#edf3f5}.bar-track i{background:linear-gradient(90deg,#168c86,#55bbb0)}
.health-item{padding:25px 20px}.health-item h3{color:#536d83;font-size:12px}.health-item small{color:#6c8193}.health-footer{background:#fafcfd;color:#5e768b;padding:14px 21px}.gauge{box-shadow:0 0 0 6px #f5f9fa}.load-value{color:#157e78}th{background:#f7f9fc;color:#57718a;font-size:10px;font-weight:650;padding:13px 21px}td{padding:13px 21px;border-top-color:#edf2f6}tbody tr:hover{background:#f8fbfd}td small{color:#6d8496}.pill{border-radius:20px;font-weight:600;padding:5px 9px;background:#e6f6ee;color:#237655}.pill.warning{background:#fff3df;color:#98651c}.empty{color:#73889b;padding:32px 20px}.dashboard-footer{color:#6f8598;padding-top:24px;font-size:11px}button:focus-visible,a:focus-visible{outline:3px solid #5ebdb5;outline-offset:3px}
body.compact-view .overview-header{padding:18px 22px;min-height:116px}body.compact-view .kpi{padding:15px 18px;min-height:108px}body.compact-view .kpi-value{font-size:28px;margin:9px 0 5px}body.compact-view .panel-heading{min-height:48px;padding:13px 18px}body.compact-view .metric-row{padding:8px 0}body.compact-view .quick-links{margin-bottom:16px}
@media(min-width:1550px){.main{padding:30px 34px}.dashboard-grid{gap:20px}}
@media(max-width:1100px){.main{padding:20px}.overview-header{padding:23px;gap:18px}.header-actions{max-width:260px}.kpi-grid{gap:13px}.dashboard-grid{gap:15px}}
@media(max-width:800px){.overview-header{border-radius:15px}.header-actions{max-width:none;justify-content:flex-start}h1{font-size:28px}.panel-heading{padding:17px}.chart-summary{padding-left:17px}.kpi-value{font-size:29px}}
@media(max-width:768px){.main{padding:65px 15px 20px}.overview-header{padding:21px}.quick-links{gap:7px}.quick-links a{padding:10px 12px}.mobile-menu{border-radius:8px}.kpi{padding:17px 15px;min-height:128px}.kpi:before{right:17px;top:20px}.kpi-label{font-size:9px;letter-spacing:.8px}.kpi-value{font-size:26px}.kpi-grid{gap:11px}.header-actions button{font-size:11px}.dashboard-footer{flex-wrap:wrap;gap:7px}body.compact-view .main{padding-top:64px}}
@media(max-width:420px){h1{font-size:26px}.live-badge{font-size:8px}.overview-header{padding:18px}.kpi-value{font-size:23px}.kpi small{font-size:9px}.health-grid{grid-template-columns:1fr}.panel-heading{gap:6px}.panel h2{font-size:13px}}
@media(prefers-reduced-motion:no-preference){.quick-links a,.header-actions button{transition:background .15s,border-color .15s}.kpi{transition:box-shadow .18s}.kpi:hover{box-shadow:0 8px 22px #17364d10}}

/* V4: a distinct overview layout, with subscriber tiles and chart-first hierarchy. */
.overview-header{background:#11283f;border-color:#11283f;border-radius:18px;min-height:142px}.overview-header:after{width:350px;height:350px;right:-40px;top:-220px;background:#1eb5a415;border-color:#55d7c825;box-shadow:0 0 0 55px #1eb5a406,0 0 0 110px #1eb5a403}.eyebrow{color:#72d6c8;font-size:10px;letter-spacing:2.5px}h1{font-size:35px}.header-actions button{border-radius:8px}.quick-links{padding:11px;background:#fff;border:1px solid #e1e8f0;border-radius:13px;gap:9px;margin-bottom:20px}.quick-links a{box-shadow:none;background:#f5f8fc;border-color:transparent}.quick-links a:first-child{background:#137c74;color:white}.status-row{padding:13px 2px}
.kpi-grid{gap:15px}.kpi{background:linear-gradient(115deg,#2456a5,#3875c9);color:white;border:0;min-height:151px;padding:22px;border-radius:14px;box-shadow:0 7px 19px #254e9920}.kpi .kpi-label,.kpi.teal .kpi-label{color:#eef6ff;font-size:10px;font-weight:650}.kpi small,.kpi.teal small{color:#e1edff;font-size:10px}.kpi .kpi-value,.kpi.amber .kpi-value{color:white;font-size:34px;font-weight:700;margin:15px 0 8px;letter-spacing:-1px}.kpi.teal{background:linear-gradient(115deg,#08766c,#159c8b);border:0}.kpi:nth-child(3){background:linear-gradient(115deg,#6150aa,#8970c7)}.kpi.amber{background:linear-gradient(115deg,#ac6b20,#d39943)}.kpi:before,.kpi.teal:before,.kpi.amber:before{height:28px;width:28px;border-radius:9px;border:1px solid #ffffff38;background:#ffffff15;box-shadow:none;top:18px;right:19px}.kpi:after{width:125px;height:125px;border:24px solid #ffffff08;bottom:-47px;right:-24px}.kpi-label{padding-right:34px;max-width:100%}
.dashboard-grid{grid-template-columns:repeat(12,minmax(0,1fr));gap:18px}.dashboard-grid>.panel{grid-column:span 6}.dashboard-grid>#onlinePanel,.dashboard-grid>#collectionPanel{grid-column:span 8}.dashboard-grid>#subscriberPanel,.dashboard-grid>#financePanel{grid-column:span 4}.dashboard-grid>.wide{grid-column:1/-1}.dashboard-grid>#expiryPanel{grid-column:span 6}.panel{border-radius:14px}.panel-heading{padding:18px 22px}.panel h2{font-size:15px}.panel-heading h2:before{height:17px;background:#258eab;margin-right:11px}.chart-summary strong{font-size:36px;line-height:1.2}.chart-summary span{font-size:12px}.chart{padding:5px 20px 0;min-height:190px}.chart svg{max-height:230px}.chart-summary{padding:20px 23px 0}.tag{border-radius:20px;font-size:9px;padding:6px 10px}
#subscriberRows{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;padding:16px}#subscriberRows .metric-row{display:flex;flex-direction:column-reverse;align-items:flex-start;justify-content:center;gap:5px;background:#f3f7fb;border:1px solid #e9eff5;border-radius:10px;padding:12px;min-height:77px}#subscriberRows .metric-row span{font-size:10px;line-height:1.5;color:#536d83}#subscriberRows .metric-row strong{font-size:23px;line-height:1.1;font-weight:700;color:#274e73}#subscriberRows .metric-row strong.good{color:#07816e}#subscriberRows .metric-row strong.warn{color:#a56a15}#subscriberRows .metric-row:first-child{background:#eaf2ff;border-color:#dbe9fc}#subscriberRows .metric-row:nth-child(2){background:#e9f6f0;border-color:#d8eee3}
#financeRows .metric-row{padding:10px 0}#operationsPanel .metric-rows{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:25px}#operationsPanel .metric-row{font-size:11px}#operationsPanel .metric-row span{max-width:75%}.health-grid{padding:18px;gap:15px;background:#fafcfe}.health-item{border:1px solid #e3ebf3!important;background:white;border-radius:12px;padding:23px}.health-footer{background:white}.package-line{margin-bottom:24px}.bar-track{height:11px}.package-line:nth-child(2) .bar-track i{background:#5587c4}.package-line:nth-child(3) .bar-track i{background:#8b71bf}.package-line:nth-child(4) .bar-track i{background:#c99d57}
body.compact-view .kpi{min-height:122px;padding:17px}body.compact-view .kpi-value{font-size:29px}body.compact-view .chart{min-height:150px}body.compact-view #subscriberRows{gap:8px;padding:12px}body.compact-view #subscriberRows .metric-row{padding:9px;min-height:61px}body.compact-view #subscriberRows .metric-row strong{font-size:21px}
@media(max-width:1150px){.dashboard-grid>#onlinePanel,.dashboard-grid>#subscriberPanel,.dashboard-grid>#collectionPanel,.dashboard-grid>#financePanel{grid-column:span 6}.chart svg{max-height:250px}.kpi-value{font-size:30px}#operationsPanel .metric-rows{display:block}.kpi{padding:18px}}
@media(max-width:800px){.dashboard-grid{grid-template-columns:minmax(0,1fr)}.dashboard-grid>.panel,.dashboard-grid>#onlinePanel,.dashboard-grid>#subscriberPanel,.dashboard-grid>#collectionPanel,.dashboard-grid>#financePanel,.dashboard-grid>#expiryPanel,.dashboard-grid>.wide{grid-column:1/-1}body.compact-view .dashboard-grid{grid-template-columns:minmax(0,1fr)}.overview-header{min-height:0}h1{font-size:29px}.chart{min-height:0}.kpi .kpi-value,.kpi.amber .kpi-value{font-size:27px}.kpi{min-height:139px}.kpi:before,.kpi.teal:before,.kpi.amber:before{width:18px;height:18px;border-radius:6px;right:14px;top:17px}.kpi-label{padding-right:18px}.quick-links{padding:9px}#subscriberRows{grid-template-columns:repeat(4,minmax(0,1fr))}.health-grid{padding:12px;gap:10px}}
@media(max-width:480px){#subscriberRows{grid-template-columns:repeat(2,minmax(0,1fr))}.kpi{padding:16px 13px;min-height:141px}.kpi .kpi-value,.kpi.amber .kpi-value{font-size:25px}.kpi small,.kpi.teal small{font-size:9px}.kpi-label,.kpi.teal .kpi-label{font-size:9px}.kpi-grid{gap:10px}.overview-header{padding:21px 18px}.health-grid{grid-template-columns:1fr}.chart-summary strong{font-size:30px}.quick-links a{font-size:11px}.panel-heading{padding:17px}.dashboard-grid{gap:15px}}