/* An independent neural constellation, above the portrait and below the OS controls. */
.network-orb {
  position: absolute;
  top: 60px;
  left: clamp(96px, 9vw, 175px);
  right: auto;
  width: clamp(240px, 23vw, 280px);
  aspect-ratio: 1;
  z-index: 3;
  pointer-events: none;
  user-select: none;
  contain: layout style;
  transition: opacity .35s ease;
}
.network-orb canvas { display: block; width: 100%; height: 100%; }
.network-orb-caption {
  position: absolute; right: 13%; top: 6%;
  display: grid; grid-template-columns: 4px auto; align-items: center; gap: 6px 7px;
  font-size: 7px; font-weight: 600; letter-spacing: .19em; color: #507aa8;
}
.network-orb-caption i { width: 4px; height: 4px; border-radius: 50%; background: #5ba6e8; box-shadow: 0 0 7px #64bdff99; }
.network-orb-caption span { grid-column: 2; font-size: 5px; letter-spacing: .16em; color: #8ca1ba; }
.desktop-meta { z-index: 5; }
.welcome { z-index: 4; }
.has-open-windows .network-orb { opacity: .22; }
@media (min-width: 701px) and (max-width: 1100px) {
  .network-orb { width: 250px; left: 88px; top: 62px; }
}
@media (min-width: 701px) and (max-height: 730px) {
  .network-orb { width: clamp(220px, 23vw, 280px); top: 60px; }
}
@media (max-width: 700px) {
  .network-orb { width: clamp(190px, 51vw, 215px); top: 68px; left: auto; right: 9px; z-index: 2; }
  .network-orb-caption { top: 8%; right: 8%; font-size: 6px; }
  .network-orb-caption span { font-size: 4px; }
  .welcome h1 { text-shadow: 0 0 7px #f8fbff, 0 1px 2px #f8fbff; }
  .has-open-windows .network-orb { visibility: hidden; }
}
@media (max-width: 700px) and (max-height: 740px) {
  .network-orb { width: 174px; top: 65px; right: 10px; }
}
@media (max-width: 700px) and (max-height: 590px) {
  .network-orb { width: 154px; right: 12px; top: 58px; }
  .network-orb-caption { display: none; }
}
@media (min-width: 701px) and (max-height: 520px) {
  .network-orb { width: 185px; top: 57px; left: 75px; }
}
@media (prefers-reduced-motion: reduce) { .network-orb { transition: none; } }
html[data-reduced-motion="true"] .network-orb { transition: none; }