.sb-intro{position:fixed;inset:0;z-index:300;display:grid;place-items:center;overflow:hidden;background:radial-gradient(60% 50% at 50% 45%,#FFF0F8,#FFD3EA 60%,#FFC1E2);clip-path:circle(150% at 50% 50%);transition:clip-path .7s cubic-bezier(.7,0,.3,1),opacity .35s .35s}
.sb-intro.is-out{clip-path:circle(0% at 50% 50%);opacity:0;pointer-events:none}
.sb-nointro .sb-intro{display:none}
html.sb-intro-on{overflow:hidden}
.sb-intro__logo{position:relative;z-index:2;width:min(72vw,380px);animation:sb-in-pop .95s cubic-bezier(.34,1.56,.64,1) both}
.sb-intro__logo img{display:block;width:100%;height:auto;filter:drop-shadow(0 14px 22px rgba(200,40,130,.25))}
.sb-intro__logo span{display:block;text-align:center;font:700 44px/1 'Fredoka',system-ui,sans-serif;color:#FF3E9A}
@keyframes sb-in-pop{0%{transform:scale(0) rotate(-14deg);opacity:0}45%{transform:scale(1.12) rotate(3deg);opacity:1}62%{transform:scale(1.14,.86) rotate(0)}78%{transform:scale(.95,1.06)}90%{transform:scale(1.02,.98)}100%{transform:none}}
.sb-intro i{position:absolute;bottom:-60px;width:var(--s,30px);height:var(--s,30px);border-radius:50%;background:radial-gradient(circle at 32% 30%,#fff 0 18%,rgba(255,255,255,.35) 30%,rgba(255,125,192,.35) 70%);box-shadow:inset 0 0 0 2px rgba(255,255,255,.7);left:var(--x,50%);animation:sb-in-bub 1.4s ease-out var(--dl,0s) both}
@keyframes sb-in-bub{0%{transform:translateY(0) scale(.5);opacity:0}20%{opacity:1}100%{transform:translateY(-70vh) scale(1.1);opacity:0}}
@media(prefers-reduced-motion:reduce){.sb-intro{display:none}}