/* Prompt-to-website reveal. Every animated property is written by timeline.js per frame — no transitions here. */
.rv-pending body { background: #294376; }
.rv-pending body > * { visibility: hidden; }
.rv-playing body { overflow: hidden; }

.reveal { position: fixed; inset: 0; z-index: 100; overflow: hidden; visibility: visible; contain: strict; pointer-events: none; }
.reveal * { box-sizing: border-box; }

.rv-sky { position: absolute; inset: 0; background: linear-gradient(180deg, #294376 0%, #4d6f9c 55%, #769cc2 100%); }
.rv-grain { position: absolute; inset: -64px; opacity: .09; mix-blend-mode: overlay; background-size: 128px 128px; }

.rv-bgpage { position: absolute; inset: 0; overflow: hidden; display: none; }
.rv-bgpage .hero { position: absolute; left: 0; top: 0; min-height: 0; }
.rv-bgpage .hero__inner { visibility: hidden; }

.rv-stage { position: absolute; left: 0; top: 0; width: 1920px; height: 1080px; transform-origin: 0 0; }
.rv-cam { position: absolute; inset: 0; transform-origin: 0 0; }
.rv-lines { position: absolute; inset: 0; width: 1920px; height: 1080px; overflow: visible; }
.rv-glow { position: absolute; left: 1240px; top: -260px; width: 900px; height: 560px; border-radius: 50%; opacity: .55; filter: blur(70px);
  background: linear-gradient(100deg, #8b5cf6 0%, #f9d65c 45%, #2dd4bf 90%); }
.rv-subject { position: absolute; left: 1420px; top: 330px; height: 720px; width: auto; }
.rv-ascii { position: absolute; top: 0; margin: 0; width: 330px; height: 1080px; overflow: hidden;
  font: 500 26px/34px var(--font-mono); color: rgba(255, 255, 255, .85); white-space: pre; letter-spacing: 6px; }
.rv-ascii--l { left: 24px; }
.rv-ascii--r { right: 24px; text-align: right; }

.rv-box, .rv-card__prompt { position: absolute; background: #fff; border-radius: 18px; overflow: hidden;
  box-shadow: 0 30px 80px -20px rgba(10, 20, 50, .45), 0 8px 24px -8px rgba(10, 20, 50, .3); }
.rv-text { position: absolute; left: 28px; right: 28px; top: 22px; font: 400 34.8px/44.4px 'Inter', system-ui, sans-serif; color: #121212;
  letter-spacing: -0.01em; white-space: pre-wrap; word-break: normal; }
.rv-caret { display: inline-block; width: 3px; height: 38px; margin: 0 1px -6px; background: #121212; }
.rv-controls { position: absolute; right: 14px; bottom: 14px; display: flex; align-items: center; gap: 18px; }
.rv-send { width: 56px; height: 56px; border-radius: 50%; background: #000; display: grid; place-items: center; }
.rv-send svg { width: 26px; height: 26px; }
.rv-handle { position: absolute; left: 0; top: 0; width: 14px; height: 14px; margin: -7px 0 0 -7px; background: #fff; border: 2px solid #6b8fc2; border-radius: 3px; }
.rv-cursor { position: absolute; left: 0; top: 0; width: 100px; height: 100px; transform-origin: 0 0; overflow: visible; }

.rv-card { position: absolute; left: 0; top: 0; overflow: hidden; display: none; }
.rv-card__prompt { left: 0; top: 0; width: 763px; height: 596px; transform-origin: 0 0; }
.rv-card__prompt .rv-text { color: inherit; }
.rv-card__shade { position: absolute; inset: 0; }
.rv-card__page { position: absolute; inset: 0; display: none; }
.rv-card__page .hero { position: absolute; }
.rv-card__glass { position: absolute; inset: 0; }

.rv-wash { position: absolute; inset: 0; opacity: 0; }
.rv-wash--violet { background: radial-gradient(120% 90% at 50% 40%, #a77bff, #5b21b6); mix-blend-mode: hard-light; }
.rv-wash--pink { background: linear-gradient(180deg, #ffd1dc 0%, rgba(255, 209, 220, .35) 35%, transparent 60%); }
.rv-wash--lav { background: #d8ccff; }

.rv-skip { position: fixed; right: 16px; bottom: 16px; z-index: 103; visibility: visible;
  height: 36px; padding: 0 14px; border-radius: 999px; border: 1px solid rgba(255, 255, 255, .35);
  background: rgba(0, 0, 0, .35); color: #fff; font: 500 13px/1 var(--font-sans); cursor: pointer;
  backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px); }
.rv-skip:hover { background: rgba(0, 0, 0, .55); }