.roof-map-preview{display:block;width:100%;max-width:320px;height:auto}.roof-map-preview__streets path{fill:none;stroke:var(--sc-color-border);stroke-width:10}.roof-map-preview__buildings path{fill:none;stroke:var(--sc-color-border-strong);stroke-width:1.5}.roof-map-preview__selected{fill:color-mix(in srgb,var(--sc-color-solar) 16%,transparent);stroke:var(--sc-color-solar);stroke-width:2}.roof-map-preview__handles circle{fill:var(--sc-color-surface);stroke:var(--sc-color-solar);stroke-width:2}.roof-building-map{overflow:hidden;border:var(--sc-rule-width) solid var(--sc-color-border);border-radius:var(--sc-border-radius-card);background:linear-gradient(135deg,hsla(0,0%,100%,.42),transparent 45%),var(--sc-color-surface-sunk)}.roof-building-map__canvas{display:block;width:100%;min-height:360px;max-height:min(64dvh,680px)}.roof-building-map__building{fill:var(--sc-color-surface);stroke:var(--sc-color-text-secondary);stroke-width:1.25;vector-effect:non-scaling-stroke;cursor:pointer;transition:fill var(--sc-motion-duration-fast) var(--sc-motion-easing-standard),stroke var(--sc-motion-duration-fast) var(--sc-motion-easing-standard)}.roof-building-map__building:hover{fill:color-mix(in srgb,var(--sc-color-solar) 24%,var(--sc-color-surface));stroke:var(--sc-color-ink)}.roof-building-map__building:focus-visible{outline:none;fill:color-mix(in srgb,var(--sc-color-solar) 34%,var(--sc-color-surface));stroke:var(--sc-color-focus-ring);stroke-width:4}.roof-building-map__building--selected{fill:var(--sc-color-solar);stroke:var(--sc-color-ink);stroke-width:3}.roof-building-map__footer{display:flex;gap:var(--sc-spacing-12);align-items:center;justify-content:space-between;flex-wrap:wrap;padding:10px var(--sc-spacing-16);border-top:var(--sc-rule-width) solid var(--sc-color-border);color:var(--sc-color-text-secondary);font-family:var(--sc-font-family-mono);font-size:var(--sc-font-size-caption);line-height:1.4}.roof-building-map__attribution{color:inherit;text-underline-offset:3px}.roof-building-map__attribution:focus-visible{outline:2px solid var(--sc-color-focus-ring);outline-offset:2px}@media(max-width:480px){.roof-building-map__canvas{min-height:300px}}