:root {
  --ui-ease-out: cubic-bezier(0.23, 1, 0.32, 1);
  --ui-focus-dark: #075c4f;
  --ui-focus-light: #ffffff;
}

html { scroll-behavior: auto !important; }
html, body, #main-content { max-width: 100%; }
#main-content { min-width: 0; }
section[id] { scroll-margin-top: 24px; }
body.mobile-menu-open { overflow: hidden; }

.skip-link {
  position: fixed;
  inset: 12px auto auto 12px;
  z-index:var(--z-modal);
  padding: 10px 14px;
  border-radius: 10px;
  color: #ffffff;
  background: #075c4f;
  font: 700 13px/1.2 "Microsoft YaHei", sans-serif;
  transform: translateY(-160%);
  transition: transform .16s var(--ui-ease-out);
}
.skip-link:focus { transform: translateY(0); }

:is(a, button, summary, input, select, textarea, [role="button"], [tabindex]):focus-visible {
  outline: 3px solid var(--ui-focus-light) !important;
  outline-offset: 2px !important;
  box-shadow: 0 0 0 5px var(--ui-focus-dark) !important;
}
@media (forced-colors: active) {
  :is(a, button, summary, input, select, textarea, [role="button"], [tabindex]):focus-visible {
    outline: 3px solid CanvasText !important;
    box-shadow: none !important;
  }
}

button, summary, a { -webkit-tap-highlight-color: transparent; }
summary { touch-action: manipulation; }
input::placeholder, textarea::placeholder { color: #61746d; opacity: 1; }

.desktop-chapter-rail nav a,
.gallery-arrow,
.back-to-contents,
.trip-mode-launch,
.handbook-theme-launch,
.handbook-theme-option,
.itinerary-customizer-launch,
.itinerary-customizer__close,
.trip-mode-close,
.trip-days-arrow,
.trip-mode-day,
.trip-map-provider button,
.trip-mode-dock button,
.trip-mode-dock a {
  transition-property: transform, opacity !important;
  transition-duration: .14s !important;
  transition-timing-function: var(--ui-ease-out) !important;
}

.day>summary>i,
.vocab>summary>i,
.phrase-group>summary>i,
.food-chapter>summary>i,
.food-region>summary>i,
.menu-dictionary>summary>i,
.mobile-section-fold>summary>i,
.spa-region>summary>i,
.shop-region>summary>i,
.tips-fold>summary>i,
.day>summary>i::before,
.day>summary>i::after,
.vocab>summary>i::before,
.vocab>summary>i::after,
.phrase-group>summary>i::before,
.phrase-group>summary>i::after,
.food-chapter>summary>i::before,
.food-chapter>summary>i::after,
.food-region>summary>i::before,
.food-region>summary>i::after,
.menu-dictionary>summary>i::before,
.menu-dictionary>summary>i::after,
.mobile-section-fold>summary>i::before,
.mobile-section-fold>summary>i::after,
.spa-region>summary>i::before,
.spa-region>summary>i::after,
.shop-region>summary>i::before,
.shop-region>summary>i::after,
.tips-fold>summary>i::before,
.tips-fold>summary>i::after,
.trip-day-map summary>i,
.trip-shopping-tip summary>i {
  transition: none !important;
}

.trip-mode-day { color: rgba(255, 255, 255, .86); }
.trip-mode-intro>p,
.trip-stop-copy p,
.trip-map-body>p,
.trip-section-heading span { color: #435f57; }
.trip-map-provider>span { opacity: .9; }
.custom-period article span>small,
.custom-row-main>span small,
.itinerary-customizer__hint { color: #526a63 !important; }
.trip-uploaded-photo img[role="button"] { border-radius: inherit; }

.booking-progress>span,
.packing-progress>span {
  width: 100% !important;
  transform: scaleX(0);
  transform-origin: left center;
  transition: transform .18s var(--ui-ease-out) !important;
  will-change: transform;
}

@media (hover: hover) and (pointer: fine) {
  html[data-input="pointer"] .day>summary>i,
  html[data-input="pointer"] .vocab>summary>i,
  html[data-input="pointer"] .phrase-group>summary>i,
  html[data-input="pointer"] .food-chapter>summary>i,
  html[data-input="pointer"] .food-region>summary>i,
  html[data-input="pointer"] .menu-dictionary>summary>i,
  html[data-input="pointer"] .mobile-section-fold>summary>i,
  html[data-input="pointer"] .spa-region>summary>i,
  html[data-input="pointer"] .shop-region>summary>i,
  html[data-input="pointer"] .tips-fold>summary>i,
  html[data-input="pointer"] .day>summary>i::before,
  html[data-input="pointer"] .day>summary>i::after,
  html[data-input="pointer"] .vocab>summary>i::before,
  html[data-input="pointer"] .vocab>summary>i::after,
  html[data-input="pointer"] .phrase-group>summary>i::before,
  html[data-input="pointer"] .phrase-group>summary>i::after,
  html[data-input="pointer"] .food-chapter>summary>i::before,
  html[data-input="pointer"] .food-chapter>summary>i::after,
  html[data-input="pointer"] .food-region>summary>i::before,
  html[data-input="pointer"] .food-region>summary>i::after,
  html[data-input="pointer"] .menu-dictionary>summary>i::before,
  html[data-input="pointer"] .menu-dictionary>summary>i::after,
  html[data-input="pointer"] .mobile-section-fold>summary>i::before,
  html[data-input="pointer"] .mobile-section-fold>summary>i::after,
  html[data-input="pointer"] .spa-region>summary>i::before,
  html[data-input="pointer"] .spa-region>summary>i::after,
  html[data-input="pointer"] .shop-region>summary>i::before,
  html[data-input="pointer"] .shop-region>summary>i::after,
  html[data-input="pointer"] .tips-fold>summary>i::before,
  html[data-input="pointer"] .tips-fold>summary>i::after,
  html[data-input="pointer"] .trip-day-map summary>i,
  html[data-input="pointer"] .trip-shopping-tip summary>i {
    transition: transform .18s var(--ui-ease-out), opacity .14s var(--ui-ease-out) !important;
  }

  html[data-input="pointer"] :where(.back-to-contents, .trip-mode-launch, .handbook-theme-launch, .handbook-theme-option, .itinerary-customizer-launch, .itinerary-customizer__close, .trip-mode-close, .trip-days-arrow, .trip-mode-day, .trip-map-provider button, .trip-mode-dock button, .trip-mode-dock a):active {
    transform: scale(.97);
  }
  html[data-input="pointer"] .gallery-arrow:active { transform: translateY(-50%) scale(.96); }
}

@media (hover: none), (pointer: coarse) {@media (hover:hover) and (pointer:fine){
  .day:hover::after { transform: scaleY(0) !important; }}@media (hover:hover) and (pointer:fine){
  .navlinks a:hover::after { transform: scaleX(0) !important; }}@media (hover:hover) and (pointer:fine){
  .restaurant:hover .photo img,
  .gallery-wrap:hover .photo-strip img,
  .nearby-card:hover>img,
  .feature-strip figure:hover img,
  .spa-card:hover img,
  .shop-row:hover figure img,
  .hero-visual figure:hover img,
  .movement-card:hover,
  .spa-card:hover,
  .restaurant:hover,
  .nearby-card:hover,
  .sight-card:hover,
  .flight-card[href]:hover,
  .contents-grid>a:hover,
  .contents-grid>a:hover>span,
  .contents-grid>a:hover>b,
  .contents-grid>a:hover>em,
  .custom-request-list article button:hover,
  .custom-gap>button:hover { transform: none !important; scale: 1 !important; }}@media (hover:hover) and (pointer:fine){
  .gallery-arrow:hover { transform: translateY(-50%) !important; }}@media (hover:hover) and (pointer:fine){
  .map-link:hover,
  .grab-link:hover,
  .hotel-links a:hover,
  .nearby-card footer a:hover,
  .day-quicklinks a:hover,
  .walkable-extras>a:hover,
  .route-mobile-summary:hover .route-glass-button,
  .hero-scroll:hover i { transform: none !important; }}
}

/* Mobile */
@media (max-width: 720px) {
  html, body { overflow-x: clip; }
  .shell { width: calc(100% - 28px) !important; }
  .contents-grid { grid-template-columns: 1fr !important; }
  .flight-card, .flight-card>* { min-width: 0; }
  .mobile-menu-panel,
  .handbook-theme-panel {
    max-height: calc(100dvh - 104px);
    overflow-y: auto;
    overscroll-behavior: contain;
  }
  .mobile-menu-grid a { min-height: 64px; }
  .trip-mode-panel,
  .itinerary-customizer__panel { max-width: 100%; overscroll-behavior: contain; }
  .trip-mode-content { overscroll-behavior: contain; }
  .handbook-theme-panel header button,
  .trip-mode-close,
  .trip-photo-viewer button,
  .itinerary-customizer__close { min-width: 44px; min-height: 44px; }

  body .handbook-theme-launch,
  body .itinerary-customizer-launch,
  body .trip-mode-launch {
    top: auto !important;
    right: auto !important;
    bottom: calc(70px + env(safe-area-inset-bottom)) !important;
    width: 54px !important;
    min-width: 54px !important;
    height: 42px !important;
    min-height: 42px !important;
  }
  body .handbook-theme-launch { left: calc(50% - 96px) !important; }
  body .itinerary-customizer-launch { left: calc(50% - 27px) !important; }
  body .trip-mode-launch { left: calc(50% + 42px) !important; }
}

/* Tablet */
@media (min-width: 721px) and (max-width: 1179px) {
  body>main { width: 100% !important; margin-left: 0 !important; }
  .shell { width: min(760px, calc(100% - 48px)) !important; }
  .contents-grid { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
  .mobile-menu-panel { left: auto; right: 24px; width: min(520px, calc(100vw - 48px)); }
  .handbook-theme-panel { right: 24px; }
  body .handbook-theme-launch,
  body .itinerary-customizer-launch,
  body .trip-mode-launch {
    top: auto !important;
    bottom: 24px !important;
    left: auto !important;
  }
  body .handbook-theme-launch { right: 234px !important; }
  body .itinerary-customizer-launch { right: 143px !important; }
  body .trip-mode-launch { right: 24px !important; }
}

/* Desktop */
@media (min-width: 1180px) {
  .mobile-nav-trigger,
  .mobile-menu-backdrop,
  .mobile-menu-panel { display: none !important; }
  body>main { min-width: 0; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto !important; }
  *, *::before, *::after {
    animation-delay: 0ms !important;
    animation-duration: 1ms !important;
    animation-iteration-count: 1 !important;
    transition-delay: 0ms !important;
    transition-duration: 80ms !important;
    transition-property: opacity !important;
  }
  .jungle-cover-image,
  .jungle-cover-copy,
  .jungle-cover-bottom,
  .mobile-menu-panel,
  .itinerary-customizer__panel,
  .trip-mode-toast { transform: none !important; }
}