/* VANTAGE 7.1 / THE 21:00 PROLOGUE */
#prologue{position:fixed;inset:0;z-index:180;background:#010106;color:#f5f3ff;overflow:hidden}
html.prologue-lock,body.prologue-lock{overflow:hidden!important;height:100%!important}
#prologueCanvas{position:absolute;inset:0;width:100%;height:100%;display:block;opacity:0;filter:blur(24px) brightness(.25);transition:opacity .4s ease,filter .4s ease}
#prologue.phase-pressure #prologueCanvas{opacity:1;filter:blur(0) brightness(1)}
.prologue-vignette{position:absolute;inset:0;background:radial-gradient(circle at 50% 48%,transparent 12%,rgba(0,0,0,.12) 42%,rgba(0,0,0,.78) 100%);pointer-events:none}
.prologue-grid{position:absolute;inset:0;background:linear-gradient(rgba(196,181,253,.025) 1px,transparent 1px),linear-gradient(90deg,rgba(196,181,253,.02) 1px,transparent 1px);background-size:80px 80px;mask-image:radial-gradient(circle at center,#000,transparent 75%);opacity:.45;pointer-events:none}
.prologue-top{position:absolute;top:26px;left:32px;right:32px;display:flex;justify-content:space-between;align-items:center;font:8px 'JetBrains Mono';letter-spacing:.18em;color:rgba(196,181,253,.52);text-transform:uppercase}
.prologue-time{display:flex;gap:10px;align-items:center}.prologue-time i{width:5px;height:5px;border-radius:50%;background:#ff6b81;box-shadow:0 0 14px rgba(255,107,129,.8);animation:proPulse 1.5s infinite}
.prologue-time strong{font-weight:500;color:rgba(244,243,255,.72)}
.prologue-signal{position:absolute;top:100px;left:32px;width:260px;font:8px/1.7 'JetBrains Mono';letter-spacing:.08em;color:rgba(196,181,253,.4);text-transform:uppercase;opacity:0;transform:translateY(10px);transition:opacity .7s,transform .7s}
.prologue-signal span{display:block;border-top:1px solid rgba(196,181,253,.08);padding:8px 0}.prologue-signal b{color:rgba(244,243,255,.7);font-weight:500;float:right}
.prologue-copy{position:absolute;left:24px;right:280px;bottom:6vh;text-align:center;pointer-events:none}
.prologue-kicker{font:11px 'JetBrains Mono';letter-spacing:.9em;color:rgba(196,181,253,.88);text-transform:uppercase;opacity:0;filter:blur(8px);transition:opacity .4s ease,letter-spacing .4s ease,filter .4s ease}
.prologue-message{font:500 clamp(28px,4.5vw,62px)/1.05 'Cormorant Garamond',serif;letter-spacing:-.01em;margin:18px auto 0;max-width:780px;opacity:0;filter:blur(14px);transform:scale(1.04);transition:opacity .45s ease,filter .45s ease,transform .45s ease}
.prologue-message em{color:#c4b5fd;font-weight:500}
.prologue-sub{font:12px 'JetBrains Mono';letter-spacing:.6em;color:rgba(196,181,253,.82);margin-top:18px;opacity:0;filter:blur(6px);transition:opacity .4s ease,letter-spacing .4s ease,filter .4s ease}
.prologue-note{position:absolute;right:32px;top:100px;width:220px;text-align:right;font:8px/1.8 'JetBrains Mono';letter-spacing:.1em;color:rgba(196,181,253,.35);opacity:0;transform:translateY(10px);transition:opacity .8s,transform .8s}
.prologue-note strong{display:block;color:rgba(244,243,255,.62);font-weight:500}
.prologue-skip{position:absolute;right:28px;bottom:26px;border:none;background:linear-gradient(135deg,#6366f1,#7c3aed);color:#f4f3ff;font:700 13px 'DM Sans',sans-serif;letter-spacing:.03em;padding:14px 22px;border-radius:8px;cursor:pointer;opacity:0;box-shadow:0 8px 30px rgba(99,102,241,.4);transition:opacity .5s ease,transform .2s ease,box-shadow .2s ease}
.prologue-skip.show{opacity:1}.prologue-skip:hover{transform:translateY(-2px);box-shadow:0 12px 40px rgba(99,102,241,.55)}
#prologue.phase-pressure .prologue-signal,#prologue.phase-pressure .prologue-note{opacity:1;transform:none}
#prologue.phase-pressure .prologue-kicker{opacity:1;letter-spacing:.22em;filter:blur(0)}
#prologue.phase-pressure .prologue-message{opacity:1;filter:blur(0);transform:scale(1)}
#prologue.phase-pressure .prologue-sub{opacity:1;letter-spacing:.14em;filter:blur(0);transition-delay:.1s}

.prologue-fade{position:absolute;inset:0;background:#010106;opacity:0;pointer-events:none;transition:opacity 1.1s ease}.prologue-fade.on{opacity:1}
.prologue-countdown{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);text-align:center;opacity:0;transition:opacity .4s ease;pointer-events:none;z-index:2}
.prologue-countdown span{display:block;font:11px 'JetBrains Mono';letter-spacing:.5em;text-transform:uppercase;color:rgba(196,181,253,.88)}
.prologue-countdown strong{display:block;margin-top:10px;font:700 clamp(90px,18vw,220px)/1 'Space Grotesk',sans-serif;color:#f4f3ff;text-shadow:0 0 60px rgba(99,102,241,.7),0 0 130px rgba(124,58,237,.5)}
.prologue-countdown strong.tick{animation:prologueCountTick .5s cubic-bezier(.16,1,.3,1)}
@keyframes prologueCountTick{0%{transform:scale(1.4);opacity:0}55%{transform:scale(.94);opacity:1}100%{transform:scale(1);opacity:1}}
#prologue.countdown .prologue-countdown{opacity:1}
#prologue.countdown .prologue-copy{opacity:0!important;transition:opacity .4s ease}
@keyframes proPulse{50%{opacity:.25;transform:scale(.7)}}
@media(max-width:900px){.prologue-top{left:20px;right:20px}.prologue-signal{left:20px;top:78px;width:190px}.prologue-note{right:20px;top:78px;width:170px}.prologue-copy{right:210px}}
@media(max-width:560px){.prologue-top{font-size:6px}.prologue-top>span:last-child{display:none}.prologue-signal{width:160px;font-size:6px}.prologue-note{width:150px;font-size:6px}.prologue-copy{left:16px;right:16px;bottom:16vh}.prologue-message{font-size:11vw}.prologue-skip{right:16px;bottom:16px;padding:11px 17px;font-size:11px}.prologue-grid{background-size:55px 55px}}
@media(prefers-reduced-motion:reduce){#prologue{display:none}}

#prologue.phase-pressure .prologue-signal span:nth-child(1){transition-delay:.15s}#prologue.phase-pressure .prologue-signal span:nth-child(2){transition-delay:.55s}#prologue.phase-pressure .prologue-signal span:nth-child(3){transition-delay:.95s}#prologue.phase-pressure .prologue-signal span:nth-child(4){transition-delay:1.35s}
