#quistySurprise{width:min(420px,calc(100vw - 32px));max-height:calc(100dvh - 32px);padding:0;border:0;background:transparent;color:white;overflow:auto}
#quistySurprise::backdrop{background:#160b25d9}
#quistySurprise button{display:flex;flex-direction:column;align-items:center;gap:16px;width:100%;padding:12px;border:0;background:transparent;color:white;box-shadow:none;cursor:pointer}
#quistySurprise[open] button{animation:quisty-hello .45s ease-out}
.quisty-surprise-bubble{position:relative;display:block;padding:20px;border-radius:24px;background:#fff;color:#20102c;font-size:clamp(20px,5vw,28px);font-weight:700;line-height:1.25;text-align:center}
.quisty-surprise-bubble::after{content:"";position:absolute;bottom:-12px;left:45%;border:14px solid transparent;border-top-color:#fff;border-bottom:0}
.quisty-surprise-bubble strong{display:block;margin-top:8px;color:#7132ce}
.quisty-surprise-mascot{display:block;flex:none;width:min(300px,65vw,42dvh);aspect-ratio:1;border-radius:50%;border:4px solid #c2ff00;background:url('/assets/quisty-mascots-carnival.png') top left/200% 200%;box-shadow:0 0 32px #00ced355}
.quisty-surprise-dismiss{font-size:14px;font-weight:600}
@keyframes quisty-hello{from{opacity:0;transform:translateY(45px) scale(.75)}to{opacity:1;transform:none}}
@media(prefers-reduced-motion:reduce){#quistySurprise[open] button{animation:none}}