body {
  display: flex; align-items: center; justify-content: center; padding: 24px;
  padding-left: max(24px, env(safe-area-inset-left));
  padding-right: max(24px, env(safe-area-inset-right));
  position: relative; overflow: hidden;
  transform: none;
  height: 100%;
}
body::before {
  content: ""; position: fixed; inset: 0; pointer-events: none;
  background-image: repeating-linear-gradient(
    0deg, rgba(255,255,255,0.025) 0px, rgba(255,255,255,0.025) 1px,
    transparent 1px, transparent 4px
  );
}
main {
  width: 100%; max-width: 560px; text-align: center;
  position: relative;
}
.glow {
  position: absolute; left: 50%; top: -40px; width: 480px; height: 420px;
  transform: translateX(-50%);
  background: radial-gradient(closest-side, rgba(255,95,215,0.22), rgba(255,95,215,0) 72%);
  filter: blur(6px); pointer-events: none; z-index: -1;
  animation: breathe 5s ease-in-out infinite;
}
@keyframes breathe { 50% { opacity: 0.7; } }
.hero { animation: rise 0.55s ease-out both; }
.cta-row { animation: rise 0.55s ease-out 0.12s both; }
@keyframes rise { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: translateY(0); } }
.wordmark {
  margin: 0 0 0.85rem; font-size: clamp(2.6rem, 11vw, 4.4rem); font-weight: 800;
  letter-spacing: -0.02em; color: var(--accent); line-height: 1;
  text-shadow: 0 0 40px rgba(255, 95, 215, 0.4);
}
.cursor {
  display: inline-block; width: 0.46em; height: 0.8em; margin-left: 0.1em;
  background: var(--cyan); vertical-align: -0.05em; border-radius: 1px;
  animation: blink 1s steps(1) infinite;
}
@keyframes blink { 50% { opacity: 0; } }
.tagline { margin: 0 0 2.1rem; color: var(--ink-dim); font-size: 1.05rem; }
.tagline .prompt { color: var(--ink-faint); }
.cta-row {
  display: flex; gap: 0.85rem; justify-content: center; flex-wrap: wrap;
  margin-bottom: 1.6rem;
}
.cta-row .primary-btn, .cta-row .ghost-btn {
  width: auto; display: inline-flex; align-items: center; justify-content: center;
  padding: 0.75rem 1.6rem; border-radius: 6px; font-size: 0.95rem;
  text-decoration: none;
}
.cta-row .primary-btn { box-shadow: 0 8px 24px -8px rgba(255, 95, 215, 0.45); }
.cta-row .ghost-btn { font-weight: 600; }
#install { display: none; margin: 0 auto; }
#install.open { display: block; animation: rise 0.3s ease-out both; }
.cmd {
  display: flex; align-items: center; gap: 0.75rem; flex-wrap: wrap;
  background: var(--bg-chip); border: 1px solid var(--rule); border-radius: 6px;
  padding: 0.75rem 1rem; color: var(--ink); text-align: left;
}
.cmd code { font-size: 0.85rem; word-break: break-all; flex: 1 1 auto; min-width: 0; }
.copy {
  all: unset; cursor: pointer; flex-shrink: 0; color: var(--cyan);
  opacity: 0.75; font-size: 0.85em; margin-left: auto;
}
.copy:hover { opacity: 1; }
footer { margin-top: 2.6rem; opacity: 0.5; font-size: 0.85em; color: var(--ink-dim); }