/* Shared decorative universe. The parent [data-universe] owns geometry and clipping. */
.widais-universe-scene {
  position: absolute;
  z-index: -1;
  inset: 0;
  overflow: hidden;
  border-radius: inherit;
  pointer-events: none;
  background: #050505;
}
/* Static stars also render when JavaScript or canvas is unavailable. */
.widais-universe-scene::before {
  content: '';
  position: absolute;
  inset: 0;
  opacity: .7;
  background-image: radial-gradient(1px 1px at 15% 20%,#c0c8d5 90%,transparent), radial-gradient(1px 1px at 67% 70%,#798ca9 90%,transparent), radial-gradient(1px 1px at 80% 35%,#e5e6ea 90%,transparent);
  background-size: 173px 211px,233px 307px,347px 263px;
}
[data-universe][data-universe-ready] .widais-universe-scene::before { opacity: 0; }
.widais-universe-stars { position: absolute; inset: 0; display: block; width: 100%; height: 100%; }
.widais-universe-planet { position: absolute; display: block; border-radius: 50%; aspect-ratio: 1; }
.widais-universe-planet-horizon {
  width: clamp(360px,41vw,600px);
  right: -10%;
  bottom: -40%;
  background: radial-gradient(circle at 31% 21%,#121b27 0%,#091018 30%,#030506 57%,#010101 74%);
  box-shadow: -1px -2px 0 #6e8ca155,-3px -5px 22px #789aba13,inset 2px 3px 18px #799cb41c;
  animation: universe-horizon 26s ease-in-out infinite alternate;
}
.widais-universe-planet-ringed {
  width: clamp(65px,8vw,110px);
  right: 29%;
  top: 8%;
  background: radial-gradient(circle at 27% 25%,#b49b78 0%,#716044 20%,#302d28 43%,#0b0b0c 68%);
  box-shadow: inset 1px 1px 2px #ead8b966,6px 10px 28px #0009;
  transform: rotate(-25deg);
  animation: universe-planet-drift 24s ease-in-out infinite alternate;
}
.widais-universe-planet-ringed::before,
.widais-universe-planet-ringed::after {
  content: '';
  position: absolute;
  inset: 28% -50%;
  border: 5px solid #aa977747;
  border-radius: 50%;
  box-shadow: 0 0 0 2px #a9926f12,0 0 0 5px #a9926f12;
  transform: rotate(-5deg);
}
.widais-universe-planet-ringed::before { clip-path: inset(50% 0 0); }
.widais-universe-planet-ringed::after { clip-path: inset(0 0 50%); opacity: .24; }
.widais-universe-planet-distant {
  width: clamp(23px,3vw,42px);
  bottom: 10%;
  left: 16%;
  background: radial-gradient(circle at 25% 30%,#96aabb,#2e3e50 28%,#0a1017 59%,#020304 80%);
  box-shadow: -1px 0 2px #b3dafc33;
  animation: universe-distant-drift 20s ease-in-out infinite alternate;
}
[data-universe] .widais-universe-motion:focus-visible { outline: 2px solid #9adeff; outline-offset: 4px; }
[data-universe] .widais-universe-motion {
  position: absolute;
  z-index: 5;
  top: 16px;
  right: 16px;
  display: grid;
  place-items: center;
  width: 36px;
  height: 36px;
  min-height: 0;
  padding: 0;
  border: 1px solid #ffffff1f;
  border-radius: 12px;
  background: #050505;
  color: #a4a8ac;
  cursor: pointer;
  box-shadow: none;
}
[data-universe] .widais-universe-motion[hidden] { display: none; }
.widais-universe-motion svg { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 1.5; stroke-linecap: round; stroke-linejoin: round; }
.widais-universe-motion .widais-universe-play,
.widais-universe-motion[aria-pressed="true"] .widais-universe-pause { display: none; }
.widais-universe-motion[aria-pressed="true"] .widais-universe-play { display: block; }
[data-universe] .widais-universe-motion:hover { color: #fff; border-color: #ffffff40; }

@keyframes universe-planet-drift { to { transform: translate3d(8px,16px,0) rotate(-19deg); } }
@keyframes universe-distant-drift { to { transform: translate3d(-10px,-16px,0); } }
@keyframes universe-horizon { to { transform: translate3d(-18px,-10px,0) rotate(6deg); } }
[data-universe][data-universe-paused] .widais-universe-planet,
[data-universe]:not([data-universe-ready]) .widais-universe-planet { animation-play-state: paused; }

@media (max-width: 760px) {
  .widais-universe-planet-ringed { width: 62px; top: auto; right: 5%; bottom: 32%; }
  .widais-universe-planet-distant { left: 8%; bottom: 17%; }
  .widais-universe-planet-horizon { width: 390px; right: -210px; bottom: -175px; }
}
@media (prefers-reduced-motion: reduce) {
  .widais-universe-planet { animation: none; }
}