.pattern-preview.moving-bg-preview{position:relative;display:grid;grid-template-columns:1fr;align-content:stretch;grid-gap:10px;gap:10px;padding:14px;height:180px;background:var(--bg-base,#0e1a2c);overflow:hidden;isolation:isolate}.moving-bg-badge{position:absolute;top:8px;right:10px;z-index:2;padding:3px 9px;border-radius:999px;background:rgba(255,255,255,.08);color:var(--bg-accent-a,#67e8f9);font-size:9px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;box-shadow:inset 0 0 0 1px rgba(255,255,255,.1)}.moving-bg-viewport{position:relative;width:100%;height:100%;border-radius:10px;overflow:hidden;background:var(--bg-base-strong,#16263e);box-shadow:inset 0 0 0 1px rgba(255,255,255,.06)}.moving-bg-viewport:before{content:"";position:absolute;inset:0;z-index:2;pointer-events:none;background:linear-gradient(90deg,rgba(0,0,0,.5),transparent 8%,transparent 92%,rgba(0,0,0,.5))}.moving-bg-surface{position:absolute;inset:0;will-change:background-position}.moving-bg-preview--motion-horizon .moving-bg-surface{background-image:radial-gradient(ellipse 55% 90% at 12% 50%,rgba(103,232,249,.55),transparent 65%),radial-gradient(ellipse 60% 95% at 36% 50%,rgba(167,139,250,.62),transparent 70%),radial-gradient(ellipse 55% 90% at 62% 50%,rgba(244,114,182,.58),transparent 68%),radial-gradient(ellipse 55% 90% at 86% 50%,rgba(110,231,249,.5),transparent 65%),linear-gradient(96deg,#0a1428,#121730 24%,#1c1a3c 46%,#2a1130 64%,#1a1635 82%,#0a1428);background-size:380% 100%;background-position:0 50%;animation:movingBgPanX var(--bg-duration) linear infinite}@keyframes movingBgPanX{0%{background-position:0 50%}to{background-position:100% 50%}}.moving-bg-preview--motion-vertical .moving-bg-surface{background-image:radial-gradient(ellipse 90% 55% at 50% 12%,rgba(167,139,250,.55),transparent 65%),radial-gradient(ellipse 95% 60% at 50% 36%,rgba(56,189,248,.62),transparent 70%),radial-gradient(ellipse 90% 55% at 50% 62%,rgba(110,231,249,.58),transparent 68%),radial-gradient(ellipse 90% 55% at 50% 86%,rgba(167,139,250,.5),transparent 65%),linear-gradient(186deg,#0a1428,#121a32 24%,#14213c 46%,#18293f 64%,#121a32 82%,#0a1428);background-size:100% 380%;background-position:50% 0;animation:movingBgPanY var(--bg-duration) linear infinite}@keyframes movingBgPanY{0%{background-position:50% 0}to{background-position:50% 100%}}.moving-bg-preview--motion-parallax .moving-bg-surface{--bg-fg-duration:calc(var(--bg-duration) * 0.5);background-image:radial-gradient(ellipse 55% 95% at 12% 50%,rgba(251,191,36,.42),transparent 70%),radial-gradient(ellipse 60% 100% at 36% 50%,rgba(244,114,182,.5),transparent 72%),radial-gradient(ellipse 55% 95% at 62% 50%,rgba(167,139,250,.5),transparent 70%),radial-gradient(ellipse 55% 95% at 86% 50%,rgba(103,232,249,.4),transparent 70%),linear-gradient(96deg,#0a1428,#1a1432 24%,#2a1132 46%,#1f1a40 64%,#14182f 82%,#0a1428);background-size:380% 100%;background-position:0 50%;animation:movingBgPanX var(--bg-duration) linear infinite}.moving-bg-preview--motion-parallax .moving-bg-surface:before{content:"";position:absolute;inset:0;background-image:radial-gradient(ellipse 30% 80% at 25% 50%,rgba(255,224,138,.5),transparent 70%),radial-gradient(ellipse 28% 80% at 55% 50%,rgba(255,174,200,.5),transparent 70%),radial-gradient(ellipse 30% 80% at 80% 50%,rgba(189,220,255,.45),transparent 70%);background-size:220% 100%;background-position:0 50%;mix-blend-mode:screen;filter:blur(2px);animation:movingBgPanX var(--bg-fg-duration) linear infinite}@media (prefers-reduced-motion:reduce){.moving-bg-surface,.moving-bg-surface:before{animation:none!important;background-position:50% 50%!important}}