@font-face{font-family:Inter;src:url('/assets/wholesaler/fonts/InterVariable.woff2') format('woff2');font-weight:100 900;font-display:swap}
:root{--bg:#020b17;--cyan:#00d9ff;--blue:#359fff;--text:#f5f9ff;--muted:#a2cff1;--green:#22e56f;--red:#ff494e;--line:#087ca4;--u:calc(100vw / 1672)}
*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--text);font-family:Inter,Arial,sans-serif;font-size:calc(16 * var(--u))}button,select{font:inherit;color:inherit}button{cursor:pointer}button:focus-visible,select:focus-visible,a:focus-visible{outline:2px solid white;outline-offset:4px}button:disabled{opacity:.45;cursor:not-allowed}.icon{width:calc(26 * var(--u));height:calc(26 * var(--u));fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;flex-shrink:0;color:var(--cyan)}button{border:0;background:none}p,h1,h2,h3{margin:0}.skip{position:absolute;top:-100px}.skip:focus{top:0;z-index:10;background:var(--bg);padding:15px}small{font-size:calc(12 * var(--u));color:var(--muted)}
.topbar{height:calc(66 * var(--u));display:flex;align-items:center;border-bottom:1px solid var(--line);background:linear-gradient(110deg,#020d19,#001326 50%,#020c18)}.brand{height:100%;width:33.4%;border-right:1px solid var(--line);display:flex;align-items:center;padding-left:calc(46 * var(--u))}.brand img{width:calc(220 * var(--u))}.customer{display:flex;align-items:center;gap:calc(22 * var(--u));padding-left:calc(27 * var(--u))}.customer .icon{color:#85c9fb;width:calc(27 * var(--u));height:calc(31 * var(--u))}.customer strong{display:block;font-size:calc(16 * var(--u));margin-bottom:calc(3 * var(--u))}.status{display:flex;align-items:center;gap:calc(12 * var(--u));border:1px solid #009a52;background:#00231e;border-radius:30px;padding:calc(9 * var(--u)) calc(17 * var(--u));margin-left:calc(46 * var(--u));font-size:calc(14 * var(--u));font-weight:600;box-shadow:inset 0 0 8px #00ff4c15}.dot{display:inline-block;width:calc(11 * var(--u));height:calc(11 * var(--u));border-radius:50%;background:var(--green);flex-shrink:0}.glow{box-shadow:0 0 8px #23ff78;background:#7cff9a}.profile{margin-left:auto;display:flex;align-items:center;gap:calc(26 * var(--u));padding-right:calc(37 * var(--u))}.bell{position:relative;border-right:1px solid var(--line);padding-right:calc(33 * var(--u))}.bell .icon{color:#88c4f3}.badge{position:absolute;top:calc(-7 * var(--u));left:calc(17 * var(--u));background:var(--cyan);color:#002031;border-radius:50%;font-size:calc(10 * var(--u));padding:calc(4 * var(--u)) calc(6 * var(--u))}.user{display:flex;align-items:center;gap:calc(14 * var(--u));text-align:left;font-size:calc(12 * var(--u))}.user small{display:block;margin-top:calc(4 * var(--u))}.avatar{width:calc(42 * var(--u));height:calc(42 * var(--u));border:1px solid #009de6;border-radius:50%;display:grid;place-items:center;box-shadow:0 0 8px #00bcff25}.avatar img{width:70%;height:70%}.chev{color:var(--cyan);font-size:calc(29 * var(--u));line-height:1}.user .chev{font-size:calc(18 * var(--u));color:var(--muted)}
.sidebar{position:absolute;left:0;top:calc(66 * var(--u));width:calc(227 * var(--u));min-height:calc(875 * var(--u));height:calc(100vh - 66 * var(--u));border-right:1px solid #00547b;background:linear-gradient(135deg,transparent 78%,#00213955 78%,transparent 91%),linear-gradient(115deg,#020d19,#001427);padding:calc(30 * var(--u)) calc(11 * var(--u))}.nav-item{display:flex;align-items:center;gap:calc(19 * var(--u));width:100%;height:calc(51 * var(--u));margin-bottom:calc(10 * var(--u));border:1px solid transparent;border-radius:calc(6 * var(--u));padding:0 calc(19 * var(--u));text-align:left;color:var(--muted);white-space:nowrap}.nav-item .icon{color:#85c5fb}.nav-item.active{border-color:var(--cyan);background:linear-gradient(90deg,#00304e,#003567 75%,#0074a6);box-shadow:0 0 13px #00ccff44,inset 0 0 10px #00baff50;color:white;font-weight:600}.nav-item.active .icon{color:var(--cyan)}.nav-item:hover{background-color:#073754}.tagline{position:absolute;bottom:calc(18 * var(--u));left:calc(38 * var(--u));font-size:calc(10 * var(--u));font-weight:600;letter-spacing:calc(2 * var(--u));line-height:1.6;color:var(--cyan)}.tagline:after{content:'';display:block;width:calc(70 * var(--u));border-bottom:2px solid var(--cyan);margin-top:calc(6 * var(--u))}
main{margin-left:calc(227 * var(--u));padding:calc(18 * var(--u)) calc(22 * var(--u)) calc(8 * var(--u)) calc(30 * var(--u));background:linear-gradient(125deg,#001b3540 45%,transparent 45%)}.heading{display:flex;align-items:center;justify-content:space-between;height:calc(86 * var(--u));margin-bottom:0}h1{font-size:calc(42 * var(--u));font-weight:700;letter-spacing:calc(-1.2 * var(--u));line-height:1.12}.heading p{font-size:calc(18 * var(--u));color:var(--muted);margin-top:calc(3 * var(--u))}.date-card{border:1px solid #006491;border-radius:calc(9 * var(--u));display:flex;align-items:center;padding:calc(12 * var(--u)) calc(16 * var(--u));gap:calc(17 * var(--u));font-size:calc(14 * var(--u));height:calc(62 * var(--u));width:calc(433 * var(--u));margin-top:calc(-11 * var(--u))}.date-card small{display:block;margin-top:calc(3 * var(--u))}.date-card .icon{width:calc(22 * var(--u))}.clock{display:flex;align-items:center;gap:calc(17 * var(--u));margin-left:auto;padding-left:calc(28 * var(--u));border-left:1px solid var(--line);height:calc(33 * var(--u));font-weight:700;white-space:nowrap}
.card{border:1px solid #00b9eb;border-radius:calc(10 * var(--u));background:linear-gradient(120deg,#001323,#001c3055);overflow:hidden;min-width:0}.kpis{display:grid;grid-template-columns:1.5fr .92fr 1fr .98fr 1.02fr 1.07fr;gap:calc(10 * var(--u));margin-bottom:calc(13 * var(--u))}.kpi{height:calc(171 * var(--u));padding:calc(19 * var(--u)) calc(18 * var(--u))}.kpi h2{display:flex;align-items:center;gap:calc(20 * var(--u));font-size:calc(15 * var(--u));font-weight:600;white-space:nowrap}.value{font-size:calc(35 * var(--u));line-height:1.15;font-weight:700;margin:calc(13 * var(--u)) 0 calc(12 * var(--u)) calc(7 * var(--u))}.change{color:var(--green);font-weight:600;margin-left:calc(6 * var(--u))}.change b{font-size:calc(23 * var(--u));margin-right:calc(9 * var(--u))}.negative{color:var(--red)!important}.comparison{display:block;margin:calc(2 * var(--u)) 0 0 calc(31 * var(--u))}.extension{padding:calc(16 * var(--u)) calc(15 * var(--u)) calc(13 * var(--u))}.extension h2{gap:calc(20 * var(--u));font-size:calc(17 * var(--u))}.extension .icon{width:calc(26 * var(--u));height:calc(31 * var(--u))}.extension-row{display:flex;align-items:center;justify-content:space-between;padding-left:calc(46 * var(--u));margin:calc(5 * var(--u)) 0}.extension-row strong{font-size:calc(29 * var(--u))}.extension-row small{white-space:nowrap}.info-symbol{color:var(--cyan);font-size:calc(18 * var(--u))}progress{display:block;width:100%;height:calc(14 * var(--u));appearance:none;border:0;border-radius:20px;overflow:hidden;background:#304861}progress::-webkit-progress-bar{background:#304861}progress::-webkit-progress-value{background:linear-gradient(#36e3f6,#00bce8);border-radius:20px}.primary{display:flex;justify-content:center;align-items:center;gap:calc(10 * var(--u));background:linear-gradient(#2bdef3,#00b8e6);color:#00111e;border:1px solid #00cfff;border-radius:calc(7 * var(--u));font-weight:600;font-size:calc(13 * var(--u));height:calc(40 * var(--u));width:100%;margin-top:calc(12 * var(--u))}.plus{font-size:calc(18 * var(--u));line-height:1}
.middle{display:grid;grid-template-columns:minmax(0,2.735fr) minmax(0,1fr);gap:calc(14 * var(--u));height:calc(381 * var(--u));margin-bottom:calc(12 * var(--u))}.panel-head{display:flex;align-items:center;gap:calc(17 * var(--u));height:calc(50 * var(--u));padding:0 calc(17 * var(--u));background:linear-gradient(90deg,transparent,#00365330)}.panel-head h2{font-size:calc(17 * var(--u));font-weight:650}.panel-head .chev{margin-left:auto}.panel-head button.chev{padding:0}.traffic{padding:0 calc(15 * var(--u))}.traffic .panel-head{height:calc(60 * var(--u));padding:0;gap:calc(21 * var(--u))}.traffic .panel-head .icon{width:calc(33 * var(--u));height:calc(33 * var(--u))}.traffic h2{font-size:calc(19 * var(--u))}.traffic .panel-head small{display:block;font-size:calc(13 * var(--u));margin-top:calc(3 * var(--u))}.period{margin-left:auto;display:flex;align-items:center;border:1px solid #007aa7;border-radius:calc(8 * var(--u));padding:calc(5 * var(--u)) calc(10 * var(--u));height:calc(38 * var(--u));gap:calc(10 * var(--u));background:#00243e}.period .icon{width:calc(20 * var(--u))!important}.period select{background:transparent;border:0;font-size:calc(12 * var(--u));width:calc(114 * var(--u))}.period option{background:#001323}.summary{height:calc(94 * var(--u));border:1px solid #005375;border-radius:calc(8 * var(--u));display:grid;grid-template-columns:1fr .94fr 1.15fr 1.22fr;align-items:center}.summary>div{padding-left:calc(23 * var(--u));position:relative}.summary>div+div:before{content:'';position:absolute;left:0;top:calc(10 * var(--u));height:calc(47 * var(--u));border-left:1px solid #067ba8}.summary label{display:block;font-size:calc(11 * var(--u));font-weight:650;color:#83ccff;letter-spacing:calc(.8 * var(--u))}.summary strong{display:block;font-size:calc(26 * var(--u));margin:calc(6 * var(--u)) 0 calc(2 * var(--u))}.summary small{font-size:calc(12 * var(--u))}.legend{height:calc(36 * var(--u));display:flex;justify-content:flex-end;align-items:center;gap:calc(25 * var(--u));font-size:calc(10 * var(--u));padding-right:calc(5 * var(--u))}.legend span{display:flex;gap:calc(8 * var(--u));align-items:center}.legend .dot{width:calc(10 * var(--u));height:calc(10 * var(--u))}.blue{background:var(--blue)}.red{background:var(--red)}.traffic-chart{display:block;width:100%;height:calc(179 * var(--u));overflow:visible}.traffic-chart text{font-family:Inter,sans-serif;fill:#d3e4f5;font-size:12px}.side-cards{display:grid;grid-template-rows:244fr 128fr;gap:calc(10 * var(--u))}.capacity-body{height:calc(129 * var(--u));display:flex;align-items:center;padding:0 calc(22 * var(--u));gap:calc(23 * var(--u))}.donut{width:calc(124 * var(--u));height:calc(124 * var(--u));position:relative;flex-shrink:0}.donut svg{width:100%;height:100%;transform:rotate(-90deg)}.donut-label{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;font-size:calc(23 * var(--u));font-weight:600}.donut-label small{font-size:calc(14 * var(--u));margin-top:calc(3 * var(--u))}.capacity-legend{display:grid;gap:calc(16 * var(--u));font-size:calc(13 * var(--u))}.capacity-legend div{display:flex;align-items:center;gap:calc(13 * var(--u));white-space:nowrap}.capacity-legend small{font-size:calc(12 * var(--u))}.cyan{background:var(--cyan)}.available{background:#76a4d5}.limit{background:#304f70}.capacity-note{display:flex;gap:calc(14 * var(--u));margin:0 calc(15 * var(--u));padding:calc(8 * var(--u)) calc(13 * var(--u));border:1px solid #00b8ee;border-radius:calc(8 * var(--u));background:#002e4c70;color:var(--muted);font-size:calc(13 * var(--u));line-height:1.45}.capacity-note .icon{width:calc(20 * var(--u));height:calc(23 * var(--u))}.live .panel-head{height:calc(42 * var(--u))}.live-status{margin-left:auto;font-size:calc(12 * var(--u));display:flex;gap:calc(9 * var(--u));align-items:center}.live .panel-head .chev{margin-left:calc(10 * var(--u))}.live .dot{width:calc(10 * var(--u));height:calc(10 * var(--u))}.live-main{display:flex;align-items:center;gap:calc(19 * var(--u));margin:0 calc(18 * var(--u));height:calc(46 * var(--u));border-bottom:1px solid #093049}.live-main strong{font-size:calc(36 * var(--u))}.live-main span{font-size:calc(14 * var(--u));color:var(--muted);white-space:nowrap}.bars{display:flex;align-items:flex-end;gap:calc(4 * var(--u));height:calc(30 * var(--u));margin-left:auto}.bars i{width:calc(4 * var(--u));background:var(--cyan)}.live-counts{display:flex;justify-content:space-between;padding:calc(9 * var(--u)) calc(28 * var(--u));font-size:calc(14 * var(--u))}.live-counts span{display:flex;align-items:center;gap:calc(10 * var(--u))}.live-counts small{font-size:calc(11 * var(--u))}
.bottom{display:grid;grid-template-columns:1.19fr 1fr 1.57fr;gap:calc(11 * var(--u));height:calc(187 * var(--u))}.bottom .panel-head{height:calc(43 * var(--u))}.bottom .panel-head .icon{width:calc(23 * var(--u))}.route-status{display:grid;grid-template-columns:repeat(3,1fr);margin:calc(13 * var(--u)) calc(18 * var(--u)) calc(12 * var(--u));gap:calc(14 * var(--u))}.route-status>div{display:flex;gap:calc(13 * var(--u));align-items:flex-start;font-size:calc(11 * var(--u));border-right:1px solid #06314a}.route-status>div:last-child{border:0}.route-status .dot{margin-top:calc(6 * var(--u))}.route-status small{display:block;font-size:calc(11 * var(--u));margin-bottom:calc(3 * var(--u))}.route-path{display:flex;align-items:center;margin:0 calc(22 * var(--u));height:calc(53 * var(--u))}.route-node{width:calc(38 * var(--u));height:calc(38 * var(--u));display:grid;place-items:center;border:1px solid #00578a;border-radius:calc(12 * var(--u));flex-shrink:0}.route-node .icon{color:#87c9ff;width:calc(28 * var(--u));height:calc(28 * var(--u))}.route-node.avatar{width:calc(48 * var(--u));height:calc(48 * var(--u));border-radius:50%;border:1px solid var(--cyan);box-shadow:0 0 9px #00ddff70}.connection{flex:1;border-top:calc(3 * var(--u)) dotted var(--cyan);position:relative;margin:0 calc(7 * var(--u))}.connection .dot{position:absolute;left:45%;top:calc(-6 * var(--u));width:calc(9 * var(--u));height:calc(9 * var(--u))}.route-labels{display:flex;justify-content:space-between;margin:calc(-3 * var(--u)) calc(16 * var(--u)) 0;font-size:calc(10 * var(--u));color:var(--muted);text-align:center}.route-labels span:nth-child(2){color:#8be7ff;font-size:calc(9 * var(--u));letter-spacing:calc(1.2 * var(--u))}.route-labels em{font-style:normal;color:var(--cyan);letter-spacing:0}.performance-grid{display:grid;grid-template-columns:repeat(3,1fr);padding:calc(13 * var(--u)) calc(15 * var(--u));height:calc(141 * var(--u))}.performance-grid>div{padding:0 calc(7 * var(--u));border-right:1px solid #06405b;min-width:0}.performance-grid>div:last-child{border:0}.performance-grid label{display:block;font-size:calc(12 * var(--u))}.performance-grid strong{font-size:calc(20 * var(--u));display:block;margin:calc(4 * var(--u)) 0 calc(12 * var(--u))}.mini{width:100%;height:calc(52 * var(--u))}.mini text{fill:#bed5e9;font-size:10px}.activity table{border-collapse:collapse;width:calc(100% - 30 * var(--u));margin:0 calc(15 * var(--u));font-size:calc(10 * var(--u));white-space:nowrap}.activity th{text-align:left;color:var(--cyan);font-size:calc(9 * var(--u));letter-spacing:calc(1 * var(--u));font-weight:500;height:calc(20 * var(--u))}.activity td{height:calc(29 * var(--u));border-top:1px solid #0b2e43}.activity td:nth-child(2){display:flex;align-items:center;gap:calc(18 * var(--u))}.activity td .icon{width:calc(16 * var(--u));height:calc(16 * var(--u));color:#91ccff}.activity tr:first-child td .icon{color:var(--green)}.activity td:last-child{text-align:right;color:var(--muted)}.activity tr:first-child td:last-child,.activity tr:last-child td:last-child{color:#80f591}.activity th:first-child{width:20%}.activity th:nth-child(2){width:37%}dialog{background:#031a2c;color:var(--text);border:1px solid var(--cyan);border-radius:12px;max-width:430px;padding:26px;font-size:15px}dialog::backdrop{background:#000a}dialog h2{font-size:22px}dialog p{margin:16px 0;color:var(--muted);line-height:1.6}dialog button{padding:9px 24px;background:var(--cyan);color:#001323;border-radius:6px}
.avatar>svg{width:70%;height:70%}
@media(min-width:2100px){:root{--u:1.25px}}@media(max-width:1100px){:root{--u:.85px}.brand{width:26%}.status{margin-left:20px}.profile{gap:14px;padding-right:18px}.sidebar{width:180px;position:fixed}.nav-item{padding:0 12px;gap:12px}main{margin-left:180px;padding:20px}.heading{height:auto;gap:15px;margin-bottom:20px;flex-wrap:wrap}.date-card{margin:0}.kpis{grid-template-columns:repeat(3,1fr)}.middle{height:auto;grid-template-columns:1fr}.traffic{height:325px}.side-cards{grid-template-columns:1fr 1fr;grid-template-rows:208px}.bottom{height:auto;grid-template-columns:1fr 1fr}.bottom>.card{min-height:160px}.activity{grid-column:1/-1}.live-main{margin-top:28px}.live-counts{margin-top:15px}.tagline{left:22px}.capacity-body{justify-content:center}}
@media(max-width:650px){:root{--u:1px}.topbar{height:65px}.brand{width:180px;padding-left:16px;border:0}.brand img{width:160px}.customer,.status,.bell,.user>span:not(.avatar),.user>.chev{display:none}.profile{padding-right:12px}.sidebar{position:relative;top:auto;width:100%;height:auto;min-height:0;padding:8px;border-right:0;border-bottom:1px solid #00547b}.sidebar nav{display:flex;overflow:auto;gap:8px}.nav-item{width:auto;height:40px;margin:0;font-size:12px;padding:0 12px;gap:8px}.nav-item .icon{width:19px}.tagline{display:none}main{margin:0;padding:18px 12px}h1{font-size:30px}.heading p{font-size:14px}.date-card{width:100%;font-size:11px;gap:10px;padding:10px;height:54px}.clock{padding-left:12px;gap:8px;font-size:11px}.date-card small{font-size:10px}.kpis{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.kpi{padding:14px 10px;height:160px}.kpi h2{gap:10px;font-size:13px}.extension h2{font-size:13px}.extension-row{padding:0;gap:4px;margin:9px 0}.extension-row strong{font-size:25px}.extension-row small{font-size:9px}.primary{font-size:11px}.value{font-size:30px}.comparison{font-size:10px;margin-left:25px}.middle{gap:10px}.traffic{height:auto;padding:0 10px}.traffic .panel-head{height:80px;gap:9px}.traffic .panel-head .icon{width:23px;height:23px}.traffic h2{font-size:16px}.traffic .panel-head small{font-size:10px;max-width:165px}.period{padding:5px;gap:2px}.period select{width:91px;font-size:10px}.period .icon{display:none}.summary{grid-template-columns:1fr 1fr;height:155px}.summary>div{padding-left:12px}.summary label{font-size:9px}.summary strong{font-size:22px}.summary small{font-size:10px}.summary>div:nth-child(3):before{display:none}.legend{font-size:9px;gap:16px}.traffic-chart{height:150px}.side-cards{grid-template-columns:1fr;grid-template-rows:244px 128px}.live-main{margin-top:0}.live-counts{margin-top:0}.bottom{grid-template-columns:1fr;gap:10px}.bottom>.card{min-height:187px}.activity{grid-column:auto;overflow:auto}.activity table{min-width:510px}.performance-grid{padding-top:13px}.route-status{gap:8px}.route-status>div{gap:7px}}
.heading>div:first-child{transform:translateY(calc(-6 * var(--u)))}.summary>div+div{padding-left:calc(45 * var(--u))}.nav-item{margin-bottom:calc(9 * var(--u))}@media(max-width:650px){.summary>div+div{padding-left:12px}.nav-item{margin-bottom:0}.heading>div:first-child{transform:none}}
@media(max-width:650px){.extension{padding:10px}.extension h2 .icon{height:24px}.extension-row{margin:6px 0}.traffic-chart text{font-size:21px}.traffic-chart>text:nth-of-type(even){visibility:hidden}}