.mobile-explore-bar,
.mobile-filter-backdrop,
.mobile-sheet-heading,
.mobile-filter-apply,
.mobile-date-select,
.mobile-trip-date,
.mobile-thumb-glance,
.place-card-glance,
.guide-media-glance,
.plan-mobile-cover,
.mobile-sort-field,
.page-tab svg {
  display: none;
}

@media (max-width: 700px) {
  :root {
    --mobile-accent: #9d2d26;
    --mobile-header: 58px;
    --mobile-nav: 70px;
    --mobile-gutter: 12px;
  }

  .places-body {
    --mobile-accent: #315845;
  }

  .guide-body {
    --mobile-accent: #8b4337;
  }

  .plan-body {
    --mobile-accent: #215442;
  }

  html {
    scroll-padding-top: calc(var(--mobile-header) + 58px);
  }

  body {
    padding-bottom: calc(var(--mobile-nav) + env(safe-area-inset-bottom));
    background: #f7f3ec;
  }

  body.has-comparison {
    padding-bottom: calc(var(--mobile-nav) + 68px + env(safe-area-inset-bottom));
  }

  .stay-body.has-comparison:not(.mobile-compare-ready) {
    padding-bottom: calc(var(--mobile-nav) + env(safe-area-inset-bottom));
  }

  body.mobile-filter-open {
    overflow: hidden;
  }

  .site-header,
  .guide-body .site-header {
    position: sticky;
    z-index: 70;
    top: 0;
    width: 100%;
    min-height: var(--mobile-header);
    height: var(--mobile-header);
    margin: 0;
    padding: 0 14px;
    flex-wrap: nowrap;
    border-bottom: 1px solid rgba(45, 48, 43, 0.16);
    background: rgba(247, 243, 236, 0.96);
    backdrop-filter: none;
  }

  .wordmark,
  .guide-body .wordmark {
    min-width: 0;
    min-height: 0;
    gap: 0.55rem;
  }

  .wordmark-mark,
  .guide-body .wordmark-mark {
    width: 34px;
    height: 34px;
    flex: 0 0 34px;
    background: var(--mobile-accent);
    font-size: 1.05rem;
  }

  .wordmark strong,
  .guide-body .wordmark strong {
    overflow: hidden;
    max-width: 155px;
    font-size: 0.82rem;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .wordmark small,
  .site-header > .trip-chip {
    display: none !important;
  }

  .mobile-trip-date {
    display: block;
    margin-left: auto;
    color: #64665f;
    font-size: 0.68rem;
    font-weight: 800;
    letter-spacing: 0.02em;
    white-space: nowrap;
  }

  .page-tabs {
    position: fixed;
    z-index: 90;
    right: 0;
    bottom: 0;
    left: 0;
    width: 100%;
    min-height: var(--mobile-nav);
    height: calc(var(--mobile-nav) + env(safe-area-inset-bottom));
    margin: 0;
    padding: 4px 6px env(safe-area-inset-bottom);
    order: initial;
    align-self: auto;
    border: 0;
    border-top: 1px solid rgba(39, 42, 38, 0.14);
    background: rgba(255, 253, 249, 0.97);
    box-shadow: 0 -12px 30px rgba(44, 38, 29, 0.08);
    backdrop-filter: blur(20px);
  }

  .page-tab,
  .guide-body .page-tab {
    min-width: 0;
    min-height: 60px;
    padding: 5px 2px;
    display: flex;
    flex: 1 1 25%;
    flex-direction: column;
    gap: 2px;
    justify-content: center;
    color: #777870;
    background: transparent;
    font-size: 0.68rem;
    white-space: nowrap;
  }

  .page-tab + .page-tab {
    border-left: 0;
  }

  .page-tab svg {
    display: block;
    width: 23px;
    height: 23px;
    fill: none;
    stroke: currentColor;
    stroke-linecap: round;
    stroke-linejoin: round;
    stroke-width: 1.7;
  }

  .page-tab[aria-current="page"] {
    color: var(--mobile-accent);
    background: transparent;
  }

  .page-tab[aria-current="page"]::before {
    content: "";
    position: absolute;
    top: 0;
    right: 18%;
    left: 18%;
    height: 2px;
    background: var(--mobile-accent);
  }

  .mobile-nav-label {
    display: block;
    line-height: 1;
  }

  .mobile-explore-bar {
    position: sticky;
    z-index: 42;
    top: var(--mobile-header);
    min-height: 56px;
    margin: 10px 0 12px;
    padding: 7px 8px 7px 12px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    border: 1px solid rgba(45, 48, 43, 0.18);
    background: rgba(255, 253, 249, 0.97);
    box-shadow: 0 9px 25px rgba(55, 47, 37, 0.08);
    backdrop-filter: blur(16px);
  }

  .mobile-explore-bar p {
    margin: 0;
    display: flex;
    align-items: baseline;
    gap: 0.25rem;
  }

  .mobile-explore-bar p strong {
    color: var(--mobile-accent);
    font-family: var(--serif);
    font-size: 1.55rem;
    font-weight: 500;
    line-height: 1;
  }

  .mobile-explore-bar p span {
    color: #696b64;
    font-size: 0.66rem;
    font-weight: 750;
  }

  .mobile-explore-bar > div {
    display: flex;
    gap: 6px;
  }

  .mobile-saved-link,
  .mobile-filter-toggle {
    min-height: 40px;
    padding: 0 12px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.3rem;
    border: 1px solid #343832;
    border-radius: 0;
    background: transparent;
    color: #2e322d;
    font-size: 0.72rem;
    font-weight: 850;
    text-decoration: none;
  }

  .mobile-filter-toggle {
    min-width: 72px;
    background: #292e2a;
    color: white;
  }

  .mobile-filter-toggle.has-active {
    background: var(--mobile-accent);
    border-color: var(--mobile-accent);
  }

  .mobile-saved-link b,
  .mobile-filter-toggle b {
    font-size: 0.7rem;
  }

  .mobile-filter-backdrop {
    position: fixed;
    z-index: 98;
    inset: 0;
    display: none;
    width: 100%;
    height: 100%;
    padding: 0;
    border: 0;
    background: rgba(22, 25, 22, 0.62);
    backdrop-filter: blur(3px);
  }

  body.mobile-filter-open .mobile-filter-backdrop {
    display: block;
  }

  [data-mobile-filter-panel] {
    display: none !important;
  }

  body.mobile-filter-open [data-mobile-filter-panel] {
    position: fixed !important;
    z-index: 100;
    top: auto !important;
    right: 0;
    bottom: 0;
    left: 0;
    width: 100%;
    max-width: none;
    max-height: 82vh;
    max-height: min(82dvh, 760px);
    margin: 0;
    padding: 0 16px calc(16px + env(safe-area-inset-bottom));
    display: block !important;
    overflow-y: auto;
    overscroll-behavior: contain;
    border: 0;
    border-radius: 24px 24px 0 0;
    background: #fbf8f2;
    box-shadow: 0 -20px 60px rgba(20, 22, 20, 0.22);
  }

  .mobile-sheet-heading {
    position: sticky;
    z-index: 2;
    top: 0;
    min-height: 72px;
    margin: 0 -1px 10px;
    padding: 15px 0 12px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    border-bottom: 1px solid #cbc4b8;
    background: #fbf8f2;
  }

  .mobile-sheet-heading small,
  .mobile-sheet-heading strong {
    display: block;
  }

  .mobile-sheet-heading small {
    color: var(--mobile-accent);
    font-size: 0.56rem;
    font-weight: 900;
    letter-spacing: 0.14em;
  }

  .mobile-sheet-heading strong {
    margin-top: 0.15rem;
    font-family: var(--serif);
    font-size: 1.35rem;
    font-weight: 550;
  }

  .mobile-sheet-heading button {
    min-width: 54px;
    min-height: 40px;
    border: 1px solid #343832;
    background: transparent;
    color: #343832;
    font-size: 0.7rem;
    font-weight: 800;
  }

  .filters-heading,
  .place-filters-head,
  .guide-filter-head {
    display: none !important;
  }

  [data-mobile-filter-panel] .field,
  [data-mobile-filter-panel] .place-field,
  [data-mobile-filter-panel] .guide-field,
  [data-mobile-filter-panel] fieldset {
    margin: 0;
    padding-top: 14px;
    padding-bottom: 14px;
  }

  [data-mobile-filter-panel] .mobile-sort-field {
    display: block;
  }

  [data-mobile-filter-panel] input[type="search"],
  [data-mobile-filter-panel] select {
    min-height: 50px;
    font-size: 0.82rem;
  }

  [data-mobile-filter-panel] .category-fieldset {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 2px 14px;
  }

  [data-mobile-filter-panel] .category-fieldset legend {
    grid-column: 1 / -1;
  }

  [data-mobile-filter-panel] .category-fieldset label,
  [data-mobile-filter-panel] .filter-toggles label,
  [data-mobile-filter-panel] .check-fields label,
  [data-mobile-filter-panel] .provider-fieldset label {
    min-height: 42px;
    display: flex;
    align-items: center;
  }

  [data-mobile-filter-panel] .compact-fields,
  [data-mobile-filter-panel] .guide-field-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0 12px;
  }

  [data-mobile-filter-panel] .filter-footnote,
  [data-mobile-filter-panel] .guide-filter-note {
    margin: 12px 0;
    font-size: 0.65rem;
    line-height: 1.6;
  }

  .mobile-filter-apply {
    position: sticky;
    z-index: 3;
    bottom: calc(-16px - env(safe-area-inset-bottom));
    width: calc(100% + 32px);
    min-height: 58px;
    margin: 12px -16px 0;
    padding: 0 16px env(safe-area-inset-bottom);
    display: block;
    border: 0;
    background: var(--mobile-accent);
    color: white;
    font-size: 0.8rem;
    font-weight: 850;
  }

  .mobile-filter-apply strong {
    margin-right: 0.2rem;
    font-family: var(--serif);
    font-size: 1.25rem;
    font-weight: 500;
  }

  .mobile-date-select {
    margin-top: 12px;
    padding: 10px 12px;
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    align-items: center;
    gap: 12px;
    border: 1px solid #aaa397;
    background: #fffdf9;
  }

  .mobile-date-select > span {
    color: #6d6e67;
    font-size: 0.62rem;
    font-weight: 850;
  }

  .mobile-date-select select {
    min-width: 0;
    min-height: 38px;
    padding: 0 2rem 0 0.7rem;
    border: 0;
    border-left: 1px solid #d1cbc0;
    border-radius: 0;
    background-color: transparent;
    color: #272c27;
    font-size: 0.82rem;
    font-weight: 750;
  }

  .quick-filters,
  .place-presets,
  .guide-presets {
    display: flex;
    gap: 7px;
    overflow-x: auto;
    scroll-snap-type: x proximity;
    scrollbar-width: none;
    -webkit-overflow-scrolling: touch;
  }

  .quick-filters::-webkit-scrollbar,
  .place-presets::-webkit-scrollbar,
  .guide-presets::-webkit-scrollbar,
  .guide-tabs::-webkit-scrollbar,
  .active-filters::-webkit-scrollbar {
    display: none;
  }

  .quick-filters button,
  .place-presets button,
  .guide-presets button {
    min-width: max-content;
    min-height: 42px;
    padding: 0 13px;
    flex: 0 0 auto;
    scroll-snap-align: start;
    font-size: 0.72rem;
  }

  .quick-filters .preset-button:nth-child(n + 5) {
    display: none;
  }

  .place-presets .place-preset {
    display: none;
  }

  .place-presets [data-place-preset="all"],
  .place-presets [data-place-preset="wow"],
  .place-presets [data-place-preset="rain"],
  .place-presets [data-place-preset="budget"] {
    display: inline-flex;
  }

  .guide-presets .guide-preset:nth-child(n + 5) {
    display: none;
  }

  .places-section-head,
  .guide-section-head,
  .plan-section-head,
  .section-heading {
    display: block;
  }

  .places-section-head .eyebrow,
  .guide-section-head .eyebrow,
  .plan-section-head .eyebrow,
  .section-heading .eyebrow {
    margin-bottom: 0.35rem;
    font-size: 0.58rem;
  }

  .places-section-head h2,
  .guide-section-head h2,
  .plan-section-head h2,
  .section-heading h2,
  .plan-boundary h2 {
    font-size: 1.85rem;
    line-height: 1.12;
    letter-spacing: -0.04em;
  }

  .places-section-head > p,
  .guide-section-head > p,
  .plan-section-head > p,
  .section-heading > p {
    display: none;
  }

  /* Stay */
  .stay-body .hero {
    width: 100%;
    min-height: 0;
    padding: 12px 12px 24px;
    display: flex;
    flex-direction: column;
    gap: 18px;
    background: #202520;
  }

  .stay-body .hero-gallery {
    position: relative;
    order: -1;
    width: 100%;
    height: 218px;
    min-height: 0;
    display: block;
    overflow: hidden;
    border-radius: 18px;
    background: #39423b;
  }

  .stay-body .hero-photo-main {
    position: relative !important;
    inset: auto !important;
    width: 100% !important;
    height: 100% !important;
    display: block;
    transform: none !important;
  }

  .stay-body .hero-photo-main::after,
  .places-hero-photo::after,
  .guide-hero-visual::after,
  .place-card-media::after,
  .guide-card-media::after,
  .photo-button::after {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    background: linear-gradient(180deg, transparent 48%, rgba(18, 21, 18, 0.7) 100%);
  }

  .stay-body .hero-photo-main img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center 42%;
  }

  .stay-body .hero-photo-main > span {
    z-index: 2;
  }

  .stay-body .hero-photo-top,
  .stay-body .hero-photo-bottom,
  .stay-body .hero-metrics,
  .stay-body .hero-index,
  .stay-body .hero .eyebrow {
    display: none;
  }

  .stay-body .hero-copy {
    padding: 0 4px;
  }

  .stay-body .hero h1 {
    max-width: 345px;
    font-size: 2.75rem;
    line-height: 0.98;
    letter-spacing: -0.065em;
  }

  .stay-body .hero h1 span + span {
    margin-top: 0.06em;
  }

  .stay-body .hero-lede {
    margin-top: 1rem;
    color: #d0d5cf;
    font-size: 0.86rem;
    line-height: 1.65;
  }

  .stay-body .hero-actions {
    margin-top: 1.1rem;
  }

  .stay-body .hero-actions .text-link {
    display: none;
  }

  .stay-body .hero-actions .primary-link {
    width: 100%;
    min-height: 48px;
  }

  .stay-body .explorer {
    width: 100%;
    padding: 24px 12px 70px;
    display: flex;
    flex-direction: column;
  }

  .stay-body .section-heading {
    order: 1;
  }

  .stay-body .quick-filters {
    order: 2;
    margin-top: 15px;
  }

  .stay-body .mobile-explore-bar {
    order: 3;
  }

  .stay-body .explorer-layout {
    order: 4;
    margin-top: 0;
    display: block;
  }

  .stay-body .decision-stage {
    order: 5;
    margin-top: 72px;
  }

  .stay-body .result-toolbar {
    display: none;
  }

  .active-filters {
    margin: 0 0 10px;
    display: flex;
    flex-wrap: nowrap;
    overflow-x: auto;
  }

  .results-grid,
  .places-results,
  .guide-results {
    grid-template-columns: 1fr;
    gap: 15px;
  }

  .stay-card,
  .place-card,
  .guide-card {
    overflow: hidden;
    border: 1px solid rgba(74, 68, 58, 0.18);
    border-radius: 18px;
    background: #fffdf9;
    box-shadow: 0 10px 28px rgba(54, 47, 38, 0.08);
  }

  .photo-button,
  .photo-placeholder {
    aspect-ratio: 4 / 3;
    border-bottom: 0;
  }

  .photo-button > .photo-count {
    z-index: 3;
    top: 12px;
    right: 12px;
    bottom: auto;
    padding: 0.35rem 0.5rem;
    border: 0;
    background: rgba(22, 25, 22, 0.78);
    font-size: 0.62rem;
  }

  .photo-button > .mobile-thumb-glance {
    position: absolute;
    z-index: 3;
    right: 14px;
    bottom: 13px;
    left: 14px;
    padding: 0;
    display: flex;
    align-items: end;
    justify-content: space-between;
    border: 0;
    background: transparent;
    color: white;
    text-align: left;
  }

  .mobile-thumb-glance strong,
  .mobile-thumb-glance small {
    display: block;
  }

  .mobile-thumb-glance strong {
    font-family: var(--serif);
    font-size: 1.45rem;
    font-weight: 550;
  }

  .mobile-thumb-glance small {
    font-size: 0.68rem;
    font-weight: 800;
  }

  .stay-card .card-body {
    padding: 15px;
  }

  .stay-card .card-title-row {
    margin-top: 0.65rem;
  }

  .stay-card .card-title-row h3 {
    font-size: 1.3rem;
  }

  .stay-card .facts div {
    min-height: 72px;
    padding: 0.55rem;
  }

  .stay-card .facts div:nth-child(-n + 2) {
    display: none;
  }

  .stay-card .facts dd {
    font-size: 0.75rem;
  }

  .stay-card .facts small {
    display: none;
  }

  .stay-card .flags {
    overflow: hidden;
    max-height: 25px;
    flex-wrap: nowrap;
  }

  .stay-card .card-note {
    min-height: 0;
    display: -webkit-box;
    overflow: hidden;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
  }

  .stay-card .card-actions {
    grid-template-columns: 0.42fr 0.58fr;
  }

  .comparison-dock {
    z-index: 82;
    right: 10px;
    bottom: calc(var(--mobile-nav) + 8px + env(safe-area-inset-bottom));
    left: 10px;
    width: auto;
    min-height: 58px;
    padding: 6px;
    grid-template-columns: 48px minmax(0, 1fr) 104px;
    gap: 6px;
    border-radius: 14px;
  }

  .stay-body .comparison-dock:not([hidden]) {
    display: none;
  }

  .stay-body.mobile-compare-ready .comparison-dock:not([hidden]) {
    display: grid;
  }

  .comparison-dock-title {
    padding-left: 4px;
  }

  .comparison-dock-title span,
  .comparison-status,
  .dock-clear {
    display: none;
  }

  .comparison-dock-title strong {
    font-size: 1rem;
  }

  .comparison-slots {
    grid-template-columns: repeat(3, 1fr);
  }

  .comparison-slot {
    min-height: 44px;
    padding: 3px;
    display: block;
  }

  .comparison-slot > img,
  .slot-placeholder {
    width: 100%;
    height: 40px;
  }

  .comparison-slot > span:not(.slot-placeholder),
  .comparison-slot > button,
  .comparison-slot.is-empty small {
    display: none;
  }

  .comparison-slot.is-empty {
    min-width: 0;
    padding: 0;
    display: grid;
    place-items: center;
  }

  .dock-open {
    min-height: 46px;
    font-size: 0.66rem;
  }

  /* Places */
  .places-main,
  .guide-main,
  .plan-main {
    display: flex;
    flex-direction: column;
  }

  .places-hero {
    order: 1;
  }

  .place-explorer {
    order: 2;
  }

  .route-lab {
    order: 3;
  }

  .booking-radar {
    order: 4;
  }

  .research-desk {
    order: 5;
  }

  .places-method {
    order: 6;
  }

  .places-hero,
  .booking-radar,
  .research-desk,
  .place-explorer,
  .route-lab,
  .places-method,
  .places-footer {
    width: calc(100% - 24px);
  }

  .places-hero {
    min-height: 0;
    padding: 12px 0 24px;
    display: flex;
    flex-direction: column;
    gap: 20px;
  }

  .places-hero-gallery {
    order: -1;
    width: 100%;
    height: 220px;
    min-height: 0;
    display: grid;
    grid-template-columns: 1.55fr 0.85fr;
    grid-template-rows: 1fr 1fr;
    gap: 4px;
    overflow: hidden;
    border-radius: 18px;
  }

  .places-hero-photo {
    position: relative !important;
    inset: auto !important;
    width: auto !important;
    height: auto !important;
    min-height: 0;
    transform: none !important;
  }

  .places-hero-photo.photo-lead {
    grid-column: 1;
    grid-row: 1 / 3;
  }

  .places-hero-photo.photo-canal {
    grid-column: 2;
    grid-row: 1;
  }

  .places-hero-photo.photo-toji {
    grid-column: 2;
    grid-row: 2;
  }

  .places-hero-photo img {
    width: 100%;
    height: 100%;
    object-fit: cover;
  }

  .places-hero-photo > span {
    z-index: 2;
    padding: 10px;
  }

  .places-hero-photo > span b,
  .places-hero-photo > span em,
  .hero-photo-note {
    display: none;
  }

  .places-hero-photo > span strong {
    font-size: 0.68rem;
  }

  .places-hero .eyebrow,
  .places-hero-index,
  .hero-facts {
    display: none;
  }

  .places-hero h1 {
    max-width: 350px;
    font-size: 2.55rem;
    line-height: 0.99;
  }

  .places-hero-lede {
    margin-top: 1rem;
    font-size: 0.84rem;
    line-height: 1.65;
  }

  .places-hero-actions {
    margin-top: 1.1rem;
  }

  .places-hero-actions .text-link {
    display: none;
  }

  .places-hero-actions .places-primary {
    width: 100%;
    min-height: 48px;
  }

  .place-explorer {
    padding: 26px 0 72px;
  }

  .day-selector,
  .guide-day-selector {
    display: none !important;
  }

  .place-presets,
  .guide-presets {
    margin-top: 10px;
  }

  .place-explorer-layout,
  .guide-explorer-layout {
    margin-top: 0;
    display: block;
  }

  .place-results-head,
  .guide-results-head {
    display: none;
  }

  .place-card-media {
    height: auto;
    aspect-ratio: 4 / 3;
    border: 0;
  }

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

  .place-card-score {
    z-index: 3;
    top: 12px;
    left: 12px;
  }

  .place-save {
    z-index: 4;
    top: 12px;
    right: 12px;
  }

  .place-card-status {
    z-index: 3;
    right: 12px;
    bottom: 12px;
    top: auto;
  }

  .place-card-glance {
    position: absolute;
    z-index: 3;
    bottom: 13px;
    left: 14px;
    display: block;
    color: white;
    text-align: left;
  }

  .place-card-glance strong,
  .place-card-glance small {
    display: block;
  }

  .place-card-glance strong {
    font-family: var(--serif);
    font-size: 1.05rem;
    font-weight: 550;
  }

  .place-card-glance small {
    margin-top: 0.1rem;
    font-size: 0.62rem;
    font-weight: 800;
  }

  .place-card-body {
    padding: 15px;
  }

  .place-card-body h3 {
    font-size: 1.55rem;
    line-height: 1.12;
  }

  .place-japanese {
    display: none;
  }

  .place-why {
    min-height: 0;
    display: -webkit-box;
    overflow: hidden;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
  }

  .place-metrics {
    grid-template-columns: 1fr 1fr;
  }

  .place-metric {
    min-height: 68px;
  }

  .place-metric:nth-child(1),
  .place-metric:nth-child(2),
  .place-metric:nth-child(n + 5) {
    display: none;
  }

  .place-card-action {
    display: -webkit-box;
    overflow: hidden;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
  }

  .place-card-links {
    grid-template-columns: minmax(0, 1fr) 78px;
  }

  .booking-radar,
  .research-desk,
  .route-lab,
  .places-method {
    margin-top: 0;
    padding-top: 70px;
    padding-bottom: 70px;
  }

  /* Guide */
  .guide-hero {
    order: 1;
  }

  .guide-tabs {
    order: 2;
  }

  .guide-explorer {
    order: 3;
  }

  .guide-routes {
    order: 4;
  }

  .guide-watch {
    order: 5;
  }

  .guide-method {
    order: 6;
  }

  .guide-body .site-header,
  .guide-hero,
  .guide-routes,
  .guide-explorer,
  .guide-watch,
  .guide-method,
  .guide-footer {
    width: calc(100% - 24px);
  }

  .guide-body .site-header {
    width: 100%;
  }

  .guide-hero {
    min-height: 0;
    padding: 12px 0 24px;
    display: flex;
    flex-direction: column;
    gap: 18px;
  }

  .guide-hero-visual {
    position: relative;
    order: -1;
    width: 100%;
    height: 220px;
    min-height: 0;
    overflow: hidden;
    border-radius: 18px;
  }

  .guide-hero-visual img {
    width: 100%;
    height: 220px;
    min-height: 0;
    object-fit: cover;
    object-position: center 46%;
  }

  .guide-hero-visual figcaption {
    z-index: 2;
    padding: 12px;
  }

  .guide-hero-copy .eyebrow,
  .guide-edition,
  .guide-hero-stats {
    display: none;
  }

  .guide-hero h1 {
    font-size: 2.5rem;
    line-height: 1;
  }

  .guide-hero-lede {
    margin-top: 0.9rem;
    font-size: 0.84rem;
    line-height: 1.65;
  }

  .guide-hero-actions {
    margin-top: 1rem;
  }

  .guide-hero-actions .text-link,
  .guide-hero-actions .guide-share {
    display: none;
  }

  .guide-hero-actions .guide-primary {
    width: 100%;
    min-height: 48px;
  }

  .guide-tabs {
    position: sticky;
    z-index: 36;
    top: var(--mobile-header);
    width: 100%;
    min-height: 54px;
    display: flex;
    overflow-x: auto;
    border-top: 1px solid #aaa397;
    border-bottom: 1px solid #aaa397;
    background: rgba(247, 243, 236, 0.97);
    backdrop-filter: blur(14px);
  }

  .guide-tab {
    min-width: 96px;
    min-height: 54px;
    padding: 0 10px;
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    gap: 7px;
  }

  .guide-tab span {
    font-size: 0.65rem;
  }

  .guide-tab strong {
    font-size: 0.68rem;
  }

  .guide-tab small {
    display: none;
  }

  .guide-explorer {
    padding: 26px 0 72px;
  }

  .guide-card {
    display: flex;
  }

  .guide-card-media {
    position: relative;
    height: auto;
    min-height: 0;
    aspect-ratio: 4 / 3;
  }

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

  .guide-card-media > .guide-media-credit {
    z-index: 3;
    top: 11px;
    right: 12px;
    bottom: auto;
    max-width: 60%;
    overflow: hidden;
    color: white;
    font-size: 0.54rem;
    text-overflow: ellipsis;
    text-shadow: 0 1px 7px rgba(0, 0, 0, 0.7);
    white-space: nowrap;
  }

  .guide-media-glance,
  .guide-card-abstract > .guide-media-glance {
    position: absolute;
    z-index: 3;
    right: 14px;
    bottom: 13px;
    left: 14px;
    display: flex;
    align-items: end;
    justify-content: space-between;
    color: white;
    text-align: left;
  }

  .guide-media-glance strong,
  .guide-media-glance small {
    display: block;
    max-width: 70%;
    margin: 0;
    color: inherit;
    text-align: left;
  }

  .guide-media-glance strong {
    font-family: var(--serif);
    font-size: 0.95rem;
    font-weight: 550;
  }

  .guide-media-glance small {
    font-size: 0.62rem;
    font-weight: 800;
  }

  .guide-card-abstract {
    min-height: 230px;
    background: linear-gradient(135deg, #30473a, #8d5b46 60%, #d1a66c);
  }

  .guide-card-abstract > small {
    display: none;
  }

  .guide-card[data-category="cafe"] .guide-card-abstract {
    background: linear-gradient(135deg, #80664a, #b8825f 58%, #ead3a8);
  }

  .guide-card[data-category="night"] .guide-card-abstract {
    background: linear-gradient(135deg, #1d2a29, #304a4e 58%, #a16d4d);
  }

  .guide-card[data-category="shop"] .guide-card-abstract {
    background: linear-gradient(135deg, #4f3030, #8c4c43 58%, #d49b65);
  }

  .guide-card[data-category="practical"] .guide-card-abstract {
    background: linear-gradient(135deg, #263a34, #3d6655 58%, #a6a36d);
  }

  .guide-card-body {
    padding: 15px;
  }

  .guide-card h3 {
    font-size: 1.45rem;
    line-height: 1.12;
  }

  .guide-card-japanese {
    display: none;
  }

  .guide-card-line,
  .guide-card-warning {
    min-height: 0;
    display: -webkit-box;
    overflow: hidden;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
  }

  .guide-route-note {
    min-height: 0;
  }

  .guide-card-facts {
    grid-template-columns: 1fr;
  }

  .guide-card-facts div {
    min-height: 62px;
  }

  .guide-card-facts div:first-child,
  .guide-card-facts div:nth-child(3) {
    display: none;
  }

  .guide-card-actions {
    grid-template-columns: 1fr 0.7fr;
  }

  .guide-card-actions a {
    grid-column: 1 / -1;
  }

  .guide-routes,
  .guide-watch,
  .guide-method {
    padding-top: 70px;
    padding-bottom: 70px;
  }

  /* Plan */
  .plan-hero {
    order: 1;
  }

  .plan-board {
    order: 2;
  }

  .plan-now {
    order: 3;
  }

  .plan-saved {
    order: 4;
  }

  .plan-deadlines {
    order: 5;
  }

  .plan-recovery {
    order: 6;
  }

  .plan-boundary {
    order: 7;
  }

  .plan-hero,
  .plan-now,
  .plan-board,
  .plan-deadlines,
  .plan-saved,
  .plan-recovery,
  .plan-boundary,
  .plan-footer {
    width: calc(100% - 24px);
  }

  .plan-hero {
    min-height: 0;
    padding: 12px 0 24px;
    display: flex;
    flex-direction: column;
    gap: 18px;
  }

  .plan-mobile-cover {
    order: -1;
    width: 100%;
    height: 220px;
    display: grid;
    grid-template-columns: 1.5fr 0.85fr;
    grid-template-rows: 1fr 1fr;
    gap: 4px;
    overflow: hidden;
    border-radius: 18px;
    background: #263b31;
  }

  .plan-mobile-cover img {
    width: 100%;
    height: 100%;
    object-fit: cover;
  }

  .plan-mobile-cover img:first-child {
    grid-row: 1 / 3;
  }

  .plan-hero-copy {
    padding: 0;
  }

  .plan-hero-copy .eyebrow,
  .plan-edition,
  .plan-hero-stats,
  .plan-hero-desk {
    display: none;
  }

  .plan-hero h1 {
    font-size: 2.7rem;
    line-height: 0.98;
  }

  .plan-hero-lede {
    margin-top: 0.9rem;
    font-size: 0.84rem;
    line-height: 1.65;
  }

  .plan-hero-actions {
    margin-top: 1rem;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 7px;
  }

  .plan-hero-actions .text-link {
    display: none;
  }

  .plan-hero-actions .plan-primary,
  #plan-copy {
    min-height: 48px;
  }

  #plan-copy {
    grid-column: auto;
  }

  .plan-board,
  .plan-deadlines,
  .plan-saved,
  .plan-recovery,
  .plan-boundary {
    padding: 30px 0 70px;
  }

  .plan-date-tabs {
    margin-top: 16px;
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    overflow: visible;
  }

  .plan-date-tab {
    min-width: 0;
    min-height: 58px;
    padding: 0 7px;
  }

  .plan-mode-tabs {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .plan-mode-tab,
  .plan-mode-tab:last-child {
    min-height: 76px;
    padding: 9px 7px;
    grid-column: auto;
  }

  .plan-mode-tab span {
    font-size: 0.72rem;
  }

  .plan-mode-tab small {
    display: none;
  }

  .plan-day-card {
    overflow: hidden;
    border-radius: 18px;
    box-shadow: 0 10px 28px rgba(54, 47, 38, 0.08);
  }

  .plan-day-visual {
    min-height: 225px;
    max-height: 225px;
  }

  .plan-day-visual img {
    width: 100%;
    height: 100%;
    object-fit: cover;
  }

  .plan-day-content {
    padding: 22px 15px;
  }

  .plan-day-content h3 {
    font-size: 1.75rem;
  }

  .plan-stop {
    grid-template-columns: 72px minmax(0, 1fr);
  }

  .plan-stop-body {
    padding-left: 0.8rem;
  }

  .plan-now {
    padding: 28px 0;
  }

  .plan-now > div {
    display: none;
  }

  .plan-next-action {
    width: 100%;
  }

  .plan-deadline-grid,
  .plan-recovery-grid {
    grid-template-columns: 1fr;
  }

  .plan-deadline,
  .plan-recovery-card {
    min-height: 0;
  }

  .plan-saved-grid {
    gap: 12px;
  }

  footer,
  .places-footer,
  .guide-footer,
  .plan-footer {
    margin-bottom: 0;
    padding: 24px 12px;
  }
}

@media (max-width: 390px) {
  [data-mobile-filter-panel] .compact-fields,
  [data-mobile-filter-panel] .guide-field-grid {
    grid-template-columns: 1fr;
  }

  .stay-body .hero h1,
  .places-hero h1,
  .guide-hero h1,
  .plan-hero h1 {
    font-size: 2.45rem;
  }

  .mobile-saved-link,
  .mobile-filter-toggle {
    padding-right: 9px;
    padding-left: 9px;
  }
}