/* WORLD 311 / local-time easter eggs */
.world-time-event{
  position:fixed;
  left:50%;
  top:8vh;
  z-index:24;
  width:min(680px,calc(100vw - 36px));
  min-height:112px;
  transform:translateX(-50%);
  display:grid;
  place-items:center;
  align-content:center;
  gap:8px;
  pointer-events:none;
  border:1px solid rgba(222,241,247,.13);
  border-radius:999px;
  background:
    radial-gradient(circle at 50% 50%,rgba(117,206,233,.10),transparent 58%),
    rgba(12,33,46,.24);
  backdrop-filter:blur(13px) saturate(.9);
  box-shadow:0 18px 65px rgba(13,37,51,.10);
  animation:timeSignalIn .9s cubic-bezier(.16,1,.3,1) both;
  overflow:hidden;
}
.world-time-event span{
  font:800 clamp(.78rem,1.4vw,1.1rem)/1 "Space Mono",monospace;
  letter-spacing:.20em;
  color:rgba(235,248,251,.88);
  text-align:center;
}
.world-time-event b{
  font:650 .52rem/1.4 "Space Mono",monospace;
  letter-spacing:.13em;
  color:rgba(225,241,246,.48);
  text-align:center;
}
.world-time-event i{
  position:absolute;
  left:50%;top:50%;
  width:34px;height:34px;
  margin:-17px;
  border:1px solid rgba(166,224,238,.11);
  border-radius:50%;
  animation:timeSignalRing 5s ease-out infinite;
}
.world-time-event i:nth-of-type(2){animation-delay:1.15s}
.world-time-event i:nth-of-type(3){animation-delay:2.3s}

.time-event-1111 .world-time-event{
  background:
    linear-gradient(90deg,rgba(135,184,217,.06),rgba(239,232,255,.11),rgba(135,184,217,.06)),
    rgba(13,31,47,.26);
}
.time-event-1111 .wordmark{
  filter:drop-shadow(11px 0 20px rgba(184,214,235,.08)) drop-shadow(-11px 0 20px rgba(223,195,240,.08));
}
.time-event-1121 .world-time-event{
  border-color:rgba(239,207,143,.20);
  background:
    radial-gradient(circle at 50% 50%,rgba(244,205,121,.11),transparent 58%),
    linear-gradient(120deg,rgba(147,62,66,.12),rgba(36,80,71,.12),rgba(40,76,119,.12)),
    rgba(14,30,40,.28);
}
.time-event-1121 .world-time-event span{
  color:rgba(252,235,191,.90);
  text-shadow:0 0 18px rgba(232,194,104,.18);
}
.cloud-clock.time-event-active{
  opacity:1!important;
  text-shadow:0 0 9px rgba(236,246,250,.72),0 0 28px rgba(130,205,228,.28)!important;
  transform:translateY(-2px) scale(1.035);
}
@keyframes timeSignalIn{
  from{opacity:0;transform:translateX(-50%) translateY(-18px) scale(.96);filter:blur(5px)}
  to{opacity:1;transform:translateX(-50%) translateY(0) scale(1);filter:blur(0)}
}
@keyframes timeSignalRing{
  0%{opacity:0;transform:scale(.25)}
  15%{opacity:.7}
  100%{opacity:0;transform:scale(15)}
}
@media(max-width:700px){
  .world-time-event{top:10vh;min-height:94px;border-radius:28px}
}