.map3d-map { position:absolute; z-index:3; left:24px; bottom:146px; min-height:52px; padding:12px 18px; border:2px solid #d3b279; border-radius:16px; background:#fff8e9; color:#6b3a61; font:600 14px system-ui; }
.map3d-story { position:absolute; z-index:20; top:24%; left:50%; transform:translateX(-50%); width:min(580px,calc(100% - 28px)); max-height:68%; overflow:auto; padding:24px; border:2px solid #cfb18c; border-radius:22px; background:#fff9edf7; color:#6c3c61; font:17px/1.5 system-ui; box-sizing:border-box; }
.map3d-story[hidden] { display:none; }
.map3d-story h3 { margin:0 0 12px; font:bold 27px Georgia,serif; }
.map3d-story p { margin:0 0 12px; }
.map3d-story small { display:block; font-size:14px; }
.map3d-story button { min-height:48px; padding:10px 16px; margin:14px 8px 0 0; border:2px solid #d0ab77; border-radius:14px; background:#fffdf5; color:#6c3c61; font:600 15px system-ui; }
.map3d-story button:focus-visible, .map3d-map:focus-visible { outline:3px solid #a879b5; outline-offset:3px; }
.map3d-reading .mini3d-controls { visibility:hidden; }
@media(max-width:600px) { .map3d-map { left:12px; bottom:136px; min-height:48px; padding:8px 12px; } .map3d-story { top:20%; max-height:70%; padding:18px; font-size:15px; } .map3d-story h3 { font-size:24px; } .map3d-story button { width:100%; } }