.abode-scene { position: relative; width: 100%; aspect-ratio: 1672 / 941; background: #354534 url('../assets/exploration/abode-scene-v03/background.webp') center / 100% 100%; isolation: isolate; }
.abode-scene svg, .abode-scene img { width: 100%; height: 100%; image-rendering: pixelated; pointer-events: none; }
.abode-scene-point svg { display: block; transform-origin: center bottom; transition: transform 180ms ease-out; }
.abode-scene-point { position: absolute; transform: translate(-50%, -100%); padding: 0; border: 0; border-radius: 3px; outline: 1px solid #d7bd7180; outline-offset: 3px; background: transparent; cursor: pointer; color: #f2dfa5; }
.abode-scene-point:hover, .abode-scene-point:focus-visible { z-index: 2; background: transparent; outline: 2px solid #d7bd71; outline-offset: 4px; }
.abode-scene-point:hover svg, .abode-scene-point:focus-visible svg { transform: scale(1.08); }
.abode-scene-label { pointer-events: none; position: absolute; left: 50%; top: 100%; transform: translateX(-50%); padding: 5px 10px; white-space: nowrap; background: #17251ef2; border: 1px solid #978252; font: bold clamp(10px, 1.1vw, 16px) Georgia, serif; box-shadow: 0 2px 5px #0008; }
.abode-scene-point[aria-disabled="true"] .abode-scene-label { color: #c1bca9; }
html[data-fx="off"] .abode-scene-point svg, html[data-fx="reduced"] .abode-scene-point svg { transition: none; transform: none; }
@media (prefers-reduced-motion: reduce) { .abode-scene-point svg { transition: none; transform: none !important; } }