body.map-viewing-page { --map-reading-height: max(80svh, 420px); overflow-y: auto; overflow-x: hidden; height: auto; margin: 0; background: #f1e9d6; color: #2a241c; }
.map-viewing-page #root { position: relative; transform: translateZ(0); isolation: isolate; width: 100%; height: var(--map-reading-height); overflow: hidden; }
.map-viewing-page #root .radar-card .map-breadcrumb { padding-right: 80px; }
.map-viewing-page #root .radar-info-panel { max-height: min(640px, calc(var(--map-reading-height) - 140px)); }
.map-viewing-page #root .night-sheet { max-height: calc(var(--map-reading-height) - 110px); }
.map-viewing-page #root .night-info-panel { max-height: min(450px, calc(var(--map-reading-height) - 120px)); }
.map-viewing-nav { display: none; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px 20px; padding: 12px 20px; background: #faf5ea; color: #2a241c; font: 600 15px/1.5 system-ui,sans-serif; }
.map-viewing-page .map-viewing-nav { display: flex; }
.map-viewing-nav a, .map-viewing-content a { color: #7d271c; text-decoration: underline; text-underline-offset: 3px; }
.map-viewing-content { max-width: 1100px; margin: 0 auto; padding: 32px 28px 64px; color: #2a241c; background: #f1e9d6; font: 16px/1.85 system-ui,-apple-system,sans-serif; overflow-wrap: anywhere; }
.map-viewing-content nav { font-size: 13px; }
.map-viewing-content h1 { margin: 24px 0; font-size: clamp(24px,4vw,36px); line-height: 1.5; }
.map-viewing-content .map-title-purpose { display: inline-block; max-width: 100%; white-space: normal; word-break: auto-phrase; overflow-wrap: normal; text-wrap: balance; }
.map-viewing-content h2 { font-size: 22px; line-height: 1.6; margin: 32px 0 16px; }
.map-viewing-content h3 { font-size: 19px; margin: 0 0 8px; }
.map-spots-answer { font-size: 19px; font-weight: 650; }
.spot-access-note, .spot-organizer-note { padding: 16px 20px; border: 1px solid #a99d84; background: #faf5ea; }
.viewing-spots { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 16px; list-style: none; padding: 0; }
.viewing-spots > li { padding: 20px; border: 1px solid #bcb098; background: #faf5ea; }
.viewing-spots p { margin: 8px 0; }
.viewing-spots .spot-meta { font-size: 14px; color: #574b3b; }
.spot-sector-table { max-width: 100%; overflow-x: auto; }
.spot-sector-table table { width: 100%; border-collapse: collapse; font-size: 14px; }
.spot-sector-table th, .spot-sector-table td { text-align: left; padding: 10px 12px; border-bottom: 1px solid #c8bca2; white-space: nowrap; }
.map-viewing-content a:focus-visible, .map-viewing-nav a:focus-visible { outline: 2px solid currentColor; outline-offset: 3px; }
@media(max-width: 600px) {
 .map-viewing-content { padding: 24px 18px 48px; font-size: 15px; }
 .map-viewing-nav { padding: 10px 16px; font-size: 14px; }
 .viewing-spots { grid-template-columns: 1fr; }
 .viewing-spots > li { padding: 16px; }
 .map-viewing-content h2 { font-size: 20px; }
 .spot-access-note, .spot-organizer-note { padding: 12px 14px; }
}
@media(max-width: 767px) {
 .map-viewing-page #root .radar-sheet.is-expanded { height: calc(var(--map-reading-height) - 162px); }
 .map-viewing-page #root .map-sheet { max-height: calc(var(--map-reading-height) - var(--header-h) - var(--safe-top) - 8px); }
 .map-viewing-page #root .map-sheet[data-snap="half"] { max-height: calc(var(--map-reading-height) * .4); }
}

.map-viewing-content .crumbs ol { display:flex; flex-wrap:wrap; gap:0 8px; padding:0; margin:0; list-style:none; }
.map-viewing-content .crumbs li { min-width:0; overflow-wrap:anywhere; }
.map-viewing-content .crumbs li + li::before { content:""; display:inline-block; width:6px; height:6px; margin:0 8px 1px 0; border-top:1px solid currentColor; border-right:1px solid currentColor; transform:rotate(45deg); }