.live-route-page{display:grid;gap:1rem;max-width:1080px;margin:0 auto;padding-bottom:calc(2rem + env(safe-area-inset-bottom))}.live-route-header{display:grid;grid-template-columns:auto 1fr auto;align-items:start;gap:1rem}.live-route-back{align-self:start}.live-route-heading h1{font-size:clamp(2rem,7vw,4.2rem);line-height:.96;letter-spacing:-.055em;margin:.1rem 0 .65rem}.live-route-heading p:last-child{max-width:700px;margin:0;color:var(--muted)}.live-route-live-state{display:inline-flex;align-items:center;gap:.55rem;border-radius:999px;padding:.65rem .85rem;font-weight:900;font-size:.74rem;letter-spacing:.12em;border:1px solid color-mix(in srgb,var(--border) 80%,transparent);background:var(--surface)}.live-route-live-state span{width:.65rem;height:.65rem;border-radius:50%;background:#7b8491}.live-route-live-state.is-live{color:#0b2c13;background:#b9e531;border-color:#b9e531}.live-route-live-state.is-live span{background:#0b2c13;box-shadow:0 0 0 5px rgba(11,44,19,.15);animation:live-route-status-pulse var(--motion-duration-loop-slow) var(--motion-ease-exit) infinite}.live-route-live-state.is-stale{color:#5b3500;background:#ffd36b;border-color:#ffd36b}.live-route-map{position:relative;overflow:hidden;min-height:330px;border-radius:28px;border:1px solid rgba(255,255,255,.1);background:#111820;box-shadow:0 24px 60px rgba(0,0,0,.2)}.live-route-map svg{display:block;width:100%;height:auto;min-height:330px}.live-route-map-base{fill:#111820}.live-route-map-grid{color:rgba(183,202,211,.07)}.live-route-map-roads path{fill:none;stroke:#3a4651;stroke-width:19;stroke-linecap:round}.live-route-map-roads path:nth-child(even){stroke:#303a44;stroke-width:12}.live-route-trail-shadow,.live-route-trail{fill:none;stroke-linecap:round;stroke-linejoin:round}.live-route-trail-shadow{stroke:rgba(0,0,0,.5);stroke-width:18}.live-route-trail{stroke:#b9e531;stroke-width:10}.live-route-start-dot{fill:#fff;stroke:#111820;stroke-width:5}.live-route-vehicle-pulse{fill:rgba(185,229,49,.16);transform-origin:center;animation:live-route-marker-pulse var(--motion-duration-loop-slow) var(--motion-ease-exit) infinite}.live-route-vehicle-ring{fill:#b9e531;stroke:#fff;stroke-width:3}.live-route-vehicle-body,.live-route-vehicle-cab{fill:#101718}.live-route-vehicle-wheel{fill:#fff;stroke:#101718;stroke-width:1}.live-route-map-brand{position:absolute;top:1rem;left:1rem;display:flex;align-items:center;gap:.55rem;padding:.5rem .7rem;border-radius:14px;color:#fff;background:rgba(10,15,18,.82);backdrop-filter:blur(10px);font-weight:850;font-size:.8rem}.live-route-map-brand img{border-radius:9px}.live-route-map-empty{position:absolute;inset:0;display:grid;place-content:center;justify-items:center;text-align:center;color:#fff;padding:2rem}.live-route-map-empty>span{display:grid;place-items:center;width:70px;height:70px;border-radius:50%;background:rgba(185,229,49,.12);color:#b9e531;font-size:1.4rem;margin-bottom:.75rem}.live-route-map-empty strong{font-size:1.2rem}.live-route-map-empty small{color:#b8c0c6;margin-top:.35rem}.live-route-summary-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:.75rem}.live-route-summary-grid article{display:grid;gap:.35rem;padding:1rem;border:1px solid var(--border);border-radius:18px;background:var(--surface)}.live-route-summary-grid span{color:var(--muted);font-size:.72rem;text-transform:uppercase;letter-spacing:.1em;font-weight:800}.live-route-summary-grid strong{font-size:.98rem}.live-route-controls,.live-route-viewer-note{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(210px,.6fr) auto;align-items:end;gap:1rem}.live-route-controls h2,.live-route-viewer-note h2{margin:.15rem 0 .45rem}.live-route-controls p,.live-route-viewer-note p{margin:0;color:var(--muted)}.live-route-control-actions{display:flex;gap:.65rem}.live-route-control-message{grid-column:1/-1;min-height:1.3rem;margin:0!important;color:var(--muted)}.live-route-privacy-note{text-align:center;color:var(--muted);font-size:.78rem;margin:.25rem 0}.live-route-loading{min-height:420px;display:grid;place-content:center;justify-items:center;gap:1rem;border:1px solid var(--border);border-radius:28px;background:var(--surface)}.live-route-loading span{width:56px;height:56px;border:5px solid color-mix(in srgb,var(--border) 75%,transparent);border-top-color:#b9e531;border-radius:50%;animation:live-route-spin var(--motion-duration-loop-fast) var(--motion-ease-linear) infinite}@keyframes live-route-spin{to{transform:rotate(360deg)}}@keyframes live-route-status-pulse{0%{box-shadow:0 0 0 0 rgba(11,44,19,.35)}70%{box-shadow:0 0 0 8px rgba(11,44,19,0)}100%{box-shadow:0 0 0 0 rgba(11,44,19,0)}}@keyframes live-route-marker-pulse{0%{transform:scale(.75);opacity:.8}75%{transform:scale(1.45);opacity:0}100%{transform:scale(1.45);opacity:0}}@media(max-width:760px){.live-route-header{grid-template-columns:1fr auto}.live-route-back{grid-column:1/-1;justify-self:start}.live-route-heading{grid-column:1}.live-route-live-state{grid-column:2;grid-row:2}.live-route-map{border-radius:22px;min-height:290px}.live-route-map svg{min-height:290px;object-fit:cover}.live-route-summary-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.live-route-controls,.live-route-viewer-note{grid-template-columns:1fr}.live-route-control-message{grid-column:1}.live-route-control-actions .button{flex:1}}@media(max-width:420px){.live-route-heading h1{font-size:2.45rem}.live-route-summary-grid{grid-template-columns:1fr}.live-route-map-brand span{display:none}}@media(prefers-reduced-motion:reduce){.live-route-live-state.is-live span,.live-route-vehicle-pulse,.live-route-loading span{animation:none}}