/* austinavian.com: site layer. deep2.css styles the starfield and its chrome; this file owns everything above it. */
#site { position: fixed; inset: 0; z-index: 10; pointer-events: none; font-family: "Avian Pro", system-ui, sans-serif; }
/* anything clickable inside #site opts back in, so the rest of the screen still orbits the sky */
#site .interactive, #site a, #site button, #site input, #site textarea, #site select { pointer-events: auto; }

.visually-hidden { position: absolute; width: 1px; height: 1px; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
#loading .bar { margin-bottom: 0; }

/* social links: fade in once the mark has formed and the view is at rest, vanish as soon as the sky moves */
#social { position: absolute; left: 50%; bottom: max(30px, calc(env(safe-area-inset-bottom) + 14px)); transform: translateX(-50%);
  display: flex; gap: 2.4em; font-size: 11px; font-weight: 340; font-stretch: 132%; letter-spacing: 0.24em; text-transform: uppercase;
  opacity: 0; transition: opacity 1.6s ease; }
#social.on { opacity: 1; }
#social:not(.on) a { pointer-events: none; }
#social.leaving { transition-duration: 0.35s; }
#social a { color: rgba(255, 255, 255, 0.32); text-decoration: none; padding: 8px 0; transition: color 0.4s; -webkit-tap-highlight-color: transparent; }
#social a:hover, #social a:focus-visible { color: rgba(255, 255, 255, 0.8); outline: none; }
@media (prefers-reduced-motion: reduce) { #social { transition: none; } }
