.friend-portal{position:absolute;z-index:15;display:flex;gap:10px;align-items:center;padding:12px 19px;border:1px solid #d4b6ff;border-radius:30px;background:#382557e8;color:#fff4ff;text-decoration:none;font:600 14px/1.3 'DM Sans',sans-serif;box-shadow:0 0 24px #b978ff33;max-width:90%}.friend-portal>span:first-child{font-size:27px;color:#dbb7ff}.friends-bob .friend-portal{right:5%;top:105px}.friends-salady .friend-portal{left:25px;top:100px}.friend-portal:focus-visible{outline:3px solid #d0ff7b;outline-offset:4px}.friend-warp{position:fixed;inset:0;z-index:1000;background:#130923;display:none;overflow:hidden;place-items:center;pointer-events:none}.friend-warp.active{display:grid}.friend-warp strong{z-index:2;position:relative;font:700 clamp(25px,5vw,65px)/1.2 sans-serif;color:#fff;text-shadow:0 0 20px #17051d;text-align:center;padding:20px}.friend-rings{position:absolute;width:220vmax;height:220vmax;background:repeating-radial-gradient(ellipse,#180827 0 20px,#7f40ae 35px,#91ffe1 40px,#190823 48px,#190823 100px);animation:friendWarp 1.7s ease-in forwards;opacity:.8}.friends-leaving{pointer-events:none}.visiting-friend{position:absolute;background:none;border:0;padding:0;z-index:5;cursor:pointer;transform-origin:50% 95%;animation:friendBreathe 4s ease-in-out infinite}.visiting-friend img{width:100%;height:100%;object-fit:contain;pointer-events:none;filter:drop-shadow(0 15px 12px #06221b70)}.visiting-friend>span{position:absolute;bottom:-16px;left:50%;transform:translateX(-50%);background:#332a49eb;color:#fff6ec;white-space:nowrap;border-radius:25px;padding:8px 12px;font:600 13px sans-serif}.friends-bob .visiting-friend{left:12%;top:28%;height:34%;width:28%}.friends-bob.friend-visiting .intro{visibility:hidden}.friends-bob.friend-visiting .bubble{top:39%;right:5%;max-width:300px}.friends-salady .visiting-friend{left:34%;top:33%;height:47%;width:23%;z-index:7}.friend-chat{position:absolute;z-index:16;background:#172d2cef;border:1px solid #c6dbad80;border-radius:20px;padding:16px 20px;color:#f8ffeb;box-shadow:0 12px 40px #0004;width:min(520px,90%);font:400 15px/1.45 'DM Sans',sans-serif}.friend-chat p{font:inherit;margin:3px 0;color:inherit}.friend-chat p:first-child{color:#d1ff8c}.friend-chat[hidden]{display:none}.friends-bob .friend-chat{left:6%;top:110px}.friends-salady .friend-chat{left:50%;transform:translateX(-50%);top:105px}.friend-actions{display:flex;gap:8px;margin-top:12px}.friend-actions button{border:1px solid #9cbd8670;border-radius:25px;background:#294b3a;color:#f5ffe5;padding:9px 13px;cursor:pointer;font:600 13px sans-serif;min-height:38px}.friend-actions button:last-child{margin-left:auto}.visiting-friend.friend-dance{animation:friendDance .4s ease-in-out infinite}.visiting-friend.friend-arriving{animation:friendArrive 1.5s ease-out}.moon .scene,.candy .scene{filter:none}.travelling.moon .scene,.travelling.candy .scene{filter:blur(6px)}
@keyframes friendWarp{0%{transform:scale(.12) rotate(0)}100%{transform:scale(2.5) rotate(130deg)}}@keyframes friendDance{0%,100%{transform:rotate(-10deg)}50%{transform:translateY(-20px) rotate(10deg)}}@keyframes friendBreathe{50%{transform:translateY(-7px)}}@keyframes friendArrive{0%{transform:scale(.01) rotate(-360deg);opacity:0}100%{transform:scale(1);opacity:1}}
@media(max-width:700px){.friends-bob .friend-portal{top:255px;right:6%;font-size:12px;padding:7px 12px}.friends-bob .friend-portal>span:first-child{font-size:23px}.friends-bob .friend-chat{top:91px;left:5%;padding:12px 14px;font-size:13px}.friends-bob.friend-visiting .actor{left:45%;width:51%;top:34%;height:29%}.friends-bob .visiting-friend{left:4%;width:44%;top:37%;height:26%}.friends-bob.friend-visiting .bubble{top:33%;left:5%;right:5%;font-size:14px;max-width:none}.friends-salady .friend-portal{top:80px;left:16px;padding:9px 13px;font-size:12px}.friends-salady .friend-chat{top:auto;bottom:135px;font-size:13px;padding:12px 14px}.friends-salady .visiting-friend{left:42%;width:17%;top:47%;height:32%}.friends-salady.friend-visiting .speech{top:140px}.friend-actions button{font-size:12px;padding:8px 10px}.visiting-friend>span{font-size:11px;padding:7px 9px}.friends-bob.friend-visiting .intro{display:block}}
@media(prefers-reduced-motion:reduce){.friend-rings,.visiting-friend{animation:none!important}}
.reduced-motion .friend-rings,.reduced-motion .visiting-friend{animation:none!important}

.friends-salady.friend-visiting #stage.forest #character{left:54%;width:29%}.friends-salady.friend-visiting #stage.forest .visiting-friend{left:33%;width:23%;top:36%;height:44%}.friends-salady.friend-visiting #stage.house .visiting-friend{left:31%;top:44%;height:34%;width:22%}.friends-leaving .friend-chat{visibility:hidden}.travelling .visiting-friend,.travelling .friend-chat,.travelling .friend-portal{visibility:hidden}

@media(min-width:701px){.friends-bob .friend-chat{width:min(450px,52%)}.friends-salady .friend-chat{top:165px}}