/* v16c studio motion: transform/opacity only. Loaded by studio.html only. */
.sm-fx{position:absolute;inset:0;pointer-events:none;overflow:hidden}
.sm-rays{position:absolute;left:var(--sx,58%);top:var(--sy,62%);width:180vmax;height:180vmax;margin:-90vmax 0 0 -90vmax;background:repeating-conic-gradient(from 0deg,rgba(255,226,170,.16) 0deg 4deg,rgba(255,226,170,0) 4deg 13deg);-webkit-mask:radial-gradient(closest-side,#000 0,rgba(0,0,0,.55) 30%,transparent 72%);mask:radial-gradient(closest-side,#000 0,rgba(0,0,0,.55) 30%,transparent 72%);animation:sm-spin 140s linear infinite,sm-ray 7s ease-in-out infinite;will-change:transform,opacity}
.sm-glow{position:absolute;left:var(--bx,61%);top:var(--by,46%);width:56vmin;height:56vmin;margin:-28vmin 0 0 -28vmin;border-radius:50%;background:radial-gradient(closest-side,rgba(255,214,150,.42),rgba(255,180,110,.12) 55%,transparent);animation:sm-pulse 5.5s ease-in-out infinite;will-change:transform,opacity}
.sm-petals{position:absolute;inset:0;z-index:2;pointer-events:none;overflow:hidden}
.sm-petal{position:absolute;top:-6%;left:0;width:var(--s,14px);height:calc(var(--s,14px)*.72);border-radius:80% 0 80% 0;background:linear-gradient(135deg,#ffd9e6,#f59bbb 60%,#e9799f);opacity:0;animation:sm-fall var(--d,14s) linear var(--dl,0s) infinite;will-change:transform,opacity}
.sm-petal.sp{width:6px;height:6px;border-radius:50%;background:radial-gradient(#fff8e0,#ffd27a 45%,transparent 70%)}
@keyframes sm-spin{to{transform:rotate(360deg)}}
@keyframes sm-ray{0%,100%{opacity:.55}50%{opacity:1}}
@keyframes sm-pulse{0%,100%{opacity:.55;transform:scale(.92)}50%{opacity:1;transform:scale(1.06)}}
@keyframes sm-fall{0%{opacity:0;transform:translate3d(var(--x0),0,0) rotate(0deg)}8%{opacity:var(--o,.85)}92%{opacity:var(--o,.85)}100%{opacity:0;transform:translate3d(var(--x1),112vh,0) rotate(var(--r,540deg))}}
/* cards */
.os .portals .os-card{animation:sm-in .9s cubic-bezier(.2,.8,.2,1) both,sm-bob var(--bd,6s) ease-in-out var(--bdl,0s) infinite;animation-delay:var(--in,0s),calc(var(--in,0s) + .9s + var(--bdl,0s));transform:perspective(900px) rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg)) translateY(var(--lift,0px)) scale(var(--sc,1));transition:transform .5s cubic-bezier(.2,.8,.2,1),box-shadow .4s;will-change:transform,translate}
.os .portals .os-card::after{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;background:linear-gradient(115deg,transparent 35%,rgba(255,255,255,.22) 50%,transparent 65%) 0 0/250% 100%;box-shadow:inset 0 0 0 2px rgba(255,214,150,.75),inset 0 0 26px rgba(255,190,120,.35);opacity:0;transition:opacity .35s}
.os .portals .os-card.sm-hot{--lift:-10px;--sc:1.035}
.os .portals .os-card.sm-hot::after{opacity:1;animation:sm-sheen 1.1s ease-out}
.os .portals .os-card .gicon{transition:transform .5s cubic-bezier(.2,.8,.2,1)}
.os .portals .os-card.sm-hot .gicon{transform:rotate(-8deg) scale(1.1)}
@keyframes sm-in{from{opacity:0;scale:.9;translate:0 34px}to{opacity:1;scale:1;translate:0 0}}
@keyframes sm-bob{0%,100%{translate:0 0}50%{translate:0 -9px}}
@keyframes sm-sheen{from{background-position:120% 0}to{background-position:-60% 0}}
.studio-bg{translate:var(--px,0) var(--py,0);transition:translate .9s cubic-bezier(.2,.8,.2,1)}
.studio-copy{translate:var(--cx,0) var(--cy,0);transition:translate .9s cubic-bezier(.2,.8,.2,1)}
@media (max-width:760px){@keyframes sm-bob{0%,100%{translate:0 0}50%{translate:0 -5px}}.sm-glow{width:70vmin;height:70vmin;margin:-35vmin 0 0 -35vmin}}
@media (prefers-reduced-motion:reduce){.sm-fx,.sm-petals{display:none}.os .portals .os-card{animation:none!important;transform:none!important;translate:none!important}.os .portals .os-card.sm-hot::after{animation:none}.studio-bg,.studio-copy{translate:none!important}}
.sm-off .sm-petal,.sm-off .sm-rays,.sm-off .sm-glow{animation-play-state:paused}