/* ==========================================================================
   Summit sticky reminder
   Shown after the anniversary dialog is dismissed, so the Summit stays
   present without blocking the page. Sits below the dialog (z 9000) and
   below the toast (z 9500).
   ========================================================================== */
.anniv-bubble {
  position: fixed;
  right: 1.5rem;
  bottom: 1.5rem;
  z-index: 8900;
  width: 76px;
  height: 76px;
  opacity: 0;
  transform: translateY(26px) scale(0.75);
  transition: opacity 0.45s ease, transform 0.5s cubic-bezier(0.34, 1.56, 0.64, 1);
}
.anniv-bubble[hidden] { display: none; }
.anniv-bubble.is-visible { opacity: 1; transform: translateY(0) scale(1); }

.anniv-bubble__open {
  position: relative;
  display: grid;
  place-items: center;
  width: 100%;
  height: 100%;
  padding: 0;
  border: 0;
  border-radius: 50%;
  cursor: pointer;
  background: radial-gradient(circle at 32% 26%, rgba(255,255,255,0.28), rgba(10,31,68,0.9) 68%);
  box-shadow:
    0 12px 30px rgba(10,31,68,0.42),
    inset 0 0 0 1px rgba(201,148,10,0.55);
  -webkit-backdrop-filter: blur(6px);
  backdrop-filter: blur(6px);
  animation: annivBubbleFloat 4.6s ease-in-out infinite;
  transition: transform 0.25s ease, box-shadow 0.25s ease;
}
.anniv-bubble__open:hover,
.anniv-bubble__open:focus-visible {
  transform: scale(1.08);
  box-shadow:
    0 16px 38px rgba(10,31,68,0.5),
    inset 0 0 0 1px rgba(201,148,10,0.9);
  outline: none;
}

.anniv-bubble__logo {
  position: relative;
  z-index: 2;
  width: 44px;
  height: 44px;
  object-fit: contain;
  opacity: 0.94;
  filter: drop-shadow(0 2px 6px rgba(0,0,0,0.4));
}

/* Halo rings */
.anniv-bubble__ring {
  position: absolute;
  inset: -4px;
  border-radius: 50%;
  border: 2px solid rgba(201,148,10,0.5);
  opacity: 0;
  pointer-events: none;
  animation: annivRing 2.8s ease-out infinite;
}
.anniv-bubble__ring--2 { animation-delay: 1.4s; }

@keyframes annivRing {
  0%   { transform: scale(0.85); opacity: 0.75; }
  70%  { opacity: 0.12; }
  100% { transform: scale(1.55); opacity: 0; }
}

@keyframes annivBubbleFloat {
  0%, 100% { translate: 0 0; }
  50%      { translate: 0 -6px; }
}

/* Confetti + sparkles bursting from behind the badge */
.anniv-bubble__burst {
  position: absolute;
  inset: 0;
  z-index: 1;
  pointer-events: none;
}
.anniv-bit,
.anniv-twinkle {
  position: absolute;
  top: 50%;
  left: 50%;
  opacity: 0;
}
.anniv-bit {
  width: var(--w, 5px);
  height: var(--h, 9px);
  border-radius: 1px;
  background: var(--c, #FF9933);
  animation: annivBit var(--dur, 3.2s) var(--delay, 0s) ease-out infinite;
}
.anniv-twinkle {
  width: 4px;
  height: 4px;
  animation: annivTwinkle var(--dur, 2.6s) var(--delay, 0s) ease-in-out infinite;
}
.anniv-twinkle::after {
  content: '✦';
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  font-size: var(--sz, 11px);
  color: #C9940A;
}

@keyframes annivBit {
  0%   { transform: translate(-50%, -50%) rotate(0deg) scale(0.4); opacity: 0; }
  15%  { opacity: 1; }
  70%  { opacity: 0.85; }
  100% { transform: translate(calc(-50% + var(--tx, 0px)), calc(-50% + var(--ty, -54px))) rotate(var(--rot, 220deg)) scale(0.9); opacity: 0; }
}
@keyframes annivTwinkle {
  0%   { transform: translate(calc(-50% + var(--tx, 0px)), calc(-50% + var(--ty, 0px))) scale(0); opacity: 0; }
  40%  { opacity: 1; }
  100% { transform: translate(calc(-50% + var(--tx, 0px)), calc(-50% + var(--ty, -34px))) scale(1); opacity: 0; }
}

.anniv-bit--1  { --tx:-46px; --ty:-40px; --rot:200deg; --c:#FF9933; --dur:3.4s; --delay:0.0s; }
.anniv-bit--2  { --tx: 42px; --ty:-48px; --rot:-180deg; --c:#C9940A; --dur:3.0s; --delay:0.4s; }
.anniv-bit--3  { --tx:-12px; --ty:-62px; --rot:260deg; --c:#ffffff; --dur:3.8s; --delay:0.9s; --w:4px; --h:7px; }
.anniv-bit--4  { --tx: 30px; --ty:-34px; --rot:-220deg; --c:#138808; --dur:3.2s; --delay:1.3s; }
.anniv-bit--5  { --tx:-38px; --ty:-22px; --rot:160deg; --c:#D4A017; --dur:3.6s; --delay:0.6s; --w:6px; --h:6px; }
.anniv-bit--6  { --tx: 52px; --ty:-18px; --rot:-260deg; --c:#FF9933; --dur:2.9s; --delay:1.7s; }
.anniv-bit--7  { --tx:  4px; --ty:-70px; --rot:300deg; --c:#C9940A; --dur:4.0s; --delay:2.1s; --w:4px; --h:10px; }
.anniv-bit--8  { --tx:-56px; --ty:-8px;  --rot:-140deg; --c:#ffffff; --dur:3.3s; --delay:1.0s; --w:4px; --h:4px; }
.anniv-bit--9  { --tx: 18px; --ty:-56px; --rot:240deg; --c:#FF9933; --dur:3.7s; --delay:2.5s; }
.anniv-bit--10 { --tx:-26px; --ty:-50px; --rot:-200deg; --c:#D4A017; --dur:3.1s; --delay:1.9s; --w:5px; --h:8px; }
.anniv-bit--11 { --tx: 46px; --ty:-42px; --rot:180deg; --c:#138808; --dur:3.9s; --delay:0.2s; --w:4px; --h:6px; }
.anniv-bit--12 { --tx:-6px;  --ty:-30px; --rot:-300deg; --c:#C9940A; --dur:2.8s; --delay:2.8s; }

.anniv-twinkle--1 { --tx:-34px; --ty: 6px;  --sz:12px; --dur:2.6s; --delay:0.3s; }
.anniv-twinkle--2 { --tx: 36px; --ty:-4px;  --sz:9px;  --dur:3.0s; --delay:1.2s; }
.anniv-twinkle--3 { --tx: 10px; --ty:-26px; --sz:13px; --dur:2.8s; --delay:2.0s; }
.anniv-twinkle--4 { --tx:-18px; --ty:-14px; --sz:8px;  --dur:3.2s; --delay:2.6s; }

/* Label — always visible, not only on hover.
   pointer-events stays off so the label never intercepts a click meant for
   the badge underneath it. */
.anniv-bubble__label {
  position: absolute;
  top: 50%;
  right: calc(100% + 12px);
  transform: translateY(-50%);
  padding: 0.5rem 0.85rem;
  border-radius: 100px;
  background: #0A1F44;
  color: #fff;
  font-family: var(--f-body);
  font-size: 0.75rem;
  font-weight: 600;
  white-space: nowrap;
  opacity: 1;
  pointer-events: none;
  box-shadow: 0 8px 24px rgba(0,0,0,0.3);
}

/* Dismiss — only revealed on hover / keyboard focus */
.anniv-bubble__x {
  position: absolute;
  top: -4px;
  right: -4px;
  z-index: 3;
  display: grid;
  place-items: center;
  width: 24px;
  height: 24px;
  padding: 0;
  border: 1px solid rgba(255,255,255,0.4);
  border-radius: 50%;
  background: #0A1F44;
  color: #fff;
  cursor: pointer;
  opacity: 0;
  transform: scale(0.5);
  pointer-events: none;
  transition: opacity 0.2s ease, transform 0.2s ease, background 0.2s ease;
}
.anniv-bubble:hover .anniv-bubble__x,
.anniv-bubble:focus-within .anniv-bubble__x {
  opacity: 1;
  transform: scale(1);
  pointer-events: auto;
}
.anniv-bubble__x:hover { background: #b3261e; }

@media (max-width: 600px) {
  .anniv-bubble { right: 1rem; bottom: 1rem; width: 62px; height: 62px; }
  .anniv-bubble__logo { width: 36px; height: 36px; }
  .anniv-bubble__label { display: none; }
  .anniv-bubble__x { opacity: 1; transform: scale(1); pointer-events: auto; }
}

@media (prefers-reduced-motion: reduce) {
  .anniv-bubble,
  .anniv-bubble__open { transition: opacity 0.2s ease; animation: none; }
  .anniv-bubble__ring,
  .anniv-bit,
  .anniv-twinkle { animation: none; opacity: 0; }
  .anniv-bubble__open:hover { transform: none; }
}