.sjgsm-zodiac-live {
  --sjgsm-zodiac-gold: #f2d486;
  --sjgsm-zodiac-gold-soft: #fff0b8;
  --sjgsm-zodiac-blue: #9bcfff;
  --sjgsm-zodiac-shadow: rgba(0, 0, 0, 0.88);
  --sjgsm-zodiac-max-width: 941px;
  width: min(100%, var(--sjgsm-zodiac-max-width));
  margin-block: 18px;
  container-type: inline-size;
  line-height: 1;
}

.sjgsm-zodiac-align-center { margin-inline: auto; }
.sjgsm-zodiac-align-left { margin-right: auto; margin-left: 0; }
.sjgsm-zodiac-align-right { margin-left: auto; margin-right: 0; }

.sjgsm-zodiac-stage {
  position: relative;
  width: 100%;
  overflow: hidden;
  isolation: isolate;
  background: #02070b;
  --sjgsm-parallax-x: 0px;
  --sjgsm-parallax-y: 0px;
}

.sjgsm-zodiac-image {
  display: block;
  width: 100%;
  height: auto;
  vertical-align: middle;
  user-select: none;
}

.sjgsm-zodiac-date,
.sjgsm-zodiac-energy,
.sjgsm-zodiac-moon-phase,
.sjgsm-zodiac-countdown {
  position: absolute;
  z-index: 2;
  left: 50%;
  transform: translateX(-50%);
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  pointer-events: none;
  box-sizing: border-box;
  font-family: "Cinzel", "Trajan Pro", "Times New Roman", Georgia, serif;
  font-weight: 700;
  text-transform: uppercase;
  color: var(--sjgsm-zodiac-gold);
  text-shadow:
    0 1px 0 #3f2400,
    0 0 6px rgba(255, 198, 67, 0.46),
    0 0 14px rgba(10, 38, 77, 0.72),
    0 2px 5px var(--sjgsm-zodiac-shadow);
  white-space: nowrap;
}

.sjgsm-zodiac-date {
  /* V17.2: same approved size, raised so it does not cover the subtitle. */
  top: 2.82%;
  left: 50%;
  width: 82%;
  height: 3.45%;
  padding: 0;
  transform: translateX(-50%) scale(1.035);
  transform-origin: 50% 50%;
  font-size: clamp(21px, 4.55cqw, 47px);
  font-weight: 900;
  line-height: 1;
  letter-spacing: 0.065em;

  /* Rounded, raised gold face: dark gold only at the bevelled edges. */
  color: #e9ad25;
  background:
    linear-gradient(180deg,
      #8a4a05 0%,
      #d88b13 8%,
      #fff2a2 24%,
      #ffd65b 43%,
      #f0ad20 67%,
      #b86608 88%,
      #713704 100%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  -webkit-text-stroke: 0.22px rgba(93, 49, 3, 0.78);

  /* Bevel + rounded mound volume. The visible face remains gold. */
  text-shadow:
    0 -1px 0 rgba(255, 255, 220, 0.96),
    -1px 0 0 rgba(255, 222, 105, 0.66),
    1px 0 0 rgba(129, 67, 4, 0.58),
    0 1px 0 #c57b0d,
    0 2px 0 #9b5606,
    0 3px 1px rgba(79, 39, 1, 0.82),
    0 5px 4px rgba(0, 0, 0, 0.62),
    0 0 5px rgba(255, 202, 55, 0.58);
  filter:
    drop-shadow(0 3px 2px rgba(0, 0, 0, 0.58))
    drop-shadow(0 0 3px rgba(255, 196, 39, 0.30));
  animation: sjgsm-zodiac-date-alive 4.2s ease-in-out infinite;
  will-change: filter, text-shadow;
}

@keyframes sjgsm-zodiac-date-alive {
  0%, 100% {
    filter:
      drop-shadow(0 3px 2px rgba(0, 0, 0, 0.58))
      drop-shadow(0 0 3px rgba(255, 196, 39, 0.28));
  }
  50% {
    filter:
      drop-shadow(0 4px 3px rgba(0, 0, 0, 0.66))
      drop-shadow(0 0 6px rgba(255, 207, 61, 0.42));
  }
}

.sjgsm-zodiac-energy {
  /* V17.2.2: the dynamic daily phrase sits directly below the
     ENERGY OF THE DAY title, centred inside the ornate framed box. */
  top: 84.62%;
  width: 78%;
  height: 2.55%;
  padding: 0 4.5%;
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  font-size: clamp(8px, 1.42cqw, 15.5px);
  letter-spacing: 0.055em;
  line-height: 1.14;
  white-space: normal;
  color: #f3d489;
}

.sjgsm-zodiac-moon-phase {
  top: 91.35%;
  width: 76%;
  height: 1.8%;
  font-size: clamp(7.2px, 1.02cqw, 12.8px);
  letter-spacing: 0.085em;
  color: #d9eaff;
  text-shadow:
    0 0 4px rgba(153, 207, 255, 0.40),
    0 0 8px rgba(255, 212, 118, 0.18),
    0 1px 3px rgba(0, 0, 0, 0.92);
}

/* V17.2.3: larger countdown, perfectly centred and raised slightly. */
.sjgsm-zodiac-countdown {
  left: 50%;
  top: 94.48%;
  width: 80%;
  height: 3.35%;
  padding: 0;
  background: transparent;
  border: 0;
  box-shadow: none;
  font-size: clamp(14px, 2.65cqw, 31px);
  letter-spacing: 0.085em;
  line-height: 1;
  color: #f8dda1;
  text-shadow:
    0 0 4px rgba(255, 211, 115, 0.52),
    0 1px 3px rgba(0, 0, 0, 0.95),
    0 0 12px rgba(255, 205, 110, 0.22);
}

@media (max-width: 640px) {
  .sjgsm-zodiac-countdown {
    left: 50%;
    top: 94.44%;
    width: 81%;
    height: 3.30%;
    font-size: clamp(12px, 2.70cqw, 24px);
    letter-spacing: 0.060em;
  }
}

@media (max-width: 420px) {
  .sjgsm-zodiac-date {
    width: 86%;
    top: 2.78%;
    height: 3.55%;
    font-size: clamp(18px, 4.75cqw, 29px);
    letter-spacing: 0.035em;
    -webkit-text-stroke-width: 0.20px;
  }
  .sjgsm-zodiac-energy {
    top: 84.62%;
    width: 80%;
    height: 2.62%;
    padding-inline: 4.2%;
    letter-spacing: 0.045em;
  }
  .sjgsm-zodiac-moon-phase { width: 82%; top: 91.2%; font-size: clamp(6.8px, 1.05cqw, 11px); }
  .sjgsm-zodiac-countdown { left: 50%; width: 84%; top: 94.40%; height: 3.35%; letter-spacing: 0.040em; font-size: clamp(11px, 2.80cqw, 21px); }
}

/* V15 motion layer: visual effects are overlays, so the approved master templates remain untouched. */
.sjgsm-zodiac-motion-layer {
  position: absolute;
  inset: 0;
  z-index: 1;
  overflow: hidden;
  pointer-events: none;
  mix-blend-mode: screen;
}

.sjgsm-zodiac-parallax-layer {
  position: absolute;
  inset: 0;
  pointer-events: none;
  will-change: transform;
  transition: transform 0.7s cubic-bezier(.22,.61,.18,1);
}

.sjgsm-zodiac-parallax-glow { transform: translate3d(calc(var(--sjgsm-parallax-x) * 0.45), calc(var(--sjgsm-parallax-y) * 0.45), 0); }
.sjgsm-zodiac-parallax-constellations { transform: translate3d(calc(var(--sjgsm-parallax-x) * 0.75), calc(var(--sjgsm-parallax-y) * 0.75), 0); }
.sjgsm-zodiac-parallax-stars { transform: translate3d(calc(var(--sjgsm-parallax-x) * 1.05), calc(var(--sjgsm-parallax-y) * 1.05), 0); }
.sjgsm-zodiac-parallax-wheel { transform: translate3d(calc(var(--sjgsm-parallax-x) * 0.62), calc(var(--sjgsm-parallax-y) * 0.62), 0); }
.sjgsm-zodiac-parallax-shooting { transform: translate3d(calc(var(--sjgsm-parallax-x) * 1.25), calc(var(--sjgsm-parallax-y) * 1.25), 0); }
.sjgsm-zodiac-parallax-no .sjgsm-zodiac-parallax-layer { transform: none !important; transition: none; }

.sjgsm-zodiac-date,
.sjgsm-zodiac-energy,
.sjgsm-zodiac-moon-phase,
.sjgsm-zodiac-countdown {
  z-index: 3;
}

.sjgsm-zodiac-cosmic-glow,
.sjgsm-zodiac-constellations,
.sjgsm-zodiac-stars,
.sjgsm-zodiac-wheel-sparkles,
.sjgsm-zodiac-active-aura,
.sjgsm-zodiac-shooting-layer {
  position: absolute;
  inset: 0;
  pointer-events: none;
}

.sjgsm-zodiac-stars {
  animation: sjgsm-zodiac-sky-drift 30s ease-in-out infinite alternate;
  mix-blend-mode: screen;
}


.sjgsm-zodiac-cosmic-glow {
  opacity: 0.58;
  overflow: hidden;
  background:
    radial-gradient(ellipse at 17% 36%, rgba(42, 145, 255, 0.34) 0%, rgba(42, 145, 255, 0.10) 20%, transparent 45%),
    radial-gradient(ellipse at 83% 34%, rgba(50, 160, 255, 0.32) 0%, rgba(50, 160, 255, 0.09) 20%, transparent 45%),
    radial-gradient(ellipse at 50% 18%, rgba(255, 212, 112, 0.12) 0%, transparent 36%);
  animation: sjgsm-zodiac-cosmic-breathe 18s ease-in-out infinite;
}

.sjgsm-zodiac-cosmic-glow::before,
.sjgsm-zodiac-cosmic-glow::after {
  content: "";
  position: absolute;
  inset: -10%;
  pointer-events: none;
  mix-blend-mode: screen;
}

.sjgsm-zodiac-cosmic-glow::before {
  opacity: 0.62;
  background:
    radial-gradient(ellipse at 14% 28%, rgba(84, 178, 255, 0.34) 0%, rgba(84, 178, 255, 0.16) 18%, transparent 44%),
    radial-gradient(ellipse at 84% 30%, rgba(74, 160, 255, 0.30) 0%, rgba(74, 160, 255, 0.12) 18%, transparent 42%),
    radial-gradient(ellipse at 48% 54%, rgba(52, 143, 255, 0.18) 0%, transparent 32%);
  animation: sjgsm-zodiac-nebula-swell 16s ease-in-out infinite alternate;
}

.sjgsm-zodiac-cosmic-glow::after {
  opacity: 0.46;
  background:
    radial-gradient(ellipse at 22% 70%, rgba(103, 182, 255, 0.22) 0%, rgba(103, 182, 255, 0.08) 14%, transparent 30%),
    radial-gradient(ellipse at 76% 74%, rgba(91, 167, 255, 0.22) 0%, rgba(91, 167, 255, 0.08) 14%, transparent 30%),
    radial-gradient(ellipse at 52% 14%, rgba(255, 222, 140, 0.14) 0%, transparent 24%);
  animation: sjgsm-zodiac-nebula-swell-2 24s ease-in-out infinite alternate;
}

.sjgsm-zodiac-glow-no .sjgsm-zodiac-cosmic-glow { display: none; }

.sjgsm-zodiac-constellations {
  opacity: 0.48;
  animation: sjgsm-zodiac-constellation-drift 36s ease-in-out infinite alternate;
}

.sjgsm-zodiac-constellations svg {
  width: 100%;
  height: 100%;
  display: block;
  overflow: visible;
}

.sjgsm-zodiac-constellation {
  animation: sjgsm-zodiac-constellation-breathe 10s ease-in-out infinite;
  transform-origin: center;
}

.sjgsm-zodiac-const-line {
  fill: none;
  stroke: rgba(129, 198, 255, 0.40);
  stroke-width: 0.18;
  stroke-linecap: round;
  stroke-linejoin: round;
  filter: drop-shadow(0 0 0.25px rgba(191, 230, 255, 0.95)) drop-shadow(0 0 0.8px rgba(79, 164, 255, 0.54));
  animation: sjgsm-zodiac-const-line-glow 5.6s ease-in-out infinite;
}

.sjgsm-zodiac-const-node {
  fill: rgba(214, 240, 255, 0.96);
  filter: drop-shadow(0 0 0.5px rgba(228, 247, 255, 1)) drop-shadow(0 0 1.1px rgba(92, 170, 255, 0.74));
  animation: sjgsm-zodiac-const-node-glow 4.8s ease-in-out infinite;
}

.sjgsm-zodiac-const-node.is-gold {
  fill: rgba(253, 234, 167, 0.98);
  filter: drop-shadow(0 0 0.55px rgba(255, 243, 210, 1)) drop-shadow(0 0 1.2px rgba(255, 214, 109, 0.74));
}

.sjgsm-zodiac-star-wrap {
  position: absolute;
  left: var(--x);
  top: var(--y);
  width: 0;
  height: 0;
  animation: sjgsm-zodiac-star-float var(--fd) cubic-bezier(.42,0,.22,1) var(--delay) infinite alternate;
}

.sjgsm-zodiac-star {
  position: absolute;
  left: 0;
  top: 0;
  width: var(--s);
  height: var(--s);
  margin-left: calc(var(--s) * -0.5);
  margin-top: calc(var(--s) * -0.5);
  border-radius: 999px;
  opacity: var(--o);
  background: radial-gradient(circle, #fffef9 0%, #ffefbd 28%, rgba(255, 215, 109, 0.56) 60%, rgba(255, 215, 109, 0.22) 76%, transparent 88%);
  box-shadow:
    0 0 calc(var(--s) * 4.2) rgba(255, 240, 196, 0.98),
    0 0 calc(var(--s) * 8.8) rgba(255, 215, 109, 0.44),
    0 0 calc(var(--s) * 12.5) rgba(86, 170, 255, 0.26);
  animation:
    sjgsm-zodiac-twinkle var(--d) ease-in-out var(--delay) infinite,
    sjgsm-zodiac-star-vibrate var(--vd) ease-in-out var(--delay) infinite;
}

.sjgsm-zodiac-star.is-blue {
  background: radial-gradient(circle, #ffffff 0%, #c8ebff 34%, rgba(88, 186, 255, 0.56) 66%, rgba(88, 186, 255, 0.24) 80%, transparent 90%);
  box-shadow:
    0 0 calc(var(--s) * 4.8) rgba(220, 244, 255, 1),
    0 0 calc(var(--s) * 9.4) rgba(120, 194, 255, 0.66),
    0 0 calc(var(--s) * 13.8) rgba(66, 150, 255, 0.30);
}

.sjgsm-zodiac-star.is-spark {
  filter: brightness(1.14) saturate(1.16);
  box-shadow:
    0 0 calc(var(--s) * 5.8) rgba(255, 245, 206, 1),
    0 0 calc(var(--s) * 11.8) rgba(255, 215, 109, 0.56),
    0 0 calc(var(--s) * 16.8) rgba(93, 178, 255, 0.34);
}

.sjgsm-zodiac-star.is-blue.is-spark {
  box-shadow:
    0 0 calc(var(--s) * 6.1) rgba(235, 248, 255, 1),
    0 0 calc(var(--s) * 12.8) rgba(140, 205, 255, 0.82),
    0 0 calc(var(--s) * 18.4) rgba(73, 161, 255, 0.40);
}

.sjgsm-zodiac-shooting-star {
  position: absolute;
  left: var(--x);
  top: var(--y);
  width: var(--w);
  height: 1.08px;
  opacity: 0;
  border-radius: 999px;
  transform: translate3d(0, 0, 0) rotate(var(--angle));
  transform-origin: left center;
  background: linear-gradient(90deg,
    rgba(255, 246, 219, 0.00) 0%,
    rgba(149, 206, 255, 0.03) 18%,
    rgba(169, 219, 255, 0.10) 38%,
    rgba(214, 239, 255, 0.22) 58%,
    rgba(248, 226, 164, 0.40) 78%,
    rgba(255, 244, 214, 0.60) 92%,
    rgba(255, 247, 228, 0.00) 100%);
  box-shadow:
    0 0 4px rgba(255, 236, 186, 0.28),
    0 0 9px rgba(96, 174, 255, 0.14);
  filter: saturate(1.02);
  animation: sjgsm-zodiac-shoot var(--duration) cubic-bezier(.20,.58,.14,1) var(--delay) infinite;
}

.sjgsm-zodiac-shooting-star::after {
  content: "";
  position: absolute;
  right: -0.3px;
  top: 50%;
  width: calc(var(--head, 1.95px));
  height: calc(var(--head, 1.95px));
  border-radius: 999px;
  transform: translateY(-50%);
  background: radial-gradient(circle, rgba(255,255,255,0.98) 0%, rgba(255,245,221,0.96) 34%, rgba(255,224,143,0.68) 68%, rgba(255,224,143,0) 100%);
  box-shadow:
    0 0 4px rgba(255, 244, 221, 0.62),
    0 0 8px rgba(255, 221, 136, 0.24),
    0 0 14px rgba(110, 187, 255, 0.10);
}

.sjgsm-zodiac-shooting-no .sjgsm-zodiac-shooting-star { display: none; }
.sjgsm-zodiac-motion-cinematic .sjgsm-zodiac-cosmic-glow { opacity: 0.72; animation-duration: 14s; }
.sjgsm-zodiac-motion-cinematic .sjgsm-zodiac-cosmic-glow::before { opacity: 0.72; }
.sjgsm-zodiac-motion-cinematic .sjgsm-zodiac-cosmic-glow::after { opacity: 0.56; }
.sjgsm-zodiac-motion-cinematic .sjgsm-zodiac-constellations { opacity: 0.60; animation-duration: 28s; }
.sjgsm-zodiac-motion-cinematic .sjgsm-zodiac-stars { animation-duration: 22s; }
.sjgsm-zodiac-motion-cinematic .sjgsm-zodiac-star-wrap { animation-duration: calc(var(--fd) * 0.88); }
.sjgsm-zodiac-motion-cinematic .sjgsm-zodiac-star { animation-duration: calc(var(--d) * 0.84), calc(var(--vd) * 0.88); }

.sjgsm-zodiac-motion-ultra .sjgsm-zodiac-cosmic-glow { opacity: 0.82; animation-duration: 12s; }
.sjgsm-zodiac-motion-ultra .sjgsm-zodiac-cosmic-glow::before { opacity: 0.86; animation-duration: 11s; }
.sjgsm-zodiac-motion-ultra .sjgsm-zodiac-cosmic-glow::after { opacity: 0.70; animation-duration: 18s; }
.sjgsm-zodiac-motion-ultra .sjgsm-zodiac-constellations { opacity: 0.76; animation-duration: 24s; }
.sjgsm-zodiac-motion-ultra .sjgsm-zodiac-stars { animation-duration: 18s; }
.sjgsm-zodiac-motion-ultra .sjgsm-zodiac-star-wrap { animation-duration: calc(var(--fd) * 0.80); }
.sjgsm-zodiac-motion-ultra .sjgsm-zodiac-star { animation-duration: calc(var(--d) * 0.76), calc(var(--vd) * 0.80); }
.sjgsm-zodiac-motion-ultra .sjgsm-zodiac-shooting-star { height: 1.55px; box-shadow: 0 0 6px rgba(255, 232, 176, 0.56), 0 0 15px rgba(78, 163, 255, 0.28); }

.sjgsm-zodiac-sky-soft .sjgsm-zodiac-cosmic-glow { opacity: 0.44; }
.sjgsm-zodiac-sky-soft .sjgsm-zodiac-cosmic-glow::before { opacity: 0.40; }
.sjgsm-zodiac-sky-soft .sjgsm-zodiac-cosmic-glow::after { opacity: 0.28; }
.sjgsm-zodiac-sky-soft .sjgsm-zodiac-constellations { opacity: 0.34; }
.sjgsm-zodiac-sky-soft .sjgsm-zodiac-stars { opacity: 0.80; }

.sjgsm-zodiac-sky-premium .sjgsm-zodiac-cosmic-glow { opacity: 0.58; }
.sjgsm-zodiac-sky-premium .sjgsm-zodiac-constellations { opacity: 0.48; }

.sjgsm-zodiac-sky-ultra .sjgsm-zodiac-cosmic-glow { opacity: 0.76; }
.sjgsm-zodiac-sky-ultra .sjgsm-zodiac-cosmic-glow::before { opacity: 0.82; }
.sjgsm-zodiac-sky-ultra .sjgsm-zodiac-cosmic-glow::after { opacity: 0.62; }
.sjgsm-zodiac-sky-ultra .sjgsm-zodiac-constellations { opacity: 0.70; }
.sjgsm-zodiac-sky-ultra .sjgsm-zodiac-stars { opacity: 1; }

.sjgsm-zodiac-comets-soft .sjgsm-zodiac-shooting-star {
  height: 0.9px;
  box-shadow: 0 0 4px rgba(255, 232, 169, 0.30), 0 0 10px rgba(83, 165, 255, 0.14);
}
.sjgsm-zodiac-comets-soft .sjgsm-zodiac-shooting-star::after { opacity: 0.72; }

.sjgsm-zodiac-comets-premium .sjgsm-zodiac-shooting-star {
  height: 1.08px;
}
.sjgsm-zodiac-comets-premium .sjgsm-zodiac-shooting-star::after { opacity: 0.86; }

.sjgsm-zodiac-comets-ultra .sjgsm-zodiac-shooting-star {
  height: 1.28px;
  box-shadow: 0 0 7px rgba(255, 232, 176, 0.62), 0 0 17px rgba(78, 163, 255, 0.34);
}
.sjgsm-zodiac-comets-ultra .sjgsm-zodiac-shooting-star::after { opacity: 1; }

.sjgsm-zodiac-comet-tone-blue .sjgsm-zodiac-shooting-star {
  background: linear-gradient(90deg,
    rgba(230, 245, 255, 0.00) 0%,
    rgba(138, 202, 255, 0.04) 18%,
    rgba(150, 214, 255, 0.12) 40%,
    rgba(188, 231, 255, 0.26) 62%,
    rgba(220, 244, 255, 0.42) 82%,
    rgba(244, 252, 255, 0.58) 92%,
    rgba(255, 255, 255, 0.00) 100%);
  box-shadow: 0 0 4px rgba(180, 228, 255, 0.26), 0 0 10px rgba(99, 179, 255, 0.14);
}
.sjgsm-zodiac-comet-tone-blue .sjgsm-zodiac-shooting-star::after {
  background: radial-gradient(circle, rgba(255,255,255,0.96) 0%, rgba(228,244,255,0.94) 36%, rgba(165,217,255,0.54) 70%, rgba(165,217,255,0) 100%);
  box-shadow: 0 0 4px rgba(236,247,255,0.56), 0 0 9px rgba(138,204,255,0.24), 0 0 16px rgba(93,171,255,0.10);
}

.sjgsm-zodiac-comet-tone-gold .sjgsm-zodiac-shooting-star {
  background: linear-gradient(90deg,
    rgba(255, 246, 219, 0.00) 0%,
    rgba(255, 226, 155, 0.03) 18%,
    rgba(255, 230, 165, 0.10) 38%,
    rgba(255, 234, 184, 0.22) 58%,
    rgba(255, 224, 150, 0.38) 78%,
    rgba(255, 246, 221, 0.58) 92%,
    rgba(255, 247, 228, 0.00) 100%);
  box-shadow: 0 0 4px rgba(255, 232, 169, 0.26), 0 0 9px rgba(255, 209, 121, 0.12);
}
.sjgsm-zodiac-comet-tone-gold .sjgsm-zodiac-shooting-star::after {
  background: radial-gradient(circle, rgba(255,255,255,0.96) 0%, rgba(255,245,221,0.94) 34%, rgba(255,220,132,0.58) 70%, rgba(255,220,132,0) 100%);
  box-shadow: 0 0 4px rgba(255,244,221,0.58), 0 0 8px rgba(255,221,136,0.24), 0 0 14px rgba(255,206,102,0.10);
}
.sjgsm-zodiac-countdown { animation: sjgsm-zodiac-countdown-glow 3.4s ease-in-out infinite; }
.sjgsm-zodiac-motion-none .sjgsm-zodiac-countdown { animation: none; }

@keyframes sjgsm-zodiac-twinkle {
  0%, 100% {
    opacity: calc(var(--o) * 0.05);
    filter: brightness(0.68) saturate(0.92);
  }
  8% {
    opacity: calc(var(--o) * 0.18);
    filter: brightness(0.9) saturate(1);
  }
  18% {
    opacity: calc(var(--o) * 0.82);
    filter: brightness(1.22) saturate(1.12);
  }
  28% {
    opacity: calc(var(--o) * 0.12);
    filter: brightness(0.8) saturate(0.96);
  }
  42% {
    opacity: calc(var(--o) * 1.10);
    filter: brightness(1.72) saturate(1.34);
  }
  56% {
    opacity: calc(var(--o) * 0.16);
    filter: brightness(0.76) saturate(0.94);
  }
  70% {
    opacity: calc(var(--o) * 0.96);
    filter: brightness(1.38) saturate(1.20);
  }
  82% {
    opacity: calc(var(--o) * 0.22);
    filter: brightness(0.88) saturate(1);
  }
  92% {
    opacity: calc(var(--o) * 1.02);
    filter: brightness(1.46) saturate(1.22);
  }
}

@keyframes sjgsm-zodiac-star-float {
  0% { transform: translate3d(calc(var(--dx) * -0.35), calc(var(--dy) * -0.35), 0); }
  40% { transform: translate3d(calc(var(--dx) * -0.06), calc(var(--dy) * 0.08), 0); }
  100% { transform: translate3d(var(--dx), var(--dy), 0); }
}

@keyframes sjgsm-zodiac-star-vibrate {
  0% { transform: translate3d(0, 0, 0) scale(0.94); }
  22% { transform: translate3d(calc(var(--j) * -0.6), calc(var(--j) * 0.4), 0) scale(1); }
  48% { transform: translate3d(calc(var(--j) * 0.72), calc(var(--j) * -0.45), 0) scale(1.05); }
  74% { transform: translate3d(calc(var(--j) * -0.38), calc(var(--j) * -0.18), 0) scale(0.97); }
  100% { transform: translate3d(calc(var(--j) * 0.26), calc(var(--j) * 0.22), 0) scale(0.95); }
}

@keyframes sjgsm-zodiac-sky-drift {
  0% { transform: translate3d(-0.42%, -0.14%, 0); }
  50% { transform: translate3d(0.10%, 0.08%, 0); }
  100% { transform: translate3d(0.44%, 0.22%, 0); }
}

@keyframes sjgsm-zodiac-shoot {
  0%, 16% { opacity: 0; transform: translate3d(0, 0, 0) rotate(var(--angle)) scaleX(0.82); }
  24% { opacity: 0.34; }
  36% { opacity: 0.78; }
  62% { opacity: 0.66; }
  82% { opacity: 0; transform: translate3d(var(--tx), var(--ty), 0) rotate(var(--angle)) scaleX(1); }
  100% { opacity: 0; transform: translate3d(var(--tx), var(--ty), 0) rotate(var(--angle)) scaleX(1); }
}

@keyframes sjgsm-zodiac-cosmic-breathe {
  0%, 100% { opacity: 0.36; transform: scale(1); filter: saturate(1); }
  50% { opacity: 0.68; transform: scale(1.025); filter: saturate(1.22); }
}

@keyframes sjgsm-zodiac-nebula-swell {
  0% { transform: translate3d(-1.2%, -0.8%, 0) scale(0.98); filter: saturate(1) blur(0px); }
  50% { transform: translate3d(0.8%, 0.5%, 0) scale(1.05); filter: saturate(1.15) blur(0.2px); }
  100% { transform: translate3d(1.4%, 0.9%, 0) scale(1.10); filter: saturate(1.26) blur(0.4px); }
}

@keyframes sjgsm-zodiac-nebula-swell-2 {
  0% { transform: translate3d(1.1%, 0.2%, 0) scale(0.98); filter: saturate(1) blur(0px); }
  50% { transform: translate3d(-0.6%, 0.7%, 0) scale(1.04); filter: saturate(1.12) blur(0.25px); }
  100% { transform: translate3d(-1.2%, 1%, 0) scale(1.08); filter: saturate(1.22) blur(0.45px); }
}

@keyframes sjgsm-zodiac-constellation-drift {
  0% { transform: translate3d(-0.35%, -0.2%, 0); }
  50% { transform: translate3d(0.1%, 0.08%, 0); }
  100% { transform: translate3d(0.4%, 0.22%, 0); }
}

@keyframes sjgsm-zodiac-constellation-breathe {
  0%, 100% { opacity: 0.54; }
  50% { opacity: 0.94; }
}

@keyframes sjgsm-zodiac-const-line-glow {
  0%, 100% { stroke-opacity: 0.34; }
  50% { stroke-opacity: 0.88; }
}

@keyframes sjgsm-zodiac-const-node-glow {
  0%, 100% { opacity: 0.42; transform: scale(0.9); }
  50% { opacity: 1; transform: scale(1.18); }
}

@keyframes sjgsm-zodiac-countdown-glow {
  0%, 100% {
    text-shadow:
      0 0 4px rgba(255, 211, 115, 0.52),
      0 1px 3px rgba(0, 0, 0, 0.95),
      0 0 12px rgba(255, 205, 110, 0.22);
  }
  50% {
    text-shadow:
      0 0 7px rgba(255, 232, 165, 0.80),
      0 1px 3px rgba(0, 0, 0, 0.95),
      0 0 19px rgba(255, 205, 110, 0.42);
  }
}

@media (prefers-reduced-motion: reduce) {
  .sjgsm-zodiac-motion-layer { display: none !important; }
  .sjgsm-zodiac-countdown { animation: none !important; }
}


/* Premium Living Zodiac V17 */
.sjgsm-zodiac-stage::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  z-index: 2;
  box-shadow: inset 0 0 0 1px rgba(255, 214, 120, 0.16), inset 0 0 28px rgba(255, 208, 105, 0.08), inset 0 0 44px rgba(82, 151, 255, 0.07);
  opacity: 0.88;
  animation: sjgsm-zodiac-border-breathe 9.8s ease-in-out infinite;
}
.sjgsm-zodiac-border-breathing-no .sjgsm-zodiac-stage::after,
.sjgsm-zodiac-motion-none .sjgsm-zodiac-stage::after { animation: none; opacity: 0.50; }

.sjgsm-zodiac-active-aura,
.sjgsm-zodiac-wheel-sparkles {
  overflow: visible;
}

.sjgsm-zodiac-active-aura::before {
  content: "";
  position: absolute;
  left: var(--sjgsm-aura-x, 50%);
  top: var(--sjgsm-aura-y, 29%);
  width: var(--sjgsm-aura-size, 18%);
  height: var(--sjgsm-aura-size, 18%);
  transform: translate(-50%, -50%);
  border-radius: 999px;
  background:
    radial-gradient(circle, rgba(118, 180, 255, 0.30) 0%, rgba(118, 180, 255, 0.12) 34%, rgba(255, 214, 117, 0.10) 52%, rgba(255, 214, 117, 0.04) 68%, transparent 76%);
  filter: blur(2px);
  opacity: 0.95;
  animation: sjgsm-zodiac-active-aura-pulse 7.6s ease-in-out infinite;
}
.sjgsm-zodiac-aura-no .sjgsm-zodiac-active-aura { display: none; }

.sjgsm-zodiac-wheel-sparkle {
  position: absolute;
  left: var(--x);
  top: var(--y);
  width: var(--s);
  height: var(--s);
  transform: translate(-50%, -50%);
  border-radius: 999px;
  background: radial-gradient(circle, rgba(255, 248, 221, 0.98) 0%, rgba(255, 228, 147, 0.92) 32%, rgba(121, 185, 255, 0.40) 54%, transparent 72%);
  box-shadow: 0 0 5px rgba(255, 224, 140, 0.42), 0 0 12px rgba(114, 187, 255, 0.22);
  animation: sjgsm-zodiac-wheel-sparkle 4.8s ease-in-out var(--delay) infinite;
}
.sjgsm-zodiac-wheel-sparkles-no .sjgsm-zodiac-wheel-sparkles { display: none; }

@keyframes sjgsm-zodiac-active-aura-pulse {
  0%, 100% { opacity: 0.50; transform: translate(-50%, -50%) scale(0.96); }
  45% { opacity: 0.96; transform: translate(-50%, -50%) scale(1.10); }
  70% { opacity: 0.72; transform: translate(-50%, -50%) scale(1.04); }
}

@keyframes sjgsm-zodiac-wheel-sparkle {
  0%, 100% { opacity: 0.18; transform: translate(-50%, -50%) scale(0.65); }
  40% { opacity: 0.95; transform: translate(-50%, -50%) scale(1.1); }
  55% { opacity: 0.54; transform: translate(-50%, -50%) scale(0.86); }
}

@keyframes sjgsm-zodiac-border-breathe {
  0%, 100% { opacity: 0.62; box-shadow: inset 0 0 0 1px rgba(255, 214, 120, 0.14), inset 0 0 20px rgba(255, 208, 105, 0.07), inset 0 0 38px rgba(82, 151, 255, 0.06); }
  50% { opacity: 1; box-shadow: inset 0 0 0 1px rgba(255, 226, 154, 0.24), inset 0 0 30px rgba(255, 212, 125, 0.11), inset 0 0 56px rgba(96, 170, 255, 0.10); }
}

@media (prefers-reduced-motion: reduce) {
  .sjgsm-zodiac-stage::after,
  .sjgsm-zodiac-active-aura::before,
  .sjgsm-zodiac-wheel-sparkle { animation: none !important; }
}

.sjgsm-zodiac-moon-phase-no .sjgsm-zodiac-moon-phase { display: none; }


@media (prefers-reduced-motion: reduce) {
  .sjgsm-zodiac-date { animation: none !important; }
}

/* V17.3.0 — 24-hour zodiac-season celebration. */
.sjgsm-zodiac-confetti {
  position: absolute;
  inset: 0;
  z-index: 8;
  overflow: hidden;
  pointer-events: none;
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.45s ease;
}

.sjgsm-zodiac-celebrating .sjgsm-zodiac-confetti {
  opacity: 1;
  visibility: visible;
}

.sjgsm-zodiac-confetti-piece {
  position: absolute;
  left: var(--x);
  top: -4%;
  width: var(--size);
  height: calc(var(--size) * 1.8);
  border-radius: 45%;
  opacity: 0;
  transform-origin: 50% 50%;
  animation: sjgsm-zodiac-confetti-fall var(--duration) linear var(--delay) infinite;
  box-shadow: 0 0 6px rgba(255, 218, 126, 0.42);
}

.sjgsm-zodiac-confetti-gold {
  background: linear-gradient(135deg, #fff2b0 0%, #e5ad32 45%, #8d5a0d 100%);
}
.sjgsm-zodiac-confetti-ivory {
  background: linear-gradient(135deg, #fffdf0 0%, #f1dfaa 55%, #b99a55 100%);
}
.sjgsm-zodiac-confetti-blue {
  background: linear-gradient(135deg, #d9f3ff 0%, #5a9fd2 50%, #173f72 100%);
}

.sjgsm-zodiac-celebrating .sjgsm-zodiac-countdown {
  letter-spacing: 0.075em;
  color: #ffe5a6;
  text-shadow:
    0 0 5px rgba(255, 224, 146, 0.72),
    0 2px 4px rgba(0, 0, 0, 0.95),
    0 0 14px rgba(255, 195, 74, 0.38);
}

@keyframes sjgsm-zodiac-confetti-fall {
  0% {
    opacity: 0;
    transform: translate3d(0, -8%, 0) rotate(0deg) scale(0.86);
  }
  8% { opacity: 0.94; }
  88% { opacity: 0.88; }
  100% {
    opacity: 0;
    transform: translate3d(var(--drift), 112vh, 0) rotate(var(--spin)) scale(1.08);
  }
}

@media (prefers-reduced-motion: reduce) {
  .sjgsm-zodiac-confetti { display: none !important; }
}