/* Linked map and stop inspector; browsing never changes the boarding place. */
body[data-stops-review] .screen-content { overflow: hidden; }
body[data-stops-review] .stop-choice { margin-bottom: 8px; }
body[data-stops-review] .stop-choice > div { display: flex; align-items: center; gap: 12px; }
body[data-stops-review] .picker-field { flex: 1; }
body[data-stops-review] .picker-face .place-name { font-size: 18px; }
body[data-stops-review] .picker-face .stop-badge { width: 24px; height: 24px; font-size: 14px; }
body[data-stops-review] .stop-choice label { white-space: nowrap; }
body[data-stops-review] .screen .chosen-stop .stop-disc { fill: var(--route-solid); stroke: var(--route-map, var(--route-solid)); }
body[data-stops-review] .screen .chosen-stop .stop-digit { color: #fff; }
body[data-stops-review] .screen .chosen-stop .stop-halo { stroke-width: 3; }
body[data-stops-review] .map-stop { pointer-events: all; }
body[data-stops-review] .map-stop.on-route { cursor: pointer; }
.stop-inspector { margin: 0 -16px; padding: 8px 16px; border-top: 1px solid var(--rule); background: var(--ground); }
.inspect-picker { height: 44px; position: relative; }
.inspect-face { display: flex; height: 44px; align-items: center; justify-content: space-between; }
.inspect-face .place-name { font-size: 22px; font-weight: 700; }
.inspect-face .stop-badge { color: #fff; background: var(--route-solid); border-color: var(--route-solid); width: 30px; height: 30px; font-size: 16px; }
.inspect-face > svg { width: 18px; height: 18px; stroke: currentColor; fill: none; stroke-width: 1.7; }
.inspect-select { position: absolute; inset: 0; width: 100%; height: 44px; opacity: 0; cursor: pointer; }
.inspect-select option { color: var(--ink); background: var(--ground); }
.inspect-picker:focus-within { outline: 3px solid var(--route-ink); outline-offset: 2px; }
body[data-stops-review] .arrival-group { margin: 4px 0 0; }
body[data-stops-review] .eta { font-size: 56px; }
body[data-stops-review] .arrival-time { font-size: 18px; }
.boarding-departure { margin: 0 0 8px; text-align: right; font-size: 12px; color: var(--ink-2); }
body[data-stops-review] .bus-status-panel { margin: 4px 0 8px; }
.board-here { height: 44px; width: 100%; border: 1px solid var(--route-ink); border-radius: 8px; background: var(--ground); color: var(--route-ink); font-size: 14px; font-weight: 650; }
.board-here[aria-pressed="true"] { background: var(--route-solid); border-color: var(--route-solid); color: #fff; }
.here-check { display: none; width: 18px; height: 18px; vertical-align: middle; margin-right: 6px; stroke: currentColor; stroke-width: 1.7; fill: none; }
.board-here[aria-pressed="true"] .here-check { display: inline-block; }
.stop-inspector [hidden] { display: none !important; }
.stop-windows { border-collapse: collapse; width: 100%; font-variant-numeric: tabular-nums; }
.stop-windows th { color: var(--ink-2); font-size: 12px; font-weight: 400; padding: 0 8px 4px; text-align: left; }
.stop-windows th:last-child, .stop-windows td:last-child { text-align: right; }
.stop-windows td { font-size: 14px; padding: 5px 8px; border-bottom: 1px solid var(--rule); }
.stop-windows .first-window { background: var(--route-solid); color: #fff; }
.stop-windows .first-window td { border: none; padding: 8px; }
.stop-windows .first-window td:first-child { font-size: 40px; line-height: 1; font-weight: 750; font-variation-settings: 'wdth' 70; white-space: nowrap; }
.window-here { display: inline; font-size: 12px; font-weight: 400; margin-left: 6px; }
.windows-empty { color: var(--ink-2); height: 84px; }
@container (max-height: 760px) {
  body[data-stops-review] .eta { font-size: 48px; }
  .stop-inspector { padding-top: 4px; padding-bottom: 4px; }
  .stop-windows .first-window td { padding: 6px 8px; }
  .stop-windows .first-window td:first-child { font-size: 32px; }
  body[data-stops-review] .arrival-group { margin-top: 0; }
  body[data-stops-review] .bus-status-panel { margin-top: 2px; margin-bottom: 4px; }
  body[data-stops-review] .map-labels text { font-size: 20px; }
  body[data-stops-review] .stop-disc { r: 12px; }
  body[data-stops-review] .stop-digit { font-size: 18px; transform: translateY(2px); }
  body[data-stops-review] .map-labels text[data-label-stops="8"] { transform: translateY(6px); }
  body[data-stops-review] .map-labels text[data-label-stops="1"] { transform: translateY(4px); }
  body[data-stops-review] .map-labels text[data-label-stops="2"] { transform: translateY(8px); }
}
@media (prefers-reduced-motion: no-preference) { .board-here { transition: background-color 150ms ease-out, color 150ms ease-out; } }