/* Landing page + themes. Each theme sets the --lp-* colors. */
*, *::before, *::after { box-sizing: border-box; }
html, body { margin: 0; padding: 0; }
.lp-body { background: #05090b; font-family: "Manrope", system-ui, sans-serif; -webkit-font-smoothing: antialiased; }
[hidden] { display: none !important; }

[data-lp-theme], [data-lp-theme="emerald-gold"] {
  --lp-bg: oklch(0.17 0.03 200); --lp-bg-2: oklch(0.1 0.02 210); --lp-glow: oklch(0.55 0.12 185 / 0.4);
  --lp-grid: oklch(0.65 0.11 185 / 0.09); --lp-fg: oklch(0.97 0.01 190); --lp-muted: oklch(0.76 0.025 200);
  --lp-accent: oklch(0.85 0.14 85); --lp-accent-fg: oklch(0.2 0.03 80); --lp-ring: oklch(0.68 0.12 185);
}
[data-lp-theme="royal-crimson"] {
  --lp-bg: oklch(0.18 0.06 18); --lp-bg-2: oklch(0.1 0.035 15); --lp-glow: oklch(0.5 0.18 20 / 0.42);
  --lp-grid: oklch(0.65 0.15 20 / 0.08); --lp-fg: oklch(0.97 0.012 60); --lp-muted: oklch(0.8 0.03 40);
  --lp-accent: oklch(0.84 0.14 85); --lp-accent-fg: oklch(0.22 0.04 40); --lp-ring: oklch(0.62 0.19 22);
}
[data-lp-theme="midnight-blue"] {
  --lp-bg: oklch(0.17 0.05 262); --lp-bg-2: oklch(0.1 0.035 265); --lp-glow: oklch(0.55 0.17 250 / 0.4);
  --lp-grid: oklch(0.65 0.15 250 / 0.08); --lp-fg: oklch(0.97 0.01 250); --lp-muted: oklch(0.78 0.03 250);
  --lp-accent: oklch(0.84 0.13 210); --lp-accent-fg: oklch(0.18 0.04 240); --lp-ring: oklch(0.66 0.16 235);
}
[data-lp-theme="saffron-fire"] {
  --lp-bg: oklch(0.18 0.04 50); --lp-bg-2: oklch(0.1 0.025 45); --lp-glow: oklch(0.62 0.17 50 / 0.4);
  --lp-grid: oklch(0.72 0.14 55 / 0.08); --lp-fg: oklch(0.97 0.015 70); --lp-muted: oklch(0.8 0.035 60);
  --lp-accent: oklch(0.78 0.17 60); --lp-accent-fg: oklch(0.18 0.04 40); --lp-ring: oklch(0.7 0.17 55);
}
[data-lp-theme="neon-lime"] {
  --lp-bg: oklch(0.15 0.012 130); --lp-bg-2: oklch(0.09 0.008 130); --lp-glow: oklch(0.72 0.2 130 / 0.28);
  --lp-grid: oklch(0.82 0.2 130 / 0.07); --lp-fg: oklch(0.97 0.02 130); --lp-muted: oklch(0.76 0.03 130);
  --lp-accent: oklch(0.9 0.21 128); --lp-accent-fg: oklch(0.17 0.04 130); --lp-ring: oklch(0.82 0.2 130);
}
[data-lp-theme="rose-noir"] {
  --lp-bg: oklch(0.16 0.025 350); --lp-bg-2: oklch(0.09 0.015 350); --lp-glow: oklch(0.6 0.2 0 / 0.33);
  --lp-grid: oklch(0.72 0.17 0 / 0.07); --lp-fg: oklch(0.97 0.01 350); --lp-muted: oklch(0.78 0.03 350);
  --lp-accent: oklch(0.72 0.2 0); --lp-accent-fg: oklch(0.98 0.01 0); --lp-ring: oklch(0.68 0.2 0);
}
[data-lp-theme="ice-silver"] {
  --lp-bg: oklch(0.21 0.012 250); --lp-bg-2: oklch(0.13 0.01 250); --lp-glow: oklch(0.82 0.03 240 / 0.22);
  --lp-grid: oklch(0.92 0.02 240 / 0.07); --lp-fg: oklch(0.98 0.005 250); --lp-muted: oklch(0.8 0.015 250);
  --lp-accent: oklch(0.93 0.01 250); --lp-accent-fg: oklch(0.2 0.02 250); --lp-ring: oklch(0.86 0.02 250);
}
[data-lp-theme="ivory-classic"] {
  --lp-bg: oklch(0.97 0.015 85); --lp-bg-2: oklch(0.91 0.025 85); --lp-glow: oklch(0.82 0.08 150 / 0.4);
  --lp-grid: oklch(0.4 0.05 150 / 0.07); --lp-fg: oklch(0.22 0.03 150); --lp-muted: oklch(0.45 0.03 150);
  --lp-accent: oklch(0.42 0.1 155); --lp-accent-fg: oklch(0.97 0.02 90); --lp-ring: oklch(0.55 0.1 155);
}

.lp-surface {
  background-color: var(--lp-bg);
  background-image:
    radial-gradient(ellipse 55% 45% at 50% 38%, var(--lp-glow), transparent 72%),
    radial-gradient(ellipse at center, transparent 35%, var(--lp-bg-2) 100%),
    linear-gradient(var(--lp-grid) 1px, transparent 1px),
    linear-gradient(90deg, var(--lp-grid) 1px, transparent 1px);
  background-size: 100% 100%, 100% 100%, 44px 44px, 44px 44px;
  background-position: center;
}
.lp { position: relative; display: flex; min-height: 100vh; min-height: 100dvh; width: 100%; align-items: center; justify-content: center; overflow: hidden; padding: 64px 20px; color: var(--lp-fg); font-family: "Manrope", system-ui, sans-serif; }
.lp.lp-preview { min-height: 620px; padding: 56px 20px; }
.lp-main { position: relative; z-index: 1; display: flex; width: 100%; max-width: 440px; flex-direction: column; align-items: center; text-align: center; }

.lp-logo { display: grid; place-items: center; width: 112px; height: 112px; border-radius: 999px; padding: 4px; background: var(--lp-bg-2); border: 2px solid color-mix(in oklab, var(--lp-ring) 60%, transparent); animation: lp-pulse 2.8s ease-in-out infinite, lp-rise .7s cubic-bezier(.2,.8,.2,1) both; }
.lp-logo img { width: 100%; height: 100%; border-radius: 999px; object-fit: cover; }
.lp-logo-letter { font-family: "Archivo Black", sans-serif; font-size: 40px; color: var(--lp-accent); }

.lp-badge { margin-top: 28px; display: inline-flex; align-items: center; gap: 8px; border-radius: 999px; padding: 6px 16px; font-size: 11px; font-weight: 800; letter-spacing: .25em; color: var(--lp-accent); border: 1px solid color-mix(in oklab, var(--lp-accent) 40%, transparent); background: color-mix(in oklab, var(--lp-accent) 10%, transparent); }
.lp-badge .dot { width: 8px; height: 8px; border-radius: 999px; background: var(--lp-accent); }
.lp-title { margin: 20px 0 0; font-family: "Archivo Black", sans-serif; font-weight: 400; font-size: clamp(34px, 8vw, 50px); line-height: 1.05; letter-spacing: -.01em; }
.lp-tagline { margin: 16px 0 0; max-width: 380px; font-size: 16px; line-height: 1.6; color: var(--lp-muted); }
.lp-members { margin-top: 16px; display: inline-flex; align-items: center; gap: 8px; font-size: 14px; font-weight: 700; }
.lp-members svg { color: var(--lp-accent); }

.lp-button { position: relative; margin-top: 32px; display: flex; height: 64px; width: 100%; align-items: center; justify-content: center; gap: 12px; overflow: hidden; border: 0; border-radius: 18px; padding: 0 24px; cursor: pointer; font-family: inherit; font-size: 16px; font-weight: 800; letter-spacing: .12em; background: var(--lp-accent); color: var(--lp-accent-fg); transition: transform .2s; box-shadow: 0 0 0 1px color-mix(in oklab, var(--lp-accent) 60%, transparent), 0 14px 45px -10px var(--lp-ring), 0 0 70px -20px var(--lp-ring); }
.lp-button:hover { transform: scale(1.02); }
.lp-button:active { transform: scale(.98); }
.lp-button .shine { pointer-events: none; position: absolute; top: 0; bottom: 0; left: 0; width: 33%; background: color-mix(in oklab, var(--lp-fg) 25%, transparent); filter: blur(12px); animation: lp-shine 3.2s ease-in-out infinite; }
.lp-button .ic-spin { display: none; animation: lp-spin 1s linear infinite; }
.lp-button.busy { opacity: .85; cursor: wait; }
.lp-button.busy .ic-spin { display: block; }
.lp-button.busy .ic-send, .lp-button.busy .ic-arrow { display: none; }
.lp-helper { margin: 12px 0 0; font-size: 14px; color: var(--lp-muted); }
.lp-helper.err { color: var(--lp-accent); font-weight: 600; }
.lp-footer { margin-top: 40px; display: flex; width: 100%; align-items: center; gap: 16px; font-size: 11px; letter-spacing: .35em; color: var(--lp-muted); }
.lp-footer .line { height: 1px; flex: 1; background: color-mix(in oklab, var(--lp-muted) 25%, transparent); }
.lp-links { margin-top: 16px; font-size: 12px; }
.lp-links a { color: color-mix(in oklab, var(--lp-muted) 80%, transparent); text-decoration: none; }
.lp-links a:hover { color: var(--lp-fg); }

.rise { animation: lp-rise .7s cubic-bezier(.2,.8,.2,1) both; }
.d1 { animation-delay: 80ms; } .d2 { animation-delay: 140ms; } .d3 { animation-delay: 200ms; } .d4 { animation-delay: 300ms; }

@keyframes lp-pulse { 0%,100% { box-shadow: 0 0 0 0 var(--lp-ring), 0 0 40px -8px var(--lp-ring); } 50% { box-shadow: 0 0 0 10px transparent, 0 0 60px -6px var(--lp-ring); } }
@keyframes lp-shine { 0% { transform: translateX(-120%) skewX(-20deg); } 60%,100% { transform: translateX(320%) skewX(-20deg); } }
@keyframes lp-rise { from { opacity: 0; transform: translateY(14px); } to { opacity: 1; transform: none; } }
@keyframes lp-spin { to { transform: rotate(360deg); } }

/* Privacy page */
.pp { min-height: 100vh; padding: 56px 20px; color: var(--lp-fg); font-family: "Manrope", system-ui, sans-serif; }
.pp article { max-width: 680px; margin: 0 auto; line-height: 1.65; }
.pp a.back { color: var(--lp-muted); text-decoration: none; font-size: 14px; }
.pp h1 { font-family: "Archivo Black", sans-serif; font-weight: 400; font-size: 32px; margin: 16px 0; }
.pp h2 { font-size: 18px; margin: 28px 0 8px; }
.pp p, .pp li { color: var(--lp-muted); }
.pp .box { margin-top: 28px; border: 1px solid color-mix(in oklab, var(--lp-muted) 20%, transparent); background: color-mix(in oklab, var(--lp-bg-2) 60%, transparent); border-radius: 18px; padding: 20px; }
.pp .box h2 { margin-top: 0; }
.pp button { border: 0; border-radius: 12px; padding: 10px 16px; font: inherit; font-weight: 800; cursor: pointer; background: var(--lp-accent); color: var(--lp-accent-fg); }