:root{--navy:#0f1b2d;--navy2:#17283f;--bg:#eff2f6;--card:#fff;--ink:#14213a;--mut:#5b6a82;--line:#e2e8f0;--teal:#0d7a85;--teal2:#14a3ae;--tint:#e3f4f5;--amber:#e0a02a;--ok:#177f55;--okt:#e2f5ec;--wn:#a96a00;--wnt:#fdf1d9;--dg:#b7382f;--e:cubic-bezier(.22,1,.36,1)}*{box-sizing:border-box;margin:0;padding:0}html,body{width:1440px;height:900px;overflow:hidden;background:var(--bg);color:var(--ink);font:14px/1.4 system-ui,-apple-system,"Segoe UI",Roboto,sans-serif}svg{display:block}.defs{position:absolute}.app{display:grid;grid-template-columns:240px 1200px;height:900px}.side{background:linear-gradient(180deg,var(--navy),var(--navy2));color:#c9d4e6;padding:22px 16px;display:flex;flex-direction:column;gap:6px}.brand{display:flex;gap:12px;align-items:center;padding:2px 8px 22px}.brand b{display:block;color:#fff;font-size:18px;letter-spacing:.2px}.brand i{font-style:normal;font-size:12px;color:#8fa2c0}.logo{width:38px;height:38px;border-radius:11px;background:linear-gradient(135deg,var(--amber),#f1c35c);display:grid;place-items:center}.logo svg{width:22px;height:22px;stroke:var(--navy);fill:none;stroke-width:2;stroke-linejoin:round;stroke-linecap:round}nav{display:flex;flex-direction:column;gap:4px}nav a{display:flex;align-items:center;gap:12px;padding:11px 12px;border-radius:10px;font-weight:500;position:relative}nav a svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}nav a.on{background:rgba(255,255,255,.09);color:#fff}nav a.on:before{content:"";position:absolute;left:-16px;top:9px;bottom:9px;width:4px;border-radius:0 4px 4px 0;background:var(--amber)}nav em{margin-left:auto;font-style:normal;font-size:12px;color:#8fa2c0}nav em.am{background:var(--amber);color:var(--navy);padding:1px 8px;border-radius:99px;font-weight:700}.depot{margin-top:auto;background:rgba(255,255,255,.06);border-radius:12px;padding:14px;display:flex;flex-direction:column;gap:2px}.depot small{color:#8fa2c0;font-size:11px;text-transform:uppercase;letter-spacing:.8px}.depot b{color:#fff;font-size:16px}.depot span{font-size:12px;color:#9fb0cb}.me{display:flex;gap:10px;align-items:center;padding:14px 6px 2px}.me b{display:block;color:#fff;font-size:13px}.me i{font-style:normal;font-size:12px;color:#8fa2c0}.av{width:34px;height:34px;border-radius:50%;background:var(--teal);color:#fff;display:grid;place-items:center;font-weight:700;font-size:12px}.main{height:900px;display:flex;flex-direction:column;overflow:hidden}.top{height:68px;flex:none;background:#fff;border-bottom:1px solid var(--line);display:flex;align-items:center;gap:20px;padding:0 28px}.search{display:flex;align-items:center;gap:10px;width:380px;height:40px;padding:0 14px;border:1px solid var(--line);border-radius:10px;background:var(--bg);color:var(--mut)}.search svg,.bell svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round}.live{margin-left:auto;display:flex;align-items:center;gap:8px;color:var(--mut);font-size:13px}.dot{width:9px;height:9px;border-radius:50%;background:#22b573;box-shadow:0 0 0 4px #d5f2e4}.bell{position:relative;width:40px;height:40px;border:1px solid var(--line);border-radius:10px;display:grid;place-items:center;color:var(--mut)}.bell i{position:absolute;top:9px;right:10px;width:8px;height:8px;border-radius:50%;background:var(--dg);border:2px solid #fff}.view{flex:1;overflow:hidden;position:relative}.page{padding:26px 28px 26px;display:flex;flex-direction:column;gap:20px;will-change:transform}.head{display:flex;align-items:center;gap:16px}.head>div:first-child{margin-right:auto}h1{font-size:28px;letter-spacing:-.4px}.head p{color:var(--mut);margin-top:2px}.seg{display:flex;background:#fff;border:1px solid var(--line);border-radius:10px;padding:3px}.seg span{padding:6px 14px;border-radius:7px;color:var(--mut);font-weight:500}.seg .on{background:var(--navy);color:#fff}.btn{background:var(--teal);color:#fff;font-weight:600;padding:10px 18px;border-radius:10px}.btn.s{background:var(--tint);color:var(--teal);padding:7px 14px;font-size:13px}.card{background:var(--card);border:1px solid var(--line);border-radius:16px;padding:20px 22px;box-shadow:0 1px 2px rgba(20,33,58,.04),0 8px 24px -14px rgba(20,33,58,.18)}.kpis{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}.kpi{position:relative;height:128px;padding:16px 20px}.kpi h3{font-size:13px;font-weight:600;color:var(--mut)}.kpi p{display:flex;align-items:baseline;gap:8px;margin-top:6px}.kpi b{font-size:38px;line-height:1.1;letter-spacing:-1px;font-variant-numeric:tabular-nums}.kpi small{color:var(--mut);font-size:13px}.kpi>svg{position:absolute;right:18px;bottom:16px;width:110px;height:34px}.kpi>svg path{fill:none;stroke:var(--teal2);stroke-width:2.5;stroke-linecap:round;stroke-dasharray:1}.chip{display:inline-block;font-size:12px;font-weight:600;padding:2px 9px;border-radius:99px;margin-top:2px}.chip.g{background:var(--okt);color:var(--ok)}.chip.a{background:var(--wnt);color:var(--wn)}.row2{display:grid;grid-template-columns:720px 404px;gap:20px}.ch{display:flex;align-items:flex-start;justify-content:space-between;margin-bottom:12px}h2{font-size:17px}.ch p{color:var(--mut);font-size:13px}.lg{display:flex;gap:16px;color:var(--mut);font-size:12px}.lg i{display:inline-block;width:10px;height:10px;border-radius:3px;margin-right:6px}.k1{background:var(--teal)}.k2{background:var(--amber)}.cs{width:100%;height:auto;overflow:visible;margin-top:10px}.gl path{stroke:var(--line);stroke-width:1;stroke-dasharray:4 4}.yl text,.xl text{font-size:12px;fill:var(--mut)}.yl text{text-anchor:end}.xl text{text-anchor:middle}.bar{fill:#9bd3d8;transform-box:fill-box;transform-origin:50% 100%}.bar.hi{fill:var(--teal)}.bar.lo{fill:#c9e7ea}.otl{fill:none;stroke:var(--amber);stroke-width:3;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:1}.pts circle{fill:#fff;stroke:var(--amber);stroke-width:2.5;transform-box:fill-box;transform-origin:center}.tip{transform-box:fill-box;transform-origin:50% 100%}.tip rect,.tip path{fill:var(--navy)}.tip text{fill:#fff;font-size:12px;font-weight:700;text-anchor:middle}.tip .s{font-weight:400;fill:#aebbd2;font-size:11px}.ms{width:100%;height:auto;border-radius:10px}.mbg{fill:#e8eff3}.river{fill:#cfe3ee}.rd path{fill:none;stroke:#fff;stroke-width:7}.rd .mj{stroke:#f7e3b0;stroke-width:9}.rt path{fill:none;stroke:var(--teal);stroke-width:3.5;stroke-linecap:round;stroke-dasharray:1}.rt .r2{stroke:var(--teal2)}.rt .r3{stroke:var(--navy2)}.dp rect{fill:var(--navy)}.dp text{fill:#fff;font-size:12px;font-weight:700;text-anchor:middle}.pin circle{fill:var(--teal);stroke:#fff;stroke-width:3;transform-box:fill-box;transform-origin:center}.pin .w{fill:var(--amber)}.mk{display:flex;gap:14px;margin-top:12px;font-size:12px;color:var(--mut)}.mk i{display:inline-block;width:9px;height:9px;border-radius:50%;margin-right:6px;background:var(--teal)}.mk i.w{background:var(--amber)}.mk i.d{background:#8a97ad}.queue{padding-bottom:12px}.tr{display:grid;grid-template-columns:70px 1.4fr 1.2fr 90px 70px 1.3fr 150px;gap:12px;align-items:center;height:50px;padding:0 10px;border-top:1px solid var(--line);position:relative}.tr span:first-child{font-weight:700;color:var(--teal)}.th{height:34px;border-top:0;color:var(--mut);font-size:12px;text-transform:uppercase;letter-spacing:.6px}.th span:first-child{color:var(--mut);font-weight:600}.pb{height:8px;border-radius:9px;background:var(--line);overflow:hidden}.pb i{display:block;height:100%;background:var(--teal);border-radius:9px;transform-origin:0 50%}.p72{width:72%}.p48{width:48%}.p35{width:35%;background:var(--amber)!important}.p8{width:8%}.st{font-style:normal;font-size:12px;font-weight:700;padding:3px 11px;border-radius:99px;background:var(--bg);color:var(--mut);display:inline-block}.st.g{background:var(--okt);color:var(--ok)}.st.w{background:var(--wnt);color:var(--wn)}.st.d{background:var(--tint);color:var(--teal)}.hlb{position:absolute;inset:3px 0;background:var(--wnt);border-left:4px solid var(--amber);border-radius:8px;opacity:.7;z-index:0}.hl>span:not(.hlb){position:relative;z-index:1}.hlb+span{font-weight:700;color:var(--teal)}.row3{display:grid;grid-template-columns:1fr 1fr 1fr;gap:20px}.bl{list-style:none;display:flex;flex-direction:column;gap:14px;margin-top:6px}.bl li{display:grid;grid-template-columns:1fr auto;row-gap:6px;font-size:13px}.bl em{font-style:normal;color:var(--mut);font-size:12px}.bl b{grid-column:1/3;height:8px;border-radius:9px;background:var(--line);overflow:hidden;display:block}.bl b i{display:block;height:100%;background:var(--amber);border-radius:9px;transform-origin:0 50%}.bl.f b i{background:var(--teal)}.p90{width:90%}.p70{width:70%}.p45{width:45%}.p30{width:30%}.p82{width:82%}.p77{width:77%}.dn .dw{position:relative;width:136px;height:136px;margin:4px auto 0}.dw svg{width:136px;height:136px}.dw circle{fill:none;stroke-width:12}.tk{stroke:var(--line)}.arc{stroke:var(--teal);stroke-linecap:round;stroke-dasharray:1;stroke-dashoffset:.28}.dw p{position:absolute;inset:0;display:grid;place-content:center;text-align:center}.dw b{font-size:28px;letter-spacing:-.5px}.dw small{color:var(--mut);font-size:12px}.dn .mk{justify-content:center}.row4{display:grid;grid-template-columns:1fr 520px;gap:20px}.al,.ac{list-style:none;display:flex;flex-direction:column}.al li{display:flex;align-items:center;gap:14px;padding:13px 0;border-top:1px solid var(--line)}.al b{display:block;font-size:14px}.al span{color:var(--mut);font-size:13px}.al div{flex:1}.sv{width:10px;height:10px;border-radius:50%;background:var(--amber);flex:none}.sv.d{background:var(--dg)}.al em{font-style:normal;font-weight:600;font-size:12px;color:var(--teal);border:1px solid var(--tint);background:var(--tint);padding:5px 12px;border-radius:8px}.ac li{display:flex;align-items:center;gap:12px;padding:12px 0;border-top:1px solid var(--line);font-size:13px}.ac i{width:8px;height:8px;border-radius:50%;background:var(--teal2);flex:none}.ac span{flex:1;color:var(--mut)}.ac b{color:var(--ink)}.ac em{font-style:normal;color:var(--mut);font-size:12px}.foot{text-align:center;color:var(--mut);font-size:12px;padding-top:4px}html.is-done .page{transform:translateY(-880px)}@media (prefers-reduced-motion:no-preference){html.is-playing .t:not(.on){opacity:0}html.is-playing .sc1 .page{}html.is-playing.sc1 .page{transform:translateY(-440px);transition:transform 780ms cubic-bezier(.65,0,.35,1)}html.is-playing.sc2 .page{transform:translateY(-880px);transition:transform 780ms cubic-bezier(.65,0,.35,1)}html.is-playing .rise.on{animation:rise 440ms var(--e) both}html.is-playing .slide.on{animation:slide 440ms var(--e) both}html.is-playing .fade.on{animation:fade 400ms ease-out both}html.is-playing .growy.on{animation:growy 440ms var(--e) both}html.is-playing .growx.on{animation:growx 440ms var(--e) both;transform-origin:0 50%}html.is-playing .pop.on{animation:pop 400ms cubic-bezier(.34,1.56,.64,1) both}html.is-playing .draw.on{animation:draw 700ms cubic-bezier(.45,0,.2,1) both}html.is-playing .t.on:nth-child(2){animation-delay:60ms}html.is-playing .t.on:nth-child(3){animation-delay:120ms}html.is-playing .t.on:nth-child(4){animation-delay:180ms}html.is-playing .t.on:nth-child(5){animation-delay:240ms}html.is-playing .t.on:nth-child(6){animation-delay:300ms}html.is-playing .t.on:nth-child(7){animation-delay:340ms}html.is-playing .t.on.draw,html.is-playing .t.on.hlb,html.is-playing .t.on.side,html.is-playing .t.on.top{animation-delay:0ms}html.is-playing .kpi.on .draw.on{animation-delay:120ms;animation-duration:640ms}html.is-playing .arc.on{animation-duration:760ms}html.is-playing .st.on{animation-delay:120ms}}@keyframes rise{from{opacity:0;translate:0 16px}}@keyframes slide{from{opacity:0;translate:-18px 0}}@keyframes fade{from{opacity:0}}@keyframes growy{from{scale:1 0}}@keyframes growx{from{scale:0 1}}@keyframes pop{from{opacity:0;scale:.4}}@keyframes draw{from{stroke-dashoffset:1}}