/* ORBITA 17 · DEEP SPACE FINISH
   Acabamento vetorial em alta definição, com movimento localizado e leve. */
#app-shell .orbita-universe-panel {
  border-color: rgba(137, 211, 255, .34);
  border-radius: 27px;
  background:
    radial-gradient(ellipse at 76% 48%, rgba(65, 198, 235, .17), transparent 43%),
    radial-gradient(ellipse at 12% 8%, rgba(162, 94, 246, .24), transparent 45%),
    radial-gradient(ellipse at 50% 112%, rgba(39, 95, 167, .16), transparent 48%),
    linear-gradient(132deg, #17142c 0%, #0a1425 58%, #0b1c2d 100%);
  box-shadow:
    0 24px 56px rgba(0, 0, 0, .32),
    0 0 0 1px rgba(117, 205, 255, .055),
    inset 0 1px 0 rgba(255, 255, 255, .10),
    inset 0 -24px 50px rgba(4, 10, 25, .25);
}
#app-shell .orbita-universe-panel::before {
  opacity: .32;
  background-image:
    linear-gradient(rgba(151, 190, 235, .075) 1px, transparent 1px),
    linear-gradient(90deg, rgba(151, 190, 235, .075) 1px, transparent 1px),
    radial-gradient(circle at 72% 44%, rgba(126, 230, 255, .17) 0 1px, transparent 2px);
  background-size: 30px 30px, 30px 30px, 73px 67px;
}
#app-shell .orbita-universe-panel::after {
  content: "";
  position: absolute;
  z-index: 0;
  inset: 1px;
  border: 1px solid rgba(209, 238, 255, .10);
  border-radius: inherit;
  background: linear-gradient(118deg, rgba(255,255,255,.045), transparent 24%, transparent 72%, rgba(96,215,246,.045));
  pointer-events: none;
}
#app-shell .orbita-universe-copy {
  z-index: 2;
}
#app-shell .orbita-universe-copy > .eyebrow {
  color: #8deeff;
  letter-spacing: .17em;
  text-shadow: 0 0 14px rgba(93, 223, 255, .24);
}
#app-shell .orbita-universe-copy h2 {
  text-shadow: 0 4px 24px rgba(160, 112, 255, .16);
}
#app-shell .orbita-universe-copy h2 span {
  background-image: linear-gradient(100deg, #e0baff 0%, #a7d8ff 47%, #82f3f1 100%);
}
#app-shell .orbita-universe-copy p {
  color: #c1c7da;
  line-height: 1.75;
}
#app-shell .orbita-universe-legend {
  gap: 11px 16px;
  color: #c0c7dc;
}
#app-shell .orbita-legend-dot {
  width: 7px;
  height: 7px;
  box-shadow: 0 0 7px currentColor, 0 0 14px currentColor;
}
#app-shell .orbita-universe-scene {
  width: min(100%, 480px);
  border-radius: 20px;
  background:
    radial-gradient(ellipse at 50% 49%, rgba(105, 106, 223, .13), transparent 35%),
    radial-gradient(circle at 17% 19%, rgba(218, 245, 255, .7) 0 1px, transparent 1.6px),
    radial-gradient(circle at 84% 23%, rgba(181, 226, 255, .65) 0 1px, transparent 1.6px),
    radial-gradient(circle at 23% 78%, rgba(205, 185, 255, .65) 0 1px, transparent 1.6px),
    radial-gradient(circle at 78% 82%, rgba(218, 249, 255, .55) 0 1px, transparent 1.6px);
  background-size: auto, 53px 47px, 71px 63px, 83px 59px, 61px 73px;
}
#app-shell .orbita-universe-scene::before {
  content: "";
  position: absolute;
  z-index: 0;
  inset: 5% 3%;
  border: 1px solid rgba(148, 210, 255, .11);
  border-radius: 50%;
  background:
    radial-gradient(circle, rgba(176, 229, 255, .62) 0 1px, transparent 1.6px);
  background-size: 31px 31px;
  opacity: .30;
  mask-image: radial-gradient(ellipse, #000 28%, transparent 77%);
  pointer-events: none;
}
#app-shell .orbita-universe-scene::after {
  content: "";
  position: absolute;
  z-index: 1;
  inset: 7% 2%;
  border-radius: 50%;
  background:
    linear-gradient(90deg, transparent 5%, rgba(112, 232, 255, .10) 50%, transparent 95%),
    linear-gradient(0deg, transparent 49.8%, rgba(157, 201, 255, .08) 50%, transparent 50.3%);
  opacity: .55;
  pointer-events: none;
}
#app-shell .orbita-universe-lensflare {
  position: absolute;
  z-index: 3;
  top: 49.5%;
  left: 8%;
  width: 84%;
  height: 1px;
  transform: rotate(-13deg);
  background: linear-gradient(90deg, transparent, rgba(111, 229, 255, .20) 27%, rgba(240, 250, 255, .78) 50%, rgba(171, 133, 255, .22) 73%, transparent);
  box-shadow: 0 0 9px rgba(108, 225, 255, .38);
  opacity: .72;
  pointer-events: none;
}
#app-shell .orbita-universe-lensflare::after {
  content: "";
  position: absolute;
  top: -21px;
  left: 50%;
  width: 1px;
  height: 42px;
  background: linear-gradient(transparent, rgba(223, 247, 255, .50), transparent);
}
#app-shell .orbita-universe-hud {
  position: absolute;
  z-index: 6;
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 5px 7px;
  border: 1px solid rgba(139, 218, 255, .17);
  border-radius: 6px;
  background: rgba(8, 17, 34, .56);
  color: rgba(175, 213, 235, .72);
  font: 600 6px/1 'DM Sans', system-ui, sans-serif;
  letter-spacing: .16em;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.055), 0 4px 16px rgba(0,0,0,.12);
  pointer-events: none;
}
#app-shell .orbita-universe-hud b {
  color: #8ef2ff;
  font-weight: 700;
}
#app-shell .orbita-universe-hud.hud-north {
  top: 2%;
  left: 2%;
}
#app-shell .orbita-universe-hud.hud-south {
  bottom: 2%;
  left: 2%;
}
#app-shell .orbita-universe-nebula {
  filter: blur(22px);
  opacity: .34;
}
#app-shell .orbita-universe-star {
  box-shadow: 0 0 8px 2px rgba(125, 225, 255, .62), 0 0 16px rgba(125, 225, 255, .24);
  animation: orbita95-star-glimmer 5.5s ease-in-out infinite;
}
#app-shell .orbita-universe-star.star-two { animation-delay: -1.8s; }
#app-shell .orbita-universe-star.star-three { animation-delay: -3.4s; }
#app-shell .orbita-universe-star.star-four { animation-delay: -2.6s; }
#app-shell .orbita-universe-ring {
  border-width: 1px;
  opacity: .88;
  box-shadow: 0 0 16px var(--orbita-orbit-glow), inset 0 0 13px rgba(196, 159, 255, .075);
}
#app-shell .orbita-universe-ring::after {
  content: "";
  position: absolute;
  inset: 7px;
  border: 1px dashed rgba(205, 224, 255, .13);
  border-radius: inherit;
}
#app-shell .orbita-universe-planet {
  border-color: rgba(255, 255, 255, .9);
  box-shadow:
    0 0 8px currentColor,
    0 0 19px currentColor,
    0 0 31px rgba(83, 231, 245, .25),
    inset -3px -3px 5px rgba(3, 12, 36, .58),
    inset 2px 2px 4px rgba(255, 255, 255, .48);
}
#app-shell .orbita-universe-planet::before {
  content: "";
  position: absolute;
  inset: 1px;
  border: 1px solid rgba(255,255,255,.24);
  border-radius: inherit;
  background: linear-gradient(145deg, rgba(255,255,255,.26), transparent 42%, rgba(3,11,36,.32));
  pointer-events: none;
}
#app-shell .orbita-universe-planet i {
  position: absolute;
  top: 2px;
  left: 3px;
  width: 4px;
  height: 3px;
  border-radius: 50%;
  background: rgba(255,255,255,.96);
  box-shadow: 0 0 6px 2px rgba(255,255,255,.62);
}
#app-shell .orbita-universe-orbit.orbit-one .orbita-universe-planet {
  background:
    radial-gradient(ellipse at 34% 25%, rgba(255,255,255,.98) 0 7%, transparent 9%),
    repeating-linear-gradient(156deg, transparent 0 3px, rgba(147, 240, 255, .15) 4px, transparent 5px),
    radial-gradient(circle at 30% 24%, #dffaff 0 8%, #77dff5 24%, #2a83ca 63%, #101e49 100%);
}
#app-shell .orbita-universe-orbit.orbit-two .orbita-universe-planet {
  background:
    radial-gradient(circle at 31% 24%, #fff 0 7%, transparent 10%),
    repeating-linear-gradient(22deg, transparent 0 3px, rgba(229, 203, 255, .14) 4px, transparent 5px),
    radial-gradient(circle at 30% 24%, #f8eaff, #c48af5 42%, #6b3da3 75%, #24143e);
  box-shadow: 0 0 10px #c69aff, 0 0 22px rgba(186,124,250,.7), inset -3px -3px 5px rgba(20,8,42,.6);
}
#app-shell .orbita-universe-orbit.orbit-two .orbita-universe-planet::after {
  content: "";
  position: absolute;
  z-index: -1;
  width: 22px;
  height: 8px;
  border: 1px solid rgba(223, 190, 255, .78);
  border-left-color: rgba(223, 190, 255, .20);
  border-right-color: rgba(223, 190, 255, .20);
  border-radius: 50%;
  transform: rotate(-24deg);
  box-shadow: 0 0 8px rgba(190, 136, 255, .35);
}
#app-shell .orbita-universe-orbit.orbit-three .orbita-universe-planet {
  background:
    radial-gradient(circle at 30% 25%, #fff 0 8%, transparent 11%),
    radial-gradient(circle at 35% 30%, #e6f4ff 0 15%, #b4d4f7 52%, #6179a6 100%);
  box-shadow: 0 0 8px #dceeff, 0 0 17px rgba(176, 218, 255, .50), inset -2px -2px 4px rgba(13, 24, 54, .48);
}
#app-shell .orbita-universe-orbit.orbit-four .orbita-universe-planet {
  background:
    radial-gradient(circle at 31% 22%, #fff 0 8%, transparent 11%),
    repeating-linear-gradient(155deg, transparent 0 2px, rgba(186,255,245,.20) 3px, transparent 4px),
    radial-gradient(circle at 32% 27%, #eaffff, #7cddd5 52%, #1d697c 100%);
}
#app-shell .orbita-universe-core {
  border-color: rgba(255, 246, 255, .94);
  background:
    radial-gradient(circle at 31% 23%, #fff 0 3%, #fff4ff 9%, #e9ceff 17%, #b77dff 35%, #7846c2 58%, #332454 82%, #11162b 100%);
  box-shadow:
    0 0 19px rgba(230, 193, 255, .95),
    0 0 46px rgba(165, 101, 239, .70),
    0 0 92px rgba(99, 120, 237, .28),
    inset -9px -10px 17px rgba(23,12,46,.58),
    inset 5px 5px 14px rgba(255,255,255,.54);
}
#app-shell .orbita-universe-core::before {
  content: "";
  position: absolute;
  z-index: -1;
  inset: -24px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(171, 132, 255, .30), rgba(83, 202, 255, .12) 47%, transparent 72%);
  opacity: .72;
  animation: orbita95-core-breathe 6.5s ease-in-out infinite;
  pointer-events: none;
}
#app-shell .orbita-universe-core::after {
  content: "";
  position: absolute;
  inset: 17px;
  border: 1px solid rgba(239, 221, 255, .56);
  border-radius: 50%;
  box-shadow: 0 0 12px rgba(174, 129, 255, .48), inset 0 0 9px rgba(196, 150, 255, .30);
  pointer-events: none;
}
#app-shell .orbita-universe-corona {
  inset: -13px;
  border-color: rgba(131, 238, 255, .52);
  box-shadow: 0 0 27px rgba(105,214,255,.32), inset 0 0 15px rgba(195,148,255,.24);
}
#app-shell .orbita-universe-corona::after {
  content: "";
  position: absolute;
  inset: -7px;
  border: 1px dashed rgba(211, 187, 255, .38);
  border-radius: 50%;
  transform: rotate(-22deg);
  animation: orbita95-corona-turn 54s linear infinite;
}
#app-shell .orbita-universe-caption {
  right: 2%;
  bottom: 2%;
  color: rgba(184, 218, 240, .72);
  text-shadow: 0 0 10px rgba(113, 225, 255, .20);
  letter-spacing: .23em;
}
#app-shell .orbita-universe-caption b { color: #9bf5ff; }
@keyframes orbita95-core-breathe {
  0%, 100% { opacity: .46; }
  50% { opacity: .86; }
}
@keyframes orbita95-corona-turn {
  from { transform: rotate(-22deg); }
  to { transform: rotate(338deg); }
}
@keyframes orbita95-star-glimmer {
  0%, 100% { opacity: .52; }
  50% { opacity: 1; }
}
@media (max-width: 900px) {
  #app-shell .orbita-universe-panel {
    border-radius: 23px;
  }
  #app-shell .orbita-universe-scene {
    width: min(100%, 400px);
  }
  #app-shell .orbita-universe-hud {
    font-size: 5px;
    padding: 4px 5px;
  }
}
@media (max-width: 420px) {
  #app-shell .orbita-universe-scene {
    height: 228px;
  }
  #app-shell .orbita-universe-hud {
    letter-spacing: .10em;
  }
  #app-shell .orbita-universe-panel::after {
    border-radius: inherit;
  }
}
@media (prefers-reduced-motion: reduce) {
  #app-shell .orbita-universe-star,
  #app-shell .orbita-universe-core::before,
  #app-shell .orbita-universe-corona::after {
    animation: none !important;
  }
}
@media (prefers-reduced-data: reduce) {
  #app-shell .orbita-universe-star,
  #app-shell .orbita-universe-core::before,
  #app-shell .orbita-universe-corona::after {
    animation: none !important;
  }
  #app-shell .orbita-universe-nebula {
    filter: none !important;
  }
}
@media (hover: none), (pointer: coarse) {
  #app-shell .orbita-universe-scene {
    contain: paint;
  }
  #app-shell .orbita-universe-lensflare {
    opacity: .56;
  }
}