/* 45.0.332: image based horizon overlays the bottom of the mockup. The old cloud node in saved
   public snapshots is reused, so existing pages pick up the new transition too. */
.nxc-showcase3d.main-site-sky.sky-clouds-on .nxc-showcase3d-wrap{padding-bottom:clamp(66px,8vw,112px)!important}
.nxc-showcase3d.main-site-sky:is(.sky-clouds-on,.sky-transition-on)>:is(.nxc-showcase3d-transition,.nxc-showcase3d-clouds){
 position:absolute!important;inset:auto 0 -1px!important;z-index:14!important;
 display:block!important;width:100%!important;height:clamp(260px,30vw,440px)!important;
 margin:0!important;overflow:hidden!important;pointer-events:none!important;
 background:linear-gradient(to bottom,transparent 0%,transparent 48%,color-mix(in srgb,var(--nxc-bg,var(--color-background,#111020)) 42%,transparent) 68%,var(--nxc-bg,var(--color-background,#111020)) 100%)!important;
 background-image:linear-gradient(to bottom,transparent 0%,transparent 48%,color-mix(in srgb,var(--nxc-bg,var(--color-background,#111020)) 42%,transparent) 68%,var(--nxc-bg,var(--color-background,#111020)) 100%)!important;
 transform:none!important;translate:none!important;filter:none!important;animation:none!important;
 contain:paint!important;will-change:auto!important;
}
.nxc-showcase3d.main-site-sky>:is(.nxc-showcase3d-transition,.nxc-showcase3d-clouds)::before{
 content:""!important;position:absolute!important;inset:0!important;
 display:block!important;width:100%!important;height:100%!important;
 background:url('/assets/component-library/showcase3d-aurora-transition-45.0.330.webp?v=45.0.332') center 57% / cover no-repeat!important;
 opacity:.76;transform:none!important;filter:none!important;animation:none!important;will-change:auto!important;
 -webkit-mask-image:linear-gradient(to bottom,transparent 0%,transparent 27%,rgba(0,0,0,.55) 46%,#000 68%,transparent 98%);
 mask-image:linear-gradient(to bottom,transparent 0%,transparent 27%,rgba(0,0,0,.55) 46%,#000 68%,transparent 98%);
}
.nxc-showcase3d.main-site-sky>:is(.nxc-showcase3d-transition,.nxc-showcase3d-clouds)::after{content:none!important;display:none!important}
.nxc-showcase3d.main-site-sky.sky-day>:is(.nxc-showcase3d-transition,.nxc-showcase3d-clouds)::before,
html:not([data-theme="dark"]) .nxc-showcase3d.main-site-sky.sky-auto>:is(.nxc-showcase3d-transition,.nxc-showcase3d-clouds)::before{opacity:.42}
@media(max-width:820px){
 .nxc-showcase3d.main-site-sky.sky-clouds-on .nxc-showcase3d-wrap{padding-bottom:clamp(42px,10vw,68px)!important}
 .nxc-showcase3d.main-site-sky:is(.sky-clouds-on,.sky-transition-on)>:is(.nxc-showcase3d-transition,.nxc-showcase3d-clouds){height:clamp(280px,68vw,400px)!important}
 .nxc-showcase3d.main-site-sky>:is(.nxc-showcase3d-transition,.nxc-showcase3d-clouds)::before{background-position:center 58%!important;opacity:.64}
}


/* 45.0.333: a second, code-native backdrop for the main interactive demo.
   Only two isolated light layers move; the page background and grid never repaint. */
.nxc-showcase3d.main-site-sky.backdrop-light-studio{
 --nxc-s3-sky-muted:rgba(240,239,255,.78);
 --nxc-s3-sky-glass:rgba(13,14,40,.44);
 --nxc-s3-sky-border:rgba(196,190,255,.24);
 background-color:#0b1025!important;
 background-image:radial-gradient(ellipse 90% 55% at 50% 108%,rgba(107,85,223,.19),transparent 76%),radial-gradient(ellipse 62% 60% at 50% 33%,rgba(68,61,156,.24),transparent 70%),linear-gradient(150deg,#0a1129 0%,#171036 48%,#0b1025 100%)!important;
 background-size:cover!important;background-position:center!important;
}
.nxc-showcase3d.main-site-sky.backdrop-light-studio .nxc-showcase3d-stars,
.nxc-showcase3d.main-site-sky.backdrop-light-studio .nxc-showcase3d-meteor,
.nxc-showcase3d.main-site-sky.backdrop-light-studio>.nxc-showcase3d-mountains{display:none!important}
.nxc-showcase3d.main-site-sky.backdrop-light-studio>.nxc-showcase3d-sky-fx::before{
 content:"";position:absolute;inset:0;z-index:0;pointer-events:none;
 background-image:linear-gradient(rgba(164,146,255,.11) 1px,transparent 1px),linear-gradient(90deg,rgba(164,146,255,.11) 1px,transparent 1px);
 background-size:clamp(58px,7vw,96px) clamp(58px,7vw,96px);
 opacity:.35;-webkit-mask-image:radial-gradient(ellipse 67% 52% at 50% 48%,#000,transparent 96%);mask-image:radial-gradient(ellipse 67% 52% at 50% 48%,#000,transparent 96%);
}
.nxc-showcase3d.main-site-sky.backdrop-light-studio .nxc-showcase3d-studio-light{
 position:absolute;display:block;width:min(74vw,960px);height:clamp(360px,47vw,670px);
 border-radius:50%;pointer-events:none;contain:paint;opacity:.75;
 transform:translate3d(0,0,0);will-change:transform,opacity;
}
.nxc-showcase3d.main-site-sky.backdrop-light-studio .studio-light-a{
 top:4%;left:-21%;background:radial-gradient(ellipse at center,rgba(145,108,250,.37),rgba(94,80,198,.14) 43%,transparent 72%);
}
.nxc-showcase3d.main-site-sky.backdrop-light-studio .studio-light-b{
 top:17%;right:-22%;background:radial-gradient(ellipse at center,rgba(93,194,216,.24),rgba(115,92,219,.12) 46%,transparent 72%);opacity:.67;
}
/* The exit light overlaps the mockup edge, then becomes the next section's theme color. */
.nxc-showcase3d.main-site-sky.backdrop-light-studio>:is(.nxc-showcase3d-transition,.nxc-showcase3d-clouds)::before{
 background:radial-gradient(ellipse 75% 27% at 50% 64%,rgba(158,125,255,.42),transparent 78%),linear-gradient(100deg,transparent 5%,rgba(142,112,255,.19) 42%,rgba(104,189,226,.17) 59%,transparent 95%)!important;
 opacity:.72;
}
@media(min-width:821px) and (prefers-reduced-motion:no-preference){
 .nxc-showcase3d.main-site-sky.backdrop-light-studio:not(.animation-none) .studio-light-a{animation:nxc-studio-light-a 17s ease-in-out infinite alternate}
 .nxc-showcase3d.main-site-sky.backdrop-light-studio:not(.animation-none) .studio-light-b{animation:nxc-studio-light-b 21s ease-in-out infinite alternate}
}
@keyframes nxc-studio-light-a{from{transform:translate3d(-2%,0,0);opacity:.58}to{transform:translate3d(7%,3%,0);opacity:.82}}
@keyframes nxc-studio-light-b{from{transform:translate3d(3%,2%,0);opacity:.5}to{transform:translate3d(-6%,-3%,0);opacity:.73}}
.nxc-showcase3d.backdrop-light-studio[data-nx-activity-visible="0"] .nxc-showcase3d-studio-light{animation-play-state:paused!important;will-change:auto!important}
@media(max-width:820px){
 .nxc-showcase3d.main-site-sky.backdrop-light-studio .nxc-showcase3d-studio-light{width:92vw;height:85vw;max-height:460px;animation:none!important;will-change:auto!important}
 .nxc-showcase3d.main-site-sky.backdrop-light-studio .studio-light-a{top:7%;left:-38%;opacity:.54}
 .nxc-showcase3d.main-site-sky.backdrop-light-studio .studio-light-b{top:29%;right:-43%;opacity:.46}
 .nxc-showcase3d.main-site-sky.backdrop-light-studio>.nxc-showcase3d-sky-fx::before{opacity:.22}
}
@media(prefers-reduced-motion:reduce){.nxc-showcase3d.main-site-sky.backdrop-light-studio .nxc-showcase3d-studio-light{animation:none!important;will-change:auto!important}}

/* 45.0.334: quiet sky inspired by the supplied reference; custom transparent cloud art. */
.nxc-showcase3d.main-site-sky.backdrop-quiet-sky{
 --nxc-s3-sky-copy:#faf9ff;--nxc-s3-sky-muted:rgba(240,238,255,.79);
 --nxc-s3-sky-glass:rgba(21,20,48,.38);--nxc-s3-sky-border:rgba(224,215,248,.25);
 color:var(--nxc-s3-sky-copy);background-color:#1b1936!important;
 background-image:linear-gradient(180deg,#19152f 0%,#24213d 33%,#49445a 64%,#8e8990 85%,#b4ada8 100%)!important;
 background-size:100% 100%!important;background-position:center!important;background-repeat:no-repeat!important;
}
.nxc-showcase3d.main-site-sky.backdrop-quiet-sky :is(.nxc-showcase3d-stars,.nxc-showcase3d-meteor,.nxc-showcase3d-studio-light),
.nxc-showcase3d.main-site-sky.backdrop-quiet-sky>.nxc-showcase3d-mountains{display:none!important}
.nxc-showcase3d.main-site-sky.backdrop-quiet-sky>.nxc-showcase3d-sky-fx::before{
 content:"";position:absolute;inset:0;pointer-events:none;opacity:.66;
 background-image:radial-gradient(circle at 9% 17%,#f1ebff 0 1px,transparent 2px),radial-gradient(circle at 19% 37%,#ddd8ef 0 1px,transparent 2px),radial-gradient(circle at 31% 8%,#ebe3ff 0 1px,transparent 2px),radial-gradient(circle at 41% 29%,#e2dff4 0 1px,transparent 2px),radial-gradient(circle at 54% 14%,#f6efff 0 1px,transparent 2px),radial-gradient(circle at 68% 32%,#e6deff 0 1px,transparent 2px),radial-gradient(circle at 76% 9%,#fff 0 1px,transparent 2px),radial-gradient(circle at 88% 25%,#e7e5fa 0 1px,transparent 2px),radial-gradient(circle at 93% 45%,#f6f0ff 0 1px,transparent 2px),radial-gradient(circle at 12% 49%,#e2def2 0 1px,transparent 2px),radial-gradient(circle at 63% 49%,#f0eaff 0 1px,transparent 2px);
 -webkit-mask-image:linear-gradient(to bottom,#000 0%,#000 55%,transparent 80%);mask-image:linear-gradient(to bottom,#000 0%,#000 55%,transparent 80%);
}
.nxc-showcase3d.main-site-sky.backdrop-quiet-sky>.nxc-showcase3d-sky-fx::after{
 background:radial-gradient(ellipse 75% 55% at 50% 88%,rgba(232,221,219,.12),transparent 75%);
}
.nxc-showcase3d.main-site-sky.backdrop-quiet-sky .nxc-showcase3d-quiet-star{
 position:absolute;display:block;width:3px;height:3px;border-radius:50%;background:#fff;
 box-shadow:0 0 8px 2px rgba(221,212,255,.46);opacity:.35;pointer-events:none;
}
.nxc-showcase3d.main-site-sky.backdrop-quiet-sky .quiet-star-a{top:20%;left:22%}
.nxc-showcase3d.main-site-sky.backdrop-quiet-sky .quiet-star-b{top:39%;right:18%;animation-delay:-3.5s}
@media(min-width:821px) and (prefers-reduced-motion:no-preference){
 .nxc-showcase3d.main-site-sky.backdrop-quiet-sky:not(.animation-none) .nxc-showcase3d-quiet-star{animation:nxc-quiet-sky-twinkle 7s ease-in-out infinite alternate}
}
@keyframes nxc-quiet-sky-twinkle{from{opacity:.23;transform:scale(.85)}to{opacity:.7;transform:scale(1.18)}}
.nxc-showcase3d.backdrop-quiet-sky[data-nx-activity-visible="0"] .nxc-showcase3d-quiet-star{animation-play-state:paused!important}
.nxc-showcase3d.main-site-sky.backdrop-quiet-sky:is(.sky-clouds-on,.sky-transition-on)>:is(.nxc-showcase3d-transition,.nxc-showcase3d-clouds){
 height:clamp(280px,33vw,470px)!important;
}
.nxc-showcase3d.main-site-sky.backdrop-quiet-sky>:is(.nxc-showcase3d-transition,.nxc-showcase3d-clouds)::before{
 background:url('/assets/component-library/showcase3d-quiet-clouds-45.0.334.webp?v=45.0.334') center 52% / cover no-repeat!important;
 opacity:.82!important;filter:blur(4px) saturate(.78)!important;
 -webkit-mask-image:linear-gradient(to bottom,transparent 0%,rgba(0,0,0,.45) 27%,#000 50%,rgba(0,0,0,.92) 73%,transparent 100%)!important;
 mask-image:linear-gradient(to bottom,transparent 0%,rgba(0,0,0,.45) 27%,#000 50%,rgba(0,0,0,.92) 73%,transparent 100%)!important;
}
@media(max-width:820px){
 .nxc-showcase3d.main-site-sky.backdrop-quiet-sky:is(.sky-clouds-on,.sky-transition-on)>:is(.nxc-showcase3d-transition,.nxc-showcase3d-clouds){height:clamp(200px,58vw,310px)!important}
 .nxc-showcase3d.main-site-sky.backdrop-quiet-sky>:is(.nxc-showcase3d-transition,.nxc-showcase3d-clouds)::before{background-position:center 50%!important;opacity:.8!important}
 .nxc-showcase3d.main-site-sky.backdrop-quiet-sky .nxc-showcase3d-quiet-star{animation:none!important}
}
@media(prefers-reduced-motion:reduce){.nxc-showcase3d.main-site-sky.backdrop-quiet-sky .nxc-showcase3d-quiet-star{animation:none!important}}

/* 45.0.335: lively sparse stars, staggered meteors, and a compact cloud-to-section veil. */
.nxc-showcase3d.main-site-sky.backdrop-quiet-sky>.nxc-showcase3d-sky-fx::before{background:none!important;opacity:0!important}
.nxc-showcase3d.main-site-sky.backdrop-quiet-sky .nxc-showcase3d-quiet-star{
 width:clamp(2px,.22vw,4px);height:clamp(2px,.22vw,4px);
 background:rgba(255,255,255,.95);box-shadow:0 0 8px 1px rgba(221,214,255,.53);
 opacity:.4;animation:none;transform:scale(.8);
}
.nxc-showcase3d.main-site-sky.backdrop-quiet-sky .quiet-star-1{top:9%;left:9%;--duration:5.8s;--delay:-1.1s}
.nxc-showcase3d.main-site-sky.backdrop-quiet-sky .quiet-star-2{top:17%;left:21%;--duration:8.1s;--delay:-3s}
.nxc-showcase3d.main-site-sky.backdrop-quiet-sky .quiet-star-3{top:7%;left:34%;--duration:6.9s;--delay:-5.2s}
.nxc-showcase3d.main-site-sky.backdrop-quiet-sky .quiet-star-4{top:29%;left:42%;--duration:9.2s;--delay:-2.3s}
.nxc-showcase3d.main-site-sky.backdrop-quiet-sky .quiet-star-5{top:12%;left:55%;--duration:7.4s;--delay:-4.6s}
.nxc-showcase3d.main-site-sky.backdrop-quiet-sky .quiet-star-6{top:34%;left:63%;--duration:6.2s;--delay:-.7s}
.nxc-showcase3d.main-site-sky.backdrop-quiet-sky .quiet-star-7{top:8%;left:77%;--duration:8.8s;--delay:-6.3s}
.nxc-showcase3d.main-site-sky.backdrop-quiet-sky .quiet-star-8{top:26%;left:88%;--duration:5.5s;--delay:-1.9s}
.nxc-showcase3d.main-site-sky.backdrop-quiet-sky .quiet-star-9{top:44%;left:13%;--duration:9.7s;--delay:-7.4s}
.nxc-showcase3d.main-site-sky.backdrop-quiet-sky .quiet-star-10{top:49%;left:31%;--duration:7.8s;--delay:-3.8s}
.nxc-showcase3d.main-site-sky.backdrop-quiet-sky .quiet-star-11{top:42%;left:73%;--duration:6.5s;--delay:-5.7s}
.nxc-showcase3d.main-site-sky.backdrop-quiet-sky .quiet-star-12{top:52%;left:93%;--duration:8.4s;--delay:-2.7s}
@keyframes nxc-quiet-star-glint{0%,100%{opacity:.2;transform:scale(.72)}48%{opacity:.92;transform:scale(1.32)}}
.nxc-showcase3d.main-site-sky.backdrop-quiet-sky .nxc-showcase3d-quiet-meteor{
 position:absolute;display:block;width:clamp(62px,7.5vw,115px);height:1px;z-index:1;
 background:linear-gradient(90deg,transparent 0%,rgba(234,227,255,.14) 28%,rgba(247,244,255,.8) 94%,#fff 100%);
 border-radius:99px;opacity:0;pointer-events:none;transform-origin:right center;
}
.nxc-showcase3d.main-site-sky.backdrop-quiet-sky .nxc-showcase3d-quiet-meteor::after{content:"";position:absolute;right:0;top:-2px;width:5px;height:5px;border-radius:50%;background:#fff;box-shadow:0 0 8px 2px rgba(213,202,255,.67)}
.nxc-showcase3d.main-site-sky.backdrop-quiet-sky .quiet-meteor-1{top:16%;left:18%;--meteor-x:37vw;--meteor-y:11vh;--meteor-angle:16deg;--meteor-time:19s;--meteor-delay:-2s}
.nxc-showcase3d.main-site-sky.backdrop-quiet-sky .quiet-meteor-2{top:27%;left:51%;--meteor-x:28vw;--meteor-y:9vh;--meteor-angle:12deg;--meteor-time:24s;--meteor-delay:-10s}
.nxc-showcase3d.main-site-sky.backdrop-quiet-sky .quiet-meteor-3{top:8%;left:4%;--meteor-x:25vw;--meteor-y:8vh;--meteor-angle:19deg;--meteor-time:29s;--meteor-delay:-19s}
@keyframes nxc-quiet-meteor-flight{
 0%,68%{opacity:0;transform:translate3d(0,0,0) rotate(var(--meteor-angle))}
 69%{opacity:0;transform:translate3d(0,0,0) rotate(var(--meteor-angle))}
 70%{opacity:.84}
 76%{opacity:.9}
 80%{opacity:0;transform:translate3d(var(--meteor-x),var(--meteor-y),0) rotate(var(--meteor-angle))}
 100%{opacity:0;transform:translate3d(var(--meteor-x),var(--meteor-y),0) rotate(var(--meteor-angle))}
}
@media(prefers-reduced-motion:no-preference){
 .nxc-showcase3d.main-site-sky.backdrop-quiet-sky:not(.animation-none) .nxc-showcase3d-quiet-star{animation:nxc-quiet-star-glint var(--duration) ease-in-out var(--delay) infinite!important}
 .nxc-showcase3d.main-site-sky.backdrop-quiet-sky:not(.animation-none) .nxc-showcase3d-quiet-meteor{animation:nxc-quiet-meteor-flight var(--meteor-time) linear var(--meteor-delay) infinite!important}
}
.nxc-showcase3d.backdrop-quiet-sky[data-nx-activity-visible="0"] :is(.nxc-showcase3d-quiet-star,.nxc-showcase3d-quiet-meteor){animation-play-state:paused!important}
.nxc-showcase3d.main-site-sky.backdrop-quiet-sky.sky-clouds-on .nxc-showcase3d-wrap{padding-bottom:clamp(34px,5vw,76px)!important}
.nxc-showcase3d.main-site-sky.backdrop-quiet-sky:is(.sky-clouds-on,.sky-transition-on)>:is(.nxc-showcase3d-transition,.nxc-showcase3d-clouds){
 height:clamp(250px,26vw,390px)!important;
 background-image:linear-gradient(to bottom,transparent 0%,rgba(204,198,217,.1) 22%,color-mix(in srgb,var(--nxc-bg,var(--color-background,#f6f4f7)) 34%,rgba(184,178,193,.78)) 53%,var(--nxc-bg,var(--color-background,#f6f4f7)) 100%)!important;
}
.nxc-showcase3d.main-site-sky.backdrop-quiet-sky>:is(.nxc-showcase3d-transition,.nxc-showcase3d-clouds)::before{
 background-image:radial-gradient(ellipse 38% 20% at 11% 23%,rgba(228,223,236,.54),transparent 96%),radial-gradient(ellipse 43% 17% at 78% 19%,rgba(230,226,238,.5),transparent 95%),radial-gradient(ellipse 60% 21% at 50% 40%,rgba(224,218,231,.54),transparent 94%),radial-gradient(ellipse 57% 32% at 51% 79%,color-mix(in srgb,var(--nxc-bg,var(--color-background,#f6f4f7)) 62%,transparent),transparent 96%)!important;
 background-size:100% 100%!important;background-position:center!important;
 opacity:1!important;filter:none!important;
 -webkit-mask-image:linear-gradient(to bottom,transparent 0%,#000 14%,#000 75%,transparent 100%)!important;
 mask-image:linear-gradient(to bottom,transparent 0%,#000 14%,#000 75%,transparent 100%)!important;
}
@media(max-width:820px){
 .nxc-showcase3d.main-site-sky.backdrop-quiet-sky.sky-clouds-on .nxc-showcase3d-wrap{padding-bottom:clamp(18px,4vw,34px)!important}
 .nxc-showcase3d.main-site-sky.backdrop-quiet-sky:is(.sky-clouds-on,.sky-transition-on)>:is(.nxc-showcase3d-transition,.nxc-showcase3d-clouds){height:clamp(185px,46vw,260px)!important}
 .nxc-showcase3d.main-site-sky.backdrop-quiet-sky .nxc-showcase3d-quiet-meteor:is(.quiet-meteor-2,.quiet-meteor-3){display:none!important}
 .nxc-showcase3d.main-site-sky.backdrop-quiet-sky .quiet-meteor-1{--meteor-x:40vw;--meteor-y:5vh;--meteor-time:27s}
 .nxc-showcase3d.main-site-sky.backdrop-quiet-sky .nxc-showcase3d-quiet-star:nth-of-type(2n){display:none!important}
}
@media(prefers-reduced-motion:reduce){
 .nxc-showcase3d.main-site-sky.backdrop-quiet-sky :is(.nxc-showcase3d-quiet-star,.nxc-showcase3d-quiet-meteor){animation:none!important}
 .nxc-showcase3d.main-site-sky.backdrop-quiet-sky .nxc-showcase3d-quiet-meteor{display:none!important}
}

/* Legacy published quiet-sky snapshots retain two old stars; response repair adds the new field. */
.nxc-showcase3d.main-site-sky.backdrop-quiet-sky .nxc-showcase3d-quiet-star:is(.quiet-star-a,.quiet-star-b){display:none!important}