/* Isolated V3 presentation; original regional data and map modules stay intact. */
html.v3-region {
  --color-brand-navy: #294740;
  --color-brand-blue: #b8493d;
  --color-brand-blue-hover: #94372f;
  --color-brand-gold: #c39b54;
  --color-snow: #f7f2ea;
  --color-surface: #fffdf9;
  --color-surface-muted: #edf2ec;
  --color-text-primary: #342f2c;
  --color-text-secondary: #746e67;
  --color-border: #ded5c8;
  --color-focus: #c39b54;
}
html.v3-region body { color: var(--ink); background: var(--washi); font-family: var(--sans); }
.v3-region :is(a, button, summary, input, select):focus-visible { outline: 3px solid var(--brass); outline-offset: 4px; }
.v3-region .section-nav { overflow-x: auto; scrollbar-width: thin; }
.v3-region main { min-width: 0; }
.v3-region main :is(h2, h3, h4) { color: var(--pine); }
.v3-region main h2 { font-family: var(--serif); }
.v3-region :is(.ypv-eyebrow, .mnp-eyebrow) { color: var(--red); letter-spacing: .15em; }
.v3-region :is(.ypv-content-heading, .ypv-section-heading, .mnp-section-heading) > p { color: var(--muted); }
.v3-region :is(.ypv-source-note, .mnp-source-note) { color: var(--muted); }
.v3-region header.snow-topic-hero .snow-topic-hero__copy { padding: 0; }
.v3-region header.snow-topic-hero::after {
  background: linear-gradient(90deg, rgb(255 253 249 / 97%), rgb(255 253 249 / 88%) 35%, rgb(255 253 249 / 32%) 62%, transparent 85%);
}
.v3-region header.snow-topic-hero .snow-topic-hero__actions { margin-top: 24px; }
.v3-region header.snow-topic-hero .snow-topic-hero__actions a { color: var(--pine); border-color: var(--red); background: rgb(255 255 255 / 88%); }
.v3-region header.snow-topic-hero .snow-topic-hero__actions a:first-child { color: white; border-color: var(--red); background: var(--red); }
.v3-region header.snow-topic-hero .snow-topic-hero__actions a:hover { color: var(--red-dark); background: white; }
.v3-region header.snow-topic-hero .snow-topic-hero__actions a:first-child:hover { color: white; background: var(--red-dark); }
.v3-region header.snow-topic-hero .snow-topic-hero__region { display: block; }

/* Keep the MNO traffic page on the same shell width and HERO treatment as
   its sibling topic pages. The legacy traffic stylesheet capped this page
   at 1200px, which made its opening noticeably narrower than the other
   regional pages. */
.v3-subpage[data-v3-region="myoko-nozawa-madarao"][data-mno-preview-page="traffic"] .mnp-topic-main {
  width: var(--shell);
  max-width: none;
  margin-inline: auto;
}

/* Match Zao's full-width overview photograph and four travel entrances. */
.v3-regional-overview .v2-continuation { width: 100%; padding-top: 0; }
.v3-regional-overview main > :is(section, aside, p, noscript) { width: var(--shell); margin-inline: auto; }
.v3-regional-overview header.snow-topic-hero[data-topic-hero] {
  min-height: 445px; padding: 62px max(28px, calc((100% - 1568px) / 2), 4%);
  margin-top: 0; margin-bottom: 0; border: 0; border-radius: 0; box-shadow: none;
}
.v3-regional-overview header.snow-topic-hero h1 { font-size: clamp(46px, 5.4vw, 84px); }
.v3-regional-overview[data-v3-region="myoko-nozawa-madarao"] header.snow-topic-hero h1 { font-size: clamp(37px, 3.7vw, 62px); letter-spacing: .01em; }
.v3-regional-overview[data-v3-region="myoko-nozawa-madarao"] header.snow-topic-hero .snow-topic-hero__copy { width: min(100%, 700px); max-width: 700px; }
.v3-region .v3-regional-journey { margin-block: 0 26px; }
.v3-region .v3-regional-journey .eyebrow { color: var(--red); font-family: Georgia, serif; font-size: 12px; letter-spacing: .15em; }
.v3-region .v3-regional-journey .journey-card__icon { color: white; }
.v3-region .v3-regional-journey .journey-card__body strong { color: var(--pine); }
.v3-region main > :is(.ypv-content-section, .mnp-section) { margin-block: 38px; }

/* Controls, filters and content surfaces use the confirmed red / warm paper palette. */
.v3-region :is(.ypv-button, .mnp-button) { color: var(--pine); border-color: #b7c2b9; background: #fff; }
.v3-region :is(.ypv-button-gold, .ypv-button-navy, .mnp-button--gold, .mnp-button--primary, .mnp-button--navy) { color: white; border-color: var(--red); background: var(--red); }
.v3-region :is(.ypv-button-glass, .mnp-button--glass) { color: var(--pine); border-color: var(--red); background: rgb(255 255 255 / 86%); }
.v3-region :is(.ypv-button, .mnp-button):hover { border-color: var(--red-dark); }
.v3-region :is(.ypv-text-link, .mnp-text-link) { color: var(--red-dark); }
.v3-region :is(.ypv-guide-fold, .ypv-stay-next, .mnp-next, .mnp-guide, .mnp-policy, .mnp-route, .mnp-card, .mnp-guide-card, .mnp-area-card, .mnp-resource-grid .v2-snow-resource-card) {
  border-color: var(--line); background: var(--white); box-shadow: 0 8px 24px rgb(42 55 48 / 5%);
}
.v3-region :is(.ypv-guide-fold > summary, .mnp-route > summary) { color: var(--pine); }
.v3-region :is(.ypv-orientation, .ypv-map-placeholder, .mnp-map-shell, .mnp-filter, .mnp-map-toolbar, .mnp-map-picker) { color: var(--pine); border-color: #d2dacf; background: #edf2ec; }
.v3-region :is(.mnp-filter, .mnp-map-toolbar, .mnp-map-picker) button { color: var(--pine); border-color: #c5d0c6; background: white; }
.v3-region :is(.mnp-filter, .mnp-map-toolbar, .mnp-map-picker) button[aria-pressed="true"] { color: white; border-color: var(--red); background: var(--red); }
.v3-region :is(.mnp-map-detail, .mnp-map-detail-card, .mnp-area-card__profile, .mnp-area-card__metric, .mnp-fact, .mnp-pill, .mnp-card__meta) { color: var(--pine); border-color: #d5dbd0; background: #edf2ec; }
.v3-region :is(.mnp-warning, .mnp-policy) { color: #775b37; background: #faf2e3; border-color: #e3d2b1; }
.v3-region :is(.mnp-card__summary, .mnp-area-card p, .mnp-guide-card p) { color: #646d65; }
.v3-region :is(.mnp-card__actions a, .mnp-guide-card__actions a) { color: var(--red-dark); }

/* Area headings must remain legible, including headings rendered after API responses. */
.v3-region .mnp-area-card__header,
.v3-region .mnp-area-card__header :is(h3, p) { color: #fff; }
.v3-region :is(.mnp-topic-group__heading, .mnp-guide-group__heading, .yuzawa-resort-region-intro-card__title) {
  padding: 16px 20px; color: white; background: var(--red); border-color: var(--red); border-radius: 9px;
}
.v3-region .mnp-topic-group[data-area] > .mnp-topic-group__heading,
.v3-region .mnp-resort-distribution .yuzawa-resort-region-intro-card .mnp-resort-distribution__title {
  color: white; background: var(--red); border-color: var(--red);
}
.v3-region :is(.mnp-topic-group__heading, .mnp-guide-group__heading, .yuzawa-resort-region-intro-card__title) :is(h2, h3, p, span, small) { color: white; }
.v3-region .mnp-resort-distribution__title :is(h2, h3, span) { color: white; }

/* Yuzawa retains its overview history, resort lists, maps and topic layouts. */
.v3-region .yuzawa-overview-lead { border-color: #d3dbd0; border-top: 4px solid var(--red); background: #edf2ec; }
.v3-region .yuzawa-overview-lead h3 { color: var(--pine); }
.v3-region :is(.yuzawa-overview-history, .yuzawa-overview-theme, .yuzawa-overview-story) { border-color: var(--line); background: var(--white); }
.v3-region .yuzawa-overview-timeline time { color: white; background: var(--red); }
.v3-region :is(.yuzawa-resort-region-nav, .yuzawa-resort-filter, .ypv-filter-panel, .ypv-topic-nav, .ypv-topic-filter, .ypv-stay-filter) { color: var(--pine); border-color: #d3dbd0; background: #edf2ec; }
.v3-region :is(.yuzawa-resort-region-nav, .yuzawa-resort-filter, .ypv-filter-panel, .ypv-topic-nav, .ypv-topic-filter, .ypv-stay-filter) :is(a, button)[aria-current],
.v3-region :is(.yuzawa-resort-region-nav, .yuzawa-resort-filter, .ypv-filter-panel, .ypv-topic-nav, .ypv-topic-filter, .ypv-stay-filter) button[aria-pressed="true"] { color: white; background: var(--red); border-color: var(--red); }
.v3-region :is(.ypv-card, .ypv-stay-card, .ypv-food-card, .ypv-onsen-card, .yuzawa-resort-card) { border-color: var(--line); background: var(--white); }
.v3-region :is(.ypv-map-detail, .yuzawa-map-detail) { border-color: var(--line); }
.v3-region :is(.yuzawa-map-list__group, .yuzawa-map-preview, .yuzawa-map-lift-note) { border-color: var(--line); background: var(--white); }
.v3-region :is(.yuzawa-map-list__button, .yuzawa-map-filter button) { color: var(--pine); border-color: #d3dbd0; background: white; }
.v3-region .yuzawa-map-list__button.is-active { color: var(--red-dark); border-color: var(--red); background: #f5e8e4; box-shadow: 0 0 0 2px rgb(184 73 61 / 14%); }
.v3-region .yuzawa-map-preview__facts dt { color: var(--pine); }
.v3-region .yuzawa-map-preview__facts dd { color: var(--muted); }
.v3-region :is(.yuzawa-map-lift-note a, .yuzawa-kicker) { color: var(--red-dark); }
html.v3-region :is(.yuzawa-poi-filter, .yuzawa-stay-filter, .yuzawa-resort-intro, .yuzawa-filter-toolbar) { border-color: var(--line); background: #edf2ec; }
html.v3-region :is(.yuzawa-poi-filter__group > strong, .yuzawa-poi-filter__status, .yuzawa-stay-filter__needs legend) { color: var(--pine); }
html.v3-region :is(.yuzawa-poi-filter__button, .yuzawa-stay-filter__button) { color: var(--pine); border-color: #c7d0c5; background: white; }
html.v3-region main button[aria-pressed="true"],
html.v3-region .yuzawa-stay-filter__button.is-active { color: white; border-color: var(--red); background: var(--red); box-shadow: 0 3px 10px rgb(184 73 61 / 12%); }
html.v3-region :is(.yuzawa-poi-card, .yuzawa-stay-card, .yuzawa-rental-card, .yuzawa-resource-card, .yuzawa-resort-region-intro-card) { border-color: var(--line); background: var(--white); }
html.v3-region .yuzawa-resort-region-intro-card { border-left-color: var(--red); }
html.v3-region :is(.yuzawa-resort-stats span, .yuzawa-resort-region-intro-card__links a) { color: var(--pine); background: #edf2ec; border-color: #d3dbd0; }
html.v3-region :is(.yuzawa-stay-result-group__title, .yuzawa-resource-group__heading, .yuzawa-resort-region__heading) { padding: 16px 20px; color: white; border-radius: 9px; border: 0; background: var(--red); }
html.v3-region :is(.yuzawa-resource-group__heading, .yuzawa-resort-region__heading) :is(h2, h3, p, span) { color: white; }
html.v3-region .yuzawa-resource-group__count { background: rgb(255 255 255 / 16%); }
html.v3-region .yuzawa-resort-region__count { position: static; display: inline-block; margin-top: 8px; background: rgb(255 255 255 / 16%); }

/* Same approved white lesson card and charcoal-stamp footer as Zao. */
.v3-region :is(.ypv-course, .mnp-course) {
  margin-top: 44px; padding: 30px; color: var(--pine); border: 1px solid var(--line); border-top: 5px solid var(--red);
  border-radius: 14px; background: #fff; box-shadow: var(--shadow);
}
.v3-region :is(.ypv-course, .mnp-course) :is(h2, h3) { color: var(--pine); }
.v3-region :is(.ypv-course, .mnp-course) p:not(.ypv-eyebrow, .mnp-eyebrow) { color: #646d65; }
.v3-region :is(.ypv-footer-fallback, .mnp-footer-fallback) { color: #ece5dc; background: #222224; border-top: 5px solid var(--red); }
.v3-region .v2-site-footer :is(h2, h3) { color: #e8c17a; }

/* Reuse the resort-distribution palette for every MNO subpage. */
.v3-region :is([data-mno-area="myoko"], [data-resort-group="myoko"]) { --resort-area-color: #194b69; --resort-area-edge: #3886c6; }
.v3-region :is([data-mno-area="nozawa"], [data-resort-group="nozawa"]) { --resort-area-color: #843f32; --resort-area-edge: #aa5c4c; }
.v3-region :is([data-mno-area="tangram"], [data-resort-group="tangram"]) { --resort-area-color: #574275; --resort-area-edge: #705795; }
.v3-region :is([data-mno-area="cross"], [data-resort-group="cross"]) { --resort-area-color: #42566a; --resort-area-edge: #6f8799; }
html.v3-region :is(.mnp-topic-group[data-area="myoko"] > .mnp-topic-group__heading, .mnp-guide-group[data-resort-group="myoko"] > .mnp-guide-group__heading, .mno-traffic-region[data-area="myoko"] > .mno-traffic-region__heading) { color: white; background: #194b69; border-color: #194b69; }
html.v3-region :is(.mnp-topic-group[data-area="nozawa"] > .mnp-topic-group__heading, .mnp-guide-group[data-resort-group="nozawa"] > .mnp-guide-group__heading, .mno-traffic-region[data-area="nozawa"] > .mno-traffic-region__heading) { color: white; background: #843f32; border-color: #843f32; }
html.v3-region :is(.mnp-topic-group[data-area="tangram"] > .mnp-topic-group__heading, .mnp-guide-group[data-resort-group="tangram"] > .mnp-guide-group__heading, .mno-traffic-region[data-area="tangram"] > .mno-traffic-region__heading) { color: white; background: #574275; border-color: #574275; }
html.v3-region :is(.mnp-topic-group[data-area="cross"] > .mnp-topic-group__heading, .mnp-guide-group[data-resort-group="cross"] > .mnp-guide-group__heading, .mno-traffic-region[data-area="cross"] > .mno-traffic-region__heading) { color: white; background: #42566a; border-color: #42566a; }
html.v3-region :is(.mnp-topic-group__heading, .mnp-guide-group__heading, .mno-traffic-region__heading) :is(h2, h3, p, span) { color: white; }
html.v3-region .mnp-resort-distribution .yuzawa-resort-region-intro-card { border-left-color: var(--resort-area-edge); }
html.v3-region .mnp-resort-distribution .yuzawa-resort-region-intro-card .mnp-resort-distribution__title,
html.v3-region .mnp-guide-group > .mnp-guide-group__heading { color: white; background: var(--resort-area-color, #42566a); border-color: var(--resort-area-color, #42566a); }
html.v3-region .mnp-guide-group__heading :is(h2, span),
html.v3-region .mnp-resort-distribution__title span { color: white; }
html.v3-region[data-mno-preview-page="resorts"] .mnp-resort-distribution__title { font-size: clamp(1.25rem, 2.1vw, 1.65rem); letter-spacing: .02em; }
html.v3-region[data-mno-preview-page="resorts"] .mnp-resort-distribution .yuzawa-resort-region-intros__heading h2 { color: var(--pine); font-size: clamp(1.45rem, 2.5vw, 2rem); font-weight: 850; letter-spacing: .05em; }
html.v3-region[data-mno-preview-page="resorts"] .mnp-resort-distribution .yuzawa-resort-region-intros__heading { padding: 4px 0 10px; border-bottom: 3px solid var(--red); }
html.v3-region[data-mno-preview-page="resorts"] .mnp-resort-distribution .yuzawa-resort-region-intros__grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
html.v3-region[data-mno-preview-page="resorts"] .mnp-resort-distribution .yuzawa-resort-region-intro-card:last-child { grid-column: auto; }
html.v3-region.v2-mno-preview .mnp-card > .v2-snow-media { aspect-ratio: 4 / 3; }
html.v3-region.v2-mno-preview .mnp-card[data-aspect-ratio="9/16"] > .v2-snow-media { aspect-ratio: 4 / 3; }

@media (max-width: 1100px) {
  .v3-region .v3-regional-journey { grid-template-columns: 1fr; }
  .v3-region .v3-regional-journey .journey__intro h2 br { display: none; }
}
@media (max-width: 760px) {
  .v3-regional-overview header.snow-topic-hero[data-topic-hero] { min-height: 0; aspect-ratio: 16 / 9; padding: clamp(70px, 19vw, 104px) 24px 48px; }
  .v3-region header.snow-topic-hero::after { background: linear-gradient(145deg, rgb(13 28 35 / 76%) 0%, rgb(13 28 35 / 34%) 34%, rgb(13 28 35 / 10%) 61%, rgb(13 28 35 / 68%) 100%); }
  .v3-region header.snow-topic-hero .snow-topic-hero__copy { align-self: flex-start; }
  .v3-region header.snow-topic-hero :is(.snow-topic-hero__eyebrow, h1, .snow-topic-hero__region, .snow-topic-hero__lead, .snow-topic-hero__caption) { color: #fff; text-shadow: 0 2px 12px rgb(0 0 0 / 72%); }
  .v3-region header.snow-topic-hero p.snow-topic-hero__caption { top: auto; right: 12px; bottom: 10px; left: auto; width: fit-content; max-width: calc(100% - 24px); padding: 6px 12px 6px 14px; background: rgb(57 44 50 / 88%); text-align: right; }
  .v3-regional-overview header.snow-topic-hero h1 { font-size: clamp(27px, 8.5vw, 40px); }
  .v3-regional-overview[data-v3-region="myoko-nozawa-madarao"] header.snow-topic-hero h1 { font-size: clamp(24px, 6.7vw, 34px); }
  .v3-region :is(.ypv-course, .mnp-course) { padding: 24px 20px; }
  .v3-region :is(.mnp-map-shell, .mnp-area-grid) { grid-template-columns: minmax(0, 1fr); }
  .v3-region .v3-regional-journey { padding-block: 32px; }
  .v3-region .mnp-topic-group__heading { flex-wrap: wrap; }
  .v3-region .mnp-topic-group__heading > * { min-width: 0; }
  html.v3-region[data-mno-preview-page="resorts"] .mnp-resort-distribution .yuzawa-resort-region-intros__grid { grid-template-columns: minmax(0, 1fr); }
  html.v3-region.v2-mno-preview .mnp-card { display: flex; flex-direction: column; }
  html.v3-region.v2-mno-preview .mnp-card > .v2-snow-media { flex: 0 0 auto; min-height: 0; min-block-size: 0; aspect-ratio: 4 / 3; }
}
@media (max-width: 24rem) {
  html.v3-region.v2-mno-preview .mnp-card > .v2-snow-media { aspect-ratio: 4 / 3; }
}
@media (prefers-reduced-motion: reduce) {
  .v3-region *, .v3-region *::before, .v3-region *::after { scroll-behavior: auto; }
}
