:root{--ink:#243047;--muted:#8792a5;--line:#edf0f5;--bg:#f6f7fb;--orange:#ff873e;--navy:#172b4d;--green:#21a67a;--purple:#8875e8}
*{box-sizing:border-box}html,body{margin:0;min-height:100%;font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",Arial,sans-serif;color:var(--ink);background:var(--bg);font-size:13px}a{text-decoration:none;color:inherit}
.shell{display:flex;min-height:100vh}.sidebar{width:236px;flex:0 0 236px;background:#fff;border-right:1px solid var(--line);padding:22px 15px;display:flex;flex-direction:column}.brand{display:flex;align-items:center;gap:10px;padding:0 8px 28px;font-size:14px;font-weight:800;letter-spacing:.2px}.brand-mark{width:32px;height:32px;border-radius:10px;background:var(--orange);color:white;display:grid;place-items:center;font-size:17px}.brand small{display:block;color:#98a1b0;font-size:9px;font-weight:600;letter-spacing:1.4px;margin-top:4px}.nav-label{font-size:9px;color:#a2aaba;letter-spacing:1.4px;font-weight:700;padding:12px 10px 9px}.nav{display:flex;flex-direction:column;gap:4px}.nav a,.logout-link{display:flex;align-items:center;gap:12px;padding:10px;border-radius:8px;color:#69758a;font-size:12px;font-weight:550}.nav a:hover,.nav a.active{background:#fff2e9;color:#f17b32}.nav-icon{width:17px;text-align:center;font-size:15px;color:inherit}.sidebar-bottom{margin-top:auto}.logout-link{margin:0 0 18px}.sidebar-foot{border-top:1px solid var(--line);padding:17px 10px 0;font-size:11px;color:#667085;line-height:1.7}.sidebar-foot small{color:#a0a8b5}.main{flex:1;min-width:0}.topbar{height:62px;background:#fff;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;padding:0 30px}.topbar-title{font-size:13px;font-weight:700}.topbar-right{display:flex;align-items:center;gap:11px}.topbar-date{font-size:11px;color:#9aa3b1;margin-right:8px}.avatar{width:30px;height:30px;border-radius:50%;background:#ffe6d5;color:#e8752d;display:grid;place-items:center;font-weight:800}.user{display:flex;flex-direction:column;gap:2px;font-size:11px}.user small{font-size:10px;color:#98a1b0}.content{max-width:1600px;margin:auto;padding:28px 30px 18px}.dash-heading{display:flex;align-items:flex-end;justify-content:space-between;margin-bottom:22px}.eyebrow{font-size:9px;letter-spacing:1.5px;color:#a1aaba;font-weight:700}.dash-heading h1{font-size:27px;letter-spacing:-.8px;margin:6px 0 4px;color:#25334b}.dash-heading p,.panel-head p,.section-title p{margin:0;color:#97a1b1;font-size:11px}.period-chip{font-size:10px;color:#758198;background:#fff;border:1px solid var(--line);border-radius:20px;padding:8px 12px}.live-dot{display:inline-block;width:6px;height:6px;background:#20b987;border-radius:50%;margin-right:6px}
.summary-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;margin-bottom:18px}.summary-card{border-radius:12px;padding:17px 18px 14px;min-height:132px;color:#fff;display:flex;flex-direction:column;box-shadow:0 4px 14px rgba(34,49,76,.05)}.summary-card.blue{background:#438fe9}.summary-card.orange{background:#ffb33e}.summary-card.green{background:#28a77c}.summary-card.violet{background:#8875e8}.summary-top{display:flex;justify-content:space-between;align-items:center;font-size:11px;font-weight:600;opacity:.95}.summary-icon{font-size:18px;opacity:.8}.summary-card>strong{font-size:26px;letter-spacing:-.7px;margin:9px 0 1px}.summary-card>small{font-size:10px;opacity:.85}.summary-link{border-top:1px solid rgba(255,255,255,.22);margin-top:auto;padding-top:9px;font-size:10px;display:flex;justify-content:space-between;opacity:.95}.summary-link b{font-weight:700}
.dashboard-grid{display:grid;grid-template-columns:1.12fr .88fr;gap:16px}.panel{background:#fff;border:1px solid #edf0f4;border-radius:12px;padding:18px 19px;box-shadow:0 3px 12px rgba(35,49,73,.025);min-width:0}.chart-panel{min-height:285px}.panel-head{display:flex;align-items:center;justify-content:space-between;padding-bottom:13px;border-bottom:1px solid var(--line);margin-bottom:14px}.panel-head h2,.section-title h2{font-size:13px;margin:0 0 4px;font-weight:750;color:#28364d}.panel-head>a{font-size:10px;color:#f0803c;font-weight:650}.panel-icon{width:28px;height:28px;border-radius:8px;background:#fff3eb;color:#ef823e;display:grid;place-items:center;font-size:17px}.chart-area{height:205px;position:relative}.performers,.categories{min-height:250px;margin-top:16px}.performer-list{display:flex;flex-direction:column}.performer-row{display:flex;align-items:center;gap:11px;padding:9px 0;border-bottom:1px solid #f3f4f7}.performer-row:last-child{border-bottom:0}.rank{width:25px;height:25px;display:grid;place-items:center;border-radius:8px;background:#f4f6fa;color:#7d899c;font-weight:750;font-size:11px}.rank-1{background:#fff0df;color:#e58a30}.rank-2{background:#eef2f8;color:#71819b}.rank-3{background:#fff2eb;color:#c88968}.performer-info{flex:1;min-width:0}.performer-info strong,.performer-info small{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.performer-info strong{font-size:11px}.performer-info small{font-size:10px;color:#9ba4b2;margin-top:3px}.performer-score{width:90px;text-align:right}.performer-score strong{font-size:11px}.mini-track,.category-track{height:5px;background:#f0f2f6;border-radius:9px;overflow:hidden;margin-top:6px}.mini-track span{height:100%;display:block;background:var(--orange);border-radius:9px}.category-list{display:flex;flex-direction:column;gap:13px}.category-row>div:first-child{display:flex;justify-content:space-between;gap:10px;font-size:10px}.category-row>div:first-child span{color:#66748a}.category-row strong{font-size:10px;color:#34435c}.category-track{height:6px;margin-top:6px}.category-track span{height:100%;display:block;background:linear-gradient(90deg,#ffb16e,#ff873e);border-radius:9px}.recent-panel{margin-top:16px}.table-scroll{overflow:auto}.modern-table{width:100%;border-collapse:collapse;min-width:620px}.modern-table th{text-align:left;padding:10px 12px;color:#98a2b2;font-size:9px;text-transform:uppercase;letter-spacing:.6px;background:#fafbfc;font-weight:700}.modern-table td{padding:11px 12px;border-bottom:1px solid #f0f2f5;color:#66748a;font-size:10px}.modern-table td strong{color:#34435b;font-weight:650}.status{display:inline-block;border-radius:20px;padding:5px 8px;font-size:9px;font-weight:650}.status.good{background:#e9f8f1;color:#26976d}.status.watch{background:#fff5e8;color:#d48a2c}.status.low{background:#fff0f0;color:#d45e66}.empty-state{padding:24px;text-align:center;color:#9ba4b2;font-size:11px}.quick-section{margin-top:20px}.section-title{margin-bottom:11px}.section-title h2{margin-bottom:4px}.quick-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:11px}.quick-card{display:flex;align-items:center;gap:10px;padding:13px;background:#fff;border:1px solid var(--line);border-radius:10px}.quick-icon{width:31px;height:31px;border-radius:9px;background:#fff1e8;color:#ee813d;display:grid;place-items:center;font-size:17px}.quick-card>span:nth-child(2){flex:1;min-width:0}.quick-card strong,.quick-card small{display:block}.quick-card strong{font-size:10px}.quick-card small{font-size:9px;color:#9ba4b2;margin-top:3px}.quick-card>b{font-size:12px;color:#aab2bf}.quick-card:hover{border-color:#ffd4b9;transform:translateY(-1px)}.footer{padding:12px 30px 20px;color:#a3abba;font-size:9px}.footer span{padding:0 5px}
.login-page{min-height:100vh;display:grid;place-items:center;padding:20px;background:linear-gradient(135deg,#172b4d,#304e78)}.login-card{width:100%;max-width:410px;background:#fff;border-radius:16px;padding:34px;box-shadow:0 20px 70px #07132255}.login-card h1{font-size:23px;margin:0 0 7px}.login-card p{font-size:12px;color:#8792a5;margin:0 0 24px}.field{margin:14px 0}.field label{display:block;font-size:12px;font-weight:650;margin-bottom:7px}.field input{width:100%;border:1px solid #d9e0e9;border-radius:8px;padding:12px;font-size:13px}.alert{background:#fff0f0;color:#a42b37;border-radius:8px;padding:11px;font-size:12px;margin-bottom:15px}
@media(max-width:1100px){.summary-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.dashboard-grid{grid-template-columns:1fr 1fr}.quick-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:760px){.sidebar{width:66px;flex-basis:66px;padding:17px 8px}.brand{padding:0 8px 22px}.brand>span:last-child,.nav-label,.nav a>span:last-child,.sidebar-foot,.logout-link:not(.nav-icon){display:none}.nav a,.logout-link{justify-content:center;padding:11px 5px}.nav-icon{font-size:17px}.content{padding:20px 15px}.topbar{padding:0 15px}.dashboard-grid{grid-template-columns:1fr}.dash-heading{align-items:flex-start;gap:10px;flex-direction:column}.period-chip{align-self:flex-start}.summary-grid{gap:9px}.summary-card{padding:13px;min-height:125px}.summary-card>strong{font-size:22px}.quick-grid{grid-template-columns:1fr 1fr}.panel{padding:15px}.chart-area{height:190px}}
@media(max-width:420px){.summary-grid{grid-template-columns:1fr 1fr}.quick-grid{grid-template-columns:1fr}.topbar-date{display:none}.content{padding-left:11px;padding-right:11px}}


/* Navigation color refinement */
.sidebar{background:#172b4d;border-right:1px solid #223b61;color:#e8eef8}
.brand{color:#ffffff}
.brand small{color:#9eb2d0}
.brand-mark{background:#ff873e;color:#fff}
.sidebar .nav-label{color:#8fa6c8}
.sidebar .nav a,.sidebar .logout-link{color:#c5d2e5}
.sidebar .nav a:hover,.sidebar .nav a.active{background:#29466f;color:#ffffff}
.sidebar .nav-icon{color:inherit}
.sidebar .sidebar-foot{border-top:1px solid #294365;color:#c5d2e5}
.sidebar .sidebar-foot small{color:#8fa6c8}
.sidebar .logout-link:hover{background:#29466f;color:#fff}
.topbar{background:#fff1e7;border-bottom:1px solid #f2d9c9}
.topbar-title{color:#27364d}
.topbar-date{color:#8e796d}
.topbar .avatar{background:#ffe0cb;color:#c96427}
.topbar .user{color:#34435b}
.topbar .user small{color:#987f70}
@media(max-width:760px){
 .sidebar{background:#172b4d}
}
