/* Cloudia AI orb avatar — scoped from MiscFiles/preview (1).html; used inside .emp-cloudia-mascot */
.cloudia-orb {
  display: block;
  width: 100%;
  height: 100%;
  position: relative;
  overflow: hidden;
  border-radius: 50%;
  pointer-events: none;
  -webkit-user-select: none;
  user-select: none;
  contain: layout style paint;
}
.cloudia-orb__frame {
  position: relative;
  width: 100%;
  aspect-ratio: 1 / 1;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
}

/* BACKGROUND ATMOSPHERE */

.cloudia-orb__bg{
    position:absolute;
    inset:0;

    background:
        radial-gradient(circle at center,
        rgba(0,255,255,0.05) 0%,
        rgba(0,140,255,0.025) 22%,
        rgba(0,0,0,0) 65%);

    animation:
        cloudiaOrbBackgroundPulse 18s ease-in-out infinite;
}

/* MASSIVE HALO */

.cloudia-orb__halo-1{
    position:absolute;

    width:72%;
    aspect-ratio:1/1;

    border-radius:50%;

    background:
        radial-gradient(circle,
        rgba(0,255,255,0.22) 0%,
        rgba(0,180,255,0.10) 28%,
        rgba(120,255,255,0.04) 50%,
        transparent 72%);

    filter:blur(120px);

    animation:
        cloudiaOrbHaloBreath1 12s ease-in-out infinite;
}

.cloudia-orb__halo-2{
    position:absolute;

    width:58%;
    aspect-ratio:1/1;

    border-radius:50%;

    border:1px solid rgba(0,255,255,0.08);

    box-shadow:
        0 0 90px rgba(0,255,255,0.18),
        inset 0 0 60px rgba(0,255,255,0.08);

    animation:
        cloudiaOrbRotateSlow 50s linear infinite,
        cloudiaOrbHaloBreath2 10s ease-in-out infinite;
}

.cloudia-orb__halo-3{
    position:absolute;

    width:48%;
    aspect-ratio:1/1;

    border-radius:50%;

    background:
        radial-gradient(circle,
        rgba(180,255,255,0.06) 0%,
        rgba(0,255,220,0.03) 40%,
        transparent 70%);

    filter:blur(50px);

    animation:
        cloudiaOrbPulseSoft 9s ease-in-out infinite;
}

/* MAIN ORB */

.cloudia-orb__orb{
    position:relative;

    width:36%;
    aspect-ratio:1/1;

    border-radius:50%;

    animation:
        cloudiaOrbBreathe 8s ease-in-out infinite,
        cloudiaOrbFloat 16s ease-in-out infinite;

    filter:
        drop-shadow(0 0 40px rgba(0,255,255,0.35))
        drop-shadow(0 0 120px rgba(0,255,255,0.20))
        drop-shadow(0 0 220px rgba(0,255,255,0.10));
}

/* FLOWING STRUCTURES */

.cloudia-orb__ring{
    position:absolute;
    inset:0;

    border-radius:50%;

    border:4px solid rgba(120,255,255,0.42);

    box-shadow:
        0 0 25px rgba(0,255,255,0.25),
        inset 0 0 20px rgba(0,255,255,0.10);

    mix-blend-mode:screen;
}

/* RING SHAPES */

.cloudia-orb__ring--r1{
    transform:
        rotate(0deg)
        scaleX(1.08)
        scaleY(0.82);

    animation:
        cloudiaOrbRotate1 18s linear infinite,
        cloudiaOrbMorph1 10s ease-in-out infinite;
}

.cloudia-orb__ring--r2{
    transform:
        rotate(60deg)
        scaleX(0.82)
        scaleY(1.15);

    border-color:rgba(0,255,220,0.38);

    animation:
        cloudiaOrbRotate2 24s linear infinite,
        cloudiaOrbMorph2 12s ease-in-out infinite;
}

.cloudia-orb__ring--r3{
    transform:
        rotate(120deg)
        scaleX(1.16)
        scaleY(0.90);

    border-color:rgba(120,220,255,0.34);

    animation:
        cloudiaOrbRotate3 30s linear infinite,
        cloudiaOrbMorph3 14s ease-in-out infinite;
}

.cloudia-orb__ring--r4{
    transform:
        rotate(180deg)
        scaleX(0.92)
        scaleY(1.18);

    border-color:rgba(180,255,255,0.26);

    animation:
        cloudiaOrbRotate4 38s linear infinite,
        cloudiaOrbMorph4 16s ease-in-out infinite;
}

/* INNER CORE */

.cloudia-orb__core{
    position:absolute;
    inset:22%;

    border-radius:50%;

    background:
        radial-gradient(circle,
        rgba(180,255,255,0.20) 0%,
        rgba(0,255,255,0.14) 30%,
        rgba(0,180,255,0.06) 50%,
        rgba(0,40,100,0.08) 70%,
        transparent 100%);

    filter:blur(14px);

    animation:
        cloudiaOrbCorePulse 8s ease-in-out infinite;
}

/* INNER HALOS */

.cloudia-orb__mini-halo{
    position:absolute;

    border-radius:50%;

    border:1px solid rgba(180,255,255,0.18);

    mix-blend-mode:screen;
}

.cloudia-orb__mini-halo--h1{
    inset:34%;

    animation:
        cloudiaOrbHaloSpin1 18s linear infinite,
        cloudiaOrbHaloPulse1 8s ease-in-out infinite;
}

.cloudia-orb__mini-halo--h2{
    inset:42%;

    border-color:rgba(0,255,255,0.14);

    animation:
        cloudiaOrbHaloSpin2 26s linear infinite,
        cloudiaOrbHaloPulse2 10s ease-in-out infinite;
}

/* SPARKLES */

.cloudia-orb__sparkle{
    position:absolute;

    border-radius:50%;

    background:white;

    box-shadow:
        0 0 12px rgba(255,255,255,1),
        0 0 24px rgba(0,255,255,0.9),
        0 0 40px rgba(0,255,255,0.6);

    opacity:0.9;
}

.cloudia-orb__sparkle--s1{
    top:38%;
    left:42%;

    width:8px;
    height:8px;

    animation:cloudiaOrbSparkle1 7s ease-in-out infinite;
}

.cloudia-orb__sparkle--s2{
    top:54%;
    left:58%;

    width:5px;
    height:5px;

    animation:cloudiaOrbSparkle2 9s ease-in-out infinite;
}

.cloudia-orb__sparkle--s3{
    top:46%;
    left:64%;

    width:4px;
    height:4px;

    animation:cloudiaOrbSparkle3 8s ease-in-out infinite;
}

.cloudia-orb__sparkle--s4{
    top:60%;
    left:40%;

    width:6px;
    height:6px;

    animation:cloudiaOrbSparkle4 10s ease-in-out infinite;
}

/* SHIMMER */

.cloudia-orb__shimmer{
    position:absolute;
    inset:0;

    border-radius:50%;

    background:
        linear-gradient(
            140deg,
            rgba(255,255,255,0.28) 0%,
            rgba(255,255,255,0.04) 18%,
            transparent 35%,
            transparent 70%,
            rgba(255,255,255,0.06) 100%
        );

    mix-blend-mode:screen;

    filter:blur(10px);

    opacity:0.7;
}

/* OUTSIDE PARTICLES */

.cloudia-orb__particle{
    position:absolute;

    width:6px;
    height:6px;

    border-radius:50%;

    background:rgba(255,255,255,0.95);

    box-shadow:
        0 0 12px rgba(0,255,255,1),
        0 0 25px rgba(0,255,255,0.7);
}

.cloudia-orb__particle--p1{
    top:18%;
    left:50%;
    animation:cloudiaOrbFloat1 14s ease-in-out infinite;
}

.cloudia-orb__particle--p2{
    bottom:22%;
    right:24%;
    animation:cloudiaOrbFloat2 18s ease-in-out infinite;
}

.cloudia-orb__particle--p3{
    left:18%;
    bottom:30%;
    animation:cloudiaOrbFloat3 15s ease-in-out infinite;
}

.cloudia-orb__particle--p4{
    top:30%;
    right:18%;
    animation:cloudiaOrbFloat4 20s ease-in-out infinite;
}

/* MAIN MOTION */

@keyframes cloudiaOrbBreathe{
    0%{transform:scale(0.92);}
    50%{transform:scale(1.12);}
    100%{transform:scale(0.92);}
}

@keyframes cloudiaOrbFloat{
    0%,100%{translate:0px 0px;}
    50%{translate:0px -12px;}
}

@keyframes cloudiaOrbHaloBreath1{
    0%,100%{
        transform:scale(0.82);
        opacity:0.40;
    }
    50%{
        transform:scale(1.35);
        opacity:1;
    }
}

@keyframes cloudiaOrbHaloBreath2{
    0%,100%{
        transform:scale(0.92);
        opacity:0.35;
    }
    50%{
        transform:scale(1.12);
        opacity:0.9;
    }
}

@keyframes cloudiaOrbPulseSoft{
    0%,100%{
        transform:scale(0.9);
        opacity:0.5;
    }
    50%{
        transform:scale(1.18);
        opacity:1;
    }
}

@keyframes cloudiaOrbCorePulse{
    0%,100%{
        transform:scale(0.88);
        opacity:0.45;
    }
    50%{
        transform:scale(1.18);
        opacity:1;
    }
}

@keyframes cloudiaOrbBackgroundPulse{
    0%,100%{opacity:0.5;}
    50%{opacity:1;}
}

/* ROTATIONS */

@keyframes cloudiaOrbRotate1{
from{transform:rotate(0deg) scaleX(1.08) scaleY(0.82);}
to{transform:rotate(360deg) scaleX(1.08) scaleY(0.82);}
}

@keyframes cloudiaOrbRotate2{
from{transform:rotate(360deg) scaleX(0.82) scaleY(1.15);}
to{transform:rotate(0deg) scaleX(0.82) scaleY(1.15);}
}

@keyframes cloudiaOrbRotate3{
from{transform:rotate(0deg) scaleX(1.16) scaleY(0.90);}
to{transform:rotate(360deg) scaleX(1.16) scaleY(0.90);}
}

@keyframes cloudiaOrbRotate4{
from{transform:rotate(360deg) scaleX(0.92) scaleY(1.18);}
to{transform:rotate(0deg) scaleX(0.92) scaleY(1.18);}
}

@keyframes cloudiaOrbRotateSlow{
from{transform:rotate(0deg);}
to{transform:rotate(360deg);}
}

/* MORPHING */

@keyframes cloudiaOrbMorph1{
0%,100%{border-radius:50% 45% 52% 48% / 50% 52% 48% 50%;}
50%{border-radius:44% 56% 48% 52% / 52% 46% 54% 48%;}
}

@keyframes cloudiaOrbMorph2{
0%,100%{border-radius:52% 48% 54% 46% / 46% 54% 48% 52%;}
50%{border-radius:48% 52% 46% 54% / 54% 46% 52% 48%;}
}

@keyframes cloudiaOrbMorph3{
0%,100%{border-radius:48% 52% 46% 54% / 50% 48% 52% 50%;}
50%{border-radius:54% 46% 52% 48% / 48% 52% 46% 54%;}
}

@keyframes cloudiaOrbMorph4{
0%,100%{border-radius:50% 50% 46% 54% / 54% 46% 50% 50%;}
50%{border-radius:46% 54% 50% 50% / 50% 50% 54% 46%;}
}

/* INNER HALOS */

@keyframes cloudiaOrbHaloSpin1{
from{
transform:rotate(0deg) scaleX(1.1) scaleY(0.9);
}
to{
transform:rotate(360deg) scaleX(1.1) scaleY(0.9);
}
}

@keyframes cloudiaOrbHaloSpin2{
from{
transform:rotate(360deg) scaleX(0.9) scaleY(1.1);
}
to{
transform:rotate(0deg) scaleX(0.9) scaleY(1.1);
}
}

@keyframes cloudiaOrbHaloPulse1{
0%,100%{
opacity:0.2;
transform:scale(0.9);
}
50%{
opacity:0.8;
transform:scale(1.08);
}
}

@keyframes cloudiaOrbHaloPulse2{
0%,100%{
opacity:0.15;
transform:scale(0.85);
}
50%{
opacity:0.7;
transform:scale(1.12);
}
}

/* SPARKLES */

@keyframes cloudiaOrbSparkle1{
0%,100%{
transform:translateY(0px) scale(0.7);
opacity:0.4;
}
50%{
transform:translateY(-10px) scale(1.4);
opacity:1;
}
}

@keyframes cloudiaOrbSparkle2{
0%,100%{
transform:translateX(0px) scale(0.8);
opacity:0.3;
}
50%{
transform:translateX(8px) scale(1.3);
opacity:1;
}
}

@keyframes cloudiaOrbSparkle3{
0%,100%{
transform:translateY(0px) scale(0.8);
opacity:0.2;
}
50%{
transform:translateY(8px) scale(1.5);
opacity:1;
}
}

@keyframes cloudiaOrbSparkle4{
0%,100%{
transform:translateX(0px) scale(0.7);
opacity:0.3;
}
50%{
transform:translateX(-8px) scale(1.4);
opacity:1;
}
}

/* PARTICLES */

@keyframes cloudiaOrbFloat1{
0%,100%{transform:translateY(0px);opacity:0.3;}
50%{transform:translateY(-24px);opacity:1;}
}

@keyframes cloudiaOrbFloat2{
0%,100%{transform:translateX(0px);opacity:0.3;}
50%{transform:translateX(18px);opacity:1;}
}

@keyframes cloudiaOrbFloat3{
0%,100%{transform:translateY(0px);opacity:0.3;}
50%{transform:translateY(14px);opacity:1;}
}

@keyframes cloudiaOrbFloat4{
0%,100%{transform:translateY(0px);opacity:0.3;}
50%{transform:translateY(-16px);opacity:1;}
}


@media (prefers-reduced-motion: reduce) {
  .cloudia-orb,
  .cloudia-orb * {
    animation: none !important;
    transition: none !important;
  }
}