html, body { margin: 0; height: 100%; overflow: hidden; background: #050505; color: #e8e2d6; font-family: 'Rajdhani', system-ui, sans-serif; }
canvas#c { position: fixed; inset: 0; display: block; }
canvas#hud { position: fixed; inset: 0; width: 100%; height: 100%; pointer-events: none; }
#ui { position: fixed; inset: 0; pointer-events: none; }
#loading { position: fixed; inset: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; background: #050505; z-index: 10; transition: opacity 1.2s ease; }
#loading.done { opacity: 0; pointer-events: none; }
.ld-title { font-weight: 500; letter-spacing: 0.9em; font-size: 28px; padding-left: 0.9em; color: #d9d2c4; }
.ld-bar { width: 260px; height: 1px; background: rgba(255,255,255,0.12); margin-top: 26px; overflow: hidden; }
.ld-bar i { display: block; height: 100%; width: 0%; background: #e8dcc0; transition: width 0.3s ease; }
.ld-msg { margin-top: 12px; font-family: 'Share Tech Mono', monospace; font-size: 11px; letter-spacing: 0.2em; color: rgba(232,226,214,0.45); text-transform: uppercase; }