/* M1.8 — four readable, visibly animated destination portals (including the road home). */
.gate-panorama .gate-destination-copy {
 opacity:1;visibility:visible;transform:translate(-50%,0);
 width:clamp(112px,13vw,200px);padding:7px 8px;pointer-events:none;
 background:linear-gradient(135deg,#10252fe8,#2a3c45ed);
 box-shadow:0 3px 14px #091b24c9,0 0 10px #c7e3e536;
}
.gate-panorama .gate-destination{isolation:isolate}
.gate-panorama .gate-portal-gold{--portal-light:#ffd78d;--portal-veil:#be893f}
.gate-panorama .gate-portal-sky{--portal-light:#95e4ff;--portal-veil:#4ab6e5}
.gate-panorama .gate-portal-emerald{--portal-light:#a5ffc2;--portal-veil:#48cf91}
.gate-panorama .gate-portal-violet{--portal-light:#e2b5ff;--portal-veil:#a674ef}
.gate-panorama .portal-aura,.gate-panorama .portal-rays,.gate-panorama .portal-flecks{
 position:absolute;inset:3% 0;z-index:-1;pointer-events:none;border-radius:50%;
}
.gate-panorama .portal-aura{
 background:radial-gradient(ellipse at center,var(--portal-veil) 0 12%,transparent 62%);
 filter:blur(10px);opacity:.9;animation:portal-aura 2.8s ease-in-out infinite alternate;
}
.gate-panorama .portal-rays{
 border:2px solid var(--portal-light);opacity:.84;
 box-shadow:0 0 15px 3px var(--portal-veil),inset 0 0 13px var(--portal-veil);
 animation:portal-ring-spin 6s linear infinite;
}
.gate-panorama .portal-rays::before,.gate-panorama .portal-rays::after{
 content:'';position:absolute;inset:5%;border-radius:50%;
 border:2px dashed var(--portal-light);
 box-shadow:0 0 6px var(--portal-light);
}
.gate-panorama .portal-rays::after{inset:17%;border-style:dotted;animation:portal-ring-spin 3.4s linear infinite reverse}
.gate-panorama .portal-flecks{
 background:radial-gradient(circle at 18% 30%,var(--portal-light) 0 2%,transparent 3%),
 radial-gradient(circle at 78% 14%,var(--portal-light) 0 2%,transparent 3%),
 radial-gradient(circle at 85% 83%,var(--portal-light) 0 2%,transparent 3%),
 radial-gradient(circle at 28% 88%,var(--portal-light) 0 2%,transparent 3%);
 filter:drop-shadow(0 0 5px var(--portal-light));
 animation:portal-sparks 2.3s ease-in-out infinite;
}
.gate-panorama .gate-destination-symbol{
 z-index:1;border-color:var(--portal-light);color:var(--portal-light);
 background:radial-gradient(circle at 40% 35%,var(--portal-veil),#1b2735 82%);
 box-shadow:0 0 25px var(--portal-veil),0 0 7px var(--portal-light),inset 0 0 15px var(--portal-light);
 animation:portal-core 2.1s ease-in-out infinite alternate;
}
.gate-panorama .gate-destination.portal-nearby .portal-rays,
.gate-panorama .gate-destination:hover .portal-rays{filter:brightness(1.5)}
.gate-panorama .gate-destination-4 .gate-destination-copy{bottom:108%}
@keyframes portal-core{from{transform:scale(.9);filter:brightness(.88)}to{transform:scale(1.08);filter:brightness(1.45)}}
@keyframes portal-aura{from{transform:scale(.8);opacity:.6}to{transform:scale(1.35);opacity:1}}
@keyframes portal-ring-spin{from{transform:rotate(0deg)}to{transform:rotate(360deg)}}
@keyframes portal-sparks{from{transform:translateY(4px) rotate(-5deg);opacity:.5}to{transform:translateY(-7px) rotate(5deg);opacity:1}}
@media(max-width:700px){
 .gate-panorama .gate-destination-copy{width:clamp(85px,17vw,126px);padding:4px 5px;border-radius:6px}
 .gate-panorama .gate-destination-copy strong{font-size:clamp(8px,1.6vw,10px)}
 .gate-panorama .gate-destination-copy small{font-size:clamp(7px,1.2vw,9px)}
}
@media(max-width:420px){.gate-panorama .gate-destination-copy small{display:none}}
@media(prefers-reduced-motion:reduce){
 .gate-panorama .portal-aura,.gate-panorama .portal-rays,
 .gate-panorama .portal-rays::after,.gate-panorama .portal-flecks,
 .gate-panorama .gate-destination-symbol{animation:none!important}
}