/* ============================================================
   燕达城乡智慧出行服务平台 · 界面样式
   手机端 440×956（iPhone 17 Pro Max） / 后台 1920×1080
   ============================================================ */
:root{
  --pri:#0B5CAD; --pri-d:#084a8c; --pri-l:#EAF2FC;
  --green:#12805C; --green-l:#E8F5F0;
  --orange:#C46A0A; --orange-l:#FDF2E4;
  --red:#C0392B; --red-l:#FBECEA;
  --ink:#1A1F26; --ink2:#4A5563; --ink3:#7A8794; --ink4:#A6B0BB;
  --line:#E6EAEF; --line2:#EFF2F5; --bg:#F4F6F9; --card:#FFFFFF;
  --shadow:0 1px 3px rgba(16,30,48,.06),0 6px 18px rgba(16,30,48,.05);
  --radius:14px;
  --f:-apple-system,BlinkMacSystemFont,"PingFang SC","Hiragino Sans GB","Microsoft YaHei",sans-serif;
}
*{margin:0;padding:0;box-sizing:border-box;-webkit-tap-highlight-color:transparent}
html,body{background:#EDEFF3;font-family:var(--f);color:var(--ink);-webkit-font-smoothing:antialiased}
a{color:inherit;text-decoration:none}
button{font-family:var(--f);border:none;background:none;cursor:pointer;color:inherit}
svg{display:block}
ul,li{list-style:none}
input,select,textarea{font-family:var(--f);outline:none}
.hide{display:none!important}

/* ---------- 手机外框 ---------- */
.stage{min-height:100vh;display:flex;align-items:flex-start;justify-content:center;padding:28px 20px 40px;gap:36px}
.device{position:relative;width:464px;height:980px;background:#12151A;border-radius:66px;
  box-shadow:0 28px 70px rgba(10,20,35,.28),0 2px 6px rgba(0,0,0,.3),inset 0 0 0 1.5px #3A4048;
  transform-origin:top center;flex:0 0 auto}
.device:before{content:"";position:absolute;inset:8px;border-radius:58px;background:#000}
.screen{position:absolute;inset:12px;border-radius:55px;overflow:hidden;background:var(--bg);display:flex;flex-direction:column}
/* 侧键 */
.device:after{content:"";position:absolute;right:-3px;top:250px;width:3px;height:96px;background:#2A2F36;border-radius:0 2px 2px 0}
.side-l{position:absolute;left:-3px;top:176px;width:3px;height:62px;background:#2A2F36;border-radius:2px 0 0 2px}
.side-l2{position:absolute;left:-3px;top:252px;width:3px;height:62px;background:#2A2F36;border-radius:2px 0 0 2px}

/* 状态栏 / 灵动岛 */
.statusbar{height:56px;display:flex;align-items:flex-end;justify-content:space-between;
  padding:0 30px 8px;font-size:15px;font-weight:600;letter-spacing:.2px;flex:0 0 auto;position:relative;z-index:20;color:var(--ink)}
.statusbar.light{color:#fff}
.island{position:absolute;left:50%;top:11px;transform:translateX(-50%);width:118px;height:34px;background:#000;border-radius:20px;z-index:21}
.statusbar .sb-r{display:flex;align-items:center;gap:6px}
.statusbar .sig{display:flex;align-items:flex-end;gap:2px;height:11px}
.statusbar .sig i{width:3px;background:currentColor;border-radius:1px;display:block}
.statusbar .sig i:nth-child(1){height:4px}.statusbar .sig i:nth-child(2){height:6px}
.statusbar .sig i:nth-child(3){height:8px}.statusbar .sig i:nth-child(4){height:11px}
.batt{width:25px;height:12px;border:1.4px solid currentColor;border-radius:3.5px;position:relative;opacity:.9}
.batt:after{content:"";position:absolute;right:-4px;top:3px;width:2px;height:5px;background:currentColor;border-radius:0 1px 1px 0}
.batt i{position:absolute;left:1.5px;top:1.5px;bottom:1.5px;width:72%;background:currentColor;border-radius:2px}

/* 导航栏 */
.navbar{height:44px;display:flex;align-items:center;padding:0 12px;flex:0 0 auto;position:relative;z-index:19}
.navbar .nav-title{position:absolute;left:0;right:0;text-align:center;font-size:17px;font-weight:600;pointer-events:none}
.navbar .back{width:36px;height:36px;display:flex;align-items:center;justify-content:center;border-radius:50%}
.navbar .capsule{margin-left:auto;display:flex;align-items:center;height:32px;border:1px solid rgba(0,0,0,.09);
  border-radius:16px;background:rgba(255,255,255,.62);backdrop-filter:blur(8px);overflow:hidden}
.navbar .capsule .c1{width:44px;height:32px;display:flex;align-items:center;justify-content:center}
.navbar .capsule .c2{width:40px;height:32px;display:flex;align-items:center;justify-content:center;border-left:1px solid rgba(0,0,0,.09)}
.navbar.dark .capsule{background:rgba(0,0,0,.24);border-color:rgba(255,255,255,.22)}
.navbar.dark,.navbar.dark .nav-title{color:#fff}

.page{flex:1;overflow-y:auto;overflow-x:hidden;position:relative;-webkit-overflow-scrolling:touch}
.page::-webkit-scrollbar{width:0}
.pad{padding:0 16px}
.homebar{height:22px;flex:0 0 auto;display:flex;align-items:center;justify-content:center;background:transparent}
.homebar i{width:134px;height:5px;border-radius:3px;background:#101418;opacity:.85}

/* ---------- TabBar ---------- */
.tabbar{height:64px;flex:0 0 auto;background:#fff;border-top:1px solid var(--line);display:flex;padding-bottom:6px}
.tabbar .tab{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;
  font-size:10px;color:var(--ink3);position:relative}
.tabbar .tab.on{color:var(--pri)}
.tabbar .tab svg{width:23px;height:23px}
.tabbar .dot{position:absolute;top:7px;right:calc(50% - 20px);width:7px;height:7px;border-radius:50%;background:var(--red);border:1.5px solid #fff}

/* ---------- 通用 ---------- */
.card{background:var(--card);border-radius:var(--radius);box-shadow:var(--shadow)}
.sec{margin:0 16px 12px}
.sec-hd{display:flex;align-items:center;justify-content:space-between;padding:14px 2px 9px}
.sec-hd h3{font-size:16px;font-weight:600;letter-spacing:.2px}
.sec-hd .more{font-size:12px;color:var(--ink3);display:flex;align-items:center;gap:2px}
.btn{height:46px;border-radius:23px;background:var(--pri);color:#fff;font-size:16px;font-weight:600;
  display:flex;align-items:center;justify-content:center;gap:6px;width:100%;transition:.15s}
.btn:active{background:var(--pri-d)}
.btn.ghost{background:#fff;color:var(--pri);border:1px solid var(--pri)}
.btn.grey{background:#EDF0F4;color:var(--ink2)}
.btn:disabled{background:#D8DEE5;color:#fff}
.btn.sm{height:34px;border-radius:17px;font-size:13px;width:auto;padding:0 16px}
.tag{display:inline-flex;align-items:center;gap:3px;height:20px;padding:0 7px;border-radius:4px;font-size:11px;font-weight:500}
.tag.b{background:var(--pri-l);color:var(--pri)}
.tag.g{background:var(--green-l);color:var(--green)}
.tag.o{background:var(--orange-l);color:var(--orange)}
.tag.r{background:var(--red-l);color:var(--red)}
.tag.gy{background:#F0F2F5;color:var(--ink3)}
.divider{height:1px;background:var(--line2);margin:0 16px}
.muted{color:var(--ink3);font-size:12px}
.mono{font-family:"SF Mono",ui-monospace,Menlo,Consolas,monospace;letter-spacing:-.2px}

/* ---------- 首页 ---------- */
.hero{background:linear-gradient(172deg,#0B5CAD 0%,#0A5096 58%,#0A4C8E 100%);padding:2px 16px 46px;position:relative}
.hero:after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:26px;background:var(--bg);border-radius:22px 22px 0 0}
.hero-top{display:flex;align-items:center;gap:6px;color:#fff;font-size:14px;height:34px}
.hero-top .loc{display:flex;align-items:center;gap:3px;font-weight:500}
.hero-top .sp{flex:1}
.hero-top .ic{width:32px;height:32px;display:flex;align-items:center;justify-content:center;border-radius:50%;background:rgba(255,255,255,.14)}
.search{margin-top:12px;height:44px;border-radius:22px;background:#fff;display:flex;align-items:center;
  padding:0 15px;gap:8px;box-shadow:0 4px 14px rgba(6,40,80,.16)}
.search span{font-size:14px;color:var(--ink4)}
.search .go{margin-left:auto;font-size:12px;color:#fff;background:var(--pri);height:28px;padding:0 12px;border-radius:14px;display:flex;align-items:center}

.banner{margin:-34px 16px 0;border-radius:14px;overflow:hidden;position:relative;height:132px;box-shadow:var(--shadow);z-index:2}
.banner .slide{position:absolute;inset:0;opacity:0;transition:opacity .55s;display:flex;flex-direction:column;justify-content:center;padding:0 20px;color:#fff}
.banner .slide.on{opacity:1}
.banner .slide h4{font-size:19px;font-weight:600;letter-spacing:.3px;margin-bottom:5px}
.banner .slide p{font-size:12px;opacity:.86}
.banner .slide .bpill{margin-top:10px;align-self:flex-start;height:26px;padding:0 12px;border-radius:13px;
  background:rgba(255,255,255,.92);color:var(--ink);font-size:12px;font-weight:600;display:flex;align-items:center;gap:4px}
.banner .s1{background:linear-gradient(115deg,#0E5FAE,#1D7ED0 60%,#2E8FDB)}
.banner .s2{background:linear-gradient(115deg,#B4560C,#D97706 62%,#E8952A)}
.banner .s3{background:linear-gradient(115deg,#146B4E,#1B8A65 60%,#25A47A)}
.banner .s1:before,.banner .s2:before,.banner .s3:before{content:"";position:absolute;right:-30px;top:-30px;width:150px;height:150px;
  border-radius:50%;background:rgba(255,255,255,.09)}
.banner .dots{position:absolute;bottom:9px;right:13px;display:flex;gap:4px}
.banner .dots i{width:5px;height:5px;border-radius:3px;background:rgba(255,255,255,.45);transition:.3s}
.banner .dots i.on{width:14px;background:#fff}

.biz{display:grid;grid-template-columns:repeat(4,1fr);gap:4px;margin:16px 12px 0;background:#fff;border-radius:16px;box-shadow:var(--shadow);padding:14px 0 10px}
.biz a{display:flex;flex-direction:column;align-items:center;gap:9px;padding:6px 0 2px}
.biz .bi{width:62px;height:62px;border-radius:19px;display:flex;align-items:center;justify-content:center}
.biz .bi svg{width:34px;height:34px}
.biz span{font-size:13.5px;color:var(--ink);font-weight:600}
.biz .b1{background:#E9F1FC;color:#0B5CAD}
.biz .b2{background:#FDF1E3;color:#B9660A}
.biz .b3{background:#E9F5EF;color:#12805C}
.biz .b4{background:#EEF0FB;color:#3B4CA8}

.quick{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin:10px 12px 0;padding:16px 8px;background:#fff;border-radius:16px;box-shadow:var(--shadow)}
.quick a{display:flex;flex-direction:column;align-items:center;gap:8px;font-size:12.5px;color:var(--ink2);font-weight:500}
.quick .qi{width:46px;height:46px;border-radius:14px;background:#F5F7FA;display:flex;align-items:center;justify-content:center;color:var(--pri)}
.quick .qi svg{width:24px;height:24px}

/* 到站卡 */
.arrive{padding:14px 16px 12px}
.arrive .ah{display:flex;align-items:center;gap:8px}
.arrive .ln{font-size:16px;font-weight:600}
.arrive .dir{font-size:11.5px;color:var(--ink3);background:#F2F4F7;padding:2px 6px;border-radius:4px}
.arrive .eta{margin-left:auto;text-align:right}
.arrive .eta b{font-size:20px;color:var(--pri);font-weight:700;letter-spacing:-.3px}
.arrive .eta span{font-size:11px;color:var(--ink3);display:block;margin-top:-1px}
.arrive .busline{display:flex;align-items:center;gap:10px;margin-top:14px;position:relative;padding:0 6px}
.arrive .prog{flex:1;height:5px;border-radius:3px;background:#E9EDF2;position:relative;overflow:visible}
.arrive .prog i{position:absolute;left:0;top:0;bottom:0;background:var(--pri);border-radius:3px}
.arrive .prog .bus-emoji{position:absolute;top:50%;left:var(--bus,58%);transform:translate(-50%,-58%);font-size:15px;line-height:1;filter:drop-shadow(0 1px 1px rgba(11,92,173,.35))}
.arrive .pstop{font-size:11.5px;color:var(--ink2);font-weight:500;white-space:nowrap}
.arrive .foot{display:flex;align-items:center;gap:10px;margin-top:11px;padding-top:11px;border-top:1px solid var(--line2)}
.arrive .foot .car{font-size:12px;color:var(--ink2);display:flex;align-items:center;gap:5px}
.arrive .foot .plate{font-size:11px;color:var(--ink3);border:1px solid var(--line);padding:1px 5px;border-radius:3px}

.nearby{padding:6px 0 10px}
.nearby .row{display:flex;align-items:center;gap:14px;padding:13px 16px;border-bottom:1px solid var(--line2)}
.nearby .row:last-child{border-bottom:0}
.nearby .row>div:first-child{flex:1;min-width:0;display:flex;flex-direction:column;justify-content:center}
.nearby .row .nm{font-size:14px;font-weight:600;color:var(--ink);line-height:1.3}
.nearby .row .ds{font-size:11.5px;color:var(--ink3);margin-top:3px;line-height:1.3}
.nearby .row .rt{flex:0 0 76px;text-align:right;display:flex;flex-direction:column;align-items:flex-end;justify-content:center;gap:2px}
.nearby .row .rt b{color:var(--pri);font-size:17px;line-height:1.1}
.nearby .row .rt span{font-size:10.5px;color:var(--ink3);line-height:1.2}

.notice{margin:0 16px 10px;padding:11px 14px;background:#fff;border-radius:12px;display:flex;align-items:center;gap:9px;box-shadow:var(--shadow)}
.notice .ni{color:var(--orange);flex:0 0 auto}
.notice p{font-size:12px;color:var(--ink2);line-height:1.5;flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

/* ---------- 地图 ---------- */
.mapbox{position:relative;overflow:hidden;background:#E8EDF2}
.mapbox img.base{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;filter:saturate(.82) contrast(.97)}
.mapbox svg{position:absolute;inset:0;width:100%;height:100%}
.mapbox .mask-top{position:absolute;left:0;right:0;top:0;height:56px;background:linear-gradient(#fff,rgba(255,255,255,0));pointer-events:none}
.map-ctrl{position:absolute;right:10px;bottom:10px;display:flex;flex-direction:column;gap:6px}
.map-ctrl button{width:32px;height:32px;border-radius:8px;background:#fff;box-shadow:0 2px 8px rgba(0,0,0,.14);
  display:flex;align-items:center;justify-content:center;color:var(--ink2)}
.map-legend{position:absolute;left:10px;bottom:10px;background:rgba(255,255,255,.94);border-radius:8px;
  padding:6px 9px;font-size:10px;color:var(--ink2);display:flex;gap:10px;box-shadow:0 2px 8px rgba(0,0,0,.1)}
.map-legend i{display:inline-block;width:9px;height:9px;border-radius:50%;margin-right:3px;vertical-align:-1px}
.maptip{position:absolute;background:#fff;border-radius:8px;padding:5px 8px;font-size:10.5px;color:var(--ink);
  box-shadow:0 3px 10px rgba(0,0,0,.16);white-space:nowrap;transform:translate(-50%,-140%)}
.maptip b{color:var(--pri)}

/* ---------- 购票 ---------- */
.buyhead{background:#fff;padding:12px 16px 14px}
.lineno{display:flex;align-items:center;gap:9px}
.lineno .no{font-size:15px;font-weight:700;color:#fff;background:var(--pri);padding:3px 8px;border-radius:6px;letter-spacing:.3px}
.lineno .nm{font-size:17px;font-weight:600}
.lineno .st{margin-left:auto;font-size:11px;color:var(--green);background:var(--green-l);padding:3px 7px;border-radius:4px}
.routemap{height:236px;position:relative}
.stops-pick{margin:0 16px;background:#fff;border-radius:14px;box-shadow:var(--shadow);padding:2px 16px;position:relative;z-index:3;margin-top:-22px}
.pickrow{display:flex;align-items:center;height:56px;gap:12px}
.pickrow .dot{width:9px;height:9px;border-radius:50%;border:2.5px solid var(--pri);flex:0 0 auto}
.pickrow .dot.end{background:var(--pri)}
.pickrow .lb{font-size:11px;color:var(--ink3);width:28px}
.pickrow .val{font-size:17px;font-weight:600;flex:1}
.pickrow .val.ph{color:var(--ink4);font-weight:400}
.pickrow .arrow{margin-left:auto;color:var(--ink4)}
.swap{position:absolute;right:14px;top:50%;transform:translateY(-50%);width:34px;height:34px;border-radius:50%;
  background:#F5F7FA;display:flex;align-items:center;justify-content:center;color:var(--ink2)}
.pickrow.line2{border-top:1px solid var(--line2)}

.segbar{display:flex;gap:8px;overflow-x:auto;padding:12px 16px 4px}
.segbar::-webkit-scrollbar{height:0}
.segbar .sg{flex:0 0 auto;padding:8px 14px;border-radius:9px;background:#fff;border:1px solid var(--line);
  font-size:12.5px;color:var(--ink2);text-align:center;line-height:1.35}
.segbar .sg b{display:block;font-size:14px;color:var(--ink);font-weight:600}
.segbar .sg.on{border-color:var(--pri);background:var(--pri-l)}
.segbar .sg.on b{color:var(--pri)}
.segbar .sg.dis{opacity:.45}

.stoplist{background:#fff;border-radius:14px;margin:0 16px;overflow:hidden}
.stoplist .sl-hd{padding:11px 16px;font-size:11.5px;color:var(--ink3);background:#FAFBFC;display:flex;justify-content:space-between}
.stoplist .sl{max-height:300px;overflow-y:auto}
.stoplist .it{display:flex;align-items:center;gap:12px;padding:13px 16px;border-bottom:1px solid var(--line2)}
.stoplist .it:last-child{border-bottom:0}
.stoplist .it .idx{width:20px;font-size:11px;color:var(--ink4);text-align:center}
.stoplist .it .nm{font-size:14.5px}
.stoplist .it .pr{margin-left:auto;font-size:12px;color:var(--ink3)}
.stoplist .it.on{background:var(--pri-l)}
.stoplist .it.on .nm{color:var(--pri);font-weight:600}

.orderbox{margin:12px 16px;background:#fff;border-radius:14px;padding:4px 16px}
.orow{display:flex;align-items:center;height:42px;font-size:13px}
.orow .k{color:var(--ink3);width:76px}
.orow .v{flex:1;text-align:right;color:var(--ink)}
.orow .v.red{color:var(--red);font-weight:600}
.orow.total .v{color:var(--red);font-size:17px;font-weight:700}
.orow.total .k{color:var(--ink);font-weight:500}

.footbar{flex:0 0 auto;background:#fff;border-top:1px solid var(--line);padding:10px 16px 6px;display:flex;align-items:center;gap:12px}
.footbar .price{flex:1}
.footbar .price .p{font-size:24px;font-weight:700;color:var(--red);letter-spacing:-.5px}
.footbar .price .p small{font-size:13px;font-weight:500}
.footbar .price .d{font-size:11px;color:var(--ink3);margin-top:1px}
.footbar .btn{width:150px;height:46px}

/* ---------- 弹层 ---------- */
.mask{position:absolute;inset:0;background:rgba(12,18,26,.42);opacity:0;pointer-events:none;transition:.22s;z-index:60}
.mask.show{opacity:1;pointer-events:auto}
.sheet{position:absolute;left:0;right:0;bottom:0;background:#fff;border-radius:20px 20px 0 0;transform:translateY(102%);
  transition:.28s cubic-bezier(.32,.72,.36,1);z-index:61;max-height:86%;display:flex;flex-direction:column}
.sheet.show{transform:translateY(0)}
.sheet .sh-hd{display:flex;align-items:center;padding:16px 18px 10px;border-bottom:1px solid var(--line2)}
.sheet .sh-hd h4{font-size:16px;font-weight:600}
.sheet .sh-hd .cl{margin-left:auto;color:var(--ink3);font-size:22px;line-height:1}
.sheet .sh-bd{overflow-y:auto;padding-bottom:8px}
.sheet .sh-ft{padding:10px 16px 8px;border-top:1px solid var(--line2)}
.toast{position:absolute;left:50%;top:46%;transform:translate(-50%,-50%) scale(.96);background:rgba(22,28,36,.9);
  color:#fff;font-size:13px;padding:11px 18px;border-radius:9px;z-index:99;opacity:0;transition:.2s;max-width:75%;text-align:center;line-height:1.5}
.toast.show{opacity:1;transform:translate(-50%,-50%) scale(1)}

/* ---------- 电子票 ---------- */
.ticketwrap{padding:18px 16px}
.eticket{background:#fff;border-radius:16px;overflow:hidden;box-shadow:0 6px 24px rgba(16,30,48,.1)}
.etk-top{background:linear-gradient(135deg,#0B5CAD,#146FCB);color:#fff;padding:18px 20px 16px;position:relative}
.etk-top h4{font-size:18px;font-weight:600;letter-spacing:.4px}
.etk-top p{font-size:11.5px;opacity:.8;margin-top:3px}
.etk-top .stamp{position:absolute;right:18px;top:18px;border:1.5px solid rgba(255,255,255,.6);border-radius:6px;
  padding:3px 8px;font-size:11px;transform:rotate(-6deg);opacity:.9}
.etk-route{display:flex;align-items:flex-start;padding:18px 20px 6px;gap:10px}
.etk-route .pt{flex:1}
.etk-route .pt .t{font-size:10.5px;color:var(--ink3);margin-bottom:4px}
.etk-route .pt .n{font-size:20px;font-weight:700;letter-spacing:-.3px}
.etk-route .pt.r{text-align:right}
.etk-route .mid{width:66px;display:flex;flex-direction:column;align-items:center;padding-top:16px;color:var(--ink4)}
.etk-route .mid .l{width:100%;height:1px;background:repeating-linear-gradient(90deg,#CBD3DC 0 4px,transparent 4px 8px);position:relative}
.etk-route .mid .l:after{content:"";position:absolute;right:0;top:-3px;border-left:5px solid #CBD3DC;border-top:3.5px solid transparent;border-bottom:3.5px solid transparent}
.etk-info{display:grid;grid-template-columns:1fr 1fr;gap:12px 8px;padding:10px 20px 16px}
.etk-info .i .k{font-size:10.5px;color:var(--ink3);margin-bottom:2px}
.etk-info .i .v{font-size:13px;font-weight:500}
.qrzone{padding:14px 20px 20px;text-align:center;border-top:1px dashed #DDE3EA;position:relative}
.qrzone:before,.qrzone:after{content:"";position:absolute;top:-9px;width:18px;height:18px;border-radius:50%;background:var(--bg)}
.qrzone:before{left:-9px}.qrzone:after{right:-9px}
.qrzone .qr{width:168px;height:168px;margin:4px auto 8px;padding:8px;background:#fff;border:1px solid var(--line);border-radius:10px}
.qrzone .qr canvas{width:100%;height:100%}
.qrzone p{font-size:11px;color:var(--ink3)}
.qrzone .refresh{margin-top:8px;font-size:11.5px;color:var(--pri)}

/* ---------- 表单 ---------- */
.form{background:#fff;margin:12px 16px;border-radius:14px;overflow:hidden}
.frow{display:flex;align-items:center;min-height:52px;padding:0 16px;border-bottom:1px solid var(--line2);gap:10px}
.frow:last-child{border-bottom:0}
.frow .k{width:82px;font-size:14px;color:var(--ink2)}
.frow input{flex:1;border:0;font-size:15px;background:transparent}
.frow input::placeholder{color:var(--ink4)}
.frow .unit{font-size:12px;color:var(--ink3)}
.fhint{padding:8px 18px 0;font-size:11.5px;color:var(--ink3);line-height:1.6}

/* ---------- 适老版 ---------- */
.elder{background:#FFFDF7}
.elder .ebar{background:#0B5CAD;color:#fff;padding:14px 20px 22px}
.elder .ebar .hi{font-size:26px;font-weight:700;letter-spacing:.5px}
.elder .ebar .sub{font-size:17px;opacity:.9;margin-top:6px}
.elder .ebig{display:flex;flex-direction:column;gap:14px;padding:18px 18px 8px}
.elder .ebtn{height:96px;border-radius:16px;display:flex;align-items:center;gap:16px;padding:0 22px;
  font-size:26px;font-weight:700;color:#fff;box-shadow:0 4px 12px rgba(0,0,0,.12)}
.elder .ebtn svg{width:42px;height:42px;flex:0 0 auto}
.elder .ebtn.a{background:#0B5CAD}
.elder .ebtn.b{background:#12805C}
.elder .ebtn.c{background:#B4560C}
.elder .elist{margin:10px 18px;background:#fff;border:2px solid #E3DCCB;border-radius:14px;overflow:hidden}
.elder .elist .eh{padding:12px 18px;font-size:20px;font-weight:700;background:#FBF6E9;color:#6B5423;border-bottom:1px solid #E3DCCB}
.elder .eitem{display:flex;align-items:center;padding:16px 18px;border-bottom:1px solid #EFE9DA}
.elder .eitem:last-child{border-bottom:0}
.elder .eitem .nm{font-size:22px;font-weight:600;color:#20180A}
.elder .eitem .ds{font-size:16px;color:#7A6A4E;margin-top:4px}
.elder .eitem .eta{margin-left:auto;font-size:24px;font-weight:700;color:#B4560C}
.elder .etel{margin:12px 18px 20px;height:80px;border-radius:16px;background:#fff;border:2px solid #12805C;
  display:flex;align-items:center;justify-content:center;gap:12px;font-size:24px;font-weight:700;color:#12805C}

/* ---------- 司机端 ---------- */
.driver{background:#F4F6F8;color:#101418}
.driver .statusbar{color:#101418}
.dtop{background:#0B6B4C;padding:4px 18px 16px;position:relative}
.dtop .plate{font-size:13.5px;opacity:1;color:#fff;font-weight:600;letter-spacing:.5px}
.dtop .who{display:flex;align-items:center;gap:8px;margin-top:2px}
.dtop .who b{font-size:21px;font-weight:800;color:#fff}
.dtop .who .tno{margin-left:auto;font-size:14px;font-weight:700;background:#fff;color:#0B6B4C;padding:4px 12px;border-radius:14px}
.dtop .progline{margin-top:12px;height:10px;border-radius:5px;background:rgba(255,255,255,.35);overflow:hidden}
.dtop .progline i{display:block;height:100%;background:#FFD166;border-radius:5px}
.dtop .ptxt{display:flex;justify-content:space-between;font-size:13px;color:#fff;font-weight:600;margin-top:5px}
.dtop button#backcar{font-size:14px;font-weight:700;background:#fff;color:#0B6B4C;padding:6px 14px;border-radius:15px}

.dnext{margin:14px;background:#fff;color:#101418;border-radius:14px;padding:16px 18px 14px;position:relative;border:2.5px solid #101418;box-shadow:0 3px 0 #101418}
.dnext .lb{font-size:15px;color:#0B6B4C;font-weight:800;display:flex;align-items:center;gap:5px}
.dnext .stname{font-size:44px;font-weight:900;letter-spacing:-.5px;margin:6px 0 2px;line-height:1.12}
.dnext .sub{font-size:15px;color:#33414F;font-weight:600}
.dnext .dist{position:absolute;right:16px;top:18px;text-align:right}
.dnext .dist b{font-size:32px;color:#B4232A;font-weight:900}
.dnext .dist span{font-size:13px;color:#33414F;font-weight:700;display:block}

.dstats{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:0 14px}
.dstat{border-radius:14px;padding:14px 16px 14px;position:relative;overflow:hidden;border:2.5px solid #101418}
.dstat .k{font-size:16px;font-weight:800;display:flex;align-items:center;gap:6px}
.dstat .v{font-size:84px;font-weight:900;line-height:1;letter-spacing:-3px;margin-top:6px}
.dstat .u{font-size:18px;font-weight:800;margin-left:2px}
.dstat .s{font-size:13px;font-weight:700;margin-top:4px}
.dstat.up{background:#fff;color:#0A4C8F}
.dstat.up .v{color:#0A4C8F}
.dstat.up .k{color:#0A4C8F}
.dstat.up .s{color:#0A4C8F}
.dstat.down{background:#fff;color:#A33900}
.dstat.down .v{color:#A33900}
.dstat.down .k{color:#A33900}
.dstat.down .s{color:#A33900}

.dstops{margin:14px;background:#fff;border-radius:14px;overflow:hidden;border:2px solid #101418}
.dstops .dh{padding:10px 16px;font-size:14px;color:#33414F;font-weight:800;display:flex;justify-content:space-between;border-bottom:2px solid #101418}
.dstops .dr{display:flex;align-items:center;padding:9px 16px;border-bottom:1px solid #E3E8ED}
.dstops .dr:last-child{border-bottom:0}
.dstops .dr .ix{width:24px;font-size:14px;color:#6B7683;font-weight:700}
.dstops .dr .nm{font-size:17px;color:#101418;font-weight:600}
.dstops .dr.cur{background:#FFF6DE}
.dstops .dr.cur .nm{color:#101418;font-weight:800}
.dstops .dr .nums{margin-left:auto;display:flex;gap:10px;font-size:17px;font-weight:800}
.dstops .dr .up{color:#0A4C8F}
.dstops .dr .dn{color:#A33900}

.dops{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:0 14px 12px}
.dop{height:76px;border-radius:14px;display:flex;align-items:center;justify-content:center;gap:9px;
  font-size:19px;font-weight:800;background:#fff;color:#101418;border:2.5px solid #101418;box-shadow:0 3px 0 #101418;font-family:inherit}
.dop.pri{background:#0B6B4C;border-color:#0B4C36;color:#fff;box-shadow:0 3px 0 #0B4C36}
.dop.warn{background:#B4232A;border-color:#7E1418;color:#fff;box-shadow:0 3px 0 #7E1418}
.dop svg{width:26px;height:26px}

/* 出车页 */
.scanbox{margin:16px;border-radius:16px;overflow:hidden;background:#0A0E12;position:relative;height:330px}
.scanbox .frame{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:210px;height:210px}
.scanbox .frame i{position:absolute;width:30px;height:30px;border:3px solid #4ADE80}
.scanbox .frame i:nth-child(1){left:0;top:0;border-right:0;border-bottom:0;border-radius:6px 0 0 0}
.scanbox .frame i:nth-child(2){right:0;top:0;border-left:0;border-bottom:0;border-radius:0 6px 0 0}
.scanbox .frame i:nth-child(3){left:0;bottom:0;border-right:0;border-top:0;border-radius:0 0 0 6px}
.scanbox .frame i:nth-child(4){right:0;bottom:0;border-left:0;border-top:0;border-radius:0 0 6px 0}
.scanbox .laser{position:absolute;left:12px;right:12px;height:2px;background:linear-gradient(90deg,transparent,#4ADE80,transparent);animation:scan 2.2s ease-in-out infinite}
@keyframes scan{0%,100%{top:30px}50%{top:180px}}
.scanbox .hint{position:absolute;left:0;right:0;bottom:18px;text-align:center;font-size:13px;color:#C7D2DD}
.scanbox .veh{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);color:rgba(255,255,255,.12)}
.vehcard{margin:0 16px 14px;background:#fff;color:#101418;border-radius:14px;padding:16px}
.vehcard .vh{display:flex;align-items:center;gap:10px;padding-bottom:13px;border-bottom:1px solid #EDF0F3}
.vehcard .vh .ic{width:42px;height:42px;border-radius:11px;background:#E9F5EF;color:#0F7A56;display:flex;align-items:center;justify-content:center}
.vehcard .vh .pl{font-size:20px;font-weight:700;letter-spacing:.5px}
.vehcard .vh .md{font-size:11.5px;color:#7A8794;margin-top:2px}
.vehcard .vh .ok{margin-left:auto;font-size:11px;color:#0F7A56;background:#E9F5EF;padding:4px 8px;border-radius:5px}

/* ---------- 订单 / 个人中心 ---------- */
.otabs{display:flex;background:#fff;border-bottom:1px solid var(--line);padding:0 6px;position:sticky;top:0;z-index:5}
.otabs a{flex:1;text-align:center;padding:13px 0 11px;font-size:13.5px;color:var(--ink2);position:relative}
.otabs a.on{color:var(--pri);font-weight:600}
.otabs a.on:after{content:"";position:absolute;left:50%;transform:translateX(-50%);bottom:0;width:22px;height:2.5px;background:var(--pri);border-radius:2px}
.ocard{margin:12px 16px 0;background:#fff;border-radius:14px;padding:14px 16px}
.ocard .oh{display:flex;align-items:center;font-size:12px;color:var(--ink3);margin-bottom:10px}
.ocard .oh .st{margin-left:auto;font-weight:600}
.ocard .oh .st.g{color:var(--green)}.ocard .oh .st.o{color:var(--orange)}.ocard .oh .st.gy{color:var(--ink3)}
.ocard .ob{display:flex;align-items:center;gap:12px}
.ocard .ob .ln{font-size:16px;font-weight:600}
.ocard .ob .rt{font-size:12px;color:var(--ink3);margin-top:3px}
.ocard .ob .pr{margin-left:auto;text-align:right}
.ocard .ob .pr b{font-size:17px;color:var(--red)}
.ocard .of{display:flex;gap:8px;justify-content:flex-end;margin-top:12px;padding-top:11px;border-top:1px solid var(--line2)}

.profhead{background:linear-gradient(160deg,#0B5CAD,#0A4F94);padding:18px 18px 40px;color:#fff;display:flex;align-items:center;gap:14px}
.profhead .ava{width:58px;height:58px;border-radius:50%;background:rgba(255,255,255,.2);display:flex;align-items:center;justify-content:center;font-size:22px;font-weight:600}
.profhead .nm{font-size:19px;font-weight:600}
.profhead .id{font-size:12px;opacity:.82;margin-top:4px}
.profhead .vfy{margin-left:auto;font-size:11px;background:rgba(255,255,255,.18);padding:5px 9px;border-radius:14px}
.menu{background:#fff;margin:-26px 16px 0;border-radius:14px;overflow:hidden;box-shadow:var(--shadow)}
.mrow{display:flex;align-items:center;height:52px;padding:0 16px;border-bottom:1px solid var(--line2);gap:11px;font-size:14.5px}
.mrow:last-child{border-bottom:0}
.mrow .mi{width:22px;color:var(--ink3);display:flex;justify-content:center}
.mrow .ar{margin-left:auto;color:var(--ink4)}

/* ---------- 商城 ---------- */
.shop-hero{background:linear-gradient(135deg,#8A3D0E,#B4560C);padding:10px 16px 44px;color:#fff}
.shop-hero h3{font-size:18px;font-weight:600}
.shop-hero p{font-size:11.5px;opacity:.85;margin-top:3px}
.cats{display:grid;grid-template-columns:repeat(5,1fr);gap:6px;margin:-30px 12px 0;background:#fff;border-radius:14px;padding:14px 6px;box-shadow:var(--shadow);position:relative;z-index:2}
.cats a{display:flex;flex-direction:column;align-items:center;gap:6px;font-size:11px;color:var(--ink2)}
.cats .ci{width:40px;height:40px;border-radius:12px;display:flex;align-items:center;justify-content:center;font-size:19px}
.goods{display:grid;grid-template-columns:1fr 1fr;gap:11px;padding:12px 16px 0}
.gcard{background:#fff;border-radius:12px;overflow:hidden;box-shadow:var(--shadow)}
.gcard .im{height:132px;background:#F2F4F7;display:flex;align-items:center;justify-content:center;color:#B8C2CC}
.gcard .gb{padding:9px 10px 11px}
.gcard .gt{font-size:13.5px;line-height:1.35;height:37px;overflow:hidden}
.gcard .gs{font-size:10.5px;color:var(--ink3);margin-top:4px}
.gcard .gp{display:flex;align-items:baseline;margin-top:6px}
.gcard .gp b{font-size:17px;color:var(--red);font-weight:700}
.gcard .gp b small{font-size:11px;font-weight:500}
.gcard .gp .sl{margin-left:auto;font-size:10px;color:var(--ink3)}

/* ---------- 后台 ---------- */
.admin-body{background:#0F1419}
.fitwrap{position:relative;margin:0 auto;overflow:visible}
body.admin-body,body.screen-body{margin:0}
.adm{width:1920px;height:1080px;background:#F5F7FA;display:flex;flex-direction:column;transform-origin:top left;font-size:13px}
.adm-top{height:56px;background:#0C2138;color:#fff;display:flex;align-items:center;padding:0 20px;flex:0 0 auto}
.adm-top .logo{display:flex;align-items:center;gap:9px;font-size:16px;font-weight:600;letter-spacing:.3px}
.adm-top .logo .mk{width:26px;height:26px;border-radius:7px;background:#1B7FD4;display:flex;align-items:center;justify-content:center}
.adm-top .sys{font-size:11.5px;color:#7FA3C6;margin-left:12px;padding-left:12px;border-left:1px solid #23405C}
.adm-top .sp{flex:1}
.adm-top .tnav{display:flex;gap:2px}
.adm-top .tnav a{font-size:13px;color:#A9C3DC;padding:6px 12px;border-radius:5px}
.adm-top .tnav a.on{color:#fff;background:#1B4C77}
.adm-top .usr{display:flex;align-items:center;gap:9px;font-size:12.5px;color:#C7D8E8;margin-left:16px}
.adm-top .usr .av{width:28px;height:28px;border-radius:50%;background:#2B6499;display:flex;align-items:center;justify-content:center;font-size:12px}
.adm-main{flex:1;display:flex;min-height:0}
.adm-side{width:196px;background:#0E2338;flex:0 0 auto;padding:8px 0;overflow-y:auto}
.adm-side .grp{font-size:10.5px;color:#5C7C99;padding:14px 18px 6px;letter-spacing:.5px}
.adm-side a{display:flex;align-items:center;gap:9px;height:40px;padding:0 18px;color:#B9CFE3;font-size:13.5px;position:relative}
.adm-side a svg{width:16px;height:16px;opacity:.8}
.adm-side a:hover{background:#14304A;color:#fff}
.adm-side a.on{background:#17466F;color:#fff;font-weight:500}
.adm-side a.on:before{content:"";position:absolute;left:0;top:0;bottom:0;width:3px;background:#2E9BFF}
.adm-content{flex:1;overflow-y:auto;padding:18px 22px 24px;min-width:0}
.crumb{font-size:12px;color:#8A96A3;margin-bottom:12px}
.crumb b{color:#22303F;font-weight:500}
.pghd{display:flex;align-items:flex-end;margin-bottom:14px}
.pghd h2{font-size:20px;font-weight:600;color:#16202B}
.pghd p{font-size:12px;color:#8A96A3;margin-left:12px;padding-bottom:3px}
.pghd .sp{flex:1}
.btn2{height:34px;padding:0 15px;border-radius:5px;background:#fff;border:1px solid #D7DEE6;color:#33414F;
  font-size:13px;display:inline-flex;align-items:center;gap:6px}
.btn2:hover{border-color:#9FB4C9}
.btn2.pri{background:#1B7FD4;border-color:#1B7FD4;color:#fff}
.btn2.pri:hover{background:#166FBC}
.btn2.dgr{color:#C0392B;border-color:#E8C3BE}

.kpis{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-bottom:16px}
.kpi{background:#fff;border-radius:8px;padding:16px 18px;border:1px solid #E8EDF2;position:relative}
.kpi .k{font-size:12.5px;color:#7A8794;display:flex;align-items:center;gap:6px}
.kpi .v{font-size:28px;font-weight:600;color:#16202B;margin-top:9px;letter-spacing:-.5px;line-height:1.1}
.kpi .v small{font-size:13px;color:#7A8794;font-weight:400;margin-left:3px}
.kpi .d{font-size:11.5px;color:#8A96A3;margin-top:7px}
.kpi .d em{font-style:normal;font-weight:500}
.kpi .d em.up{color:#C0392B}.kpi .d em.dn{color:#12805C}
.kpi .bd{position:absolute;right:16px;top:16px;width:32px;height:32px;border-radius:7px;display:flex;align-items:center;justify-content:center;background:#F0F5FA;color:#1B7FD4}

.panel{background:#fff;border:1px solid #E8EDF2;border-radius:8px;margin-bottom:16px}
.panel .ph{height:44px;display:flex;align-items:center;padding:0 16px;border-bottom:1px solid #EEF2F6}
.panel .ph h3{font-size:14px;font-weight:600;color:#22303F}
.panel .ph .sp{flex:1}
.panel .ph .x{font-size:12px;color:#1B7FD4}
.panel .pb{padding:14px 16px}
.grid2{display:grid;grid-template-columns:1.6fr 1fr;gap:16px}
.grid2b{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.grid3{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}

table.tbl{width:100%;border-collapse:collapse;font-size:12.5px}
table.tbl th{text-align:left;font-weight:500;color:#7A8794;background:#FAFBFC;height:38px;padding:0 12px;border-bottom:1px solid #EEF2F6;white-space:nowrap}
table.tbl td{height:42px;padding:0 12px;border-bottom:1px solid #F2F5F8;color:#33414F}
table.tbl tr:last-child td{border-bottom:0}
table.tbl tbody tr:hover{background:#FAFCFF}
table.tbl .r{text-align:right}
table.tbl .c{text-align:center}
.mono2{font-family:"SF Mono",ui-monospace,Menlo,Consolas,monospace;font-size:12px;color:#4A5563}
.bdg{display:inline-flex;align-items:center;height:21px;padding:0 8px;border-radius:3px;font-size:11.5px}
.bdg.g{background:#E8F5F0;color:#12805C}
.bdg.b{background:#E9F2FC;color:#1B6FB8}
.bdg.o{background:#FDF2E4;color:#B9660A}
.bdg.r{background:#FBECEA;color:#C0392B}
.bdg.gy{background:#F0F2F5;color:#6B7683}
.flt{display:flex;gap:10px;align-items:center;margin-bottom:14px;flex-wrap:wrap}
.flt .fi{height:34px;background:#fff;border:1px solid #DDE4EB;border-radius:5px;display:flex;align-items:center;padding:0 10px;gap:6px;font-size:13px;color:#4A5563}
.flt .fi input{border:0;font-size:13px;width:130px;background:transparent}
.flt .fi select{border:0;font-size:13px;background:transparent;color:#33414F;min-width:96px}
.mini-map{height:100%;min-height:180px;border-radius:6px;overflow:hidden;position:relative;background:#E8EDF2}

/* 大屏 */
.screen-body{background:#050B12}
.scr{width:1920px;height:1080px;background:#050B12;color:#C9E2F5;position:relative;transform-origin:top left;
  background-image:radial-gradient(ellipse at 50% 0%,rgba(24,90,150,.28),transparent 62%),
  linear-gradient(rgba(28,74,116,.14) 1px,transparent 1px),linear-gradient(90deg,rgba(28,74,116,.14) 1px,transparent 1px);
  background-size:100% 100%,44px 44px,44px 44px}
.scr-hd{height:72px;display:flex;align-items:center;justify-content:center;position:relative;
  background:linear-gradient(180deg,rgba(20,74,124,.6),transparent)}
.scr-hd h1{font-size:30px;font-weight:700;letter-spacing:2px;color:#EAF6FF;text-shadow:0 0 18px rgba(64,160,255,.55)}
.scr-hd .l{position:absolute;left:28px;top:24px;font-size:12.5px;color:#6F93B3;display:flex;gap:16px;align-items:center}
.scr-hd .r{position:absolute;right:28px;top:24px;font-size:12.5px;color:#6F93B3;display:flex;gap:16px;align-items:center}
.scr-hd .r b{color:#9ED0F5;font-weight:500}
.scr-body{display:grid;grid-template-columns:400px 1fr 430px;gap:14px;padding:0 20px;height:746px}
.scr-col{display:flex;flex-direction:column;gap:16px;min-height:0}
.scr-card{background:rgba(11,32,52,.62);border:1px solid rgba(45,110,168,.34);border-radius:4px;position:relative;min-height:0;display:flex;flex-direction:column}
.scr-card:before,.scr-card:after{content:"";position:absolute;width:11px;height:11px;border-color:#3D9BE0;border-style:solid}
.scr-card:before{left:-1px;top:-1px;border-width:1.5px 0 0 1.5px}
.scr-card:after{right:-1px;bottom:-1px;border-width:0 1.5px 1.5px 0}
.scr-card .ch{height:38px;display:flex;align-items:center;padding:0 14px;font-size:14px;color:#B7D9F5;letter-spacing:.5px;
  border-bottom:1px solid rgba(45,110,168,.24)}
.scr-card .ch .bar{width:3px;height:13px;background:#2FA4FF;margin-right:8px;box-shadow:0 0 7px #2FA4FF}
.scr-card .ch .sp{flex:1}
.scr-card .ch .t{font-size:11px;color:#5F87A8}
.scr-card .cb{flex:1;padding:10px 12px;min-height:0;position:relative}
.scr-kpi{display:grid;grid-template-columns:1fr 1fr;gap:10px;padding:12px}
.scr-kpi .i{background:linear-gradient(180deg,rgba(30,96,152,.42),rgba(12,38,62,.42));border:1px solid rgba(50,120,180,.3);
  border-radius:3px;padding:10px 12px}
.scr-kpi .i .k{font-size:11.5px;color:#7FA9C9}
.scr-kpi .i .v{font-size:26px;font-weight:700;color:#5FD0FF;margin-top:5px;letter-spacing:-.5px;font-family:"SF Mono",ui-monospace,monospace}
.scr-kpi .i .v small{font-size:11px;color:#6F93B3;margin-left:3px;font-weight:400}
.scr-kpi .i .d{font-size:10.5px;color:#5E88A8;margin-top:3px}
.scr-map{position:relative;flex:1;height:100%;min-height:260px;overflow:hidden;border-radius:2px}
.scr-map img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.52;filter:grayscale(.35) brightness(.82) contrast(1.1)}
.scr-map svg{position:absolute;inset:0;width:100%;height:100%}
.scr-legend{position:absolute;left:12px;bottom:12px;background:rgba(5,15,25,.72);border:1px solid rgba(50,120,180,.3);
  border-radius:3px;padding:8px 11px;font-size:11px;color:#8FB4D2;line-height:1.9}
.scr-legend i{display:inline-block;width:8px;height:8px;border-radius:50%;margin-right:6px}
.scr-legend .ln{display:inline-block;width:14px;height:2px;margin-right:6px;vertical-align:3px}
.scr-tbl{width:100%;border-collapse:collapse;font-size:12px}
.scr-tbl th{text-align:left;font-weight:400;color:#5F87A8;height:30px;font-size:11px;border-bottom:1px solid rgba(45,110,168,.24)}
.scr-tbl td{height:32px;border-bottom:1px solid rgba(45,110,168,.13);color:#B7D5EC}
.scr-tbl .r{text-align:right}
.scr-tbl .hl{color:#5FD0FF;font-family:"SF Mono",ui-monospace,monospace}
.scr-biz{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;padding:12px 20px 14px;height:196px}
.scr-biz .b .bn{margin-top:8px}
.scr-biz .b .bar{margin-top:8px}
.scr-biz .b{background:rgba(11,32,52,.62);border:1px solid rgba(45,110,168,.34);border-radius:4px;padding:14px 16px;position:relative;overflow:hidden}
.scr-biz .b .bh{display:flex;align-items:center;gap:8px;font-size:14px;color:#CFE8FB}
.scr-biz .b .bh .ic{width:26px;height:26px;border-radius:4px;display:flex;align-items:center;justify-content:center;background:rgba(47,164,255,.14);color:#4FB4FF}
.scr-biz .b .bn{display:flex;align-items:baseline;gap:16px;margin-top:12px}
.scr-biz .b .bn .x .k{font-size:10.5px;color:#5F87A8}
.scr-biz .b .bn .x .v{font-size:23px;font-weight:700;color:#E4F3FF;font-family:"SF Mono",ui-monospace,monospace;letter-spacing:-.5px}
.scr-biz .b .bn .x .v small{font-size:10px;color:#6F93B3;font-weight:400;margin-left:2px}
.scr-biz .b .bar{margin-top:10px;height:4px;background:rgba(47,164,255,.14);border-radius:2px;overflow:hidden}
.scr-biz .b .bar i{display:block;height:100%;background:linear-gradient(90deg,#1F7FC8,#5FD0FF)}
.scr-biz .b .bf{display:flex;justify-content:space-between;font-size:10.5px;color:#5F87A8;margin-top:6px}

/* 入口页 */
.portal{background:#0C1826;min-height:100vh;color:#fff;padding:56px 48px;max-width:1480px;margin:0 auto}
.portal > div{max-width:1400px;margin-left:auto;margin-right:auto}
.portal .ph1{display:flex;align-items:center;gap:12px}
.portal .mk{width:40px;height:40px;border-radius:10px;background:#1B7FD4;display:flex;align-items:center;justify-content:center}
.portal h1{font-size:22px;font-weight:600;letter-spacing:.5px}
.portal .sub{font-size:13px;color:#7E9AB5;margin-top:6px}
.portal .line{height:1px;background:#1B3149;margin:28px 0}
.portal .grid{display:grid;grid-template-columns:repeat(4,1fr);gap:24px;max-width:1400px}
.portal .grid .pcard{background:#122234;border:1px solid #1D344B;border-radius:14px;overflow:hidden;transition:.2s}
.portal .grid .pcard:hover{transform:translateY(-3px);border-color:#2E6C9E}
.portal .pcard .pv{height:250px;display:flex;align-items:center;justify-content:center;background:#0E1B2A;border-bottom:1px solid #1D344B}
.portal .pcard .pb{padding:18px 20px 20px}
.portal .pcard h3{font-size:16px;font-weight:600}
.portal .pcard p{font-size:12.5px;color:#7E9AB5;margin-top:5px;line-height:1.6}
.portal .pcard .tg{display:flex;gap:6px;margin-top:11px;flex-wrap:wrap}
.portal .pcard .tg span{font-size:10.5px;color:#6E93B4;border:1px solid #24405A;padding:2px 7px;border-radius:3px}
.portal .foot{font-size:12px;color:#5D7B96;margin-top:34px}
.portal .sec-t{font-size:13px;color:#8FB0CC;margin:30px 0 14px;letter-spacing:.5px}
.portal .ptabs{display:flex;gap:8px;margin-bottom:6px}
.portal .ptabs a{font-size:12px;color:#7E9AB5;border:1px solid #24405A;padding:5px 12px;border-radius:5px}
.portal .ptabs a.on{color:#fff;background:#1B7FD4;border-color:#1B7FD4}
.portal .pnum{display:flex;align-items:center;gap:10px;font-size:12px;color:#5D7B96;margin-top:10px}
.portal .pnum i{display:inline-block;width:6px;height:6px;border-radius:50%;background:#2E6C9E}

/* ============================================================
   第二版扩充组件
   ============================================================ */
/* 页内分段控件 */
.segc{display:flex;background:#fff;border:1px solid var(--line);border-radius:10px;overflow:hidden;margin:0 16px 12px}
.segc a{flex:1;text-align:center;height:38px;line-height:38px;font-size:13.5px;color:var(--ink2);border-right:1px solid var(--line2)}
.segc a:last-child{border-right:0}
.segc a.on{background:var(--pri);color:#fff;font-weight:600}
.segc.sm a{height:32px;line-height:32px;font-size:12.5px}

/* 常用线路卡片 */
.favlist{margin:0 16px}
.favcard{display:flex;align-items:center;gap:12px;background:#fff;border-radius:14px;padding:13px 14px;margin-bottom:10px;box-shadow:var(--shadow)}
.favcard .fl{width:46px;height:46px;border-radius:12px;background:var(--pri-l);color:var(--pri);display:flex;align-items:center;justify-content:center;font-size:15px;font-weight:700;flex:0 0 auto}
.favcard .fm{flex:1;min-width:0}
.favcard .fm .n{font-size:15px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.favcard .fm .d{font-size:11.5px;color:var(--ink3);margin-top:3px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.favcard .fr{text-align:right;flex:0 0 auto}
.favcard .fr b{font-size:15px;color:var(--pri)}
.favcard .fr span{display:block;font-size:10.5px;color:var(--ink3);margin-top:2px}
.favcard .star{width:20px;color:#E0B64A;flex:0 0 auto}

/* 服务宫格 */
.svc{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin:0 12px;padding:14px 6px;background:#fff;border-radius:16px;box-shadow:var(--shadow)}
.svc a{display:flex;flex-direction:column;align-items:center;gap:7px;font-size:12px;color:var(--ink2)}
.svc .si{width:42px;height:42px;border-radius:13px;background:#F5F7FA;display:flex;align-items:center;justify-content:center;color:var(--pri)}
.svc .si svg{width:22px;height:22px}

/* 搜索页 */
.swrap{padding:2px 16px 0}
.s-his{display:flex;flex-wrap:wrap;gap:8px;margin-top:4px}
.s-his span{height:28px;padding:0 12px;border-radius:14px;background:#F2F4F7;font-size:12.5px;color:var(--ink2);display:flex;align-items:center}
.s-hot{display:flex;flex-wrap:wrap;gap:8px;margin-top:4px}
.s-hot a{height:28px;padding:0 12px;border-radius:14px;background:var(--pri-l);font-size:12.5px;color:var(--pri);display:flex;align-items:center}
.reslist{margin:0 16px;background:#fff;border-radius:14px;overflow:hidden;box-shadow:var(--shadow)}
.reslist .ri{display:flex;align-items:center;gap:12px;padding:13px 15px;border-bottom:1px solid var(--line2)}
.reslist .ri:last-child{border-bottom:0}
.reslist .ri .rl{width:44px;height:44px;border-radius:11px;background:var(--pri-l);color:var(--pri);display:flex;align-items:center;justify-content:center;font-size:14px;font-weight:700;flex:0 0 auto}
.reslist .ri .rm{flex:1;min-width:0}
.reslist .ri .rm .n{font-size:14.5px;font-weight:600}
.reslist .ri .rm .d{font-size:11.5px;color:var(--ink3);margin-top:3px}
.reslist .ri .rr{font-size:12px;color:var(--pri)}

/* 线路详情 站点链 */
.chain{background:#fff;border-radius:14px;margin:0 16px;padding:6px 0;box-shadow:var(--shadow)}
.chain .ci{display:flex;align-items:flex-start;gap:12px;padding:0 16px;position:relative}
.chain .ci .bar{flex:0 0 18px;display:flex;flex-direction:column;align-items:center;padding-top:6px}
.chain .ci .bar i{width:10px;height:10px;border-radius:50%;border:2.5px solid var(--pri);background:#fff;box-sizing:border-box}
.chain .ci .bar u{width:2px;flex:1;background:var(--line);min-height:34px;display:block;margin:2px 0}
.chain .ci:last-child .bar u{display:none}
.chain .ci.pass .bar i{border-color:#C6CFD8}
.chain .ci.pass .nm{color:var(--ink4)}
.chain .ci .cb{flex:1;padding:8px 0 12px;border-bottom:1px solid var(--line2)}
.chain .ci:last-child .cb{border-bottom:0}
.chain .ci .nm{font-size:15px;font-weight:600}
.chain .ci .mt{font-size:11px;color:var(--ink3);margin-top:4px;display:flex;gap:10px}
.chain .ci .bs{margin-left:auto;font-size:12px;color:var(--pri);font-weight:600}
.chain .ci.cur{background:var(--pri-l)}
.chain .ci.cur .nm{color:var(--pri)}

/* 收银台 */
.paybox{margin:12px 16px;background:#fff;border-radius:14px;overflow:hidden}
.paybox .amt{padding:22px 16px 18px;text-align:center;border-bottom:1px solid var(--line2)}
.paybox .amt .t{font-size:12px;color:var(--ink3)}
.paybox .amt .v{font-size:36px;font-weight:700;color:var(--red);letter-spacing:-1px;margin-top:6px}
.paybox .amt .v small{font-size:16px;font-weight:500}
.paybox .pm{display:flex;align-items:center;gap:12px;padding:14px 16px;border-bottom:1px solid var(--line2)}
.paybox .pm:last-child{border-bottom:0}
.paybox .pm .pi{width:32px;height:32px;border-radius:8px;display:flex;align-items:center;justify-content:center;flex:0 0 auto}
.paybox .pm .pn{flex:1}
.paybox .pm .pn b{font-size:14.5px;font-weight:600;display:block}
.paybox .pm .pn span{font-size:11px;color:var(--ink3);margin-top:2px;display:block}
.paybox .pm .rd{width:20px;height:20px;border-radius:50%;border:1.5px solid #C6CFD8;flex:0 0 auto;display:flex;align-items:center;justify-content:center}
.paybox .pm.on .rd{border-color:var(--pri);background:var(--pri)}
.paybox .pm.on .rd:after{content:"";width:8px;height:8px;border-radius:50%;background:#fff}

/* 结果页 */
.result{padding:56px 16px 0;text-align:center}
.result .ic{width:72px;height:72px;border-radius:50%;margin:0 auto 18px;display:flex;align-items:center;justify-content:center;background:var(--green);color:#fff}
.result .ic.err{background:var(--red)}
.result .ic.wait{background:var(--orange)}
.result h3{font-size:19px;font-weight:600}
.result p{font-size:13px;color:var(--ink3);margin-top:8px;line-height:1.6}
.result .acts{margin:34px 16px 0}

/* 消息 / 公告 / 帮助 */
.msglist{margin:0 16px;background:#fff;border-radius:14px;overflow:hidden;box-shadow:var(--shadow)}
.msglist .mi{display:flex;gap:12px;padding:14px 15px;border-bottom:1px solid var(--line2)}
.msglist .mi:last-child{border-bottom:0}
.msglist .mi .mg{width:36px;height:36px;border-radius:10px;flex:0 0 auto;display:flex;align-items:center;justify-content:center}
.msglist .mi .mb{flex:1;min-width:0}
.msglist .mi .mb .t{font-size:14.5px;font-weight:600;display:flex;align-items:center;gap:6px}
.msglist .mi .mb .t em{width:6px;height:6px;border-radius:50%;background:var(--red);display:inline-block}
.msglist .mi .mb .c{font-size:12.5px;color:var(--ink2);margin-top:5px;line-height:1.6}
.msglist .mi .mb .d{font-size:11px;color:var(--ink4);margin-top:6px}
.msglist .mi .mr{margin-left:auto;font-size:11px;color:var(--ink4);flex:0 0 auto}

.acclist{margin:0 16px;background:#fff;border-radius:14px;overflow:hidden;box-shadow:var(--shadow)}
.acc{border-bottom:1px solid var(--line2)}
.acc:last-child{border-bottom:0}
.acc .q{display:flex;align-items:center;gap:10px;padding:14px 15px;font-size:14px;font-weight:500}
.acc .q .ar{margin-left:auto;color:var(--ink4);transition:.2s}
.acc.open .q .ar{transform:rotate(90deg)}
.acc .a{display:none;padding:0 15px 14px;font-size:12.5px;color:var(--ink2);line-height:1.8}
.acc.open .a{display:block}

/* 空状态 */
.empty{padding:70px 40px;text-align:center;color:var(--ink4)}
.empty svg{width:64px;height:64px;margin:0 auto 16px;opacity:.5}
.empty p{font-size:13.5px}
.empty .btn{margin-top:22px;width:150px;display:inline-flex}

/* 步骤条 */
.steps{display:flex;align-items:center;margin:0 16px 14px;padding:16px 8px;background:#fff;border-radius:14px;box-shadow:var(--shadow)}
.steps .sp{flex:1;display:flex;flex-direction:column;align-items:center;gap:6px;position:relative;font-size:11.5px;color:var(--ink4)}
.steps .sp i{width:24px;height:24px;border-radius:50%;background:#EFF2F5;color:var(--ink4);display:flex;align-items:center;justify-content:center;font-size:12px;font-weight:600;font-style:normal}
.steps .sp.on i{background:var(--pri);color:#fff}
.steps .sp.on{color:var(--pri)}
.steps .sp.done i{background:var(--green-l);color:var(--green)}
.steps .sp:after{content:"";position:absolute;top:12px;left:calc(50% + 16px);right:calc(-50% + 16px);height:1px;background:var(--line)}
.steps .sp:last-child:after{display:none}

/* 表单扩展 */
.frow.tall{padding:12px 16px;align-items:flex-start}
.frow.tall .k{padding-top:2px}
.frow textarea{flex:1;border:0;font-size:14.5px;line-height:1.6;min-height:70px;resize:none;background:transparent}
.frow .sw{margin-left:auto;width:44px;height:25px;border-radius:13px;background:#D8DEE5;position:relative;transition:.2s;flex:0 0 auto}
.frow .sw:after{content:"";position:absolute;left:2px;top:2px;width:21px;height:21px;border-radius:50%;background:#fff;transition:.2s;box-shadow:0 1px 3px rgba(0,0,0,.2)}
.frow .sw.on{background:var(--pri)}
.frow .sw.on:after{left:21px}
.numst{margin-left:auto;display:flex;align-items:center;gap:0;flex:0 0 auto}
.numst button{width:30px;height:30px;border-radius:8px;background:#F2F4F7;color:var(--ink2);font-size:17px;display:flex;align-items:center;justify-content:center}
.numst span{width:40px;text-align:center;font-size:15px;font-weight:600}
.upl{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;padding:12px 16px}
.upl .up{height:86px;border-radius:10px;background:#F5F7FA;border:1px dashed #D3DAE2;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;font-size:11px;color:var(--ink3);position:relative;overflow:hidden}
.upl .up img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.upl .up .del{position:absolute;right:3px;top:3px;width:17px;height:17px;border-radius:50%;background:rgba(0,0,0,.55);color:#fff;font-size:11px;display:flex;align-items:center;justify-content:center;z-index:2}
.radios{padding:4px 0}
.radios .rr{display:flex;align-items:center;gap:10px;padding:11px 16px;font-size:14px}
.radios .rr i{width:18px;height:18px;border-radius:50%;border:1.5px solid #C6CFD8;flex:0 0 auto;display:flex;align-items:center;justify-content:center}
.radios .rr.on i{border-color:var(--pri);background:var(--pri)}
.radios .rr.on i:after{content:"";width:7px;height:7px;border-radius:50%;background:#fff}

/* 司机端扩充 */
.tabbar.drk{background:#101418;border-top:1px solid #232A32}
.tabbar.drk .tab{color:#7C8894;font-size:11px}
.tabbar.drk .tab.on{color:#4ADE80}
.tabbar.drk .dot{background:#FF6B5B;border-color:#101418}
.dsec{margin:0 14px 12px}
.dsec .dh{font-size:14px;font-weight:800;color:#33414F;margin:14px 2px 8px;display:flex;align-items:center;gap:6px}
.dsec .dh .sp{flex:1}
.dcard{background:#fff;border:2px solid #101418;border-radius:14px;overflow:hidden;margin:0 14px 12px}
.dcard .dr{display:flex;align-items:center;gap:12px;padding:13px 15px;border-bottom:1px solid #E3E8ED}
.dcard .dr:last-child{border-bottom:0}
.dcard .dr .dl{flex:1;min-width:0}
.dcard .dr .dl .t{font-size:17px;font-weight:700;color:#101418}
.dcard .dr .dl .s{font-size:13px;color:#5B6673;font-weight:600;margin-top:3px}
.dcard .dr .dr2{text-align:right;flex:0 0 auto}
.dcard .dr .dr2 b{font-size:19px;color:#0A4C8F;font-weight:900}
.dcard .dr .dr2 span{display:block;font-size:11.5px;color:#5B6673;font-weight:700;margin-top:2px}
.dtabs{display:flex;background:#fff;border-bottom:2px solid #101418}
.dtabs a{flex:1;text-align:center;padding:13px 0;font-size:16px;font-weight:800;color:#5B6673;position:relative}
.dtabs a.on{color:#0B6B4C}
.dtabs a.on:after{content:"";position:absolute;left:50%;transform:translateX(-50%);bottom:0;width:44px;height:3px;background:#0B6B4C;border-radius:2px}
.dform{margin:12px 14px;background:#fff;border:2px solid #101418;border-radius:14px;overflow:hidden}
.dform .fr{display:flex;align-items:center;min-height:58px;padding:0 15px;border-bottom:1px solid #E3E8ED;gap:10px}
.dform .fr:last-child{border-bottom:0}
.dform .fr .fk{width:96px;font-size:15px;font-weight:700;color:#33414F;flex:0 0 auto}
.dform .fr input{flex:1;border:0;font-size:16px;background:transparent;font-weight:600}
.dform .fr .fv{font-size:15px;color:#7C8894}
.dlogin{padding:6px 18px 0}
.dlogin .lg-h{font-size:30px;font-weight:900;color:#101418;letter-spacing:-.5px;margin:16px 0 6px}
.dlogin .lg-s{font-size:15px;color:#5B6673;font-weight:600;margin-bottom:24px}
.dkb{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;padding:12px 14px;background:#E9EDF1}
.dkb button{height:56px;border-radius:10px;background:#fff;font-size:24px;font-weight:800;color:#101418;box-shadow:0 2px 0 #B9C2CC;display:flex;align-items:center;justify-content:center}
.dkb button.fn{background:#D6DCE3;font-size:19px}
.vres{padding:6px 16px 0;text-align:center}
.vres .ic{width:86px;height:86px;border-radius:50%;margin:12px auto 14px;display:flex;align-items:center;justify-content:center}
.vres .ic.ok{background:#E9F5EF;color:#0F7A56}
.vres .ic.no{background:#FBECEA;color:#C0392B}
.vres h3{font-size:22px;font-weight:800}
.vres p{font-size:14px;color:#5B6673;margin-top:6px;font-weight:600}

/* 长辈版扩充 */
.elder .efield{margin:14px 18px;background:#fff;border:2px solid #E3DCCB;border-radius:14px;padding:14px 18px}
.elder .efield label{font-size:19px;font-weight:700;color:#20180A;display:block;margin-bottom:8px}
.elder .efield input{width:100%;border:2px solid #D6CDB6;border-radius:10px;height:60px;font-size:24px;padding:0 14px;background:#FFFDF7}
.elder .ekey{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;padding:12px 14px;background:#F3EEE1}
.elder .ekey button{height:66px;border-radius:10px;background:#fff;font-size:28px;font-weight:800;color:#20180A;border:2px solid #D6CDB6}
.elder .ekey button.fn{background:#EFE8D6;font-size:20px}
.elder .esel{display:flex;flex-direction:column;gap:12px;padding:14px 18px}
.elder .esel button{height:78px;border-radius:14px;background:#fff;border:2px solid #D6CDB6;font-size:24px;font-weight:700;color:#20180A;text-align:left;padding:0 20px}
.elder .esel button.on{border-color:#0B5CAD;background:#EAF2FC;color:#0B5CAD}

/* ============================================================
   后台扩充
   ============================================================ */
.adm-tabs{display:flex;border-bottom:1px solid #E8EDF2;margin-bottom:14px;gap:2px}
.adm-tabs a{height:36px;padding:0 16px;display:flex;align-items:center;font-size:13.5px;color:#4A5563;border-bottom:2px solid transparent;margin-bottom:-1px}
.adm-tabs a.on{color:#1B7FD4;font-weight:500;border-bottom-color:#1B7FD4}
.adm-tabs a em{font-style:normal;margin-left:6px;font-size:11.5px;color:#98A4B0}

.pager{display:flex;align-items:center;gap:8px;padding:12px 16px;font-size:12.5px;color:#7A8794}
.pager .sp{flex:1}
.pager a,.pager span{height:28px;min-width:28px;padding:0 8px;border:1px solid #DDE4EB;border-radius:4px;display:flex;align-items:center;justify-content:center;background:#fff;color:#4A5563}
.pager a.on{background:#1B7FD4;border-color:#1B7FD4;color:#fff}
.pager .jump{display:flex;align-items:center;gap:6px}

.desc{display:grid;grid-template-columns:repeat(3,1fr);gap:0;border:1px solid #EEF2F6;border-radius:6px;overflow:hidden}
.desc .di{display:flex;padding:11px 14px;border-right:1px solid #F2F5F8;border-bottom:1px solid #F2F5F8;min-width:0}
.desc .di:nth-child(3n){border-right:0}
.desc .di .dk{width:88px;flex:0 0 auto;color:#7A8794;font-size:12.5px}
.desc .di .dv{flex:1;color:#22303F;font-size:12.5px;min-width:0}
.desc.d2{grid-template-columns:repeat(2,1fr)}
.desc.d2 .di:nth-child(3n){border-right:1px solid #F2F5F8}
.desc.d2 .di:nth-child(2n){border-right:0}

.fg{display:grid;grid-template-columns:repeat(2,1fr);gap:14px 18px}
.fgi{display:flex;align-items:center;gap:10px}
.fgi .fk{width:96px;flex:0 0 auto;font-size:12.5px;color:#4A5563;text-align:right}
.fgi .fc{flex:1;height:34px;border:1px solid #DDE4EB;border-radius:5px;background:#fff;display:flex;align-items:center;padding:0 10px;font-size:13px;color:#22303F}
.fgi .fc input,.fgi .fc select{border:0;width:100%;font-size:13px;background:transparent}
.fgi.full{grid-column:1/-1}
.fgi.full .fc{align-items:flex-start;padding:8px 10px;min-height:70px}
.fgi.full textarea{border:0;width:100%;font-size:13px;line-height:1.6;resize:none;min-height:56px}
.fsec{font-size:13px;font-weight:600;color:#22303F;padding:14px 0 10px;border-bottom:1px solid #EEF2F6;margin-bottom:14px;display:flex;align-items:center;gap:8px}
.fsec .bar{width:3px;height:13px;background:#1B7FD4;border-radius:2px}

.sw2{width:40px;height:22px;border-radius:11px;background:#D8DEE5;position:relative;transition:.2s;flex:0 0 auto;cursor:pointer}
.sw2:after{content:"";position:absolute;left:2px;top:2px;width:18px;height:18px;border-radius:50%;background:#fff;transition:.2s}
.sw2.on{background:#1B7FD4}
.sw2.on:after{left:20px}

.tree{font-size:13px}
.tree .tn{display:flex;align-items:center;gap:7px;height:34px;padding:0 10px;border-radius:5px;color:#33414F}
.tree .tn:hover{background:#F0F5FA}
.tree .tn.on{background:#E9F2FC;color:#1B7FD4}
.tree .tn .tg{width:14px;color:#98A4B0;font-size:10px;display:flex;justify-content:center;flex:0 0 auto}
.tree .tn b{font-weight:500}
.tree .tn .ct{margin-left:auto;font-size:11px;color:#98A4B0}
.tree .sub{margin-left:18px;border-left:1px dashed #E3E9EF;padding-left:6px}

.tl{position:relative;padding-left:16px}
.tl:before{content:"";position:absolute;left:4px;top:6px;bottom:6px;width:1px;background:#E8EDF2}
.tl .ti{position:relative;padding:0 0 16px}
.tl .ti:before{content:"";position:absolute;left:-16px;top:4px;width:9px;height:9px;border-radius:50%;background:#C6D4E2;border:2px solid #fff}
.tl .ti.on:before{background:#1B7FD4}
.tl .ti.warn:before{background:#E8A33C}
.tl .ti h5{font-size:12.5px;color:#22303F;font-weight:500}
.tl .ti p{font-size:11.5px;color:#8A96A3;margin-top:3px}

.alert{display:flex;align-items:flex-start;gap:9px;padding:11px 14px;border-radius:6px;font-size:12.5px;line-height:1.7;margin-bottom:14px}
.alert.i{background:#F0F6FC;border:1px solid #D5E5F5;color:#2C5B85}
.alert.w{background:#FDF6E9;border:1px solid #F0DFB8;color:#8A6414}
.alert.e{background:#FBECEA;border:1px solid #F1D2CE;color:#A43A2C}
.alert b{font-weight:600}

.stp{display:flex;align-items:center;margin-bottom:16px}
.stp .ss{display:flex;align-items:center;gap:8px}
.stp .ss i{width:22px;height:22px;border-radius:50%;background:#E8EDF2;color:#98A4B0;display:flex;align-items:center;justify-content:center;font-size:11.5px;font-style:normal;font-weight:600}
.stp .ss span{font-size:12.5px;color:#7A8794}
.stp .ss.on i{background:#1B7FD4;color:#fff}
.stp .ss.on span{color:#22303F;font-weight:500}
.stp .ss.done i{background:#E8F5F0;color:#12805C}
.stp .ln{flex:0 0 44px;height:1px;background:#E8EDF2;margin:0 10px}

.empty-a{padding:60px 0;text-align:center;color:#A6B0BB;font-size:13px}
.empty-a svg{width:52px;height:52px;margin:0 auto 12px;opacity:.45}

.qrgrid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
.qrgrid .qi{background:#fff;border:1px solid #E8EDF2;border-radius:8px;padding:14px;text-align:center}
.qrgrid .qi .qb{width:112px;height:112px;margin:0 auto 10px;padding:7px;border:1px solid #E8EDF2;border-radius:6px;background:#fff}
.qrgrid .qi .qb canvas{width:100%;height:100%}
.qrgrid .qi .qp{font-size:13px;font-weight:600;color:#22303F;font-family:"SF Mono",ui-monospace,monospace}
.qrgrid .qi .qm{font-size:11px;color:#8A96A3;margin-top:3px}
.qrgrid .qi .qf{display:flex;gap:6px;justify-content:center;margin-top:9px}
.qrgrid .qi .qf button{height:26px;padding:0 10px;border:1px solid #DDE4EB;border-radius:4px;font-size:11.5px;color:#4A5563;background:#fff}

.schtb{width:100%;border-collapse:collapse;font-size:12px}
.schtb th{background:#FAFBFC;color:#7A8794;font-weight:500;height:36px;border:1px solid #EEF2F6;padding:0 8px;white-space:nowrap}
.schtb td{border:1px solid #F2F5F8;height:40px;padding:0 8px;color:#33414F;vertical-align:middle}
.schtb td .sl{display:flex;flex-direction:column;gap:2px}
.schtb td .sl b{font-size:12px;color:#22303F;font-weight:600}
.schtb td .sl span{font-size:10.5px;color:#8A96A3}
.schtb td.st-run{background:#F3FAF7}
.schtb td.st-stop{background:#FBECEA}
.schtb td.st-add{background:#F0F6FC}
.schtb td.st-free{background:#FAFBFC}

.mk2{display:inline-flex;align-items:center;gap:5px}
.mk2 i{width:7px;height:7px;border-radius:2px;display:inline-block}

/* 后台弹层 */
.mask-a{position:fixed;inset:0;background:rgba(12,18,26,.45);z-index:200;display:none}
.mask-a.show{display:block}
.modal{position:fixed;left:50%;top:50%;transform:translate(-50%,-50%) scale(.97);width:640px;background:#fff;border-radius:8px;
  z-index:201;display:none;box-shadow:0 20px 60px rgba(10,25,45,.28);opacity:0;transition:.18s}
.modal.show{display:block;opacity:1;transform:translate(-50%,-50%) scale(1)}
.modal.w800{width:800px}
.modal .mh{height:52px;display:flex;align-items:center;padding:0 20px;border-bottom:1px solid #EEF2F6}
.modal .mh h4{font-size:15px;font-weight:600;color:#22303F}
.modal .mh .cl{margin-left:auto;color:#98A4B0;font-size:22px;line-height:1;cursor:pointer}
.modal .mb{padding:18px 20px;max-height:60vh;overflow-y:auto}
.modal .mf{padding:12px 20px 16px;border-top:1px solid #EEF2F6;display:flex;justify-content:flex-end;gap:10px}
.drawer{position:fixed;right:0;top:0;bottom:0;width:760px;background:#fff;z-index:201;transform:translateX(102%);
  transition:.26s cubic-bezier(.32,.72,.36,1);box-shadow:-8px 0 40px rgba(10,25,45,.18);display:flex;flex-direction:column}
.drawer.show{transform:translateX(0)}
.drawer .dh2{height:56px;display:flex;align-items:center;padding:0 20px;border-bottom:1px solid #EEF2F6;flex:0 0 auto}
.drawer .dh2 h4{font-size:15px;font-weight:600}
.drawer .dh2 .cl{margin-left:auto;color:#98A4B0;font-size:22px;cursor:pointer}
.drawer .db{flex:1;overflow-y:auto;padding:18px 20px}
.drawer .df{padding:12px 20px;border-top:1px solid #EEF2F6;display:flex;justify-content:flex-end;gap:10px;flex:0 0 auto}

/* 大屏（全屏自适应） */
.scrfs{position:relative;width:100vw;height:100vh;min-width:1440px;min-height:760px;overflow:hidden;color:#C9E2F5;
  background:#050B12;display:flex;flex-direction:column;
  background-image:radial-gradient(ellipse at 50% -10%,rgba(24,90,150,.34),transparent 60%),
  linear-gradient(rgba(28,74,116,.13) 1px,transparent 1px),linear-gradient(90deg,rgba(28,74,116,.13) 1px,transparent 1px);
  background-size:100% 100%,46px 46px,46px 46px}
.sf-hd{flex:0 0 auto;height:clamp(58px,6.2vh,84px);display:flex;align-items:center;justify-content:center;position:relative;
  background:linear-gradient(180deg,rgba(20,74,124,.62),transparent)}
.sf-hd h1{font-size:clamp(20px,2.3vw,34px);font-weight:700;letter-spacing:2px;color:#EAF6FF;text-shadow:0 0 20px rgba(64,160,255,.6)}
.sf-hd .l{position:absolute;left:clamp(14px,1.6vw,32px);top:50%;transform:translateY(-50%);font-size:clamp(10px,.85vw,13px);color:#6F93B3;display:flex;gap:clamp(8px,1vw,20px);align-items:center}
.sf-hd .r{position:absolute;right:clamp(14px,1.6vw,32px);top:50%;transform:translateY(-50%);font-size:clamp(10px,.85vw,13px);color:#6F93B3;display:flex;gap:clamp(8px,1vw,20px);align-items:center}
.sf-hd .r b{color:#9ED0F5;font-weight:500}
.sf-body{flex:1;min-height:0;display:grid;grid-template-columns:clamp(320px,22vw,440px) 1fr clamp(340px,24vw,470px);
  gap:clamp(8px,.9vw,18px);padding:0 clamp(10px,1.1vw,24px) clamp(8px,1vh,16px)}
.sf-col{display:flex;flex-direction:column;gap:clamp(8px,.9vw,18px);min-height:0;min-width:0}
.sf-card{background:rgba(11,32,52,.62);border:1px solid rgba(45,110,168,.34);border-radius:4px;position:relative;
  display:flex;flex-direction:column;min-height:0}
.sf-card.flex1{flex:1}
.sf-card:before,.sf-card:after{content:"";position:absolute;width:11px;height:11px;border-color:#3D9BE0;border-style:solid}
.sf-card:before{left:-1px;top:-1px;border-width:1.5px 0 0 1.5px}
.sf-card:after{right:-1px;bottom:-1px;border-width:0 1.5px 1.5px 0}
.sf-card .ch{flex:0 0 auto;height:clamp(30px,3.4vh,44px);display:flex;align-items:center;padding:0 clamp(8px,.9vw,16px);
  font-size:clamp(11px,1.02vw,15px);color:#B7D9F5;letter-spacing:.5px;border-bottom:1px solid rgba(45,110,168,.24)}
.sf-card .ch .bar{width:3px;height:clamp(9px,1.1vh,15px);background:#2FA4FF;margin-right:8px;box-shadow:0 0 7px #2FA4FF}
.sf-card .ch .sp{flex:1}
.sf-card .ch .t{font-size:clamp(9px,.72vw,12px);color:#5F87A8}
.sf-card .cb{flex:1;padding:clamp(6px,.85vh,14px) clamp(8px,.9vw,14px);min-height:0;position:relative;overflow:hidden}
.sf-kpi{display:grid;grid-template-columns:1fr 1fr;gap:clamp(6px,.7vw,12px);padding:clamp(6px,.8vh,14px)}
.sf-kpi .i{background:linear-gradient(180deg,rgba(30,96,152,.42),rgba(12,38,62,.42));border:1px solid rgba(50,120,180,.3);border-radius:3px;padding:clamp(6px,.9vh,13px) clamp(8px,.85vw,14px)}
.sf-kpi .i .k{font-size:clamp(9px,.76vw,12.5px);color:#7FA9C9}
.sf-kpi .i .v{font-size:clamp(17px,1.85vw,30px);font-weight:700;color:#5FD0FF;margin-top:clamp(2px,.4vh,6px);letter-spacing:-.5px;font-family:"SF Mono",ui-monospace,monospace}
.sf-kpi .i .v small{font-size:clamp(8px,.7vw,12px);color:#6F93B3;margin-left:3px;font-weight:400}
.sf-kpi .i .d{font-size:clamp(8px,.68vw,11.5px);color:#5E88A8;margin-top:clamp(1px,.3vh,4px)}
.sf-map{position:absolute;inset:0;overflow:hidden}
.sf-map img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.5;filter:grayscale(.35) brightness(.8) contrast(1.1)}
.sf-map svg{position:absolute;inset:0;width:100%;height:100%}
.sf-legend{position:absolute;left:clamp(8px,1vw,16px);bottom:clamp(8px,1vh,16px);background:rgba(5,15,25,.72);
  border:1px solid rgba(50,120,180,.3);border-radius:3px;padding:clamp(5px,.6vh,9px) clamp(7px,.8vw,12px);
  font-size:clamp(9px,.72vw,12px);color:#8FB4D2;line-height:1.9}
.sf-legend i{display:inline-block;width:8px;height:8px;border-radius:50%;margin-right:6px}
.sf-legend .ln{display:inline-block;width:14px;height:2px;margin-right:6px;vertical-align:3px}
.sf-tbl{width:100%;border-collapse:collapse;font-size:clamp(9px,.75vw,12.5px)}
.sf-tbl th{text-align:left;font-weight:400;color:#5F87A8;height:clamp(22px,2.7vh,32px);font-size:clamp(8.5px,.7vw,11.5px);border-bottom:1px solid rgba(45,110,168,.24)}
.sf-tbl td{height:clamp(22px,2.9vh,34px);border-bottom:1px solid rgba(45,110,168,.13);color:#B7D5EC}
.sf-tbl .r{text-align:right}
.sf-tbl .hl{color:#5FD0FF;font-family:"SF Mono",ui-monospace,monospace}
.sf-foot{flex:0 0 auto;height:clamp(84px,17vh,190px);display:grid;grid-template-columns:repeat(4,1fr);
  gap:clamp(8px,.9vw,18px);padding:0 clamp(10px,1.1vw,24px) clamp(10px,1.4vh,20px)}
.sf-bz{background:rgba(11,32,52,.62);border:1px solid rgba(45,110,168,.34);border-radius:4px;padding:clamp(8px,1vh,16px) clamp(10px,1vw,18px);position:relative;overflow:hidden;display:flex;flex-direction:column}
.sf-bz .bh{display:flex;align-items:center;gap:8px;font-size:clamp(11px,.95vw,15px);color:#CFE8FB}
.sf-bz .bh .ic{width:clamp(20px,1.8vw,28px);height:clamp(20px,1.8vw,28px);border-radius:4px;display:flex;align-items:center;justify-content:center;background:rgba(47,164,255,.14);color:#4FB4FF}
.sf-bz .bn{display:flex;align-items:baseline;gap:clamp(8px,1.2vw,20px);margin-top:clamp(4px,.7vh,12px)}
.sf-bz .bn .x .k{font-size:clamp(8.5px,.7vw,11.5px);color:#5F87A8}
.sf-bz .bn .x .v{font-size:clamp(15px,1.7vw,26px);font-weight:700;color:#E4F3FF;font-family:"SF Mono",ui-monospace,monospace;letter-spacing:-.5px}
.sf-bz .bn .x .v small{font-size:clamp(8px,.65vw,11px);color:#6F93B3;font-weight:400;margin-left:2px}
.sf-bz .bar{margin-top:auto;height:4px;background:rgba(47,164,255,.14);border-radius:2px;overflow:hidden}
.sf-bz .bar i{display:block;height:100%;background:linear-gradient(90deg,#1F7FC8,#5FD0FF)}
.sf-bz .bf{display:flex;justify-content:space-between;font-size:clamp(8.5px,.68vw,11.5px);color:#5F87A8;margin-top:6px}
.sf-bar{display:flex;align-items:center;gap:8px;margin-bottom:clamp(3px,.5vh,9px);font-size:clamp(9px,.75vw,12.5px)}
.sf-bar .bn{width:clamp(52px,4.6vw,84px);color:#8FB4D2;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sf-bar .bt{flex:1;height:clamp(6px,.9vh,11px);background:rgba(47,164,255,.12);border-radius:2px;overflow:hidden}
.sf-bar .bt i{display:block;height:100%;background:linear-gradient(90deg,#1F7FC8,#5FD0FF);border-radius:2px}
.sf-bar .bv{width:clamp(38px,3.4vw,62px);text-align:right;color:#5FD0FF;font-family:"SF Mono",ui-monospace,monospace}
.sf-donut{display:flex;align-items:center;gap:clamp(6px,.9vw,18px);height:100%}