/* Radar Česka · Train Core CZ · V0.4.2.2
   Isolated train UI with module-specific selectors. */

.app-shell[data-mode="trains"] .weather-layer-deck,
.app-shell[data-mode="trains"] .traffic-view-nav,
.app-shell[data-mode="trains"] .traffic-overview,
.app-shell[data-mode="trains"] .traffic-incident-card,
.app-shell[data-mode="trains"] .traffic-layer-panel,
.app-shell[data-mode="trains"] .timeline-shell,
.app-shell[data-mode="trains"] .live-feed,
.app-shell[data-mode="trains"] .live-feed-chip,
.app-shell[data-mode="trains"] .model-legend,
.app-shell[data-mode="trains"] .place-card,
.app-shell[data-mode="trains"] .model-point-card,
.app-shell[data-mode="trains"] .warning-card,
.app-shell[data-mode="trains"] .alert-center,
.app-shell[data-mode="trains"] .mobile-sheet,
.app-shell[data-mode="trains"] .mobile-weather-nav,
.app-shell[data-mode="trains"] .mobile-traffic-nav { display:none; }

.app-shell[data-mode="trains"] #alertBtn{display:none}

.train-view-nav{
  position:relative;z-index:13;margin-top:7px;
  display:flex;align-items:center;gap:5px;width:max-content;max-width:calc(100vw - 390px);
  padding:3px 4px;border:1px solid rgba(20,73,82,.10);border-radius:14px;
  background:rgba(255,255,255,.93);box-shadow:0 8px 22px rgba(26,58,65,.075);
  backdrop-filter:blur(18px) saturate(135%);pointer-events:auto;overflow-x:auto;scrollbar-width:none;
}
.train-view-nav::-webkit-scrollbar{display:none}
@media (min-width:1280px){.train-view-nav{max-width:calc(100vw - 390px)}}
@media (min-width:1680px){.train-view-nav{max-width:1500px}}
.train-tab{
  appearance:none;border:0;min-width:82px;height:34px;padding:3px 8px;border-radius:11px;background:transparent;color:#58717a;
  display:grid;grid-template-columns:22px auto;grid-template-rows:auto auto;column-gap:7px;text-align:left;cursor:pointer;
  transition:background .16s ease,color .16s ease,box-shadow .16s ease;
}
.train-tab>span{grid-row:1/3;align-self:center;display:grid;place-items:center;min-width:19px;height:19px;border-radius:6px;background:#eaf5fb;color:#347ea1;font-size:10px;font-weight:900}
.train-tab>b{font-size:9px;line-height:1.05;white-space:nowrap;color:#25464d}.train-tab>small{font-size:6.6px;line-height:1.1;white-space:nowrap;color:#8b9da2}
.train-tab:hover{background:#f2f8fb}.train-tab.is-active{background:#eaf6fb;box-shadow:inset 0 0 0 1px #c8e5f1;color:#24627f}.train-tab.is-active>span{background:#d8eff8;color:#126f98}

.train-overview{
  position:absolute;z-index:12;top:174px;right:70px;width:306px;padding:13px;border:1px solid rgba(19,74,83,.12);border-radius:19px;
  background:rgba(255,255,255,.95);box-shadow:0 14px 42px rgba(26,58,65,.12);backdrop-filter:blur(20px) saturate(140%);
}
.train-overview-head{display:flex;align-items:flex-start;justify-content:space-between;gap:10px;margin-bottom:10px}.train-overview-head>div{display:grid;gap:3px}
.train-overview-head small{font-size:8px;letter-spacing:.07em;text-transform:uppercase;font-weight:850;color:#8098a2}.train-overview-head strong{font-size:15px;letter-spacing:-.02em;color:#183942}
.train-overview-actions{display:flex;gap:5px}.train-overview-actions button{width:28px;height:28px;border:1px solid #d9e6e8;border-radius:9px;background:#fff;color:#5f777e;cursor:pointer;font-size:14px}
.train-status-badge{display:inline-flex;align-items:center;gap:6px;width:max-content;padding:5px 8px;border-radius:999px;background:#edf6fa;color:#477184;font-size:8px;font-weight:850}
.train-status-badge::before{content:"";width:7px;height:7px;border-radius:50%;background:#5da9c9}.train-status-badge[data-state="live"]{background:#e7f8f2;color:#167360}.train-status-badge[data-state="live"]::before{background:#12b891;box-shadow:0 0 0 4px rgba(18,184,145,.09)}
.train-status-badge[data-state="waiting"]{background:#f3f5f6;color:#7c8e94}.train-status-badge[data-state="waiting"]::before{background:#a8b6ba}
.train-overview-text{margin:10px 0 12px;color:#60777e;font-size:10px;line-height:1.45}.train-overview-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:6px}
.train-stat{padding:8px 5px;border-radius:11px;background:#f5f9fb;text-align:center}.train-stat span{display:block;font-size:7px;color:#84989e;margin-bottom:2px}.train-stat strong{font-size:13px;color:#294c54}
.train-overview-list{display:grid;gap:5px;margin-top:9px;max-height:235px;overflow:auto;overscroll-behavior:contain;scrollbar-width:thin}
.train-overview-item{width:100%;border:1px solid #dfeaed;border-radius:11px;background:#f8fbfc;padding:8px;display:grid;grid-template-columns:30px minmax(0,1fr) auto;gap:7px;align-items:center;text-align:left;cursor:pointer;color:#35565d;transition:background .15s ease,border-color .15s ease,transform .15s ease}
.train-overview-item:hover{background:#eff8fb;border-color:#cce4ed;transform:translateY(-1px)}
.train-overview-item.is-selected{background:#edf9f6;border-color:#9edbcd;box-shadow:inset 3px 0 0 #18a98b}
.train-overview-item.is-selected .train-overview-item-icon{background:#dff5ef;color:#14745f}
.train-overview-item-icon{display:grid;place-items:center;width:30px;height:25px;border-radius:8px;background:#e8f5fa;color:#26799d;font-size:9px;font-weight:900;white-space:nowrap;overflow:hidden}
.train-overview-item-copy{min-width:0;display:grid;gap:2px}.train-overview-item-copy b{font-size:8.6px;line-height:1.2;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:#294e56}.train-overview-item-copy small{font-size:7.3px;color:#8b9da2;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.train-overview-item-delay{font-size:8px;font-weight:900;padding:4px 6px;border-radius:999px;background:#eaf6ef;color:#227554}.train-overview-item-delay[data-delay="minor"]{background:#fff7d9;color:#8a6b13}.train-overview-item-delay[data-delay="major"]{background:#fff0dc;color:#9a5c16}.train-overview-item-delay[data-delay="critical"]{background:#ffe7e7;color:#a43e47}.train-overview-item-delay[data-delay="unknown"]{background:#edf2f3;color:#788b91}
.train-overview-empty{padding:10px;border-radius:10px;background:#f6f9fa;color:#81949b;font-size:8px;line-height:1.45}.train-overview-more{width:100%;height:32px;margin-top:7px;border:1px solid #d9e8eb;border-radius:10px;background:#fff;color:#2c758e;font-size:8px;font-weight:850;cursor:pointer;transition:background .15s ease,border-color .15s ease}.train-overview-more:hover{background:#eef8fb;border-color:#c7e2ea}.train-overview-more[hidden]{display:none}.train-overview-foot{display:flex;justify-content:space-between;gap:8px;margin-top:10px;padding-top:9px;border-top:1px solid rgba(24,62,70,.08);font-size:7.5px;color:#8a9ca1}

.train-detail-card{
  position:absolute;z-index:17;top:174px;left:20px;width:360px;max-height:calc(100dvh - 260px);overflow:auto;overscroll-behavior:contain;scrollbar-width:thin;padding:17px;border:1px solid rgba(22,72,79,.13);border-left:4px solid #5aa9c7;border-radius:20px;
  background:rgba(255,255,255,.97);box-shadow:0 16px 44px rgba(26,58,65,.14);backdrop-filter:blur(22px) saturate(145%);
}
.train-detail-card[data-delay-state="critical"]{border-left-color:#dc4550}.train-detail-card[data-delay-state="major"]{border-left-color:#e98337}.train-detail-card[data-delay-state="minor"]{border-left-color:#d9aa2c}.train-detail-card[data-delay-state="ontime"]{border-left-color:#38a978}
.train-detail-card .card-close{position:absolute;right:12px;top:11px}.train-detail-kicker{display:flex;align-items:center;gap:7px;padding-right:28px;font-size:8px;font-weight:900;letter-spacing:.065em;text-transform:uppercase;color:#557e91}
.train-detail-glyph{display:grid;place-items:center;width:20px;height:20px;border-radius:6px;background:#e9f5fa;color:#287b9e}.train-detail-card h2{margin:8px 28px 5px 0;font-size:20px;line-height:1.14;letter-spacing:-.025em;color:#183942}
.train-detail-card p{margin:0 0 11px;font-size:10.5px;line-height:1.45;color:#60777e}.train-detail-delay{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:10px 11px;margin-bottom:7px;border-radius:12px;background:#f2f8fa;font-size:8px;color:#789097}.train-detail-delay strong{font-size:14px;color:#214f61}
.train-detail-meta-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px}.train-detail-meta[hidden]{display:none}.train-detail-meta{display:flex;align-items:center;justify-content:space-between;gap:8px;min-width:0;padding:8px 9px;border-radius:11px;background:#f5f8f9;font-size:8px;color:#809298}.train-detail-meta.is-wide,#trainDetailFinalRow,#trainDetailLastRow{grid-column:1/-1}.train-detail-meta span{flex:0 0 auto}.train-detail-meta strong{min-width:0;max-width:68%;font-size:9px;line-height:1.25;color:#31535a;text-align:right;overflow-wrap:anywhere}#trainDetailFinalRow{background:#edf8f5}#trainDetailFinalRow strong{color:#176c5c;font-size:9.5px}#trainDetailLastRow{background:#f3f8fa}
.train-detail-note{margin:5px 2px 0;font-size:6.4px;line-height:1.3;color:#9aa8ac}
.train-journey{margin-top:11px;padding:10px 10px 9px;border:1px solid rgba(24,86,91,.09);border-radius:14px;background:#fbfdfd}
.train-journey[hidden]{display:none}.train-journey-head{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:7px}.train-journey-head span{font-size:8.5px;font-weight:900;color:#294f57}.train-journey-head strong{font-size:7.5px;font-weight:850;color:#5f7b81;background:#edf5f6;border-radius:999px;padding:4px 7px;white-space:nowrap}
.train-journey-list{display:grid}.train-journey-stop{display:grid;grid-template-columns:16px minmax(0,1fr) auto;gap:7px;min-height:37px;align-items:center;position:relative}.train-journey-rail{position:relative;align-self:stretch;display:flex;justify-content:center}.train-journey-rail::before{content:"";position:absolute;top:0;bottom:0;width:2px;background:#dce9e9}.train-journey-stop:first-child .train-journey-rail::before{top:50%}.train-journey-stop:last-child .train-journey-rail::before{bottom:50%}.train-journey-dot{position:relative;z-index:1;align-self:center;width:7px;height:7px;border-radius:50%;background:#9bb5ba;box-shadow:0 0 0 3px #fbfdfd}.train-journey-stop.is-current .train-journey-dot{background:#2d8bab}.train-journey-stop.is-next .train-journey-dot{background:#33a985}.train-journey-stop.is-destination .train-journey-dot{width:9px;height:9px;background:#13a487;box-shadow:0 0 0 3px #ddf4ed}
.train-journey-copy{min-width:0;display:grid;gap:1px}.train-journey-copy b{font-size:8.7px;line-height:1.2;color:#315159;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.train-journey-copy small{font-size:6.8px;color:#94a4a8}.train-journey-stop.is-destination .train-journey-copy b{color:#176d5d}.train-journey-times{display:grid;justify-items:end;gap:1px;white-space:nowrap}.train-journey-times span{font-size:6.7px;color:#92a2a6}.train-journey-times strong{font-size:8.2px;color:#24715f}.train-journey-gap{margin:2px 0 3px 23px;padding:4px 7px;border-radius:8px;background:#f3f7f8;color:#83979c;font-size:6.9px}
.train-journey-note{margin:5px 0 0;padding-top:5px;border-top:1px solid rgba(24,62,70,.055);font-size:6.1px;line-height:1.3;color:#9aa7aa}.train-journey-note[hidden]{display:none}
.train-detail-foot{display:flex;justify-content:space-between;gap:8px;margin-top:10px;padding-top:9px;border-top:1px solid rgba(24,62,70,.08);font-size:7.5px;color:#8a9ca1}

.train-layer-panel{position:absolute;z-index:24;top:174px;right:70px;width:320px;padding:14px;border:1px solid rgba(20,70,78,.12);border-radius:18px;background:rgba(255,255,255,.97);box-shadow:0 18px 48px rgba(24,58,65,.16);backdrop-filter:blur(20px) saturate(140%)}
.train-layer-panel-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;margin-bottom:9px}.train-layer-panel-head>div{display:grid;gap:2px}.train-layer-panel-head small{font-size:8px;font-weight:900;letter-spacing:.08em;color:#3c84a1}.train-layer-panel-head strong{font-size:15px;color:#1d4149}.train-layer-panel-head button{width:28px;height:28px;border:1px solid #d9e5e7;border-radius:9px;background:#fff;color:#60777e;cursor:pointer}
.train-layer-panel-copy{font-size:9px;line-height:1.45;color:#6e8389;margin-bottom:10px}.train-layer-panel-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:6px}.train-layer-panel-grid button{border:1px solid #e0eaed;border-radius:11px;background:#f8fbfc;color:#577079;min-height:48px;display:grid;place-items:center;gap:2px;cursor:pointer;font-size:8px;font-weight:800}.train-layer-panel-grid button span{font-size:11px;color:#337f9f}.train-layer-panel-grid button.is-active{background:#eaf6fb;border-color:#c6e3ee;color:#245f78}.train-layer-refresh{width:100%;margin-top:9px;height:36px;border:1px solid #d7e5e7;border-radius:10px;background:#fff;color:#28695e;font-size:9px;font-weight:850;cursor:pointer}.train-layer-source{display:grid;gap:3px;margin-top:9px;padding-top:8px;border-top:1px solid rgba(21,61,69,.08);font-size:7.5px;color:#8b9da2}.train-layer-source span{color:#536f75;font-weight:750}

.mobile-train-nav{display:none}
.train-view-nav[hidden],.train-overview[hidden],.train-detail-card[hidden],.train-layer-panel[hidden]{display:none}

@media(max-width:1100px){.train-view-nav{max-width:calc(100% - 40px)}.train-overview{right:18px}}
@media(max-width:700px){
  .app-shell[data-mode="trains"] .top-shell{padding-bottom:0}
  .train-view-nav{display:none}.train-overview{top:auto;right:10px;left:10px;bottom:78px;width:auto;border-radius:18px;padding:11px}.train-overview-list{max-height:175px}.train-overview-text{margin:7px 0 9px;font-size:9px}
  .train-detail-card{top:auto;left:10px;right:10px;bottom:78px;width:auto;padding:14px;border-radius:18px}.train-detail-card h2{font-size:17px}
  .train-layer-panel{top:auto;left:10px;right:10px;bottom:78px;width:auto}.train-layer-panel-grid{grid-template-columns:repeat(3,1fr)}
  .mobile-train-nav{position:absolute;z-index:20;left:0;right:0;bottom:0;display:flex;height:66px;padding:6px max(6px,env(safe-area-inset-right)) calc(6px + env(safe-area-inset-bottom)) max(6px,env(safe-area-inset-left));background:rgba(255,255,255,.96);border-top:1px solid rgba(20,68,75,.09);backdrop-filter:blur(18px);overflow-x:auto;scrollbar-width:none}
  .mobile-train-nav[hidden]{display:none}.mobile-train-nav::-webkit-scrollbar{display:none}.mobile-train-btn{flex:0 0 76px;border:0;background:transparent;border-radius:13px;color:#617a80;display:grid;place-items:center;gap:2px;font-size:8px;font-weight:800;cursor:pointer}.mobile-train-btn span{font-size:12px;font-weight:900;color:#337e9e}.mobile-train-btn.is-active{background:#eaf6fb;color:#245f78}
}

/* v0.4.3.9n · Train menu polish — same visual grammar as Doprava */
.train-view-nav.train-legend-bar{
  width:min(930px,calc(100vw - 40px));
  max-width:none;
  min-height:58px;
  margin-top:8px;
  padding:4px 6px;
  gap:2px;
  border-radius:17px;
  border-color:rgba(20,68,76,.10);
  background:rgba(255,255,255,.965);
  box-shadow:0 10px 28px rgba(24,58,65,.09);
  overflow-x:auto;
  overflow-y:hidden;
}
.train-view-nav.train-legend-bar .train-tab{
  --train-tab-accent:#1594b8;
  --train-tab-soft:#edf8fc;
  --train-tab-border:#cce8f1;
  position:relative;
  flex:1 0 150px;
  min-width:150px;
  height:50px;
  padding:5px 9px;
  border-radius:12px;
  display:grid;
  grid-template-columns:30px minmax(0,1fr) auto;
  grid-template-rows:1fr;
  column-gap:8px;
  align-items:center;
  background:transparent;
  color:#3e5e66;
  text-align:left;
  box-shadow:none;
}
.train-view-nav .train-tab[data-train-tone="overview"]{--train-tab-accent:#1594b8;--train-tab-soft:#edf8fc;--train-tab-border:#cce8f1}
.train-view-nav .train-tab[data-train-tone="ontime"]{--train-tab-accent:#169c73;--train-tab-soft:#eaf9f3;--train-tab-border:#c5eadc}
.train-view-nav .train-tab[data-train-tone="delay5"]{--train-tab-accent:#d4a01e;--train-tab-soft:#fff8df;--train-tab-border:#f0dfaa}
.train-view-nav .train-tab[data-train-tone="delay15"]{--train-tab-accent:#e57930;--train-tab-soft:#fff1e7;--train-tab-border:#f2ceb4}
.train-view-nav .train-tab[data-train-tone="region"]{--train-tab-accent:#347fa2;--train-tab-soft:#eef7fb;--train-tab-border:#c9e3ee;flex-basis:178px;min-width:178px}
.train-view-nav.train-legend-bar .train-tab:hover{background:#f7fafb}
.train-view-nav.train-legend-bar .train-tab.is-active,
.train-view-nav.train-legend-bar .train-region-trigger[data-has-region="1"]{
  background:var(--train-tab-soft);
  color:#244750;
  box-shadow:inset 0 0 0 1px var(--train-tab-border);
}
.train-view-nav.train-legend-bar .train-tab.is-active:after,
.train-view-nav.train-legend-bar .train-region-trigger[data-has-region="1"]:after{
  content:"";
  position:absolute;
  left:10px;right:10px;bottom:0;
  height:2px;
  border-radius:2px;
  background:var(--train-tab-accent);
}
/* Important: the old base rule .train-tab>span targets BOTH spans. Reset the copy
   explicitly, otherwise icon/copy are auto-placed into the wrong grid columns. */
.train-view-nav.train-legend-bar .train-tab>.train-tab-symbol{
  grid-row:auto;
  grid-column:auto;
  align-self:center;
  width:29px;
  min-width:29px;
  height:29px;
  padding:0;
  display:grid;
  place-items:center;
  border-radius:10px;
  background:var(--train-tab-soft);
  color:var(--train-tab-accent);
  font-size:initial;
  font-weight:900;
}
.train-view-nav.train-legend-bar .train-tab>.train-tab-symbol svg{
  width:18px;
  height:18px;
  display:block;
  fill:none;
  stroke:currentColor;
  stroke-width:1.8;
  stroke-linecap:round;
  stroke-linejoin:round;
}
.train-view-nav.train-legend-bar .train-tab>.train-tab-copy{
  grid-row:auto;
  grid-column:auto;
  align-self:center;
  min-width:0;
  width:auto;
  height:auto;
  padding:0;
  border-radius:0;
  background:transparent;
  color:inherit;
  display:grid;
  place-items:initial;
  gap:2px;
  font-size:initial;
  font-weight:inherit;
}
.train-view-nav.train-legend-bar .train-tab-copy b{
  font-size:9.4px;
  line-height:1.05;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
  color:#23464e;
  font-weight:900;
}
.train-view-nav.train-legend-bar .train-tab-copy small{
  font-size:6.8px;
  line-height:1.15;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
  color:#82969c;
}
.train-view-nav.train-legend-bar .train-tab-count{
  min-width:23px;
  padding:3px 5px;
  border-radius:999px;
  background:var(--train-tab-soft);
  color:var(--train-tab-accent);
  font-size:7px;
  font-style:normal;
  font-weight:900;
  text-align:center;
  letter-spacing:-.01em;
}
.train-view-nav.train-legend-bar .train-tab.is-active .train-tab-symbol,
.train-view-nav.train-legend-bar .train-tab.is-active .train-tab-count,
.train-view-nav.train-legend-bar .train-region-trigger[data-has-region="1"] .train-tab-symbol{
  background:rgba(255,255,255,.70);
}
.train-region-caret{
  font-style:normal;
  font-size:12px;
  color:#718a91;
  transition:transform .16s ease;
}
.train-region-trigger[aria-expanded="true"] .train-region-caret{transform:rotate(180deg)}

.train-layer-panel{width:390px;padding:14px}
.train-layer-panel-head small{color:#347fa2}
.train-region-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}
.train-region-grid button{
  min-height:62px;padding:7px 6px;border:1px solid #e0eaed;border-radius:11px;background:#f8fbfc;
  color:#577079;display:grid;grid-template-columns:26px minmax(0,1fr);grid-template-rows:auto auto;
  place-items:initial;align-items:center;column-gap:7px;text-align:left;cursor:pointer;
}
.train-region-grid button>span{grid-row:1/3;display:grid;place-items:center;width:25px;height:25px;border-radius:8px;background:#e8f5fa;color:#26799d;font-size:9px;font-weight:900}
.train-region-grid button>b{font-size:8.3px;line-height:1.12;color:#31545d;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.train-region-grid button>small{font-size:6.6px;line-height:1.1;color:#8b9da2;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.train-region-grid button:hover{background:#f0f8fb;border-color:#cfe4ec}
.train-region-grid button.is-active{background:#eaf6fb;border-color:#bcdfea;color:#245f78;box-shadow:inset 0 0 0 1px rgba(52,127,162,.06)}
.train-region-grid button.is-active>span{background:#d7eff8;color:#126f98}

@media(max-width:1500px){
  .train-view-nav.train-legend-bar{width:min(850px,calc(100vw - 36px))}
  .train-view-nav.train-legend-bar .train-tab{min-width:136px;padding-left:7px;padding-right:7px;column-gap:6px}
  .train-view-nav .train-tab[data-train-tone="region"]{min-width:164px;flex-basis:164px}
}
@media(max-width:1100px){
  .train-view-nav.train-legend-bar{width:calc(100vw - 36px)}
  .train-view-nav.train-legend-bar .train-tab{flex:1 0 132px;min-width:132px}
}

@media(max-width:700px){
  .train-view-nav.train-legend-bar{display:none}
  .train-layer-panel{
    top:auto;left:8px;right:8px;bottom:76px;width:auto;max-height:min(68dvh,560px);overflow:auto;
    padding:13px;border-radius:19px;box-shadow:0 18px 56px rgba(20,53,60,.22);
  }
  .train-layer-panel-copy{font-size:8.5px;line-height:1.4;margin-bottom:9px}
  .train-region-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:6px}
  .train-region-grid button{min-height:54px;padding:6px}
  .train-region-grid button>b{font-size:8.2px}
  .train-region-grid button>small{font-size:6.5px}
  .mobile-train-nav{
    height:68px;padding:5px max(6px,env(safe-area-inset-right)) calc(5px + env(safe-area-inset-bottom)) max(6px,env(safe-area-inset-left));
    gap:3px;overflow:visible;
  }
  .mobile-train-btn{
    flex:1 1 20%;min-width:0;height:52px;border-radius:13px;display:grid;grid-template-rows:24px auto;
    place-items:center;gap:1px;font-size:initial;color:#617a80;
  }
  .mobile-train-btn span{display:grid;place-items:center;min-width:25px;height:23px;padding:0 4px;border-radius:8px;background:#eaf5fb;color:#337e9e;font-size:10px;font-weight:900}
  .mobile-train-btn b{max-width:100%;font-size:7.7px;line-height:1.05;font-weight:850;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:inherit}
  .mobile-train-btn.is-active{background:#eaf6fb;color:#245f78}
  .mobile-train-btn.is-active span{background:#d7eff8;color:#126f98}
  .mobile-train-region-btn[data-has-region="1"]{background:#eef7fb;color:#245f78;box-shadow:inset 0 0 0 1px #c9e3ee}
  .mobile-train-region-btn[data-has-region="1"] span{background:#d7eff8;color:#126f98}
  .train-overview,.train-detail-card{bottom:80px}
}

/* mobile tone polish */
@media(max-width:700px){
  .mobile-train-btn{transition:background .15s ease,color .15s ease,box-shadow .15s ease}
  .mobile-train-btn[data-train-filter="ontime"].is-active{background:#eaf9f3;color:#166f57;box-shadow:inset 0 0 0 1px #c5eadc}
  .mobile-train-btn[data-train-filter="ontime"].is-active span{background:#d8f2e8;color:#169c73}
  .mobile-train-btn[data-train-filter="delay5"].is-active{background:#fff8df;color:#856512;box-shadow:inset 0 0 0 1px #f0dfaa}
  .mobile-train-btn[data-train-filter="delay5"].is-active span{background:#fff0bd;color:#c69210}
  .mobile-train-btn[data-train-filter="delay15"].is-active{background:#fff1e7;color:#9b5424;box-shadow:inset 0 0 0 1px #f2ceb4}
  .mobile-train-btn[data-train-filter="delay15"].is-active span{background:#ffe2cf;color:#df6f27}
}

/* v0.4.3.9u · TRAIN MOBILE SHEET BASE */
@media(max-width:700px){
  .train-detail-card{
    left:7px!important;right:7px!important;bottom:calc(62px + env(safe-area-inset-bottom))!important;
    width:auto!important;max-height:min(64dvh,550px)!important;padding:10px 10px 8px!important;
    border-radius:17px!important;overflow-y:auto!important;overscroll-behavior:contain!important;-webkit-overflow-scrolling:touch;
    box-shadow:0 14px 42px rgba(23,54,62,.17)!important;
  }
  .train-detail-card .card-close{
    right:8px!important;top:8px!important;width:29px!important;height:29px!important;display:grid!important;place-items:center!important;
    border:1px solid rgba(25,67,74,.08)!important;border-radius:10px!important;background:#f7fafa!important;
    padding:0!important;font-size:17px!important;line-height:1!important;
  }
  .train-detail-kicker{gap:5px!important;font-size:6.8px!important;letter-spacing:.055em!important}
  .train-detail-glyph{width:19px!important;height:19px!important;border-radius:6px!important}
  .train-detail-card h2{font-size:15.5px!important;line-height:1.1!important}
  .train-detail-card p#trainDetailRoute{margin-bottom:5px!important;font-size:7.8px!important;line-height:1.2!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important}
  .train-detail-primary-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:4px!important}
  .train-detail-primary-grid #trainDetailFinalRow,
  .train-detail-primary-grid #trainDetailLastRow{grid-column:auto!important}
  .train-detail-primary-grid .train-detail-meta{min-height:36px!important;padding:5px 7px!important;border-radius:9px!important}
  .train-detail-primary-grid .train-detail-meta span{font-size:6.2px!important}
  .train-detail-primary-grid .train-detail-meta strong{max-width:62%!important;font-size:7.8px!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important}
  .train-detail-quick-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:4px!important;margin-top:4px!important}
  .train-detail-quick-grid .train-detail-meta{min-height:38px!important;padding:5px 7px!important;border-radius:9px!important}
  .train-detail-quick-grid .train-detail-meta span{font-size:5.9px!important}.train-detail-quick-grid .train-detail-meta strong{font-size:7.8px!important}
  .train-detail-foot{margin-top:5px!important;padding-top:5px!important;font-size:5.8px!important}

  .train-overview{
    left:7px!important;right:7px!important;bottom:calc(62px + env(safe-area-inset-bottom))!important;
    max-height:min(49dvh,420px)!important;padding:9px!important;border-radius:17px!important;overflow-y:auto!important;
  }
  .train-overview-head{margin-bottom:6px!important}.train-overview-head strong{font-size:13px!important}.train-overview-head small{font-size:6.8px!important}
  .train-overview-actions button{width:25px!important;height:25px!important;border-radius:8px!important}
  .train-status-badge{padding:4px 7px!important;font-size:7px!important}
  .train-overview-text{margin:5px 0 6px!important;font-size:7.7px!important;line-height:1.3!important}
  .train-overview-grid{gap:4px!important}.train-stat{padding:5px 3px!important;border-radius:8px!important}.train-stat span{font-size:5.9px!important}.train-stat strong{font-size:10px!important}
  .train-overview-list{max-height:130px!important;gap:4px!important}.train-overview-item{min-height:39px!important;padding:5px 6px!important;border-radius:9px!important}
  .train-overview-foot{margin-top:5px!important;padding-top:5px!important;font-size:5.8px!important}

  .mobile-train-nav{
    height:calc(58px + env(safe-area-inset-bottom))!important;
    padding:4px max(5px,env(safe-area-inset-right)) env(safe-area-inset-bottom) max(5px,env(safe-area-inset-left))!important;
    gap:2px!important;
  }
  .mobile-train-btn{height:50px!important;border-radius:11px!important;grid-template-rows:22px auto!important}
  .mobile-train-btn span{min-width:23px!important;height:21px!important;font-size:9px!important}.mobile-train-btn b{font-size:7px!important}
}
