.nebula{position:absolute;inset:-10%;z-index:-2;background:radial-gradient(ellipse at 46% 48%,#355db92b,transparent 35%),radial-gradient(ellipse at 63% 33%,#682b8320,transparent 28%);transform:translate(var(--px,0px),var(--py,0px))}
.stars{position:absolute;inset:-20px;z-index:-1;transform:translate(calc(var(--px,0px)*.5),calc(var(--py,0px)*.5))}
.star{position:absolute;width:var(--size);height:var(--size);border-radius:50%;background:#c4d7ff;opacity:var(--opacity)}
.star.bright{box-shadow:0 0 7px #a3c8ff80}
.system{position:absolute;inset:76px 16px 94px;isolation:isolate}
.orbits,.energy-layer{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;overflow:visible}
.orbits ellipse{fill:none;stroke:currentColor;stroke-width:1;stroke-dasharray:3 9;vector-effect:non-scaling-stroke}
.energy-layer{z-index:1}
.core{position:absolute;left:50%;top:50%;width:var(--core-size,240px);aspect-ratio:1;transform:translate(-50%,-50%);z-index:2}
.core-artwork{width:100%;height:100%;border-radius:50%;filter:drop-shadow(0 0 24px #4a8dff40);transition:transform .4s ease,filter .4s ease}
.core-artwork img{display:block;width:100%;height:100%;object-fit:contain;pointer-events:none;user-select:none}
.core-artwork:focus-visible{transform:scale(1.12);filter:brightness(1.1) drop-shadow(0 0 35px #4a8dff70)}
@media(hover:hover){.core-artwork:hover{transform:scale(1.12);filter:brightness(1.1) drop-shadow(0 0 35px #4a8dff70)}}
.satellite{position:absolute;left:0;top:0;z-index:3;display:flex;align-items:center;flex-direction:column;width:max-content;min-width:0;padding:var(--satellite-padding,8px);border:0;background:transparent;text-align:center;will-change:transform}
.sphere{display:block;width:var(--satellite-size,120px);height:var(--satellite-size,120px);filter:drop-shadow(0 0 8px rgba(var(--color),.2));transition:transform .4s ease,filter .4s ease}
.sphere img{display:block;width:100%;height:100%;object-fit:contain;pointer-events:none;user-select:none}
.division-name{margin-top:var(--label-gap,6px);font-size:var(--label-size,18px);font-weight:900;letter-spacing:.08em;line-height:1.2;transition:color .3s}
.soon{font-size:var(--caption-size,14px);color:var(--muted);margin-top:var(--caption-gap,4px);line-height:1.3}
.satellite.is-active .sphere{transform:scale(1.12);filter:brightness(1.12) drop-shadow(0 0 14px rgba(var(--color),.55))}
.satellite.is-active .division-name{color:rgb(var(--color))}
.energy-path{fill:none;stroke-width:1.1;opacity:.8}
.energy-halo{fill:none;stroke-width:6;opacity:.45;filter:url(#glow)}
.energy-flow{fill:none;stroke-width:2;stroke-dasharray:3 28;stroke-linecap:round}
.visually-hidden{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}
@media(max-width:600px){.system{inset:80px 8px 100px}}
@media(max-height:500px) and (min-width:601px){.system{inset:16px 130px 20px}}