:root { --bg: #080C14; --ink: #F2F6FF; --ink-dim: #A8BAD4; --terra: #D4622A; --sage: #4E9B6F; --aurora1: #1A4A6E; --aurora2: #0E3D2F; --font-mono: "DM Mono", monospace; --font-sans: "Outfit", sans-serif; }
* { box-sizing: border-box; margin: 0; padding: 0; }
html, body { height: 100%; width: 100%; }
body { background: var(--bg); color: var(--ink); font-family: var(--font-sans); font-weight: 300; }
#stars { position: fixed; inset: 0; z-index: 0; pointer-events: none; }
.aurora { position: fixed; inset: 0; z-index: 1; pointer-events: none; }
.aurora-band { position: absolute; left: -10%; width: 120%; height: 240px; filter: blur(80px); opacity: 0; animation: auroraFloat 14s infinite; }
.aurora-band:nth-child(1) { background: linear-gradient(90deg, transparent, var(--aurora1), var(--aurora2), transparent); top: 8%; }
.aurora-band:nth-child(2) { background: linear-gradient(90deg, transparent, var(--aurora2), var(--aurora1), transparent); top: 20%; animation-delay: 3s; }
.aurora-band:nth-child(3) { background: linear-gradient(90deg, transparent, #1A2E5A44, transparent); top: 30%; animation-delay: 6s; }
@keyframes auroraFloat { 0% { opacity: 0; } 50% { opacity: 0.28; } 100% { opacity: 0; } }
.mountains { position: fixed; bottom: 0; left: 0; right: 0; z-index: 2; pointer-events: none; }
.layout { position: relative; z-index: 10; min-height: 100vh; display: flex; flex-direction: column; justify-content: center; align-items: center; padding: 2rem 1rem; }
header { position: absolute; top: 1rem; right: 1rem; display: flex; gap: 1.5rem; }
#clock { font-family: var(--font-mono); font-size: 0.7rem; color: var(--ink-dim); opacity: 0.6; }
.live { display: flex; gap: 0.4rem; font-size: 0.6rem; color: var(--sage); text-transform: uppercase; }
.dot-live { width: 4px; height: 4px; border-radius: 50%; background: var(--sage); animation: pulse 2s infinite; }
@keyframes pulse { 0%, 100% { opacity: 1; } 50% { opacity: 0.4; } }
main { width: 100%; max-width: 500px; display: flex; flex-direction: column; align-items: center; text-align: center; }
.coming-soon-wrap { margin-bottom: 1.5rem; }
.cs-pill { padding: 0.6rem 1.6rem; border: 1px solid #FFFFFF28; background: linear-gradient(135deg, #FFFFFF12, #FFFFFF06); }
.cs-text { font-family: var(--font-mono); font-size: 1rem; letter-spacing: 0.3em; text-transform: uppercase; color: var(--ink); }
h1 { font-size: 2.5rem; line-height: 1.2; margin-bottom: 1rem; }
.desc { font-size: 1.1rem; color: #BDD0E8; line-height: 1.75; margin-bottom: 1.5rem; }
.meta { display: grid; grid-template-columns: 1fr 1fr; gap: 1px; width: 100%; max-width: 450px; margin-bottom: 1.5rem; }
.meta-item { padding: 0.7rem 1rem; background: #FFFFFF10; border: 1px solid #FFFFFF18; }
.meta-label { font-family: var(--font-mono); font-size: 0.6rem; text-transform: uppercase; color: var(--ink-dim); }
.meta-value { font-size: 0.9rem; color: var(--ink); margin-top: 0.3rem; }
.meta-value a { color: var(--sage); }
footer { position: absolute; bottom: 1rem; left: 1rem; right: 1rem; font-family: var(--font-mono); font-size: 0.55rem; color: var(--ink-dim); opacity: 0.6; }
.footer-coords { display: none; }
@media (max-width: 480px) { header { top: 0.5rem; right: 0.5rem; font-size: 0.6rem; } h1 { font-size: 1.8rem; } .meta { max-width: 300px; } }