/* ============================================================================
   GOD — product site. Obsidian black · magenta · cyan · gold.
   Zero-build static CSS. Distinctive, dark, glassy, grainy.
   ========================================================================== */

@import url('https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;500;600;700&family=Sora:wght@300;400;500;600&family=JetBrains+Mono:wght@400;600&display=swap');

:root {
  --obsidian:   #05060a;
  --obsidian-2: #0a0c14;
  --panel:      rgba(20, 23, 36, 0.55);
  --panel-line: rgba(255, 255, 255, 0.08);
  --ink:        #eef1f8;
  --ink-soft:   #aab2c6;
  --ink-faint:  #6c7488;

  --magenta:    #ff2bd6;
  --magenta-d:  #c40fa0;
  --cyan:       #29e6ff;
  --cyan-d:     #06a8c4;
  --gold:       #ffce5c;
  --gold-d:     #e0a423;

  --radius: 18px;
  --maxw: 1180px;
  --ease: cubic-bezier(0.22, 1, 0.36, 1);
}

* { box-sizing: border-box; margin: 0; padding: 0; }

html { scroll-behavior: smooth; }

body {
  font-family: 'Sora', system-ui, sans-serif;
  background: var(--obsidian);
  color: var(--ink);
  line-height: 1.6;
  overflow-x: hidden;
  -webkit-font-smoothing: antialiased;
}

/* Grain + ambient glow layered behind everything */
body::before {
  content: '';
  position: fixed; inset: 0; z-index: 0; pointer-events: none;
  background:
    radial-gradient(60vw 60vw at 12% -10%, rgba(255, 43, 214, 0.16), transparent 60%),
    radial-gradient(55vw 55vw at 100% 8%, rgba(41, 230, 255, 0.13), transparent 55%),
    radial-gradient(50vw 50vw at 50% 120%, rgba(255, 206, 92, 0.10), transparent 60%);
}
body::after {
  content: '';
  position: fixed; inset: 0; z-index: 0; pointer-events: none; opacity: 0.04;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}

a { color: inherit; text-decoration: none; }
img { max-width: 100%; display: block; }

.wrap { width: 100%; max-width: var(--maxw); margin: 0 auto; padding: 0 28px; }
.shell { position: relative; z-index: 1; }

::selection { background: var(--magenta); color: #fff; }

/* ── Custom scrollbar ─────────────────────────────────────────────────── */
::-webkit-scrollbar { width: 11px; }
::-webkit-scrollbar-track { background: var(--obsidian); }
::-webkit-scrollbar-thumb {
  background: linear-gradient(var(--magenta-d), var(--cyan-d));
  border-radius: 8px; border: 2px solid var(--obsidian);
}

/* ── Nav ──────────────────────────────────────────────────────────────── */
.nav {
  position: fixed; top: 0; left: 0; right: 0; z-index: 50;
  backdrop-filter: blur(18px);
  background: rgba(5, 6, 10, 0.55);
  border-bottom: 1px solid transparent;
  transition: border-color 0.4s var(--ease), background 0.4s var(--ease);
}
.nav.scrolled { border-bottom-color: var(--panel-line); background: rgba(5, 6, 10, 0.82); }
.nav-inner { display: flex; align-items: center; justify-content: space-between; height: 70px; }
.brand { display: flex; align-items: center; gap: 12px; font-family: 'Space Grotesk', sans-serif; font-weight: 700; letter-spacing: 0.18em; font-size: 1.05rem; }
.brand .mark {
  width: 30px; height: 30px; border-radius: 8px;
  background: conic-gradient(from 210deg, var(--magenta), var(--cyan), var(--gold), var(--magenta));
  box-shadow: 0 0 18px rgba(255, 43, 214, 0.5);
}
.brand small { color: var(--ink-faint); font-weight: 400; letter-spacing: 0.2em; font-size: 0.6rem; }
.nav-links { display: flex; align-items: center; gap: 30px; }
.nav-links a { color: var(--ink-soft); font-size: 0.92rem; transition: color 0.25s; }
.nav-links a:hover { color: var(--ink); }
.nav-links .btn { padding: 9px 20px; }
@media (max-width: 760px) { .nav-links a:not(.btn) { display: none; } }

/* ── Buttons ──────────────────────────────────────────────────────────── */
.btn {
  display: inline-flex; align-items: center; gap: 10px;
  font-family: 'Space Grotesk', sans-serif; font-weight: 600; font-size: 0.95rem;
  padding: 14px 28px; border-radius: 999px; cursor: pointer; border: 0;
  position: relative; transition: transform 0.25s var(--ease), box-shadow 0.3s var(--ease);
}
.btn-primary {
  color: #07070b;
  background: linear-gradient(110deg, var(--cyan), var(--magenta));
  box-shadow: 0 6px 30px rgba(255, 43, 214, 0.35);
}
.btn-primary:hover { transform: translateY(-3px); box-shadow: 0 12px 44px rgba(41, 230, 255, 0.45); }
.btn-ghost {
  color: var(--ink); background: var(--panel);
  border: 1px solid var(--panel-line); backdrop-filter: blur(8px);
}
.btn-ghost:hover { transform: translateY(-3px); border-color: var(--cyan); color: #fff; }
.btn-gold { color: #1a1404; background: linear-gradient(110deg, var(--gold), var(--gold-d)); box-shadow: 0 6px 30px rgba(255, 206, 92, 0.3); }
.btn-gold:hover { transform: translateY(-3px); box-shadow: 0 12px 44px rgba(255, 206, 92, 0.45); }

/* ── Hero ─────────────────────────────────────────────────────────────── */
.hero { position: relative; min-height: 100vh; display: flex; align-items: center; padding: 120px 0 80px; overflow: hidden; }
.orb { position: absolute; border-radius: 50%; filter: blur(80px); opacity: 0.55; z-index: 0; }
.orb-1 { width: 480px; height: 480px; background: var(--magenta); top: -120px; left: -100px; animation: float1 14s ease-in-out infinite; }
.orb-2 { width: 420px; height: 420px; background: var(--cyan); bottom: -140px; right: -80px; animation: float2 17s ease-in-out infinite; }
.orb-3 { width: 300px; height: 300px; background: var(--gold); top: 40%; right: 28%; opacity: 0.3; animation: float1 20s ease-in-out infinite reverse; }
@keyframes float1 { 0%,100% { transform: translate(0,0); } 50% { transform: translate(40px, 50px); } }
@keyframes float2 { 0%,100% { transform: translate(0,0); } 50% { transform: translate(-50px, -40px); } }

.hero-grid { position: relative; z-index: 2; display: grid; grid-template-columns: 1.15fr 0.85fr; gap: 48px; align-items: center; }
@media (max-width: 940px) { .hero-grid { grid-template-columns: 1fr; } }

.eyebrow {
  display: inline-flex; align-items: center; gap: 10px;
  font-family: 'JetBrains Mono', monospace; font-size: 0.72rem; letter-spacing: 0.22em; text-transform: uppercase;
  color: var(--cyan); padding: 7px 14px; border: 1px solid rgba(41, 230, 255, 0.3); border-radius: 999px;
  background: rgba(41, 230, 255, 0.06);
}
.eyebrow .dot { width: 7px; height: 7px; border-radius: 50%; background: var(--cyan); box-shadow: 0 0 10px var(--cyan); animation: pulse 2s infinite; }
@keyframes pulse { 0%,100% { opacity: 1; } 50% { opacity: 0.3; } }

h1.title {
  font-family: 'Space Grotesk', sans-serif; font-weight: 700; line-height: 0.92;
  font-size: clamp(3.4rem, 9vw, 6.6rem); letter-spacing: -0.02em; margin: 22px 0 18px;
}
h1.title .glow {
  background: linear-gradient(110deg, var(--cyan) 10%, var(--magenta) 55%, var(--gold) 100%);
  -webkit-background-clip: text; background-clip: text; color: transparent;
  filter: drop-shadow(0 0 26px rgba(255, 43, 214, 0.35));
}
.lede { font-size: clamp(1.05rem, 1.8vw, 1.3rem); color: var(--ink-soft); max-width: 540px; margin-bottom: 34px; }
.hero-cta { display: flex; gap: 16px; flex-wrap: wrap; }
.hero-meta { display: flex; gap: 26px; margin-top: 38px; flex-wrap: wrap; }
.hero-meta .m { font-family: 'JetBrains Mono', monospace; font-size: 0.8rem; color: var(--ink-faint); }
.hero-meta .m b { display: block; font-size: 1.5rem; color: var(--ink); font-family: 'Space Grotesk', sans-serif; }

/* Hero device mock */
.device {
  position: relative; border-radius: 22px; padding: 16px;
  background: linear-gradient(160deg, rgba(255,43,214,0.20), rgba(41,230,255,0.16));
  border: 1px solid rgba(255,255,255,0.14); backdrop-filter: blur(16px);
  box-shadow: 0 30px 80px rgba(0,0,0,0.55), 0 0 0 1px rgba(41,230,255,0.12);
}
.device .screen { border-radius: 14px; background: rgba(8, 10, 18, 0.92); border: 1px solid var(--panel-line); padding: 20px; font-family: 'JetBrains Mono', monospace; font-size: 0.82rem; }
.device .scr-bar { display: flex; gap: 7px; margin-bottom: 16px; }
.device .scr-bar span { width: 11px; height: 11px; border-radius: 50%; background: var(--ink-faint); opacity: 0.4; }
.device .scr-bar span:nth-child(1){ background: var(--magenta); opacity: 0.85; }
.device .scr-bar span:nth-child(2){ background: var(--gold); opacity: 0.85; }
.device .scr-bar span:nth-child(3){ background: var(--cyan); opacity: 0.85; }
.narr { color: var(--ink-soft); }
.narr .you { color: var(--cyan); }
.narr .dir { color: var(--ink); }
.chips { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 16px; }
.chip { font-size: 0.68rem; padding: 4px 10px; border-radius: 8px; background: rgba(255,255,255,0.05); border: 1px solid var(--panel-line); color: var(--ink-soft); }
.chip.mag { color: var(--magenta); border-color: rgba(255,43,214,0.4); }
.chip.cy  { color: var(--cyan);  border-color: rgba(41,230,255,0.4); }
.chip.go  { color: var(--gold);  border-color: rgba(255,206,92,0.4); }

/* ── Sections ─────────────────────────────────────────────────────────── */
section { position: relative; padding: 100px 0; }
.section-head { max-width: 680px; margin-bottom: 60px; }
.kicker { font-family: 'JetBrains Mono', monospace; font-size: 0.74rem; letter-spacing: 0.24em; text-transform: uppercase; color: var(--magenta); margin-bottom: 14px; }
h2.sec {
  font-family: 'Space Grotesk', sans-serif; font-weight: 700; letter-spacing: -0.02em;
  font-size: clamp(2.1rem, 4.5vw, 3.2rem); line-height: 1.05;
}
h2.sec .accent { color: var(--cyan); }
.sub { color: var(--ink-soft); font-size: 1.05rem; margin-top: 16px; }

/* What-is band */
.band {
  border-top: 1px solid var(--panel-line); border-bottom: 1px solid var(--panel-line);
  background: rgba(10, 12, 20, 0.5);
}
.band-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; }
@media (max-width: 820px) { .band-grid { grid-template-columns: 1fr; } }
.band-card { padding: 28px; border-radius: var(--radius); background: var(--panel); border: 1px solid var(--panel-line); }
.band-card .ic { font-size: 1.6rem; margin-bottom: 12px; }
.band-card h3 { font-family: 'Space Grotesk', sans-serif; font-size: 1.15rem; margin-bottom: 8px; }
.band-card p { color: var(--ink-soft); font-size: 0.95rem; }

/* Feature rows — alternating asymmetric */
.frow { display: grid; grid-template-columns: 1fr 1fr; gap: 56px; align-items: center; margin-bottom: 96px; }
.frow:last-child { margin-bottom: 0; }
.frow.flip .ftext { order: 2; }
@media (max-width: 880px) { .frow, .frow.flip { grid-template-columns: 1fr; gap: 28px; } .frow.flip .ftext { order: 0; } }
.fnum { font-family: 'Space Grotesk', sans-serif; font-weight: 700; font-size: 3.4rem; line-height: 1; color: transparent; -webkit-text-stroke: 1.5px var(--ink-faint); margin-bottom: 14px; }
.frow h3 { font-family: 'Space Grotesk', sans-serif; font-size: 1.45rem; margin-bottom: 14px; }
.frow p { color: var(--ink-soft); font-size: 1.02rem; }
.frow ul { margin-top: 16px; list-style: none; display: grid; gap: 10px; }
.frow ul li { padding-left: 26px; position: relative; color: var(--ink-soft); font-size: 0.95rem; }
.frow ul li::before { content: ''; position: absolute; left: 0; top: 9px; width: 12px; height: 12px; border-radius: 3px; background: linear-gradient(var(--magenta), var(--cyan)); }

.fart {
  border-radius: var(--radius); padding: 30px; min-height: 280px;
  background: linear-gradient(160deg, rgba(255,43,214,0.10), rgba(41,230,255,0.07));
  border: 1px solid var(--panel-line); backdrop-filter: blur(12px);
  display: flex; flex-direction: column; justify-content: center; gap: 14px;
}
.stat-line { display: flex; align-items: center; gap: 14px; }
.stat-line .lbl { width: 92px; font-family: 'JetBrains Mono', monospace; font-size: 0.74rem; color: var(--ink-faint); }
.stat-line .track { flex: 1; height: 9px; border-radius: 6px; background: rgba(255,255,255,0.06); overflow: hidden; }
.stat-line .fill { height: 100%; border-radius: 6px; }
.f-mag { background: linear-gradient(90deg, var(--magenta-d), var(--magenta)); }
.f-cy  { background: linear-gradient(90deg, var(--cyan-d), var(--cyan)); }
.f-go  { background: linear-gradient(90deg, var(--gold-d), var(--gold)); }
.fart .big { font-family: 'Space Grotesk', sans-serif; font-size: 1.55rem; font-weight: 700; }
.fart .mono { font-family: 'JetBrains Mono', monospace; font-size: 0.82rem; color: var(--ink-soft); }
.fart-head { display: flex; align-items: center; gap: 14px; margin-bottom: 4px; padding-bottom: 16px; border-bottom: 1px solid var(--panel-line); }
.fart-head .fa-ic { font-size: 1.8rem; line-height: 1; }
.fart-head h4 { font-family: 'Space Grotesk', sans-serif; font-size: 1.45rem; font-weight: 700; letter-spacing: -0.01em; }

/* Systems grid */
.sysgrid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; }
@media (max-width: 980px) { .sysgrid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 520px) { .sysgrid { grid-template-columns: 1fr; } }
.sys {
  padding: 22px; border-radius: 14px; background: var(--panel); border: 1px solid var(--panel-line);
  transition: transform 0.3s var(--ease), border-color 0.3s var(--ease), background 0.3s;
}
.sys:hover { transform: translateY(-5px); border-color: var(--magenta); background: rgba(255,43,214,0.06); }
.sys .si { font-size: 1.4rem; margin-bottom: 10px; }
.sys h4 { font-family: 'Space Grotesk', sans-serif; font-size: 1rem; margin-bottom: 6px; }
.sys p { color: var(--ink-faint); font-size: 0.83rem; }

/* Privacy / CTA band */
.cta {
  text-align: center; border-radius: 26px; padding: 70px 30px; margin: 40px 0;
  background: linear-gradient(150deg, rgba(255,43,214,0.13), rgba(41,230,255,0.10), rgba(255,206,92,0.08));
  border: 1px solid var(--panel-line);
}
.cta h2 { font-family: 'Space Grotesk', sans-serif; font-size: clamp(2rem, 4.5vw, 3rem); margin-bottom: 16px; }
.cta p { color: var(--ink-soft); max-width: 560px; margin: 0 auto 30px; }
.privacy-tags { display: flex; gap: 14px; justify-content: center; flex-wrap: wrap; margin-top: 26px; }
.ptag { font-family: 'JetBrains Mono', monospace; font-size: 0.74rem; color: var(--ink-soft); padding: 7px 14px; border-radius: 999px; border: 1px solid var(--panel-line); }

/* Footer */
footer { border-top: 1px solid var(--panel-line); padding: 50px 0 40px; }
.foot-grid { display: flex; justify-content: space-between; align-items: center; gap: 24px; flex-wrap: wrap; }
.foot-grid p { color: var(--ink-faint); font-size: 0.88rem; }
.foot-links { display: flex; gap: 22px; }
.foot-links a { color: var(--ink-soft); font-size: 0.9rem; transition: color 0.2s; }
.foot-links a:hover { color: var(--cyan); }

/* ── Reveal on scroll (progressive enhancement — visible by default) ────── */
.reveal { opacity: 1; transform: none; transition: opacity 0.7s var(--ease), transform 0.7s var(--ease); }
.reveal.armed { opacity: 0; transform: translateY(34px); }
.reveal.armed.in { opacity: 1; transform: none; }
.reveal.d1 { transition-delay: 0.08s; }
.reveal.d2 { transition-delay: 0.16s; }
.reveal.d3 { transition-delay: 0.24s; }

/* ── Download page specifics ──────────────────────────────────────────── */
.dl-hero { padding: 150px 0 60px; text-align: center; }
.dl-hero h1 { font-family: 'Space Grotesk', sans-serif; font-size: clamp(2.6rem, 6vw, 4.4rem); margin-bottom: 16px; }
.dl-hero p { color: var(--ink-soft); max-width: 560px; margin: 0 auto; font-size: 1.1rem; }

.plat-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; }
@media (max-width: 760px) { .plat-grid { grid-template-columns: 1fr; } }
.plat {
  border-radius: var(--radius); padding: 32px; background: var(--panel); border: 1px solid var(--panel-line);
  position: relative; overflow: hidden;
}
.plat::after { content: ''; position: absolute; top: -50%; right: -30%; width: 280px; height: 280px; border-radius: 50%; filter: blur(70px); opacity: 0.25; }
.plat.win::after { background: var(--cyan); }
.plat.droid::after { background: var(--magenta); }
.plat .pi { font-size: 2.2rem; margin-bottom: 14px; position: relative; }
.plat h3 { font-family: 'Space Grotesk', sans-serif; font-size: 1.5rem; margin-bottom: 4px; position: relative; }
.plat .ver { font-family: 'JetBrains Mono', monospace; font-size: 0.78rem; color: var(--gold); margin-bottom: 18px; position: relative; }
.dl-rows { display: grid; gap: 10px; margin: 18px 0 22px; position: relative; }
.dl-row { display: flex; justify-content: space-between; align-items: center; padding: 12px 16px; border-radius: 12px; background: rgba(255,255,255,0.04); border: 1px solid var(--panel-line); }
.dl-row .nm { font-family: 'JetBrains Mono', monospace; font-size: 0.82rem; }
.dl-row .nm small { color: var(--ink-faint); display: block; font-size: 0.7rem; }
.dl-row a { font-size: 0.82rem; color: var(--cyan); font-weight: 600; }

/* Spec table */
.spec { width: 100%; border-collapse: collapse; border-radius: var(--radius); overflow: hidden; background: var(--panel); border: 1px solid var(--panel-line); }
.spec th, .spec td { text-align: left; padding: 16px 20px; border-bottom: 1px solid var(--panel-line); font-size: 0.92rem; }
.spec th { font-family: 'Space Grotesk', sans-serif; font-size: 0.78rem; letter-spacing: 0.08em; text-transform: uppercase; color: var(--ink-faint); }
.spec td:first-child { font-family: 'JetBrains Mono', monospace; color: var(--cyan); font-size: 0.82rem; }
.spec tr:last-child td { border-bottom: 0; }
.spec .rec { color: var(--gold); }

/* Model cards */
.model-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; }
@media (max-width: 760px) { .model-grid { grid-template-columns: 1fr; } }
.model { border-radius: var(--radius); padding: 28px; background: var(--panel); border: 1px solid var(--panel-line); }
.model.featured { border-color: var(--gold); box-shadow: 0 0 40px rgba(255,206,92,0.12); }
.model .tag { font-family: 'JetBrains Mono', monospace; font-size: 0.7rem; letter-spacing: 0.14em; text-transform: uppercase; padding: 5px 12px; border-radius: 999px; display: inline-block; margin-bottom: 14px; }
.model .tag.best { background: linear-gradient(110deg, var(--gold), var(--gold-d)); color: #1a1404; }
.model .tag.lite { background: rgba(41,230,255,0.12); color: var(--cyan); border: 1px solid rgba(41,230,255,0.3); }
.model h3 { font-family: 'Space Grotesk', sans-serif; font-size: 1.3rem; margin-bottom: 6px; }
.model .why { color: var(--ink-soft); font-size: 0.95rem; margin-top: 12px; }
.model .meta { display: flex; gap: 18px; margin-top: 18px; font-family: 'JetBrains Mono', monospace; font-size: 0.78rem; color: var(--ink-faint); }
.model .meta b { color: var(--ink); display: block; }

/* Steps */
.steps { display: grid; gap: 18px; }
.step { display: flex; gap: 20px; align-items: flex-start; padding: 22px; border-radius: 14px; background: var(--panel); border: 1px solid var(--panel-line); }
.step .n { flex-shrink: 0; width: 40px; height: 40px; border-radius: 11px; display: grid; place-items: center; font-family: 'Space Grotesk', sans-serif; font-weight: 700; background: linear-gradient(135deg, var(--magenta), var(--cyan)); color: #07070b; }
.step h4 { font-family: 'Space Grotesk', sans-serif; margin-bottom: 6px; }
.step p { color: var(--ink-soft); font-size: 0.92rem; }
.step code { font-family: 'JetBrains Mono', monospace; background: rgba(41,230,255,0.1); color: var(--cyan); padding: 2px 7px; border-radius: 6px; font-size: 0.84rem; }

.note { padding: 18px 22px; border-radius: 14px; border: 1px solid rgba(255,206,92,0.3); background: rgba(255,206,92,0.06); color: var(--ink-soft); font-size: 0.9rem; }
.note b { color: var(--gold); }

/* ── Brand lockup — tight GOD / BY MAGEN7A stack ───────────────────────── */
.brand span { line-height: 1.02; }
.brand small { display: block; line-height: 1; margin-top: 2px; }

/* ── Beta access gate + alpha signup forms ─────────────────────────────── */
.hidden { display: none !important; }
.gate-form { display: grid; gap: 12px; margin-top: 4px; }
.gate-input {
  width: 100%; padding: 13px 16px; border-radius: 12px;
  background: rgba(255,255,255,0.05); border: 1px solid var(--panel-line);
  color: var(--ink); font-family: 'JetBrains Mono', monospace; font-size: 0.9rem;
  outline: none; transition: border-color 0.25s, background 0.25s;
}
.gate-input:focus { border-color: var(--cyan); background: rgba(41,230,255,0.06); }
.gate-input::placeholder { color: var(--ink-faint); }
.gate-msg { font-size: 0.85rem; margin-top: 12px; min-height: 1.1em; }
.gate-msg.err { color: #ff7a9c; }
.gate-msg.ok { color: var(--gold); }

/* ── Legal / privacy prose pages ───────────────────────────────────────── */
.legal-hero { padding: 140px 0 26px; position: relative; }
.legal-hero h1 { font-family: 'Space Grotesk', sans-serif; font-size: clamp(2.2rem, 5vw, 3.4rem); line-height: 1.05; margin: 12px 0 10px; }
.legal-hero .upd { font-family: 'JetBrains Mono', monospace; font-size: 0.78rem; color: var(--ink-faint); }
.legal { padding: 14px 0 90px; }
.legal .wrap { max-width: 820px; }
.legal .lead { font-size: 1.12rem; color: var(--ink); margin-bottom: 8px; }
.legal h2 { font-family: 'Space Grotesk', sans-serif; font-size: 1.5rem; margin: 42px 0 12px; }
.legal h2 .accent { color: var(--cyan); }
.legal h3 { font-family: 'Space Grotesk', sans-serif; font-size: 1.1rem; margin: 26px 0 8px; color: var(--ink); }
.legal p, .legal li { color: var(--ink-soft); font-size: 1rem; margin-bottom: 14px; }
.legal ul { padding-left: 22px; margin-bottom: 14px; }
.legal li { margin-bottom: 8px; }
.legal a { color: var(--cyan); }
.legal a:hover { text-decoration: underline; }
.legal code { font-family: 'JetBrains Mono', monospace; background: rgba(41,230,255,0.1); color: var(--cyan); padding: 2px 7px; border-radius: 6px; font-size: 0.85rem; }
.legal .callout { padding: 18px 22px; border-radius: 14px; border: 1px solid rgba(41,230,255,0.25); background: rgba(41,230,255,0.05); margin: 18px 0; color: var(--ink-soft); font-size: 0.95rem; }
.legal .callout b { color: var(--ink); }

/* ── Maintenance blocker ───────────────────────────────────────────────── */
.maint { min-height: 100vh; display: grid; place-items: center; text-align: center; padding: 40px 24px; position: relative; }
.maint-card { position: relative; z-index: 2; max-width: 600px; }
.maint .mark-big {
  width: 64px; height: 64px; border-radius: 16px; margin: 0 auto 28px;
  background: conic-gradient(from 210deg, var(--magenta), var(--cyan), var(--gold), var(--magenta));
  box-shadow: 0 0 40px rgba(255,43,214,0.5); animation: float1 6s ease-in-out infinite;
}
.maint h1 { font-family: 'Space Grotesk', sans-serif; font-size: clamp(2.2rem, 6vw, 3.6rem); line-height: 1.05; margin-bottom: 18px; }
.maint h1 .glow { background: linear-gradient(110deg, var(--cyan), var(--magenta), var(--gold)); -webkit-background-clip: text; background-clip: text; color: transparent; }
.maint p { color: var(--ink-soft); font-size: 1.1rem; max-width: 480px; margin: 0 auto 12px; }
.maint .badge {
  display: inline-flex; align-items: center; gap: 10px; font-family: 'JetBrains Mono', monospace;
  font-size: 0.74rem; letter-spacing: 0.2em; text-transform: uppercase; color: var(--gold);
  padding: 8px 16px; border: 1px solid rgba(255,206,92,0.3); border-radius: 999px; margin-bottom: 28px;
}
.maint .sig { margin-top: 30px; font-family: 'JetBrains Mono', monospace; font-size: 0.8rem; color: var(--ink-faint); }

/* Build version + date stamp on the download page (download.js fills it). */
.build-stamp { font-family: 'JetBrains Mono', monospace; font-size: 0.78rem; letter-spacing: 0.06em; color: rgba(255,255,255,0.62); margin-top: 16px; }
.build-stamp.hidden { display: none; }