@layer components {
:host{
  display:block;
}

/* Premium container (matches original look) */
.constellation-wrap{
  margin-top: 16px;
  border-radius: 24px;
  overflow: hidden;
  border: 1px solid rgba(255,255,255,0.10);
  box-shadow: var(--shadow, 0 18px 60px rgba(0,0,0,0.62));
  background: rgba(0,0,0,0.18);
  width: min(1680px, 98vw);
  margin-left: auto;
  margin-right: auto;
}

.constellation-scene{
  width: 100%;
  height: clamp(520px, 78vh, 760px);
  border-radius: 0;
  overflow: hidden;
  background:
    radial-gradient(circle at 35% 18%, rgba(255,255,255,0.06), transparent 40%),
    radial-gradient(circle at 70% 55%, rgba(185,140,255,0.10), transparent 45%),
    linear-gradient(180deg, #04040a, #000);
  border: none;
  user-select:none;
  position:relative;
}

canvas{
  width:100%;
  height:100%;
  display:block;
  cursor:default;
}
}