*{box-sizing:border-box}
html,body{margin:0;min-height:100%}
body{
  min-height:100vh;display:flex;align-items:center;justify-content:center;padding:2rem 1rem;
  font-family:"Trebuchet MS","Comic Sans MS",Verdana,sans-serif;color:#4b2a63;text-align:center;
  background:linear-gradient(170deg,#241a4d 0%,#5b3f8f 40%,#d98fc0 78%,#ffd6e8 100%) fixed;
  overflow-x:hidden;
}
.sky{position:fixed;inset:0;pointer-events:none;z-index:0}
.s{position:absolute;color:#fff7c2;text-shadow:0 0 8px #fff3a0,0 0 16px #ffb3e6;animation:twinkle 3s ease-in-out infinite}
.s1{top:6%;left:8%;font-size:22px}.s2{top:14%;left:28%;font-size:14px;animation-delay:.7s}
.s3{top:9%;left:72%;font-size:18px;animation-delay:1.4s}.s4{top:22%;left:90%;font-size:26px;animation-delay:.3s}
.s5{top:38%;left:4%;font-size:16px;animation-delay:2s}.s6{top:48%;left:94%;font-size:14px;animation-delay:1.1s}
.s7{top:64%;left:10%;font-size:20px;animation-delay:.5s}.s8{top:78%;left:86%;font-size:18px;animation-delay:1.8s}
.s9{top:86%;left:22%;font-size:12px;animation-delay:2.4s}.s10{top:4%;left:50%;font-size:14px;animation-delay:1.6s}
.s11{top:30%;left:60%;font-size:10px;animation-delay:.9s}.s12{top:92%;left:60%;font-size:16px;animation-delay:.2s}
@keyframes twinkle{0%,100%{opacity:.25;transform:scale(.8) rotate(0)}50%{opacity:1;transform:scale(1.15) rotate(20deg)}}

.card{
  position:relative;z-index:1;max-width:560px;width:100%;padding:1.5rem 1.75rem 1.25rem;
  background:#fff8fc;border:4px double #c77dba;border-radius:22px;
  box-shadow:0 0 0 6px #ffe3f3,0 14px 40px rgba(36,26,77,.45);
}
.towers{display:flex;justify-content:center;align-items:flex-end;gap:6px;height:64px;margin:-4.2rem auto .4rem}
.t{display:block;width:26px;background:linear-gradient(#f7c6e4,#e6a2d0);border-radius:3px 3px 0 0;position:relative}
.t::before{content:"";position:absolute;left:-5px;right:-5px;bottom:100%;border-left:18px solid transparent;border-right:18px solid transparent;border-bottom:26px solid #8f6bd1;margin:0 auto;width:0}
.t::after{content:"\2605";position:absolute;left:50%;transform:translateX(-50%);bottom:calc(100% + 22px);color:#ffe066;font-size:12px;text-shadow:0 0 6px #fff3a0}
.t1{height:30px}.t2{height:44px}.t3{height:60px;width:32px}
.t3::before{border-left-width:21px;border-right-width:21px;border-bottom-width:32px}.t3::after{bottom:calc(100% + 28px)}

h1{
  margin:.2rem 0 .1rem;font-family:"Brush Script MT","Lucida Handwriting",cursive;font-weight:normal;
  font-size:clamp(2.6rem,9vw,3.8rem);color:#b2459a;letter-spacing:.02em;
  text-shadow:2px 2px 0 #ffd1ec,4px 4px 0 #c9b5f2;
}
h1 span{font-size:.55em;color:#7a57b8}
.tag{margin:.2rem 0 1rem;font-size:.95rem;color:#7a57b8}

.polaroid{display:inline-block;margin:.25rem auto 1rem;padding:10px 10px 6px;background:#fff;
  box-shadow:0 6px 16px rgba(75,42,99,.3);transform:rotate(-3deg)}
.polaroid img{display:block;max-width:100%;height:auto}
.polaroid figcaption{font-family:"Comic Sans MS","Chalkboard SE",cursive;font-size:.85rem;color:#8a6a9c;padding-top:6px}

.motto{margin:.2rem 0 1rem;font-family:Georgia,serif;font-style:italic;font-size:1.2rem;color:#5b3f8f}

.marquee{overflow:hidden;white-space:nowrap;background:#3b2a6b;color:#fff3a0;border-radius:999px;
  padding:.35rem 0;font-size:.85rem;letter-spacing:.05em;border:2px dotted #f7c6e4}
.marquee span{display:inline-block;padding-left:0;animation:scroll 30s linear infinite}
@keyframes scroll{to{transform:translateX(-50%)}}

.soon{margin:1rem 0 .6rem;font-size:1.5rem;font-weight:bold;color:#b2459a;animation:glow 2.4s ease-in-out infinite}
@keyframes glow{50%{text-shadow:0 0 10px #ffb3e6,0 0 20px #d4c2ff}}

.counter{margin:.3rem 0;display:inline-flex;gap:2px}
.counter span{display:inline-block;width:1.2em;background:#111;color:#7CFC00;font-family:"Courier New",monospace;font-weight:bold;border:1px solid #666;padding:1px 0}
.foot{margin:.4rem 0 0;font-size:.72rem;color:#9b7fae}

@media (prefers-reduced-motion:reduce){.s,.marquee span,.soon{animation:none}.marquee span{padding-left:0}}