/* Screenshot-faithful desktop home shell. Existing mobile screens and data
   contracts remain in styles.css/app.js; this layer only composes the home. */
@media (min-width: 921px) {
  :root {
    --strict-forest: #0d443b;
    --strict-forest-dark: #083a32;
    --strict-paper: #faf8f3;
    --strict-map: #e3f0f1;
    --strict-ink: #193c36;
    --strict-clay: #c9875d;
  }

  html, body { background: var(--strict-paper); }
  body { font-family: -apple-system, BlinkMacSystemFont, "PingFang SC", "Microsoft YaHei", sans-serif; }
  .app-shell { grid-template-columns: 138px minmax(0, 1fr); gap: 0; padding: 0; }
  .side-rail {
    top: 0; height: 100svh; padding: 0; border: 0; border-radius: 0;
    align-items: stretch; background: linear-gradient(180deg, #0f4b41 0%, #0b3e36 100%);
    box-shadow: none;
  }
  .brand-mark { height: 100px; display: grid; place-items: center; border-bottom: 1px solid rgba(255,255,255,.09); writing-mode: horizontal-tb; }
  .brand-mark svg { width: 64px; height: 40px; fill: none; stroke: rgba(255,255,255,.82); stroke-width: 1.3; stroke-linecap: round; stroke-linejoin: round; }
  .brand-dot, .brand-mark > span { display: none; }
  .side-nav { gap: 0; margin-top: 0; }
  .side-nav [data-nav="guides"], .side-nav [data-nav="vr"] { display: flex !important; }
  .nav-item {
    position: relative; min-height: 64px; padding: 0 16px; border-radius: 0;
    flex-direction: row; justify-content: flex-start; gap: 11px;
    color: rgba(244,249,245,.84); font-size: 13px; letter-spacing: .02em;
    transform: none;
  }
  .nav-item::before { left: 0; width: 4px; height: 0; background: #d8dfd1; }
  .nav-item:hover { transform: none; background: rgba(255,255,255,.05); }
  .nav-item.is-active { background: rgba(255,255,255,.08); box-shadow: none; transform: none; }
  .nav-item.is-active::before { height: 100%; }
  .nav-icon { width: 22px; height: 22px; flex: 0 0 22px; }
  .nav-icon .ui-icon { width: 22px; height: 22px; stroke-width: 1.8; }
  .rail-note { margin: auto 0 0; padding: 0 29px 98px; color: rgba(255,255,255,.72); font-family: "Noto Serif SC", "Songti SC", STSong, serif; font-size: 14px; line-height: 1.8; text-align: left; }
  .rail-note i { display: block; width: 22px; height: 1px; margin-top: 26px; background: rgba(255,255,255,.55); }

  .content-area { min-width: 0; padding: 0 0 56px; }
  .topbar { height: 58px; padding: 0 32px 0 42px; background: rgba(250,248,243,.98); }
  .desktop-view-context { display: none; }
  .search-box { width: 315px; height: 36px; padding: 0 14px; border: 0; border-radius: 18px; background: #eeeeec; box-shadow: none; }
  .search-box:focus-within { width: 360px; border: 0; background: #fff; box-shadow: 0 0 0 1px rgba(14,68,59,.2); }
  .search-box input { font-size: 12px; }
  .topbar-actions { margin-left: auto; gap: 20px; }
  .topbar-actions > .icon-button { display: none; }
  .location-pill { min-height: 36px; padding: 0 17px; border: 1px solid #b9c4bf; color: #183f37; background: transparent; font-size: 12px; }
  .avatar-button { width: 36px; height: 36px; color: #777b78; background: #dedfdb; box-shadow: none; }

  body[data-desktop-screen="discover"] .desktop-layout {
    display: grid; grid-template-columns: 1fr; gap: 0; max-width: none; min-height: 0; margin: 0;
  }
  body[data-desktop-screen="discover"] .primary-column { display: contents; }
  .destination-intents[hidden], body[data-desktop-screen="discover"] #guides { display: none !important; }

  body[data-desktop-screen="discover"] .hero-story {
    grid-row: 1; min-height: 405px; height: 405px; border-radius: 0; box-shadow: none; background: #33594d;
  }
  body[data-desktop-screen="discover"] .hero-slide img { width: 100%; height: 100%; object-fit: cover; object-position: center 53%; filter: saturate(.92) contrast(.96); }
  body[data-desktop-screen="discover"] .hero-story:hover img { transform: none; filter: saturate(.94) contrast(.97); }
  body[data-desktop-screen="discover"] .hero-shade { background: linear-gradient(90deg, rgba(10,43,35,.38) 0%, rgba(10,43,35,.13) 38%, transparent 69%), linear-gradient(0deg, rgba(8,35,28,.34), transparent 45%); }
  body[data-desktop-screen="discover"] .hero-copy { left: 42px; right: auto; bottom: 25px; max-width: 620px; }
  body[data-desktop-screen="discover"] .hero-copy .eyebrow { display: none; }
  body[data-desktop-screen="discover"] .hero-copy h1 { margin: 0 0 5px; font-family: "Noto Serif SC", "Songti SC", STSong, serif; font-size: 58px; font-weight: 500; letter-spacing: .1em; line-height: 1.15; text-shadow: 0 2px 18px rgba(0,0,0,.16); }
  body[data-desktop-screen="discover"] .hero-copy p { margin: 0 0 17px; font-family: "Noto Serif SC", "Songti SC", STSong, serif; font-size: 18px; letter-spacing: .2em; }
  body[data-desktop-screen="discover"] #heroCta { min-height: 42px; padding: 0 26px; border: 0; border-radius: 23px; color: #fff; background: var(--strict-clay); font-size: 13px; }
  body[data-desktop-screen="discover"] .hero-progress { bottom: 14px; right: 50%; gap: 8px; transform: translateX(50%); }
  body[data-desktop-screen="discover"] .hero-dot { width: 8px; height: 8px; border: 1px solid #fff; background: transparent; }
  body[data-desktop-screen="discover"] .hero-dot.is-active { width: 8px; border-radius: 50%; background: #fff; }
  body[data-desktop-screen="discover"] .hero-dot:nth-child(n+4) { display: none; }
  body[data-desktop-screen="discover"] .hero-arrow { top: auto; bottom: 19px; width: 34px; height: 34px; border: 0; background: rgba(9,43,35,.26); opacity: 1; transform: none; }
  body[data-desktop-screen="discover"] .hero-arrow-prev { left: auto; right: 90px; }
  body[data-desktop-screen="discover"] .hero-arrow-next { right: 35px; }
  body[data-desktop-screen="discover"] .hero-arrow:hover { transform: none; background: rgba(9,43,35,.5); }

  body[data-desktop-screen="discover"] .map-preview {
    grid-row: 2; display: grid; grid-template-columns: 44% 56%; min-height: 386px; height: 386px;
    border-radius: 0; background: radial-gradient(circle at 33% 44%, #f5faf8 0, var(--strict-map) 74%); box-shadow: none; overflow: hidden;
  }
  body[data-desktop-screen="discover"] .map-preview:hover { transform: none; box-shadow: none; }
  body[data-desktop-screen="discover"] .map-copy { position: relative; display: flex; flex-direction: column; min-width: 0; padding: 26px 0 18px 42px; }
  body[data-desktop-screen="discover"] .map-copy-head { flex: 0 0 auto; }
  body[data-desktop-screen="discover"] .map-copy-head h2 { margin: 0 0 5px; color: var(--strict-ink); font-size: 33px; font-weight: 600; letter-spacing: .08em; }
  body[data-desktop-screen="discover"] .map-copy-head p { max-width: none; margin: 0; color: #405f59; font-size: 13px; letter-spacing: .06em; }
  body[data-desktop-screen="discover"] .map-copy > .dark-button, body[data-desktop-screen="discover"] .map-copy > .section-kicker { display: none; }

  /* The map is the selection control, so the stylised outline and the pins share
     one positioned box. `#desktopMapCanvas` (the OSM/AMap surface) is only used
     on the 目的地 screen, where there is room for it. */
  .map-visual { position: relative; flex: 1 1 auto; min-height: 172px; margin: 2px 24px 0 0; }
  .map-visual .inner-mongolia-map { position: absolute; inset: 0; }
  .map-visual .inner-mongolia-map svg { width: 100%; height: 100%; overflow: visible; }
  .region-map-shadow { fill: rgba(255,255,255,.6); transform: translate(0,4px); }
  /* A green solid enough to read as a landmass. The previous rgba(…,.45) mixed
     down to #E2EDE9 on the card background, which is why the shape looked like
     a shadow rather than a map. */
  .region-map-main { fill: rgba(148,186,166,.78); stroke: #fff; stroke-width: 3; stroke-linejoin: round; }
  .region-map-line { fill: none; stroke: rgba(255,255,255,.95); stroke-width: 2; }
  .region-map-active { fill: #7fae9c; stroke: #fff; stroke-width: 2; }
  .map-pin-shape { fill: var(--strict-clay); }
  .map-visual .desktop-region-pins { position: absolute; z-index: 2; inset: 0; }
  body[data-desktop-screen="discover"] .map-visual .desktop-map-canvas { display: none !important; }

  /* Nine labelled name plates covered the map they were supposed to annotate —
     and on the 目的地 screen the base `.map-pin` rule won the background, so they
     rendered as red ellipses with unreadable text. Both screens now use one dot
     language, matching `.region-dot` in styles.css, and the name appears only
     for the dot that is hovered, focused or selected. The named list right below
     the map (the drill-down row) is what makes every 盟市 identifiable. */
  .map-visual .desktop-region-pin {
    grid-template-columns: 1fr; place-items: center; gap: 0; overflow: visible;
    width: 13px; height: 13px; min-width: 0; min-height: 0; padding: 0;
    border: 2.5px solid #fffdfa; border-radius: 50%;
    color: #163b34; background: #2f695c;
    box-shadow: 0 2px 7px rgba(21,60,53,.4);
  }
  .map-visual .desktop-region-pin .map-pin-mongolian { display: none; }
  .map-visual .desktop-region-pin .map-pin-chinese {
    position: absolute; bottom: calc(100% + 6px); left: 50%;
    padding: 2px 7px; border: 1px solid rgba(21,60,53,.16); border-radius: 8px;
    color: #163b34; background: rgba(255,255,255,.97);
    font-size: 10px; font-weight: 600; white-space: nowrap; pointer-events: none;
    opacity: 0; transform: translateX(-50%) scale(.92); transform-origin: 50% 100%;
    transition: opacity 150ms var(--ease-out), transform 220ms var(--ease-spring);
  }
  .map-visual .desktop-region-pin:hover .map-pin-chinese,
  .map-visual .desktop-region-pin:focus-visible .map-pin-chinese,
  .map-visual .desktop-region-pin.is-selected .map-pin-chinese {
    opacity: 1; transform: translateX(-50%) scale(1);
  }
  .map-visual .desktop-region-pin.is-on-path { background: #5f9b87; }
  /* The clay marker used to sit at one fixed spot on the outline, which now
     reads as a claim about a place the user never chose. The warm accent is
     still worth keeping, so it moves onto whichever 盟市 is selected. */
  body[data-desktop-screen="discover"] .map-visual .map-pin-shape { display: none; }
  .map-visual .desktop-region-pin.is-selected {
    color: #fff; background: var(--strict-clay);
    box-shadow: 0 0 0 6px rgba(201,135,93,.24), 0 5px 12px rgba(21,60,53,.3);
  }
  .map-visual .desktop-region-pin:hover,
  .map-visual .desktop-region-pin:focus-visible {
    color: #fff; background: var(--strict-forest);
    box-shadow: 0 0 0 6px rgba(13,68,59,.16), 0 5px 12px rgba(21,60,53,.3); outline: none;
  }

  .region-drill { flex: 0 0 auto; margin: 6px 24px 0 0; }
  .region-drill-crumbs { display: flex; flex-wrap: wrap; align-items: center; gap: 1px; margin-bottom: 7px; }
  .region-crumb { padding: 2px 3px; border: 0; color: #54736c; background: transparent; font-size: 11px; letter-spacing: .03em; }
  .region-crumb:hover { color: var(--strict-forest); }
  .region-crumb.is-current { color: #163b34; font-weight: 600; }
  .region-crumb-sep { color: #a3b5b0; font-size: 10px; }
  .region-drill-children { display: flex; flex-wrap: wrap; align-items: center; gap: 5px; max-height: 58px; overflow-y: auto; overscroll-behavior: contain; }
  .region-drill-label { color: #7d8f8a; font-size: 10px; letter-spacing: .08em; }
  .region-chip { min-height: 23px; padding: 0 10px; border: 1px solid rgba(56,94,86,.24); border-radius: 12px; color: #2c534a; background: rgba(255,255,255,.74); font-size: 11px; white-space: nowrap; transition: background 160ms ease, border-color 160ms ease; }
  .region-chip:hover { border-color: rgba(56,94,86,.55); background: #fff; }
  .region-drill-empty { color: #7d8f8a; font-size: 11px; }

  body[data-desktop-screen="discover"] .desktop-map-panel {
    display: grid; grid-template-rows: 45px 1fr; min-height: 0; padding: 30px 40px 26px 30px;
    border-left: 1px solid rgba(56,94,86,.16); background: transparent; box-shadow: none;
  }
  body[data-desktop-screen="discover"] .map-provider-status,
  body[data-desktop-screen="discover"] .desktop-map-empty-state { display: none !important; }
  body[data-desktop-screen="discover"] .desktop-map-summary { padding: 0; align-items: start; color: #173c35; font-size: 15px; }
  body[data-desktop-screen="discover"] .desktop-map-summary span { font-size: 15px; }
  body[data-desktop-screen="discover"] .desktop-map-summary button { margin-left: auto; min-height: 28px; padding: 0 14px; border: 1px solid #9fb7af; border-radius: 15px; color: #43675f; background: transparent; font-size: 10px; }
  body[data-desktop-screen="discover"] .desktop-map-summary strong { display: none; }
  body[data-desktop-screen="discover"] .desktop-map-selection { min-height: 0; padding: 0; border: 0; background: transparent; overflow: hidden; }
  body[data-desktop-screen="discover"] .desktop-map-selection > span,
  body[data-desktop-screen="discover"] .desktop-map-selection > p,
  body[data-desktop-screen="discover"] .map-selection-heading { display: none; }
  body[data-desktop-screen="discover"] .desktop-map-selection .map-selection-list { grid-template-columns: repeat(2, minmax(0,1fr)); grid-template-rows: repeat(3, 78px); gap: 10px 14px; max-height: 254px; margin: 0; padding: 0; overflow: hidden; }
  body[data-desktop-screen="discover"] .desktop-map-selection .map-selection-item { grid-template-columns: 142px minmax(0,1fr) 34px; gap: 14px; min-height: 78px; padding: 0; border: 0; border-radius: 4px; background: rgba(255,255,255,.82); }
  body[data-desktop-screen="discover"] .desktop-map-selection .map-selection-item:nth-child(n+7) { display: none; }
  body[data-desktop-screen="discover"] .desktop-map-selection .map-selection-item img { width: 142px; height: 78px; border-radius: 4px 0 0 4px; filter: saturate(.88); }
  body[data-desktop-screen="discover"] .desktop-map-selection .map-selection-item strong { color: #1d3d37; font-size: 14px; font-weight: 600; }
  body[data-desktop-screen="discover"] .desktop-map-selection .map-selection-item small { margin-top: 7px; color: #6f817c; font-size: 11px; }
  body[data-desktop-screen="discover"] .desktop-map-selection .map-selection-item b { display: grid; place-items: center; width: 28px; height: 28px; border-radius: 50%; color: #32584f; background: #eaf1ed; font-size: 0; }
  body[data-desktop-screen="discover"] .desktop-map-selection .map-selection-item b::after { content: "›"; font-size: 18px; }
  .selection-vr-badge { margin-left: 6px; padding: 1px 5px; border-radius: 6px; color: #fff; background: var(--strict-forest); font-size: 9px; font-style: normal; letter-spacing: .04em; vertical-align: 1px; }

  body[data-desktop-screen="discover"] #latestNews {
    grid-row: 3; position: relative; display: grid; grid-template-columns: 130px minmax(0,1fr); gap: 20px;
    min-height: 198px; padding: 32px 42px 26px; background: #fffdf9;
  }
  body[data-desktop-screen="discover"] #latestNews .rail-heading { display: block; }
  body[data-desktop-screen="discover"] #latestNews .rail-heading h2 { color: #173b35; font-family: "Noto Serif SC", "Songti SC", STSong, serif; font-size: 22px; font-weight: 600; }
  body[data-desktop-screen="discover"] #latestNews .rail-heading h2::after { content: ""; display: block; width: 25px; height: 2px; margin-top: 18px; background: #b86b43; }
  body[data-desktop-screen="discover"] #latestNews .rail-heading .text-button { position: absolute; top: 36px; right: 42px; color: #394f49; }
  body[data-desktop-screen="discover"] #latestNews .recommend-note,
  body[data-desktop-screen="discover"] #latestNews .quote-card,
  body[data-desktop-screen="discover"] #latestNews .explore-meter { display: none; }
  body[data-desktop-screen="discover"] #newsList { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 30px; margin-top: 4px; padding-right: 18px; }
  body[data-desktop-screen="discover"] #newsList .rail-news-row { display: grid; grid-template-columns: minmax(120px, 46%) minmax(0,1fr); gap: 14px; align-items: center; padding: 0; border: 0; border-radius: 0; background: transparent; }
  body[data-desktop-screen="discover"] #newsList .rail-news-row:nth-child(n+4) { display: none; }
  body[data-desktop-screen="discover"] #newsList .rail-news-row img { width: 100%; height: 124px; border-radius: 0; object-fit: cover; filter: saturate(.86); }
  body[data-desktop-screen="discover"] #newsList .rail-news-row span,
  body[data-desktop-screen="discover"] #newsList .rail-news-row p { display: none; }
  body[data-desktop-screen="discover"] #newsList .rail-news-row h3 { margin: 0; color: #1d3630; font-size: 14px; font-weight: 500; line-height: 1.5; }
  body[data-desktop-screen="discover"] #newsList .rail-news-row time { margin-top: 14px; color: #9a9d9b; font-size: 10px; }

  body[data-desktop-screen="discover"] .site-footer { margin: 0; padding: 24px 42px; }

  /* 目的地 screen: same section, more room. The outline gives way to the real
     provider map there, and the drill row keeps working above it.

     Every selector below carries `#map` on purpose. `styles.css` also styles
     this screen through `body[data-desktop-screen="map"] #map …`, and an id in
     the selector beats any amount of class-level specificity — the first draft
     of this block used `body[data-desktop-screen="map"] .desktop-map-panel` and
     silently lost the cascade, so the panel kept `minmax(0,1fr) auto` and its
     45px header row stretched to 507px while the list was pushed to the bottom
     (measured 1440×900: rows resolved to `507px 183px`). Matching the id is what
     makes these declarations take effect. */
  /* The section keeps a definite height so the panel can own a scroll region.
     `styles.css` only sets `min-height` here, which leaves the grid row
     content-sized: a region with thirty 景区 — or the eight-card list on a
     narrow screen — stretched the whole section to 913px and pushed the footer
     down instead of scrolling inside the panel. */
  body[data-desktop-screen="map"] #map {
    height: calc(100svh - 150px); min-height: 620px;
  }
  body[data-desktop-screen="map"] #map .map-copy {
    position: relative; display: flex; flex-direction: column; justify-content: flex-start;
    gap: 14px; padding: 30px 0 24px 34px;
  }
  body[data-desktop-screen="map"] #map .map-copy-head h2 { margin: 0 0 5px; color: var(--strict-ink); font-size: 33px; font-weight: 600; letter-spacing: .08em; }
  body[data-desktop-screen="map"] #map .map-copy-head p { margin: 0; color: #405f59; font-size: 13px; }
  body[data-desktop-screen="map"] #map .map-copy > .dark-button { display: none; }
  body[data-desktop-screen="map"] #map .map-visual { min-height: 340px; margin-right: 34px; }
  body[data-desktop-screen="map"] #map .map-visual .inner-mongolia-map { display: none; }
  body[data-desktop-screen="map"] #map .map-visual .desktop-map-canvas { position: absolute; inset: 0; display: block; min-height: 0; }
  /* On this screen the real provider map is what the visitor aims at, and it
     draws its own dots at true coordinates (`.region-dot-marker`, created in
     `initializeLeafletTarget`). The ratio-placed pins from the 发现 outline have
     no geography to sit on here, so they have to go — and `styles.css` cannot
     turn them off for us: its `.provider-active .desktop-region-pins` is a
     *descendant* selector, but `.desktop-region-pins` is a sibling of the canvas
     that carries `.provider-active`, so it never matches. Both marker systems
     were therefore live at once and the map showed 18 dots for 9 盟市. */
  body[data-desktop-screen="map"] #map .map-visual .desktop-region-pins { display: none; }
  body[data-desktop-screen="map"] #map .region-drill { margin-right: 34px; }

  /* The panel is a header row plus a destination list that owns the rest of the
     column. Three explicit tracks rather than two: the coverage banner is the
     third child in the markup, so without a row of its own it would push the
     list into an implicit `auto` track and the `1fr` would go to the banner.
     `row-gap` stays 0 and the header centres itself in its 45px band, so a
     hidden banner collapses to a zero-height track and costs no space. */
  body[data-desktop-screen="map"] #map .desktop-map-panel {
    display: grid; grid-template-rows: 45px auto minmax(0, 1fr); row-gap: 0;
    min-height: 0; padding: 30px 40px 26px 30px;
    border-left: 1px solid rgba(56,94,86,.16); background: transparent; box-shadow: none;
  }
  body[data-desktop-screen="map"] #map .desktop-map-summary {
    grid-row: 1; align-self: center; padding: 0; align-items: center; color: #173c35; font-size: 15px;
  }
  body[data-desktop-screen="map"] #map .desktop-map-summary span { font-size: 15px; }
  body[data-desktop-screen="map"] #map .desktop-map-summary button {
    margin-left: auto; min-height: 28px; padding: 0 14px; border: 1px solid #9fb7af; border-radius: 15px;
    color: #43675f; background: transparent; font-size: 10px;
  }
  body[data-desktop-screen="map"] #map .desktop-map-summary strong { color: #43675f; font-size: 12px; font-weight: 600; }
  body[data-desktop-screen="map"] #map .desktop-map-empty-state { grid-row: 2; margin: 0 0 12px; }
  body[data-desktop-screen="map"] #map .desktop-map-selection {
    grid-row: 3; display: grid; grid-template-rows: minmax(0, 1fr);
    min-height: 0; padding: 0; border: 0; background: transparent; overflow: hidden;
  }
  body[data-desktop-screen="map"] #map .desktop-map-selection > span { color: #173c35; font-family: "Noto Serif SC", "Songti SC", STSong, serif; font-size: 19px; }
  body[data-desktop-screen="map"] #map .desktop-map-selection > p { max-width: 420px; margin: 6px 0 0; color: #5d746d; font-size: 12px; line-height: 1.7; }
  /* The header row already names the region and counts the results; repeating
     both here would read as a second, contradictory heading. */
  body[data-desktop-screen="map"] #map .desktop-map-selection .map-selection-heading { display: none; }
  body[data-desktop-screen="map"] #map .desktop-map-selection .map-selection-list {
    grid-template-columns: repeat(2, minmax(0, 1fr)); grid-auto-rows: minmax(104px, 1fr);
    align-content: stretch; gap: 12px 16px; max-height: none; margin: 0; padding: 0 4px 0 0;
  }
  body[data-desktop-screen="map"] #map .desktop-map-selection .map-selection-item {
    grid-template-columns: 38% minmax(0, 1fr) 42px; gap: 14px; min-height: 0; padding: 0;
    border: 1px solid rgba(21,60,53,.1); border-radius: 12px; overflow: hidden;
    background: rgba(255,255,255,.72);
  }
  body[data-desktop-screen="map"] #map .desktop-map-selection .map-selection-item img {
    align-self: stretch; width: 100%; height: 100%; border-radius: 0; filter: saturate(.9);
  }
  body[data-desktop-screen="map"] #map .desktop-map-selection .map-selection-item > span { min-width: 0; padding: 12px 0; }
  body[data-desktop-screen="map"] #map .desktop-map-selection .map-selection-item strong {
    display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2;
    overflow: hidden; white-space: normal; color: #1d3d37; font-size: 15px; font-weight: 600; line-height: 1.4;
  }
  body[data-desktop-screen="map"] #map .desktop-map-selection .map-selection-item small { margin-top: 7px; color: #6f817c; font-size: 11px; }
  body[data-desktop-screen="map"] #map .desktop-map-selection .map-selection-item b {
    display: grid; place-items: center; width: 28px; height: 28px; border-radius: 50%;
    color: #32584f; background: #eaf1ed; font-size: 0;
  }
  body[data-desktop-screen="map"] #map .desktop-map-selection .map-selection-item b::after { content: "›"; font-size: 18px; }
}

@media (min-width: 921px) and (max-width: 1180px) {
  body[data-desktop-screen="discover"] .map-preview { grid-template-columns: 42% 58%; }
  body[data-desktop-screen="discover"] .desktop-map-selection .map-selection-item { grid-template-columns: 94px minmax(0,1fr) 28px; }
  body[data-desktop-screen="discover"] .desktop-map-selection .map-selection-item img { width: 94px; }
  body[data-desktop-screen="discover"] #newsList { gap: 16px; }
  body[data-desktop-screen="discover"] #newsList .rail-news-row { grid-template-columns: 42% 1fr; }
  /* The 34px pin override that used to live here went with the name plates; a
     13px dot does not need to shrink on a narrower screen. */

  /* 目的地 below 1180px: the `.74fr / 1.26fr` split leaves the panel 493px at
     921px, so two card columns came out 201px wide — a 76px photo and a 55px
     text box, which clipped every 16-character 景区 name. One column gives the
     text 217px and the photo a fixed 132px, and the list simply scrolls. */
  body[data-desktop-screen="map"] #map .desktop-map-selection .map-selection-list {
    grid-template-columns: minmax(0, 1fr); grid-auto-rows: minmax(88px, 1fr); padding-right: 0;
  }
  body[data-desktop-screen="map"] #map .desktop-map-selection .map-selection-item { grid-template-columns: 132px minmax(0, 1fr) 42px; }
  body[data-desktop-screen="map"] #map .desktop-map-selection .map-selection-item img { width: 132px; }
}