/* MixUp Portal v121 — the centre dock button is MixUp's signature moment. */
:root{--portal-ease:cubic-bezier(.16,.82,.2,1)}
.navfoot.v109-dock .v96-nav-mixitup{
 position:relative;isolation:isolate;
 box-shadow:0 10px 28px #bc38c462,0 0 0 3px #ffffffbc,inset 0 2px 11px #ffffff80!important;
 background:radial-gradient(circle at 36% 24%,#e4a3ff 0%,#ab5cfd 25%,#7433cc 58%,#db3295 100%)!important;
 color:#fff!important;transition:box-shadow .25s ease,filter .25s ease!important;
 overflow:visible!important;cursor:pointer;
}
.navfoot.v109-dock .v96-nav-mixitup::before{
 content:"";position:absolute;inset:-5px;border:2px solid #fff6;border-radius:50%;pointer-events:none;
 box-shadow:0 0 14px #d65cfe83,inset 0 0 8px #fcb5ff85;
 animation:mixportal-heartbeat 3.5s ease-in-out infinite;
}
.navfoot.v109-dock .v96-nav-mixitup::after{
 content:"✧";position:absolute;top:8px;right:15px;font:800 16px/1 sans-serif;
 color:#fff9c5;text-shadow:0 0 8px #fff;pointer-events:none;
 animation:mixportal-sparkle 3s ease-in-out infinite;
}
.navfoot.v109-dock .v96-nav-mixitup span{filter:drop-shadow(0 3px 8px #321565ac);display:block;transition:transform .2s ease}
@media(hover:hover) and (pointer:fine){
 .navfoot.v109-dock .v96-nav-mixitup:hover{filter:brightness(1.16)!important;box-shadow:0 12px 35px #c74cec9a,0 0 0 4px #fff,inset 0 2px 11px #fff9!important}
 .navfoot.v109-dock .v96-nav-mixitup:hover span{transform:rotate(-12deg) scale(1.1)}
}
@keyframes mixportal-heartbeat{0%,100%{opacity:.5;scale:1}50%{opacity:.95;scale:1.045}}
@keyframes mixportal-sparkle{0%,100%{opacity:.35;scale:.7}50%{opacity:1;scale:1.35}}
#mixportal-overlay{position:fixed;inset:0;z-index:9999;display:grid;place-items:center;
 background:radial-gradient(ellipse at 50% 44%,#27256aef 0%,#150d42f5 42%,#080c24fc 100%);
 color:#fff;overflow:hidden;isolation:isolate;opacity:1}
#mixportal-overlay::before{content:"";position:absolute;inset:-70%;pointer-events:none;
 background:conic-gradient(from 0deg at 50% 50%,transparent 0 8%,#e450ff3c 10%,transparent 20% 29%,#39d9f73b 32%,transparent 43% 54%,#e2acff27 59%,transparent 66% 80%,#53f5ff37 84%,transparent 90%);
 animation:mixportal-storm 2.7s linear infinite}
#mixportal-overlay::after{content:"";position:absolute;inset:0;pointer-events:none;
 background:radial-gradient(circle at center,#fff0 0 27%,#0007 80%)}
.mixportal-core{position:relative;width:min(360px,89vw);height:min(410px,73vh);display:flex;
 flex-direction:column;align-items:center;justify-content:center;z-index:2}
.mixportal-rings{position:absolute;inset:0;display:grid;place-items:center;pointer-events:none}
.mixportal-ring{position:absolute;width:68%;aspect-ratio:1;border-radius:50%;
 border:3px solid transparent;filter:drop-shadow(0 0 9px #66eafa);
 border-top-color:#80f8ff;border-bottom-color:#ff77f8;
 animation:mixportal-spin 1.8s linear infinite,mixportal-bloom 1.58s var(--portal-ease) both}
.mixportal-ring:nth-child(2){width:87%;border-width:6px;border-left-color:#f4b2ff;border-right-color:#6b8dff;
 border-top-color:transparent;border-bottom-color:transparent;
 animation-duration:2.8s,1.58s;animation-direction:reverse,normal}
.mixportal-ring:nth-child(3){width:106%;border-width:2px;border-left-color:#ffcf79;border-bottom-color:#ff58d1;
 border-top-color:transparent;border-right-color:transparent;animation-duration:3.7s,1.58s}
.mixportal-orb{position:relative;z-index:3;width:43%;aspect-ratio:1;border-radius:50%;display:grid;place-items:center;
 border:3px solid #ffffffc9;box-shadow:0 0 18px #fff,0 0 45px #b455ff,0 0 100px #7b3affb3,inset 0 0 31px #ffffff6b;
 background:radial-gradient(circle at 32% 25%,#fff6fc 0%,#eec8ff 9%,#e55dff 28%,#6521bb 62%,#240657 100%);
 animation:mixportal-orb-appear 1.42s var(--portal-ease) both}
.mixportal-orb span{font-size:clamp(52px,14vw,77px);filter:drop-shadow(0 0 15px #fff);animation:mixportal-dice 1.38s var(--portal-ease) both}
.mixportal-chip{position:absolute;z-index:4;top:50%;left:50%;width:56px;height:56px;display:grid;place-items:center;
 border:1px solid #ffffffc9;border-radius:18px;background:linear-gradient(140deg,#9251e9ef,#272286e6);
 box-shadow:0 6px 24px #0009,0 0 14px #c38cff77;transform:translate(-50%,-50%);
 font-size:28px;pointer-events:none;
 animation:mixportal-chip-flight 1.5s cubic-bezier(.17,.74,.25,1) both;
 animation-delay:var(--delay,0ms)}
.mixportal-chip:nth-of-type(1){--dx:-100px;--dy:-86px;--delay:10ms}
.mixportal-chip:nth-of-type(2){--dx:105px;--dy:-88px;--delay:70ms}
.mixportal-chip:nth-of-type(3){--dx:108px;--dy:93px;--delay:120ms}
.mixportal-chip:nth-of-type(4){--dx:-107px;--dy:89px;--delay:160ms}
.mixportal-shard{position:absolute;z-index:1;top:50%;left:50%;width:4px;height:24px;border-radius:99px;
 background:linear-gradient(#fff,#6deeff 70%,#e459ff00);box-shadow:0 0 13px #79fcff;
 transform-origin:50% 0%;opacity:0;
 animation:mixportal-spray 1.45s var(--portal-ease) both;animation-delay:var(--delay)}
.mixportal-title{position:absolute;bottom:0;left:-5%;right:-5%;text-align:center;z-index:10;
 text-shadow:0 3px 15px #120435,0 0 25px #d455ff;
 font:1000 clamp(30px,8.2vw,44px)/1.02 system-ui,sans-serif;letter-spacing:.015em;
 animation:mixportal-title-in 1.5s var(--portal-ease) both}
.mixportal-title small{display:block;margin-top:11px;font:800 11px/1.5 system-ui,sans-serif;
 letter-spacing:.26em;color:#a6faff}
.mixportal-skip{position:absolute;z-index:20;bottom:max(25px,env(safe-area-inset-bottom));
 right:23px;border:1px solid #fff5;border-radius:13px;padding:9px 16px;background:#30265ebd;
 color:#fff;font:800 12px system-ui,sans-serif;cursor:pointer}
#mixportal-overlay.is-finishing{animation:mixportal-fade .18s ease-in forwards}
@keyframes mixportal-storm{to{transform:rotate(360deg)}}
@keyframes mixportal-spin{to{transform:rotate(360deg)}}
@keyframes mixportal-bloom{0%{opacity:0;scale:.38}40%{opacity:1;scale:1.04}100%{opacity:.95;scale:1}}
@keyframes mixportal-orb-appear{0%{opacity:0;scale:.08;filter:blur(14px)}24%{opacity:1;scale:.84;filter:blur(0)}75%{scale:1.16}100%{scale:1}}
@keyframes mixportal-dice{0%{transform:rotate(-160deg) scale(.3)}30%{transform:rotate(-110deg) scale(1.2)}70%{transform:rotate(15deg)}100%{transform:rotate(0)}}
@keyframes mixportal-chip-flight{0%{opacity:0;transform:translate(-50%,-50%) rotate(120deg) scale(.2)}
 34%{opacity:1;transform:translate(calc(-50% + var(--dx)),calc(-50% + var(--dy))) rotate(-9deg) scale(1.12)}
 75%{opacity:1;transform:translate(calc(-50% + var(--dx)),calc(-50% + var(--dy))) rotate(9deg) scale(1)}
 100%{opacity:0;transform:translate(-50%,-50%) rotate(145deg) scale(.15)}}
@keyframes mixportal-spray{0%,36%{opacity:0;transform:translate(-50%,-50%) rotate(var(--turn)) translateY(0) scaleY(.15)}
 52%{opacity:.95}100%{opacity:0;transform:translate(-50%,-50%) rotate(var(--turn)) translateY(calc(0px - var(--reach))) scaleY(.2)}}
@keyframes mixportal-title-in{0%{opacity:0;transform:translateY(24px);filter:blur(7px)}
 45%{opacity:0;transform:translateY(16px)}85%{opacity:1;filter:blur(0)}100%{opacity:1;transform:translateY(0)}}
@keyframes mixportal-fade{to{opacity:0}}
@media(max-width:380px){.mixportal-chip{width:48px;height:48px;font-size:24px}.mixportal-rings{scale:.87}}
@media(prefers-reduced-motion:reduce){
 .navfoot.v109-dock .v96-nav-mixitup::before,.navfoot.v109-dock .v96-nav-mixitup::after,
 #mixportal-overlay *,#mixportal-overlay::before{animation:none!important;transition:none!important}
 .navfoot.v109-dock .v96-nav-mixitup{transition:none!important}
}