.map-demo-wrap{width:100%;max-width:1280px;font-family:var(--font-jakarta), sans-serif;margin:0 auto;padding:0 40px}.map-demo-stage{position:relative}.map-demo-content{align-items:flex-start;gap:24px;display:flex}.map-demo-map{border-radius:24px;flex:1;min-width:0;height:clamp(340px,47svh,480px);position:relative;overflow:hidden}.map-demo-panel{flex-shrink:0}.map-demo-site{z-index:10;position:absolute;top:12px;left:12px}.map-demo-content button,.map-demo-content input,.map-demo-content [data-map-view]{cursor:default}.map-demo-content{pointer-events:none;-webkit-user-select:none;user-select:none}.map-demo-cursors{z-index:20;pointer-events:none;position:absolute;inset:0}.map-demo-controls{color:var(--color-muted);justify-content:space-between;align-items:center;gap:18px;padding-top:15px;display:flex}.map-demo-caption{flex-wrap:wrap;align-items:center;gap:6px 12px;font-size:10px;line-height:1.6;display:flex}.map-demo-caption>strong{color:var(--color-navy);align-items:center;gap:7px;font-size:10px;font-weight:600;display:inline-flex}.map-demo-caption>strong:before{content:"";background:var(--color-green-ink);border-radius:50%;width:5px;height:5px}.map-demo-controls button{border:1px solid var(--color-hairline);min-height:40px;color:var(--color-navy);background:var(--color-white);font:inherit;cursor:pointer;border-radius:8px;flex-shrink:0;justify-content:center;align-items:center;gap:8px;padding:0 12px;font-size:10px;transition:background .15s,transform .15s;display:inline-flex}.map-demo-controls button:hover{background:var(--color-soft-2)}.map-demo-controls button:active{transform:scale(.96)}.map-demo-controls button:focus-visible{outline:2px solid var(--color-green-ink);outline-offset:3px}.map-demo-controls button svg{fill:currentColor;width:12px;height:12px}@media (max-width:1023px){.map-demo-wrap{padding-inline:24px}.map-demo-content{flex-direction:column;align-items:stretch;gap:18px}.map-demo-map{flex:none;height:360px}.map-demo-panel>div{width:100%}.map-demo-cursor-label{font-size:10px}}@media (max-width:480px){.map-demo-controls{align-items:flex-start;gap:12px}.map-demo-caption{max-width:190px;font-size:9px}.map-demo-caption>strong{font-size:9px}.map-demo-controls button{max-width:135px;padding-inline:9px;font-size:9px}}@media (prefers-reduced-motion:reduce){.map-demo-wrap *{transition:none!important;animation:none!important}}
