.sunmap{position:relative;margin-top:clamp(2.5rem,5vw,4rem)}
.sunmap__canvas{position:relative;aspect-ratio:360/134;width:100%}
.sunmap__dots{position:absolute;inset:0;width:100%;height:100%;color:rgba(255,255,255,.42)}
.sunmap__night{position:absolute;inset:0;width:100%;height:100%}
.sunmap__night path{fill:rgba(11,15,20,.66)}
.sunmap__night .sun{fill:url(#sunglow)}
.sunmap__night .terminator{fill:none;stroke:rgba(255,91,31,.55);stroke-width:.35;stroke-dasharray:1 1.5;vector-effect:non-scaling-stroke}
.pin{position:absolute;left:var(--x);top:var(--y);width:0;height:0}
.pin i{position:absolute;left:-5px;top:-5px;width:10px;height:10px;border-radius:50%;background:var(--ink);border:1.5px solid var(--on-dark-2)}
.pin.is-open i{background:var(--signal);border-color:var(--signal);box-shadow:0 0 0 6px rgba(255,91,31,.18),0 0 24px rgba(255,91,31,.6)}
.pin span{position:absolute;top:-.45rem;left:.75rem;white-space:nowrap;font:500 .75rem/1 var(--f-mono);letter-spacing:.06em;color:var(--on-dark-2)}
.pin span time{color:var(--on-dark-3);margin-left:.4rem;font-variant-numeric:tabular-nums}
.pin.is-open span{color:var(--on-dark)}
.pin.is-open span time{color:var(--signal)}
.pin--l span{left:auto;right:.75rem}
.pin--t span{top:-1.35rem;left:-.3rem}
.pin--b span{top:.6rem;left:-.3rem}
.pin--bl span{top:.6rem;left:auto;right:-.3rem}
.sunmap__legend{display:flex;flex-wrap:wrap;gap:.75rem 2rem;margin-top:1.75rem;padding-top:1.25rem;border-top:1px solid var(--line-dark);font-size:.875rem;color:var(--on-dark-3)}
.sunmap__legend p{margin:0;display:flex;align-items:center;gap:.6rem}
.sunmap__legend b{color:var(--on-dark);font-weight:500}
.key{display:inline-block;width:10px;height:10px;border-radius:50%;background:var(--signal);flex:none}
.key--off{background:var(--ink);border:1.5px solid var(--on-dark-2)}
.key--night{width:18px;height:10px;border-radius:2px;background:rgba(255,255,255,.08);border:1px dashed rgba(255,91,31,.55)}
.sunmap__handoff-svg{position:absolute;inset:0;width:100%;height:100%;overflow:visible;pointer-events:none}
.handoff__arc{fill:none;stroke:var(--signal);stroke-width:1.5px;vector-effect:non-scaling-stroke;stroke-linecap:round;stroke-dasharray:1;stroke-dashoffset:0}
.handoff__trail{fill:none;stroke:rgba(255,91,31,.28);stroke-width:5px;vector-effect:non-scaling-stroke;stroke-linecap:round}
.handoff__head{fill:var(--signal)}
.pin.is-handoff-from i,.pin.is-handoff-to i{border-color:var(--signal);box-shadow:0 0 0 4px rgba(255,91,31,.22)}
.pin.is-handoff-from span,.pin.is-handoff-to span{display:block;color:var(--on-dark)}
.key--handoff{width:18px;height:2px;border-radius:2px;background:var(--signal)}
.sunmap__handoff b{color:var(--on-dark);font-weight:500}
@media (prefers-reduced-motion:no-preference){
html:not(.save-data) .sunmap.is-armed .handoff__arc{stroke-dashoffset:1}
html:not(.save-data) .sunmap.is-armed .handoff__trail,html:not(.save-data) .sunmap.is-armed .handoff__head{opacity:0}
html:not(.save-data) .sunmap.is-run .handoff__arc{stroke-dashoffset:0;transition:stroke-dashoffset var(--dur-story) var(--ease-signal)}
html:not(.save-data) .sunmap.is-run .handoff__trail{opacity:1;transition:opacity var(--dur-reveal) var(--ease-out) var(--dur-reveal)}
html:not(.save-data) .sunmap.is-run .handoff__head{opacity:1;transition:opacity var(--dur-fast) linear}
}
@media (max-width:1180px){.sunmap__legend{font-size:.8rem}}
@media (max-width:900px){.pin span{display:none}.pin.is-open span{display:block}}
@media (max-width:640px){
.pin.is-open span{display:none}
.pin.is-handoff-from span,.pin.is-handoff-to span{display:block}
.pin.is-flip span{top:-.45rem;left:auto;right:.75rem}
.pin.is-handoff-from span time,.pin.is-handoff-to span time{display:none}
.sunmap__legend{gap:.6rem 1.5rem;margin-top:1.25rem}
}
@media (forced-colors:active){.sunmap__dots{color:CanvasText}}
