/* TD Logistics — statistics */
  .stats{display:flex;flex-direction:column;gap:16px}
  .st-empty{background:linear-gradient(180deg,var(--panel),var(--midnight));border:1px solid var(--line);
    border-radius:8px;padding:34px 20px;text-align:center;color:var(--slate);font-size:.88rem}
  .st-row{display:grid;gap:16px}
  .st-row.trend-row{grid-template-columns:1.7fr 1fr}
  .st-row.two{grid-template-columns:1fr 1fr}
  .st-row.three{grid-template-columns:1fr 1fr 1fr}
  .st-cardhead{display:flex;align-items:baseline;justify-content:space-between;gap:12px;flex-wrap:wrap;margin-bottom:4px}

  /* month picker */
  .st-head{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap}
  .st-months{display:flex;gap:8px;flex-wrap:wrap}
  .st-cap{font-family:var(--mono);font-size:.7rem;color:var(--slate)}
  .st-cap b{color:var(--parchment)}

  /* KPI cards */
  .kpi-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:14px}
  .kpi{background:var(--midnight);border:1px solid var(--line);border-radius:8px;padding:15px 16px;display:flex;flex-direction:column;gap:9px}
  .kpi .k{font-family:var(--mono);font-size:.6rem;letter-spacing:.12em;text-transform:uppercase;color:var(--slate)}
  .kpi .v{font-family:var(--display);font-size:1.45rem;color:var(--parchment);line-height:1}
  .kfoot{display:flex;align-items:flex-end;justify-content:space-between;gap:8px;margin-top:auto}
  .kd{font-family:var(--mono);font-size:.66rem}
  .kd.up{color:var(--emerald)} .kd.down{color:#e08a94}
  .spark{width:62px;height:20px;overflow:visible}
  .spark polyline{fill:none;stroke-width:1.6;opacity:.85}

  /* trend chart */
  .st-trend .trend{width:100%;height:auto;display:block;margin-top:4px}
  .tr-key{display:flex;gap:16px;font-family:var(--mono);font-size:.62rem;color:var(--slate)}
  .tr-key span::before{content:"";display:inline-block;width:11px;height:3px;border-radius:2px;margin-right:6px;vertical-align:middle}
  .tr-key .k-area::before{background:var(--gold);height:9px;border-radius:2px}
  .tr-key .k-line::before{background:var(--azure)}
  .tr-area{fill:rgba(212,175,55,.10);stroke:none}
  .tr-volline{fill:none;stroke:var(--gold);stroke-width:2}
  .tr-iskline{fill:none;stroke:var(--azure);stroke-width:1.7}
  .tr-guide{stroke:var(--gold-dim);stroke-width:1;stroke-dasharray:3 4;opacity:.7}
  .tr-dot{fill:var(--azure)}
  .tr-dot.sel{fill:var(--gold);stroke:var(--void);stroke-width:1.5}
  .tr-lab{fill:var(--slate);font-family:var(--mono);font-size:11px}
  .tr-lab.sel{fill:var(--gold)}

  /* donut / pie */
  .donut-wrap{display:flex;align-items:center;gap:24px;flex-wrap:wrap;margin-top:8px}
  .donut{width:150px;height:150px;border-radius:50%;flex:0 0 auto;position:relative}
  .donut-hole{position:absolute;inset:28px;border-radius:50%;background:var(--midnight);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px}
  .donut-hole span{font-family:var(--display);font-size:1.5rem;color:var(--parchment);line-height:1}
  .donut-hole small{font-family:var(--mono);font-size:.55rem;letter-spacing:.08em;text-transform:uppercase;color:var(--slate)}
  .donut-legend{display:flex;flex-direction:column;gap:11px;flex:1;min-width:150px}
  .donut-legend .lg{display:flex;align-items:center;gap:10px;font-size:.85rem;color:var(--slate)}
  .donut-legend .sw{width:11px;height:11px;border-radius:3px;flex:0 0 auto}
  .donut-legend .lv{margin-left:auto;font-family:var(--mono);font-size:.82rem;color:var(--parchment);text-align:right}
  .donut-legend .lv small{display:block;color:var(--slate);font-size:.62rem;margin-top:1px}

  /* on-time gauge */
  .st-gauge-card{align-items:center}
  .gauge{position:relative;width:150px;height:150px;margin:8px auto 0}
  .gauge svg{width:100%;height:100%}
  .g-track{fill:none;stroke:var(--line);stroke-width:10}
  .g-val{fill:none;stroke:var(--gold);stroke-width:10;stroke-linecap:round;filter:drop-shadow(0 0 6px rgba(212,175,55,.4))}
  .g-label{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px}
  .g-label b{font-family:var(--display);font-size:1.7rem;color:var(--gold);line-height:1}
  .g-label small{font-family:var(--mono);font-size:.58rem;letter-spacing:.1em;text-transform:uppercase;color:var(--slate)}

  /* horizontal bars (destinations / corps / pipeline) */
  .hbars{display:flex;flex-direction:column;gap:11px;margin-top:8px}
  .hb{display:grid;grid-template-columns:118px 1fr auto;gap:12px;align-items:center;font-family:var(--mono);font-size:.76rem;color:var(--slate)}
  .hb-l{color:var(--parchment);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .hb-track{background:var(--void2);border:1px solid var(--line-soft);border-radius:4px;height:10px;overflow:hidden}
  .hb-fill{height:100%;border-radius:4px 0 0 4px}
  .hb-v{color:var(--parchment);white-space:nowrap}
  .hb-v b{color:var(--gold)}
  .pipe-sum{font-family:var(--mono);font-size:.78rem;color:var(--slate);margin-top:2px}
  .pipe-sum b{color:var(--gold)}
  .live-tag{display:inline-flex;align-items:center;gap:7px;font-family:var(--mono);font-size:.6rem;letter-spacing:.1em;text-transform:uppercase;color:var(--emerald)}
  .live-tag .pulse{width:7px;height:7px;border-radius:50%;background:var(--emerald);animation:pulse 2.4s infinite}
  @keyframes pulse{0%,100%{opacity:1;transform:scale(1)}50%{opacity:.35;transform:scale(.7)}}

  /* routes table (with bar behind each row) */
  .st-table{width:100%;border-collapse:collapse;margin-top:6px}
  .st-table th{font-family:var(--mono);font-size:.58rem;letter-spacing:.12em;text-transform:uppercase;color:var(--slate);font-weight:500;text-align:right;padding:0 10px 10px}
  .st-table th:first-child{text-align:left}
  .st-table td{padding:9px 10px;border-top:1px solid var(--line-soft);font-family:var(--mono);font-size:.8rem;color:var(--slate);text-align:right}
  .st-table td:first-child{text-align:left}
  .st-table .num{color:var(--gold)}
  .st-table .route{color:var(--parchment)}
  .rt-bar{position:relative}
  .rt-bar::before{content:"";position:absolute;left:0;top:5px;bottom:5px;width:var(--w);z-index:0;border-radius:4px;
    background:linear-gradient(90deg,rgba(212,175,55,.16),rgba(212,175,55,0))}
  .rt-bar .route{position:relative;z-index:1}

  /* activity heatmap */
  .heat{display:flex;flex-direction:column;gap:3px;margin-top:8px;overflow-x:auto}
  .heat-row{display:grid;grid-template-columns:34px repeat(24,minmax(9px,1fr));gap:3px;align-items:center}
  .heat-day{font-family:var(--mono);font-size:.6rem;color:var(--slate)}
  .heat-cell{height:15px;border-radius:2px}
  .heat-row.axis{margin-top:3px}
  .heat-hr{font-family:var(--mono);font-size:.52rem;color:var(--slate-dim)}
  .heat-scale{display:flex;align-items:center;gap:4px;font-family:var(--mono);font-size:.58rem;color:var(--slate)}
  .heat-scale span[class^=hs]{width:13px;height:13px;border-radius:2px}
  .hs0{background:rgba(212,175,55,.09)} .hs1{background:rgba(212,175,55,.33)} .hs2{background:rgba(212,175,55,.62)} .hs3{background:rgba(212,175,55,.92)}

  @media(max-width:1000px){ .st-row.three{grid-template-columns:1fr 1fr} .kpi-grid{grid-template-columns:repeat(3,1fr)} }
  @media(max-width:820px){ .st-row.trend-row,.st-row.two,.st-row.three{grid-template-columns:1fr} }
  @media(max-width:560px){ .kpi-grid{grid-template-columns:repeat(2,1fr)} .hb{grid-template-columns:96px 1fr auto} }
