.traffic-page{width:min(calc(100% - 32px),920px);max-width:100%;margin:18px auto 64px;overflow-x:clip}
.traffic-page .traffic-hero{padding:4px 0 0}
.traffic-page .traffic-kicker{color:var(--muted);font:800 11px/1 Arial,sans-serif;letter-spacing:.08em;text-transform:uppercase}
.traffic-page .live-kicker{display:inline-flex;align-items:center;gap:8px}
.traffic-page .live-dot{
  width:8px;height:8px;border-radius:50%;background:#2fa866;box-shadow:0 0 0 0 rgba(47,168,102,.45)
}
@media (prefers-reduced-motion: no-preference){
  .traffic-page .live-dot{animation:traffic-live 2.4s ease-out infinite}
}
@keyframes traffic-live{
  0%{box-shadow:0 0 0 0 rgba(47,168,102,.4)}
  70%{box-shadow:0 0 0 6px rgba(47,168,102,0)}
  100%{box-shadow:0 0 0 0 rgba(47,168,102,0)}
}
.traffic-page h1{font-family:Georgia,"Times New Roman",serif;font-size:clamp(32px,8vw,56px);line-height:.96;letter-spacing:-.04em;margin:8px 0 0;max-width:16ch}
.traffic-page .live-chip{display:inline-flex;align-items:center;gap:6px;margin:0;font-size:11px;font-weight:750;color:var(--muted)}
.traffic-page .live-chip i{width:8px;height:8px;border-radius:50%;background:#2fa866}
.traffic-page .live-chip.is-offline i{background:#8b95a1;box-shadow:none}
.route-chips{display:flex;flex-wrap:nowrap;gap:8px;margin:28px 0 10px;overflow-x:auto;scrollbar-width:none;-webkit-overflow-scrolling:touch}
.route-chips::-webkit-scrollbar{display:none}
.route-chips button{flex:0 0 auto;min-height:38px;padding:0 14px;border:1px solid var(--line);border-radius:999px;background:transparent;color:var(--ink);font:750 13px/1 Arial,sans-serif;cursor:pointer}
.route-chips button[aria-pressed="true"]{background:var(--navy);color:var(--paper);border-color:var(--navy)}
.route-origin{margin:0 0 16px;color:var(--muted);font:500 12px/1.3 Inter,Arial,sans-serif}
.route-status{padding:12px 14px;border:1px solid var(--line);border-radius:14px;background:var(--card,#fff)}
.route-status-row{display:flex;align-items:baseline;justify-content:space-between;gap:12px}
.route-status h2{margin:0;font:700 22px/1.15 var(--sans,Inter,ui-sans-serif,sans-serif);color:var(--navy)}
.route-status b{color:#c23b22;font:800 14px/1 Arial,sans-serif}
.route-status p{margin:6px 0 0;color:var(--ink);font-size:14px;line-height:1.35}
.route-status-note{margin:4px 0 0;color:var(--muted);font-size:13px}
.route-stage{display:block;margin-top:20px}
.route-map-wrap{position:relative;margin:0}
.route-map{height:min(52vw,360px);min-height:220px;border:1px solid var(--line);border-radius:16px;overflow:hidden;background:#dce6ee}
.route-puck,.route-incident,.route-start{display:grid;place-items:center;border-radius:50%;border:2px solid #fff;box-shadow:0 2px 8px rgba(13,36,61,.28)}
.route-puck{background:#1d4f78;color:#fff;font:800 12px/1 Arial,sans-serif}
.route-puck.is-selected{background:#0864c7;transform:scale(1.08)}
.route-puck.is-offline{background:#8b95a1}
.route-start{width:16px;height:16px;background:#2fa866;border-width:3px}
.route-start span{display:block;width:6px;height:6px;border-radius:50%;background:#fff}
.route-incident{background:#c23b22;color:#fff;font:800 12px/1 Arial,sans-serif}
.route-incident-popup .leaflet-popup-content-wrapper{border-radius:10px}
.route-incident-popup strong{display:block;margin-bottom:4px}
.route-incident-popup p{margin:0;font-size:13px}
.camera-preview{margin-top:8px}
.camera-preview-head{display:flex;align-items:center;justify-content:space-between;gap:10px;margin:0 0 10px}
.camera-preview-head p{margin:0;font:750 14px/1.2 Inter,Arial,sans-serif}
.camera-preview-head .live-chip{margin:0}
.camera-preview-shot{position:relative;border:1px solid var(--line);border-radius:14px;overflow:hidden;background:#111}
.camera-preview-shot figure{margin:0}
.camera-preview-shot img{display:block;width:100%;aspect-ratio:16/9;object-fit:cover;background:#1a1a1a}
.camera-fallback{
  display:flex;flex-direction:column;justify-content:center;align-items:flex-start;gap:6px;
  min-height:0;aspect-ratio:16/9;padding:22px 24px;background:#1c242c;color:#d5dde4
}
.camera-fallback strong{font:750 16px/1.25 Inter,Arial,sans-serif;color:#f4f7fa}
.camera-fallback span{font:500 13px/1.35 Inter,Arial,sans-serif;color:#c4ced6}
.camera-fallback small{color:#9aa6af;font-size:12px}
.camera-nav{position:absolute;top:50%;z-index:2;width:36px;height:36px;margin-top:-18px;border:0;border-radius:50%;background:rgba(8,16,24,.62);color:#fff;font-size:22px;cursor:pointer}
.camera-nav.is-prev{left:8px}
.camera-nav.is-next{right:8px}
.camera-preview-meta{margin:8px 0 0;color:var(--muted);font-size:13px;line-height:1.35}
.camera-pucks{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px}
.camera-pucks button{width:32px;height:32px;border:1px solid var(--line);border-radius:50%;background:transparent;color:var(--ink);font:800 12px/1 Arial,sans-serif;cursor:pointer}
.camera-pucks button[aria-selected="true"]{background:var(--navy);color:var(--paper);border-color:var(--navy)}
.camera-empty{color:var(--muted)}
.leaflet-control-attribution{max-width:min(100%,280px);font-size:10px!important;background:rgba(255,255,255,.72)!important}
.map-credit{margin:8px 0 0;color:var(--muted);font-size:11px;opacity:.8}

@media(max-width:720px){
  .traffic-page{width:calc(100% - 24px);margin-top:10px}
  .traffic-page h1{font-size:34px}
  .route-chips{margin-top:22px}
  .route-map{height:240px}
}

html[data-theme="dark"] .route-status,
html[data-theme="dark"] .route-chips button{
  background:#15212a;
  border-color:#30404b;
  color:#edf4f8
}
html[data-theme="dark"] .route-chips button[aria-pressed="true"],
html[data-theme="dark"] .camera-pucks button[aria-selected="true"]{
  background:#edf4f8;
  color:#101517;
  border-color:#edf4f8
}
html[data-theme="dark"] .route-status h2{color:#edf4f8}
html[data-theme="dark"] .route-map{background:#101517;border-color:#30404b}
html[data-theme="dark"] .route-puck{background:#4d8fbf}
html[data-theme="dark"] .route-puck.is-selected{background:#7eb6ea}
html[data-theme="dark"] .route-puck.is-offline{background:#6b7680}
html[data-theme="dark"] .camera-fallback{background:#151c22;color:#d5dde4}
html[data-theme="dark"] .map-credit{color:#8b98a2}
