/* Outer space: every .space site sits on this. No cookies, no trackers, nothing to load but stars. */
:root { color-scheme: dark; --ink: #f2f3f7; --dim: #9aa1b2; --line: rgba(255, 255, 255, 0.14); --glass: rgba(255, 255, 255, 0.06); }
* { box-sizing: border-box; }
html { background: #000; }
html, body { margin: 0; min-height: 100%; color: var(--ink); font-family: -apple-system, system-ui, "Segoe UI", sans-serif; -webkit-text-size-adjust: 100%; }
.space { position: fixed; inset: 0; z-index: -1; overflow: hidden; background: radial-gradient(120% 80% at 70% 10%, #120a2a 0%, transparent 60%), radial-gradient(90% 70% at 15% 85%, #0a1a33 0%, transparent 60%), #000; }
.space::before, .space::after { content: ""; position: absolute; inset: -50%; background-repeat: repeat; }
.space::before {
  background-size: 420px 420px;
  background-image:
    radial-gradient(1px 1px at 40px 60px, #fff, transparent), radial-gradient(1px 1px at 130px 240px, #cfe0ff, transparent),
    radial-gradient(1.4px 1.4px at 210px 110px, #fff, transparent), radial-gradient(1px 1px at 300px 330px, #ffe9d6, transparent),
    radial-gradient(1px 1px at 380px 40px, #fff, transparent), radial-gradient(1.6px 1.6px at 90px 370px, #fff, transparent),
    radial-gradient(1px 1px at 260px 200px, #dfe8ff, transparent), radial-gradient(1px 1px at 340px 140px, #fff, transparent);
  animation: drift 240s linear infinite;
}
.space::after {
  background-size: 700px 700px; opacity: 0.6;
  background-image:
    radial-gradient(1px 1px at 120px 500px, #fff, transparent), radial-gradient(1.2px 1.2px at 520px 90px, #fff, transparent),
    radial-gradient(1px 1px at 640px 420px, #cfe0ff, transparent), radial-gradient(1px 1px at 300px 610px, #fff, transparent);
  animation: drift 420s linear infinite reverse;
}
@keyframes drift { to { transform: translate3d(210px, 140px, 0); } }
@media (prefers-reduced-motion: reduce) { .space::before, .space::after { animation: none; } }