/* Keep the original island image hover and press effects from style.css. */
.island-cloud{
 position:absolute;left:50%;top:6%;transform:translate(-50%,calc(-100% + 14px));
 display:block;width:max-content;padding:9px 18px 10px;
 border:0;border-radius:40px;background:linear-gradient(180deg,#fff 30%,#eff8ff);
 color:#5146c6;font-size:clamp(12px,1.15vw,16px);font-weight:750;line-height:1.2;
 letter-spacing:.01em;text-align:center;white-space:nowrap;
 filter:drop-shadow(0 4px 7px #567f9c35);opacity:0;
 transition:opacity .18s ease,top .3s ease,translate .3s ease;pointer-events:none;
}
.island-cloud::before,.island-cloud::after{
 content:"";position:absolute;background:#fff;border-radius:50%;z-index:0;
}
.island-cloud::before{width:30px;height:25px;left:17%;top:-9px}
.island-cloud::after{width:40px;height:31px;left:43%;top:-13px}
.island-cloud-text{
 position:relative;z-index:1;display:inline-block;
 font-family:ui-rounded,"Arial Rounded MT Bold",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
}
@supports ((background-clip:text) or (-webkit-background-clip:text)){
 .island-cloud-text{
  background-image:linear-gradient(90deg,#e63853 0%,#ef841d 16%,#c69b0d 30%,#239c62 46%,#239acb 60%,#5056df 76%,#a344c5 90%,#e43882 100%);
  background-clip:text;-webkit-background-clip:text;
  color:transparent;-webkit-text-fill-color:transparent;
 }
}
.island-cloud-tail{
 position:absolute;left:calc(50% - 5px);bottom:-4px;width:10px;height:10px;
 background:#eff8ff;border-radius:2px;transform:rotate(45deg);z-index:0;
}
/* Follow the same 8px lift. The anchor follows the image's original 1.05 scale. */
.island:is(:hover,:focus-visible) .island-cloud{top:3.8%;translate:0 -8px}
.island:active .island-cloud{top:6.88%}
.island:is(:hover,:focus-visible) .island-cloud{opacity:1}
/* A separate, pointer-transparent layer keeps labels above all map artwork. */
.island-label-layer{position:absolute;inset:0;z-index:25;pointer-events:none}
.island-label-layer .island-cloud{
 left:0;top:0;transform:translate(-50%,-100%);
 transition:opacity .18s ease;pointer-events:none;
}
.island-label-layer .island-cloud.is-active{opacity:1}
@media(hover:none),(pointer:coarse){
 .island-cloud{font-size:clamp(11px,1.35vw,15px);padding:8px 13px 9px}
}
@media(prefers-reduced-motion:reduce){
 .island-cloud{transition:none}
}