
/* ==========================================================================
   My Trips V4 — production presentation layer
   Scope: #myTripsView only
   Design: Instrument Sans / #222 / #6A6A6A / #EBEBEB / white-first
   ========================================================================== */

#myTripsView {
  --mt4-text:#222222;
  --mt4-muted:#6A6A6A;
  --mt4-faint:#9A9A9A;
  --mt4-border:#EBEBEB;
  --mt4-soft:#F7F7F7;
  --mt4-soft2:#F2F2F2;
  --mt4-white:#FFFFFF;
  --mt4-green:#00733D;
  --mt4-radius:20px;
  --mt4-gutter:16px;
  background:#fff !important;
  color:var(--mt4-text);
  font-family:"Instrument Sans",system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  -webkit-font-smoothing:antialiased;
  -webkit-overflow-scrolling:touch;
  overflow-y:auto;
  overscroll-behavior-y:auto;
  overflow-anchor:none;
}

#myTripsView .mt4-root {
  min-height:100%;
  background:#fff;
}

/* Pass 1 — lean My Day hero shell. Normal document flow only; collapse/motion belongs to Pass 2. */
#myTripsView .mt4-day-hero-shell {
  background:#fff;
  border-bottom:1px solid var(--mt4-border);
}

#myTripsView .mt4-day-hero-shell-inner {
  width:min(100%, 760px);
  min-height:112px;
  margin:0 auto;
  padding:19px var(--mt4-gutter) 18px;
  display:flex;
  flex-direction:column;
  justify-content:flex-end;
}

#myTripsView .mt4-day-hero-shell-kicker {
  margin:0 0 2px;
  color:var(--mt4-muted);
  font:500 12px/17px "Instrument Sans",system-ui,sans-serif;
}

#myTripsView .mt4-day-hero-shell-title {
  margin:0;
  overflow:hidden;
  color:var(--mt4-text);
  text-overflow:ellipsis;
  white-space:nowrap;
  font:600 25px/30px "Instrument Sans",system-ui,sans-serif;
  letter-spacing:-.02em;
}

#myTripsView .mt4-day-hero-shell-meta {
  margin-top:3px;
  overflow:hidden;
  color:var(--mt4-muted);
  text-overflow:ellipsis;
  white-space:nowrap;
  font:400 13px/18px "Instrument Sans",system-ui,sans-serif;
}

/* Pass 2 — My Day owns the hero. The same tab row rises into the hero's
   vacated layout space whenever another view is selected. No scroll trigger. */
#myTripsView .mt4-day-hero-shell {
  max-height:113px;
  overflow:hidden;
  opacity:1;
  transition:max-height .34s cubic-bezier(.22,.82,.25,1),
             opacity .20s ease,
             border-color .20s ease;
  will-change:max-height,opacity;
}

#myTripsView .mt4-day-hero-shell-inner {
  transition:transform .34s cubic-bezier(.22,.82,.25,1), opacity .20s ease;
  will-change:transform,opacity;
}

#myTripsView .mt4-root:not(.is-day-tab) .mt4-day-hero-shell {
  max-height:0;
  opacity:0;
  border-bottom-color:transparent;
  pointer-events:none;
}

#myTripsView .mt4-root:not(.is-day-tab) .mt4-day-hero-shell-inner {
  transform:translateY(-24px);
  opacity:0;
}

@media (prefers-reduced-motion:reduce) {
  #myTripsView .mt4-day-hero-shell,
  #myTripsView .mt4-day-hero-shell-inner {
    transition:none !important;
  }
}

#myTripsView .mt4-tabs-wrap {
  position:sticky;
  top:0;
  z-index:18;
  background:rgba(255,255,255,.985);
  border-bottom:1px solid var(--mt4-border);
}

#myTripsView .mt4-tabs {
  position:relative;
  display:grid;
  grid-template-columns:repeat(3,1fr);
  height:54px;
  max-width:760px;
  margin:0 auto;
}

#myTripsView .mt4-tab {
  position:relative;
  border:0;
  background:transparent;
  color:var(--mt4-muted);
  font:410 15px/20px "Instrument Sans",system-ui,sans-serif;
  cursor:pointer;
  -webkit-tap-highlight-color:transparent;
  transition:color .14s ease,font-weight .14s ease;
}

#myTripsView .mt4-tab[aria-selected="true"] {
  color:var(--mt4-text);
  font-weight:600;
}

#myTripsView .mt4-indicator {
  position:absolute;
  bottom:-1px;
  left:calc((100% / 3) * var(--mt4-tab-index, 0) + (100% / 6));
  width:58px;
  height:2px;
  border-radius:999px;
  background:var(--mt4-text);
  transform:translateX(-50%);
  transition:left .22s cubic-bezier(.22,.82,.25,1);
  will-change:left;
}

#myTripsView .mt4-page {
  padding:calc(42px + env(safe-area-inset-top)) var(--mt4-gutter) calc(84px + env(safe-area-inset-bottom));
  max-width:1180px;
  margin:0 auto;
  animation:mt4-page-in .18s cubic-bezier(.2,.8,.2,1) both;
}

#myTripsView .mt4-page[data-dir="left"] { animation-name:mt4-page-in-left; }
#myTripsView .mt4-page[data-dir="right"] { animation-name:mt4-page-in-right; }

@keyframes mt4-page-in {
  from { opacity:.55; transform:translateY(4px); }
  to { opacity:1; transform:none; }
}
@keyframes mt4-page-in-left {
  from { opacity:.45; transform:translateX(20px); }
  to { opacity:1; transform:none; }
}
@keyframes mt4-page-in-right {
  from { opacity:.45; transform:translateX(-20px); }
  to { opacity:1; transform:none; }
}

#myTripsView .mt4-eyebrow {
  margin:0 0 5px;
  color:var(--mt4-muted);
  font:400 14px/20px "Instrument Sans",system-ui,sans-serif;
}

#myTripsView .mt4-heading {
  margin:0;
  color:var(--mt4-text);
  font:600 28px/34px "Instrument Sans",system-ui,sans-serif;
  letter-spacing:-.02em;
}

#myTripsView .mt4-sub {
  margin:7px 0 0;
  max-width:620px;
  color:var(--mt4-muted);
  font:400 15px/22px "Instrument Sans",system-ui,sans-serif;
}

#myTripsView .mt4-section { margin-top:34px; }

#myTripsView .mt4-section-head {
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:14px;
  margin-bottom:14px;
}

#myTripsView .mt4-section-title {
  margin:0;
  color:var(--mt4-text);
  font:600 22px/28px "Instrument Sans",system-ui,sans-serif;
  letter-spacing:-.015em;
}

#myTripsView .mt4-link {
  border:0;
  background:transparent;
  padding:4px 0;
  color:var(--mt4-muted);
  font:500 14px/20px "Instrument Sans",system-ui,sans-serif;
  cursor:pointer;
}

#myTripsView .mt4-empty {
  padding:42px 10px 14px;
  text-align:center;
}

#myTripsView .mt4-empty-icon {
  width:48px;
  height:48px;
  margin:0 auto 15px;
  border-radius:50%;
  display:grid;
  place-items:center;
  background:var(--mt4-soft);
  color:var(--mt4-green);
}

#myTripsView .mt4-empty-icon svg { width:22px; height:22px; }

#myTripsView .mt4-empty h2 {
  margin:0;
  color:var(--mt4-text);
  font:600 22px/28px "Instrument Sans",system-ui,sans-serif;
}

#myTripsView .mt4-empty p {
  max-width:370px;
  margin:7px auto 18px;
  color:var(--mt4-muted);
  font:400 15px/22px "Instrument Sans",system-ui,sans-serif;
}

#myTripsView .mt4-btn {
  min-height:46px;
  padding:0 18px;
  border:0;
  border-radius:14px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  color:var(--mt4-text);
  background:#fff;
  font:600 15px/20px "Instrument Sans",system-ui,sans-serif;
  cursor:pointer;
  -webkit-tap-highlight-color:transparent;
  transition:transform .12s ease,background .12s ease;
}

#myTripsView .mt4-btn:active { transform:scale(.98); }
#myTripsView .mt4-btn-primary { background:#222; color:#fff; }
#myTripsView .mt4-btn-secondary { border:1px solid var(--mt4-border); }
#myTripsView .mt4-btn-light { background:rgba(255,255,255,.96); color:#222; }

#myTripsView .mt4-weather {
  display:flex;
  align-items:center;
  gap:12px;
  margin-top:22px;
  padding:15px 0 2px;
}

#myTripsView .mt4-weather-icon {
  width:44px;
  height:44px;
  flex:0 0 44px;
  border-radius:50%;
  background:var(--mt4-soft);
  display:grid;
  place-items:center;
  font-size:22px;
}

#myTripsView .mt4-weather-temp {
  color:var(--mt4-text);
  font:600 20px/24px "Instrument Sans",system-ui,sans-serif;
}

#myTripsView .mt4-weather-copy {
  margin-top:2px;
  color:var(--mt4-muted);
  font:400 14px/19px "Instrument Sans",system-ui,sans-serif;
}

#myTripsView .mt4-hero {
  position:relative;
  min-height:430px;
  margin-top:22px;
  overflow:hidden;
  border-radius:var(--mt4-radius);
  background:var(--mt4-soft2);
}

#myTripsView .mt4-hero img {
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
}

#myTripsView .mt4-hero::after {
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(to bottom,rgba(0,0,0,.02) 34%,rgba(0,0,0,.64) 100%);
}

#myTripsView .mt4-hero-content {
  position:relative;
  z-index:2;
  min-height:430px;
  padding:22px;
  display:flex;
  flex-direction:column;
  justify-content:flex-end;
  color:#fff;
}

#myTripsView .mt4-hero-kicker {
  color:rgba(255,255,255,.82);
  font:500 14px/20px "Instrument Sans",system-ui,sans-serif;
}

#myTripsView .mt4-hero-title {
  max-width:92%;
  margin-top:5px;
  color:#fff;
  font:600 30px/34px "Instrument Sans",system-ui,sans-serif;
  letter-spacing:-.02em;
}

#myTripsView .mt4-hero-meta {
  margin-top:6px;
  color:rgba(255,255,255,.82);
  font:400 14px/20px "Instrument Sans",system-ui,sans-serif;
}

#myTripsView .mt4-actions {
  display:flex;
  gap:9px;
  flex-wrap:wrap;
  margin-top:18px;
}

#myTripsView .mt4-stop-list {
  margin-top:18px;
  border-top:1px solid var(--mt4-border);
}

#myTripsView .mt4-stop {
  display:grid;
  grid-template-columns:24px 64px minmax(0,1fr);
  gap:12px;
  align-items:center;
  padding:14px 0;
  border-bottom:1px solid var(--mt4-border);
}

#myTripsView .mt4-stop-index {
  color:var(--mt4-faint);
  text-align:center;
  font:500 13px/18px "Instrument Sans",system-ui,sans-serif;
}

#myTripsView .mt4-stop img {
  width:64px;
  height:64px;
  border-radius:14px;
  object-fit:cover;
  background:var(--mt4-soft2);
}

#myTripsView .mt4-stop-name {
  overflow:hidden;
  color:var(--mt4-text);
  text-overflow:ellipsis;
  white-space:nowrap;
  font:600 15px/20px "Instrument Sans",system-ui,sans-serif;
}

#myTripsView .mt4-stop-meta {
  margin-top:3px;
  overflow:hidden;
  color:var(--mt4-muted);
  text-overflow:ellipsis;
  white-space:nowrap;
  font:400 14px/19px "Instrument Sans",system-ui,sans-serif;
}

#myTripsView .mt4-now {
  margin-top:22px;
  padding:22px;
  border-radius:var(--mt4-radius);
  background:#222;
  color:#fff;
}

#myTripsView .mt4-now-kicker {
  color:rgba(255,255,255,.66);
  font:400 13px/18px "Instrument Sans",system-ui,sans-serif;
}

#myTripsView .mt4-now-title {
  margin-top:5px;
  color:#fff;
  font:600 28px/32px "Instrument Sans",system-ui,sans-serif;
  letter-spacing:-.02em;
}

#myTripsView .mt4-now-meta {
  margin-top:6px;
  color:rgba(255,255,255,.72);
  font:400 14px/20px "Instrument Sans",system-ui,sans-serif;
}

#myTripsView .mt4-progress {
  display:flex;
  gap:6px;
  margin-top:18px;
}

#myTripsView .mt4-progress span {
  height:3px;
  flex:1;
  border-radius:999px;
  background:rgba(255,255,255,.22);
}

#myTripsView .mt4-progress span.is-done { background:#fff; }

#myTripsView .mt4-scroll {
  display:flex;
  gap:14px;
  overflow-x:auto;
  scrollbar-width:none;
  scroll-snap-type:x proximity;
  margin:0 calc(var(--mt4-gutter) * -1);
  padding:0 var(--mt4-gutter) 4px;
}

#myTripsView .mt4-scroll::-webkit-scrollbar { display:none; }

#myTripsView .mt4-card {
  flex:0 0 82vw;
  max-width:340px;
  overflow:hidden;
  border:1px solid var(--mt4-border);
  border-radius:var(--mt4-radius);
  background:#fff;
  scroll-snap-align:start;
}

#myTripsView .mt4-card-media {
  aspect-ratio:1/1;
  overflow:hidden;
  background:var(--mt4-soft2);
}

#myTripsView .mt4-card-media img {
  width:100%;
  height:100%;
  object-fit:cover;
}

#myTripsView .mt4-card-body { padding:14px 16px 16px; }

#myTripsView .mt4-card-title {
  color:var(--mt4-text);
  font:600 16px/21px "Instrument Sans",system-ui,sans-serif;
  letter-spacing:-.01em;
}

#myTripsView .mt4-card-meta {
  margin-top:4px;
  color:var(--mt4-muted);
  font:400 14px/19px "Instrument Sans",system-ui,sans-serif;
}

#myTripsView .mt4-card-signal {
  margin-top:12px;
  padding-top:12px;
  border-top:1px solid var(--mt4-border);
  color:var(--mt4-muted);
  font:400 13px/18px "Instrument Sans",system-ui,sans-serif;
}

#myTripsView .mt4-card-signal strong { color:var(--mt4-text); font-weight:600; }

#myTripsView .mt4-memory-list { display:grid; gap:0; }

#myTripsView .mt4-memory {
  display:grid;
  grid-template-columns:88px minmax(0,1fr);
  gap:14px;
  align-items:center;
  padding:12px 0;
  border-bottom:1px solid var(--mt4-border);
}

#myTripsView .mt4-memory:last-child { border-bottom:0; }

#myTripsView .mt4-memory img {
  width:88px;
  height:88px;
  border-radius:16px;
  object-fit:cover;
  background:var(--mt4-soft2);
}

#myTripsView .mt4-memory-title {
  color:var(--mt4-text);
  font:600 16px/21px "Instrument Sans",system-ui,sans-serif;
}

#myTripsView .mt4-memory-meta {
  margin-top:4px;
  color:var(--mt4-muted);
  font:400 14px/19px "Instrument Sans",system-ui,sans-serif;
}

#myTripsView .mt4-note {
  margin-top:18px;
  padding:16px;
  border-radius:16px;
  background:var(--mt4-soft);
  color:var(--mt4-muted);
  font:400 14px/20px "Instrument Sans",system-ui,sans-serif;
}

/* Desktop contained planner: preserve one canonical renderer, just give it air. */
@media (min-width:821px) {
  #mhlMobileContent.mhl-desktop-contained #myTripsView {
    --mt4-gutter:20px;
  }

  #mhlMobileContent.mhl-desktop-contained #myTripsView .mt4-page {
    padding-top:22px;
  }

  #mhlMobileContent.mhl-desktop-contained #myTripsView .mt4-heading {
    font-size:26px;
    line-height:32px;
  }

  #mhlMobileContent.mhl-desktop-contained #myTripsView .mt4-hero,
  #mhlMobileContent.mhl-desktop-contained #myTripsView .mt4-hero-content {
    min-height:360px;
  }

  #mhlMobileContent.mhl-desktop-contained #myTripsView .mt4-card {
    flex-basis:300px;
  }
}

@media (min-width:1024px) {
  #myTripsView .mt4-page { padding-left:24px; padding-right:24px; }
  #myTripsView .mt4-heading { font-size:34px; line-height:40px; }
  #myTripsView .mt4-hero,
  #myTripsView .mt4-hero-content { min-height:520px; }
  #myTripsView .mt4-hero-content { padding:32px; }
  #myTripsView .mt4-hero-title { font-size:38px; line-height:42px; }
}


/* V4 Pass 1 — My Day Foundation */
#myTripsView .mt4-day-empty {
  padding-top:30px;
}

#myTripsView .mt4-day-intro {
  max-width:680px;
}

#myTripsView .mt4-greeting {
  font-size:30px;
  line-height:36px;
}

#myTripsView .mt4-day-start {
  margin-top:34px;
  max-width:560px;
  padding-top:26px;
  border-top:1px solid var(--mt4-border);
}

#myTripsView .mt4-day-start h2 {
  margin:0;
  color:var(--mt4-text);
  font:600 22px/28px "Instrument Sans",system-ui,sans-serif;
  letter-spacing:-.015em;
}

#myTripsView .mt4-day-start p {
  max-width:480px;
  margin:7px 0 18px;
  color:var(--mt4-muted);
  font:400 15px/22px "Instrument Sans",system-ui,sans-serif;
}

#myTripsView .mt4-weather {
  min-height:62px;
  gap:11px;
  margin-top:16px;
  padding:0;
}

#myTripsView .mt4-weather-icon {
  width:42px;
  height:42px;
  flex-basis:42px;
  background:transparent;
  font-size:25px;
}

#myTripsView .mt4-weather-temp {
  display:flex;
  align-items:baseline;
  gap:7px;
  font-size:20px;
  line-height:24px;
}

#myTripsView .mt4-weather-temp span {
  color:var(--mt4-muted);
  font-size:14px;
  font-weight:400;
}

#myTripsView .mt4-weather-loading {
  opacity:.72;
}

#myTripsView .mt4-weather-mark {
  width:10px;
  height:10px;
  margin:0 16px;
  border-radius:50%;
  background:var(--mt4-border);
  animation:mt4-weather-pulse 1.4s ease-in-out infinite;
}

@keyframes mt4-weather-pulse {
  0%,100% { opacity:.45; transform:scale(.9); }
  50% { opacity:1; transform:scale(1); }
}

#myTripsView .mt4-ideas {
  margin-top:42px;
}

#myTripsView .mt4-card {
  cursor:pointer;
  transition:transform .14s ease;
}

#myTripsView .mt4-card:active {
  transform:scale(.985);
}

#myTripsView .mt4-card-placeholder {
  width:100%;
  height:100%;
  background:linear-gradient(145deg,#F7F7F7,#EEEEEE);
}

@media (min-width:768px) {
  #myTripsView .mt4-greeting {
    font-size:34px;
    line-height:40px;
  }
  #myTripsView .mt4-day-empty {
    padding-top:38px;
  }
}


/* PASS 1B CORRECTION — preserve production shell, fix canvas + tablet alignment */
#myTripsView .mt4-root {
  min-height:100dvh;
  background:#fff;
}

/* Tablet is an expanded mobile experience: center the content rhythm without
   repositioning the host/overlay itself. */
@media (min-width:768px) and (max-width:1024px) {
  #myTripsView .mt4-tabs,
  #myTripsView .mt4-page {
    width:min(100% - 48px, 640px);
    max-width:640px;
    margin-left:auto;
    margin-right:auto;
  }

  #myTripsView .mt4-page {
    padding-left:0;
    padding-right:0;
  }
}


/* ==========================================================================
   PASS 2 — LIVING SKY
   Weather is the room. My Day is full-bleed atmosphere.
   ========================================================================== */

#myTripsView .mt4-living-day{
  position:relative;
  isolation:isolate;
  min-height:100dvh;
  max-width:none;
  margin:0;
  padding:0 0 calc(90px + env(safe-area-inset-bottom));
  overflow:hidden;
  color:#fff;
}

#myTripsView .mt4-living-content{
  position:relative;
  z-index:2;
  padding:34px 0 48px;
}

#myTripsView .mt4-atmosphere{
  position:absolute;
  inset:0;
  z-index:0;
  overflow:hidden;
  pointer-events:none;
  background:
    radial-gradient(circle at 70% 8%,rgba(255,255,255,.23),transparent 28%),
    linear-gradient(180deg,#6F98C8 0%,#8EABD0 38%,#C6B4A2 100%);
  transition:background 1.2s ease;
}

#myTripsView .mt4-atmosphere-morning{
  background:
    radial-gradient(circle at 72% 12%,rgba(255,244,207,.52),transparent 24%),
    linear-gradient(180deg,#8FB3D9 0%,#C8D6E8 43%,#E8C5A4 100%);
}

#myTripsView .mt4-atmosphere-day{
  background:
    radial-gradient(circle at 74% 9%,rgba(255,255,255,.34),transparent 24%),
    linear-gradient(180deg,#5E8EC5 0%,#7DA5D1 48%,#AEBED1 100%);
}

#myTripsView .mt4-atmosphere-sunset{
  background:
    radial-gradient(circle at 68% 28%,rgba(255,215,164,.55),transparent 25%),
    linear-gradient(180deg,#5579A9 0%,#8D89AA 47%,#C8947C 100%);
}

#myTripsView .mt4-atmosphere-night{
  background:
    radial-gradient(circle at 78% 9%,rgba(255,255,255,.10),transparent 22%),
    linear-gradient(180deg,#172B4D 0%,#29436B 48%,#465A78 100%);
}

#myTripsView .mt4-atmosphere-cloudy{
  background:
    radial-gradient(circle at 70% 10%,rgba(255,255,255,.15),transparent 24%),
    linear-gradient(180deg,#788594 0%,#98A0A8 48%,#B8B2AD 100%);
}

#myTripsView .mt4-atmosphere-rain,
#myTripsView .mt4-atmosphere-storm{
  background:
    radial-gradient(circle at 68% 8%,rgba(255,255,255,.08),transparent 20%),
    linear-gradient(180deg,#465463 0%,#66717D 50%,#84878A 100%);
}

#myTripsView .mt4-sky-glow{
  position:absolute;
  inset:-20%;
  background:radial-gradient(circle at 72% 16%,rgba(255,255,255,.16),transparent 34%);
}

#myTripsView .mt4-cloud{
  position:absolute;
  width:52vw;
  height:20vw;
  min-width:260px;
  min-height:110px;
  max-width:620px;
  max-height:240px;
  border-radius:50%;
  filter:blur(28px);
  opacity:.18;
  background:rgba(255,255,255,.88);
  will-change:transform;
}

#myTripsView .mt4-cloud-a{
  top:7%;
  left:-24%;
  animation:mt4-cloud-drift-a 42s linear infinite;
}

#myTripsView .mt4-cloud-b{
  top:24%;
  right:-30%;
  opacity:.11;
  animation:mt4-cloud-drift-b 56s linear infinite;
}

#myTripsView .mt4-atmosphere-night .mt4-cloud{opacity:.06}
#myTripsView .mt4-atmosphere-rain .mt4-cloud,
#myTripsView .mt4-atmosphere-storm .mt4-cloud{opacity:.23}

@keyframes mt4-cloud-drift-a{
  from{transform:translate3d(0,0,0) scale(1)}
  to{transform:translate3d(145vw,8vh,0) scale(1.08)}
}

@keyframes mt4-cloud-drift-b{
  from{transform:translate3d(0,0,0) scale(.92)}
  to{transform:translate3d(-150vw,-4vh,0) scale(1.04)}
}

#myTripsView .mt4-rain-layer{
  position:absolute;
  inset:-20% 0 0;
  opacity:0;
  background-image:repeating-linear-gradient(
    112deg,
    rgba(255,255,255,.22) 0 1px,
    transparent 1px 13px
  );
  background-size:18px 46px;
  animation:mt4-rain-fall .9s linear infinite;
}

#myTripsView .mt4-atmosphere-rain .mt4-rain-layer{opacity:.16}
#myTripsView .mt4-atmosphere-storm .mt4-rain-layer{opacity:.24}

@keyframes mt4-rain-fall{
  from{transform:translate3d(0,-32px,0)}
  to{transform:translate3d(-10px,32px,0)}
}

#myTripsView .mt4-weather-hero{
  padding:26px 18px 18px;
  text-align:center;
  color:#fff;
  text-shadow:0 1px 18px rgba(0,0,0,.12);
}

#myTripsView .mt4-weather-place{
  font:500 25px/30px "Instrument Sans",system-ui,sans-serif;
  letter-spacing:-.02em;
}

#myTripsView .mt4-weather-big{
  margin-top:4px;
  font:300 86px/90px "Instrument Sans",system-ui,sans-serif;
  letter-spacing:-.06em;
}

#myTripsView .mt4-weather-condition{
  margin-top:3px;
  color:rgba(255,255,255,.88);
  font:400 18px/24px "Instrument Sans",system-ui,sans-serif;
}

#myTripsView .mt4-glass-card,
#myTripsView .mt4-living-day .mt4-card{
  background:rgba(255,255,255,.16);
  border:1px solid rgba(255,255,255,.20);
  -webkit-backdrop-filter:blur(24px) saturate(115%);
  backdrop-filter:blur(24px) saturate(115%);
  box-shadow:0 10px 32px rgba(20,30,45,.10);
}

#myTripsView .mt4-day-brief{
  margin:20px 14px 0;
  padding:22px;
  border-radius:22px;
  color:#fff;
}

#myTripsView .mt4-glass-kicker{
  margin:0 0 7px;
  color:rgba(255,255,255,.72);
  font:400 14px/20px "Instrument Sans",system-ui,sans-serif;
}

#myTripsView .mt4-day-brief h1{
  margin:0;
  color:#fff;
  font:600 26px/32px "Instrument Sans",system-ui,sans-serif;
  letter-spacing:-.025em;
}

#myTripsView .mt4-brief-line{
  max-width:460px;
  margin:8px 0 18px;
  color:rgba(255,255,255,.83);
  font:400 15px/22px "Instrument Sans",system-ui,sans-serif;
}

#myTripsView .mt4-plan-cta{
  background:#fff;
  color:#222;
}

#myTripsView .mt4-living-day .mt4-ideas{
  margin-top:30px;
}

#myTripsView .mt4-living-day .mt4-section-head{
  padding:0 16px;
}

#myTripsView .mt4-living-day .mt4-section-title{
  color:#fff;
}

#myTripsView .mt4-living-day .mt4-scroll{
  margin:0;
  padding:0 16px 8px;
}

#myTripsView .mt4-living-day .mt4-card-title{
  color:#fff;
}

#myTripsView .mt4-living-day .mt4-card-meta,
#myTripsView .mt4-living-day .mt4-card-signal{
  color:rgba(255,255,255,.72);
}

#myTripsView .mt4-living-day .mt4-card-signal{
  border-color:rgba(255,255,255,.18);
}

#myTripsView .mt4-living-day .mt4-card-signal strong{
  color:#fff;
}

#myTripsView:has(.mt4-living-day) .mt4-tabs-wrap{
  background:rgba(255,255,255,.12);
  border-bottom-color:rgba(255,255,255,.14);
  -webkit-backdrop-filter:blur(20px) saturate(115%);
  backdrop-filter:blur(20px) saturate(115%);
}

#myTripsView:has(.mt4-living-day) .mt4-tab{
  color:rgba(255,255,255,.68);
}

#myTripsView:has(.mt4-living-day) .mt4-tab[aria-selected="true"]{
  color:#fff;
}

#myTripsView:has(.mt4-living-day) .mt4-indicator{
  background:#fff;
}

/* Mobile melts into the glass. Tablet/laptop get only 2px of edge breathing room. */
@media (max-width:767px){
  #myTripsView .mt4-living-day{margin:0}
}

@media (min-width:768px){
  #myTripsView .mt4-living-day{
    margin:2px;
    min-height:calc(100dvh - 4px);
    border-radius:20px;
  }
  #myTripsView .mt4-weather-big{
    font-size:96px;
    line-height:100px;
  }
}

@media (prefers-reduced-motion:reduce){
  #myTripsView .mt4-cloud,
  #myTripsView .mt4-rain-layer{
    animation:none !important;
  }
}


/* ==========================================================================
   PASS 2A — IMMERSIVE SKY / NAV INTEGRATION
   Removes the white interruption above Living Sky and makes the tabs belong
   to the atmosphere from frame one.
   ========================================================================== */

/* The Living Sky owns the entire My Day room, including the sticky nav area. */
#myTripsView .mt4-root.is-living-day{
  --mt4-live-top:#29436B;
  --mt4-live-mid:#3E5777;
  --mt4-live-low:#5D6B80;
  min-height:100dvh;
  background:
    radial-gradient(circle at 72% 8%,rgba(255,255,255,.10),transparent 22%),
    linear-gradient(180deg,var(--mt4-live-top) 0%,var(--mt4-live-mid) 48%,var(--mt4-live-low) 100%);
}

/* Match the root sky to the active atmosphere so there is no white seam. */
#myTripsView .mt4-root.is-living-day:has(.mt4-atmosphere-morning){
  --mt4-live-top:#8FB3D9;
  --mt4-live-mid:#C8D6E8;
  --mt4-live-low:#E8C5A4;
}
#myTripsView .mt4-root.is-living-day:has(.mt4-atmosphere-day){
  --mt4-live-top:#5E8EC5;
  --mt4-live-mid:#7DA5D1;
  --mt4-live-low:#AEBED1;
}
#myTripsView .mt4-root.is-living-day:has(.mt4-atmosphere-sunset){
  --mt4-live-top:#5579A9;
  --mt4-live-mid:#8D89AA;
  --mt4-live-low:#C8947C;
}
#myTripsView .mt4-root.is-living-day:has(.mt4-atmosphere-night){
  --mt4-live-top:#172B4D;
  --mt4-live-mid:#29436B;
  --mt4-live-low:#465A78;
}
#myTripsView .mt4-root.is-living-day:has(.mt4-atmosphere-cloudy){
  --mt4-live-top:#788594;
  --mt4-live-mid:#98A0A8;
  --mt4-live-low:#B8B2AD;
}
#myTripsView .mt4-root.is-living-day:has(.mt4-atmosphere-rain),
#myTripsView .mt4-root.is-living-day:has(.mt4-atmosphere-storm){
  --mt4-live-top:#465463;
  --mt4-live-mid:#66717D;
  --mt4-live-low:#84878A;
}

/* Nav is glass immediately — never a white reveal/fade-in. */
#myTripsView .mt4-root.is-living-day .mt4-tabs-wrap{
  background:rgba(255,255,255,.10) !important;
  border-bottom-color:rgba(255,255,255,.14) !important;
  -webkit-backdrop-filter:blur(20px) saturate(115%);
  backdrop-filter:blur(20px) saturate(115%);
  box-shadow:none;
}

#myTripsView .mt4-root.is-living-day .mt4-tab{
  color:rgba(255,255,255,.68) !important;
}

#myTripsView .mt4-root.is-living-day .mt4-tab[aria-selected="true"]{
  color:#fff !important;
}

#myTripsView .mt4-root.is-living-day .mt4-indicator{
  background:#fff !important;
}

/* Remove the former extra top breathing room and let weather begin immediately
   beneath the glass tabs. */
#myTripsView .mt4-living-day{
  padding-top:0 !important;
}

#myTripsView .mt4-living-content{
  padding-top:8px !important;
}

/* Weather is the hero, not a widget. */
#myTripsView .mt4-weather-hero{
  min-height:44dvh;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  padding:10px 18px 74px !important;
}

#myTripsView .mt4-weather-place{
  font-size:26px;
  line-height:32px;
}

#myTripsView .mt4-weather-big{
  margin-top:2px;
  font-size:102px;
  line-height:104px;
}

#myTripsView .mt4-weather-condition{
  margin-top:4px;
}

/* Float the briefing into the bottom of the weather hero. */
#myTripsView .mt4-day-brief{
  position:relative;
  z-index:3;
  margin:-58px 14px 0 !important;
  border-radius:24px !important;
  background:rgba(255,255,255,.15) !important;
  border-color:rgba(255,255,255,.22) !important;
  -webkit-backdrop-filter:blur(26px) saturate(120%);
  backdrop-filter:blur(26px) saturate(120%);
}

/* More atmospheric depth, still restrained. */
#myTripsView .mt4-atmosphere::after{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:
    radial-gradient(circle at 18% 14%,rgba(255,255,255,.06),transparent 24%),
    radial-gradient(circle at 86% 32%,rgba(255,255,255,.05),transparent 28%),
    linear-gradient(180deg,transparent 50%,rgba(0,0,0,.06) 100%);
}

@media (max-width:767px){
  #myTripsView .mt4-weather-hero{
    min-height:46dvh;
    padding-bottom:72px !important;
  }
  #myTripsView .mt4-weather-big{
    font-size:96px;
    line-height:98px;
  }
  #myTripsView .mt4-day-brief{
    margin-left:12px !important;
    margin-right:12px !important;
  }
}

@media (min-width:768px){
  #myTripsView .mt4-weather-hero{
    min-height:48dvh;
  }
  #myTripsView .mt4-weather-big{
    font-size:112px;
    line-height:114px;
  }
}


/* ==========================================================================
   PASS 2B — iPAD LIVING SKY EDGE FIX
   The generic tablet .mt4-page width cap was also constraining .mt4-living-day,
   exposing the white root beneath it along the side and bottom.
   Living Sky must own the entire tablet shell.
   ========================================================================== */

@media (min-width:768px) and (max-width:1100px){
  #myTripsView .mt4-page.mt4-living-day{
    width:100% !important;
    max-width:none !important;
    margin:0 !important;
    min-height:100% !important;
    border-radius:0 !important;
    padding-left:0 !important;
    padding-right:0 !important;
  }

  #myTripsView .mt4-root.is-living-day{
    width:100%;
    min-height:100%;
    /* Tablet Living Sky root must remain the atmospheric backdrop.
       The former combined rule set this root to transparent, so the glass
       My Day tabs were actually rendering white text over the white planner
       shell. Upcoming/Memories looked correct because they leave Living Day. */
    background:
      radial-gradient(circle at 72% 8%,rgba(255,255,255,.10),transparent 22%),
      linear-gradient(180deg,var(--mt4-live-top) 0%,var(--mt4-live-mid) 48%,var(--mt4-live-low) 100%) !important;
  }

  #myTripsView .mt4-root.is-living-day #mt4PageHost{
    width:100%;
    min-height:100%;
    background:transparent;
  }
}


/* ==========================================================================
   PASS 2D — CONTAINED SCROLL RESTORE
   IMPORTANT: #myTripsView remains the single vertical scroll container.
   Do not trap contained iPad/desktop content with overflow:hidden.
   ========================================================================== */

@media (min-width:768px) {
  /* The contained shell is shorter than the browser viewport, so size against
     the shell — but keep #myTripsView as the only vertical scroller. */
  #mhlMobileContent.mhl-desktop-contained #myTripsView {
    height:100%;
    min-height:0;
    overflow-y:auto !important;
    overflow-x:hidden;
    -webkit-overflow-scrolling:touch;
    overscroll-behavior-y:auto;
    background:transparent !important;
  }

  #mhlMobileContent.mhl-desktop-contained #myTripsView .mt4-root.is-living-day {
    min-height:100%;
    height:auto !important;
    overflow:visible !important;
  }

  #mhlMobileContent.mhl-desktop-contained #myTripsView .mt4-root.is-living-day #mt4PageHost {
    min-height:calc(100% - 54px);
    height:auto !important;
    overflow:visible !important;
    background:transparent !important;
  }

  #mhlMobileContent.mhl-desktop-contained #myTripsView .mt4-page.mt4-living-day {
    width:100% !important;
    max-width:none !important;
    min-height:calc(100% - 54px) !important;
    height:auto !important;
    margin:0 !important;
    border-radius:0 !important;
    overflow:visible !important;
  }

  /* Tabs remain sticky inside the actual My Trips scroller. */
  #mhlMobileContent.mhl-desktop-contained #myTripsView .mt4-root.is-living-day .mt4-tabs-wrap {
    position:sticky;
    top:0;
    z-index:30;
    opacity:1 !important;
    visibility:visible !important;
  }
}


/* ==========================================================================
   PASS 2E — iPAD / CONTAINED NAV VISIBILITY
   Last contained-mode issue: some iPads reopen #myTripsView roughly one tab
   row down, so the sticky nav exists but begins above the visible scroller.
   Keep the nav as a fixed-height first row; JS reasserts scrollTop:0 at mount.
   ========================================================================== */
@media (min-width:768px) {
  #mhlMobileContent.mhl-desktop-contained #myTripsView .mt4-root.is-living-day .mt4-tabs-wrap{
    display:block !important;
    flex:0 0 54px;
    height:54px;
    min-height:54px;
    opacity:1 !important;
    visibility:visible !important;
  }

  #mhlMobileContent.mhl-desktop-contained #myTripsView .mt4-root.is-living-day .mt4-tabs{
    height:54px;
    min-height:54px;
  }
}


/* ==========================================================================
   PASS 2O — iPAD MINI / MY DAY SCROLL GEOMETRY
   768–820px only. My Day only.

   The Mini is the only device where Living Day hands vertical gestures back
   to the homepage. Upcoming/Memories use the same #myTripsView scroller and
   work correctly. The unique difference is Living Day's viewport-sized root.

   Keep #myTripsView as the sole scroll owner and make the Living Day subtree
   size itself to the contained planner rather than to 100dvh.
   ========================================================================== */

@media (min-width:768px) and (max-width:820px) {
  #mhlMobileContent.mhl-desktop-contained #myTripsView .mt4-root.is-living-day {
    min-height:0 !important;
    height:auto !important;
  }

  #mhlMobileContent.mhl-desktop-contained #myTripsView .mt4-root.is-living-day #mt4PageHost {
    min-height:100% !important;
    height:auto !important;
  }

  #mhlMobileContent.mhl-desktop-contained #myTripsView .mt4-page.mt4-living-day {
    min-height:100% !important;
    height:auto !important;
    overflow:visible !important;
  }
}


/* ==========================================================================
   MY DAY HERO PRESENTATION — contained weather + identity card
   Presentation only. The retired full-room Living Sky rules above remain
   untouched but are dormant because renderDay() no longer mounts that scene.
   ========================================================================== */

#myTripsView .mt4-day-hero-shell{
  max-height:320px;
  padding:12px 14px 0;
  border-bottom:0;
  background:#fff;
}

#myTripsView .mt4-day-hero-shell-inner{
  width:min(100%,760px);
  min-height:0;
  margin:0 auto;
  padding:0;
  display:block;
}

#myTripsView .mt4-day-hero-stage{
  position:relative;
  height:286px;
  overflow:hidden;
  border-radius:22px;
  background:#98A7B4;
  box-shadow:0 8px 24px rgba(34,34,34,.10);
  isolation:isolate;
}

/* Weather art direction: condition-native, crisp, and contained.
   No universal gray veil, no blur filter, and no full-room weather effects. */
#myTripsView .mt4-day-hero-stage .mt4-atmosphere{
  position:absolute;
  inset:0;
  z-index:0;
  opacity:1;
  filter:none;
  transition:background .7s ease;
}

/* The old full-room animated layers stay dormant in the compact hero. */
#myTripsView .mt4-day-hero-stage .mt4-cloud,
#myTripsView .mt4-day-hero-stage .mt4-rain-layer,
#myTripsView .mt4-day-hero-stage .mt4-sky-glow{
  display:none !important;
}

/* Pseudo layers are deliberately sharp. They provide local light/weather
   detail without putting a translucent gray wash over the entire hero. */
#myTripsView .mt4-day-hero-stage .mt4-atmosphere::before,
#myTripsView .mt4-day-hero-stage .mt4-atmosphere::after{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
}

/* Morning — clean pale-blue sky with a warm localized sunrise. */
#myTripsView .mt4-day-hero-stage .mt4-atmosphere-morning{
  background:linear-gradient(155deg,#79B7E8 0%,#9CCCF0 48%,#D9E8F2 100%);
}
#myTripsView .mt4-day-hero-stage .mt4-atmosphere-morning::before{
  background:
    radial-gradient(circle at 10% 10%,rgba(255,252,236,.98) 0 3%,rgba(255,225,174,.52) 4% 9%,rgba(255,225,174,0) 20%);
}
#myTripsView .mt4-day-hero-stage .mt4-atmosphere-morning::after{
  background:
    radial-gradient(circle at 29% 27%,rgba(255,255,255,.08) 0 1.2%,transparent 2%);
}

/* Clear/sunny day — compact Apple-inspired art direction:
   true sky blue, sun upper-left, localized warm bloom, almost no lens feedback.
   This hero is small, so the light treatment stays restrained. */
#myTripsView .mt4-day-hero-stage .mt4-atmosphere-day{
  background:
    linear-gradient(155deg,#147FD1 0%,#258DDA 48%,#57A8E5 100%);
}
#myTripsView .mt4-day-hero-stage .mt4-atmosphere-day::before{
  background:
    radial-gradient(circle at 9% 7%,
      rgba(255,255,250,1) 0 2.8%,
      rgba(255,250,220,.98) 3% 5.2%,
      rgba(255,235,180,.62) 5.5% 9%,
      rgba(255,228,160,.20) 10% 15%,
      rgba(255,228,160,0) 22%);
}
#myTripsView .mt4-day-hero-stage .mt4-atmosphere-day::after{
  background:
    radial-gradient(circle at 27% 24%,rgba(255,255,255,.10) 0 1.1%,transparent 1.8%),
    radial-gradient(circle at 37% 34%,rgba(220,244,255,.07) 0 1.6%,transparent 2.4%);
}

/* Sunset — warm horizon with retained blue above; still clean, not smoky. */
#myTripsView .mt4-day-hero-stage .mt4-atmosphere-sunset{
  background:linear-gradient(165deg,#426FA5 0%,#7B86B4 45%,#E6A27E 78%,#F2C18F 100%);
}
#myTripsView .mt4-day-hero-stage .mt4-atmosphere-sunset::before{
  background:radial-gradient(circle at 82% 72%,rgba(255,224,157,.9) 0 5%,rgba(255,170,112,.30) 7% 18%,transparent 34%);
}
#myTripsView .mt4-day-hero-stage .mt4-atmosphere-sunset::after{
  background:linear-gradient(180deg,transparent 0 68%,rgba(104,58,71,.08) 100%);
}

/* Clear night — genuinely dark, clear sky with a restrained star field.
   This is not the daytime scene merely darkened. */
#myTripsView .mt4-day-hero-stage .mt4-atmosphere-night{
  background:linear-gradient(160deg,#07172D 0%,#102B50 54%,#1D4771 100%);
}
#myTripsView .mt4-day-hero-stage .mt4-atmosphere-night::before{
  background:
    radial-gradient(circle at 84% 17%,rgba(241,247,255,.95) 0 1.2%,rgba(210,226,255,.20) 1.5% 5%,transparent 8%),
    radial-gradient(circle at 12% 20%,rgba(255,255,255,.92) 0 1px,transparent 1.5px),
    radial-gradient(circle at 25% 10%,rgba(255,255,255,.82) 0 1px,transparent 1.5px),
    radial-gradient(circle at 40% 27%,rgba(255,255,255,.9) 0 1px,transparent 1.5px),
    radial-gradient(circle at 55% 14%,rgba(255,255,255,.72) 0 1px,transparent 1.5px),
    radial-gradient(circle at 70% 31%,rgba(255,255,255,.88) 0 1px,transparent 1.5px),
    radial-gradient(circle at 91% 34%,rgba(255,255,255,.75) 0 1px,transparent 1.5px),
    radial-gradient(circle at 18% 43%,rgba(255,255,255,.7) 0 1px,transparent 1.5px),
    radial-gradient(circle at 48% 45%,rgba(255,255,255,.78) 0 1px,transparent 1.5px);
}
#myTripsView .mt4-day-hero-stage .mt4-atmosphere-night::after{
  background:radial-gradient(ellipse at 50% 105%,rgba(50,112,158,.28) 0%,transparent 58%);
}

/* Cloudy — dimensional cloud cover without blur/smoke. */
#myTripsView .mt4-day-hero-stage .mt4-atmosphere-cloudy{
  background:linear-gradient(155deg,#6F94B4 0%,#8FA9BE 48%,#B8C7D1 100%);
}
#myTripsView .mt4-day-hero-stage .mt4-atmosphere-cloudy::before{
  background:
    radial-gradient(ellipse at 82% 17%,rgba(236,242,246,.72) 0 15%,transparent 16%),
    radial-gradient(ellipse at 69% 23%,rgba(224,233,239,.68) 0 18%,transparent 19%),
    radial-gradient(ellipse at 28% 5%,rgba(242,246,248,.55) 0 16%,transparent 17%);
}
#myTripsView .mt4-day-hero-stage .mt4-atmosphere-cloudy::after{
  background:linear-gradient(180deg,rgba(255,255,255,.04),transparent 56%);
}

/* Rain/storm — deeper blue-slate with crisp rain texture, not fog. */
#myTripsView .mt4-day-hero-stage .mt4-atmosphere-rain{
  background:linear-gradient(155deg,#31556F 0%,#4E7189 52%,#7592A5 100%);
}
#myTripsView .mt4-day-hero-stage .mt4-atmosphere-storm{
  background:linear-gradient(155deg,#1E3548 0%,#385369 52%,#5E7180 100%);
}
#myTripsView .mt4-day-hero-stage .mt4-atmosphere-rain::before,
#myTripsView .mt4-day-hero-stage .mt4-atmosphere-storm::before{
  background:
    repeating-linear-gradient(112deg,transparent 0 15px,rgba(220,239,250,.18) 16px 17px,transparent 18px 31px);
}
#myTripsView .mt4-day-hero-stage .mt4-atmosphere-rain::after,
#myTripsView .mt4-day-hero-stage .mt4-atmosphere-storm::after{
  background:linear-gradient(180deg,rgba(8,25,39,.04),rgba(8,25,39,.14));
}

#myTripsView .mt4-day-hero-weather-copy{
  position:absolute;
  z-index:2;
  top:22px;
  left:24px;
  color:#fff;
  text-shadow:0 1px 12px rgba(0,0,0,.16);
}

#myTripsView .mt4-day-hero-weather-temp{
  font:500 32px/34px "Instrument Sans",system-ui,sans-serif;
  letter-spacing:-.035em;
}

#myTripsView .mt4-day-hero-weather-place{
  margin-top:5px;
  font:500 13px/18px "Instrument Sans",system-ui,sans-serif;
}

#myTripsView .mt4-day-hero-weather-condition{
  color:rgba(255,255,255,.82);
  font:400 13px/18px "Instrument Sans",system-ui,sans-serif;
}

#myTripsView .mt4-day-hero-card{
  position:absolute;
  z-index:3;
  left:14px;
  right:14px;
  bottom:14px;
  min-height:142px;
  padding:22px 22px 20px;
  border-radius:20px;
  background:#fff;
  box-shadow:0 5px 18px rgba(34,34,34,.14);
  color:var(--mt4-text);
}

#myTripsView .mt4-day-hero-title{
  margin:0;
  color:var(--mt4-text);
  font:600 26px/31px "Instrument Sans",system-ui,sans-serif;
  letter-spacing:-.025em;
}

#myTripsView .mt4-day-hero-state-row{
  display:flex;
  align-items:flex-end;
  gap:16px;
  margin-top:20px;
}

#myTripsView .mt4-day-hero-state-copy{
  flex:1;
  min-width:0;
}

#myTripsView .mt4-day-hero-status{
  color:var(--mt4-text);
  font:600 15px/20px "Instrument Sans",system-ui,sans-serif;
}

#myTripsView .mt4-day-hero-detail{
  margin-top:3px;
  overflow:hidden;
  color:var(--mt4-muted);
  text-overflow:ellipsis;
  white-space:nowrap;
  font:400 14px/20px "Instrument Sans",system-ui,sans-serif;
}

#myTripsView .mt4-day-hero-action{
  flex:0 0 auto;
  min-height:42px;
  padding:0 17px;
  border:0;
  border-radius:14px;
  background:#222;
  color:#fff;
  font:600 14px/20px "Instrument Sans",system-ui,sans-serif;
  cursor:pointer;
  -webkit-tap-highlight-color:transparent;
}

#myTripsView .mt4-day-hero-action:active{
  transform:scale(.98);
}

/* Empty My Day is now a normal white body. Weather lives only in the hero. */
#myTripsView .mt4-day-clean{
  background:#fff;
  color:var(--mt4-text);
}

/* The tabs remain the same persistent navigation directly under the hero. */
#myTripsView .mt4-tabs-wrap{
  background:rgba(255,255,255,.985) !important;
  border-bottom:1px solid var(--mt4-border) !important;
  -webkit-backdrop-filter:none !important;
  backdrop-filter:none !important;
}

#myTripsView .mt4-tab{ color:var(--mt4-muted) !important; }
#myTripsView .mt4-tab[aria-selected="true"]{ color:var(--mt4-text) !important; }
#myTripsView .mt4-indicator{ background:var(--mt4-text) !important; }

#myTripsView .mt4-root:not(.is-day-tab) .mt4-day-hero-shell{
  max-height:0;
  padding-top:0;
  padding-bottom:0;
}

@media (max-width:480px){
  #myTripsView .mt4-day-hero-shell{ padding-left:12px; padding-right:12px; }
  #myTripsView .mt4-day-hero-stage{ height:278px; border-radius:20px; }
  #myTripsView .mt4-day-hero-weather-copy{ top:19px; left:20px; }
  #myTripsView .mt4-day-hero-card{ left:12px; right:12px; bottom:12px; min-height:140px; padding:20px; }
  #myTripsView .mt4-day-hero-title{ font-size:24px; line-height:29px; }
  #myTripsView .mt4-day-hero-state-row{ margin-top:17px; gap:12px; }
  #myTripsView .mt4-day-hero-detail{ max-width:215px; }
}

@media (min-width:768px){
  #myTripsView .mt4-day-hero-shell{ padding-left:24px; padding-right:24px; }
  #myTripsView .mt4-day-hero-stage{ height:298px; }
  #myTripsView .mt4-day-hero-card{ left:18px; right:18px; bottom:18px; }
}


/* ==========================================================================
   WEATHER ASSET SCENES — fixed high-resolution hero backgrounds
   The weather artwork is now asset-backed. Procedural sun/cloud/rain pseudo
   layers are disabled so the rendered scene cannot mutate into blur/blob art.
   ========================================================================== */
#myTripsView .mt4-day-hero-stage .mt4-weather-scene{
  position:absolute;
  inset:0;
  z-index:0;
  background-size:cover !important;
  background-position:center center !important;
  background-repeat:no-repeat !important;
  filter:none !important;
  opacity:1 !important;
}

#myTripsView .mt4-day-hero-stage .mt4-weather-scene::before,
#myTripsView .mt4-day-hero-stage .mt4-weather-scene::after{
  content:none !important;
  display:none !important;
}

#myTripsView .mt4-weather-scene-sunny{
  background-image:url("/assets/weather-scenes/sunny.webp") !important;
}
#myTripsView .mt4-weather-scene-mostly-clear{
  background-image:url("/assets/weather-scenes/mostly-clear.webp") !important;
}
#myTripsView .mt4-weather-scene-partly-cloudy{
  background-image:url("/assets/weather-scenes/partly-cloudy.webp") !important;
}
#myTripsView .mt4-weather-scene-mostly-cloudy{
  background-image:url("/assets/weather-scenes/mostly-cloudy.webp") !important;
}
#myTripsView .mt4-weather-scene-cloudy{
  background-image:url("/assets/weather-scenes/cloudy.webp") !important;
}
#myTripsView .mt4-weather-scene-rain{
  background-image:url("/assets/weather-scenes/rain.webp") !important;
}
#myTripsView .mt4-weather-scene-storm{
  background-image:url("/assets/weather-scenes/storm.webp") !important;
}
#myTripsView .mt4-weather-scene-sunset{
  background-image:url("/assets/weather-scenes/sunset.webp") !important;
}
#myTripsView .mt4-weather-scene-clear-night{
  background-image:url("/assets/weather-scenes/clear-night.webp") !important;
}
#myTripsView .mt4-weather-scene-cloudy-night{
  background-image:url("/assets/weather-scenes/cloudy-night.webp") !important;
}

/* ==========================================================================
   CANONICAL MY GRAPES SELECTOR — presentation only
   Reuses the proven Companion selector visual language without the sheet.
   ========================================================================== */
#mhlMobileContent #myGrapesView{
  overflow:hidden;
}

#mhlMobileContent #myGrapesView .mg-scroll{
  flex:1 1 auto;
  min-height:0;
  overflow-y:auto;
  overflow-x:hidden;
  padding:0;
  overscroll-behavior:contain;
  -webkit-overflow-scrolling:touch;
}

#mhlMobileContent #myGrapesView .mg-selector-head{
  position:relative;
  z-index:2;
  flex:0 0 auto;
  min-height:72px;
  padding:6px 14px 14px 18px;
  border-bottom:1px solid #EBEBEB;
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:14px;
  background:#fff;
}


#mhlMobileContent #myGrapesView .mg-page-title{
  margin:0;
  padding:0;
  color:#222;
  font:600 21px/27px "Instrument Sans",system-ui,sans-serif;
  letter-spacing:-.015em;
}

#mhlMobileContent #myGrapesView .mg-selector-sub{
  margin:0 0 2px;
  color:#6A6A6A;
  font:450 12px/17px "Instrument Sans",system-ui,sans-serif;
}

#mhlMobileContent #myGrapesView .mg-selector-copy{
  display:flex;
  min-width:0;
  flex-direction:column;
}

#mhlMobileContent #myGrapesView .mg-selector-actions{
  flex:0 0 auto;
  display:flex;
  align-items:center;
  gap:10px;
}

#mhlMobileContent #myGrapesView .mg-manage-btn{
  width:40px;
  height:40px;
  padding:0;
  border:0;
  border-radius:12px;
  background:#F7F7F7;
  color:#222;
  display:inline-grid;
  place-items:center;
  font:550 12px/16px "Instrument Sans",system-ui,sans-serif;
  cursor:pointer;
  -webkit-tap-highlight-color:transparent;
}

#mhlMobileContent #myGrapesView .mg-manage-edit-icon{
  width:18px;
  height:18px;
}

#mhlMobileContent #myGrapesView .mg-manage-done-label{
  display:block;
  padding:0 8px;
}

#mhlMobileContent #myGrapesView .mg-manage-btn[aria-pressed="true"]{
  width:auto;
  min-width:56px;
  padding:0 12px;
  background:#F7F7F7;
}

#mhlMobileContent #myGrapesView .mg-organize-btn{
  flex:0 0 auto;
  min-width:0;
  height:40px;
  padding:0 11px 0 14px;
  border:1px solid #222;
  border-radius:12px;
  background:#222;
  color:#fff;
  display:inline-flex;
  align-items:center;
  gap:7px;
  white-space:nowrap;
  font:550 12px/16px "Instrument Sans",system-ui,sans-serif;
  -webkit-tap-highlight-color:transparent;
}

#mhlMobileContent #myGrapesView .mg-organize-btn:disabled{
  opacity:.38;
  cursor:default;
}

#mhlMobileContent #myGrapesView .mg-organize-count{
  min-width:22px;
  height:22px;
  padding:0 6px;
  border-radius:999px;
  background:rgba(255,255,255,.16);
  display:inline-flex;
  align-items:center;
  justify-content:center;
  font:600 11px/22px "Instrument Sans",system-ui,sans-serif;
}

#mhlMobileContent #myGrapesView .mg-organize-chevron{
  display:inline-block;
  margin-left:1px;
  font:300 20px/20px "Instrument Sans",system-ui,sans-serif;
  transform:translateY(-.5px);
}

#mhlMobileContent #myGrapesView .mg-card-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  grid-auto-rows:auto;
  align-content:start;
  align-items:start;
  gap:2px;
  width:100%;
  height:auto;
  margin:0;
  padding:0;
  background:#fff;
}

#mhlMobileContent #myGrapesView .mg-selector-item{
  position:relative;
  min-width:0;
  width:100%;
  aspect-ratio:3/4;
  align-self:start;
  padding:0;
  overflow:hidden;
  border:0;
  border-radius:0;
  background:#F2F2F2;
  cursor:pointer;
  text-align:left;
  -webkit-tap-highlight-color:transparent;
}

#mhlMobileContent #myGrapesView .mg-selector-item img,
#mhlMobileContent #myGrapesView .mg-selector-placeholder{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
}

#mhlMobileContent #myGrapesView .mg-selector-placeholder{
  background:linear-gradient(145deg,#F7F7F7,#EBEBEB);
}

#mhlMobileContent #myGrapesView .mg-selector-shade{
  position:absolute;
  inset:42% 0 0;
  background:linear-gradient(to bottom,transparent,rgba(0,0,0,.72));
  pointer-events:none;
}

#mhlMobileContent #myGrapesView .mg-selector-check{
  position:absolute;
  z-index:2;
  top:9px;
  right:9px;
  width:28px;
  height:28px;
  border:1.5px solid rgba(255,255,255,.92);
  border-radius:50%;
  background:rgba(34,34,34,.22);
  color:transparent;
  display:grid;
  place-items:center;
  backdrop-filter:blur(5px);
  -webkit-backdrop-filter:blur(5px);
  transition:background-color .14s ease,border-color .14s ease,color .14s ease;
}

#mhlMobileContent #myGrapesView .mg-selector-check::before{
  content:"";
  position:absolute;
  inset:-8px;
  border-radius:50%;
}

#mhlMobileContent #myGrapesView .mg-selector-check svg{
  width:17px;
  height:17px;
  pointer-events:none;
}

#mhlMobileContent #myGrapesView .mg-selector-item.is-selected .mg-selector-check{
  border-color:#fff;
  background:#fff;
  color:#222;
}

#mhlMobileContent #myGrapesView .mg-selector-item.is-managing .mg-selector-check{
  border-color:rgba(255,255,255,.92);
  background:rgba(34,34,34,.62);
  color:#fff;
}

#mhlMobileContent #myGrapesView .mg-selector-meta{
  position:absolute;
  z-index:2;
  left:12px;
  right:12px;
  bottom:11px;
  color:#fff;
}

#mhlMobileContent #myGrapesView .mg-selector-name{
  display:block;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  font:600 14px/19px "Instrument Sans",system-ui,sans-serif;
}

#mhlMobileContent #myGrapesView .mg-selector-district{
  display:block;
  margin-top:1px;
  overflow:hidden;
  color:rgba(255,255,255,.78);
  text-overflow:ellipsis;
  white-space:nowrap;
  font:410 11px/16px "Instrument Sans",system-ui,sans-serif;
}

/* ========================================================================== 
   ORGANIZE — draft trip inbox + editor
   Presentation only for the new draft-trip workspace. The internal tab key
   remains "companion" during this surgical cutover; no Companion UI renders.
   ========================================================================== */
#myTripsView .mt4-organize-page{
  width:min(100%,760px);
  min-height:100%;
}

#myTripsView .mt4-organize-empty{
  max-width:520px;
  padding-top:10px;
}

#myTripsView .mt4-organize-start{
  margin-top:22px;
}

#myTripsView .mt4-organize-editor{
  padding-top:22px;
}

#myTripsView .mt4-organize-editor-top{
  display:grid;
  grid-template-columns:40px minmax(0,1fr) auto;
  align-items:center;
  gap:10px;
  min-height:44px;
  margin-bottom:24px;
}

#myTripsView .mt4-organize-editor-top > span{
  color:var(--mt4-muted);
  font:500 13px/18px "Instrument Sans",system-ui,sans-serif;
}

#myTripsView .mt4-organize-back{
  width:40px;
  height:40px;
  border:1px solid var(--mt4-border);
  border-radius:12px;
  background:#fff;
  color:var(--mt4-text);
  display:grid;
  place-items:center;
  font:300 27px/34px "Instrument Sans",system-ui,sans-serif;
}

#myTripsView .mt4-organize-name-label{
  display:block;
  margin:0 0 5px;
  color:var(--mt4-muted);
  font:450 12px/17px "Instrument Sans",system-ui,sans-serif;
}

#myTripsView .mt4-organize-name{
  display:block;
  width:100%;
  padding:0 0 9px;
  border:0;
  border-bottom:1px solid var(--mt4-border);
  border-radius:0;
  outline:none;
  background:transparent;
  color:var(--mt4-text);
  font:600 27px/33px "Instrument Sans",system-ui,sans-serif;
  letter-spacing:-.02em;
}

#myTripsView .mt4-organize-name:focus{
  border-bottom-color:#222;
}

#myTripsView .mt4-organize-meta{
  margin:8px 0 0;
  color:var(--mt4-muted);
  font:410 13px/18px "Instrument Sans",system-ui,sans-serif;
}

#myTripsView .mt4-organize-date-block{
  margin-top:24px;
  padding-top:20px;
  border-top:1px solid var(--mt4-border);
}

#myTripsView .mt4-organize-date-label{
  display:block;
  margin:0 0 8px;
  color:var(--mt4-text);
  font:550 14px/20px "Instrument Sans",system-ui,sans-serif;
}

#myTripsView .mt4-organize-date{
  display:block;
  width:100%;
  min-height:46px;
  padding:0 12px;
  border:1px solid var(--mt4-border);
  border-radius:12px;
  outline:none;
  background:#fff;
  color:var(--mt4-text);
  font:450 14px/20px "Instrument Sans",system-ui,sans-serif;
}

#myTripsView .mt4-organize-date:focus{
  border-color:#222;
}

#myTripsView .mt4-organize-stop-list{
  margin-top:28px;
  border-top:1px solid var(--mt4-border);
}

#myTripsView .mt4-organize-stop{
  display:grid;
  grid-template-columns:32px minmax(0,1fr) 38px;
  align-items:center;
  gap:11px;
  min-height:72px;
  padding:11px 0;
  border-bottom:1px solid var(--mt4-border);
  background:#fff;
  transition:opacity .12s ease,transform .12s ease,box-shadow .12s ease;
}

#myTripsView .mt4-organize-stop.is-dragging{
  position:relative;
  z-index:3;
  opacity:.88;
  transform:scale(.985);
  box-shadow:0 8px 24px rgba(0,0,0,.08);
}

#myTripsView .mt4-organize-drag{
  width:32px;
  height:42px;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:3px;
  color:var(--mt4-faint);
  touch-action:none;
  -webkit-tap-highlight-color:transparent;
}

#myTripsView .mt4-organize-drag span{
  width:16px;
  height:1.5px;
  border-radius:999px;
  background:currentColor;
}

#myTripsView .mt4-organize-stop-copy{
  min-width:0;
}

#myTripsView .mt4-organize-stop-copy strong,
#myTripsView .mt4-organize-stop-copy small{
  display:block;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}

#myTripsView .mt4-organize-stop-copy strong{
  color:var(--mt4-text);
  font:550 15px/20px "Instrument Sans",system-ui,sans-serif;
}

#myTripsView .mt4-organize-stop-copy small{
  margin-top:3px;
  color:var(--mt4-muted);
  font:410 13px/18px "Instrument Sans",system-ui,sans-serif;
}

#myTripsView .mt4-organize-remove{
  width:38px;
  height:38px;
  display:grid;
  place-items:center;
  color:var(--mt4-muted);
  font:300 22px/28px "Instrument Sans",system-ui,sans-serif;
}

#myTripsView .mt4-organize-add{
  width:100%;
  min-height:50px;
  margin-top:12px;
  border:1px solid var(--mt4-border);
  border-radius:14px;
  background:#fff;
  color:var(--mt4-text);
  text-align:left;
  padding:0 15px;
  font:550 14px/20px "Instrument Sans",system-ui,sans-serif;
}

#myTripsView .mt4-organize-picker-sheet{
  position:fixed;
  z-index:10040;
  inset:0;
}

#myTripsView .mt4-organize-picker-scrim{
  position:absolute;
  inset:0;
  border:0;
  background:rgba(0,0,0,.22);
}

#myTripsView .mt4-organize-picker-panel{
  position:absolute;
  left:0;
  right:0;
  bottom:0;
  height:min(68dvh,620px);
  max-height:calc(100dvh - 72px);
  overflow:hidden;
  border-radius:24px 24px 0 0;
  background:#fff;
  box-shadow:0 -10px 40px rgba(0,0,0,.12);
  display:flex;
  flex-direction:column;
  padding:8px var(--mt4-gutter) max(18px,env(safe-area-inset-bottom));
}

#myTripsView .mt4-organize-picker-handle-zone{
  width:100%;
  height:24px;
  flex:0 0 24px;
  margin:0;
  padding:0;
  border:0;
  background:transparent;
  display:flex;
  align-items:center;
  justify-content:center;
  touch-action:none;
  cursor:grab;
}

#myTripsView .mt4-organize-picker-handle-zone:active{
  cursor:grabbing;
}

#myTripsView .mt4-organize-picker-handle{
  width:38px;
  height:4px;
  border-radius:999px;
  background:#D8D8D8;
}

#myTripsView .mt4-organize-picker-head{
  min-height:52px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
}

#myTripsView .mt4-organize-picker-head strong{
  color:var(--mt4-text);
  font:625 20px/26px "Instrument Sans",system-ui,sans-serif;
  letter-spacing:-.02em;
}

#myTripsView .mt4-organize-picker-close{
  width:38px;
  height:38px;
  flex:0 0 38px;
  border:0;
  border-radius:50%;
  background:var(--mt4-soft);
  color:var(--mt4-text);
  font:300 24px/38px "Instrument Sans",system-ui,sans-serif;
  text-align:center;
}

#myTripsView .mt4-organize-picker-search{
  height:48px;
  margin-top:4px;
  padding:0 14px;
  border:1px solid var(--mt4-border);
  border-radius:14px;
  background:#fff;
  display:flex;
  align-items:center;
  gap:10px;
}

#myTripsView .mt4-organize-picker-search svg{
  width:19px;
  height:19px;
  flex:0 0 19px;
  fill:none;
  stroke:var(--mt4-muted);
  stroke-width:1.7;
  stroke-linecap:round;
}

#myTripsView .mt4-organize-picker-input{
  width:100%;
  height:46px;
  padding:0;
  border:0;
  outline:none;
  background:transparent;
  color:var(--mt4-text);
  font:410 16px/20px "Instrument Sans",system-ui,sans-serif;
}

#myTripsView .mt4-organize-picker-input::-webkit-search-cancel-button{
  opacity:.55;
}

#myTripsView .mt4-organize-picker-results{
  flex:1 1 auto;
  min-height:0;
  margin-top:8px;
  overflow-y:auto;
  overscroll-behavior:contain;
  -webkit-overflow-scrolling:touch;
}

#myTripsView .mt4-organize-picker-result{
  width:100%;
  min-height:62px;
  padding:10px 2px;
  border:0;
  border-bottom:1px solid var(--mt4-border);
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
  background:#fff;
  text-align:left;
}

#myTripsView .mt4-organize-picker-result:last-child{
  border-bottom:0;
}

#myTripsView .mt4-organize-picker-result strong,
#myTripsView .mt4-organize-picker-result small{
  display:block;
}

#myTripsView .mt4-organize-picker-result strong{
  color:var(--mt4-text);
  font:500 14px/19px "Instrument Sans",system-ui,sans-serif;
}

#myTripsView .mt4-organize-picker-match{
  font-weight:700;
}

#myTripsView .mt4-organize-picker-result small{
  margin-top:2px;
  color:var(--mt4-muted);
  font:410 12px/17px "Instrument Sans",system-ui,sans-serif;
}

#myTripsView .mt4-organize-picker-status{
  flex:0 0 auto;
  color:var(--mt4-text);
  font:550 13px/18px "Instrument Sans",system-ui,sans-serif;
}

#myTripsView .mt4-organize-picker-result.is-in-trip{
  cursor:pointer;
}

#myTripsView .mt4-organize-picker-result.is-in-trip .mt4-organize-picker-status{
  color:var(--mt4-muted);
  font-weight:500;
}

#myTripsView .mt4-organize-picker-result.is-in-trip.is-confirmed .mt4-organize-picker-status{
  color:var(--mt4-text);
  font-weight:600;
}

#myTripsView .mt4-organize-picker-empty{
  padding:24px 2px;
  color:var(--mt4-muted);
  font:410 13px/18px "Instrument Sans",system-ui,sans-serif;
}

@media (max-width:520px){
  #myTripsView .mt4-organize-name{
    font-size:24px;
    line-height:30px;
  }
}


/* ==========================================================================
   MY DAY — PHONE HERO HEIGHT PASS 1
   Phone-only presentation adjustment. Tablet/iPad and desktop are untouched.
   Reduces the contained My Day hero stage from 286px to 220px (~23%).
   No trip state, rendering, navigation, Planner, or My Grapes behavior changes.
   ========================================================================== */
@media (max-width: 767px){
  #myTripsView .mt4-day-hero-stage{
    height:220px;
  }
}


/* ==========================================================================
   MY DAY — FRONT DOOR CONTENT, PASS 1
   Scoped entirely to #myTripsView. No Organize / Upcoming / Memories changes.
   ========================================================================== */

#myTripsView .mt4-day-home{
  padding:20px 0 44px;
  background:#fff;
}

#myTripsView .mt4-day-next{
  margin:0 var(--mt4-gutter) 30px;
  padding:20px;
  border:1px solid var(--mt4-border);
  border-radius:20px;
  background:#fff;
}

#myTripsView .mt4-day-next-copy{
  min-width:0;
}

#myTripsView .mt4-day-next-eyebrow{
  margin:0 0 5px;
  color:var(--mt4-muted);
  font:500 13px/18px "Instrument Sans",system-ui,sans-serif;
}

#myTripsView .mt4-day-next-title{
  margin:0;
  color:var(--mt4-text);
  font:600 22px/28px "Instrument Sans",system-ui,sans-serif;
  letter-spacing:-.02em;
}

#myTripsView .mt4-day-next-detail{
  margin:6px 0 0;
  max-width:520px;
  color:var(--mt4-muted);
  font:410 14px/20px "Instrument Sans",system-ui,sans-serif;
}

#myTripsView .mt4-day-next-action{
  min-height:44px;
  margin-top:18px;
  padding:0 16px;
  border:0;
  border-radius:12px;
  background:#222;
  color:#fff;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:9px;
  font:550 14px/18px "Instrument Sans",system-ui,sans-serif;
  cursor:pointer;
  -webkit-tap-highlight-color:transparent;
}

#myTripsView .mt4-day-next-action span{
  font-size:20px;
  line-height:1;
  font-weight:300;
  transform:translateY(-1px);
}

#myTripsView .mt4-day-popular{
  margin:0 0 34px;
}

#myTripsView .mt4-day-section-head{
  padding:0 var(--mt4-gutter) 13px;
}

#myTripsView .mt4-day-section-head h2{
  margin:0;
  color:var(--mt4-text);
  font:600 22px/28px "Instrument Sans",system-ui,sans-serif;
  letter-spacing:-.02em;
}

#myTripsView .mt4-day-section-head p{
  margin:4px 0 0;
  color:var(--mt4-muted);
  font:410 14px/20px "Instrument Sans",system-ui,sans-serif;
}

#myTripsView .mt4-day-popular-scroll{
  display:flex;
  gap:10px;
  padding:0 var(--mt4-gutter);
  overflow-x:auto;
  overflow-y:hidden;
  scroll-snap-type:x proximity;
  scrollbar-width:none;
  -webkit-overflow-scrolling:touch;
}

#myTripsView .mt4-day-popular-scroll::-webkit-scrollbar{
  display:none;
}

#myTripsView .mt4-day-popular-card{
  flex:0 0 min(44vw,190px);
  min-width:0;
  padding:0;
  border:0;
  background:transparent;
  color:inherit;
  text-align:left;
  cursor:pointer;
  scroll-snap-align:start;
  -webkit-tap-highlight-color:transparent;
}

#myTripsView .mt4-day-popular-media{
  position:relative;
  display:block;
  width:100%;
  aspect-ratio:4/5;
  overflow:hidden;
  border-radius:16px;
  background:var(--mt4-soft2);
}

#myTripsView .mt4-day-popular-media img,
#myTripsView .mt4-day-popular-placeholder{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
}

#myTripsView .mt4-day-popular-placeholder{
  background:linear-gradient(145deg,#F7F7F7,#EBEBEB);
}

#myTripsView .mt4-day-popular-name{
  display:block;
  margin-top:9px;
  overflow:hidden;
  color:var(--mt4-text);
  text-overflow:ellipsis;
  white-space:nowrap;
  font:525 14px/19px "Instrument Sans",system-ui,sans-serif;
}

#myTripsView .mt4-day-popular-district{
  display:block;
  margin-top:1px;
  overflow:hidden;
  color:var(--mt4-muted);
  text-overflow:ellipsis;
  white-space:nowrap;
  font:410 13px/18px "Instrument Sans",system-ui,sans-serif;
}

/* The My Day hero no longer owns an action. Keep the state copy full-width. */
#myTripsView .mt4-day-hero-state-copy{
  width:100%;
  max-width:none;
}

@media (min-width:768px){
  #myTripsView .mt4-day-popular-card{
    flex-basis:180px;
  }
}


/* ==========================================================================
   MY DAY / ORGANIZE VISUAL CORRECTION PASS 2
   Presentation + resilient venue resolution only. Big Daddy untouched.
   ========================================================================== */

/* PHONE HERO: preserve the ~23% height reduction while making all weather copy
   legible above the smaller white card. */
@media (max-width:767px){
  #myTripsView .mt4-day-hero-stage{
    height:220px;
  }

  #myTripsView .mt4-day-hero-weather-copy{
    top:13px;
    left:18px;
  }

  #myTripsView .mt4-day-hero-weather-temp{
    font-size:29px;
    line-height:31px;
  }

  #myTripsView .mt4-day-hero-weather-place{
    margin-top:2px;
    font-size:12px;
    line-height:16px;
  }

  #myTripsView .mt4-day-hero-weather-condition{
    font-size:12px;
    line-height:16px;
  }

  #myTripsView .mt4-day-hero-card{
    left:12px;
    right:12px;
    bottom:12px;
    min-height:108px;
    padding:15px 18px 14px;
    border-radius:18px;
  }

  #myTripsView .mt4-day-hero-title{
    font-size:22px;
    line-height:27px;
  }

  #myTripsView .mt4-day-hero-state-row{
    margin-top:9px;
  }

  #myTripsView .mt4-day-hero-status{
    font-size:13px;
    line-height:18px;
  }

  #myTripsView .mt4-day-hero-detail{
    margin-top:2px;
    font-size:12px;
    line-height:17px;
  }
}

/* My Day next move: one clean tappable line, not another dashboard card. */
#myTripsView .mt4-day-next{
  width:calc(100% - (var(--mt4-gutter) * 2));
  margin:0 var(--mt4-gutter) 30px;
  padding:17px 2px 18px;
  border:0;
  border-bottom:1px solid var(--mt4-border);
  border-radius:0;
  background:transparent;
  color:inherit;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:18px;
  text-align:left;
  cursor:pointer;
  -webkit-tap-highlight-color:transparent;
}

#myTripsView .mt4-day-next-copy{
  display:block;
  min-width:0;
}

#myTripsView .mt4-day-next-eyebrow,
#myTripsView .mt4-day-next-title,
#myTripsView .mt4-day-next-detail{
  display:block;
}

#myTripsView .mt4-day-next-eyebrow{
  margin:0 0 4px;
  color:var(--mt4-muted);
  font:500 13px/18px "Instrument Sans",system-ui,sans-serif;
}

#myTripsView .mt4-day-next-title{
  margin:0;
  color:var(--mt4-text);
  font:600 18px/23px "Instrument Sans",system-ui,sans-serif;
  letter-spacing:-.015em;
}

#myTripsView .mt4-day-next-detail{
  margin:3px 0 0;
  color:var(--mt4-muted);
  font:410 13px/18px "Instrument Sans",system-ui,sans-serif;
}

#myTripsView .mt4-day-next-chevron{
  flex:0 0 auto;
  color:var(--mt4-muted);
  font:300 28px/28px "Instrument Sans",system-ui,sans-serif;
}

/* Old black next-action button is no longer rendered. */
#myTripsView .mt4-day-next-action{
  display:none !important;
}

/* Popular row: slightly wider editorial cards, immediately readable as a rail. */
#myTripsView .mt4-day-popular{
  margin-bottom:38px;
}

#myTripsView .mt4-day-popular-media{
  aspect-ratio:4/5;
  border-radius:18px;
}

/* Organize: make stops feel like venue cards, not spreadsheet rows. */
#myTripsView .mt4-organize-stop-list{
  margin-top:22px;
  border-top:0;
  display:grid;
  gap:10px;
}

#myTripsView .mt4-organize-stop{
  grid-template-columns:26px 74px minmax(0,1fr) 36px;
  gap:10px;
  min-height:96px;
  padding:10px;
  border:1px solid var(--mt4-border);
  border-radius:16px;
  background:#fff;
}

#myTripsView .mt4-organize-stop-media{
  position:relative;
  width:74px;
  height:74px;
  overflow:hidden;
  border-radius:13px;
  background:var(--mt4-soft2);
}

#myTripsView .mt4-organize-stop-media img,
#myTripsView .mt4-organize-stop-placeholder{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
}

#myTripsView .mt4-organize-stop-placeholder{
  background:linear-gradient(145deg,#F7F7F7,#EBEBEB);
}

#myTripsView .mt4-organize-stop-copy{
  align-self:center;
}

#myTripsView .mt4-organize-stop-copy strong{
  font:550 15px/20px "Instrument Sans",system-ui,sans-serif;
}

#myTripsView .mt4-organize-stop-copy small{
  margin-top:2px;
  font:410 13px/18px "Instrument Sans",system-ui,sans-serif;
}

#myTripsView .mt4-organize-stop-copy em{
  display:block;
  margin-top:7px;
  color:var(--mt4-muted);
  font:410 12px/16px "Instrument Sans",system-ui,sans-serif;
  font-style:normal;
}

#myTripsView .mt4-organize-drag{
  width:26px;
  height:74px;
}

#myTripsView .mt4-organize-remove{
  width:36px;
  height:44px;
  align-self:center;
}

@media (max-width:380px){
  #myTripsView .mt4-organize-stop{
    grid-template-columns:22px 64px minmax(0,1fr) 32px;
    gap:8px;
    padding:8px;
  }

  #myTripsView .mt4-organize-stop-media{
    width:64px;
    height:64px;
  }
}

/* ========================================================================== 
   MY DAY — LOCAL COMPANION PASS
   Scoped presentation only. Existing MHL palette retained.
   ========================================================================== */
#myTripsView .mt4-day-home{padding-bottom:70px;}
#myTripsView .mt4-day-module{margin:0 0 38px;}
#myTripsView .mt4-day-next{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:0 2px 18px;border:0;border-bottom:1px solid var(--mt4-border);border-radius:0;background:#fff;text-align:left;}
#myTripsView .mt4-day-next-title{font-size:18px;line-height:23px;}
#myTripsView .mt4-day-next-detail{margin-top:3px;}
#myTripsView .mt4-day-next-chevron{font-size:24px;color:var(--mt4-muted);font-weight:300;}
#myTripsView .mt4-day-popular-card{flex:0 0 154px;}
#myTripsView .mt4-day-popular-media{aspect-ratio:3/2;border-radius:14px;}
#myTripsView .mt4-day-popular-name{margin-top:8px;}
#myTripsView .mt4-day-event-scroll,#myTripsView .mt4-day-guide-scroll,#myTripsView .mt4-day-tile-scroll{display:flex;gap:10px;padding:0 var(--mt4-gutter);overflow-x:auto;scrollbar-width:none;-webkit-overflow-scrolling:touch;scroll-snap-type:x proximity;}
#myTripsView .mt4-day-event-scroll::-webkit-scrollbar,#myTripsView .mt4-day-guide-scroll::-webkit-scrollbar,#myTripsView .mt4-day-tile-scroll::-webkit-scrollbar{display:none;}
#myTripsView .mt4-day-event-card{flex:0 0 min(76vw,310px);padding:0;border:0;background:none;text-align:left;scroll-snap-align:start;}
#myTripsView .mt4-day-event-media{position:relative;display:block;aspect-ratio:16/9;border-radius:18px;overflow:hidden;background:var(--mt4-soft2);}
#myTripsView .mt4-day-event-media img,#myTripsView .mt4-day-event-placeholder,#myTripsView .mt4-day-guide-media img,#myTripsView .mt4-day-guide-placeholder,#myTripsView .mt4-day-tile-media img,#myTripsView .mt4-day-tile-placeholder,#myTripsView .mt4-day-around-media img,#myTripsView .mt4-day-around-placeholder{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;}
#myTripsView .mt4-day-event-placeholder,#myTripsView .mt4-day-guide-placeholder,#myTripsView .mt4-day-tile-placeholder,#myTripsView .mt4-day-around-placeholder{background:linear-gradient(145deg,#F7F7F7,#EBEBEB);}
#myTripsView .mt4-day-event-date{position:absolute;left:12px;bottom:12px;padding:6px 9px;border-radius:8px;background:#fff;color:#222;font:600 11px/14px "Instrument Sans",system-ui,sans-serif;}
#myTripsView .mt4-day-event-title{display:block;margin-top:9px;color:#222;font:600 16px/21px "Instrument Sans",system-ui,sans-serif;}
#myTripsView .mt4-day-event-meta{display:block;margin-top:2px;color:#6A6A6A;font:410 13px/18px "Instrument Sans",system-ui,sans-serif;}
#myTripsView .mt4-day-guide-card{flex:0 0 min(72vw,290px);padding:0;border:0;background:none;text-align:left;scroll-snap-align:start;}
#myTripsView .mt4-day-guide-media{position:relative;display:block;aspect-ratio:4/3;border-radius:18px;overflow:hidden;background:#222;}
#myTripsView .mt4-day-guide-media:after,#myTripsView .mt4-day-tile-media:after{content:"";position:absolute;inset:35% 0 0;background:linear-gradient(transparent,rgba(0,0,0,.68));}
#myTripsView .mt4-day-guide-copy{position:absolute;z-index:2;left:16px;right:16px;bottom:15px;color:#fff;}
#myTripsView .mt4-day-guide-copy small{display:block;margin-bottom:4px;font:500 12px/16px "Instrument Sans",system-ui,sans-serif;opacity:.82;}
#myTripsView .mt4-day-guide-copy strong{display:block;font:600 20px/24px "Instrument Sans",system-ui,sans-serif;letter-spacing:-.02em;}
#myTripsView .mt4-day-nudge{width:calc(100% - (var(--mt4-gutter) * 2));margin:4px var(--mt4-gutter) 38px;padding:15px 0;border:1px solid var(--mt4-border);border-width:1px 0;background:#fff;display:flex;align-items:center;justify-content:space-between;gap:14px;text-align:left;color:#222;}
#myTripsView .mt4-day-nudge strong,#myTripsView .mt4-day-nudge small{display:block;}
#myTripsView .mt4-day-nudge strong{font:550 14px/19px "Instrument Sans",system-ui,sans-serif;}
#myTripsView .mt4-day-nudge small{margin-top:2px;color:#6A6A6A;font:410 13px/18px "Instrument Sans",system-ui,sans-serif;}
#myTripsView .mt4-day-nudge-action{flex:none;color:#222;font:525 13px/18px "Instrument Sans",system-ui,sans-serif;}
#myTripsView .mt4-day-plan-list,#myTripsView .mt4-day-around-list{margin:0 var(--mt4-gutter);border-top:1px solid var(--mt4-border);}
#myTripsView .mt4-day-plan-card,#myTripsView .mt4-day-around-card{width:100%;min-height:72px;padding:11px 0;border:0;border-bottom:1px solid var(--mt4-border);background:#fff;display:flex;align-items:center;gap:13px;text-align:left;color:#222;}
#myTripsView .mt4-day-plan-route{width:42px;height:42px;border-radius:12px;background:#F7F7F7;display:flex;align-items:center;justify-content:center;gap:3px;}
#myTripsView .mt4-day-plan-route i{width:5px;height:5px;border-radius:50%;background:#6A6A6A;}
#myTripsView .mt4-day-plan-copy,#myTripsView .mt4-day-around-copy{min-width:0;flex:1;}
#myTripsView .mt4-day-plan-copy strong,#myTripsView .mt4-day-plan-copy small,#myTripsView .mt4-day-around-copy strong,#myTripsView .mt4-day-around-copy small{display:block;}
#myTripsView .mt4-day-plan-copy strong,#myTripsView .mt4-day-around-copy strong{font:550 15px/20px "Instrument Sans",system-ui,sans-serif;}
#myTripsView .mt4-day-plan-copy small,#myTripsView .mt4-day-around-copy small{margin-top:2px;color:#6A6A6A;font:410 13px/18px "Instrument Sans",system-ui,sans-serif;}
#myTripsView .mt4-day-plan-arrow{font-size:22px;color:#6A6A6A;}
#myTripsView .mt4-day-tile{flex:0 0 128px;padding:0;border:0;background:none;scroll-snap-align:start;}
#myTripsView .mt4-day-tile-media{position:relative;display:block;aspect-ratio:1/1.12;border-radius:16px;overflow:hidden;background:var(--mt4-soft2);}
#myTripsView .mt4-day-tile-media strong{position:absolute;z-index:2;left:10px;right:10px;bottom:11px;color:#fff;text-align:left;font:600 15px/18px "Instrument Sans",system-ui,sans-serif;}
#myTripsView .mt4-day-around-card{min-height:76px;}
#myTripsView .mt4-day-around-media{position:relative;flex:0 0 58px;height:58px;border-radius:12px;overflow:hidden;background:var(--mt4-soft2);}
#myTripsView .mt4-day-sofar{width:calc(100% - (var(--mt4-gutter) * 2));margin:8px var(--mt4-gutter) 0;padding:18px;border:0;border-radius:16px;background:#F7F7F7;display:flex;align-items:center;justify-content:space-between;text-align:left;color:#222;}
#myTripsView .mt4-day-sofar small,#myTripsView .mt4-day-sofar strong{display:block;}
#myTripsView .mt4-day-sofar small{color:#6A6A6A;font:500 12px/16px "Instrument Sans",system-ui,sans-serif;}
#myTripsView .mt4-day-sofar strong{margin-top:3px;font:600 16px/21px "Instrument Sans",system-ui,sans-serif;}
#myTripsView .mt4-day-overlay{position:fixed;z-index:10030;inset:0;}
#myTripsView .mt4-day-overlay-scrim{position:absolute;inset:0;border:0;background:rgba(0,0,0,.22);}
#myTripsView .mt4-day-overlay-panel{position:absolute;background:#fff;overflow:auto;box-shadow:0 -10px 40px rgba(0,0,0,.12);}
#myTripsView .mt4-day-overlay.is-sheet .mt4-day-overlay-panel{left:0;right:0;bottom:0;max-height:78vh;border-radius:24px 24px 0 0;}
#myTripsView .mt4-day-overlay.is-guide .mt4-day-overlay-panel{left:0;top:72px;bottom:0;width:87.5%;border-radius:0 22px 0 0;}
#myTripsView .mt4-day-overlay-handle{width:40px;height:4px;margin:9px auto 0;border-radius:999px;background:#EBEBEB;}
#myTripsView .mt4-day-overlay-close{position:absolute;z-index:2;right:14px;top:14px;width:38px;height:38px;border:0;border-radius:50%;background:#F7F7F7;color:#222;font-size:24px;}
#myTripsView .mt4-day-overlay-media{height:150px;background:linear-gradient(145deg,#F7F7F7,#EBEBEB);}
#myTripsView .mt4-day-overlay-body{padding:22px var(--mt4-gutter) 34px;}
#myTripsView .mt4-day-overlay-body>small{color:#6A6A6A;font:500 12px/16px "Instrument Sans",system-ui,sans-serif;}
#myTripsView .mt4-day-overlay-body h2{margin:5px 0 8px;color:#222;font:625 24px/29px "Instrument Sans",system-ui,sans-serif;letter-spacing:-.025em;}
#myTripsView .mt4-day-overlay-body p{margin:0;color:#6A6A6A;font:410 15px/22px "Instrument Sans",system-ui,sans-serif;}
#myTripsView .mt4-day-overlay-primary{margin-top:22px;min-height:46px;padding:0 17px;border:0;border-radius:12px;background:#222;color:#fff;font:550 14px/18px "Instrument Sans",system-ui,sans-serif;}
#myTripsView .mt4-organize-stop,#myTripsView .mt4-organize-stop *{-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;}
@media (min-width:768px){#myTripsView .mt4-day-popular-card{flex-basis:160px;}#myTripsView .mt4-day-tile{flex-basis:142px;}}


/* My Day carousel gutter correction — preserve the page gutter at both scroll extents. */
#myTripsView .mt4-day-popular-scroll,
#myTripsView .mt4-day-event-scroll,
#myTripsView .mt4-day-guide-scroll{
  scroll-padding-inline:var(--mt4-gutter);
}

#myTripsView .mt4-day-popular-scroll::after,
#myTripsView .mt4-day-event-scroll::after,
#myTripsView .mt4-day-guide-scroll::after{
  content:"";
  flex:0 0 calc(var(--mt4-gutter) - 10px);
}

/* My Day interaction correction — fixed-header sticky offset, free inertial rails,
   Get Outside gutter parity, and isolated/tappable overlay handle. */
#myTripsView .mt4-day-popular-scroll,
#myTripsView .mt4-day-event-scroll,
#myTripsView .mt4-day-guide-scroll,
#myTripsView .mt4-day-tile-scroll{
  scroll-snap-type:none;
  overscroll-behavior-x:contain;
}

#myTripsView .mt4-day-tile-scroll{
  scroll-padding-inline:var(--mt4-gutter);
}

#myTripsView .mt4-day-tile-scroll::after{
  content:"";
  flex:0 0 calc(var(--mt4-gutter) - 10px);
}

#myTripsView .mt4-day-overlay-handle-zone{
  position:relative;
  z-index:3;
  display:block;
  width:100%;
  height:28px;
  padding:0;
  border:0;
  background:transparent;
  touch-action:none;
  -webkit-tap-highlight-color:transparent;
}

#myTripsView .mt4-day-overlay-handle{
  display:block;
  width:40px;
  height:4px;
  margin:9px auto 0;
  border-radius:999px;
  background:#EBEBEB;
}


/* My Day sticky-nav correction — the tab row always docks below the fixed
   72px application header, including contained/iPad layouts. */
#mhlMobileContent.mhl-desktop-contained #myTripsView .mt4-root.is-living-day .mt4-tabs-wrap{
  top:72px;
}/* ==========================================================================
   CANONICAL TRIP WORKSPACE — Organize + Upcoming share one journey language
   ========================================================================== */
#myTripsView .mt4-planning-workspace{
  padding-bottom:36px;
}

#myTripsView .mt4-planning-title-row{
  position:relative;
  display:flex;
  align-items:center;
  gap:8px;
}

#myTripsView .mt4-planning-title-row .mt4-organize-name{
  flex:1 1 auto;
  min-width:0;
  padding-right:30px;
}

#myTripsView .mt4-planning-pencil{
  position:absolute;
  right:2px;
  top:50%;
  transform:translateY(-55%);
  color:var(--mt4-muted);
  font:500 18px/1 "Instrument Sans",system-ui,sans-serif;
  pointer-events:none;
}


#myTripsView .mt4-planning-section-head{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:16px;
  margin-top:30px;
  padding-bottom:10px;
  border-bottom:1px solid var(--mt4-border);
}

#myTripsView .mt4-planning-section-head > span{
  color:var(--mt4-text);
  font:600 18px/24px "Instrument Sans",system-ui,sans-serif;
}

#myTripsView .mt4-planning-section-head > small{
  color:var(--mt4-muted);
  font:410 11px/16px "Instrument Sans",system-ui,sans-serif;
  text-align:right;
}

#myTripsView .mt4-planning-workspace .mt4-organize-stop-list{
  position:relative;
  display:flex;
  flex-direction:column;
  gap:14px;
  margin-top:14px;
  padding-left:10px;
  border:0;
}

#myTripsView .mt4-planning-workspace .mt4-organize-stop{
  position:relative;
  display:grid;
  grid-template-columns:40px minmax(0,1fr) 120px;
  grid-template-rows:minmax(72px,auto);
  column-gap:12px;
  align-items:center;
  min-height:112px;
  padding:16px 14px;
  border:1px solid var(--mt4-border);
  border-radius:20px;
  background:#fff;
  box-shadow:0 4px 16px rgba(0,0,0,.055);
  overflow:visible;
}

#myTripsView .mt4-planning-workspace .mt4-stop-sequence{
  position:relative;
  z-index:3;
  grid-column:1;
  grid-row:1;
  align-self:center;
  justify-self:center;
  width:38px;
  height:44px;
  display:grid;
  place-items:center;
  padding:0;
  border:0;
  background:transparent;
  color:#fff;
  box-shadow:none;
  transform:none;
  transform-origin:center;
  touch-action:none;
  -webkit-tap-highlight-color:transparent;
  isolation:isolate;
}

#myTripsView .mt4-planning-workspace .mt4-stop-sequence::before{
  content:"";
  position:absolute;
  width:34px;
  height:34px;
  border-radius:50% 50% 50% 4px;
  background:#222;
  box-shadow:0 1px 5px rgba(0,0,0,.14);
  transform:rotate(-45deg);
  z-index:-1;
}

#myTripsView .mt4-planning-workspace .mt4-stop-sequence > span{
  position:absolute;
  left:50%;
  top:50%;
  display:block;
  width:auto;
  height:auto;
  margin:0;
  padding:0;
  border-radius:0;
  background:none;
  transform:translate(-50%,-56%);
  color:#fff;
  font:650 16px/1 "Instrument Sans",system-ui,sans-serif;
  text-align:center;
  z-index:1;
  pointer-events:none;
}
#myTripsView .mt4-planning-workspace .mt4-organize-stop-media{
  grid-column:3;
  grid-row:1;
  justify-self:end;
  width:120px;
  height:72px;
  border-radius:12px;
  overflow:hidden;
  background:#f2f2f2;
  box-shadow:inset 0 0 0 1px rgba(0,0,0,.035);
}

#myTripsView .mt4-planning-workspace .mt4-organize-stop-media img,
#myTripsView .mt4-planning-workspace .mt4-organize-stop-placeholder{
  display:block;
  width:100%;
  height:100%;
  object-fit:cover;
}

#myTripsView .mt4-planning-workspace .mt4-organize-stop-copy{
  grid-column:2;
  grid-row:1;
  min-width:0;
  align-self:center;
  padding-right:2px;
}

#myTripsView .mt4-planning-workspace .mt4-organize-stop-copy strong{
  display:-webkit-box;
  overflow:hidden;
  -webkit-box-orient:vertical;
  -webkit-line-clamp:2;
  color:var(--mt4-text);
  font:600 16px/21px "Instrument Sans",system-ui,sans-serif;
  letter-spacing:-.01em;
}

#myTripsView .mt4-planning-workspace .mt4-organize-stop-copy small{
  display:block;
  margin-top:5px;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  color:var(--mt4-muted);
  font:410 14px/18px "Instrument Sans",system-ui,sans-serif;
}

#myTripsView .mt4-planning-workspace .mt4-organize-stop-copy em{
  display:none;
}

#myTripsView .mt4-planning-workspace .mt4-organize-remove{
  position:absolute;
  right:8px;
  top:8px;
  z-index:4;
  width:28px;
  height:28px;
  border-radius:50%;
  background:rgba(255,255,255,.94);
  color:var(--mt4-muted);
  box-shadow:0 1px 5px rgba(0,0,0,.08);
}

#myTripsView .mt4-planning-workspace .mt4-organize-add{
  margin-top:12px;
}

#myTripsView .mt4-planning-workspace .mt4-organize-stop.is-dragging{
  border-color:#d8d8d8;
  background:#fff;
  box-shadow:0 14px 34px rgba(0,0,0,.13);
  transform:scale(.99);
}

@media (max-width:380px){
  #myTripsView .mt4-planning-workspace .mt4-organize-stop{
    grid-template-columns:minmax(0,1fr) 104px;
    column-gap:10px;
    min-height:104px;
    padding:14px 12px 14px 24px;
  }
  #myTripsView .mt4-planning-workspace .mt4-organize-stop-media{
    width:104px;
    height:64px;
    border-radius:11px;
  }
}


/* ========================================================================== 
   ORGANIZE TRIP IDENTITY — floating list header / inline rename / collapse
   ========================================================================== */
#myTripsView .mt4-planning-title-row{
  align-items:flex-start;
  gap:8px;
  margin-top:8px;
}
#myTripsView .mt4-planning-collapse{
  flex:0 0 28px;
  width:28px;
  height:40px;
  margin:0;
  padding:0;
  border:0;
  background:transparent;
  color:#222;
  display:grid;
  place-items:center;
  cursor:pointer;
}
#myTripsView .mt4-planning-collapse span{
  display:block;
  font:500 25px/1 "Instrument Sans",system-ui,sans-serif;
  transform:translateY(-2px);
  transition:transform .16s ease;
}
#myTripsView .mt4-planning-title-row.is-collapsed .mt4-planning-collapse span{
  transform:translateY(-1px) rotate(-90deg);
}
#myTripsView .mt4-planning-title-stack{
  flex:1 1 auto;
  min-width:0;
}
#myTripsView .mt4-planning-title-edit{
  display:inline-flex;
  align-items:center;
  gap:7px;
  max-width:100%;
  min-height:40px;
  padding:0;
  border-radius:12px;
  background:transparent;
  transition:background .15s ease,padding .15s ease;
}
#myTripsView .mt4-planning-title-row .mt4-organize-name{
  flex:0 1 auto;
  width:auto;
  min-width:0;
  max-width:min(72vw,520px);
  padding:0;
  border:0;
  background:transparent;
  color:#222;
  font:650 27px/34px "Instrument Sans",system-ui,sans-serif;
  letter-spacing:-.025em;
  cursor:default;
  field-sizing:content;
}
#myTripsView .mt4-planning-title-row .mt4-organize-name:focus{
  border:0;
  outline:0;
}
#myTripsView .mt4-planning-pencil{
  position:static;
  flex:0 0 32px;
  width:32px;
  height:36px;
  padding:0;
  border:0;
  background:transparent;
  color:#8a9298;
  display:grid;
  place-items:center;
  transform:none;
  font:500 18px/1 "Instrument Sans",system-ui,sans-serif;
  cursor:pointer;
  pointer-events:auto;
}
#myTripsView .mt4-organize-editor.is-editing-name .mt4-planning-title-edit{
  padding:0 6px 0 10px;
  background:#f3f4f5;
}
#myTripsView .mt4-organize-editor.is-editing-name .mt4-organize-name{
  cursor:text;
}
#myTripsView .mt4-organize-meta{
  margin:0 0 0 2px;
  color:#6a6a6a;
  font:500 13px/18px "Instrument Sans",system-ui,sans-serif;
}
#myTripsView .mt4-planning-title-row.is-collapsed{
  margin-bottom:20px;
}


/* ORGANIZE TRIP IDENTITY — refinement 02 */
#myTripsView .mt4-planning-title-stack{
  flex:0 1 auto;
  width:auto;
  max-width:calc(100% - 36px);
}
#myTripsView .mt4-planning-title-edit{
  display:inline-grid;
  grid-template-columns:minmax(0,max-content) 36px 42px;
  column-gap:5px;
  width:auto;
  max-width:100%;
}
#myTripsView .mt4-planning-title-row .mt4-organize-name{
  width:auto;
  max-width:min(70vw,520px);
  field-sizing:content;
}
#myTripsView .mt4-planning-pencil{
  width:28px;
  height:34px;
  flex:none;
}
#myTripsView .mt4-planning-collapse span{
  width:24px;
  height:24px;
  transform:none;
  transition:transform .2s cubic-bezier(.2,.8,.2,1);
}
#myTripsView .mt4-planning-collapse svg{
  display:block;
  width:24px;
  height:24px;
  overflow:visible;
}
#myTripsView .mt4-planning-collapse path{
  fill:none;
  stroke:currentColor;
  stroke-width:1.75;
  stroke-linecap:round;
  stroke-linejoin:round;
}
#myTripsView .mt4-planning-title-row.is-collapsed .mt4-planning-collapse span{
  transform:rotate(-90deg);
}
#myTripsView .mt4-planning-collapsible{
  display:block;
  max-height:none;
  opacity:1;
  overflow:hidden;
  transform:translateY(0);
  transform-origin:top;
  transition:max-height .24s cubic-bezier(.2,.8,.2,1), opacity .17s ease, transform .24s cubic-bezier(.2,.8,.2,1);
}
/* ==========================================================================
   ORGANIZE DATE PORTAL — document-level modal sheet
   Intentionally lives under <body>, outside all My Trips transforms/scrollers.
   ========================================================================== */

#myTripsView .mt4-planning-title-row,
#myTripsView .mt4-planning-section-head{
  border-top:0!important;
  border-bottom:0!important;
}

/* Portal itself */
.mt4-date-portal{
  position:fixed;
  left:0;
  top:0;
  width:100vw;
  height:100dvh;
  z-index:2147483000;
  display:none;
  pointer-events:none;
}
.mt4-date-portal.is-open{
  display:block;
  pointer-events:auto;
}
.mt4-date-sheet-backdrop{
  position:absolute;
  inset:0;
  background:rgba(34,34,34,.34);
  animation:mt4DateBackdropIn .18s ease both;
}
.mt4-date-sheet{
  position:absolute;
  left:50%;
  bottom:0;
  width:min(100%,680px);
  height:min(62dvh,590px);
  min-height:430px;
  box-sizing:border-box;
  overflow:hidden;
  padding:10px 24px calc(22px + env(safe-area-inset-bottom));
  border-radius:26px 26px 0 0;
  background:#fff;
  color:#222;
  box-shadow:0 -12px 36px rgba(0,0,0,.13);
  transform:translateX(-50%);
  animation:mt4DateSheetIn .23s cubic-bezier(.2,.8,.2,1) both;
  overscroll-behavior:contain;
  touch-action:manipulation;
}
@keyframes mt4DateBackdropIn{
  from{opacity:0}
  to{opacity:1}
}
@keyframes mt4DateSheetIn{
  from{transform:translate(-50%,100%)}
  to{transform:translate(-50%,0)}
}
.mt4-date-sheet-grabber{
  width:38px;
  height:4px;
  margin:0 auto 15px;
  border-radius:999px;
  background:#d9d9d9;
}
.mt4-date-sheet-header{
  display:grid;
  grid-template-columns:1fr auto 1fr;
  align-items:center;
  margin-bottom:20px;
}
.mt4-date-sheet-header strong{
  font:650 20px/24px "Instrument Sans",system-ui,sans-serif;
  letter-spacing:-.01em;
}
.mt4-date-sheet-header button{
  justify-self:end;
  min-width:44px;
  min-height:44px;
  padding:0;
  border:0;
  background:transparent;
  color:#6a6a6a;
  font:500 16px/20px "Instrument Sans",system-ui,sans-serif;
  cursor:pointer;
}
.mt4-calendar-month-nav{
  display:grid;
  grid-template-columns:44px minmax(0,1fr) 44px;
  align-items:center;
  margin-bottom:14px;
}
.mt4-calendar-month-nav strong{
  text-align:center;
  font:600 19px/24px "Instrument Sans",system-ui,sans-serif;
}
.mt4-calendar-month-nav button{
  width:44px;
  height:44px;
  display:grid;
  place-items:center;
  padding:0;
  border:0;
  background:transparent;
  color:#222;
  cursor:pointer;
}
.mt4-calendar-month-nav svg{
  width:24px;
  height:24px;
}
.mt4-calendar-month-nav path{
  fill:none;
  stroke:currentColor;
  stroke-width:1.8;
  stroke-linecap:round;
  stroke-linejoin:round;
}
.mt4-calendar-weekdays,
.mt4-calendar-grid{
  display:grid;
  grid-template-columns:repeat(7,minmax(0,1fr));
}
.mt4-calendar-weekdays{
  margin-bottom:3px;
}
.mt4-calendar-weekdays span{
  display:grid;
  place-items:center;
  min-height:27px;
  color:#9a9a9a;
  font:450 12px/16px "Instrument Sans",system-ui,sans-serif;
}
.mt4-calendar-day{
  width:100%;
  min-width:0;
  min-height:42px;
  display:grid;
  place-items:center;
  padding:0;
  border:0;
  border-radius:999px;
  background:transparent;
  color:#222;
  font:500 15px/20px "Instrument Sans",system-ui,sans-serif;
  cursor:pointer;
  touch-action:manipulation;
  -webkit-tap-highlight-color:transparent;
}
.mt4-calendar-day.is-muted{
  color:#cfcfcf;
}
.mt4-calendar-day.is-selected{
  background:#1a2e1c;
  color:#fff;
  font-weight:650;
}
.mt4-calendar-day:active{
  transform:scale(.94);
}
.mt4-calendar-remove{
  display:block;
  min-height:40px;
  margin:8px auto 0;
  padding:0 12px;
  border:0;
  background:transparent;
  color:#6a6a6a;
  font:500 13px/18px "Instrument Sans",system-ui,sans-serif;
  cursor:pointer;
}

/* Phones: sheet is intentionally compact and viewport-independent. */
@media (max-width:767px){
  .mt4-date-sheet{
    width:100%;
    height:min(60dvh,560px);
    min-height:420px;
    padding-left:20px;
    padding-right:20px;
    border-radius:24px 24px 0 0;
  }
  .mt4-calendar-day{
    min-height:40px;
  }
}

/* Short viewport protection: calendar remains usable without becoming the page. */
@media (max-height:700px){
  .mt4-date-sheet{
    height:min(72dvh,520px);
    min-height:390px;
    overflow-y:auto;
  }
  .mt4-date-sheet-header{
    margin-bottom:10px;
  }
  .mt4-calendar-month-nav{
    margin-bottom:6px;
  }
  .mt4-calendar-day{
    min-height:34px;
  }
}

/* Desktop/tablet: modal remains a contained sheet, never a giant viewport panel. */
@media (min-width:768px){
  .mt4-date-sheet{
    width:min(560px,calc(100vw - 48px));
    height:min(560px,68dvh);
  }
}

/* ORGANIZE — direct draft workspace; sibling drafts remain collapsed */
#myTripsView .mt4-organize-other-trips{margin:10px 0 28px;padding:0}


/* ORGANIZE — every draft uses the same trip identity component */
#myTripsView .mt4-organize-other-trips{
  margin:6px 0 30px;
  padding:0;
}
#myTripsView .mt4-organize-collapsed-trip{
  margin:8px 0 0;
  padding:18px 0 16px;
  border:0;
}
#myTripsView .mt4-organize-collapsed-trip .mt4-planning-title-row{
  margin:0;
}
#myTripsView .mt4-organize-collapsed-name{
  min-width:0;
  max-width:min(70vw,520px);
  padding:0;
  border:0;
  background:transparent;
  color:#222;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  text-align:left;
  font:650 27px/34px "Instrument Sans",system-ui,sans-serif;
  letter-spacing:-.025em;
  cursor:pointer;
}
#myTripsView .mt4-organize-collapsed-trip .mt4-planning-pencil{
  position:static;
  width:28px;
  height:34px;
  margin:0;
}
#myTripsView .mt4-organize-collapsed-trip .mt4-organize-meta{
  margin:0 0 0 2px;
}

/* Calendar portal hit-testing: backdrop is always behind the actual sheet. */
.mt4-date-sheet-backdrop{
  z-index:0;
  pointer-events:auto;
}
.mt4-date-sheet{
  z-index:1;
  pointer-events:auto;
}
.mt4-calendar-grid,
.mt4-calendar-day{
  position:relative;
  z-index:2;
  pointer-events:auto;
}

/* TRIPS — equal gutters and floating sibling trip identities */
#myTripsView .mt4-organize-other-trips{
  margin:8px 0 28px;
  padding:0;
}
#myTripsView .mt4-organize-collapsed-trip .mt4-planning-title-row{
  padding-left:0;
  padding-right:0;
}


/* TRIPS FOUNDATION — shared gutters, stable stack */
#myTripsView .mt4-trips-page{display:block}
#myTripsView .mt4-trips-page > .mt4-planning-workspace,
#myTripsView .mt4-trips-page > .mt4-organize-collapsed-trip{width:100%;margin-left:0;margin-right:0}
#myTripsView .mt4-trips-page > .mt4-organize-collapsed-trip{padding:18px 0 16px;border:0}
#myTripsView .mt4-organize-collapsed-name.is-placeholder{color:#8a9298;font-weight:550}

/* A new trip is visibly waiting to be named. */
#myTripsView .mt4-organize-editor.is-new-trip-name .mt4-planning-title-edit{padding:0 8px 0 10px;background:#f3f4f5}
#myTripsView .mt4-organize-name::placeholder{color:#a1a6aa;opacity:1}

/* One-day or date-window selection. */
.mt4-calendar-day.is-in-range{border-radius:0;background:rgba(26,46,28,.10);color:#1a2e1c}
.mt4-calendar-day.is-range-start{border-radius:999px 0 0 999px}
.mt4-calendar-day.is-range-end{border-radius:0 999px 999px 0}
.mt4-calendar-day.is-selected{background:#1a2e1c;color:#fff;font-weight:650}
.mt4-calendar-remove[hidden]{display:none !important}


/* PHASE 1 — quiet separation between independent trip sections. */
#myTripsView .mt4-trips-page > .mt4-planning-workspace + .mt4-planning-workspace,
#myTripsView .mt4-trips-page > .mt4-planning-workspace + .mt4-organize-collapsed-trip,
#myTripsView .mt4-trips-page > .mt4-organize-collapsed-trip + .mt4-planning-workspace,
#myTripsView .mt4-trips-page > .mt4-organize-collapsed-trip + .mt4-organize-collapsed-trip{
  border-top:1px solid #EBEBEB;
  margin-top:22px;
  padding-top:22px;
}

/* The trip body no longer reserves a date-control indentation. */
#myTripsView .mt4-planning-workspace > .mt4-planning-collapsible{
  margin-top:22px;
}




/* TRIPS DATE MODEL — global pills navigate; each expanded trip owns editing. */
#myTripsView .mt4-trips-date-nav{
  position:sticky;
  top:54px;
  z-index:17;
  width:100%;
  padding:10px 16px 11px;
  background:#fff;
  overflow:hidden;
}

#myTripsView .mt4-trips-date-nav-scroll{
  display:flex;
  align-items:center;
  gap:8px;
  min-width:0;
  overflow-x:auto;
  overscroll-behavior-inline:contain;
  scrollbar-width:none;
  -webkit-overflow-scrolling:touch;
}

#myTripsView .mt4-trips-date-nav-scroll::-webkit-scrollbar{display:none}

#myTripsView .mt4-trips-date-pill{
  flex:0 0 auto;
  min-height:36px;
  padding:0 14px;
  border:1px solid #EBEBEB;
  border-radius:999px;
  background:#F7F7F7;
  color:#1a2e1c;
  font:600 14px/18px "Instrument Sans",system-ui,sans-serif;
  white-space:nowrap;
  cursor:pointer;
  -webkit-tap-highlight-color:transparent;
}

#myTripsView .mt4-trip-calendar-edit{
  width:32px;
  height:32px;
  padding:0;
  border:0;
  border-radius:50%;
  background:#222;
  color:#fff;
  display:grid;
  place-items:center;
  cursor:pointer;
  -webkit-tap-highlight-color:transparent;
}

#myTripsView .mt4-trip-calendar-edit svg{
  width:17px;
  height:17px;
}

#myTripsView .mt4-trip-calendar-edit path{
  fill:none;
  stroke:currentColor;
  stroke-width:1.7;
  stroke-linecap:round;
  stroke-linejoin:round;
}

#myTripsView .mt4-trips-date-pill.is-active{
  border-color:#222;
  background:#222;
  color:#fff;
}
#myTripsView .mt4-planning-pencil,
#myTripsView .mt4-organize-collapsed-edit{
  width:36px;
  height:40px;
  font-size:21px;
}
#myTripsView .mt4-trip-calendar-edit{
  width:42px;
  height:42px;
}
#myTripsView .mt4-trip-calendar-edit svg{
  width:21px;
  height:21px;
}
#myTripsView .mt4-trip-calendar-edit-collapsed{
  flex:0 0 42px;
}


#myTripsView .mt4-stop-sequence.mt4-organize-drag > span{
  width:auto;
  height:auto;
  min-width:0;
  min-height:0;
  border-radius:0;
  background:none;
}




#myTripsView .mt4-organize-editor .mt4-planning-title-edit{
  cursor:text;
}

#myTripsView .mt4-calendar-tip{
  position:relative;
  width:min(calc(100% - 36px),360px);
  margin:8px 0 18px 36px;
  padding:14px 16px 15px;
  border:1px solid #EBEBEB;
  border-radius:16px;
  background:#fff;
  color:#222;
  box-shadow:0 8px 24px rgba(0,0,0,.13);
  display:grid;
  gap:4px;
  cursor:pointer;
  animation:mt4CalendarTipIn .2s ease both;
}

#myTripsView .mt4-calendar-tip::before{
  content:"";
  position:absolute;
  top:auto;
  bottom:-7px;
  right:18px;
  width:14px;
  height:14px;
  border-left:0;
  border-top:0;
  border-right:1px solid #EBEBEB;
  border-bottom:1px solid #EBEBEB;
  background:#fff;
  transform:rotate(45deg);
}

#myTripsView .mt4-calendar-tip strong{
  position:relative;
  z-index:1;
  color:#222;
  font:650 16px/20px "Instrument Sans",system-ui,sans-serif;
  letter-spacing:-.01em;
}

#myTripsView .mt4-calendar-tip span{
  position:relative;
  z-index:1;
  color:#6A6A6A;
  font:500 14px/19px "Instrument Sans",system-ui,sans-serif;
}

#myTripsView .mt4-calendar-tip.is-leaving{
  opacity:0;
  transform:translateY(-4px);
  transition:opacity .18s ease,transform .18s ease;
}

@keyframes mt4CalendarTipIn{
  from{opacity:0;transform:translateY(-6px)}
  to{opacity:1;transform:translateY(0)}
}


/* SURGICAL FIX — onboarding popover overlays content; no layout shift. */
#myTripsView .mt4-organize-editor{
  position:relative;
}
#myTripsView .mt4-page:has(.mt4-calendar-tip){
  position:relative;
  z-index:19;
}
#myTripsView .mt4-calendar-tip{
  position:absolute;
  z-index:40;
  top:auto;
  bottom:calc(100% - 20px);
  right:14px;
  width:min(320px,calc(100% - 52px));
  margin:0;
}

/* SURGICAL FIX — pin geometry is explicit and iPhone-safe. */
#myTripsView .mt4-planning-workspace .mt4-stop-sequence::before{
  left:2px;
  top:2px;
}
#myTripsView .mt4-planning-workspace .mt4-stop-sequence > span{
  left:19px;
  top:11px;
  width:auto;
  height:16px;
  margin:0;
  padding:0;
  transform:translateX(-50%);
  font:650 16px/16px "Instrument Sans",system-ui,sans-serif;
}


/* COLLAPSE/TITLE LOCK — shared geometry for expanded and collapsed trip rows. */
#myTripsView .mt4-planning-title-stack{
  flex:1 1 auto;
  width:100%;
  max-width:calc(100% - 36px);
}

#myTripsView .mt4-planning-title-edit{
  display:grid;
  grid-template-columns:minmax(0,1fr) 36px 42px;
  column-gap:5px;
  width:100%;
  max-width:100%;
  align-items:center;
}

#myTripsView .mt4-planning-title-row .mt4-organize-name,
#myTripsView .mt4-organize-collapsed-name{
  width:100%;
  min-width:0;
  max-width:100%;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}

#myTripsView .mt4-planning-title-row .mt4-organize-name{
  field-sizing:fixed;
}


/* COLLAPSE GEOMETRY PARITY — expanded and collapsed identity rows land identically. */
#myTripsView .mt4-trips-page > .mt4-planning-workspace,
#myTripsView .mt4-trips-page > .mt4-organize-collapsed-trip{
  padding-top:22px;
}

#myTripsView .mt4-organize-collapsed-trip .mt4-planning-title-row{
  margin-top:8px;
  margin-right:0;
  margin-bottom:20px;
  margin-left:0;
}


/* MICRO GEOMETRY LOCK — first-trip parity + stable edit box width. */
#myTripsView .mt4-trips-page > .mt4-planning-workspace:first-child,
#myTripsView .mt4-trips-page > .mt4-organize-collapsed-trip:first-child{
  margin-top:0;
}

#myTripsView .mt4-planning-title-edit{
  box-sizing:border-box;
}


/* COMPACT VENUE ROW — isolated from all legacy stop-card/pin presentation. */
#myTripsView .mt4-venue-row-list{
  display:flex;
  flex-direction:column;
  gap:8px;
}
#myTripsView .mt4-planning-workspace .mt4-venue-row{
  display:grid;
  grid-template-columns:48px minmax(0,1fr);
  grid-template-rows:48px;
  align-items:center;
  width:100%;
  min-height:48px;
  margin:0;
  padding:0;
  border:1px solid #EBEBEB;
  border-radius:12px;
  background:#FFFFFF;
  box-shadow:none;
  overflow:hidden;
}
#myTripsView .mt4-planning-workspace .mt4-venue-pin{
  appearance:none;
  position:relative;
  justify-self:center;
  display:flex;
  align-items:center;
  justify-content:center;
  width:34px;
  height:40px;
  margin:0;
  padding:0;
  border:0;
  border-radius:17px 17px 17px 6px;
  background:#222222;
  color:#FFFFFF;
  box-shadow:none;
  transform:none;
  font-family:"Instrument Sans",system-ui,sans-serif;
  cursor:grab;
  touch-action:manipulation;
}
#myTripsView .mt4-planning-workspace .mt4-venue-pin span{
  display:flex;
  align-items:center;
  justify-content:center;
  width:100%;
  height:100%;
  margin:0;
  padding:0;
  border:0;
  border-radius:inherit;
  background:transparent;
  color:inherit;
  font-size:15px;
  line-height:1;
  font-weight:600;
  transform:none;
}
#myTripsView .mt4-planning-workspace .mt4-venue-pin::before,
#myTripsView .mt4-planning-workspace .mt4-venue-pin::after,
#myTripsView .mt4-planning-workspace .mt4-venue-pin span::before,
#myTripsView .mt4-planning-workspace .mt4-venue-pin span::after{
  content:none;
  display:none;
}
#myTripsView .mt4-planning-workspace .mt4-venue-name{
  appearance:none;
  display:block;
  width:100%;
  min-width:0;
  height:48px;
  margin:0;
  padding:0 14px 0 4px;
  border:0;
  background:transparent;
  color:#222222;
  overflow:hidden;
  white-space:nowrap;
  text-overflow:ellipsis;
  text-align:left;
  font-family:"Instrument Sans",system-ui,sans-serif;
  font-size:16px;
  line-height:20px;
  font-weight:550;
}


/* COMPACT VENUE ROW — visual parity micro-fix. */
#myTripsView .mt4-planning-workspace .mt4-venue-row{
  width:calc(100% - 0px);
  box-sizing:border-box;
}

#myTripsView .mt4-planning-workspace .mt4-venue-row-list{
  width:100%;
}

/* Match the existing Add another stop horizontal boundary exactly. */
#myTripsView .mt4-planning-workspace .mt4-venue-row,
#myTripsView .mt4-planning-workspace .mt4-organize-add{
  margin-left:0;
  margin-right:0;
}

/* Restore the original map-pin silhouette without reusing legacy classes. */
#myTripsView .mt4-planning-workspace .mt4-venue-pin{
  width:30px;
  height:30px;
  border-radius:50% 50% 50% 0;
  transform:rotate(-45deg);
  background:#222222;
}

#myTripsView .mt4-planning-workspace .mt4-venue-pin span{
  width:30px;
  height:30px;
  border-radius:50%;
  transform:rotate(45deg);
  background:transparent;
  display:flex;
  align-items:center;
  justify-content:center;
  line-height:1;
  font-size:14px;
  font-weight:600;
}

#myTripsView .mt4-planning-workspace .mt4-venue-pin::before,
#myTripsView .mt4-planning-workspace .mt4-venue-pin::after,
#myTripsView .mt4-planning-workspace .mt4-venue-pin span::before,
#myTripsView .mt4-planning-workspace .mt4-venue-pin span::after{
  content:none !important;
  display:none !important;
}


/* VENUE EXPANSION — layered only on the locked compact-row component. */
#myTripsView .mt4-planning-workspace .mt4-venue-row{
  grid-template-columns:48px minmax(0,1fr);
  grid-template-rows:48px;
  transition:border-color .18s ease, background .18s ease;
}
#myTripsView .mt4-planning-workspace .mt4-venue-row.is-expanded{
  grid-template-columns:48px minmax(0,1fr) 44px;
  grid-template-rows:48px auto;
}
#myTripsView .mt4-planning-workspace .mt4-venue-trash{
  display:none;
  appearance:none;
  width:44px;
  height:48px;
  padding:0;
  border:0;
  background:transparent;
  color:#6A6A6A;
  align-items:center;
  justify-content:center;
}
#myTripsView .mt4-planning-workspace .mt4-venue-row.is-expanded .mt4-venue-trash{display:flex}
#myTripsView .mt4-planning-workspace .mt4-venue-trash svg{
  width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;
}
#myTripsView .mt4-planning-workspace .mt4-venue-detail{
  display:none;
  grid-column:1/-1;
  padding:0 14px 14px 52px;
}
#myTripsView .mt4-planning-workspace .mt4-venue-row.is-expanded .mt4-venue-detail{display:block}
#myTripsView .mt4-planning-workspace .mt4-venue-hours{
  margin:0 0 8px;color:#222;font-size:14px;line-height:20px;font-weight:525;
}
#myTripsView .mt4-planning-workspace .mt4-venue-about{
  margin:0 0 14px;color:#6A6A6A;font-size:14px;line-height:20px;font-weight:410;
  display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:3;overflow:hidden;
}
#myTripsView .mt4-planning-workspace .mt4-venue-actions{display:flex;align-items:center;gap:20px;flex-wrap:wrap}
#myTripsView .mt4-planning-workspace .mt4-venue-action{
  appearance:none;min-height:34px;padding:0;border:0;background:transparent;color:#222;
  font:600 14px/18px "Instrument Sans",system-ui,sans-serif;text-align:left;
}
#myTripsView .mt4-planning-workspace .mt4-venue-action.is-visited{color:#00733D}
#myTripsView .mt4-planning-workspace .mt4-venue-action:disabled{opacity:.35}

/* Trips-scoped adaptation of the production profile Location sheet. */
.mt4-venue-sheet-layer{position:fixed;inset:0;z-index:190;display:flex;align-items:flex-end;justify-content:center}
.mt4-venue-sheet-backdrop{position:absolute;inset:0;border:0;background:rgba(34,34,34,.38);opacity:0;transition:opacity .22s ease}
.mt4-venue-sheet{position:relative;z-index:1;width:100%;background:#fff;border-radius:20px 20px 0 0;transform:translateY(100%);transition:transform .3s cubic-bezier(.22,1,.36,1);padding-bottom:env(safe-area-inset-bottom);outline:none;font-family:"Instrument Sans",system-ui,sans-serif}
.mt4-venue-sheet-layer.is-open .mt4-venue-sheet-backdrop{opacity:1}.mt4-venue-sheet-layer.is-open .mt4-venue-sheet{transform:translateY(0)}
.mt4-venue-sheet-handle{height:22px;display:flex;align-items:center;justify-content:center}.mt4-venue-sheet-handle span{width:36px;height:4px;border-radius:999px;background:#D7D7D7}
.mt4-venue-sheet header{height:58px;padding:0 16px;border-bottom:1px solid #EBEBEB;display:flex;align-items:center;justify-content:space-between}.mt4-venue-sheet header h2{margin:0;font-size:18px;line-height:24px;font-weight:600;color:#222}
.mt4-venue-sheet-close{width:40px;height:40px;border:0;border-radius:50%;background:#F2F2F2;color:#222;font-size:24px}.mt4-venue-sheet-body{padding:20px 16px 24px}.mt4-venue-address{font-size:16px;line-height:22px;font-weight:550;color:#222}.mt4-venue-city{margin-top:3px;color:#6A6A6A;font-size:14px;line-height:20px}.mt4-venue-map-actions{margin-top:20px}
.mt4-venue-map-actions a,.mt4-venue-map-actions>button{display:flex;width:100%;min-height:52px;align-items:center;padding:0;border:0;border-top:1px solid #EBEBEB;background:#fff;color:#222;text-decoration:none;font:550 15px/20px "Instrument Sans",system-ui,sans-serif;text-align:left}.mt4-venue-copy-status{min-height:20px;padding-top:8px;color:#6A6A6A;font-size:13px}

/* Trips-scoped copy of the production Harvested Take sheet semantics. */
.mt4-take-layer{position:fixed;inset:0;z-index:195;display:flex;align-items:flex-end;justify-content:center}.mt4-take-backdrop{position:absolute;inset:0;border:0;background:rgba(0,0,0,.38)}.mt4-take-sheet{position:relative;z-index:1;width:100%;max-height:88dvh;overflow:auto;background:#fff;border-radius:24px 24px 0 0;font-family:"Instrument Sans",system-ui,sans-serif}
.mt4-take-sheet header{height:58px;padding:0 18px 0 20px;border-bottom:1px solid #EBEBEB;display:flex;align-items:center;justify-content:space-between}.mt4-take-sheet header h2{margin:0;font-size:18px;line-height:24px;font-weight:600;color:#222}.mt4-take-close{width:40px;height:40px;border:0;border-radius:50%;background:#F2F2F2;color:#222;font-size:24px}.mt4-take-form{display:grid;gap:20px;padding:22px 20px calc(28px + env(safe-area-inset-bottom))}.mt4-take-form p{margin:0;color:#6A6A6A;font-size:15px;line-height:22px}.mt4-take-form label,.mt4-take-form legend{font-size:14px;line-height:20px;font-weight:500;color:#222}.mt4-take-form textarea,.mt4-take-form input[type=text]{display:block;width:100%;box-sizing:border-box;margin-top:8px;border:1px solid #DCDCDC;border-radius:14px;padding:13px 14px;font:400 16px/23px "Instrument Sans",system-ui,sans-serif}.mt4-take-form textarea{resize:none;min-height:120px}.mt4-take-form fieldset{border:0;padding:0;margin:0}.mt4-take-form fieldset label{display:inline-flex;align-items:center;gap:4px;margin:10px 20px 0 0;font-weight:400}.mt4-take-form input[type=radio]{accent-color:#222}.mt4-take-form em{font-style:normal;color:#6A6A6A}.mt4-take-hp{position:absolute!important;left:-10000px!important;width:1px!important;height:1px!important}.mt4-take-submit,.mt4-take-done{width:100%;height:48px;border:0;border-radius:14px;background:#222;color:#fff;font:600 15px/20px "Instrument Sans",system-ui,sans-serif}.mt4-take-status{min-height:20px;text-align:center;color:#6A6A6A;font-size:13px;line-height:20px}.mt4-take-success[hidden]{display:none}.mt4-take-success{padding:44px 24px calc(32px + env(safe-area-inset-bottom));text-align:center}.mt4-take-success h3{margin:0 0 8px;font-size:22px;line-height:28px;font-weight:600;color:#222}.mt4-take-success p{margin:0 auto 28px;max-width:300px;color:#6A6A6A;font-size:15px;line-height:22px}
@media(min-width:768px){.mt4-venue-sheet-layer,.mt4-take-layer{align-items:center;padding:32px}.mt4-venue-sheet,.mt4-take-sheet{width:min(560px,100%);border-radius:24px}}


/* LIVE VENUE WIRING — no compact-row geometry changes. */
#myTripsView .mt4-venue-about[hidden]{display:none}
#myTripsView .mt4-venue-row[data-profile-loading="1"] .mt4-venue-hours{color:#6A6A6A}

.mt4-venue-sheet-layer,
.mt4-take-layer{
  z-index:2147483000 !important;
}

.mt4-take-backdrop{
  opacity:0;
  transition:opacity .22s ease;
}
.mt4-take-sheet{
  transform:translateY(100%);
  transition:transform .3s cubic-bezier(.22,1,.36,1);
}
.mt4-take-layer.is-open .mt4-take-backdrop{opacity:1}
.mt4-take-layer.is-open .mt4-take-sheet{transform:translateY(0)}


/* GO NOW — profile primary-button parity inside Trips Location sheet. */
.mt4-venue-map-actions .mt4-venue-go-now{
  appearance:none;
  display:flex;
  width:100%;
  height:48px;
  min-height:48px;
  margin:0 0 12px;
  padding:0 16px;
  border:0;
  border-radius:12px;
  background:#222222;
  color:#FFFFFF;
  align-items:center;
  justify-content:center;
  text-align:center;
  font-family:"Instrument Sans",system-ui,sans-serif;
  font-size:16px;
  line-height:20px;
  font-weight:500;
  cursor:pointer;
}


/* VISITED + LIVE HOURS POLISH — venue expansion only. */
#myTripsView .mt4-planning-workspace .mt4-venue-hours{
  display:flex;
  align-items:center;
  gap:8px;
}
#myTripsView .mt4-planning-workspace .mt4-venue-hours-dot{
  width:11px;
  height:11px;
  flex:0 0 11px;
  border-radius:50%;
  background:#6A6A6A;
}
#myTripsView .mt4-planning-workspace .mt4-venue-hours.is-open .mt4-venue-hours-dot{
  background:#00733D;
}
#myTripsView .mt4-planning-workspace .mt4-venue-hours.is-closed .mt4-venue-hours-dot{
  background:#6A6A6A;
}
#myTripsView .mt4-planning-workspace .mt4-venue-visited{
  display:inline-flex;
  align-items:center;
  gap:7px;
}
#myTripsView .mt4-planning-workspace .mt4-venue-visited-box{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:17px;
  height:17px;
  flex:0 0 17px;
  border:1.5px solid #6A6A6A;
  border-radius:4px;
  color:#FFFFFF;
  background:#FFFFFF;
  font-size:12px;
  line-height:1;
  font-weight:700;
}
#myTripsView .mt4-planning-workspace .mt4-venue-visited.is-visited{
  color:#00733D;
}
#myTripsView .mt4-planning-workspace .mt4-venue-visited.is-visited .mt4-venue-visited-box{
  border-color:#00733D;
  background:#00733D;
  color:#FFFFFF;
}


/* VENUE-SPECIFIC HARVESTED TAKE + VISITED ROUTE MARKER */
.mt4-take-drag-handle{
  height:22px;
  display:flex;
  align-items:center;
  justify-content:center;
  touch-action:none;
  cursor:grab;
}
.mt4-take-drag-handle span{
  width:36px;
  height:4px;
  border-radius:999px;
  background:#D7D7D7;
}
.mt4-take-sheet textarea::placeholder{
  color:#A7A7A7;
  opacity:1;
}
.mt4-take-success-icon{
  display:flex;
  align-items:center;
  justify-content:center;
  width:44px;
  height:44px;
  margin:0 auto 14px;
  border:2px solid #222222;
  border-radius:50%;
  color:#222222;
  font-size:25px;
  line-height:1;
  font-weight:600;
}
#myTripsView .mt4-planning-workspace .mt4-venue-row.is-visited .mt4-venue-pin{
  background:#B8B8B8;
}
#myTripsView .mt4-planning-workspace .mt4-venue-row.is-visited .mt4-venue-pin span{
  color:#FFFFFF;
  font-size:17px;
  font-weight:650;
}


/* HARVESTED TAKE SUCCESS STATE — allow hidden form to actually leave layout. */
.mt4-take-form[hidden]{
  display:none !important;
}


/* TAKE SUCCESS TRANSITION — same drawer shell, staged down then up. */
.mt4-take-sheet.is-success-exit{
  transform:translateY(100%) !important;
  transition:transform .26s cubic-bezier(.4,0,.2,1) !important;
}
.mt4-take-sheet.is-success-enter{
  transform:translateY(100%) !important;
  transition:none !important;
}
.mt4-take-layer.is-open .mt4-take-sheet:not(.is-success-exit):not(.is-success-enter){
  transform:translateY(0);
  transition:transform .3s cubic-bezier(.22,1,.36,1);
}


/* BETWEEN-STOP TRAVEL CONNECTOR — relationship belongs to adjacent venue pair. */
#myTripsView .mt4-planning-workspace .mt4-travel-connector{
  min-height:34px;
  display:flex;
  align-items:center;
  justify-content:flex-start;
  gap:7px;
  padding:0 0 0 64px;
  color:#6A6A6A;
  font-family:"Instrument Sans",system-ui,sans-serif;
  font-size:13px;
  line-height:18px;
  font-weight:410;
  white-space:nowrap;
}
#myTripsView .mt4-planning-workspace .mt4-travel-connector[hidden]{
  display:none !important;
}
#myTripsView .mt4-planning-workspace .mt4-travel-icon{
  width:24px;
  height:20px;
  flex:0 0 24px;
  display:flex;
  align-items:center;
  justify-content:center;
}
#myTripsView .mt4-planning-workspace .mt4-travel-icon svg{
  width:16px;
  height:16px;
  display:block;
  fill:none;
  stroke:currentColor;
  stroke-width:1.8;
  stroke-linecap:round;
  stroke-linejoin:round;
}
#myTripsView .mt4-planning-workspace .mt4-travel-text{
  min-width:0;
}


/* TRAVEL CONNECTOR POLISH — reference-matched spacing + standard transport icons. */
#myTripsView .mt4-venue-row-list{
  gap:0 !important;
}
#myTripsView .mt4-planning-workspace .mt4-travel-connector{
  min-height:27px;
  height:27px;
  padding:0 0 0 64px;
  gap:6px;
}
#myTripsView .mt4-planning-workspace .mt4-travel-icon{
  width:24px;
  height:18px;
  flex:0 0 24px;
}
#myTripsView .mt4-planning-workspace .mt4-travel-icon .mt4-travel-svg{
  display:block;
  width:16px;
  height:16px;
  fill:currentColor;
  stroke:none;
}
#myTripsView .mt4-planning-workspace .mt4-travel-text{
  font-size:13px;
  line-height:18px;
}


/* BETWEEN-STOP GO NOW — compact pair-specific handoff, not a second control system. */
#myTripsView .mt4-planning-workspace .mt4-travel-go{
  appearance:none;
  border:0;
  background:transparent;
  margin:0 0 0 2px;
  padding:0;
  color:#222222;
  font:inherit;
  font-weight:525;
  line-height:18px;
  white-space:nowrap;
  cursor:pointer;
}
#myTripsView .mt4-planning-workspace .mt4-travel-go[hidden]{
  display:none !important;
}


/* CLEAN ROUTE-AWARE REORDER — connectors step out, their space remains reserved. */
#myTripsView .mt4-venue-row-list.is-reordering{
  gap:27px !important;
}
#myTripsView .mt4-venue-row-list.is-reordering .mt4-venue-row{
  transition:transform .16s ease, opacity .16s ease, box-shadow .16s ease;
}
#myTripsView .mt4-venue-row.is-dragging{
  opacity:.78;
  box-shadow:0 8px 22px rgba(34,34,34,.10);
  z-index:2;
}


/* DRAG HANDLE OWNERSHIP — pin is the only lift surface; suppress native selection/ghost gestures. */
#myTripsView .mt4-venue-row,
#myTripsView .mt4-venue-row *{
  -webkit-user-drag:none;
}
#myTripsView .mt4-venue-row{
  user-select:none;
  -webkit-user-select:none;
}
#myTripsView .mt4-venue-pin{
  user-select:none;
  -webkit-user-select:none;
  -webkit-touch-callout:none;
  touch-action:none;
  cursor:grab;
}
#myTripsView .mt4-venue-pin:active,
#myTripsView .mt4-venue-row.is-dragging .mt4-venue-pin{
  cursor:grabbing;
}


/* RESPONSIVE TRIPS HOST OWNERSHIP — tablet/desktop stays inside its own app surface. */
@media (min-width:768px){
  #myTripsView{
    background:#FFFFFF !important;
    isolation:isolate;
  }
  #myTripsView .mt4-root,
  #myTripsView #mt4PageHost{
    background:#FFFFFF;
  }
  .mt4-date-portal{
    overflow:hidden;
  }
}


/* CALENDAR CONTAINER PARITY — tablet/desktop sheet sits 4px inside Trips host. */
@media (min-width:768px){
  .mt4-date-sheet{
    width:calc(100% - 8px) !important;
    max-width:none !important;
    height:min(560px,68dvh);
  }
}


/* TABLET/DESKTOP DATE PORTAL OWNERSHIP — calendar is part of My Trips, not body-level. */
@media (min-width:768px){
  #myTripsView{
    position:relative;
  }
  #myTripsView > .mt4-date-portal.is-contained{
    position:absolute;
    inset:0;
    left:0 !important;
    top:0 !important;
    width:100% !important;
    height:100% !important;
    z-index:2147483000;
  }
}


/* TRIP LIFECYCLE — expanded trip only. */
#myTripsView .mt4-trip-life-actions{
  display:flex;
  align-items:center;
  gap:10px;
  margin-top:22px;
  padding-top:18px;
  border-top:1px solid #EBEBEB;
}
#myTripsView .mt4-trip-life-actions button{
  appearance:none;
  min-height:42px;
  padding:0 14px;
  border:1px solid #EBEBEB;
  border-radius:12px;
  background:#FFFFFF;
  color:#222222;
  font:500 14px/18px "Instrument Sans",system-ui,sans-serif;
  cursor:pointer;
}
#myTripsView .mt4-trip-life-actions .is-delete{
  margin-left:auto;
  border-color:transparent;
  color:#6A6A6A;
}
#myTripsView .mt4-trip-life-confirm{
  margin-top:10px;
  padding:16px;
  border:1px solid #EBEBEB;
  border-radius:14px;
  background:#F7F7F7;
}
#myTripsView .mt4-trip-life-confirm[hidden]{
  display:none !important;
}
#myTripsView .mt4-trip-life-confirm strong,
#myTripsView .mt4-trip-life-confirm span{
  display:block;
}
#myTripsView .mt4-trip-life-confirm strong{
  color:#222222;
  font:600 15px/20px "Instrument Sans",system-ui,sans-serif;
}
#myTripsView .mt4-trip-life-confirm span{
  margin-top:4px;
  color:#6A6A6A;
  font:410 14px/20px "Instrument Sans",system-ui,sans-serif;
}
#myTripsView .mt4-trip-life-confirm > div{
  display:flex;
  justify-content:flex-end;
  gap:8px;
  margin-top:14px;
}
#myTripsView .mt4-trip-life-confirm button{
  appearance:none;
  min-height:40px;
  padding:0 14px;
  border:1px solid #EBEBEB;
  border-radius:10px;
  background:#FFFFFF;
  color:#222222;
  font:500 14px/18px "Instrument Sans",system-ui,sans-serif;
  cursor:pointer;
}
#myTripsView .mt4-trip-life-confirm .is-primary{
  border-color:#222222;
  background:#222222;
  color:#FFFFFF;
}
#myTripsView .mt4-trip-life-confirm .is-danger{
  border-color:#222222;
  background:#222222;
  color:#FFFFFF;
}
@media (max-width:480px){
  #myTripsView .mt4-trip-life-actions{
    align-items:stretch;
  }
  #myTripsView .mt4-trip-life-actions button{
    padding-left:10px;
    padding-right:10px;
  }
}


/* PAST TRIPS — full-span memory presentations. */
#myTripsView .mt4-memory-list{
  display:grid;
  gap:22px;
}
#myTripsView .mt4-memory{
  display:block;
  width:100%;
  padding:0 0 20px;
  border:0;
  border-bottom:1px solid #EBEBEB;
}
#myTripsView .mt4-memory:last-child{
  padding-bottom:0;
  border-bottom:0;
}
#myTripsView .mt4-memory-visual{
  width:100%;
  aspect-ratio:2.7 / 1;
  overflow:hidden;
  border-radius:20px;
  background:#F2F2F2;
}
#myTripsView .mt4-memory-visual img,
#myTripsView .mt4-memory-image-fallback{
  display:block;
  width:100%;
  height:100%;
}
#myTripsView .mt4-memory-visual img{
  object-fit:cover;
  border-radius:0;
  background:#F2F2F2;
}
#myTripsView .mt4-memory-image-fallback{
  background:#F2F2F2;
}
#myTripsView .mt4-memory-body{
  display:flex;
  align-items:center;
  gap:12px;
  padding:14px 2px 0;
}
#myTripsView .mt4-memory-main{
  min-width:0;
  flex:1 1 auto;
}
#myTripsView .mt4-memory-title{
  color:#222222;
  font:600 18px/23px "Instrument Sans",system-ui,sans-serif;
  letter-spacing:-.01em;
}
#myTripsView .mt4-memory-meta{
  margin-top:4px;
  color:#6A6A6A;
  font:410 14px/19px "Instrument Sans",system-ui,sans-serif;
}
#myTripsView .mt4-memory-preview{
  margin-top:5px;
  overflow:hidden;
  color:#6A6A6A;
  font:410 13px/18px "Instrument Sans",system-ui,sans-serif;
  text-overflow:ellipsis;
  white-space:nowrap;
}
#myTripsView .mt4-memory-chevron{
  display:grid;
  width:34px;
  height:34px;
  flex:0 0 34px;
  place-items:center;
  border-radius:50%;
  background:#F7F7F7;
  color:#222222;
}
#myTripsView .mt4-memory-chevron svg{
  width:18px;
  height:18px;
  fill:none;
  stroke:currentColor;
  stroke-width:1.8;
  stroke-linecap:round;
  stroke-linejoin:round;
}
@media (min-width:768px){
  #myTripsView .mt4-memory-list{
    gap:24px;
  }
  #myTripsView .mt4-memory-visual{
    aspect-ratio:3 / 1;
  }
}


/* PAST TRIPS — contained premium memory tiles. */
#myTripsView .mt4-memory-list{
  gap:16px;
}
#myTripsView .mt4-memory{
  display:block;
  width:100%;
  box-sizing:border-box;
  margin:0;
  padding:10px 10px 12px;
  border:1px solid #EBEBEB;
  border-radius:20px;
  background:#F7F7F7;
  overflow:hidden;
}
#myTripsView .mt4-memory:last-child{
  border-bottom:1px solid #EBEBEB;
}
#myTripsView .mt4-memory-visual{
  width:100%;
  aspect-ratio:2.85 / 1;
  overflow:hidden;
  border-radius:14px;
  background:#F2F2F2;
}
#myTripsView .mt4-memory-visual img,
#myTripsView .mt4-memory-image-fallback{
  width:100%;
  height:100%;
  border-radius:0;
}
#myTripsView .mt4-memory-body{
  display:flex;
  align-items:center;
  gap:12px;
  padding:12px 4px 2px;
}
#myTripsView .mt4-memory-title{
  font:600 17px/22px "Instrument Sans",system-ui,sans-serif;
  letter-spacing:-.01em;
}
#myTripsView .mt4-memory-meta{
  margin-top:3px;
  font:410 14px/19px "Instrument Sans",system-ui,sans-serif;
}
#myTripsView .mt4-memory-preview{
  margin-top:3px;
  font:410 13px/18px "Instrument Sans",system-ui,sans-serif;
}
#myTripsView .mt4-memory-chevron{
  width:32px;
  height:32px;
  flex:0 0 32px;
  border:0;
  background:#FFFFFF;
  box-shadow:0 0 0 1px #EBEBEB inset;
}
@media (min-width:768px){
  #myTripsView .mt4-memory-list{
    gap:18px;
  }
  #myTripsView .mt4-memory{
    padding:12px 12px 14px;
  }
  #myTripsView .mt4-memory-visual{
    aspect-ratio:3.15 / 1;
    border-radius:15px;
  }
  #myTripsView .mt4-memory-body{
    padding:13px 5px 2px;
  }
}


/* PAST TRIPS BLUEPRINT — compact archived rows + inline historical ladder. */
#myTripsView .mt4-memory-list{
  display:grid;
  gap:0;
  padding:15px;
  border-radius:20px;
  background:#F7F7F7;
}
#myTripsView .mt4-memory{
  display:block;
  width:100%;
  margin:0;
  padding:0;
  border:0;
  border-bottom:1px solid #EBEBEB;
  border-radius:0;
  background:transparent;
  overflow:hidden;
}
#myTripsView .mt4-memory:last-child{
  border-bottom:0;
}
#myTripsView .mt4-memory-summary{
  appearance:none;
  display:grid;
  grid-template-columns:112px minmax(0,1fr) 28px;
  align-items:center;
  gap:16px;
  width:100%;
  min-height:104px;
  margin:0;
  padding:12px 0;
  border:0;
  background:transparent;
  color:#222222;
  text-align:left;
  cursor:pointer;
}
#myTripsView .mt4-memory-thumb{
  width:112px;
  height:80px;
  overflow:hidden;
  border-radius:12px;
  background:#F2F2F2;
}
#myTripsView .mt4-memory-thumb img,
#myTripsView .mt4-memory-thumb .mt4-memory-image-fallback{
  display:block;
  width:100%;
  height:100%;
  object-fit:cover;
  border-radius:0;
}
#myTripsView .mt4-memory-main{
  min-width:0;
}
#myTripsView .mt4-memory-title{
  overflow:hidden;
  color:#222222;
  font:550 16px/21px "Instrument Sans",system-ui,sans-serif;
  text-overflow:ellipsis;
  white-space:nowrap;
}
#myTripsView .mt4-memory-meta{
  margin-top:5px;
  overflow:hidden;
  color:#6A6A6A;
  font:410 14px/19px "Instrument Sans",system-ui,sans-serif;
  text-overflow:ellipsis;
  white-space:nowrap;
}
#myTripsView .mt4-memory-preview{
  margin-top:3px;
  overflow:hidden;
  color:#6A6A6A;
  font:410 13px/18px "Instrument Sans",system-ui,sans-serif;
  text-overflow:ellipsis;
  white-space:nowrap;
}
#myTripsView .mt4-memory-chevron{
  display:grid;
  width:28px;
  height:28px;
  place-items:center;
  border:0;
  border-radius:0;
  background:transparent;
  color:#6A6A6A;
  box-shadow:none;
}
#myTripsView .mt4-memory-chevron svg{
  width:18px;
  height:18px;
  fill:none;
  stroke:currentColor;
  stroke-width:1.8;
  stroke-linecap:round;
  stroke-linejoin:round;
  transition:transform .22s cubic-bezier(.22,.82,.25,1);
}
#myTripsView .mt4-memory.is-expanded .mt4-memory-chevron svg{
  transform:rotate(180deg);
}
#myTripsView .mt4-memory-detail{
  max-height:0;
  opacity:0;
  overflow:hidden;
  transition:max-height .28s cubic-bezier(.22,.82,.25,1),opacity .18s ease;
}
#myTripsView .mt4-memory-detail-inner{
  padding:2px 0 16px 128px;
}
#myTripsView .mt4-memory-stop-list{
  display:grid;
  gap:0;
}
#myTripsView .mt4-memory-stop-row{
  display:grid;
  grid-template-columns:34px minmax(0,1fr);
  align-items:center;
  gap:10px;
  min-height:46px;
  padding:0 2px;
}
#myTripsView .mt4-memory-stop-pin{
  display:flex;
  align-items:center;
  justify-content:center;
  width:30px;
  height:30px;
  border-radius:50% 50% 50% 0;
  background:#222222;
  color:#FFFFFF;
  transform:rotate(-45deg);
}
#myTripsView .mt4-memory-stop-pin span{
  display:flex;
  align-items:center;
  justify-content:center;
  width:30px;
  height:30px;
  transform:rotate(45deg);
  font:600 14px/14px "Instrument Sans",system-ui,sans-serif;
}
#myTripsView .mt4-memory-stop-name{
  overflow:hidden;
  color:#222222;
  font:550 15px/20px "Instrument Sans",system-ui,sans-serif;
  text-overflow:ellipsis;
  white-space:nowrap;
}
#myTripsView .mt4-memory-detail .mt4-travel-connector{
  min-height:25px;
  height:25px;
  padding-left:18px;
  gap:5px;
  font-size:12px;
}
#myTripsView .mt4-memory-detail .mt4-travel-go{
  display:none !important;
}
#myTripsView .mt4-memory-reuse{
  appearance:none;
  width:100%;
  min-height:44px;
  margin-top:12px;
  border:1px solid #EBEBEB;
  border-radius:12px;
  background:#FFFFFF;
  color:#222222;
  font:550 14px/18px "Instrument Sans",system-ui,sans-serif;
  cursor:pointer;
}
@media (max-width:520px){
  #myTripsView .mt4-memory-list{
    padding:15px;
  }
  #myTripsView .mt4-memory-summary{
    grid-template-columns:104px minmax(0,1fr) 24px;
    gap:12px;
    min-height:100px;
  }
  #myTripsView .mt4-memory-thumb{
    width:104px;
    height:80px;
    border-radius:12px;
  }
  #myTripsView .mt4-memory-detail-inner{
    padding-left:116px;
  }
}


/* PAST TRIPS — restrained historical snapshot. No live route-planning noise. */
#myTripsView .mt4-memory-detail-inner{
  padding-top:2px;
}
#myTripsView .mt4-memory-places-label{
  margin:0 0 10px;
  color:#222222;
  font:600 15px/20px "Instrument Sans",system-ui,sans-serif;
}
#myTripsView .mt4-memory-stop-list{
  display:grid;
  gap:8px;
}
#myTripsView .mt4-memory-stop-row{
  display:grid;
  grid-template-columns:34px minmax(0,1fr);
  align-items:center;
  gap:10px;
  min-height:48px;
  padding:0 12px 0 8px;
  border-radius:10px;
  background:#F2F2F2;
}
#myTripsView .mt4-memory-stop-pin{
  display:flex;
  align-items:center;
  justify-content:center;
  width:30px;
  height:30px;
  border-radius:50% 50% 50% 0;
  background:#222222;
  color:#FFFFFF;
  transform:rotate(-45deg);
}
#myTripsView .mt4-memory-stop-row.is-visited .mt4-memory-stop-pin{
  background:#8F9491;
}
#myTripsView .mt4-memory-stop-pin span{
  display:flex;
  align-items:center;
  justify-content:center;
  width:30px;
  height:30px;
  transform:rotate(45deg);
  font:600 14px/14px "Instrument Sans",system-ui,sans-serif;
}
#myTripsView .mt4-memory-stop-name{
  overflow:hidden;
  color:#222222;
  font:550 14px/19px "Instrument Sans",system-ui,sans-serif;
  text-overflow:ellipsis;
  white-space:nowrap;
}
#myTripsView .mt4-memory-stop-row.is-visited .mt4-memory-stop-name{
  color:#6A6A6A;
}
#myTripsView .mt4-memory-detail .mt4-travel-connector,
#myTripsView .mt4-memory-detail .mt4-travel-go{
  display:none !important;
}
#myTripsView .mt4-memory-reuse{
  margin-top:14px;
}


/* PAST TRIPS REVEAL — same venue language as Trips, full-width and read-only. */
#myTripsView .mt4-memory-detail-inner{
  padding-left:0 !important;
  padding-right:0 !important;
}
#myTripsView .mt4-memory-places-label{
  margin-left:0;
  margin-right:0;
}
#myTripsView .mt4-memory-stop-list{
  width:100%;
}
#myTripsView .mt4-memory-venue-row{
  display:grid;
  grid-template-columns:48px minmax(0,1fr);
  grid-template-rows:48px;
  width:100%;
  box-sizing:border-box;
  min-height:48px;
  margin:0 0 8px;
  padding:0;
  border:1px solid #EBEBEB;
  border-radius:12px;
  background:#F7F7F7;
  overflow:hidden;
  transition:border-color .18s ease, background .18s ease;
}
#myTripsView .mt4-memory-venue-row:last-child{
  margin-bottom:0;
}
#myTripsView .mt4-memory-venue-row.is-expanded{
  grid-template-rows:48px auto;
  background:#FFFFFF;
}
#myTripsView .mt4-memory-venue-row .mt4-venue-pin{
  align-self:center;
  justify-self:center;
  width:30px;
  height:30px;
  border-radius:50% 50% 50% 0;
  transform:rotate(-45deg);
  background:#222222;
  color:#FFFFFF;
}
#myTripsView .mt4-memory-venue-row.is-visited .mt4-venue-pin{
  background:#8F9491;
}
#myTripsView .mt4-memory-venue-row .mt4-venue-pin span{
  display:flex;
  align-items:center;
  justify-content:center;
  width:30px;
  height:30px;
  transform:rotate(45deg);
  font:600 14px/14px "Instrument Sans",system-ui,sans-serif;
}
#myTripsView .mt4-memory-venue-row .mt4-venue-name{
  appearance:none;
  display:block;
  width:100%;
  min-width:0;
  height:48px;
  margin:0;
  padding:0 14px 0 4px;
  border:0;
  background:transparent;
  color:#222222;
  overflow:hidden;
  white-space:nowrap;
  text-overflow:ellipsis;
  text-align:left;
  font:550 15px/20px "Instrument Sans",system-ui,sans-serif;
  -webkit-tap-highlight-color:transparent;
}
#myTripsView .mt4-memory-venue-row.is-visited .mt4-venue-name{
  color:#6A6A6A;
}
#myTripsView .mt4-memory-venue-row .mt4-venue-detail{
  display:none;
  grid-column:1/-1;
  padding:0 14px 14px 52px;
}
#myTripsView .mt4-memory-venue-row.is-expanded .mt4-venue-detail{
  display:block;
}
#myTripsView .mt4-memory-venue-row .mt4-venue-hours{
  margin:0 0 8px;
  color:#222222;
  font:525 14px/20px "Instrument Sans",system-ui,sans-serif;
}
#myTripsView .mt4-memory-venue-row .mt4-venue-about{
  margin:0 0 12px;
  color:#6A6A6A;
  font:410 14px/20px "Instrument Sans",system-ui,sans-serif;
  display:-webkit-box;
  -webkit-box-orient:vertical;
  -webkit-line-clamp:3;
  overflow:hidden;
}
#myTripsView .mt4-memory-venue-row .mt4-venue-actions{
  display:flex;
  align-items:center;
  gap:16px;
}
#myTripsView .mt4-memory-venue-row .mt4-venue-action{
  appearance:none;
  min-height:32px;
  padding:0;
  border:0;
  background:transparent;
  color:#222222;
  font:600 14px/18px "Instrument Sans",system-ui,sans-serif;
}
#myTripsView .mt4-memory-summary{
  -webkit-tap-highlight-color:transparent;
  touch-action:manipulation;
  outline:none;
}
#myTripsView .mt4-memory-summary:focus:not(:focus-visible),
#myTripsView .mt4-memory-summary:active{
  outline:none;
  box-shadow:none;
}
#myTripsView .mt4-memory-chevron,
#myTripsView .mt4-memory-chevron svg{
  -webkit-tap-highlight-color:transparent;
}


/* PAST TRIPS POLISH — separate archived trip units + sharper premium corners. */
#myTripsView .mt4-memory-list{
  gap:8px !important;
  padding:0 !important;
  border-radius:0 !important;
  background:transparent !important;
}
#myTripsView .mt4-memory{
  padding:12px !important;
  border:1px solid #EBEBEB !important;
  border-radius:14px !important;
  background:#F7F7F7 !important;
}
#myTripsView .mt4-memory:last-child{
  border-bottom:1px solid #EBEBEB !important;
}
#myTripsView .mt4-memory-summary{
  min-height:88px;
  padding:0 !important;
}
#myTripsView .mt4-memory-thumb{
  border-radius:10px !important;
}
#myTripsView .mt4-memory-detail-inner{
  padding-top:12px !important;
}


/* FINAL POLISH — calendar slides only its month grid. */
#myTripsView .mt4-calendar-grid{
  will-change:transform,opacity;
  transition:transform .15s ease,opacity .15s ease;
}
#myTripsView .mt4-calendar-grid.slide-out-left{
  transform:translateX(-18px);
  opacity:0;
}
#myTripsView .mt4-calendar-grid.slide-out-right{
  transform:translateX(18px);
  opacity:0;
}
#myTripsView .mt4-calendar-grid.slide-in-left{
  transform:translateX(-18px);
  opacity:0;
}
#myTripsView .mt4-calendar-grid.slide-in-right{
  transform:translateX(18px);
  opacity:0;
}

/* Empty-state loops — quiet, purposeful, connected to the product flow. */
#myTripsView .mt4-loop-empty,
#myTripsView .mt4-memory-empty{
  max-width:520px;
}
#myTripsView .mt4-loop-mark{
  display:flex;
  align-items:center;
  gap:8px;
  width:max-content;
  margin-bottom:20px;
  color:#6A6A6A;
  font:500 13px/18px "Instrument Sans",system-ui,sans-serif;
}
#myTripsView .mt4-loop-mark span:first-child{
  font-size:18px;
}
#myTripsView .mt4-loop-mark i{
  width:20px;
  height:1px;
  background:#EBEBEB;
}
#myTripsView .mt4-empty-link{
  appearance:none;
  display:block;
  margin-top:14px;
  padding:0;
  border:0;
  background:transparent;
  color:#6A6A6A;
  font:500 14px/20px "Instrument Sans",system-ui,sans-serif;
  text-decoration:underline;
  text-underline-offset:3px;
}
#myTripsView .mt4-memory-empty{
  margin:0 auto;
  padding-top:52px;
  text-align:center;
}
#myTripsView .mt4-memory-empty-mark{
  display:grid;
  width:54px;
  height:54px;
  margin:0 auto 18px;
  place-items:center;
  border-radius:50%;
  background:#F7F7F7;
  color:#00733D;
}
#myTripsView .mt4-memory-empty-mark svg{
  width:24px;
  height:24px;
}
#myTripsView .mt4-memory-empty .mt4-eyebrow{
  margin-bottom:8px;
}
#myTripsView .mt4-memory-empty h2{
  margin:0;
  color:#222222;
  font:600 24px/30px "Instrument Sans",system-ui,sans-serif;
}
#myTripsView .mt4-memory-empty p:not(.mt4-eyebrow){
  max-width:420px;
  margin:8px auto 22px;
  color:#6A6A6A;
  font:410 15px/22px "Instrument Sans",system-ui,sans-serif;
}
#myTripsView .mt4-memory-empty .mt4-btn{
  min-width:150px;
}
#myTripsView .mt4-memory-empty .mt4-empty-link{
  margin-left:auto;
  margin-right:auto;
}

/* Past Trips delete — secondary and deliberately quieter than Reuse. */
#myTripsView .mt4-memory-actions{
  display:grid;
  gap:8px;
  margin-top:14px;
}
#myTripsView .mt4-memory-actions .mt4-memory-reuse{
  margin-top:0;
}
#myTripsView .mt4-memory-delete{
  appearance:none;
  min-height:38px;
  border:0;
  background:transparent;
  color:#6A6A6A;
  font:500 13px/18px "Instrument Sans",system-ui,sans-serif;
}
#myTripsView .mt4-memory-delete-confirm{
  margin-top:8px;
  padding:14px;
  border:1px solid #EBEBEB;
  border-radius:12px;
  background:#FFFFFF;
}
#myTripsView .mt4-memory-delete-confirm[hidden]{
  display:none !important;
}
#myTripsView .mt4-memory-delete-confirm strong,
#myTripsView .mt4-memory-delete-confirm span{
  display:block;
}
#myTripsView .mt4-memory-delete-confirm strong{
  color:#222222;
  font:600 14px/19px "Instrument Sans",system-ui,sans-serif;
}
#myTripsView .mt4-memory-delete-confirm span{
  margin-top:3px;
  color:#6A6A6A;
  font:410 13px/18px "Instrument Sans",system-ui,sans-serif;
}
#myTripsView .mt4-memory-delete-confirm > div{
  display:flex;
  justify-content:flex-end;
  gap:8px;
  margin-top:12px;
}
#myTripsView .mt4-memory-delete-confirm button{
  appearance:none;
  min-height:36px;
  padding:0 12px;
  border:1px solid #EBEBEB;
  border-radius:9px;
  background:#FFFFFF;
  color:#222222;
  font:500 13px/18px "Instrument Sans",system-ui,sans-serif;
}
#myTripsView .mt4-memory-delete-confirm .is-danger{
  border-color:#222222;
  background:#222222;
  color:#FFFFFF;
}


/* EMPTY STATE ROUTING POLISH — same vertical rhythm, quieter H mark. */
#myTripsView .mt4-loop-empty,
#myTripsView .mt4-memory-empty{
  margin:0 !important;
  padding-top:42px !important;
  text-align:left !important;
}
#myTripsView .mt4-memory-empty{
  max-width:520px;
}
#myTripsView .mt4-memory-empty-mark{
  display:grid;
  width:46px;
  height:46px;
  margin:0 0 18px !important;
  place-items:center;
  border-radius:12px;
  background:#F7F7F7;
}
#myTripsView .mt4-memory-empty-mark svg{
  display:block;
  width:28px !important;
  height:28px !important;
}
#myTripsView .mt4-memory-empty h2{
  text-align:left !important;
}
#myTripsView .mt4-memory-empty p:not(.mt4-eyebrow){
  margin:8px 0 22px !important;
  text-align:left !important;
}
#myTripsView .mt4-memory-empty .mt4-btn{
  margin-left:0 !important;
}
#myTripsView .mt4-memory-empty .mt4-empty-link{
  margin-left:0 !important;
  margin-right:0 !important;
}


/* EMPTY PAST TRIPS — standalone Harvestlist H mark. */
#myTripsView .mt4-memory-empty-mark{
  display:block !important;
  width:42px !important;
  height:auto !important;
  margin:0 0 20px !important;
  padding:0 !important;
  border:0 !important;
  border-radius:0 !important;
  background:transparent !important;
}
#myTripsView .mt4-memory-empty-mark svg{
  display:block;
  width:42px !important;
  height:auto !important;
  max-width:none !important;
}

/* SHARE SURFACES — corrected placement: live badge + compact stored-trip actions. */
#myTripsView .mt4-live-share{
  position:absolute;
  top:14px;
  right:14px;
  z-index:4;
  display:inline-flex;
  align-items:center;
  gap:6px;
  min-height:30px;
  padding:5px 11px 5px 9px;
  border:1px solid rgba(255,255,255,.32);
  border-radius:999px;
  background:rgba(34,34,34,.58);
  color:#fff;
  font:600 13px/18px "Instrument Sans",system-ui,sans-serif;
  -webkit-backdrop-filter:blur(8px);
  backdrop-filter:blur(8px);
  cursor:pointer;
  -webkit-tap-highlight-color:transparent;
}
#myTripsView .mt4-live-share svg{
  width:16px;
  height:16px;
  fill:none;
  stroke:currentColor;
  stroke-width:1.9;
  stroke-linecap:round;
  stroke-linejoin:round;
}
#myTripsView .mt4-now{position:relative}

/* Compact share arrow used on collapsed Trips and Past Trips. */
#myTripsView .mt4-trip-share-icon{
  appearance:none;
  display:grid;
  place-items:center;
  width:32px;
  height:32px;
  flex:0 0 32px;
  padding:0;
  border:0;
  border-radius:50%;
  background:transparent;
  color:#6A6A6A;
  cursor:pointer;
  -webkit-tap-highlight-color:transparent;
}
#myTripsView .mt4-trip-share-icon svg{
  width:17px;
  height:17px;
  fill:none;
  stroke:currentColor;
  stroke-width:1.9;
  stroke-linecap:round;
  stroke-linejoin:round;
}
#myTripsView .mt4-memory-share{
  appearance:none;
  display:grid;
  place-items:center;
  width:25.5px;
  height:24px;
  box-sizing:border-box;
  padding:3px;
  border:0;
  border-radius:999px;
  background:transparent;
  color:#6A6A6A;
  cursor:pointer;
  -webkit-tap-highlight-color:transparent;
}
#myTripsView .mt4-memory-share svg{
  width:14px;
  height:12.68px;
  fill:currentColor;
  stroke:none;
}

/* Expanded Trips: Share owns the quiet right-hand strip above reorder guidance. */
#myTripsView .mt4-planning-section-head{
  align-items:flex-end;
}
#myTripsView .mt4-planning-section-side{
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:flex-end;
  flex:0 0 auto;
  min-width:112px;
}
#myTripsView .mt4-trip-share-rail{
  appearance:none;
  display:inline-flex;
  align-items:center;
  width:86.23px;
  height:26px;
  box-sizing:border-box;
  margin:0 0 10px;
  padding:3px 16px 3px 12px;
  border:0;
  border-radius:14px;
  background:#222222;
  color:#FFFFFF;
  cursor:pointer;
  -webkit-tap-highlight-color:transparent;
}
#myTripsView .mt4-trip-share-rail svg{
  display:block;
  flex:0 0 17.5px;
  width:17.5px;
  height:14px;
  fill:currentColor;
  stroke:none;
}
#myTripsView .mt4-trip-share-rail span{
  display:block;
  flex:0 0 auto;
  min-width:0;
  margin:0 0 0 8px;
  color:#FFFFFF;
  font:600 12px/18px "Source Sans Pro",Arial,sans-serif;
}
#myTripsView .mt4-planning-section-side > small{
  margin:0;
  white-space:nowrap;
}

/* Past Trips: share is intentionally above the metadata/chevron axis. */
#myTripsView .mt4-memory{position:relative}
#myTripsView .mt4-memory-summary{padding-right:72px !important}
#myTripsView .mt4-memory-share{
  position:absolute;
  top:10px;
  right:32px;
  z-index:3;
  transform:none;
}
#myTripsView .mt4-memory.is-expanded .mt4-memory-share{
  top:10px;
  transform:none;
}


/* Shared-trip receive bridge — functional preview only; presentation can be refined independently. */
#myTripsView .mt4-shared-preview{
  max-width:680px;
  margin:0 auto;
  padding:34px var(--mt4-gutter) 46px;
}
#myTripsView .mt4-shared-preview-mark{
  display:grid;
  place-items:center;
  width:42px;
  height:42px;
  margin:0 0 18px;
  border-radius:14px;
  background:#222222;
  color:#FFFFFF;
}
#myTripsView .mt4-shared-preview-mark svg{width:19px;height:19px;fill:currentColor}
#myTripsView .mt4-shared-kicker{
  margin:0 0 4px;
  color:#6A6A6A;
  font:550 14px/19px "Instrument Sans",system-ui,sans-serif;
}
#myTripsView .mt4-shared-preview .mt4-heading{margin:0 0 7px}
#myTripsView .mt4-shared-summary{
  margin:0 0 26px;
  color:#6A6A6A;
  font:410 14px/20px "Instrument Sans",system-ui,sans-serif;
}
#myTripsView .mt4-shared-stops{
  display:grid;
  gap:0;
  margin:0 0 24px;
  border-top:1px solid #EBEBEB;
}
#myTripsView .mt4-shared-stop{
  display:grid;
  grid-template-columns:30px minmax(0,1fr);
  align-items:center;
  gap:11px;
  min-height:58px;
  padding:8px 0;
  border:0;
  border-bottom:1px solid #EBEBEB;
  border-radius:0;
  background:#FFFFFF;
}
#myTripsView .mt4-shared-stop>span{
  display:grid;
  place-items:center;
  width:26px;
  height:26px;
  border-radius:50%;
  background:#F2F2F2;
  color:#222222;
  font:600 12px/1 "Instrument Sans",system-ui,sans-serif;
}
#myTripsView .mt4-shared-stop strong{
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  color:#222222;
  font:550 15px/20px "Instrument Sans",system-ui,sans-serif;
}
#myTripsView .mt4-shared-actions{
  display:flex;
  flex-direction:column;
  gap:4px;
}
#myTripsView .mt4-shared-actions .mt4-btn-primary{
  width:100%;
  min-height:46px;
  border-radius:14px;
  background:#222222;
  color:#FFFFFF;
}
#myTripsView .mt4-shared-not-now{
  width:100%;
  min-height:42px;
  padding:0;
  border:0;
  background:transparent;
  color:#6A6A6A;
  font:500 14px/18px "Instrument Sans",system-ui,sans-serif;
  cursor:pointer;
}
#myTripsView .mt4-shared-provenance{
  margin:2px 0 0 2px;
  color:#8A8A8A;
  font:500 12px/17px "Instrument Sans",system-ui,sans-serif;
}


/* ==========================================================================
   DESKTOP CONTAINED POLISH — PASS 1
   Presentation only. Preserve My Trips behavior, Take motion, and mobile/iPad.
   ========================================================================== */
@media (min-width:1025px){
  /* Leave a Take belongs to the contained unit as a bottom drawer, not as a
     second floating card inside the already-shaped desktop shell. */
  #mhlMobileContent.mhl-desktop-contained > .mt4-take-layer{
    align-items:flex-end;
    padding:0;
  }

  #mhlMobileContent.mhl-desktop-contained > .mt4-take-layer .mt4-take-sheet{
    width:100%;
    max-width:none;
    max-height:calc(100% - 24px);
    border-radius:24px 24px 0 0;
  }
}

/* Short desktop/laptop viewports: reclaim enough vertical room for the first
   My Day body state without changing the canonical scroll owner or iPad. */
@media (min-width:1025px) and (max-height:900px){
  #mhlMobileContent.mhl-desktop-contained #myTripsView .mt4-day-hero-stage{
    height:246px;
  }
}


/* ==========================================================================
   DESKTOP CONTAINED POLISH — PASS 2
   Take temporarily owns the inside of the already-rounded desktop shell.
   Presentation only: no shell JS, Take behavior, or mobile/iPad changes.
   ========================================================================== */
@media (min-width:1025px){
  #mhlMobileContent.mhl-desktop-contained > .mt4-take-layer{
    border-radius:inherit;
    overflow:hidden;
  }

  #mhlMobileContent.mhl-desktop-contained > .mt4-take-layer .mt4-take-sheet{
    width:100%;
    min-height:100%;
    max-height:100%;
    border-radius:inherit;
  }
}
