.journey {
  --sea: #d3e4e4;
  background: #fffdf8;
  overflow: hidden;
  border-radius: 14px;
  min-width: 0;
}
.journey-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 18px 18px 12px;
}
.journey-heading .eyebrow {
  font-size: 10px;
  letter-spacing: 2px;
  margin: 0 0 5px;
  color: #7c6d57;
}
.journey-heading h2 {
  font:
    400 27px/1.15 Georgia,
    serif;
  margin: 0;
}
.journey-heading > button {
  font-size: 24px;
}
.journey-toolbar {
  padding: 0 12px 10px;
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.journey-toolbar > div {
  display: flex;
  gap: 4px;
  flex-wrap: wrap;
}
.journey-toolbar button {
  font-size: 12px;
  padding: 7px 10px;
}
.journey-toolbar > span {
  font-size: 11px;
  color: #6b7168;
}
.journey-stage {
  position: relative;
  height: 490px;
  min-width: 0;
  background: #e5ebdf;
}
.journey-canvas {
  position: absolute;
  inset: 0;
}
.journey-status {
  position: absolute;
  left: 15px;
  right: 55px;
  top: 15px;
  padding: 12px;
  background: #fffdf3ed;
  border-radius: 8px;
  font-size: 13px;
  z-index: 2;
}
.journey-status[hidden] {
  display: none;
}
.journey .maplibregl-ctrl button {
  min-height: 29px;
  border: 0;
  padding: 0;
  border-radius: 0;
}
.journey .maplibregl-ctrl-attrib {
  font-size: 10px;
}
.journey .maplibregl-canvas {
  outline-offset: -3px;
}
.journey-pin {
  display: flex;
  align-items: center;
  min-height: 36px;
  padding: 0;
  border: 0;
  background: transparent !important;
  border-radius: 24px;
  filter: drop-shadow(0 3px 4px #163a4538);
}
.journey-pin > span {
  display: grid;
  place-items: center;
  width: 32px;
  height: 32px;
  border-radius: 50% 50% 50% 8px;
  transform: rotate(-12deg);
  background: var(--pin, #31594e);
  border: 2px solid white;
  color: #fff;
  font-size: 20px;
  font-family: Georgia, serif;
}
.journey-pin > b {
  max-width: 155px;
  font-size: 11px;
  background: #fffef8ed;
  padding: 5px 8px;
  border-radius: 4px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-weight: 600;
}
.journey-pin.pin-saved > span {
  background: #af4a08;
}
.journey-pin.pin-cluster {
  border: 2px solid #fff;
  border-radius: 50%;
  background: #365e55 !important;
  color: #fff;
  min-width: 36px;
  justify-content: center;
  font-size: 13px;
  font-weight: 700;
}
.journey-pin:focus-visible {
  outline: 3px solid #f6a55a;
  outline-offset: 4px;
}
.journey-card {
  position: absolute;
  left: 14px;
  bottom: 38px;
  width: 245px;
  max-height: 80%;
  overflow: auto;
  border: 1px solid #dfd8c8;
  border-radius: 12px;
  background: #fffef9;
  box-shadow: 0 8px 24px #243e4129;
  z-index: 3;
}
.journey-card[hidden] {
  display: none;
}
.journey-card > .photo {
  height: 115px;
  aspect-ratio: auto;
  background: #efece4;
}
.journey-card > .photo img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}
.journey-card > .attribution {
  padding: 5px 10px;
  font-size: 10px;
}
.journey-card > div:not(.photo) {
  padding: 10px 12px;
}
.journey-card h3 {
  font:
    400 22px/1.12 Georgia,
    serif;
  margin: 3px 0 8px;
}
.journey-card p {
  font-size: 12px;
  line-height: 1.45;
  margin: 5px 0;
}
.journey-card button {
  font-size: 12px;
  padding: 6px 8px;
}
.journey-leg {
  border-top: 1px solid #e6ddd0;
  padding-top: 7px;
  color: #58665c;
}
.journey-travel {
  padding: 14px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  background: #f2f0e6;
  border-top: 1px solid #dedbcd;
}
.journey-travel b {
  font:
    400 19px Georgia,
    serif;
}
.journey-travel p {
  font-size: 12px;
  color: #63695f;
  margin: 5px 0 0;
}
.journey-travel button {
  font-size: 12px;
}
.journey-travel > div:last-child {
  display: flex;
  gap: 4px;
  flex-wrap: wrap;
}
.journey-distance {
  font-size: 12px;
  padding: 0 14px;
}
.journey-distance:empty {
  display: none;
}
.journey-distance details {
  padding: 12px 0;
}
.journey-distance ol {
  list-style: none;
  padding: 0;
  margin: 8px 0;
}
.journey-distance li {
  display: flex;
  gap: 12px;
  justify-content: space-between;
  padding: 8px 0;
  border-bottom: 1px solid #e8e2d7;
}
.journey-distance b {
  white-space: nowrap;
}
.journey-distance p {
  color: #6a6a5c;
  line-height: 1.5;
}
.journey-disclosure {
  font-size: 11px;
  color: #666d65;
  padding: 10px 14px;
}
.journey-disclosure p {
  line-height: 1.6;
}
.journey.expanded {
  position: fixed;
  inset: 12px;
  z-index: 50;
  overflow: auto;
  box-shadow: 0 0 0 100vmax #172c26bb;
  display: flex;
  flex-direction: column;
}
.journey.expanded .journey-stage {
  flex: 1;
  min-height: 45vh;
}
.journey.expanded .journey-distance {
  display: none;
}
.journey.expanded .journey-card {
  width: 280px;
}
.journey.expanded .journey-card > .photo {
  height: 155px;
}
.board-wrap:has(.journey) {
  top: 12px;
}
.workspace:has(.journey) {
  grid-template-columns: minmax(0, 0.95fr) minmax(0, 1.15fr);
}
@media (max-width: 820px) {
  .workspace:has(.journey) {
    grid-template-columns: 1fr;
  }
  .journey-stage {
    height: 380px;
  }
  .mobile-list > .board-wrap .journey-stage {
    height: 280px;
  }
  .journey-heading {
    padding: 12px;
  }
  .journey-heading h2 {
    font-size: 23px;
  }
  .journey-card {
    width: 205px;
    max-height: 75%;
  }
  .journey-card > .photo {
    height: 75px;
  }
  .journey-card h3 {
    font-size: 18px;
  }
  .journey-travel {
    align-items: flex-start;
    flex-wrap: wrap;
  }
  .journey-toolbar > span {
    display: none;
  }
  .journey.expanded {
    inset: 0;
    border-radius: 0;
  }
  .journey.expanded .journey-stage {
    min-height: 45vh;
  }
  .journey.expanded .journey-card {
    width: 220px;
  }
  .journey.expanded .journey-card > .photo {
    height: 90px;
  }
}
@media (prefers-reduced-motion: reduce) {
  .journey * {
    scroll-behavior: auto !important;
  }
}
.journey.expanded {
  z-index: 1000;
}
.detail-backdrop {
  z-index: 1100;
}
.journey-travel > div:first-child {
  min-width: 0;
}
.journey-card-close {
  position: absolute;
  right: 5px;
  top: 5px;
  z-index: 1;
  background: #fffef9 !important;
  border-radius: 50%;
  width: 32px;
  min-height: 32px !important;
  font-size: 20px !important;
  padding: 0 !important;
}
.journey .maplibregl-ctrl-group button {
  min-width: 29px;
}
body:has(.journey.expanded) .day-shelf,
body:has(.journey.expanded) #toast {
  visibility: hidden;
}
.journey-chapters,
.journey-budget {
  padding: 0 14px;
  font-size: 12px;
}
.journey-chapters:empty,
.journey-budget:empty {
  display: none;
}
.journey-chapters details,
.journey-budget details {
  padding: 12px 0;
  border-bottom: 1px solid #e5dece;
}
.journey-chapters p,
.allocation-note {
  color: #657163;
  line-height: 1.5;
}
.journey-chapters details > div {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 7px;
}
.journey-chapters button {
  text-align: left;
  display: flex;
  flex-direction: column;
  gap: 7px;
  padding: 12px;
}
.journey-chapters button span {
  font-size: 11px;
  line-height: 1.4;
}
.time-allocation {
  display: flex;
  height: 14px;
  background: #e8e6dc;
  border-radius: 7px;
  overflow: hidden;
  margin: 12px 0;
}
.time-allocation span {
  display: block;
  flex-shrink: 0;
}
.time-allocation .visits {
  background: #427c68;
}
.time-allocation .transfers {
  background: #cc864b;
}
.time-allocation .buffers {
  background: #b3c7d3;
}
.journey-distance li {
  display: block;
}
.journey-distance li > div:first-child {
  display: flex;
  justify-content: space-between;
  gap: 8px;
}
.route-links {
  display: flex;
  gap: 12px;
  margin: 8px 0;
}
.journey-distance form {
  display: flex;
  gap: 5px;
  align-items: end;
  flex-wrap: wrap;
}
.journey-distance label {
  font-size: 11px;
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.journey-distance input {
  width: 90px;
  padding: 8px;
  border: 1px solid #ccc5b7;
  border-radius: 6px;
}
.journey-distance form button {
  font-size: 11px;
}
.journey.expanded .journey-chapters,
.journey.expanded .journey-budget {
  display: none;
}
@media (max-width: 430px) {
  .journey-chapters details > div {
    grid-template-columns: 1fr;
  }
}

.route-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 8px 0;
}
.route-choice {
  padding: 12px;
  margin: 10px 0;
  border: 1px solid #dcd4c7;
  border-radius: 10px;
  background: #fffdf8;
}
.route-choice small {
  display: block;
  line-height: 1.5;
  overflow-wrap: anywhere;
}
.journey-distance .route-choice ol {
  padding-left: 20px;
}
.journey-distance .route-choice li {
  display: list-item;
  padding: 6px 0;
}

.journey-route-caption {
  padding: 10px 16px;
  background: #fff4e3;
  border-top: 1px solid #dcc9b0;
  font-weight: 600;
}
.journey-route-caption button {
  float: right;
}

/* One trip theater, owned by My day. Explore remains a discovery map. */
.journey-discover .journey-travel,.journey-discover .journey-filmstrip,
.journey-discover .journey-preview-note,.journey-discover .journey-budget,
.journey-discover .journey-distance,.journey-discover .journey-route-caption,
.journey-discover .journey-progress{display:none}
.journey-theater{border:1px solid #d5dece;background:#fcfbf5;box-shadow:0 12px 40px #31452d0b}
.journey-theater .journey-heading{padding:20px 22px 12px}
.journey-theater .journey-stage{height:clamp(340px,52vh,480px);background:radial-gradient(ellipse at 50% 30%,#f0f1db,#d4e5e0)}
.journey-theater .journey-toolbar{padding:0 18px 12px}
.journey-theater .journey-toolbar>span{display:none}
.journey-theater .journey-toolbar button{border-radius:30px;background:transparent;font-size:11px;padding:7px 12px;min-height:36px}
.journey-flight-label{position:absolute;left:18px;top:18px;right:60px;max-width:420px;display:flex;align-items:center;gap:12px;padding:12px 16px;border:1px solid #fff9;border-radius:16px;background:#fffdf1ed;box-shadow:0 6px 22px #304b3720;pointer-events:none;z-index:2}
.journey-flight-label[hidden]{display:none}.journey-flight-label small{display:block;font-size:9px;letter-spacing:1.5px;color:#527464;margin-bottom:5px}.journey-flight-label strong{font:400 22px/1.15 Georgia,serif;display:block;overflow-wrap:anywhere}.flight-count{margin-left:auto;font:400 32px Georgia,serif;color:#31594e;flex-shrink:0}.flight-count small{letter-spacing:0;text-align:center;margin:0}.flight-dot{flex:0 0 9px;height:9px;border-radius:50%;background:#d97132;box-shadow:0 0 0 5px #e9bd7940}
.journey[data-phase=moving] .flight-dot{animation:journey-beacon 1s ease-in-out infinite}
.journey-progress{height:4px;position:absolute;bottom:0;left:0;right:0;z-index:4;background:#fff8;pointer-events:none}.journey-progress span{display:block;background:#d77339;height:100%;transform:scaleX(0);transform-origin:left}
.journey-theater .journey-travel{padding:17px 20px;background:#eef1e5;min-height:104px;border-top:0}
.journey-now{min-width:0;max-width:58%}.journey-now small{display:block;font-size:9px;letter-spacing:1.4px;color:#657263;margin-bottom:6px}.journey-now b{display:block;font-size:20px;overflow-wrap:anywhere}.journey-now p{font-size:11px;line-height:1.5}
.journey-controls{flex-shrink:0}.journey-controls button{border-radius:30px;background:#fffdf7;font-size:11px}.journey-controls button[data-j=play]{background:#31594e;color:white;border-color:#31594e;min-width:78px}
.journey-filmstrip{list-style:none;display:flex;gap:0;margin:0;padding:15px 16px 8px;overflow-x:auto;scrollbar-width:thin;scroll-behavior:smooth}
.journey-filmstrip li{flex:1 0 155px;max-width:230px;min-width:0;position:relative}.journey-filmstrip li:not(:last-child):after{content:'';position:absolute;left:32px;right:-16px;height:1px;background:#ccd3be;top:16px;pointer-events:none}
.journey-filmstrip button{background:transparent;border:0;display:flex;flex-direction:column;align-items:flex-start;gap:8px;position:relative;z-index:1;text-align:left;width:100%;padding:0 8px 6px;min-height:94px;border-radius:0}
.journey-filmstrip button>span{display:grid;place-items:center;border:1px solid #c5cdbd;width:32px;height:32px;background:#fcfbf5;color:#5a7057;border-radius:50%;font:16px Georgia,serif}
.journey-filmstrip b{display:block;font-size:11px;line-height:1.4;max-width:160px}.journey-filmstrip small{display:block;font-size:10px;color:#777c6b;margin-top:5px}.journey-filmstrip [aria-current=step]>span{background:#31594e;color:white;border-color:#31594e;box-shadow:0 0 0 4px #dfebd6}.journey-filmstrip [aria-current=step] b{color:#245e3c}
.journey-preview-note{font-size:10px;line-height:1.5;color:#69735f;margin:0;padding:8px 22px 13px;border-bottom:1px solid #e0e3d4}.journey-theater .journey-budget,.journey-theater .journey-distance{padding-inline:22px}
.journey-theater .journey-card{width:238px;max-height:290px;bottom:30px;left:18px;border:1px solid #e0e2ce;border-radius:16px;box-shadow:0 12px 28px #1d473c24}
.journey-theater .journey-card>.photo{height:106px}.journey-theater .journey-card h3{font-size:20px}.journey-theater .journey-card p{font-size:11px}.journey-theater .journey-card .journey-leg{display:none}
.journey-pin.pin-active>span{background:#31594e;box-shadow:0 0 0 6px #fff9}.journey-pin.pin-active>b{background:#31594e;color:white}
.journey-traveler{width:38px;height:53px;pointer-events:none;z-index:3}.traveler-shadow{position:absolute;bottom:0;left:1px;width:36px;height:14px;background:#31574d44;filter:blur(3px);border-radius:50%}.traveler-body{position:absolute;left:8px;bottom:9px;width:24px;height:29px;border:2px solid #8f451e;border-radius:6px;transform:rotate(-12deg) skewY(5deg);background:linear-gradient(100deg,#efa456 65%,#cf6a31 65%);box-shadow:3px 4px 0 #9a512a}.traveler-body:before{content:'';position:absolute;top:-10px;left:6px;width:9px;height:8px;border:2px solid #874421;border-radius:4px 4px 0 0}.traveler-body:after{content:'';position:absolute;left:3px;right:3px;top:12px;height:2px;background:#8f451e99}.traveler-body i:before,.traveler-body i:after{content:'';position:absolute;bottom:-5px;width:4px;height:4px;background:#36544b;border-radius:50%}.traveler-body i:before{left:2px}.traveler-body i:after{right:2px}.in-motion .traveler-body{animation:suitcase-bob .5s ease-in-out infinite alternate}
.journey-theater.expanded .journey-stage{min-height:45vh;height:auto}.journey-theater.expanded .journey-filmstrip{flex-shrink:0;max-height:130px}.journey-theater.expanded .journey-preview-note{flex-shrink:0}
@keyframes suitcase-bob{to{transform:translateY(-6px) rotate(-6deg) skewY(5deg)}}
@keyframes journey-beacon{50%{box-shadow:0 0 0 8px #e9bd7910}}
@media(max-width:1100px){.journey-now{max-width:none}.journey-theater .journey-travel{flex-wrap:wrap}.journey-theater .journey-controls{width:100%}}
@media(max-width:820px){
 .journey-theater .journey-stage{height:430px}.journey-theater .journey-heading{padding:16px}.journey-theater .journey-heading h2{font-size:23px}.journey-theater .journey-toolbar{padding-inline:12px}
 .journey-flight-label{left:12px;top:12px;padding:10px 12px;gap:10px;border-radius:12px}.journey-flight-label strong{font-size:20px}.flight-count{font-size:25px}
 .journey-theater .journey-card{left:12px;bottom:28px;width:200px;max-height:255px}.journey-theater .journey-card>.photo{height:86px}.journey-theater .journey-card h3{font-size:18px}.journey-theater .journey-card>div:not(.photo){padding:8px 10px}
 .journey-theater .journey-travel{padding:14px}.journey-theater .journey-travel b{font-size:19px}.journey-theater .journey-travel>.primary{width:100%}
 .journey-filmstrip{padding-inline:10px}.journey-filmstrip li{flex-basis:140px}.journey-preview-note{padding-inline:16px}.journey-theater .journey-distance,.journey-theater .journey-budget{padding-inline:16px}
}
@media(prefers-reduced-motion:reduce){.journey *{animation:none!important;transition:none!important;scroll-behavior:auto!important}}
.journey-theater[data-phase=arrived] .journey-flight-label{left:auto;max-width:calc(100% - 340px);padding:10px 12px}.journey-theater[data-phase=arrived] .journey-flight-label strong{display:none}.journey-theater[data-phase=arrived] .flight-count{font-size:22px}.journey-theater[data-phase=arrived] .journey-flight-label small{font-size:9px;letter-spacing:1px;margin:0}
@media(max-width:820px){.journey-theater[data-phase=arrived] .journey-flight-label{left:12px;max-width:none}.journey-theater[data-phase=arrived] .journey-flight-label strong{display:block}.journey-theater[data-phase=arrived] .journey-flight-label small{margin-bottom:4px}}
/* On a narrow screen, the arrival card sits below the map so it never covers a stop. */
@media(max-width:820px){
 .journey-theater .journey-stage{height:auto}.journey-theater .journey-canvas{position:relative;height:360px}
 .journey-theater .journey-progress{top:356px;bottom:auto}
 .journey-theater .journey-card:not([hidden]){position:relative;display:grid;grid-template-columns:105px minmax(0,1fr);grid-template-rows:auto 1fr;gap:0;left:auto;bottom:auto;width:auto;max-height:none;margin:0;border-radius:0;border:0;border-top:1px solid #d5dece;box-shadow:none;overflow:visible}
 .journey-theater .journey-card>.photo{grid-column:1;grid-row:1;height:100px;margin:12px 0 0 12px;align-self:start;border-radius:8px;overflow:hidden}
 .journey-theater .journey-card>.attribution{grid-column:1;grid-row:2;font-size:8px;padding:5px 8px 10px 12px;overflow-wrap:anywhere}
 .journey-theater .journey-card>div:not(.photo){grid-column:2;grid-row:1 / 3;padding:12px 12px 12px 14px}
 .journey-theater .journey-card h3{font-size:18px;padding-right:14px}.journey-theater .journey-card .eyebrow{font-size:9px}.journey-theater .journey-card-close{right:4px;top:4px;width:26px;min-height:26px!important}
 .journey-theater.expanded .journey-canvas{height:45vh}.journey-theater.expanded .journey-progress{top:calc(45vh - 4px)}
}
@media(min-width:821px){
 .journey-theater .journey-card{max-height:calc(100% - 44px)}
 .journey-theater .journey-card>.photo{height:82px}
 .journey-theater .journey-card>div:not(.photo)>p:not(.eyebrow):not(.journey-leg){display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
}