/* Invite and guide share Khamora's orange/glass vocabulary. */
.sr-only{position:absolute!important;width:1px;height:1px;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.promo-dialog{position:fixed;inset:0;width:min(510px,calc(100vw - 32px));max-height:calc(100dvh - 32px);overflow-y:auto;border:1px solid #ffffff30;border-radius:28px;padding:38px 34px 30px;background:radial-gradient(ellipse at 50% 0,#ff6b162b,transparent 55%),#252525;color:#f5f2ed;text-align:center;box-shadow:0 35px 120px #0009;color-scheme:dark}
.promo-dialog::backdrop{background:#101010aa;backdrop-filter:blur(9px)}
.promo-dialog[open]{animation:inviteEnter .5s cubic-bezier(.2,.8,.2,1)}
.promo-is-open{overflow:hidden}.promo-is-open .slime-guide{visibility:hidden}
.promo-close{position:absolute;top:12px;right:12px;display:grid;place-items:center;width:40px;height:40px;background:#ffffff08;color:#ccc;border-radius:50%;font-size:25px;font-weight:400}
.promo-close:hover{background:#ffffff15;color:#fff}
.promo-orbit{width:60px;height:60px;margin:0 auto 20px;border-radius:19px;border:1px solid #ffb08550;background:linear-gradient(135deg,#ff914b40,#ff6b1610);display:grid;place-items:center;box-shadow:0 10px 35px #ff6b1615;transform:rotate(-8deg)}
.promo-orbit span{font-size:34px;color:#ffad7b;animation:inviteStar 4s ease-in-out infinite}
.promo-eyebrow{font-size:12px;letter-spacing:.12em;color:#ffb185;font-weight:600}
.promo-dialog h2{font-size:clamp(28px,5vw,36px);line-height:1.18;letter-spacing:-1.3px;margin:17px 0;font-weight:600}
.promo-dialog h2 em{font-style:normal;color:#ff9b5b}
.promo-dialog p{font-size:16px;line-height:1.7;color:#bebbb6;margin:16px 0 24px}
.promo-primary,.promo-secondary{display:flex;align-items:center;justify-content:center;min-height:52px;width:100%;padding:15px 18px;border-radius:12px;text-decoration:none;line-height:1.4;font-size:16px;font-weight:600;transition:transform .22s,background .22s;cursor:pointer}
.promo-primary{background:#ff6b16;color:#171717;border:1px solid #ff9c60;box-shadow:0 8px 24px #ff6b1622}
.promo-primary:hover{transform:translateY(-2px);background:#ff8742;color:#171717}
.promo-primary:active{transform:scale(.97)}
.promo-secondary{background:#ffffff05;border:1px solid #ffffff22;color:#c6c3bd;margin-top:10px}
.promo-secondary:hover{background:#ffffff10;color:#fff}
.promo-ticket{position:relative;background:#19191988;border:1px solid #ffad7a50;padding:23px 12px 14px;border-radius:18px;margin:22px 0;box-shadow:inset 0 1px #ffffff08;overflow:hidden}
.promo-ticket:before{content:'';position:absolute;inset:0;background:linear-gradient(115deg,transparent 20%,#ffb28114 50%,transparent 80%);transform:translateX(-100%);animation:ticketShine 1.3s .35s ease-out forwards;pointer-events:none}
.promo-ticket>span{display:block;font-size:11px;letter-spacing:.12em;color:#bd9680}
.promo-code{display:flex;align-items:center;justify-content:center;gap:7px;margin:18px 0 10px;user-select:all;direction:ltr;min-height:56px;font-family:ui-monospace,SFMono-Regular,Consolas,monospace}
.promo-code span{display:grid;place-items:center;width:44px;height:54px;border:1px solid #ffffff15;background:linear-gradient(#ffffff0c,#ffffff02);border-radius:8px;color:#ffc39c;font-size:30px;font-weight:600;box-shadow:inset 0 1px #ffffff13;animation:codeSlot .6s cubic-bezier(.2,.85,.2,1) both;animation-delay:var(--slot-delay,0ms)}
.promo-copy{font-size:13px;color:#c9b3a4;background:transparent;min-height:36px;padding:8px 14px;text-decoration:underline;text-underline-offset:4px}
.promo-copy:hover{color:#fff}
.promo-dialog .promo-fineprint{font-size:12px;line-height:1.65;margin:16px 10px 0;color:#97938e}
.promo-later{margin-top:15px}.promo-code[aria-label]{outline-offset:8px}
.promo-dialog [hidden],.slime-guide[hidden],.slime-guide [hidden]{display:none!important}
.welcome-mascot{width:130px;height:130px;margin:-7px auto 5px;position:relative}
.welcome-mascot:before{content:'';position:absolute;inset:20%;border-radius:50%;background:#ff6b1625;filter:blur(24px)}
.welcome-mascot span{display:block;width:100%;height:100%;position:relative;background:url('assets/chameleon-slime.png') 100% 0/200% 200% no-repeat;animation:slimeIdle 3.1s ease-in-out infinite;transform-origin:50% 82%;filter:drop-shadow(0 8px 8px #0003)}
.welcome-dialog h2{margin-top:16px}.welcome-dialog .promo-fineprint{margin-top:20px}
@media(max-width:700px){.welcome-mascot{width:100px;height:100px;margin-top:-8px}.welcome-dialog .promo-eyebrow{font-size:11px}.welcome-dialog .promo-secondary{font-size:15px}}
@media(prefers-reduced-motion:reduce){.welcome-mascot span{animation:none}}
@keyframes inviteEnter{from{opacity:0;transform:translateY(30px) scale(.94)}to{opacity:1;transform:none}}
@keyframes inviteStar{50%{transform:rotate(25deg) scale(1.08)}}
@keyframes ticketShine{to{transform:translateX(100%)}}
@keyframes codeSlot{from{opacity:0;transform:translateY(12px) rotateX(-75deg)}60%{transform:translateY(-3px) rotateX(8deg)}to{opacity:1;transform:none}}

/* The character is a generated RGBA spritesheet, with four expressions. */
.slime-guide{position:fixed;left:0;top:0;width:112px;height:112px;z-index:14;will-change:transform;pointer-events:none}
.slime-character{position:relative;width:112px;height:112px;padding:0;border:0;border-radius:45%;background:transparent;pointer-events:auto;display:block;cursor:pointer;touch-action:manipulation}
.slime-motion{position:absolute;inset:0;transform-origin:50% 82%;display:block;animation:slimeIdle 3.1s ease-in-out infinite;filter:drop-shadow(0 6px 5px #0002)}
.slime-sprite{display:block;width:100%;height:100%;background:url('assets/chameleon-slime.png') 0 0/200% 200% no-repeat;transform:rotate(var(--slime-lean,0deg));transform-origin:50% 75%;transition:transform .2s ease-out}
.slime-guide[data-mood=happy] .slime-sprite{background-position:100% 0}
.slime-guide[data-mood=surprised] .slime-sprite{background-position:0 100%}
.slime-guide[data-mood=wink] .slime-sprite{background-position:100% 100%}
.slime-shadow{position:absolute;left:22%;right:12%;bottom:13%;height:9px;border-radius:50%;background:#0003;filter:blur(4px);animation:slimeShadow 3.1s ease-in-out infinite}
.slime-guide.is-travelling .slime-motion{animation:slimeWalk .42s ease-in-out infinite}
.slime-character:hover .slime-motion{animation:slimeGreeting .65s ease-in-out infinite alternate}
.slime-hide{position:absolute;top:4px;right:0;width:24px;height:24px;background:#292929bb;border:1px solid #ffffff24;color:#ccc;font-size:17px;border-radius:50%;pointer-events:auto;opacity:.45;transition:opacity .2s;display:grid;place-items:center;padding:0}
.slime-guide:hover .slime-hide,.slime-hide:focus-visible{opacity:1}
.slime-speech{position:absolute;bottom:102px;left:6px;width:230px;max-width:calc(100vw - 32px);background:#252525f5;backdrop-filter:blur(12px);border:1px solid #ff6b1655;border-radius:16px 16px 16px 5px;box-shadow:0 12px 40px #0003;padding:18px 25px 17px 17px;pointer-events:auto;animation:speechIn .3s ease-out;color:#eeebe6}
.slime-guide.side-right .slime-speech{left:auto;right:0;border-radius:16px 16px 5px 16px}
.slime-speech p{margin:0;line-height:1.5;font-size:14px;color:#ded9d1}
.slime-speech-close{position:absolute;right:4px;top:2px;font-size:20px;background:transparent;color:#b1a9a1;width:25px;height:25px;padding:0}
.slime-action{display:inline-flex;color:#ffb787;font-size:13px;background:#ff6b1615;border:1px solid #ff6b1628;border-radius:7px;margin-top:12px;padding:9px 13px;min-height:36px}
.slime-action:hover{color:#fff;background:#ff6b1633}
@keyframes slimeIdle{0%,100%{transform:translateY(0) scale(1.02,.97)}48%{transform:translateY(-5px) scale(.97,1.035)}72%{transform:translateY(-2px) scale(1,1)}}
@keyframes slimeShadow{50%{transform:scale(.88);opacity:.55}}
@keyframes slimeWalk{0%,100%{transform:translateY(0) scale(1.07,.94) rotate(-2deg)}50%{transform:translateY(-7px) scale(.94,1.07) rotate(2deg)}}
@keyframes slimeGreeting{from{transform:translateY(1px) scale(1.08,.94) rotate(-4deg)}to{transform:translateY(-5px) scale(.94,1.08) rotate(4deg)}}
@keyframes speechIn{from{opacity:0;transform:translateY(8px) scale(.97)}to{opacity:1;transform:none}}
@media(max-width:700px){.promo-dialog{padding:32px 24px 26px;border-radius:22px}.promo-dialog p{font-size:15px;line-height:1.6}.promo-code{gap:5px}.promo-code span{width:36px;height:46px;font-size:26px}.promo-ticket{padding-inline:8px}.promo-ticket>span{font-size:10px;letter-spacing:.07em}.slime-guide,.slime-character{width:80px;height:80px}.slime-speech{bottom:76px;width:210px;left:0;padding:15px 24px 15px 15px}.slime-hide{width:22px;height:22px;font-size:16px;top:0}.slime-speech p{font-size:13px}}
@media(prefers-reduced-motion:reduce){.promo-dialog[open],.promo-orbit span,.promo-ticket:before,.promo-code span,.slime-motion,.slime-shadow,.slime-guide.is-travelling .slime-motion,.slime-character:hover .slime-motion,.slime-speech{animation:none!important}.slime-sprite,.promo-primary,.promo-secondary{transition:none}}
