*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
body { background: #0a0a0a; overflow: hidden; font-family: monospace; }
nav { position: fixed; top: 0; left: 0; z-index: 10; padding: 1rem 1.5rem; }
nav a { color: #aaa; text-decoration: none; font-size: 0.85rem; }
nav a:hover { color: #fff; }
canvas { display: block; width: 100vw; height: 100vh; }
#loader {
  position: fixed; inset: 0; z-index: 20;
  display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 1rem;
  background: #0a0a0a; transition: opacity 0.6s;
}
#loader.hidden { opacity: 0; pointer-events: none; }
.bar-wrap { width: 180px; height: 2px; background: #222; border-radius: 2px; overflow: hidden; }
#progress { height: 100%; width: 0%; background: #fff; border-radius: 2px; transition: width 0.1s linear; }
#pct { color: #555; font-size: 0.78rem; letter-spacing: 0.05em; }