#decor-layer{
  position:fixed;inset:0;z-index:0;pointer-events:none;overflow:hidden;
  contain:strict;isolation:isolate;color:#6FE5FF;
}
#decor-layer::before{
  content:"";position:absolute;inset:-12%;
  background:
    radial-gradient(circle at 18% 28%,rgba(111,229,255,.055) 0 1px,transparent 1.5px),
    radial-gradient(circle at 73% 62%,rgba(255,255,255,.045) 0 1px,transparent 1.3px),
    radial-gradient(ellipse at 78% 16%,rgba(63,150,181,.09),transparent 34%),
    radial-gradient(ellipse at 15% 82%,rgba(40,88,122,.07),transparent 38%);
  background-size:97px 97px,151px 151px,100% 100%,100% 100%;
  opacity:.75;animation:decor-star-breathe 9s ease-in-out infinite;
}
#decor-layer::after{
  content:"";position:absolute;inset:0;
  background:
    linear-gradient(rgba(111,229,255,.018) 1px,transparent 1px),
    linear-gradient(90deg,rgba(111,229,255,.018) 1px,transparent 1px);
  background-size:72px 72px;
  mask-image:radial-gradient(ellipse at 50% 45%,#000,transparent 72%);
  opacity:.28;
}
#decor-layer .summer-comet{
  position:absolute;top:13%;right:8%;width:clamp(90px,12vw,180px);height:36px;
  opacity:.42;transform:rotate(-13deg);
  animation:decor-comet-drift 18s ease-in-out infinite;
}
#decor-layer .summer-comet-core{
  position:absolute;right:0;top:15px;width:5px;height:5px;border-radius:50%;
  background:#dffaff;box-shadow:0 0 8px #6FE5FF,0 0 22px rgba(111,229,255,.6);
}
#decor-layer .summer-comet-tail{
  position:absolute;right:4px;top:17px;width:100%;height:1px;
  background:linear-gradient(90deg,transparent,rgba(111,229,255,.06),rgba(111,229,255,.55));
  transform-origin:right center;filter:blur(.15px);
}
#decor-layer .summer-constellation{
  position:absolute;left:5%;bottom:9%;width:clamp(120px,16vw,230px);
  opacity:.32;filter:drop-shadow(0 0 5px rgba(111,229,255,.18));
  animation:decor-constellation-breathe 11s ease-in-out infinite;
}
#decor-layer .summer-constellation-line{
  fill:none;stroke:currentColor;stroke-width:.55;stroke-opacity:.35;
}
#decor-layer .summer-constellation-star{
  fill:#dffaff;stroke:#6FE5FF;stroke-width:.45;
}
#decor-layer .orbital-glass{
  position:absolute;right:6%;bottom:10%;width:clamp(76px,8vw,116px);
  aspect-ratio:1;border:1px solid rgba(111,229,255,.13);border-radius:50%;
  background:radial-gradient(circle at 38% 32%,rgba(255,255,255,.045),transparent 48%);
  box-shadow:inset 0 0 18px rgba(111,229,255,.025),0 0 24px rgba(111,229,255,.025);
  opacity:.42;animation:decor-orbit-float 13s ease-in-out infinite;
}
#decor-layer .orbital-ring{
  position:absolute;inset:19%;border:1px solid rgba(111,229,255,.2);
  border-radius:50%;transform:rotate(58deg) scaleY(.42);
}
#decor-layer .orbital-moon{
  position:absolute;width:4px;height:4px;border-radius:50%;left:48%;top:10%;
  background:#dffaff;box-shadow:0 0 7px rgba(111,229,255,.8);
  animation:decor-moon-pulse 5s ease-in-out infinite;
}
#decor-layer .cool-mote{
  position:absolute;width:var(--mote-size);height:var(--mote-size);border-radius:50%;
  background:rgba(174,241,255,.65);box-shadow:0 0 8px rgba(111,229,255,.35);
  opacity:0;animation:decor-mote-rise var(--mote-speed) ease-in-out var(--mote-delay) infinite;
}
@keyframes decor-star-breathe{50%{opacity:.48;transform:scale(1.012)}}
@keyframes decor-comet-drift{50%{transform:translate(-14px,7px) rotate(-13deg);opacity:.58}}
@keyframes decor-constellation-breathe{50%{opacity:.44;transform:translateY(-3px)}}
@keyframes decor-orbit-float{50%{transform:translateY(-6px) rotate(3deg);opacity:.52}}
@keyframes decor-moon-pulse{50%{transform:scale(1.7);opacity:.55}}
@keyframes decor-mote-rise{
  0%,100%{opacity:0;transform:translate3d(0,12px,0)}
  30%{opacity:.34}70%{opacity:.12;transform:translate3d(7px,-26px,0)}
}
@media (prefers-reduced-motion:reduce){
  #decor-layer::before,#decor-layer .summer-comet,#decor-layer .summer-constellation,
  #decor-layer .orbital-glass,#decor-layer .orbital-moon,#decor-layer .cool-mote{animation:none}
}