.area-map{background:var(--paper);color:var(--forest);padding:0}
.area-map__intro{display:grid;grid-template-columns:1.4fr 1fr;gap:5vw;align-items:center;padding:clamp(32px,4.5vw,68px) 4.6vw clamp(28px,3vw,46px)}
.area-map__intro h2{font:400 clamp(42px,5.35vw,90px)/.98 Veluwe,Impact,sans-serif;letter-spacing:-.02em;color:var(--blue);margin:0;max-width:16ch;text-wrap:balance}
.area-map__intro>p{font:clamp(16px,1.25vw,19px)/1.65 system-ui,sans-serif;margin:0;max-width:37ch}
.area-map__stage{position:relative;height:100svh;min-height:520px;width:100%;isolation:isolate;background:var(--forest);overflow:hidden}
.area-map__stage:fullscreen{height:100dvh;min-height:0}
/* Embedded maps never consume the page's vertical wheel/touch scroll. */
.area-map__viewport{position:absolute;inset:0;overflow:hidden;scrollbar-width:none;cursor:grab;overscroll-behavior:auto;touch-action:pan-y pinch-zoom}
.area-map__stage:fullscreen .area-map__viewport{overflow:auto;overscroll-behavior:contain;touch-action:pan-x pan-y pinch-zoom}
/* Keep the map's guide actions clear of the footer's decorative overlap. */
body[data-cabin] .forest-footer{margin-top:0}
.area-map__viewport::-webkit-scrollbar{display:none}
.area-map__viewport.is-dragging{cursor:grabbing;user-select:none}
.area-map__viewport:focus-visible{outline:3px solid var(--paper);outline-offset:-6px}
.area-map__canvas{position:relative;width:100%;min-width:100%;aspect-ratio:16/9;transform-origin:0 0;isolation:isolate;user-select:none}
.area-map__art{width:100%;height:100%;max-width:none;pointer-events:none;user-select:none}
.map-marker{position:absolute;left:var(--x);top:var(--y);z-index:1;transform:translate(-50%,-100%);display:flex;flex-direction:column;align-items:center;width:72px;min-height:84px;padding:0 3px;border:0;background:none;color:var(--forest);filter:drop-shadow(0 3px 3px #123c3238);-webkit-tap-highlight-color:transparent}
.map-marker__badge{display:grid;place-items:center;width:64px;height:70px;padding:6px;background:var(--paper);border:3px solid var(--paper);border-radius:48% 48% 4px 4px;transition:border-color .18s,transform .18s}
.map-marker__badge img{width:100%;height:100%;object-fit:contain;pointer-events:none}
.map-marker--house .map-marker__badge img{width:115%;max-width:none;transform:translateY(3px)}
.map-marker--nature{width:66px;min-height:74px}
.map-marker--nature .map-marker__badge{width:58px;height:58px;border-radius:44% 56% 49% 51%/52% 45% 55% 48%;padding:5px}
.map-marker__dot{width:14px;height:14px;flex:none;margin-top:3px;background:var(--orange);border:3px solid var(--paper);border-radius:50%}
.map-marker__label{position:absolute;left:50%;bottom:calc(100% + 7px);transform:translate(-50%,4px);padding:7px 11px;background:var(--paper);color:var(--forest);white-space:nowrap;font:13px/1.35 Georgia,serif;border-radius:3px;opacity:0;pointer-events:none;transition:opacity .15s,transform .15s}
.map-marker:hover,.map-marker:focus-visible{z-index:2}
.map-marker:hover .map-marker__badge,.map-marker:focus-visible .map-marker__badge{transform:translateY(-3px)}
.map-marker:hover .map-marker__label,.map-marker:focus-visible .map-marker__label{opacity:1;transform:translate(-50%,0)}
.map-marker[aria-expanded=true] .map-marker__badge{border-color:var(--orange)}
.map-marker[aria-expanded=true] .map-marker__label{opacity:0}
.map-marker:focus-visible{outline:none}.map-marker:focus-visible .map-marker__badge{outline:2px solid var(--blue);outline-offset:4px}
.area-map__hint{position:absolute;left:24px;top:24px;z-index:2;margin:0;padding:10px 14px;background:#f3e6c8ed;border-radius:3px;font:13px/1.35 Georgia,serif;pointer-events:none;box-shadow:0 2px 8px #123c3218}
.area-map__picker{display:none}
.area-map__tools{position:absolute;z-index:3;left:24px;bottom:24px;display:flex;gap:8px;align-items:center}
.area-map__tools button{display:grid;place-items:center;width:44px;height:44px;padding:10px;border:0;border-radius:50%;background:var(--paper);color:var(--forest);font:25px/1 Arial,sans-serif;box-shadow:0 2px 8px #123c3228;transition:background .15s,color .15s}
.area-map__tools button:hover:not(:disabled){background:var(--orange);color:var(--paper)}.area-map__tools button:disabled{opacity:.55;cursor:default}.area-map__tools button[hidden]{display:none}
.area-map__tools svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
.area-map__card{position:absolute;z-index:4;right:20px;bottom:18px;width:clamp(260px,22vw,320px);aspect-ratio:4/5;container-type:inline-size;color:var(--forest);isolation:isolate;filter:drop-shadow(0 5px 12px #123c3230);animation:map-note-in .25s ease-out}
.area-map__card[hidden]{display:none}.area-map__card:focus{outline:none}.area-map__card:focus-visible{outline:2px solid var(--blue);outline-offset:-10px}
.area-map__paper{position:absolute;inset:0;width:100%;height:100%;max-width:none;z-index:-1;pointer-events:none}
.area-map__close{position:absolute;right:7%;top:6%;display:grid;place-items:center;width:36px;height:36px;border:0;padding:0;background:none;color:var(--forest);font:28px/1 Arial,sans-serif;z-index:2}
.area-map__card-art{position:absolute;left:11%;top:12%;width:78%;height:30%;object-fit:contain;pointer-events:none}
.area-map__card-overline{position:absolute;left:12%;top:43%;width:75%;margin:0;font:600 9px/1.3 Arial,sans-serif;letter-spacing:1.1px;color:#715039}
.area-map__card h3{position:absolute;left:12%;top:47%;width:76%;margin:0;font:400 clamp(26px,10.2cqw,34px)/.98 Veluwe,Impact,sans-serif;letter-spacing:-.02em;color:var(--blue);text-wrap:balance}
.area-map__card-copy{position:absolute;left:12%;top:64%;width:75%;margin:0;font:13px/1.5 Georgia,serif;text-wrap:pretty}
.area-map__card-action{position:absolute;left:12%;top:79%;width:76%;height:10%;border:0;padding:0 12px;display:flex;align-items:center;justify-content:center;gap:10px;background:none;color:#fff8e6;text-decoration:none;font:15px/1.2 Georgia,serif;text-align:center}
.area-map__card-action>span:last-child{font:24px/1 Georgia,serif;transition:transform .18s}.area-map__card-action:hover>span:last-child{transform:translateX(3px)}.area-map__card-action[hidden]{display:none}
.area-map__sr{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}
@keyframes map-note-in{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}
@media(max-width:760px){.area-map__intro{display:block;padding:28px 22px 32px}.area-map__intro h2{font-size:clamp(37px,8.5vw,58px);max-width:15ch;margin-bottom:22px}.area-map__intro>p{font-size:16px;line-height:1.65;max-width:36ch}.area-map__stage{min-height:580px}.area-map__hint{display:none}.area-map__picker{display:block;position:absolute;z-index:3;left:16px;top:88px;max-width:calc(100% - 32px);padding:10px 32px 10px 12px;border:0;border-radius:3px;background:var(--paper);color:var(--forest);font:14px/1.4 Georgia,serif;box-shadow:0 2px 8px #123c3225}.area-map__stage:fullscreen .area-map__picker{top:16px}.map-marker{width:65px;min-height:77px}.map-marker__badge{width:58px;height:64px;padding:5px}.map-marker--nature{width:60px;min-height:69px}.map-marker--nature .map-marker__badge{width:53px;height:53px}.map-marker__label{font-size:12px}.area-map__card{right:10px;bottom:10px;width:min(300px,calc(100% - 20px));max-height:calc(100% - 150px)}.area-map__card h3{font-size:30px}.area-map__card-copy{font-size:13px}.area-map__tools{left:16px;bottom:16px;gap:6px}.area-map__tools button{width:40px;height:40px;padding:9px}.area-map__stage.has-card .area-map__tools{bottom:calc(min(375px,125vw - 25px) + 20px)} }
@media(max-height:600px) and (min-width:761px){.area-map__card{width:260px}.area-map__card h3{font-size:27px}.area-map__card-copy{font-size:12px}.area-map__stage{min-height:100svh}}
@media(prefers-reduced-motion:reduce){.area-map__card{animation:none}.map-marker__badge,.map-marker__label,.area-map__tools button,.area-map__card-action>span{transition:none}}

/* The cropped map, cabin art and markers share one 16:9 coordinate space. */
.area-map__scene{position:absolute;inset:0;z-index:0;pointer-events:none}
.area-map__poster,.area-map__video,.area-map__houses{position:absolute;inset:0;display:block;width:100%;height:100%;max-width:none;pointer-events:none;user-select:none}
.area-map__poster,.area-map__video{object-fit:fill}
.area-map__video{opacity:0}
.area-map__video[data-ready="true"]{opacity:1}
[data-theme="night"] .area-map__scene{filter:brightness(.62) saturate(.8)}

/* Field guide: the same quiet, paper-edged POIs used by the pond. */
.area-map--guide .area-map__stage{--map-guide-width:clamp(300px,30vw,440px);--map-paper:var(--paper)}
.area-map--guide [hidden]{display:none!important}
.area-map--guide .has-card .area-map__viewport{right:var(--map-guide-width)}
.area-map--guide .map-marker{width:72px;min-height:84px}
.area-map--guide .map-marker--nature{width:66px;min-height:74px}
.area-map--guide .has-card .map-marker{visibility:hidden;pointer-events:none}
.area-map--guide .area-map__card{inset:0 0 auto auto;z-index:5;display:flex;flex-direction:column;width:var(--map-guide-width);height:100%;max-height:none;aspect-ratio:auto;padding:36px 32px 22px;background:var(--map-paper);filter:none;animation:none;overflow:visible;container-type:normal}
.area-map--guide .area-map__paper{display:none}
.map-guide__edge{position:absolute;right:calc(100% - 1px);top:0;width:30px;height:100%;fill:var(--map-paper);pointer-events:none}
.map-guide__top-edge{display:none}
.area-map--guide .area-map__close{right:10px;top:10px;width:32px;height:32px}
.area-map--guide .area-map__card-overline{position:static;order:0;width:auto;margin:0 20px 20px 0;font:400 clamp(46px,5vw,64px)/.9 Veluwe,Impact,sans-serif;letter-spacing:-.02em;color:var(--blue)}
.area-map--guide .area-map__card-art{position:static;order:1;width:100%;height:min(28svh,250px);object-fit:cover;border-radius:14px}
.area-map--guide .area-map__card[data-place-type="house"] .area-map__card-art{object-fit:contain}
.area-map--guide .area-map__card h3{position:static;order:2;width:auto;margin:20px 0 12px;font:400 clamp(32px,3.6vw,48px)/.98 Veluwe,Impact,sans-serif;text-wrap:balance}
.area-map--guide .area-map__card-copy{position:static;order:3;width:auto;margin:0 0 18px;font:16px/1.5 Georgia,serif}
.area-map--guide .area-map__card-action{position:static;order:4;align-self:flex-start;width:auto;height:auto;padding:0;margin:0 0 18px;justify-content:flex-start;color:var(--orange);font:17px/1.3 Georgia,serif}
.area-map--guide .area-map__look{display:none}
.map-guide__nav{order:5;display:flex;justify-content:space-between;margin-top:auto;border-top:1px solid #123c322b;padding-top:10px}
.map-guide__nav button{width:44px;height:36px;padding:0;border:0;background:none;color:var(--forest);font:30px/1 Georgia,serif}
.map-guide__nav button:hover{color:var(--orange)}
.map-guide__nav button:focus-visible,.map-guide__back:focus-visible{outline:2px solid var(--blue);outline-offset:3px}
.area-map__focus{position:absolute;inset:0 var(--map-guide-width) 0 0;z-index:4;pointer-events:none;opacity:0}
.area-map--guide .has-card .area-map__focus{opacity:1;background:#0b292b08;backdrop-filter:blur(2px);-webkit-backdrop-filter:blur(2px);mask-image:radial-gradient(circle at var(--map-focus-x) var(--map-focus-y),transparent 0,transparent calc(var(--map-focus-radius)*.7),#000 calc(var(--map-focus-radius)*1.65));-webkit-mask-image:radial-gradient(circle at var(--map-focus-x) var(--map-focus-y),transparent 0,transparent calc(var(--map-focus-radius)*.7),#000 calc(var(--map-focus-radius)*1.65))}
.area-map--guide .area-map__tools{z-index:6}
.area-map--guide .has-card .area-map__hint{visibility:hidden}
.map-guide__back{position:absolute;left:24px;top:24px;z-index:6;border:0;border-radius:3px;padding:11px 14px;background:var(--paper);color:var(--forest);font:14px/1.3 Georgia,serif;box-shadow:0 2px 8px #123c3218}
.is-area-map-focused .woodland-controls,.is-area-map-focused .woodland-home{opacity:0;visibility:hidden;pointer-events:none}
[data-theme="night"] .area-map--guide .area-map__stage{--map-paper:#e9dcbc}
@media(max-width:760px){
 .area-map--guide .area-map__stage{--map-guide-height:min(46svh,370px)}
 .area-map--guide .has-card .area-map__viewport{right:0;bottom:var(--map-guide-height)}
 .area-map--guide .area-map__card{inset:auto 0 0;width:100%;height:var(--map-guide-height);padding:18px 22px 12px;display:grid;grid-template-columns:38% 1fr;grid-template-rows:auto auto 1fr auto auto;gap:6px 16px}
 .map-guide__edge{display:none}.map-guide__top-edge{display:block;position:absolute;left:0;bottom:calc(100% - 1px);width:100%;height:16px;fill:var(--map-paper)}
 .area-map--guide .area-map__card-overline{grid-column:1/3;grid-row:1;font-size:36px;margin:0 30px 8px 0}
 .area-map--guide .area-map__card-art{grid-column:1;grid-row:2/5;width:100%;height:100%;min-height:0;max-height:165px;border-radius:10px}
 .area-map--guide .area-map__card h3{grid-column:2;grid-row:2;margin:0 0 4px;font-size:28px}
 .area-map--guide .area-map__card-copy{grid-column:2;grid-row:3;margin:0;font-size:13px;line-height:1.4}
 .area-map--guide .area-map__card-action{grid-column:2;grid-row:4;margin:2px 0;font-size:14px}
 .map-guide__nav{grid-column:1/3;grid-row:5;margin-top:6px;padding-top:4px}
 .map-guide__nav button{height:30px}
 .area-map--guide .has-card .area-map__focus{right:0;bottom:var(--map-guide-height)}
 .area-map--guide .has-card .area-map__picker{display:none}
 .area-map--guide .has-card .area-map__tools{bottom:calc(var(--map-guide-height) + 16px)}
 .map-guide__back{left:16px;top:16px}
}
@media(max-height:600px) and (min-width:761px){.area-map--guide .area-map__card{padding:24px 28px 16px}.area-map--guide .area-map__card-overline{font-size:44px;margin-bottom:12px}.area-map--guide .area-map__card h3{font-size:32px;margin:12px 0 8px}.area-map--guide .area-map__card-copy{font-size:14px;margin-bottom:12px}}

/* Longer place notes scroll within the guide, keeping its controls reachable. */
.map-guide__content{order:1;flex:1;min-height:0;overflow:auto;overscroll-behavior:contain;scrollbar-width:thin;padding-right:4px}
.map-guide__paragraph{display:block}.map-guide__paragraph+.map-guide__paragraph{margin-top:12px}
.area-map--guide .map-guide__nav{flex-shrink:0;margin-top:12px}
.area-map--guide .area-map__card-art{height:min(24svh,220px)}
@media(max-width:760px){.map-guide__content{display:contents}.area-map--guide .area-map__card{grid-template-rows:auto auto minmax(0,1fr) auto auto}.area-map--guide .area-map__card-copy{min-height:0;overflow:auto;overscroll-behavior:contain;scrollbar-width:thin}.area-map--guide .area-map__card-art{height:100%}.area-map--guide .map-guide__nav{margin-top:6px}}

/* Read within a guide, then let scrolling continue into the page at its edges. */
.area-map__stage:not(:fullscreen) :is(.map-guide__content,.area-map__card-copy){overscroll-behavior:auto}
