.r-mock-stage{pointer-events:none;place-items:center;display:grid;position:absolute;inset:20% 4% 5% 14%;container-type:size}.r-tile__media--short .r-mock-stage{inset:22% 4% 3% 16%}.r-stack__card .r-mock-stage{inset:13% 6% 27%}@media (width<=599px){.r-stack__card .r-mock-stage{inset:14% 4% 46%}}.r-cluster__card .r-mock-stage{inset:20% 6% 30%}.r-lab-hero__mock{height:min(60vh,34rem);margin-top:var(--s-6);border-radius:var(--r-lg);position:relative;overflow:hidden}.r-lab-hero__mock .r-mock-stage{inset:8% 6%}.r-lab-hero__mock .r-dev__screen img{object-fit:cover;width:100%;height:100%;position:absolute;inset:0}.r-showcase__slide .r-mock-stage{inset:8%}.r-showcase__slide .r-dev__screen img,.r-cluster__card .r-dev__screen img{object-fit:cover;width:100%;height:100%;position:absolute;inset:0}.r-tile__media .r-mock-stage~.r-stack__scrim,.r-stack__card .r-mock-stage~.r-stack__scrim{display:none}.r-dev{--w:92;--h:82;box-sizing:border-box;width:min(calc(var(--w) * 1cqw), calc(var(--h) * 1cqh * var(--ratio)));transform:var(--tilt,none);transform-origin:50%;animation:7s ease-in-out infinite r-dev-float;display:block;position:relative}.r-dev__screen{aspect-ratio:var(--ratio);background:var(--p-white);display:block;position:relative;overflow:hidden}@keyframes r-dev-float{0%,to{translate:0}50%{translate:0 -2.5%}}.r-dev--tablet,.r-dev--laptop,.r-dev--monitor{background:var(--p-black);box-shadow:inset 0 0 0 1px color-mix(in oklab, var(--p-white) 18%, transparent), 0 2.4cqmin 5cqmin -1cqmin color-mix(in oklab, var(--p-black) 55%, transparent)}.r-dev--tablet{--w:86;--h:80;--tilt:perspective(1800px) rotateX(28deg) rotateZ(-11deg);border-radius:4cqmin;padding:2.2cqmin}.r-dev--tablet .r-dev__screen{border-radius:2cqmin}.r-dev--laptop{--w:78;--h:70;--tilt:perspective(1600px) rotateX(8deg) rotateY(-18deg);border-radius:2.4cqmin 2.4cqmin .6cqmin .6cqmin;margin-bottom:3cqmin;padding:1.4cqmin 1.4cqmin 2.6cqmin}.r-dev--laptop .r-dev__screen{border-radius:.8cqmin}.r-dev--laptop:after{content:"";background:linear-gradient(var(--p-grey-200), color-mix(in oklab, var(--p-black-2) 45%, var(--p-grey-200)));height:3cqmin;box-shadow:0 2.4cqmin 4cqmin -1.2cqmin color-mix(in oklab, var(--p-black) 50%, transparent);border-radius:0 0 3cqmin 3cqmin;position:absolute;top:100%;left:-9%;right:-9%}.r-dev--monitor{--w:74;--h:64;--tilt:perspective(1800px) rotateY(16deg) rotateX(4deg);border-radius:1.6cqmin;margin-bottom:16cqh;padding:1cqmin}.r-dev--monitor .r-dev__screen{border-radius:.6cqmin}.r-dev--monitor:before,.r-dev--monitor:after{content:"";background:linear-gradient(90deg, var(--p-grey-200), color-mix(in oklab, var(--p-black-2) 35%, var(--p-grey-200)));position:absolute;left:50%;translate:-50%}.r-dev--monitor:before{width:18%;height:14cqh;top:100%}.r-dev--monitor:after{width:38%;height:2cqmin;box-shadow:0 2cqmin 3cqmin -1cqmin color-mix(in oklab, var(--p-black) 50%, transparent);border-radius:1cqmin;top:calc(100% + 14cqh)}.r-dev--browser{--w:90;--h:80;--tilt:perspective(1600px) rotateX(10deg) rotateY(-12deg);border-radius:var(--r-lg);background:var(--p-white);border:1px solid color-mix(in oklab, var(--p-black) 12%, transparent);box-shadow:0 2.4cqmin 5cqmin -1cqmin color-mix(in oklab, var(--p-black) 40%, transparent);overflow:hidden}.r-dev__bar{border-bottom:1px solid color-mix(in oklab, var(--p-black) 8%, transparent);gap:1cqmin;padding:1.6cqmin 2cqmin;display:flex}.r-dev__bar i{background:color-mix(in oklab, var(--p-black) 16%, transparent);border-radius:50%;width:1.4cqmin;height:1.4cqmin}.r-dev--browser{width:min(calc(var(--w) * 1cqw), calc((var(--h) * 1cqh - 5cqmin) * var(--ratio)))}.r-dev--page{--w:44;--h:80;--tilt:perspective(1800px) rotateX(22deg) rotateZ(-9deg);border-radius:var(--r-md);box-shadow:inset 0 0 0 1px color-mix(in oklab, var(--p-black) 10%, transparent), 0 2.4cqmin 5cqmin -1cqmin color-mix(in oklab, var(--p-black) 50%, transparent);overflow:hidden}.r-mock-stage .r-dev img{object-position:top center}.r-mock-stage .r-dev__screen img{opacity:0;animation:r-dev-cycle-3 12s var(--ease-standard) infinite both}.r-mock-stage .r-dev__screen[data-n="2"] img{animation-name:r-dev-cycle-2;animation-duration:8s}.r-mock-stage .r-dev__screen[data-n="1"] img{opacity:1;animation:none}@keyframes r-dev-cycle-3{0%{opacity:0}4%,33%{opacity:1}38%,to{opacity:0}}@keyframes r-dev-cycle-2{0%{opacity:0}6%,50%{opacity:1}56%,to{opacity:0}}.r-mock-stage .r-dev__screen[data-scroll] img{opacity:1;height:auto;animation:18s ease-in-out infinite alternate r-dev-scroll;inset:0 auto auto 0}@keyframes r-dev-scroll{0%,8%{top:0;translate:0}92%,to{top:100%;translate:0 -100%}}@media (hover:hover) and (pointer:fine) and (prefers-reduced-motion:no-preference){.r-mock-stage{transition:scale .9s var(--ease-out), translate .6s var(--ease-out);translate:0;scale:1}.r-tile:hover .r-mock-stage,.r-stack__card:hover .r-mock-stage,.r-cluster__card:hover .r-mock-stage{scale:1.14;translate:calc(var(--px,0) * -3.5%) calc(var(--py,0) * -3.5%)}.r-tile:hover .r-mock-stage .r-dev img,.r-stack__card:hover .r-mock-stage .r-dev img,.r-cluster__card:hover .r-mock-stage .r-dev img{translate:0;scale:1}}@media (prefers-reduced-motion:reduce){.r-dev,.r-mock-stage .r-dev__screen img{animation:none}.r-mock-stage .r-dev__screen img:first-child{opacity:1}}@layer components{:root{--lg-rim-hi:#fffc;--lg-rim-lo:#ffffff2e;--lg-highlight:#fff9;--lg-drop:#0f172a24}.lg{--lg-tint:transparent;--lg-tint-amt:0%;--lg-wash:color-mix(in oklab, var(--lg-tint) var(--lg-tint-amt), var(--lg-base));background:linear-gradient(var(--lg-wash), var(--lg-wash)) padding-box, linear-gradient(135deg, var(--lg-rim-hi), var(--lg-rim-lo) 35%, var(--lg-rim-lo) 65%, var(--lg-rim-hi)) border-box;-webkit-backdrop-filter:blur(var(--lg-blur)) saturate(var(--lg-sat));box-shadow:inset 0 1px 0 var(--lg-highlight), 0 1px 2px var(--lg-drop), 0 12px 32px -14px var(--lg-drop);border:1px solid #0000}.lg-regular{--lg-base:#ffffff6b;--lg-blur:16px;--lg-sat:180%}.lg-clear{--lg-base:#ffffff1a;--lg-blur:2px;--lg-sat:150%}.lg-tinted{--lg-tint:var(--primary);--lg-tint-amt:55%;--lg-base:#ffffff4d;--lg-blur:12px;--lg-sat:180%}.lg-surface{border-radius:28px}@media (prefers-reduced-transparency:reduce){.lg.lg{-webkit-backdrop-filter:none}}}