@layer components{.map-canvas{background:var(--map-scene);border:1px solid var(--line);border-radius:var(--radius-lg);position:relative;overflow:hidden;container:map-canvas/inline-size}.map-scene{--map-u:calc(var(--map-vbw,1600) / 1200);--map-halo:color-mix(in oklch, var(--focus) 28%, transparent);width:100%;height:auto;max-height:80svh;color:var(--map-label);font-family:var(--font-body);user-select:none;-webkit-tap-highlight-color:transparent;display:block}@container map-canvas (width<=479px){.map-scene{--map-u:calc(var(--map-vbw,1600) / 380)}}@container map-canvas (width>=480px) and (width<=799px){.map-scene{--map-u:calc(var(--map-vbw,1600) / 640)}}@container map-canvas (width>=800px) and (width<=1099px){.map-scene{--map-u:calc(var(--map-vbw,1600) / 940)}}@container map-canvas (width>=1100px){.map-scene{--map-u:calc(var(--map-vbw,1600) / 1240)}}.map-scene[data-scene-rev]{visibility:hidden}.map-scene-fallback{object-fit:contain;pointer-events:none;width:100%;height:100%;display:block;position:absolute;inset:0}.map-bg{fill:var(--map-scene)}.map-grid--minor{stroke:var(--line);stroke-width:1px}.map-grid--major{stroke:var(--line-strong);stroke-width:1.5px;opacity:.6}.map-ln{fill:none;vector-effect:non-scaling-stroke;stroke-linecap:butt;stroke-linejoin:round}.map-ln--ae{stroke:var(--map-ae);stroke-width:calc(3px * var(--map-stroke-scale))}.map-ln--ae-cable{stroke:var(--map-ae);stroke-width:calc(2px * var(--map-stroke-scale))}.map-ln--strand{stroke:var(--map-steel);stroke-width:calc(2px * var(--map-stroke-scale))}.map-ln--ug{stroke:var(--map-ug);stroke-width:calc(3px * var(--map-stroke-scale));stroke-dasharray:8 5}.map-ln--ug-planned{stroke:var(--ink-2);stroke-width:calc(1.5px * var(--map-stroke-scale));stroke-dasharray:14 6}.map-ln--drop-ae{stroke:var(--map-drop-ae);stroke-width:calc(2px * var(--map-stroke-scale));stroke-dasharray:2 3}.map-ln--drop-ug{stroke:var(--map-drop-ug);stroke-width:calc(2px * var(--map-stroke-scale));stroke-dasharray:2 3}.map-ln--power{stroke:var(--map-power);stroke-width:calc(1.5px * var(--map-stroke-scale))}.map-ln--neutral{stroke:var(--map-neutral);stroke-width:calc(1.25px * var(--map-stroke-scale))}.map-ln--steel{stroke:var(--map-steel);stroke-width:calc(1.5px * var(--map-stroke-scale))}.map-ln--steel-heavy{stroke:var(--map-steel);stroke-width:calc(2.5px * var(--map-stroke-scale))}:is(.map-ln--util-water,.map-ln--util-gas,.map-ln--util-sewer,.map-ln--util-electric,.map-ln--util-comm){stroke-width:calc(1.5px * var(--map-stroke-scale));stroke-dasharray:10 4 2 4}.map-ln--util-water{stroke:var(--util-water)}.map-ln--util-gas{stroke:var(--util-gas)}.map-ln--util-sewer{stroke:var(--util-sewer)}.map-ln--util-electric{stroke:var(--util-electric)}.map-ln--util-comm{stroke:var(--util-comm)}:is(.map-ln--paint-orange,.map-ln--paint-red,.map-ln--paint-yellow,.map-ln--paint-blue,.map-ln--paint-green,.map-ln--paint-purple,.map-ln--paint-pink,.map-ln--paint-white){stroke-width:calc(4px * var(--map-stroke-scale));stroke-dasharray:6 6}.map-ln--paint-outline{stroke:var(--map-label);stroke-width:calc(6.5px * var(--map-stroke-scale));stroke-linecap:square;stroke-dasharray:calc(6px - 4px * var(--map-stroke-scale)) calc(6px + 4px * var(--map-stroke-scale));stroke-dashoffset:calc(12px - 2px * var(--map-stroke-scale))}.map-ln--paint-orange{stroke:var(--paint-orange)}.map-ln--paint-red{stroke:var(--paint-red)}.map-ln--paint-yellow{stroke:var(--paint-yellow)}.map-ln--paint-blue{stroke:var(--paint-blue)}.map-ln--paint-green{stroke:var(--paint-green)}.map-ln--paint-purple{stroke:var(--paint-purple)}.map-ln--paint-pink{stroke:var(--paint-pink)}.map-ln--paint-white{stroke:var(--paint-white)}.map-ln--outline{stroke:var(--map-label);stroke-width:calc(1.25px * var(--map-stroke-scale))}.map-ln--grade{stroke:var(--map-label);stroke-width:calc(2px * var(--map-stroke-scale))}.map-ln--dim{stroke:var(--map-label);stroke-width:calc(1px * var(--map-stroke-scale))}.map-ln--dim-ext{stroke:var(--map-label);stroke-width:calc(.75px * var(--map-stroke-scale));stroke-dasharray:3 3}.map-ln--leader{stroke:var(--map-label);stroke-width:calc(1px * var(--map-stroke-scale))}.map-ol{stroke:var(--map-label);stroke-width:calc(1.25px * var(--map-stroke-scale));stroke-linejoin:round;vector-effect:non-scaling-stroke}.map-ol--steel{stroke:var(--map-steel)}.map-ol--splice{stroke:var(--map-splice)}.map-ol--ug{stroke:var(--map-ug);stroke-width:calc(2px * var(--map-stroke-scale))}.map-fill--wood{fill:var(--map-wood)}.map-fill--steel{fill:var(--map-steel)}.map-fill--guy-guard{fill:var(--map-guy-guard);stroke:var(--map-guy-guard-outline);stroke-width:calc(1px * var(--map-stroke-scale));vector-effect:non-scaling-stroke}.map-fill--splice{fill:var(--map-splice)}.map-fill--scene{fill:var(--map-scene)}.map-fill--ae{fill:var(--map-ae)}.map-fill--ug{fill:var(--map-ug)}.map-fill--power{fill:var(--map-power)}.map-fill--ink{fill:var(--map-label)}.map-band--power{fill:color-mix(in oklch, var(--map-power) 12%, transparent)}.map-band--zone{fill:color-mix(in oklch, var(--map-guy-guard) 22%, transparent)}.map-band--ae{fill:color-mix(in oklch, var(--map-ae) 10%, transparent)}.map-band--locates{fill:color-mix(in oklch, var(--paint-orange) 16%, transparent)}.map-pat--soil{color:var(--soil)}.map-pat-ink--soil{stroke:var(--soil-hatch)}.map-pat--asphalt{color:var(--asphalt)}.map-pat-ink--asphalt,.map-pat--concrete{color:var(--concrete)}.map-pat-ink--concrete{stroke:var(--line-strong)}.map-pat-ink--concrete-dot{color:var(--line-strong)}.map-pat-ink--gravel{color:var(--concrete);stroke:var(--line-strong)}.map-material{stroke:none}.map-splice{fill:var(--map-splice);stroke:var(--map-scene);stroke-width:calc(1.5px * var(--map-stroke-scale));vector-effect:non-scaling-stroke}.map-splice__code{fill:var(--map-scene);font-family:var(--font-mono);font-size:calc(11px * var(--map-u));font-weight:600}.map-splice--screen{transform:scale(var(--map-u))}.map-splice--screen .map-splice__code{font-size:11px}.map-section{fill:var(--map-scene);stroke-width:calc(2px * var(--map-stroke-scale));vector-effect:non-scaling-stroke}.map-section--ug{stroke:var(--map-ug)}.map-section--plug{fill:var(--map-ug)}.map-section--water{stroke:var(--util-water)}.map-section--gas{stroke:var(--util-gas)}.map-section--sewer{stroke:var(--util-sewer)}.map-section--electric{stroke:var(--util-electric)}.map-section--comm{stroke:var(--util-comm)}.map-code{fill:var(--map-label);font-family:var(--font-mono);font-size:calc(11px * var(--map-u));paint-order:stroke;stroke:var(--map-scene);stroke-width:calc(3px * var(--map-u));stroke-linejoin:round;font-weight:600}.map-label{fill:var(--map-label);font-size:calc(12px * var(--map-u));paint-order:stroke;stroke:var(--map-scene);stroke-width:calc(3px * var(--map-u));stroke-linejoin:round;font-weight:600}.map-label--small{font-size:calc(11px * var(--map-u));font-weight:500}.map-label--mono{font-family:var(--font-mono);font-weight:500}.map-note{fill:var(--ink-2);font-size:calc(11px * var(--map-u));font-style:italic}.map-leader__dot{fill:var(--map-label);r:calc(2.5px * var(--map-u))}.map-keynote{display:none}.map-keynote__scale{transform:scale(var(--map-u))}.map-keynote__hex{fill:var(--accent);stroke:var(--map-scene);stroke-width:1.5px}.map-keynote__n{fill:var(--on-accent);font-family:var(--font-mono);font-variant-numeric:tabular-nums;font-size:12px;font-weight:600}.map-dim-label{fill:var(--map-label);font-family:var(--font-mono);font-size:calc(11px * var(--map-u));paint-order:stroke;stroke:var(--map-scene);stroke-width:calc(3px * var(--map-u));stroke-linejoin:round;font-weight:500}.map-arrowhead{fill:var(--map-label)}.map-scene[data-keynotes=on] .map-keynote{display:inline}.map-scene[data-keynotes=on] .map-label--long{display:none}@container map-canvas (width<=719px){.map-scene[data-keynotes=auto] .map-keynote{display:inline}.map-scene[data-keynotes=auto] .map-label--long{display:none}}.map-keyonly{display:none}.map-scene[data-keynotes=on] .map-keyonly{display:inline}@container map-canvas (width<=719px){.map-scene[data-keynotes=auto] .map-keyonly{display:inline}}.map-scene[data-labels=off] :is(.map-label,.map-keynote,.map-leader,.map-dim-label,.map-note){display:none}.map-hotspot{cursor:pointer;outline:none}.map-hit,.map-halo{vector-effect:non-scaling-stroke;transition:stroke var(--dur-1) var(--ease-standard), fill var(--dur-1) var(--ease-standard)}.map-hit--line{pointer-events:stroke;stroke:#0000;stroke-width:28px;stroke-linecap:round;stroke-linejoin:round}.map-halo{pointer-events:none;fill:none;stroke:#0000;stroke-width:18px;stroke-linecap:round;stroke-linejoin:round}.map-hit--area{pointer-events:all;fill:#0000;stroke:#0000;stroke-width:2px}.map-hotspot[data-highlighted]>.map-halo{stroke:var(--map-halo);stroke-width:18px}.map-hotspot[data-highlighted]>.map-hit--area{fill:var(--map-halo);stroke:var(--focus)}.map-focus-core{pointer-events:none;fill:none;stroke:#0000;stroke-width:0;stroke-linecap:round;stroke-linejoin:round;vector-effect:non-scaling-stroke}.map-hotspot:focus-visible>.map-halo{stroke:var(--focus);stroke-width:24px}.map-hotspot:focus-visible>.map-focus-core{stroke:color-mix(in oklch, var(--focus) 16%, var(--map-scene));stroke-width:calc(24px - 4 * var(--focus-width,2px))}.map-focus{pointer-events:none;display:none}.map-hotspot:focus-visible>.map-focus{display:inline}.map-focus :is(rect,path){fill:none;vector-effect:non-scaling-stroke;stroke-linejoin:round}.map-focus__case :is(rect,path){stroke:var(--map-scene);stroke-width:calc(var(--focus-width,2px) + 5px)}.map-focus__line :is(rect,path){stroke:var(--focus);stroke-width:calc(var(--focus-width,2px) + 1px);stroke-dasharray:6 3}@media (hover:hover){.map-hotspot:hover>.map-hit--area{stroke:var(--line-strong)}.map-hotspot:hover:not([data-highlighted],:focus-visible)>.map-halo{stroke:var(--map-halo);stroke-width:14px}}.map-hotspot__art,.map-decor,.map-layer{transition:opacity var(--dur-2) var(--ease-standard)}.map-scene[data-has-highlight] .map-hotspot:not([data-highlighted])>.map-hotspot__art,.map-scene[data-has-highlight] :is(.map-decor,.map-layer){opacity:.6}:root[data-theme=dark] .map-scene{--map-halo:color-mix(in oklch, var(--focus) 50%, transparent)}:root[data-theme=dark] .map-hotspot[data-highlighted]:not(:focus-visible)>.map-hit--area{stroke-width:3px}:root[data-theme=dark] .map-hotspot[data-highlighted]:not(:focus-visible)>.map-halo{stroke-width:22px}.map-swatch{vertical-align:middle;flex:none;width:2.5rem;height:.875rem;display:inline-block;overflow:visible}.map-swatch .map-splice__code{font-size:6px}@media (prefers-reduced-motion:reduce){.map-hit,.map-halo,.map-focus-core,.map-hotspot__art,.map-decor,.map-layer{transition:none}}}