/* 大连配送风险大屏 · v4 交互视觉层。基础功能样式见 style.css。
   布局优先级：地图 > 路线比较 > 规划控件 > 风险图表。 */
:root {
  --bg-deep:#071426; --bg-panel:rgba(12,29,51,.94); --bg-card:rgba(13,30,52,.91);
  --border:rgba(114,166,199,.19); --border-soft:rgba(141,179,202,.12);
  --cyan:#37D8F7; --green:#42E2A5; --red:#FF6671; --orange:#FFBB60;
  --text:#E7F2FF; --text-dim:#93AEC4; --glow-cyan:0 9px 28px rgba(0,0,0,.14);
  --radius:14px; --gap:12px; --topbar-h:79px; --bottombar-h:248px;
  --left-w:326px; --right-w:355px;
}
html,body {min-width:320px;font-size:13px;}
body {background:radial-gradient(ellipse 65% 55% at 65% 35%,rgba(13,102,129,.10),transparent),
  radial-gradient(ellipse 35% 55% at 5% -10%,rgba(41,118,177,.13),transparent),#071426;}
body::before {content:"";position:fixed;inset:0;pointer-events:none;opacity:.23;
  background-image:linear-gradient(rgba(111,182,218,.055) 1px,transparent 1px),linear-gradient(90deg,rgba(111,182,218,.055) 1px,transparent 1px);background-size:44px 44px;}
button,select,input {font-family:inherit;} button:focus-visible,select:focus-visible,input:focus-visible,th[role="button"]:focus-visible {outline:2px solid #8BEDFF;outline-offset:3px;}
button {touch-action:manipulation;}
button:disabled {opacity:.5;cursor:not-allowed;}
.screen {padding:12px;position:relative;gap:12px;}
.glass {border-color:var(--border);background:var(--bg-card);box-shadow:0 8px 30px rgba(1,8,18,.21);backdrop-filter:blur(17px);}
.card {padding:15px 16px;border-radius:14px;}
.card:hover {border-color:rgba(113,188,226,.28);}
.card-header{border-bottom:0;padding:0;margin-bottom:12px;min-height:20px;}
.card-title{font-size:13px;letter-spacing:.2px;border:0;padding:0;font-weight:700;color:#EBF8FF;}
.card-tag{color:#7395AC;font-size:9px;border:0;background:rgba(138,174,202,.09);letter-spacing:1.5px;padding:4px 8px;border-radius:5px;font-weight:700;}
/* 顶栏：品牌与系统状态 */
.topbar {min-height:var(--topbar-h);height:var(--topbar-h);padding:0 20px;border-color:rgba(86,176,210,.23);background:rgba(9,25,46,.96);border-radius:16px;gap:18px;}
.topbar-left {display:flex;align-items:center;flex:0 1 420px;min-width:260px;}
.logo-icon {width:42px;height:42px;border-radius:13px;display:grid;place-items:center;background:linear-gradient(145deg,#0EC7E7,#1B5995);box-shadow:0 6px 24px rgba(21,204,236,.20);flex:none;margin-right:13px;}
.logo-icon::after{content:"";width:18px;height:18px;inset:auto;position:static;transform:rotate(-45deg);border:2px solid #eaffff;border-left-color:transparent;border-radius:4px;}
.brand-copy {min-width:0;}
.brand-kicker {font-size:9px;letter-spacing:2.1px;font-weight:700;color:#48D9ED;margin-bottom:5px;}
.title{font-size:19px;letter-spacing:.45px;line-height:1.12;font-weight:750;white-space:nowrap;color:#F6FDFF;-webkit-text-fill-color:initial;background:none;}
.brand-subtitle{font-size:10px;color:#7099B3;margin-top:5px;letter-spacing:1.05px;}
.topbar-center{display:flex;gap:9px;flex:1 1 auto;justify-content:center;min-width:0;}
.global-filter{display:flex;flex-direction:column;align-items:flex-start;gap:4px;min-width:0;}
.filter-label{font-size:10px;color:#7899B3;font-weight:650;letter-spacing:.5px;white-space:nowrap;}
.select,.point-input {color:#DFF1FF;background:#0C223B;border:1px solid rgba(130,179,203,.23);border-radius:8px;}
.select{min-height:30px;padding:4px 24px 4px 10px;font-size:11px;max-width:150px;}
.global-filter .select{width:100%;min-width:105px;}
.topbar-right {display:flex;gap:13px;align-items:center;flex-shrink:0;}
.header-actions{display:flex;gap:5px;}
.header-icon-btn {height:34px;width:34px;border:1px solid rgba(148,200,226,.17);border-radius:9px;background:rgba(32,64,89,.39);color:#ADDDF3;font-size:18px;cursor:pointer;transition:.25s;}
.header-icon-btn:hover,.header-icon-btn[aria-pressed="true"]{background:rgba(55,216,247,.15);border-color:var(--cyan);color:#F8FFFF;}
.header-status{display:flex;align-items:center;gap:9px;border-left:1px solid var(--border);padding-left:14px;}
.header-status strong,.header-status .status-text {display:block;white-space:nowrap;}
.header-status strong{font-size:10px;letter-spacing:.4px;color:#E7F7FF;}
.header-status .status-text{font-size:9px;color:#7CA2BA;margin-top:4px;}
.status-dot{width:7px;height:7px;flex:none;}
.clock-wrap {border-left:1px solid var(--border);padding-left:14px;white-space:nowrap;}
.clock-label{font-size:8px;color:#698CA4;letter-spacing:1.7px;}
.clock{font-size:16px;font-weight:700;color:#DDFBFF;letter-spacing:1px;margin-top:4px;}
/* 三栏统一头部、滚动 */
.main {gap:12px;}
.sidebar {gap:11px;padding:0 2px 4px 0;scrollbar-gutter:stable;}
.leftbar,.rightbar {transition:width .26s ease,opacity .2s ease;}
.leftbar{width:var(--left-w);}
.rightbar{width:var(--right-w);}
.screen.layout-left-hidden .leftbar,.screen.layout-right-hidden .rightbar{width:0;min-width:0;flex-basis:0;opacity:0;overflow:hidden;padding:0;gap:0;}
.panel-heading{display:flex;gap:10px;align-items:center;min-height:40px;padding:0 3px 1px;flex:none;}
.panel-heading .heading-index{color:#43D6F2;font:700 11px Consolas,monospace;border:1px solid rgba(69,203,235,.35);border-radius:7px;padding:7px 8px;background:rgba(29,167,207,.08);}
.panel-heading strong{font-size:15px;color:#ECF8FF;display:block;letter-spacing:.2px;}
.panel-heading small{font-size:10px;color:#708FA8;display:block;margin-top:4px;}
.panel-heading .heading-dot{margin-left:auto;width:5px;height:5px;background:#38D9EF;border-radius:50%;box-shadow:0 0 10px #28C8EF;}
.point-row{gap:10px;margin-bottom:10px;}
.point-label {width:24px;height:24px;border-radius:8px;font-size:11px;box-shadow:none!important;}
.point-label.origin{background:rgba(66,226,165,.16);color:#6CF3BF;border:1px solid rgba(66,226,165,.35);}
.point-label.dest{background:rgba(255,187,96,.13);color:#FFE0AC;border:1px solid rgba(255,187,96,.35);}
.point-input{height:37px;font-size:12px;padding:8px 10px;min-width:0;}
.btn-minus{height:27px;width:27px;font-size:17px;border-radius:7px;}
.btn-add {min-height:35px;border-radius:8px;color:#7BDFEE;font-size:12px;background:rgba(55,216,247,.035);border-color:rgba(55,216,247,.24);margin-top:1px;}
.btn-add:hover{background:rgba(55,216,247,.10);}
.soft-note{color:#7898AD;font-size:10px;}
.panel-hint,.section-tip{font-size:10px;color:#7A9CB4;line-height:1.5;}
.panel-hint{margin-top:11px;}
.panel-hint span{color:var(--cyan);margin-right:4px;}
.section-tip{margin:-5px 0 8px;}
.preset-head {display:flex;justify-content:space-between;align-items:center;color:#8DACBE;font-size:11px;margin-bottom:9px;}
.text-link{border:0;background:none;color:#47D9F6;font-size:10px;cursor:pointer;}
.text-link:hover{text-decoration:underline;}
.preset-row{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;margin-bottom:17px;}
.preset-btn{height:32px;background:rgba(33,62,89,.52);color:#8FACBF;border:1px solid rgba(112,157,189,.19);border-radius:8px;font-size:11px;cursor:pointer;transition:.22s;}
.preset-btn:hover{color:white;border-color:rgba(55,216,247,.48);}
.preset-btn.is-active{color:#DFFAFF;border-color:rgba(55,216,247,.64);background:rgba(38,158,192,.18);box-shadow:inset 0 0 14px rgba(39,172,204,.08);}
.slider-group{margin-bottom:15px;}
.slider-group:last-child{margin-bottom:1px;}
.slider-head{font-size:12px;}
.slider-name{color:#AAC3D4;}
.slider-value{font-size:12px;color:#70EAF7;font-variant-numeric:tabular-nums;}
.slider{height:5px;background:rgba(89,123,160,.3);accent-color:var(--cyan);cursor:pointer;}
.slider::-webkit-slider-thumb{width:15px;height:15px;border:3px solid var(--cyan);box-shadow:0 0 0 5px rgba(55,216,247,.1);}
.btn-primary {flex-shrink:0;min-height:48px;border-radius:11px;color:#082438;font-size:14px;letter-spacing:.3px;background:linear-gradient(100deg,#40CEF5,#65E9DD);box-shadow:0 6px 24px rgba(36,193,215,.18);font-weight:800;}
.btn-primary:hover{transform:translateY(-2px);box-shadow:0 9px 28px rgba(36,193,215,.28);}
.generate-icon{font-size:18px;margin-right:8px;font-weight:600;}
.planning-state{font-size:11px;color:#8AA8BE;padding:1px 5px 4px;display:flex;align-items:center;gap:7px;flex-shrink:0;}
.planning-pulse{height:7px;width:7px;background:#42E2A5;border-radius:50%;box-shadow:0 0 10px #42E2A5;}
.order-summary{margin:0 0 11px;padding:10px 6px;gap:5px;background:rgba(35,80,107,.17);border:1px solid rgba(88,154,191,.14);}
.order-summary span{min-width:0;white-space:nowrap;font-size:10px;}
.order-summary b{font-size:11px;}
.order-list{max-height:150px;gap:6px;}
.order-item{border-radius:9px;padding:8px;background:#0E263E;border-color:rgba(125,170,191,.17);}
.order-num{background:rgba(255,187,96,.2);color:#FFCF80;border:1px solid rgba(255,187,96,.34);height:24px;width:24px;}
.order-drag{font-size:17px;color:#7397AA;}
.history-card{flex:0 0 auto;min-height:120px;}
.history-list{max-height:180px;}
.history-item{border:1px solid rgba(126,177,198,.14);border-radius:8px;padding:6px 10px;}
.history-entry{font-size:11px;line-height:1.6;overflow-wrap:anywhere;}
/* 地图重点呈现 */
.map-area{border-radius:16px;border:1px solid rgba(100,180,207,.3);box-shadow:0 8px 28px rgba(0,0,0,.3);min-height:350px;}
.map-area::after{position:absolute;content:"";inset:0;pointer-events:none;background:linear-gradient(180deg,rgba(4,21,35,.26),transparent 19%,transparent 79%,rgba(5,17,34,.30));z-index:402;}
.map-canvas{background:#102238;}
.map-context,.map-toolbar,.map-legend,.map-controls,.map-route-insight{z-index:900;}
.map-context{position:absolute;top:17px;left:17px;width:min(320px,calc(100% - 34px));padding:14px 17px;border-radius:12px;background:rgba(8,26,46,.91);pointer-events:none;}
.map-context-top{font:700 10px Consolas,monospace;letter-spacing:1.55px;color:#7BCDDC;display:flex;align-items:center;gap:7px;margin-bottom:9px;}
.map-live-dot{background:#50EDC0;width:6px;height:6px;border-radius:50%;box-shadow:0 0 9px #31E7C0;}
.map-context-badge{margin-left:auto;font:650 9px sans-serif;letter-spacing:.5px;color:#AAD8E9;border:1px solid rgba(97,181,211,.26);border-radius:4px;padding:4px 5px;}
.map-context strong{font-size:18px;line-height:1.3;color:#F2FDFF;letter-spacing:.4px;}
.map-context p{margin-top:10px;color:#B1CADD;font-size:11px;display:flex;align-items:center;gap:9px;}
.inline-sep{display:inline-block;width:3px;height:3px;background:#6B96B0;border-radius:50%;}
.map-toolbar{position:absolute;top:17px;right:17px;left:auto;transform:none;max-width:min(600px,calc(100% - 34px));width:auto;overflow:visible;padding:0;display:block;border-radius:12px;white-space:normal;background:rgba(8,26,46,.92);}
.toolbar-head{display:flex;align-items:center;gap:6px;padding:6px;}
.tool-group{display:flex;gap:2px;padding:3px;background:rgba(2,14,30,.48);border-radius:8px;}
.tool-btn{height:29px;font-size:11px;padding:4px 12px;color:#B0CBD8;border-radius:7px;white-space:nowrap;}
.tool-btn:hover{background:rgba(55,216,247,.10);color:#EFFFFF;}
.tool-btn.active{background:rgba(50,171,210,.23);color:#81EAFE;box-shadow:none;}
.tool-divider{height:20px;background:rgba(146,200,218,.2);}
.layer-trigger,.clear-trigger{border:1px solid transparent;}
.chevron{font-size:15px;margin-left:2px;}
.map-toolbar.layers-open .chevron{display:inline-block;transform:rotate(180deg);}
.toolbar-layers{display:none;grid-template-columns:repeat(2,minmax(135px,1fr));gap:15px 9px;padding:12px 16px 16px;border-top:1px solid rgba(135,181,211,.18);}
.map-toolbar.layers-open .toolbar-layers{display:grid;}
.layers-caption{grid-column:1/-1;font-size:11px;color:#DAEDFC;font-weight:700;display:flex;justify-content:space-between;}
.layers-caption span{font-weight:400;color:#668AA4;font-size:10px;}
.tool-switch{gap:8px;min-height:20px;}
.tool-label{font-size:11px;color:#B4CADA;}
.switch-input{display:block;position:absolute;width:28px;height:18px;opacity:0;cursor:pointer;}
.switch-input:focus-visible + .switch-track{outline:2px solid #9BFCFF;outline-offset:3px;}
.switch-track{height:16px;width:30px;flex-shrink:0;}
.switch-thumb{width:12px;height:12px;}
.switch-input:checked + .switch-track{background:#1688A4;box-shadow:none;}
.switch-input:checked + .switch-track .switch-thumb{left:16px;}
.map-legend{left:17px;bottom:18px;padding:12px 14px;min-width:150px;border-radius:11px;background:rgba(9,27,46,.89);}
.legend-title{font-weight:700;font-size:11px;color:#D8F1FC;margin-bottom:8px;}
.legend-title span{display:block;font-size:8px;color:#7197A8;letter-spacing:1px;margin-top:3px;}
.legend-row{font-size:10px;color:#B7CDD9;margin:5px 0;}
.legend-dot{height:7px;width:7px;box-shadow:none!important;}
.legend-dot.mid{background:var(--orange);}
.legend-row small{font-size:9px;line-height:1.5;color:#7894A5;max-width:140px;display:block;margin-top:4px;}
.map-controls{bottom:18px;right:18px;gap:5px;}
.map-ctrl{width:34px;height:34px;border-radius:10px;background:rgba(10,31,52,.91);font-weight:700;border-color:rgba(107,181,204,.26);color:#CEEAF6;box-shadow:0 5px 15px #010F1C4D;}
.map-route-insight{position:absolute;left:50%;bottom:18px;transform:translateX(-50%);display:flex;align-items:center;gap:12px;min-width:340px;max-width:calc(100% - 400px);border-radius:13px;padding:12px 16px;background:rgba(7,27,46,.93);}
.insight-icon{height:38px;width:38px;border-radius:10px;background:rgba(55,216,247,.11);color:var(--cyan);display:grid;place-items:center;font-size:24px;flex-shrink:0;}
.insight-copy{display:flex;flex-direction:column;gap:3px;min-width:0;}
.insight-copy small{color:#8AACBF;font-size:10px;}
.insight-copy strong{color:#EAF8FF;white-space:nowrap;font-size:13px;text-overflow:ellipsis;overflow:hidden;}
.insight-copy span{color:#A1C7D8;font-size:10px;white-space:nowrap;text-overflow:ellipsis;overflow:hidden;}
.insight-badge{font-size:10px;color:#54E5B2;background:rgba(37,178,135,.14);border:1px solid rgba(54,206,149,.26);padding:6px 9px;border-radius:8px;white-space:nowrap;margin-left:auto;}
/* 右侧指标、图表 */
.rightbar .kpi-row{gap:7px;flex:none;}
.kpi-card{text-align:left;padding:14px 11px 12px;min-width:0;}
.kpi-label{font-size:10px;margin-bottom:12px;color:#A0B9CB;white-space:nowrap;}
.kpi-value{font-size:23px;color:#EAFBFF;line-height:1.1;}
.kpi-value.danger{color:#FF7882;}.kpi-value.success{color:#5AE4B1;}
.kpi-unit{font-size:10px;}
.kpi-trend{font-size:9px;color:#779CAF!important;white-space:nowrap;margin-top:9px;}
.rightbar .chart-card {min-height:180px;flex:1 1 0;overflow:hidden;}
.chart-box{min-height:125px;}
/* 底部数据决策区 */
.bottombar {gap:12px;min-height:0;}
.bottombar>.card{padding:14px 17px;overflow:hidden;}
.compare-card{flex:1.08;min-width:0;position:relative;}
.compare-card .card-header{margin-bottom:7px;}
.route-mode-switch{display:flex;gap:5px;margin:0 0 7px;}
.route-mode-btn{font-size:10px;color:#8EAEC4;cursor:pointer;background:rgba(43,83,110,.18);border:1px solid rgba(114,166,197,.14);padding:5px 10px;border-radius:6px;}
.route-mode-btn:hover{color:#F5FFFF;}
.route-mode-btn.is-active{border-color:rgba(56,210,235,.45);background:rgba(31,150,191,.16);color:#A5EFFB;}
.compare-table{font-size:11px;table-layout:fixed;}
.compare-table td,.compare-table th{padding:4px 5px;border-bottom:1px solid rgba(134,180,199,.09);}
.compare-table th{font-size:10px;color:#9AB8CC;}
.compare-table tr:last-child td{border-bottom:0;}
.compare-table td:first-child{width:30%;}
.compare-table td.col-b{color:#5FE3BB;}
.compare-table th.col-a,.compare-table th.col-b {border-radius:5px;}
.compare-table th.active-route{box-shadow:none;border-bottom:2px solid #41D8F2;background:rgba(31,148,180,.12);}
.compare-card.col-a-active,.compare-card.col-b-active{border-color:rgba(104,166,198,.25);box-shadow:0 8px 30px rgba(1,8,18,.21);}
.conclusion{margin-top:6px;border:0;border-radius:7px;padding:7px 9px;font-size:10px;background:rgba(41,161,139,.11);color:#92ECD4;min-height:30px;}
.timeline-card{flex:1;min-width:0;justify-content:space-between;}
.timeline-head{gap:5px;flex-wrap:wrap;margin-bottom:8px;}
.timeline-stats{justify-content:flex-end;gap:5px;}
.ts-pill{padding:3px 7px;font-size:10px;border-color:rgba(128,176,199,.13);background:rgba(32,70,92,.20);border-radius:6px;white-space:nowrap;}
.ts-pill.warn{background:rgba(255,128,89,.07);border-color:rgba(255,151,110,.17);}
.ts-pill.warn b{color:#FEC18C;}
.timeline-time{font-size:17px;color:#D7FAFF;margin-left:8px;}
.timeline-peak-buttons{display:flex;gap:7px;margin:6px 0 8px;}
.timeline-peak-buttons button{flex:1;height:30px;background:rgba(31,74,104,.29);border:1px solid rgba(120,174,194,.20);border-radius:7px;color:#97B9CB;cursor:pointer;font-size:10px;}
.timeline-peak-buttons button:hover,.timeline-peak-buttons button.is-active{border-color:rgba(55,216,247,.48);color:#CFF8FF;background:rgba(37,160,188,.17);}
.timeline-body{gap:11px;min-height:48px;}
.play-btn{width:38px;height:38px;border-radius:11px;box-shadow:none;background:linear-gradient(135deg,#50CEF2,#63E4D1);}
.timeline-track-wrap{min-width:0;padding-top:8px;}
.timeline-peaks{top:9px;}
.timeline-ticks{margin-top:7px;}
.timeline-range{margin-top:0;}
.speed-select{width:62px;min-width:62px;}
.timeline-card.is-peak{border-color:rgba(255,187,96,.45);box-shadow:0 8px 30px rgba(1,8,18,.21);}
/* 加载和通知 */
#loading{background:#061326;gap:14px;}
.loader-ring{width:48px;height:48px;border-width:2px;}
.loader-text{font-size:11px;letter-spacing:1.3px;color:#A9DDEC;}
.toast{top:99px;border-color:rgba(62,204,232,.36);color:#E4F8FF;background:rgba(8,31,51,.97);}
.simulation-banner{font-size:9px;bottom:1px;right:20px;color:#7793A9;}
/* 大小屏与可访问性 */
@media(max-width:1700px){:root{--left-w:302px;--right-w:325px;--bottombar-h:242px;}.topbar-left{flex-basis:345px}.title{font-size:16px}.brand-subtitle{font-size:9px}.map-route-insight{min-width:300px}.kpi-card{padding:12px 8px}}
@media(max-width:1450px){:root{--left-w:270px;--right-w:292px;--bottombar-h:252px;}.screen{gap:9px;padding:9px}.main,.bottombar{gap:9px}.topbar{padding:0 13px;gap:10px}.topbar-left{flex-basis:290px;min-width:258px}.logo-icon{width:34px;height:34px;margin-right:8px}.title{font-size:14px}.brand-kicker{font-size:8px}.brand-subtitle{display:none}.header-status{display:none}.clock{font-size:13px}.global-filter .select{min-width:87px;max-width:116px;font-size:10px}.map-context{width:245px}.map-context strong{font-size:15px}.map-route-insight{max-width:calc(100% - 340px);min-width:240px;padding:9px}.kpi-value{font-size:19px}.card{padding:12px}.rightbar .chart-card{min-height:160px}.ts-pill{padding:2px 5px}.timeline-head{justify-content:flex-start}.timeline-stats{margin-left:auto}}
@media(max-width:1160px){.clock-wrap{display:none}.topbar-left{min-width:245px;flex-basis:245px}.title{font-size:13px}.global-filter .select{min-width:80px;max-width:100px}.rightbar{width:250px}.leftbar{width:245px}.map-route-insight{bottom:92px;max-width:calc(100% - 24px);width:calc(100% - 26px);min-width:0}.map-context{top:72px;width:235px}.map-toolbar{left:11px;right:11px;max-width:calc(100% - 22px)}.toolbar-head{justify-content:flex-end}.map-legend{bottom:17px}}
@media(max-width:950px){html,body{height:auto;overflow:auto}.screen{width:100%;height:auto;min-height:100vh}.topbar{height:auto;min-height:72px;flex-wrap:wrap;padding:14px;justify-content:space-between}.topbar-left{flex:1 1 350px}.topbar-center{order:3;flex:1 1 100%;justify-content:stretch;gap:8px}.global-filter{flex:1}.global-filter .select{max-width:none;width:100%}.topbar-right{margin-left:auto}.main{display:grid;grid-template-columns:minmax(0,1fr);grid-template-areas:'map' 'plan' 'analysis';height:auto;min-height:0}.map-area{grid-area:map;height:510px;min-height:510px}.leftbar{grid-area:plan}.rightbar{grid-area:analysis}.leftbar,.rightbar{width:100%!important;opacity:1!important;overflow:visible;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));align-content:start;gap:10px}.panel-heading{grid-column:1/-1}.leftbar>.btn-primary,.leftbar>.planning-state{grid-column:1/-1}.leftbar .history-card{grid-column:1/-1}.rightbar .kpi-row{grid-column:1/-1}.rightbar .chart-card{min-height:220px}.rightbar .chart-card:last-child{grid-column:1/-1}.screen.layout-left-hidden .leftbar,.screen.layout-right-hidden .rightbar{display:none;}.bottombar{height:auto;display:grid;grid-template-columns:1fr;min-height:0}.bottombar>.card{min-height:240px}.map-route-insight{bottom:16px;max-width:min(420px,calc(100% - 205px));width:auto;left:auto;right:60px;transform:none}.map-context{top:72px}.map-legend{max-width:150px}.header-actions{display:none}.simulation-banner{position:static;text-align:center;margin:0 auto 2px;font-size:9px;pointer-events:none}.toast{top:15px}}
@media(max-width:640px){.topbar-left{min-width:0;flex:1 1 100%}.title{font-size:15px;white-space:normal}.topbar-center{gap:7px}.filter-label{font-size:9px}.global-filter .select{padding:5px 3px;font-size:9px}.main{gap:9px}.map-area{height:480px;min-height:480px}.map-toolbar{top:10px;left:10px;right:10px}.tool-btn{font-size:10px;padding:5px 9px}.map-context{top:64px;left:10px;width:215px;padding:10px}.map-context strong{font-size:14px}.map-context p{font-size:10px}.map-legend{bottom:12px;left:10px;padding:8px;min-width:105px}.legend-row small{max-width:100px}.map-route-insight{left:10px;right:10px;bottom:105px;width:auto;max-width:none;min-width:0;padding:9px}.insight-copy strong{font-size:12px}.insight-icon{height:29px;width:29px;font-size:16px}.map-controls{right:10px;bottom:11px}.leftbar,.rightbar{display:flex;flex-direction:column}.rightbar .chart-card{min-height:240px}.panel-heading{min-height:35px}.bottombar>.card{padding:13px;min-height:230px}.timeline-stats{order:3;flex:1 1 100%;justify-content:flex-start;flex-wrap:wrap}.timeline-peak-buttons{flex-wrap:wrap}.timeline-peak-buttons button{font-size:9px}.route-mode-switch{gap:3px}.route-mode-btn{font-size:9px;padding:4px 8px}}
@media(prefers-reduced-motion:reduce){.btn-primary-glow{animation:none!important}}
/* 小屏精细修正：保留天气筛选，并错开放大的地图注释面板 */
@media(max-width:950px){
  .topbar-center .global-filter:nth-child(3){display:flex;}
  .screen.layout-left-hidden .leftbar,.screen.layout-right-hidden .rightbar{display:grid;}
}
@media(max-width:640px){
  .map-route-insight{bottom:149px;}
  .screen.layout-left-hidden .leftbar,.screen.layout-right-hidden .rightbar{display:flex;}
  .simulation-banner{font-size:9px;line-height:1.6;padding:8px 12px;color:#7793A9;}
}

/* 触屏和键盘均可调序：除了桌面拖拽，还提供上下移动按钮 */
.order-move{display:flex;gap:3px;align-items:center;margin-left:auto;}
.order-move-btn{width:25px;height:25px;border-radius:6px;border:1px solid rgba(117,169,194,.23);background:rgba(46,94,123,.24);color:#AED9E8;cursor:pointer;font-size:14px;}
.order-move-btn:hover:not(:disabled){background:rgba(55,216,247,.22);color:#fff;}
.order-move-btn:disabled{opacity:.28;}
.order-name{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
@media(max-width:950px){.screen.layout-left-hidden .leftbar,.screen.layout-right-hidden .rightbar{display:grid;overflow:visible;padding:0 2px 4px 0;gap:10px;}}
@media(max-width:640px){.screen.layout-left-hidden .leftbar,.screen.layout-right-hidden .rightbar{display:flex;}}