/* Mobile/tablet companion, adapted from the supplied code. */
@media (max-width: 1024px) {
  html:has(.mobile-journey) { scroll-padding-top: 0; }
  .journey-chrome { gap: 6px; padding: 8px; border-radius: 24px; background: rgba(15,16,19,0.96); }
  .journey-shortcuts { grid-column: 1 / -1; display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 6px; padding-top: 6px; border-top: 1px solid #303136; }
  .journey-shortcuts a { display: flex; align-items: center; justify-content: center; min-height: 42px; border-radius: 16px; font-size: 0.875rem; color: #c6c6cb; transition: color 180ms ease, background 180ms ease; }
  /* No hover fill: touch browsers can retain :hover after a tap. */
  .journey-shortcuts a:not([aria-current='location']) { background: transparent; }
  .journey-shortcuts a:focus-visible { outline: 2px solid #fff; outline-offset: 2px; }
  .journey-shortcuts a[aria-current='location'] { color: #111113; background: #f5f5f7; }
  .journey-panel { scroll-margin-top: 140px; }
  .journey-welcome { display: flex; flex-direction: column; align-items: center; justify-content: center; min-height: 100svh; gap: 20px; padding: 150px 20px 32px; text-align: center; }
  .mobile-journey { background: #08090b; }
  .mobile-journey::before { display: none; }
  .journey-welcome .journey-title { display: block; margin: 0; font-size: clamp(2.7rem,8vw,4.5rem); line-height: 1.03; letter-spacing: -0.06em; }
  .journey-welcome-copy > p:last-child { margin: 18px auto 0; color: #b7b7bd; }
  .journey-explore { display: inline-flex; flex-direction: column; align-items: center; gap: 10px; min-height: 54px; padding: 8px 20px; color: #dedee3; font-size: 0.875rem; text-decoration: none; }
  .journey-explore span { font-size: 1.5rem; animation: explore-down 2.8s ease-in-out infinite; }
  .companion-area { position: relative; width: min(100%,300px); height: 258px; flex: 0 0 auto; }
  .companion-button { position: absolute; left: calc(50% - 82px); top: 70px; width: 164px; height: 156px; padding: 0; border: 0; border-radius: 60px; background: transparent; cursor: pointer; -webkit-tap-highlight-color: transparent; touch-action: manipulation; transition: transform 350ms ease; }
  .companion-float { display: block; position: relative; width: 100%; height: 100%; animation: companion-float 4s ease-in-out infinite; }
  .companion-body { position: absolute; inset: 5px 24px 16px; border: 1px solid #d8d8dc; border-radius: 58px 58px 35px 35px; background: #f5f5f7; box-shadow: 0 12px 22px rgba(0,0,0,0.18); }
  .companion-eye { position: absolute; top: 46px; width: 9px; height: 15px; border-radius: 50%; background: #151519; transition: transform 100ms ease; }
  .companion-eye.eye-left { left: 32px; }
  .companion-eye.eye-right { right: 32px; }
  .companion-area.is-blinking .companion-eye { transform: scaleY(0.1); }
  .companion-smile { position: absolute; top: 74px; left: calc(50% - 10px); width: 20px; height: 11px; border-bottom: 2px solid #151519; border-radius: 0 0 50% 50%; }
  .companion-arm { position: absolute; top: 67px; width: 23px; height: 51px; border: 1px solid #d8d8dc; border-radius: 18px; background: #f5f5f7; transform-origin: 50% 10%; }
  .companion-arm.arm-left { left: 12px; transform: rotate(22deg); }
  .companion-arm.arm-right { right: 12px; transform: rotate(-22deg); }
  .companion-arm { z-index: 2; transition: transform 420ms ease; }
  .companion-area.is-shy .companion-button { transform: translateY(5px) scale(0.94) rotate(-7deg); }
  .companion-area.is-shy .companion-float { animation-play-state: paused; }
  .companion-area.is-shy .arm-left { transform: translate(22px, 10px) rotate(-145deg); }
  .companion-area.is-shy .arm-right { transform: translate(-22px, 10px) rotate(145deg); }
  .companion-area.is-shy .companion-eye { transform: scaleY(0.65); }
  .companion-shadow { position: absolute; bottom: 23px; left: calc(50% - 35px); width: 70px; height: 8px; border-radius: 50%; background: #fff; opacity: 0.05; animation: companion-shadow 4s ease-in-out infinite; }
  .companion-particle { position: absolute; width: 4px; height: 4px; border-radius: 50%; background: #d7d7dc; opacity: 0.1; animation: companion-particle 7s ease-in-out infinite; }
  .particle-one { top: 94px; left: 26px; }
  .particle-two { top: 164px; right: 20px; animation-delay: -2s; }
  .particle-three { top: 65px; right: 52px; animation-delay: -4s; width: 3px; height: 3px; }
  .companion-area:not(.is-visible) *, .journey-welcome:not(.companion-in-view) .journey-explore span { animation-play-state: paused; }
}
@keyframes companion-float { 0%,100% { transform: translateY(0) rotate(-1deg); } 50% { transform: translateY(-10px) rotate(1deg); } }
@keyframes companion-shadow { 50% { transform: scaleX(0.85); opacity: 0.035; } }
@keyframes companion-particle { 50% { opacity: 0.3; transform: translateY(-8px); } }
@keyframes explore-down { 50% { transform: translateY(5px); } }
@media (prefers-reduced-motion: reduce) {
  .companion-area *, .journey-explore span { animation: none !important; transition: none !important; }
  .journey-shortcuts a { transition: none; }
  .companion-area.is-shy .companion-button { transform: none; }
}
