/* Pairpop sky: low opacity drifting cloud field. Three layers, each translating exactly one
   tile width per cycle, so every loop lands on the frame it started from. The layer durations
   are coprime, so the combined pattern does not visibly repeat. Transform only, compositor friendly. */
html{background:#f7fbff}
body{background:#f7fbff !important}
.plinq-sky{position:fixed;inset:0;z-index:0;pointer-events:none;background:linear-gradient(180deg,#dcecfb 0%,#eaf4fd 38%,#f7fbff 70%,#fff 100%)}
.cloudscape{position:fixed;inset:-6% 0;z-index:0;pointer-events:none;overflow:hidden;contain:strict;
  transform:translate3d(0,var(--pxc,0px),0);will-change:transform}
.cloudscape>span{position:absolute;left:0;top:0;height:100%;width:200%;display:block;
  will-change:transform;backface-visibility:hidden}
.cloudscape .c1{
  background-image:
    radial-gradient(38% 46% at 12% 34%,rgba(255,255,255,.99),rgba(206,228,250,.55) 58%,transparent 74%),
    radial-gradient(30% 38% at 30% 62%,rgba(255,255,255,.97),rgba(199,224,248,.5) 60%,transparent 76%),
    radial-gradient(34% 40% at 44% 22%,rgba(255,255,255,.95),rgba(203,226,249,.5) 58%,transparent 74%);
  background-size:50% 100%;background-repeat:repeat-x;
  filter:blur(30px);opacity:.9;animation:cdrift 91s linear infinite}
.cloudscape .c2{
  background-image:
    radial-gradient(26% 34% at 18% 70%,rgba(255,255,255,.97),rgba(196,222,247,.5) 60%,transparent 76%),
    radial-gradient(32% 36% at 38% 30%,rgba(255,255,255,.95),rgba(190,218,246,.5) 58%,transparent 76%);
  background-size:50% 100%;background-repeat:repeat-x;
  filter:blur(40px);opacity:.75;animation:cdrift 137s linear infinite}
.cloudscape .c3{
  background-image:
    radial-gradient(22% 30% at 26% 46%,rgba(255,255,255,.85),transparent 74%),
    radial-gradient(28% 26% at 8% 18%,rgba(214,235,253,.8),transparent 74%);
  background-size:50% 100%;background-repeat:repeat-x;
  filter:blur(52px);opacity:.6;animation:cdrift 199s linear infinite}
@keyframes cdrift{from{transform:translate3d(0,0,0)}to{transform:translate3d(-50%,0,0)}}
/* Plinq's page is one wrapper div directly under body; lift it above the sky. */
body>div:not(.plinq-sky):not(.cloudscape),body>header,body>main,body>footer{position:relative;z-index:1}
@media (prefers-reduced-motion:reduce){.cloudscape>span{animation:none}}
@media (max-width:600px){.cloudscape .c3{display:none}}
