.ui{color:#1a2233;background:#fff;width:100%;height:100%;font-family:system-ui,sans-serif;font-size:8px;line-height:1.3;display:flex;overflow:hidden}.ui-col{flex-direction:column}.ui-side{background:#13203d;flex-direction:column;gap:4px;width:22%;padding:6px 5px;display:flex}.ui-side i{background:#ffffff2e;border-radius:3px;height:.75em;display:block}.ui-side i.on{background:var(--uiac,#2f6bff)}.ui-main{flex-direction:column;flex:1;gap:.6em;min-width:0;padding:.9em;display:flex}.ui-top{justify-content:space-between;align-items:center;font-size:1.12em;font-weight:700;display:flex}.ui-kpis{grid-template-columns:repeat(3,minmax(0,1fr));gap:4px;display:grid}.ui-kpis div{border:1px solid #e6eaf2;border-radius:4px;padding:4px}.ui-kpis b{font-size:1.25em;display:block}.ui-bars{border:1px solid #e6eaf2;border-radius:4px;flex:1;align-items:flex-end;gap:3px;min-height:30px;padding:4px;display:flex}.ui-bars span{background:var(--uiac,#2f6bff);opacity:.85;border-radius:2px 2px 0 0;flex:1}.ui-rows{flex-direction:column;gap:3px;display:flex}.ui-rows div{border-bottom:1px solid #eef1f6;justify-content:space-between;gap:4px;padding-bottom:2px;display:flex}.ui-hr{background:#e6eaf2;height:1px}.ui-total{justify-content:space-between;font-size:1.25em;font-weight:800;display:flex}.ui-barcode{background:repeating-linear-gradient(90deg,#1a2233 0 1px,#0000 1px 3px);height:1.8em;margin-top:auto}.ui-head{color:#fff;padding:6px;font-size:1.12em;font-weight:700}.ui-printbtn{color:#fff;text-align:center;background:#13203d;border-radius:4px;padding:5px;font-weight:700}.ui-step{align-items:center;gap:5px;display:flex}.ui .dot{background:#d5dae5;border-radius:50%;flex:none;width:1em;height:1em}.ui .dot.now{width:1.3em;height:1.3em}.ui-route{border:1px solid #e6eaf2;border-radius:4px;align-items:center;gap:.4em;padding:.5em;display:flex}.ui-route .seg-line{background:#d5dae5;flex:1;height:2px}.ui .ok{color:#0e8a5f;font-weight:700}.ui .wait{color:#c2410c;font-weight:700}.laptop{width:100%;position:relative}.laptop .lid{background:linear-gradient(#2e333f,#121419);border-radius:14px 14px 0 0;padding:9px 9px 0;position:relative;box-shadow:inset 0 0 0 1px #ffffff0f}.laptop .lid:before{content:"";background:#3a4050;border-radius:50%;width:4px;height:4px;margin-left:-2px;position:absolute;top:3px;left:50%}.laptop .scr{aspect-ratio:16/10;border-radius:4px 4px 0 0;position:relative;overflow:hidden}.laptop .base{background:linear-gradient(#e4e7ec,#a9afba);border-radius:0 0 16px 16px;height:14px;margin:0 -8%;position:relative;box-shadow:0 18px 30px #00000040}.laptop .base:before{content:"";background:#b8bec8;border-radius:0 0 6px 6px;height:5px;position:absolute;top:0;left:42%;right:42%}.laptop .scr:after,.tablet .scr:after,.phone .scr:after{content:"";pointer-events:none;background:linear-gradient(118deg,#ffffff38,#fff0 38%);position:absolute;inset:0}.phone{background:#1b1f2a;border-radius:18px;padding:5px;box-shadow:0 18px 40px #00000040}.phone .scr{aspect-ratio:9/18;border-radius:13px;position:relative;overflow:hidden}.tablet{background:#1b1f2a;border-radius:14px;padding:6px}.tablet .scr{aspect-ratio:4/3;border-radius:8px;position:relative;overflow:hidden}