/* Live map is layered over the existing offline Natural Earth fallback. */
.tp-live-map{visibility:hidden;position:absolute;inset:0;overflow:hidden;z-index:1;background:#e9f1f1;cursor:grab;touch-action:none}.tp-live-map.is-dragging{cursor:grabbing}.tp-live-map:focus-visible{outline:3px solid #954b4a;outline-offset:-3px}.tp-live-tiles,.tp-live-lines,.tp-live-markers{position:absolute;inset:0}.tp-live-tile{position:absolute;width:256px;height:256px;max-width:none;user-select:none;pointer-events:none}.tp-live-lines{overflow:hidden;pointer-events:none}.tp-live-lines line{stroke-width:4;stroke-linecap:round;stroke-dasharray:8 6;opacity:.82}.tp-live-markers{pointer-events:none}.tp-live-city{position:absolute;transform:translate(-50%,-50%);display:flex;align-items:center;gap:4px;white-space:nowrap}.tp-live-dot{display:grid;place-items:center;width:23px;height:23px;border:3px solid white;border-radius:50%;background:#366c59;color:white;font:700 10px/1 sans-serif;box-shadow:0 2px 7px #183a3255}.tp-live-city-name{font:700 12px/1.2 sans-serif;color:#244536;text-shadow:0 1px white,1px 0 white,-1px 0 white,0 -1px white}.tp-live-day{position:absolute;transform:translate(-50%,-50%);padding:5px 8px;border:2px solid white;border-radius:20px;color:white;font:700 10px/1.1 sans-serif;white-space:nowrap;box-shadow:0 2px 8px #23473e55;cursor:pointer;pointer-events:auto}.tp-live-day.is-active{outline:2px solid #193d32}.tp-live-day:hover{filter:brightness(1.12)}.tp-live-attribution{position:absolute;z-index:3;right:4px;bottom:3px;padding:3px 5px;border-radius:3px;background:#ffffffdf;font:10px/1.2 sans-serif}.tp-live-attribution a{color:#405f69;text-decoration:underline}.tp-live-active>svg{visibility:hidden}.tp-live-active .tp-map-top,.tp-live-active .tp-map-controls{z-index:4}.tp-live-active .tp-map-credit{display:none}

.tp-live-active .tp-live-map{visibility:visible}

.tp-live-more{position:absolute;transform:translate(-50%,-50%);padding:4px 6px;border:1px solid #d7e1dc;border-radius:20px;color:#39594a;background:#ffffffed;font:700 10px/1 sans-serif;box-shadow:0 2px 6px #23473e33;pointer-events:none}
.tp-live-tile{filter:saturate(.78) brightness(1.04)}
.tp-live-suggest{position:absolute;transform:translate(-50%,-50%);display:flex;align-items:center;gap:5px;padding:4px 7px 4px 5px;border:1px solid #fff;border-radius:20px;color:#355541;background:#ffffffeb;white-space:nowrap;box-shadow:0 3px 12px #2c4b3430;font:700 11px/1.2 sans-serif;cursor:pointer;pointer-events:auto;transition:transform .22s,background .22s,box-shadow .22s}
.tp-live-suggest-dot{width:8px;height:8px;border-radius:50%;background:#b66055;box-shadow:0 0 0 3px #f6ded5}
.tp-live-suggest:hover,.tp-live-suggest:focus-visible{transform:translate(-50%,-55%) scale(1.06);background:#fff;box-shadow:0 5px 18px #2c4b3440;outline:2px solid #996057;outline-offset:2px}
@media(prefers-reduced-motion:reduce){.tp-live-suggest{transition:none}.tp-live-suggest:hover{transform:translate(-50%,-50%)}}

/* A quiet planning map keeps the chosen cities legible. Users can restore
   full street detail with the visible map-style control. */
.tp-live-tiles{background:#f5f6f2}
.tp-live-tiles::after{content:'';position:absolute;inset:0;background:rgba(248,250,247,.43);pointer-events:none}
.tp-live-tile{filter:grayscale(.7) saturate(.52) brightness(1.06)}
.tp-live-map.is-detailed .tp-live-tiles::after{background:transparent}
.tp-live-map.is-detailed .tp-live-tile{filter:none}
.tp-live-style{position:absolute;z-index:4;right:18px;top:18px;padding:10px 13px;border:1px solid #dfe8df;border-radius:10px;background:#fffefa;color:#355745;font:600 11px/1.3 sans-serif;box-shadow:0 4px 16px #2a4c3a17;cursor:pointer}
.tp-live-style:hover,.tp-live-style:focus-visible{background:#eef5ef;outline:2px solid #8f5b4d;outline-offset:2px}
.tp-live-lines path{fill:none;stroke-width:4;stroke-linecap:round;stroke-dasharray:8 6;opacity:.92;filter:drop-shadow(0 1px 1px #ffffff)}
.tp-live-city{padding:3px 8px 3px 3px;border:1px solid #fff;border-radius:22px;background:#fffef8f5;box-shadow:0 3px 13px #183d3030;cursor:pointer;pointer-events:auto}
.tp-live-city:hover,.tp-live-city:focus-visible{outline:2px solid #a65a4c;outline-offset:2px;background:#fff}
.tp-live-city-name{text-shadow:none}
@media(max-width:850px){.tp-live-style{right:12px;top:12px;padding:9px 11px;font-size:10px}}

.tp-live-lines line.tp-live-leader{stroke-width:1.5;stroke-dasharray:3 3;opacity:.8;filter:drop-shadow(0 1px 1px #fff)}

/* Newly validated itinerary segments and day markers appear as they arrive. */
.tp-live-city.is-pending{opacity:.53;filter:saturate(.7)}
.tp-live-lines path.is-stream-new{animation:tp-stream-route-in .65s ease-out both}
.tp-live-day.is-stream-new{animation:tp-stream-day-in .45s cubic-bezier(.2,.7,.2,1) both}
@keyframes tp-stream-route-in{from{opacity:0;stroke-width:1}to{opacity:.92;stroke-width:4}}
@keyframes tp-stream-day-in{from{opacity:0;transform:translate(-50%,-35%) scale(.82)}to{opacity:1;transform:translate(-50%,-50%) scale(1)}}
@media(prefers-reduced-motion:reduce){.tp-live-lines path.is-stream-new,.tp-live-day.is-stream-new{animation:none}}

/* MapLibre GL + OpenStreetMap integration */
.tp-live-map .maplibregl-canvas {
  outline: none;
}

.tp-live-map.is-simple .maplibregl-canvas {
  filter: grayscale(0.55) saturate(0.62) brightness(1.04);
}

.tp-live-map .tp-live-attribution {
  right: auto;
  left: 8px;
  bottom: 4px;
  max-width: calc(100% - 120px);
}

.tp-live-map .maplibregl-ctrl {
  font: inherit;
}

.tp-live-loading {
  position: absolute;
  inset: 0;
  z-index: 2;
  display: grid;
  place-items: center;
  padding: 24px;
  background: #f2f5f0;
  color: #637c6c;
  font: 600 12px/1.5 "Helvetica Neue", Arial, sans-serif;
  letter-spacing: .02em;
  pointer-events: none;
}