/* Countdown → one soft bloom of light → the untouched greeting card. */
body.is-locked { background:#2a1523; }
.opening { background:radial-gradient(ellipse at 50% 43%,#52273c,#2a1523 72%); }
.countdown { width:min(90vw,760px); display:flex; flex-direction:column; align-items:center; text-align:center; color:#fff1e8; transform:translateY(-2svh); position:relative; z-index:2; }
.countdown::before { content:''; position:absolute; width:80%; height:180%; top:-42%; left:10%; border-radius:50%; background:radial-gradient(ellipse,#f4adc513,transparent 70%); filter:blur(25px); pointer-events:none; }
.countdown-date { font-size:10px; font-weight:500; letter-spacing:.4em; color:#dfaab8; margin-bottom:38px; }
.countdown-clock { display:flex; justify-content:center; align-items:start; gap:clamp(8px,2vw,28px); font-variant-numeric:tabular-nums; }
.countdown-unit { display:flex; flex-direction:column; align-items:center; gap:17px; }
.countdown-unit b { font-size:clamp(48px,15vw,112px); line-height:1; font-weight:300; letter-spacing:-.07em; padding-right:.07em; text-shadow:0 0 38px #ffd8de18; }
.countdown-unit small { font-size:8px; letter-spacing:.25em; font-weight:400; color:#d4a6b3; }
.countdown-clock>i { font-style:normal; font-weight:300; font-size:clamp(23px,7vw,54px); line-height:1.55; color:#b27991; }
.countdown-note { margin-top:42px; color:#c79eaa; font-size:11px; font-weight:400; letter-spacing:.025em; }
.opening-card { display:block; width:100%; height:100%; padding:0; background:transparent; border:0; position:absolute; inset:0; cursor:pointer; }
.opening-card img { width:100%; height:100%; object-fit:contain; }
.opening-card:focus-visible { outline:3px solid #fff8ed; outline-offset:-9px; }
.opening.is-card { background:#82d9f4; }
.midnight-light { position:absolute; inset:-40%; z-index:5; pointer-events:none; opacity:0; background:radial-gradient(ellipse at center,#fffdf5 0%,#fff2e9f0 24%,#ffdce680 43%,#fff0 65%); }
.is-midnight .midnight-light { animation:midnight-bloom 1.8s cubic-bezier(.2,.7,.25,1) both; }
.is-midnight .countdown { opacity:0; transform:translateY(-2svh) scale(1.04); transition:opacity .4s,transform .8s; }
.is-midnight .opening-card { animation:meme-arrives 1.1s ease both; }
@keyframes midnight-bloom {
  0% { opacity:0; transform:scale(.15); }
  25% { opacity:1; transform:scale(1); }
  55% { opacity:.9; transform:scale(1.35); }
  100% { opacity:0; transform:scale(1.7); }
}
@keyframes meme-arrives { from { opacity:0; transform:scale(.975); filter:blur(5px); } to { opacity:1; transform:scale(1); filter:blur(0); } }
@media (max-width:767px) {
 .countdown-date { font-size:8px; margin-bottom:29px; }
 .countdown-unit { gap:13px; }
 .countdown-unit small { font-size:6px; letter-spacing:.19em; }
 .countdown-note { font-size:10px; margin-top:34px; }
}
@media (max-height:500px) and (min-aspect-ratio:1/1) {
 .countdown-date { margin-bottom:18px; }
 .countdown-unit b { font-size:min(15vw,22svh); }
 .countdown-clock>i { font-size:11svh; }
 .countdown-note { margin-top:20px; }
}
@media (prefers-reduced-motion:reduce) {
 .is-midnight .midnight-light { display:none; }
 .opening.departing { transform:none; filter:none; }
}
