:root{--bg:#08111d;--sidebar:#0a1422;--card:#111e30;--card2:#142238;--border:#23364d;--text:#edf5fb;--muted:#94a8bb;--dim:#607890;--green:#39dfac;--blue:#58b5f8;--yellow:#f2c36a;--orange:#f59a74;--purple:#a48bf8;--radius:16px;--shadow:0 15px 40px #02081430}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--bg);color:var(--text);font:14px/1.45 Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif}button,input,select{font:inherit}button{cursor:pointer}button:focus-visible,input:focus-visible,select:focus-visible{outline:2px solid var(--green);outline-offset:2px}::selection{background:#39dfac50}::-webkit-scrollbar{width:9px;height:9px}::-webkit-scrollbar-thumb{background:#2c425b;border-radius:12px}::-webkit-scrollbar-track{background:transparent}
.app{min-height:100vh}.sidebar{width:235px;background:linear-gradient(180deg,#0d1a29,#0a1422 65%);position:fixed;inset:0 auto 0 0;z-index:5;display:flex;flex-direction:column;border-right:1px solid #1c2e43;padding:24px 14px}.brand{display:flex;align-items:center;gap:12px;padding:4px 12px 22px}.brand-logo{width:39px;height:39px;border-radius:12px;background:#184e45;border:1px solid #2b8070;color:var(--green);display:grid;place-items:center;box-shadow:0 0 25px #38dfa715}.brand-logo svg{width:23px;height:23px}.brand-name{font-size:22px;font-weight:800;letter-spacing:-.75px;line-height:1}.brand-name span{color:var(--green)}.brand-sub{display:block;margin-top:6px;color:#7195a2;letter-spacing:1.7px;font-size:8px;font-weight:800}.nav-label{font-size:10px;font-weight:800;letter-spacing:1.7px;color:#59748c;padding:14px 15px 10px}.nav{display:flex;flex-direction:column;gap:4px}.nav button{border:0;background:transparent;color:#90a4b7;text-align:left;display:flex;align-items:center;gap:12px;width:100%;border-radius:11px;padding:12px 13px;font-weight:600}.nav button:hover{background:#15283b;color:white}.nav button.active{background:#153c3d;color:#71efd0;border:1px solid #2c685b;padding:11px 12px}.nav svg{width:18px;height:18px;flex:none}.sidebar-bottom{margin-top:auto;border-top:1px solid #24344a;padding:19px 10px 2px}.sidebar-stat{display:flex;gap:9px;align-items:flex-start;color:#b8cbd8;font-size:12px;font-weight:650}.pulse-dot{width:8px;height:8px;background:#38dfac;box-shadow:0 0 0 4px #38dfac18;border-radius:99px;flex:none;margin-top:4px}.sidebar-stat small{display:block;color:#678298;font-size:11px;font-weight:400;margin-top:4px}.sidebar-mini{color:#526b80;font-size:10px;margin-top:23px}
.main{margin-left:235px;padding:0 31px 44px;max-width:1900px}.topbar{min-height:72px;border-bottom:1px solid #1c3044;display:flex;align-items:center;justify-content:space-between;gap:18px}.breadcrumb{font-size:12px;color:#657f95;white-space:nowrap}.breadcrumb strong{color:#d8e8f4;font-weight:650}.header-right{display:flex;align-items:center;gap:11px}.date-pill,.demo-badge{display:inline-flex;align-items:center;gap:7px;border:1px solid #2a3c50;background:#111e30;color:#c7d8e5;padding:8px 11px;border-radius:9px;font-size:11px;white-space:nowrap}.demo-badge{background:#322a19;border-color:#715b2e;color:#f5cf7a;letter-spacing:.5px;font-size:10px;font-weight:800}.header-right svg{width:14px;height:14px}.export{display:inline-flex;align-items:center;gap:8px;background:var(--green);border:1px solid #44f6ba;color:#05221b;padding:9px 14px;border-radius:9px;font-size:12px;font-weight:800;transition:filter .2s}.export:hover{filter:brightness(1.1)}.export svg{width:16px;height:16px}
.heading{display:flex;align-items:flex-end;justify-content:space-between;margin:28px 0 19px;gap:18px}.eyebrow{display:inline-flex;align-items:center;gap:7px;color:#64d9bb;text-transform:uppercase;letter-spacing:1.7px;font-size:10px;font-weight:800}.eyebrow:before{content:"";width:17px;height:2px;background:var(--green)}h1{margin:8px 0 3px;font-size:clamp(23px,2.25vw,32px);letter-spacing:-1.05px;line-height:1.18}p{margin:0}.heading p{color:var(--muted);font-size:12px}.heading-note{color:#7a90a4;font-size:12px;white-space:nowrap;padding-bottom:4px}
.filters{border:1px solid var(--border);border-radius:var(--radius);background:#101c2c;padding:17px 19px;display:grid;grid-template-columns:1.05fr 1fr 1.25fr 1.3fr auto;gap:12px;align-items:end;margin-bottom:19px}.field label{display:block;color:#8fa7bb;font-size:10px;text-transform:uppercase;letter-spacing:1px;font-weight:750;margin:0 0 8px}.field select,.field input{width:100%;height:40px;background:#0c1827;border:1px solid #2a3e54;border-radius:9px;color:#dceaf4;padding:0 11px;outline:none;min-width:0}.field input::placeholder{color:#617b90}.field select{appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%2395aabc' stroke-width='2'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 10px center;padding-right:26px}.field select option{background:#142237}.reset{height:40px;color:#b5c8d8;background:#1b2b3d;border:1px solid #31465b;border-radius:9px;padding:0 14px;font-size:12px;font-weight:700;white-space:nowrap}.reset:hover{background:#263c52}.custom-range{display:none;grid-column:1/-1;gap:12px;align-items:center}.custom-range.visible{display:flex}.custom-range .field{max-width:210px;flex:1}
.metrics{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:15px;margin-bottom:18px}.metric{border:1px solid var(--border);background:linear-gradient(145deg,#142337,#101c2d);border-radius:var(--radius);padding:19px 20px 17px;min-width:0}.metric-head{display:flex;justify-content:space-between;gap:8px;align-items:center;color:#a1b4c5;font-size:12px;font-weight:600}.metric-icon{height:31px;width:31px;border-radius:9px;display:grid;place-items:center;background:#153b39;color:var(--green)}.metric-icon.blue{background:#173450;color:var(--blue)}.metric-icon.purple{background:#302a4d;color:#b2a4ff}.metric-icon.orange{background:#493021;color:var(--yellow)}.metric-icon svg{width:16px;height:16px}.metric-value{font-size:clamp(22px,2.7vw,35px);font-weight:780;letter-spacing:-1.4px;margin-top:13px;line-height:1.1;font-variant-numeric:tabular-nums}.metric-note{color:#7590a4;font-size:11px;margin-top:9px}.metric-note b{color:#66e2c1;font-weight:750}
.dashboard-grid{display:grid;grid-template-columns:minmax(0,1.85fr) minmax(290px,.87fr);gap:17px;margin-bottom:17px}.panel{min-width:0;background:linear-gradient(160deg,#122035,#101c2c);border:1px solid var(--border);border-radius:var(--radius);padding:19px 21px;box-shadow:var(--shadow)}.panel-head{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:14px}.panel-title{font-size:15px;font-weight:750;letter-spacing:-.28px;margin:0}.panel-sub{font-size:11px;color:#8199ad;margin-top:4px}.panel-pill{border:1px solid #2a4651;background:#17323a;color:#6cddbd;border-radius:7px;padding:5px 9px;font-size:10px;font-weight:750;white-space:nowrap}.segmented{display:flex;gap:2px;background:#0b1725;border:1px solid #283d52;border-radius:9px;padding:3px}.segmented button{border:0;background:transparent;color:#849aad;font-size:11px;padding:7px 10px;border-radius:6px;font-weight:700}.segmented button.active{background:#264539;color:#74ebc5;box-shadow:0 1px 4px #0002}.chart-wrap{position:relative;height:265px;margin:5px -5px 0}.chart-wrap svg{width:100%;height:100%;display:block;overflow:visible}.chart-legend{display:flex;gap:19px;align-items:center;margin-top:12px;color:#9bb1c3;font-size:11px}.legend-dot{display:inline-block;width:8px;height:8px;background:var(--green);border-radius:50%;margin-right:7px}.legend-dot.blue{background:var(--blue)}.chart-tooltip{position:absolute;display:none;pointer-events:none;background:#06101de8;border:1px solid #38536a;border-radius:9px;padding:10px 12px;box-shadow:0 12px 28px #0009;color:#fff;font-size:11px;min-width:126px;z-index:2}.chart-tooltip strong{display:block;font-weight:700;margin-bottom:6px}.chart-tooltip span{display:block;color:#90b2c5;margin-top:3px}.chart-tooltip b{color:#e6f7ff}.muted-tip{margin-top:12px;color:#617c90;font-size:10px}
.donut-row{display:flex;justify-content:center;align-items:center;padding:4px 0 15px}.donut{width:177px;height:177px;border-radius:50%;display:grid;place-items:center;box-shadow:0 0 0 1px #2c3e5230}.donut-inner{width:126px;height:126px;border-radius:50%;background:#111e30;display:flex;flex-direction:column;align-items:center;justify-content:center;box-shadow:0 0 0 1px #22354a}.donut-inner strong{font-size:25px;letter-spacing:-1px}.donut-inner span{font-size:10px;color:#8b9fb3;margin-top:1px}.category-list{display:flex;flex-direction:column;gap:8px}.category-line{display:grid;grid-template-columns:8px 1fr auto;align-items:center;gap:9px;font-size:11px;color:#9bb2c4}.category-line .dot{height:7px;width:7px;border-radius:50%}.category-line b{font-size:11px;font-weight:750;color:#d8e7f2;font-variant-numeric:tabular-nums}
.list-panel{min-height:380px}.rank-list{display:flex;flex-direction:column;gap:3px;margin-top:4px}.rank-row{width:100%;text-align:left;border:none;background:transparent;color:inherit;display:grid;grid-template-columns:23px minmax(0,1fr) auto;align-items:center;gap:11px;border-radius:9px;padding:9px 7px;transition:background .14s}.rank-row:hover,.rank-row.selected{background:#1a3144}.rank-no{font-size:11px;color:#617b90;font-weight:750;text-align:center;font-variant-numeric:tabular-nums}.rank-main{min-width:0}.rank-main-top{display:flex;align-items:center;gap:6px;min-width:0}.rank-main-name{display:block;font-size:11px;font-weight:720;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.rank-main-detail{font-size:10px;color:#728ba0;display:block;margin-top:3px}.rank-bar{background:#27394b;border-radius:99px;height:4px;overflow:hidden;margin-top:7px;max-width:100%}.rank-bar-fill{background:linear-gradient(90deg,#269b83,#3ee1b0);height:100%;border-radius:99px}.rank-bar-fill.blue{background:linear-gradient(90deg,#26759e,#54b6f9)}.rank-num{font-size:12px;font-weight:780;color:#e6f1f9;font-variant-numeric:tabular-nums}.rank-num span{color:#668297;font-size:9px;display:block;text-align:right;font-weight:500;margin-top:2px}.mini-tag{border-radius:5px;padding:2px 5px;background:#273b4d;color:#8bb6c6;font-size:9px;white-space:nowrap}.empty{padding:27px 12px;text-align:center;color:#88a0b1;font-size:12px}.panel-footer{font-size:10px;color:#6c8499;margin-top:15px;padding-top:12px;border-top:1px solid #22364b}
.heat-panel{min-height:315px}.heatmap-scroll{overflow-x:auto;padding-bottom:6px}.heatmap{display:grid;grid-template-columns:38px repeat(24,minmax(12px,1fr));gap:5px;min-width:570px;align-items:center}.heat-label{font-size:10px;color:#7f98ae;text-align:right;padding-right:6px}.heat-hour{font-size:9px;color:#71889e;text-align:center}.heat-cell{aspect-ratio:1;min-height:12px;border-radius:3px;background:#1c3042;border:1px solid #38536955;position:relative}.heat-cell:hover{outline:1px solid #b3f2e0;outline-offset:1px}.heat-caption{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:7px;font-size:10px;color:#718da1;margin-top:13px}.scale{display:flex;align-items:center;gap:5px}.scale i{display:block;height:10px;width:15px;border-radius:3px}.types-list{display:flex;flex-direction:column;gap:16px;margin-top:22px}.type-line{display:grid;grid-template-columns:92px minmax(0,1fr) 46px;gap:9px;align-items:center;font-size:11px;color:#bdd0df}.type-track{height:8px;border-radius:50px;background:#263b4d;overflow:hidden}.type-fill{height:100%;border-radius:50px}.type-value{text-align:right;font-size:11px;color:#d5e5f0;font-weight:750}.type-foot{font-size:11px;color:#7c97ab;margin-top:25px;background:#16283a;border:1px solid #263c50;border-radius:9px;padding:13px}
.data-panel{margin-top:17px}.data-toolbar{display:flex;justify-content:space-between;align-items:center;gap:12px}.table-wrap{overflow-x:auto;margin:8px -5px 0}.data-table{border-collapse:collapse;width:100%;min-width:800px;text-align:left}.data-table th{font-size:10px;text-transform:uppercase;letter-spacing:.75px;color:#6f8da3;padding:14px 10px;border-bottom:1px solid #2b4055;white-space:nowrap}.data-table td{font-size:11px;color:#bcd0df;padding:13px 10px;border-bottom:1px solid #203249}.data-table tbody tr:hover{background:#192b3d}.data-table tbody tr:last-child td{border-bottom:none}.table-person{font-weight:750;color:#e9f4fb}.origin-cell{max-width:210px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.type-badge{border:1px solid #36546a;background:#1c3447;padding:4px 7px;border-radius:6px;font-size:10px;color:#99c3d6}.type-badge.private{border-color:#417b73;background:#193a35;color:#9ae1c7}.table-preview{max-width:260px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:#8aa4b6!important}.pagination{display:flex;align-items:center;justify-content:space-between;border-top:1px solid #25384b;margin-top:5px;padding-top:14px;gap:10px;color:#8199ad;font-size:11px}.pager{display:flex;gap:7px}.pager button{background:#1c3043;color:#a5bdd0;border:1px solid #314b61;border-radius:7px;padding:7px 10px;font-weight:700}.pager button:disabled{opacity:.4;cursor:not-allowed}.footnote{font-size:10px;color:#587386;text-align:center;margin:25px 0 0}.toast{display:none;position:fixed;bottom:24px;right:24px;z-index:100;background:#19392f;border:1px solid #3b8c72;color:#c6ffe8;padding:12px 16px;border-radius:10px;box-shadow:0 15px 35px #0008;font-size:12px}.toast.visible{display:block}
@media(max-width:1400px){.main{padding:0 23px 40px}.metrics{gap:10px}.metric{padding:16px}.filters{grid-template-columns:1fr 1fr 1.15fr 1.15fr auto}.dashboard-grid{grid-template-columns:minmax(0,1.5fr) minmax(270px,.88fr)}.panel{padding:18px}}
@media(max-width:1150px){.sidebar{width:72px;padding:19px 8px}.brand{padding:4px 8px 20px}.brand-name,.nav-label,.sidebar-stat,.sidebar-mini,.nav button span,.brand-sub{display:none}.nav button{justify-content:center}.main{margin-left:72px}.sidebar-bottom{padding:12px 5px}.sidebar-stat{display:flex}.sidebar-stat>div{display:none}.filters{grid-template-columns:repeat(2,minmax(0,1fr)) auto}.filters .field:nth-child(3){grid-column:1}.filters .field:nth-child(4){grid-column:2}.reset{grid-column:3;grid-row:1/3;height:100%}.dashboard-grid{grid-template-columns:minmax(0,1.45fr) minmax(255px,.87fr)}}
@media(max-width:820px){.metrics{grid-template-columns:repeat(2,minmax(0,1fr))}.dashboard-grid{grid-template-columns:1fr}.heading-note{display:none}.filters{grid-template-columns:1fr 1fr}.reset{grid-column:1/-1;grid-row:auto;height:38px}.topbar{min-height:63px}.date-pill{display:none}.chart-wrap{height:230px}.list-panel{min-height:0}.donut-row{padding:10px 0 22px}}
@media(max-width:560px){.sidebar{display:none}.main{margin-left:0;padding:0 13px 30px}.topbar{gap:7px}.breadcrumb{font-size:10px}.header-right{gap:5px}.export{padding:8px 10px;font-size:0}.export svg{width:17px;height:17px}.demo-badge{font-size:8px;padding:7px}.heading{margin-top:19px}.filters{padding:12px;gap:10px}.field select,.field input{font-size:11px}.metric{padding:13px}.metric-head{font-size:10px}.metric-value{font-size:24px}.metric-note{font-size:10px}.panel{padding:14px}.segmented button{padding:6px 7px;font-size:10px}.chart-wrap{height:215px}.custom-range .field{min-width:0}.rank-row{padding:8px 3px}.heading p{font-size:11px}}