/* TEMPORARY, launch night only. Delete this file, launch-timer.js and every "launch timer" block in the pages after 1.0.0 is out.
   Without the is-prelaunch class on <html> (set by launch-timer.js before the release time) none of this shows. */
.lt-before, .lt-lock, .hero__countdown, .cd-strip { display: none; }
.is-prelaunch .lt-before { display: inline; }
.is-prelaunch .lt-after { display: none; }

/* Hero: the clock sits where "Free and open source" will be. */
.is-prelaunch .hero__countdown { display: flex; justify-content: center; gap: 8px; margin: 0 0 18px; }
.hero__countdown span { display: grid; justify-items: center; gap: 6px; min-width: 64px; padding: 10px 8px 8px; border: 1px solid rgba(244, 240, 230, .7); background: rgba(8, 10, 14, .62); color: #f4f0e6; }
.hero__countdown span[hidden] { display: none; }
.hero__countdown b { font: 400 28px/1 var(--pixel); letter-spacing: var(--pixel-tracking); word-spacing: var(--pixel-word-spacing); font-variant-numeric: tabular-nums; }
.hero__countdown small { font: 400 11px/1 var(--pixel); text-transform: uppercase; letter-spacing: var(--pixel-tracking); word-spacing: var(--pixel-word-spacing); opacity: .85; }
@media (max-width: 420px) { .hero__countdown span { min-width: 56px; } .hero__countdown b { font-size: 24px; } }
.is-launched-now .lt-after { display: inline-block; animation: lt-in 700ms steps(7) both; }
@keyframes lt-in { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: none; } }

/* Install: the file stays covered until the release time. */
.is-prelaunch .install__code pre { filter: blur(7px); user-select: none; }
.is-prelaunch .install__copy { visibility: hidden; }
.is-prelaunch .lt-lock { position: absolute; inset: 0; z-index: 2; display: grid; place-content: center; justify-items: center; gap: 12px; padding: 24px; background: rgb(8 10 14 / .55); color: #f4f0e6; text-align: center; }
.lt-lock p { margin: 0; font: 400 14px/1.5 var(--pixel); letter-spacing: var(--pixel-tracking); word-spacing: var(--pixel-word-spacing); text-transform: uppercase; }
.lt-lock b { font: 400 30px/1 var(--pixel); letter-spacing: var(--pixel-tracking); word-spacing: var(--pixel-word-spacing); font-variant-numeric: tabular-nums; }

/* What's new and Roadmap: a thin strip under the header. */
.is-prelaunch .cd-strip { display: flex; justify-content: center; align-items: center; flex-wrap: wrap; gap: 4px 12px; margin-top: 10px; padding: 6px 10px; border: 1.5px solid var(--ink); background: var(--panel, var(--paper-2)); box-shadow: 3px 3px 0 var(--shadow); color: var(--ink); }
.cd-strip .cd-label { font: 11px "FK Raster", monospace; text-transform: uppercase; letter-spacing: .16em; word-spacing: .2em; color: var(--muted, var(--ink-2)); }
.cd-strip .cd-time { display: inline-flex; align-items: baseline; gap: 8px; white-space: nowrap; }
.cd-strip b { font: 400 18px/1 "FK Raster", monospace; letter-spacing: .16em; word-spacing: .2em; font-variant-numeric: tabular-nums; color: var(--accent, var(--red-ink)); }
.cd-strip small { font: 10px "FK Raster", monospace; text-transform: uppercase; letter-spacing: .16em; word-spacing: .2em; color: var(--muted, var(--ink-2)); margin-left: 2px; }

.lt-confetti { position: fixed; inset: 0; z-index: 2000; width: 100%; height: 100%; pointer-events: none; }
@media (prefers-reduced-motion: reduce) { .is-launched-now .lt-after { animation: none; } }
