.brand-lockup{display:inline-flex;align-items:center;gap:13px;text-decoration:none;flex-shrink:0}
.brand-mascot{display:block;width:66px;height:66px;object-fit:contain;flex-shrink:0}
.brand-lockup .wordmark{font-size:28px}
.brand-lockup:hover .brand-mascot{transform:rotate(-6deg);transition:transform .2s ease}
.mascot-welcome[hidden]{display:none!important}
.mascot-welcome{position:fixed;inset:0;z-index:1000;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:22px;background:var(--pink);color:var(--brown);padding:32px;text-align:center;animation:welcome-reveal .25s ease-out both}
.mascot-welcome__logo{width:280px;height:280px;max-width:72vw;object-fit:contain;animation:brownie-hello .85s cubic-bezier(.22,1,.36,1) both}
.mascot-welcome__message{font-family:var(--heading);font-weight:900;font-size:clamp(28px,5vw,42px);letter-spacing:-1.5px;line-height:1.1;margin:5px 0 0;animation:welcome-message .5s .1s ease-out both}
.mascot-welcome__skip{position:absolute;right:max(22px,env(safe-area-inset-right));bottom:max(24px,env(safe-area-inset-bottom));border:1px solid var(--line);border-radius:99px;background:var(--cream);padding:10px 20px;min-height:44px;font-size:12px;font-weight:700}
.mascot-welcome.is-leaving{animation:welcome-away .4s cubic-bezier(.65,0,.35,1) both;pointer-events:none}
@keyframes brownie-hello{0%{opacity:0;transform:translateY(30px) rotate(-12deg) scale(.85)}40%{opacity:1;transform:translateY(-6px) rotate(7deg) scale(1.04)}65%{transform:translateY(0) rotate(-5deg) scale(1)}100%{opacity:1;transform:translateY(0) rotate(0) scale(1)}}
@keyframes welcome-message{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}
@keyframes welcome-reveal{from{opacity:0}to{opacity:1}}
@keyframes welcome-away{from{opacity:1;transform:translateY(0)}to{opacity:0;transform:translateY(-12%)}}
@media(max-width:700px){header{gap:14px}.brand-lockup{gap:8px}.brand-mascot{width:48px;height:48px}.brand-lockup .wordmark{font-size:23px}.brand-lockup .logo-star{font-size:16px;right:-17px}footer .brand-mascot{width:56px;height:56px}.mascot-welcome__logo{width:250px;height:250px}}
@media(prefers-reduced-motion:reduce){.mascot-welcome{display:none!important}.brand-lockup:hover .brand-mascot{transform:none;transition:none}}
@media(max-width:380px){header{padding-inline:16px;gap:10px}.brand-lockup{gap:6px}.brand-mascot{width:40px;height:40px}.brand-lockup .wordmark{font-size:20px}.brand-lockup .logo-star{font-size:14px;right:-14px}header .button.small{padding-inline:10px;font-size:10px;gap:8px}}
