.socials-magazine {
  position: absolute;
  z-index: 7;
  left: 0;
  top: 79%;
  display: block;
  width: 100%;
  height: 21%;
  min-width: 2.75rem;
  min-height: 2.75rem;
  border-radius: 0;
  clip-path: polygon(0 12%, 4% 0, 96% 0, 100% 12%, 100% 100%, 0 100%);
  background: transparent;
  cursor: pointer;
  text-decoration: none;
}

.socials-magazine:focus-visible {
  outline: 0.12rem dashed rgba(255, 243, 109, 0.78);
  outline-offset: 0.16rem;
}

.scene--socials,
.scene--terminal {
  min-height: 0;
}

.socials-crt-hotspot,
.socials-board-hotspot,
.terminal-hotspot {
  position: absolute;
  z-index: 7;
  display: block;
  border: 0;
  border-radius: 0.35rem;
  background: transparent;
  color: transparent;
  text-decoration: none;
  cursor: pointer;
  transition: background-color 150ms ease, box-shadow 150ms ease, filter 150ms ease;
}

.socials-crt-hotspot {
  left: 36.4%;
  top: 41.8%;
  width: 12.8%;
  height: 14.8%;
  overflow: hidden;
  border-radius: 14% / 10%;
  isolation: isolate;
}

.socials-crt-hotspot::before {
  position: absolute;
  inset: 0;
  border-radius: inherit;
  background:
    repeating-linear-gradient(180deg, transparent 0 3px, rgba(122, 255, 150, 0.032) 3px 4px),
    radial-gradient(ellipse at center, rgba(91, 255, 132, 0.12), rgba(43, 176, 88, 0.035) 58%, transparent 82%);
  box-shadow: inset 0 0 1.25rem rgba(91, 255, 132, 0.14);
  opacity: 0;
  pointer-events: none;
  -webkit-backdrop-filter: brightness(1.035) contrast(1.025) saturate(1.08);
  backdrop-filter: brightness(1.035) contrast(1.025) saturate(1.08);
  content: "";
  transition: opacity 180ms ease, box-shadow 180ms ease;
}

@media (hover: hover) and (pointer: fine) {
  .socials-crt-hotspot:hover::before {
    opacity: 0.46;
    animation: socials-crt-phosphor-drift 1.8s steps(2, end) infinite;
  }
}

.socials-crt-hotspot:focus-visible {
  outline: 0.11rem solid rgba(118, 255, 153, 0.78);
  outline-offset: 0.11rem;
}

.socials-crt-hotspot:focus-visible::before {
  box-shadow: inset 0 0 1.45rem rgba(91, 255, 132, 0.2);
  opacity: 0.62;
}

.socials-crt-hotspot:active::before {
  box-shadow: inset 0 0 1.6rem rgba(91, 255, 132, 0.22);
  opacity: 0.7;
  transition-duration: 60ms;
}

@keyframes socials-crt-phosphor-drift {
  0% { background-position: 0 0, center; }
  100% { background-position: 0 4px, center; }
}

.socials-board-hotspot {
  z-index: 8;
  overflow: hidden;
  border-radius: 0.18rem;
}

.socials-board-hotspot::after {
  position: absolute;
  inset: 0;
  border-radius: inherit;
  background: rgba(255, 222, 177, 0.018);
  box-shadow: inset 0 0 0.7rem rgba(204, 62, 37, 0.08);
  opacity: 0;
  pointer-events: none;
  content: "";
  transition: opacity 140ms ease;
}

@media (hover: hover) and (pointer: fine) {
  .socials-board-hotspot:hover::after { opacity: 0.48; }
}

.socials-board-hotspot:focus-visible {
  outline: 0.1rem solid rgba(230, 92, 57, 0.78);
  outline-offset: 0.08rem;
}

.socials-board-hotspot:focus-visible::after { opacity: 0.66; }

.socials-board-hotspot[aria-disabled="true"] {
  cursor: default;
  pointer-events: none;
}

/* Socials Computer Room cork-board cards — Desktop. */
.socials-board-hotspot--youtube { left: 77.1%; top: 17.8%; width: 6.7%; height: 7.2%; }
.socials-board-hotspot--instagram { left: 84.4%; top: 17.8%; width: 7.3%; height: 7.2%; }
.socials-board-hotspot--tiktok { left: 77.1%; top: 26.2%; width: 6.7%; height: 7.2%; }
.socials-board-hotspot--threads { left: 84.4%; top: 26.2%; width: 7.3%; height: 7.2%; }
.socials-board-hotspot--facebook { left: 77.1%; top: 34.7%; width: 6.7%; height: 7.2%; }
.socials-board-hotspot--x { left: 84.4%; top: 34.7%; width: 7.3%; height: 7.2%; }
.socials-board-hotspot--bandcamp { left: 77.1%; top: 43.1%; width: 6.7%; height: 6.8%; }
.socials-board-hotspot--soundcloud { left: 84.4%; top: 43.1%; width: 7.3%; height: 6.8%; }

.terminal-hotspot:is(:hover, :focus-visible) {
  outline: 0.12rem dashed rgba(111, 255, 133, 0.92);
  outline-offset: 0.08rem;
  background: rgba(88, 255, 119, 0.055);
  box-shadow: inset 0 0 1rem rgba(88, 255, 119, 0.12);
}

.terminal-hotspot[aria-disabled="true"] {
  cursor: default;
  pointer-events: none;
}

.terminal-hotspot--youtube { left: 30%; top: 21%; width: 20.7%; height: 6.4%; }
.terminal-hotspot--instagram { left: 30%; top: 27.4%; width: 20.7%; height: 6.4%; }
.terminal-hotspot--tiktok { left: 30%; top: 33.8%; width: 20.7%; height: 6.4%; }
.terminal-hotspot--threads { left: 30%; top: 40.2%; width: 20.7%; height: 6.4%; }
.terminal-hotspot--facebook { left: 50.7%; top: 21%; width: 20.8%; height: 6.4%; }
.terminal-hotspot--x { left: 50.7%; top: 27.4%; width: 20.8%; height: 6.4%; }
.terminal-hotspot--bandcamp { left: 50.7%; top: 33.8%; width: 20.8%; height: 6.4%; }
.terminal-hotspot--soundcloud { left: 50.7%; top: 40.2%; width: 20.8%; height: 6.4%; }
.terminal-hotspot--disconnect { left: 30%; top: 48%; width: 20.7%; height: 7%; }

@media (max-width: 1199px) {
  .socials-magazine {
    left: 0;
    top: 68.2%;
    width: 100%;
    height: 22.3%;
    clip-path: polygon(0 5%, 4% 0, 96% 0, 100% 5%, 100% 100%, 0 100%);
  }

  .socials-crt-hotspot {
    left: 37.4%;
    top: 42.1%;
    width: 13.5%;
    height: 14.7%;
  }

  /* Socials Computer Room cork-board cards — Tablet. */
  .socials-board-hotspot--youtube { left: 77.8%; top: 17.6%; width: 7.6%; height: 7.6%; }
  .socials-board-hotspot--instagram { left: 86.3%; top: 17.6%; width: 8%; height: 7.6%; }
  .socials-board-hotspot--tiktok { left: 77.8%; top: 25.9%; width: 7.6%; height: 7.6%; }
  .socials-board-hotspot--threads { left: 86.3%; top: 25.9%; width: 8%; height: 7.6%; }
  .socials-board-hotspot--facebook { left: 77.8%; top: 34.2%; width: 7.6%; height: 7.6%; }
  .socials-board-hotspot--x { left: 86.3%; top: 34.2%; width: 8%; height: 7.6%; }
  .socials-board-hotspot--bandcamp { left: 77.8%; top: 42.4%; width: 7.6%; height: 7.3%; }
  .socials-board-hotspot--soundcloud { left: 86.3%; top: 42.4%; width: 8%; height: 7.3%; }

  .terminal-hotspot--youtube { left: 30%; top: 21%; width: 20.7%; height: 6.4%; }
  .terminal-hotspot--instagram { left: 30%; top: 27.4%; width: 20.7%; height: 6.4%; }
  .terminal-hotspot--tiktok { left: 30%; top: 33.8%; width: 20.7%; height: 6.4%; }
  .terminal-hotspot--threads { left: 30%; top: 40.2%; width: 20.7%; height: 6.4%; }
  .terminal-hotspot--facebook { left: 50.7%; top: 21%; width: 20.8%; height: 6.4%; }
  .terminal-hotspot--x { left: 50.7%; top: 27.4%; width: 20.8%; height: 6.4%; }
  .terminal-hotspot--bandcamp { left: 50.7%; top: 33.8%; width: 20.8%; height: 6.4%; }
  .terminal-hotspot--soundcloud { left: 50.7%; top: 40.2%; width: 20.8%; height: 6.4%; }
  .terminal-hotspot--disconnect { left: 30%; top: 48%; width: 20.7%; height: 7%; }
}

@media (max-width: 767px) {
  .socials-magazine {
    left: 0;
    top: 65.5%;
    width: 100%;
    height: 23.5%;
    clip-path: polygon(0 5%, 4% 0, 96% 0, 100% 5%, 100% 100%, 0 100%);
  }
}

@media (min-width: 768px) and (max-width: 1100px) and (orientation: portrait) {
  .socials-crt-hotspot {
    left: 37.4%;
    top: 42.1%;
    width: 13.5%;
    height: 14.7%;
  }

  .terminal-hotspot--youtube { left: 30%; top: 21%; width: 20.7%; height: 6.4%; }
  .terminal-hotspot--instagram { left: 30%; top: 27.4%; width: 20.7%; height: 6.4%; }
  .terminal-hotspot--tiktok { left: 30%; top: 33.8%; width: 20.7%; height: 6.4%; }
  .terminal-hotspot--threads { left: 30%; top: 40.2%; width: 20.7%; height: 6.4%; }
  .terminal-hotspot--facebook { left: 50.7%; top: 21%; width: 20.8%; height: 6.4%; }
  .terminal-hotspot--x { left: 50.7%; top: 27.4%; width: 20.8%; height: 6.4%; }
  .terminal-hotspot--bandcamp { left: 50.7%; top: 33.8%; width: 20.8%; height: 6.4%; }
  .terminal-hotspot--soundcloud { left: 50.7%; top: 40.2%; width: 20.8%; height: 6.4%; }
  .terminal-hotspot--disconnect { left: 30%; top: 48%; width: 20.7%; height: 7%; }
}

@media (max-width: 767px) {
  .socials-crt-hotspot {
    left: 30.2%;
    top: 44.3%;
    width: 23%;
    height: 10.2%;
  }

  /* Socials Computer Room cork-board cards — Mobile. */
  .socials-board-hotspot--youtube { left: 72.2%; top: 17.9%; width: 10.8%; height: 5.7%; }
  .socials-board-hotspot--instagram { left: 83.6%; top: 17.9%; width: 10.4%; height: 5.7%; }
  .socials-board-hotspot--tiktok { left: 72.2%; top: 24.3%; width: 10.8%; height: 5.7%; }
  .socials-board-hotspot--threads { left: 83.6%; top: 24.3%; width: 10.4%; height: 5.7%; }
  .socials-board-hotspot--facebook { left: 72.2%; top: 30.65%; width: 10.8%; height: 5.7%; }
  .socials-board-hotspot--x { left: 83.6%; top: 30.65%; width: 10.4%; height: 5.7%; }
  .socials-board-hotspot--bandcamp { left: 72.2%; top: 37%; width: 10.8%; height: 5.5%; }
  .socials-board-hotspot--soundcloud { left: 83.6%; top: 37%; width: 10.4%; height: 5.5%; }

  .terminal-hotspot--youtube { left: 15%; top: 31.1%; width: 34%; height: 4.4%; }
  .terminal-hotspot--instagram { left: 15%; top: 35.5%; width: 34%; height: 4.4%; }
  .terminal-hotspot--tiktok { left: 15%; top: 39.9%; width: 34%; height: 4.4%; }
  .terminal-hotspot--threads { left: 15%; top: 44.3%; width: 34%; height: 4.4%; }
  .terminal-hotspot--facebook { left: 50%; top: 31.1%; width: 34%; height: 4.4%; }
  .terminal-hotspot--x { left: 50%; top: 35.5%; width: 34%; height: 4.4%; }
  .terminal-hotspot--bandcamp { left: 50%; top: 39.9%; width: 34%; height: 4.4%; }
  .terminal-hotspot--soundcloud { left: 50%; top: 44.3%; width: 34%; height: 4.4%; }
  .terminal-hotspot--disconnect { left: 15%; top: 48.8%; width: 34%; height: 4.8%; }
}

@media (prefers-reduced-motion: reduce) {
  .socials-magazine,
  .socials-crt-hotspot,
  .socials-crt-hotspot::before,
  .socials-board-hotspot,
  .socials-board-hotspot::after,
  .terminal-hotspot {
    transition: none;
  }

  .socials-crt-hotspot::before { animation: none !important; }
}

@media (forced-colors: active) {
  .socials-magazine,
  .socials-crt-hotspot,
  .socials-board-hotspot:not([aria-disabled="true"]),
  .terminal-hotspot:not([aria-disabled="true"]) {
    outline: 0.14rem solid LinkText;
  }
}