:root{--accent:#CA141F;--background:#0A0B0E;--white:#e9e9eb;--muted:#a1a3aa;font-family:Inter,system-ui,-apple-system,"Segoe UI",sans-serif;color-scheme:dark}
*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;background:var(--background);overflow:hidden}
button{font:inherit}a{color:inherit}.map{position:relative;width:100%;height:100dvh;min-height:350px;background:#111216;overflow:hidden;isolation:isolate;touch-action:none;user-select:none;outline:none}
.map:before{content:"";z-index:3;position:absolute;inset:0;pointer-events:none;background:radial-gradient(ellipse 90% 85% at 50% 50%,transparent 41%,rgba(1,2,4,.33) 100%);box-shadow:inset 0 0 0 1px rgba(255,255,255,.07)}
#geo{position:absolute;inset:0;z-index:1;transform-origin:50% 50%;will-change:transform;transform:perspective(1200px) rotateX(var(--pitch,0deg)) scale(1.045);pointer-events:none}
#tile-layer{position:absolute;inset:0;overflow:hidden;filter:grayscale(1) invert(1) brightness(.85) contrast(.90);background:#101216}
#tile-layer img{position:absolute;display:block;border:0;max-width:none;will-change:top,left,width,height;pointer-events:none;image-rendering:auto}
#red-wash{position:absolute;inset:0;z-index:2;pointer-events:none;background:linear-gradient(145deg,rgba(105,9,18,.07),transparent 37%,transparent 64%,rgba(81,6,15,.065));mix-blend-mode:screen}
#spotlight{position:absolute;z-index:3;inset:0;pointer-events:none;opacity:.90;transition:opacity 800ms;background:radial-gradient(circle at var(--spot-x,50%) var(--spot-y,50%),transparent 0px,rgba(2,3,4,.02) 170px,rgba(2,3,4,.17) 340px,rgba(2,3,4,.47) 920px)}
.map.touched #spotlight{opacity:.27}
#hit{position:absolute;z-index:4;inset:0;touch-action:none;cursor:grab}#hit.dragging{cursor:grabbing}
#pin{position:absolute;z-index:6;left:50%;top:50%;transform:translate(-50%,-50%);width:64px;height:64px;border:0;border-radius:50%;background:transparent;cursor:pointer;filter:drop-shadow(0 3px 16px rgba(202,20,31,.25))}
#pin:before,#pin:after{content:"";position:absolute;border-radius:50%;inset:3px;border:1px solid rgba(202,20,31,.63)}#pin:before{animation:ripple 3.1s infinite ease-out}#pin:after{inset:14px;background:var(--accent);border:5px solid #0e0f13;box-shadow:0 0 0 1px var(--accent),0 0 28px rgba(202,20,31,.35)}
#pin i{position:absolute;width:4px;height:4px;border-radius:50%;background:white;left:30px;top:30px;z-index:1}
@keyframes ripple{0%{transform:scale(.7);opacity:.85}80%,100%{transform:scale(1.9);opacity:0}}
#popup{position:absolute;z-index:7;min-width:230px;max-width:280px;padding:18px 18px 14px;background:rgba(12,13,16,.97);border:1px solid #43444b;border-radius:10px;box-shadow:0 20px 55px rgba(0,0,0,.65);font-size:12px;line-height:1.65;color:#bcbec5;left:50%;top:50%;transform:translate(-50%,calc(-100% - 46px))}
#popup[hidden]{display:none}#popup b{display:block;font-size:12px;letter-spacing:.14em;color:#f0f0f3;margin-bottom:8px}#popup a{display:inline-block;margin-top:9px;color:#fa626d;text-decoration:none;font-weight:700}#popup button{position:absolute;top:5px;right:7px;border:0;background:transparent;color:#aaa;cursor:pointer;font-size:18px}
.controlbox{position:absolute;z-index:8;right:clamp(12px,2vw,28px);top:50%;transform:translateY(-50%);display:grid;gap:10px}
.controls{overflow:hidden;border:1px solid rgba(126,129,139,.28);border-radius:9px;background:rgba(13,14,17,.91);box-shadow:0 18px 45px rgba(0,0,0,.3);backdrop-filter:blur(10px)}
.ctrl{display:grid;place-items:center;width:44px;height:44px;border:0;background:transparent;color:#dedfe3;cursor:pointer;transition:background .18s,color .18s}.ctrl+.ctrl{border-top:1px solid rgba(126,129,139,.21)}.ctrl:hover{color:white;background:#3e141a}.ctrl:focus-visible,#pin:focus-visible,#hit:focus-visible{outline:2px solid var(--accent);outline-offset:-3px}.ctrl svg{width:19px;height:19px;stroke:currentColor;stroke-width:1.65;fill:none;stroke-linecap:round;stroke-linejoin:round}
.attribution{position:absolute;z-index:9;bottom:0;left:0;font-size:10px;color:rgba(220,222,226,.83);background:rgba(8,9,12,.78);padding:5px 8px;white-space:nowrap}.attribution a{text-decoration:none}
.state{position:absolute;z-index:10;inset:0;display:flex;align-items:center;justify-content:center;padding:24px;background:#0A0B0E;transition:opacity .4s,visibility .4s}.state[hidden]{display:none!important}.state.hidden{opacity:0;visibility:hidden;pointer-events:none}.status-inner{text-align:center;max-width:420px}.spinner{width:31px;height:31px;border-radius:50%;border:1px solid #63242b;border-top:2px solid var(--accent);animation:rotate .8s linear infinite;margin:0 auto 15px}@keyframes rotate{to{transform:rotate(360deg)}}
.status-small{font-size:11px;letter-spacing:.13em;color:#a8a8b0;text-transform:uppercase}.state.error{background:radial-gradient(circle at center,#1b1c22,#090a0c 70%)}.error-icon{width:38px;height:38px;border:1px solid #9c2e38;border-radius:50%;color:#eb505b;font-size:23px;line-height:36px;margin:auto auto 17px}.state h2{font-size:17px;color:#f1f1f3;letter-spacing:.01em;font-weight:600;margin:0 0 11px}.state p{font-size:12px;color:#aeb0b8;line-height:1.7;margin:0 0 19px}.go-maps{display:inline-flex;gap:9px;align-items:center;background:var(--accent);padding:11px 15px;text-decoration:none;color:white;border-radius:6px;font-size:12px;font-weight:700}
#toast{position:absolute;bottom:33px;left:50%;z-index:8;transform:translateX(-50%);padding:9px 13px;border:1px solid #444650;background:rgba(14,15,18,.94);border-radius:7px;color:#f1f1f4;font-size:12px;display:none;pointer-events:none}
@media(max-width:600px){.controlbox{top:auto;bottom:35px;transform:none;right:12px}.ctrl{width:40px;height:40px}#pin{width:60px;height:60px}#pin i{left:28px;top:28px}#popup{min-width:208px;max-width:240px}#spotlight{opacity:.68}}
@media(prefers-reduced-motion:reduce){.spinner,#pin:before{animation:none}.state,#spotlight{transition:none}}

.map-retry{display:block;margin:14px auto 0;padding:9px 14px;border:1px solid #777;background:transparent;color:#eee;border-radius:5px;cursor:pointer}