.ai-loader {
    position: fixed;
    inset: 0;
    z-index: 1050;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 1rem;
    background: hsl(232deg 55% 9% / .62);
    -webkit-backdrop-filter: blur(6px);
    backdrop-filter: blur(6px);
    cursor: progress;
    animation: ai-loader-fade-in .25s ease-out;
}

.ai-loader__stage {
    position: relative;
    width: min(300px, 58vw, 46vh);
    aspect-ratio: 1;
    flex: none;
    margin-block: 1.75rem;
    container-type: inline-size;
}

.ai-loader__network {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    overflow: visible;
}

.ai-loader__orbit {
    fill: none;
    stroke: rgba(201, 206, 230, .18);
    stroke-width: .3;
    stroke-dasharray: .3 2.4;
    stroke-linecap: round;
    transform-box: fill-box;
    transform-origin: center;
    animation: ai-loader-fade-in .4s ease-out both, ai-loader-turn 60s linear infinite;
}

.ai-loader__synapse,
.ai-loader__pulse,
.ai-loader__node {
    --boot: .1s;
    --ping: .5s;
}

.ai-loader__synapse {
    fill: none;
    stroke: rgba(255, 255, 255, .22);
    stroke-width: .35;
    stroke-linecap: round;
    stroke-dasharray: 100;
    animation: ai-loader-wire .35s cubic-bezier(.45, 0, .25, 1) var(--boot) both;
}

.ai-loader__pulse {
    fill: none;
    stroke: #fff;
    stroke-width: .6;
    stroke-linecap: round;
    stroke-dasharray: 22 200;
    stroke-dashoffset: 26;
    animation: ai-loader-pulse 2s var(--ping) infinite both;
}

    .ai-loader__pulse--trail {
        stroke: var(--c);
        stroke-width: 2.4;
        opacity: .4;
    }

.ai-loader__token {
    position: absolute;
    left: 50%;
    top: 50%;
    z-index: 1;
    translate: -50% -50%;
    font-family: var(--ai-monoFamily, ui-monospace, SFMono-Regular, Consolas, "Liberation Mono", Menlo, monospace);
    font-size: .72rem;
    font-weight: 500;
    line-height: 1;
    white-space: nowrap;
    color: #fff;
    text-shadow: 0 0 6px var(--c), 0 0 14px var(--c);
    opacity: 0;
    animation: ai-loader-spiral 3.24s cubic-bezier(.5, 0, .75, .35) infinite;
}

.ai-loader__core {
    position: absolute;
    inset: 28%;
    z-index: 2;
    border-radius: 50%;
    animation: ai-loader-core-in .45s cubic-bezier(.16, 1, .3, 1) both;
}

.ai-loader__halo {
    position: absolute;
    inset: -42%;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(167, 123, 255, .34) 0%, rgba(90, 184, 235, .12) 42%, rgba(90, 184, 235, 0) 68%);
    opacity: .7;
    animation: ai-loader-glow 2s ease-out .5s infinite;
}

.ai-loader__aurora {
    position: absolute;
    inset: -5%;
    border-radius: 50%;
    background: conic-gradient(from 0deg, #5ab8eb, #a77bff, #D83F87, #5ab8eb);
    filter: blur(9px);
    opacity: .85;
    animation: ai-loader-turn 6s linear infinite;
}

.ai-loader__plasma {
    position: absolute;
    inset: 0;
    border-radius: 50%;
    overflow: hidden;
    background: radial-gradient(circle at 50% 56%, #27318f 0%, #0d1245 72%);
    transform: translateZ(0);
}

.ai-loader__swirl {
    position: absolute;
    inset: -20%;
    border-radius: 50%;
    mix-blend-mode: screen;
    animation: ai-loader-turn 5s linear infinite, ai-loader-swell 3.2s ease-in-out infinite alternate;
}

.ai-loader__swirl--sky { background: radial-gradient(circle at 32% 36%, #5ab8eb 0%, rgba(90, 184, 235, 0) 50%); }

.ai-loader__swirl--violet {
    background: radial-gradient(circle at 68% 40%, #a77bff 0%, rgba(167, 123, 255, 0) 52%);
    animation-duration: 7s, 4.1s;
    animation-direction: reverse, alternate;
}

.ai-loader__swirl--rose {
    background: radial-gradient(circle at 48% 70%, #D83F87 0%, rgba(216, 63, 135, 0) 48%);
    animation-duration: 9s, 3.7s;
    animation-delay: -3s, -1.4s;
}

.ai-loader__glass {
    position: absolute;
    inset: 0;
    border-radius: 50%;
    background: radial-gradient(ellipse 30% 19% at 37% 19%, rgba(255, 255, 255, .5) 0%, rgba(255, 255, 255, 0) 100%), radial-gradient(circle at 50% 50%, rgba(11, 15, 58, 0) 60%, rgba(11, 15, 58, .55) 100%);
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .22), inset 0 -6px 14px rgba(167, 123, 255, .3), 0 18px 40px rgba(5, 8, 30, .5);
}

.ai-loader__nucleus {
    position: absolute;
    inset: 30%;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(255, 255, 255, .45) 0%, rgba(214, 200, 255, .14) 40%, rgba(255, 255, 255, 0) 70%);
    opacity: .85;
    animation: ai-loader-flare 2s ease-out .05s infinite;
}

.ai-loader__neural {
    position: absolute;
    left: 8%;
    top: 8%;
    width: 84%;
    height: 84%;
    overflow: visible;
    filter: drop-shadow(0 0 2px rgba(167, 123, 255, .9));
}

.ai-loader__mesh {
    transform-origin: 50px 50px;
    animation: ai-loader-turn 40s linear infinite;
}

.ai-loader__axon {
    fill: none;
    stroke: rgba(205, 214, 255, .3);
    stroke-width: .55;
}

.ai-loader__signal {
    fill: none;
    stroke: #fff;
    stroke-width: 1.1;
    stroke-linecap: round;
    stroke-dasharray: 30 200;
    stroke-dashoffset: 32;
    animation: ai-loader-signal 2s .05s infinite both;
}

    .ai-loader__signal--ring { animation-delay: .2s; }
    .ai-loader__signal--outer { animation-delay: .25s; }

.ai-loader__neuron {
    fill: #fff;
    transform-box: fill-box;
    transform-origin: center;
    opacity: .6;
    animation: ai-loader-fire 2s ease-out infinite both;
}

    .ai-loader__neuron--hub { animation-delay: .05s; }
    .ai-loader__neuron--inner { fill: #ddd2ff; animation-delay: .25s; }
    .ai-loader__neuron--outer { fill: #c4e6fa; animation-delay: .5s; }

.ai-loader__wave {
    position: absolute;
    inset: 0;
    border-radius: 50%;
    border: 1px solid rgba(255, 255, 255, .5);
    opacity: 0;
    animation: ai-loader-wave 2s cubic-bezier(.2, .6, .3, 1) .5s infinite;
}

.ai-loader__node {
    position: absolute;
    left: calc(var(--x) * 1%);
    top: calc(var(--y) * 1%);
    z-index: 3;
    width: 13.5cqw;
    aspect-ratio: 1;
    translate: -50% -50%;
    animation: ai-loader-node-in .35s cubic-bezier(.16, 1, .3, 1) calc(var(--boot) + .15s) both;
}

.ai-loader__node-disc {
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 1px solid rgba(255, 255, 255, .18);
    border-radius: 50%;
    background: rgba(255, 255, 255, .06);
    color: rgba(255, 255, 255, .62);
    box-shadow: 0 4px 14px rgba(5, 8, 30, .35);
    animation: ai-loader-ignite 2s ease-out var(--ping) infinite both, ai-loader-bump 2s ease-out var(--ping) infinite both, ai-loader-cool .4s ease-out calc(var(--boot) + .15s);
}

    .ai-loader__node-disc::after {
        content: "";
        position: absolute;
        inset: -1px;
        border: 1px solid var(--c);
        border-radius: 50%;
        opacity: 0;
        animation: ai-loader-ripple 2s cubic-bezier(.2, .6, .3, 1) var(--ping) infinite both;
    }

.ai-loader__node-icon {
    width: 50%;
    height: 50%;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.75;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.ai-loader__node-label {
    position: absolute;
    left: calc(50% + var(--cos) * (50% + 7px));
    top: calc(50% + var(--sin) * (50% + 7px));
    transform: translate(calc(-50% + var(--cos) * 50%), calc(-50% + var(--sin) * 50%));
    font-size: .64rem;
    font-weight: 600;
    letter-spacing: .08em;
    line-height: 1;
    text-transform: uppercase;
    white-space: nowrap;
    color: rgba(255, 255, 255, .6);
    animation: ai-loader-label 2s ease-out var(--ping) infinite both;
}

.ai-loader__label {
    display: flex;
    flex-direction: column;
    align-items: center;
    line-height: 1.25;
    user-select: none;
}

.ai-loader__brand {
    font-size: .95rem;
    letter-spacing: .3em;
    font-weight: 600;
    background: linear-gradient(90deg, #5ab8eb, #fff, #D83F87, #5ab8eb);
    background-size: 300% 100%;
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
    animation: ai-loader-shimmer 3s linear infinite;
}

    .ai-loader__brand strong { font-weight: 800; }

.ai-loader__text {
    margin-top: .6rem;
    font-size: .95rem;
    color: rgba(255, 255, 255, .7);
}

.ai-loader__dots i {
    font-style: normal;
    animation: ai-loader-dot 1.2s infinite;
}

    .ai-loader__dots i:nth-child(2) { animation-delay: .2s; }
    .ai-loader__dots i:nth-child(3) { animation-delay: .4s; }

@keyframes ai-loader-fade-in { from { opacity: 0; } }
@keyframes ai-loader-turn { to { rotate: 360deg; } }
@keyframes ai-loader-swell { from { scale: .9; } to { scale: 1.12; } }
@keyframes ai-loader-core-in { from { scale: .55; opacity: 0; } }
@keyframes ai-loader-glow { 0% { opacity: 1; scale: 1.08; } 50%, 100% { opacity: .7; scale: 1; } }
@keyframes ai-loader-flare { 0% { opacity: 1; scale: 1.22; } 35%, 100% { opacity: .85; scale: 1; } }
@keyframes ai-loader-signal { 0% { stroke-dashoffset: 32; animation-timing-function: cubic-bezier(.45, 0, .25, 1); } 15%, 100% { stroke-dashoffset: -100; } }
@keyframes ai-loader-fire { 0% { scale: 1; opacity: .6; } 6% { scale: 1.7; opacity: 1; } 40%, 100% { scale: 1; opacity: .6; } }
@keyframes ai-loader-wave { 0% { scale: 1; opacity: .5; } 40%, 100% { scale: 1.6; opacity: 0; } }
@keyframes ai-loader-spiral { 0% { transform: rotate(var(--a)) translateX(var(--r)) rotate(calc(var(--a) * -1)) scale(1); opacity: 0; } 25% { opacity: .9; } 100% { transform: rotate(calc(var(--a) + 140deg)) translateX(0) rotate(calc(var(--a) * -1 - 140deg)) scale(.3); opacity: 0; } }
@keyframes ai-loader-wire { 0% { stroke-dashoffset: 100; stroke: var(--c); stroke-width: .7; } 55% { stroke-dashoffset: 0; stroke: var(--c); stroke-width: .7; } 100% { stroke-dashoffset: 0; } }
@keyframes ai-loader-pulse { 0% { stroke-dashoffset: 26; animation-timing-function: cubic-bezier(.45, 0, .25, 1); } 22%, 100% { stroke-dashoffset: -104; } }
@keyframes ai-loader-node-in { from { opacity: 0; scale: .4; } }
@keyframes ai-loader-cool { from { border-color: var(--c); background: color-mix(in srgb, var(--c) 30%, transparent); color: #fff; box-shadow: 0 0 0 4px color-mix(in srgb, var(--c) 20%, transparent), 0 6px 22px color-mix(in srgb, var(--c) 60%, transparent); } }
@keyframes ai-loader-ignite { 0%, 19%, 50%, 100% { border-color: rgba(255, 255, 255, .18); background: rgba(255, 255, 255, .06); color: rgba(255, 255, 255, .62); box-shadow: 0 4px 14px rgba(5, 8, 30, .35); } 24% { border-color: var(--c); background: color-mix(in srgb, var(--c) 30%, transparent); color: #fff; box-shadow: 0 0 0 4px color-mix(in srgb, var(--c) 20%, transparent), 0 6px 22px color-mix(in srgb, var(--c) 60%, transparent); } }
@keyframes ai-loader-bump { 0%, 19%, 40%, 100% { scale: 1; } 24% { scale: 1.14; } }
@keyframes ai-loader-ripple { 0%, 20% { scale: 1; opacity: 0; } 24% { opacity: .8; } 50%, 100% { scale: 2; opacity: 0; } }
@keyframes ai-loader-label { 0%, 19%, 50%, 100% { color: rgba(255, 255, 255, .6); } 24% { color: #fff; } }
@keyframes ai-loader-shimmer { to { background-position: -300% 0; } }
@keyframes ai-loader-dot { 0%, 60%, 100% { opacity: .2; } 30% { opacity: 1; } }

@media (prefers-reduced-motion: reduce) {
    .ai-loader__stage *, .ai-loader__node-disc::after, .ai-loader__dots i, .ai-loader__brand { animation: none !important; }

    .ai-loader__token, .ai-loader__pulse, .ai-loader__signal, .ai-loader__wave { display: none; }

    .ai-loader__node-disc { animation: ai-loader-ignite 4.8s ease-in-out infinite both !important; }

    .ai-loader__node-label { animation: ai-loader-label 4.8s ease-in-out infinite both !important; }
}

.ai-loader--splash {
    z-index: 2000;
    gap: 1.25rem;
    background: linear-gradient(160deg, var(--ai-topbar-bg) 0%, #141C5C 55%, var(--ai-topbar-bg) 100%);
    -webkit-backdrop-filter: none;
    backdrop-filter: none;
    transition: opacity .45s ease, visibility .45s;
    animation: none;
}

    .ai-loader--splash::before {
        content: "";
        position: absolute;
        inset: 0;
        z-index: -1;
        background: url(ai-loader-tokens.svg) center / 480px 480px;
        -webkit-mask-image: radial-gradient(ellipse 360px 340px at 50% 50%, rgba(0, 0, 0, .08) 70%, #000 100%);
        mask-image: radial-gradient(ellipse 360px 340px at 50% 50%, rgba(0, 0, 0, .08) 70%, #000 100%);
        pointer-events: none;
    }

    .ai-loader--splash .ai-loader__stage { width: min(340px, 60vw, 50vh); }

    .ai-loader--splash .ai-loader__node-label { font-size: .68rem; }

    .ai-loader--splash .ai-loader__brand { font-size: 1.15rem; }

.ai-loader--leaving {
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
}

    .ai-loader--leaving .ai-loader__stage {
        scale: 1.08;
        transition: scale .45s cubic-bezier(.4, 0, 1, 1);
    }

.ai-splash__progress {
    width: min(240px, 64vw);
    height: 3px;
    border-radius: 3px;
    background: rgba(255, 255, 255, .12);
    overflow: hidden;
}

.ai-splash__progress-bar {
    height: 100%;
    width: var(--blazor-load-percentage, 0%);
    border-radius: inherit;
    background: linear-gradient(90deg, #5ab8eb, #a77bff, #D83F87);
    box-shadow: 0 0 8px rgba(90, 184, 235, .8);
    transition: width .2s ease-out;
}