:root{font-family:ui-rounded,"Arial Rounded MT Bold",system-ui,sans-serif;color:#fff;--accent:#c6ff19;--accent-dark:#83ce00;--phone:#813bc4;--dark:#063c37}*{box-sizing:border-box}html,body{margin:0;min-height:100%;background:#071917}body{min-height:100dvh;display:flex;justify-content:center}button{font:inherit;cursor:pointer;-webkit-tap-highlight-color:transparent}button:focus-visible{outline:3px solid white;outline-offset:4px}.game{position:relative;isolation:isolate;width:min(100%,540px);height:100dvh;min-height:580px;overflow:hidden;background:#074d46;touch-action:pan-y}.backdrop,.shade{position:absolute;inset:0;z-index:-2}.backdrop{background:url('assets/slime.png') center/cover;transition:background-image .25s}.shade{z-index:-1;background:linear-gradient(180deg,rgba(1,28,24,.54),transparent 33%,rgba(1,19,20,.14) 67%,rgba(1,15,18,.76))}.game[data-theme=candy]{--accent:#ffc2e9;--accent-dark:#ff74c4;--phone:#ff8fbb;--dark:#551056}.game[data-theme=candy] .backdrop{background-image:url('assets/candy.png')}.game[data-theme=space]{--accent:#8df8ff;--accent-dark:#31daf5;--phone:#6754df;--dark:#102a71}.game[data-theme=space] .backdrop{background-image:url('assets/space.png')}.top{position:absolute;top:max(20px,env(safe-area-inset-top));left:24px;right:24px;display:flex;justify-content:space-between;align-items:flex-start}.logo{font-size:20px;font-weight:1000;line-height:.78;letter-spacing:-1.5px;color:white;text-shadow:2px 3px #321751,-2px -2px #321751,3px 5px #321751;transform:rotate(-7deg)}.logo span{color:var(--accent);font-size:24px}.logo i{font-style:normal;color:var(--accent);position:absolute;top:-7px;right:-17px}.sound{border:2px solid #29340a;color:#16370c;background:var(--accent);border-radius:50%;width:43px;height:43px;font-size:24px;font-weight:900;box-shadow:0 4px 0 #45720c}.intro{position:absolute;top:12%;left:15px;right:15px;text-align:center;text-shadow:0 3px 2px #102d25,0 5px 14px #0009}.eyebrow{font-size:clamp(12px,3vw,15px);font-weight:1000;letter-spacing:.24em;color:var(--accent)}h1{font-size:clamp(30px,8vw,46px);line-height:.98;letter-spacing:-.06em;margin:9px 0 7px;font-weight:1000}.intro p{font-size:14px;margin:0;color:#fffde8;font-weight:700}.stage{position:absolute;inset:29% 0 25%;display:flex;align-items:center;justify-content:center}.phone{position:relative;width:min(46vw,205px);height:min(75vw,330px);min-height:225px;border:5px solid #381447;border-radius:34px;background:linear-gradient(110deg,#c86deb,var(--phone) 30%,#562079 100%);box-shadow:inset 3px 3px 5px #ffffff70,inset -5px -5px 7px #1a003e80,8px 17px 19px #0009;transform:rotate(-7deg);padding:25px 10px 29px;color:#fff}.phone:before{content:"";position:absolute;inset:5px;border:1px solid #ffffff4d;border-radius:25px;pointer-events:none}.phone-speaker{position:absolute;top:11px;left:43%;width:28%;height:5px;background:#261131;border-radius:10px}.phone-camera{position:absolute;top:10px;left:31%;width:7px;height:7px;background:#261131;border-radius:50%}.phone-screen{height:100%;border:4px solid #20112a;border-radius:17px;background:radial-gradient(circle at 50% 35%,#128c72,#082c32 70%);display:flex;align-items:center;flex-direction:column;justify-content:center;overflow:hidden;position:relative}.game[data-theme=candy] .phone-screen{background:radial-gradient(circle,#cc4db4,#421659)}.game[data-theme=space] .phone-screen{background:radial-gradient(circle,#237cbd,#101b50)}.screen-status{position:absolute;top:12px;font-size:8px;letter-spacing:.13em;font-weight:900;color:#ffffffa8}.avatar{background-image:url('assets/characters.png');background-repeat:no-repeat;background-size:300% 100%;background-position:0% 50%;width:100%;aspect-ratio:1}.avatar.candy-avatar{background-position:50% 50%}.avatar.space-avatar{background-position:100% 50%}.phone .avatar{width:95%;filter:drop-shadow(0 6px 5px #0008)}.screen-text{font-size:10px;line-height:1.3;font-weight:1000;letter-spacing:.15em;color:var(--accent)}.screen-bubbles{position:absolute;bottom:10px;color:#ffffff80;font-size:9px}.home-button{position:absolute;bottom:7px;left:calc(50% - 12px);border-radius:50%;width:24px;height:18px;font-size:12px;color:var(--accent);background:#48205c;box-shadow:inset 0 2px 3px #190b25}.ring-lines{display:none;position:absolute;left:12%;right:12%;top:42%;justify-content:space-between;color:var(--accent);font-weight:1000;font-size:24px;text-shadow:0 2px #174e20}.game.ringing .ring-lines{display:flex;animation:pulse .5s infinite alternate}.game.ringing .phone{animation:shake .16s infinite}.bottom{position:absolute;bottom:max(16px,env(safe-area-inset-bottom));left:0;right:0;text-align:center}.pager{display:flex;align-items:center;justify-content:center;gap:20px}.pager>button{border:0;background:transparent;color:var(--accent);font-size:48px;line-height:.7;font-weight:900;text-shadow:0 3px #254526}.dots{display:flex;gap:10px}.dots button{border:0;padding:0;width:10px;height:10px;background:#ffffff65;border-radius:50%}.dots button.active{background:var(--accent);box-shadow:0 0 10px var(--accent)}.bottom p{font-size:11px;letter-spacing:.2em;font-weight:1000;margin:10px 0 13px;text-shadow:0 2px #000}.surprise{background:var(--accent);border:2px solid #112b21;border-radius:20px;padding:8px 17px;color:#173321;font-size:12px;font-weight:1000;box-shadow:0 3px #295f36}.bottom small{display:block;margin-top:11px;font-size:9px;letter-spacing:.14em;font-weight:800;color:#ffffffa3}.call-overlay{position:absolute;inset:0;z-index:5;display:flex;flex-direction:column;align-items:center;background:radial-gradient(ellipse at 50% 38%,#316d49,var(--dark) 65%,#061f22);opacity:0;visibility:hidden;transform:scale(.96);transition:opacity .25s,transform .25s,visibility .25s}.call-overlay.visible{opacity:1;visibility:visible;transform:scale(1)}.game[data-theme=candy] .call-overlay{background:radial-gradient(ellipse at 50% 38%,#ad4c9b,#491356 70%,#290e39)}.game[data-theme=space] .call-overlay{background:radial-gradient(ellipse at 50% 38%,#3181ad,#142d72 70%,#101541)}.call-header{width:100%;padding:max(25px,env(safe-area-inset-top)) 25px 0;display:flex;justify-content:space-between;align-items:center;font-weight:1000;letter-spacing:.12em;font-size:12px;color:#ffffffaa}.call-header button{color:white;background:#ffffff20;border:0;width:36px;height:36px;border-radius:50%;font-size:26px;line-height:1}.call-content{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;width:100%;padding:0 24px}.call-label{font-size:10px;letter-spacing:.2em;color:var(--accent);font-weight:1000}.call-avatar-wrap{width:min(58vw,250px);aspect-ratio:1;border-radius:50%;background:#ffffff1a;border:2px solid #ffffff33;display:grid;place-items:center;margin:12px 0;box-shadow:0 0 60px #ffffff1c}.call-avatar-wrap .avatar{width:95%;filter:drop-shadow(0 10px 9px #0006)}h2{font-size:clamp(36px,10vw,52px);letter-spacing:-.05em;line-height:1;margin:5px 0;font-weight:1000}.call-status{margin:4px 0;font-weight:700;color:#ffffffc9}.subtitle{height:3em;text-align:center;font-size:13px;color:#ffffffb0;max-width:300px}.call-actions{width:100%;display:flex;justify-content:center;gap:80px;padding-bottom:22px}.call-actions.hidden{display:none}.action{display:flex;flex-direction:column;align-items:center;gap:10px;border:0;background:none;color:white;font-size:13px;font-weight:800}.action-icon{width:67px;height:67px;border-radius:50%;display:grid;place-items:center;font-size:32px;color:white;box-shadow:0 5px 0 #0004}.action-icon.red{background:#f34860;transform:rotate(135deg)}.action-icon.green{background:#64d75e}.call-disclaimer{font-size:9px;font-weight:800;letter-spacing:.15em;color:#ffffff85;margin:0 0 max(28px,env(safe-area-inset-bottom))}.toast{position:absolute;top:24%;left:50%;transform:translateX(-50%);background:#142a25e8;color:white;border-radius:30px;padding:9px 15px;font-size:12px;font-weight:700;white-space:nowrap;opacity:0;pointer-events:none;transition:opacity .2s}.toast.show{opacity:1}@keyframes shake{0%,100%{transform:rotate(-7deg) translateX(0)}25%{transform:rotate(-10deg) translateX(-3px)}75%{transform:rotate(-4deg) translateX(3px)}}@keyframes pulse{to{transform:scale(1.15);opacity:.5}}@media(max-height:650px){.intro{top:11%}.intro h1{font-size:30px}.stage{inset:27% 0 24%}.phone{height:245px;width:150px}.bottom p{margin:6px 0}.bottom small{margin-top:6px}.surprise{padding:6px 12px}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}
/* Keep the prop clear of the headline on short viewports. */
.stage{inset:34% 0 24%}.phone{height:min(75vw,37vh,330px);min-height:190px;width:min(46vw,23vh,205px);min-width:120px}@media(max-height:650px){.stage{inset:32% 0 25%}.phone{height:min(37vh,245px);width:min(23vh,150px);min-height:180px}}

.notifications{display:block;margin:9px auto 0;border:0;background:transparent;color:white;text-decoration:underline;text-underline-offset:3px;font-size:11px;font-weight:700}.notifications[hidden]{display:none}
