.cs-loader{
    position:fixed;inset:0;z-index:9999;
    display:flex;align-items:center;justify-content:center;
    overflow:hidden;
    background:#ffffff;
    isolation:isolate;
    height:100vh;
    height:100dvh;
    --aql-text:#0c2a44;
    --aql-text-soft:rgba(12,42,68,.55);
    --aql-text-faint:rgba(12,42,68,.32);
    --aql-track:rgba(34,211,238,.10);
    --aql-glow:rgba(34,211,238,.4);
    --aql-bg-soft:rgba(34,211,238,.04);
}
html.dark .cs-loader{
    background:radial-gradient(ellipse at 50% 50%,#072138 0%,#031424 70%,#020e1a 100%);
    --aql-text:#E0F7FF;
    --aql-text-soft:rgba(207,250,254,.6);
    --aql-text-faint:rgba(207,250,254,.32);
    --aql-track:rgba(103,232,249,.12);
    --aql-glow:rgba(103,232,249,.55);
    --aql-bg-soft:rgba(34,211,238,.06);
}
.cs-loader.exit{animation:csExit .8s cubic-bezier(.4,0,.2,1) forwards}
@keyframes csExit{
    0%{opacity:1;transform:scale(1);filter:blur(0)}
    100%{opacity:0;transform:scale(1.04);filter:blur(8px);visibility:hidden}
}

.cs-loader .aql-bg-grid{
    position:absolute;inset:0;
    background-image:
        radial-gradient(circle at 20% 80%,var(--aql-bg-soft) 0%,transparent 50%),
        radial-gradient(circle at 80% 20%,var(--aql-bg-soft) 0%,transparent 50%);
    pointer-events:none;
    z-index:0;
}

.cs-loader .aql-bubbles{
    position:absolute;inset:0;
    pointer-events:none;
    z-index:0;
    overflow:hidden;
}
.cs-loader .aql-bubble{
    position:absolute;
    bottom:-40px;
    border-radius:50%;
    background:
        radial-gradient(circle at 32% 28%,rgba(255,255,255,.95) 0%,rgba(255,255,255,.45) 14%,rgba(125,211,252,.55) 38%,rgba(56,189,248,.42) 60%,rgba(14,165,233,.28) 82%,rgba(8,145,178,.18) 100%);
    border:1.5px solid rgba(14,165,233,.55);
    box-shadow:
        inset -3px -4px 8px rgba(8,116,165,.35),
        inset 2px 2px 5px rgba(255,255,255,.8),
        0 4px 18px rgba(34,211,238,.35),
        0 0 0 1px rgba(255,255,255,.25);
    opacity:0;
    animation:csBubbleFloat linear infinite;
    will-change:transform,opacity;
}
html.dark .cs-loader .aql-bubble{
    background:
        radial-gradient(circle at 32% 28%,rgba(255,255,255,.7) 0%,rgba(255,255,255,.25) 14%,rgba(103,232,249,.4) 38%,rgba(34,211,238,.3) 65%,rgba(14,165,233,.18) 100%);
    border-color:rgba(125,211,252,.4);
    box-shadow:
        inset -2px -3px 6px rgba(8,47,73,.5),
        inset 2px 2px 5px rgba(255,255,255,.45),
        0 4px 18px rgba(103,232,249,.32);
}
@keyframes csBubbleFloat{
    0%{transform:translate(0,0) scale(.55);opacity:0}
    8%{opacity:.95}
    50%{transform:translate(22px,-58vh) scale(1)}
    92%{opacity:.7}
    100%{transform:translate(-26px,-118vh) scale(1.12);opacity:0}
}

.cs-loader .aql-wave-wrap{
    position:absolute;
    left:0;right:0;
    top:50%;transform:translateY(-50%);
    height:38vh;
    z-index:1;
    pointer-events:none;
    overflow:hidden;
}
.cs-loader .aql-wave{
    position:absolute;inset:0;
    width:100%;height:100%;
    display:block;
}
.cs-loader .aql-wave-track{
    fill:none;
    stroke:var(--aql-track);
    stroke-width:2;
    stroke-linecap:round;
}
.cs-loader .aql-wave-fill{
    fill:none;
    stroke:url(#aqlWaveGrad);
    stroke-width:3.5;
    stroke-linecap:round;
    stroke-dasharray:1;
    stroke-dashoffset:1;
    transition:stroke-dashoffset .55s cubic-bezier(.4,0,.2,1);
    filter:drop-shadow(0 6px 22px var(--aql-glow));
}
.cs-loader .aql-wave-glow{
    fill:none;
    stroke:url(#aqlWaveGrad);
    stroke-width:14;
    stroke-linecap:round;
    stroke-dasharray:1;
    stroke-dashoffset:1;
    transition:stroke-dashoffset .55s cubic-bezier(.4,0,.2,1);
    opacity:.32;
    filter:blur(10px);
}
.cs-loader .aql-wave-shift{
    animation:csWaveShift 22s linear infinite;
    width:200%;height:100%;position:absolute;top:0;left:0;
}
@keyframes csWaveShift{
    0%{transform:translateX(0)}
    100%{transform:translateX(-12.5%)}
}

.cs-loader{
    --aql-mx:0;
    --aql-my:0;
}

.cs-loader .aql-stage{
    position:relative;z-index:2;
    display:flex;flex-direction:column;align-items:center;
    gap:1.6rem;
    padding:.6em 1.5rem;
    overflow:visible;
    transform:translate(calc(var(--aql-mx) * 10px),calc(var(--aql-my) * 7px));
    transition:transform .55s cubic-bezier(.22,1,.36,1);
}

.cs-loader .aql-wave-parallax{
    position:absolute;inset:0;
    transform:translate(calc(var(--aql-mx) * -16px),calc(var(--aql-my) * -10px));
    transition:transform .65s cubic-bezier(.22,1,.36,1);
    pointer-events:none;
}

.cs-loader .aql-title{
    margin:0;
    font-size:clamp(2.8rem,9.5vw,8rem);
    line-height:1.5;
    letter-spacing:-.015em;
    display:flex;flex-wrap:nowrap;align-items:baseline;
    gap:.28em;
    white-space:nowrap;
    padding:.1em .2em .25em;
    overflow:visible;
}
.cs-loader .aql-word{display:inline-flex;overflow:visible}
.cs-loader .aql-letter{
    display:inline-block;
    opacity:0;
    transform:translateY(34px);
    filter:blur(16px);
    animation:csLetterIn .9s cubic-bezier(.22,1,.36,1) forwards;
    padding:0 .015em;
}
@keyframes csLetterIn{
    to{opacity:1;transform:translateY(0);filter:blur(0)}
}

.cs-loader .aql-w-aqua{
    font-family:'Cormorant Garamond','Times New Roman',serif;
    position:relative;
}

.cs-loader .aql-drip{
    position:absolute;
    width:.16em;height:.24em;
    opacity:0;
    pointer-events:none;
    transform-origin:50% 0%;
    transform:translate(-50%,-30%) scale(0);
    will-change:transform,opacity;
    z-index:3;
    overflow:visible;
    filter:drop-shadow(0 1px 4px rgba(34,211,238,.55)) drop-shadow(0 0 2px rgba(165,243,252,.55));
}
html.dark .cs-loader .aql-drip{
    filter:drop-shadow(0 1px 5px rgba(103,232,249,.7)) drop-shadow(0 0 2px rgba(207,250,254,.5));
}
html.dark .cs-loader .aql-drip-body{fill:url(#aqlDripBodyDark)}
.cs-loader .aql-drip-shine{filter:blur(.2px)}
.cs-loader .aql-drip.run{
    animation:csDrip 2.6s cubic-bezier(.42,0,.62,.26) infinite;
}
@keyframes csDrip{
    0%{transform:translate(-50%,-30%) scale(0);opacity:0;animation-timing-function:cubic-bezier(.22,.9,.36,1)}
    14%{transform:translate(-50%,0%) scale(1);opacity:1;animation-timing-function:ease-in-out}
    26%{transform:translate(-50%,4%) scale(1);opacity:1;animation-timing-function:cubic-bezier(.42,0,.62,.26)}
    100%{transform:translate(-50%,820%) scale(.85);opacity:0}
}
.cs-loader .aql-w-aqua .aql-letter{
    font-weight:300;
    font-style:italic;
    font-size:1.18em;
    padding:0 .025em;
    margin:0 -.02em;
    background:linear-gradient(135deg,#22D3EE 0%,#0EA5E9 55%,#0284C7 100%);
    -webkit-background-clip:text;background-clip:text;
    -webkit-text-fill-color:transparent;color:transparent;
    background-size:220% 220%;
    animation:csLetterIn .9s cubic-bezier(.22,1,.36,1) forwards,
              csShimmer 7s ease-in-out 1.8s infinite;
}
html.dark .cs-loader .aql-w-aqua .aql-letter{
    background:linear-gradient(135deg,#A5F3FC 0%,#22D3EE 55%,#0EA5E9 100%);
    -webkit-background-clip:text;background-clip:text;
    -webkit-text-fill-color:transparent;
}
@keyframes csShimmer{
    0%,100%{background-position:0% 50%}
    50%{background-position:100% 50%}
}

.cs-loader .aql-w-cookies{
    font-family:'Space Grotesk',system-ui,sans-serif;
}
.cs-loader .aql-w-cookies .aql-letter{
    font-weight:600;
    letter-spacing:-.025em;
    color:var(--aql-text);
    text-shadow:0 4px 30px rgba(34,211,238,.15);
}
html.dark .cs-loader .aql-w-cookies .aql-letter{
    text-shadow:0 4px 30px rgba(103,232,249,.25);
}

.cs-loader .aql-tagline{
    font-family:'Space Grotesk',system-ui,sans-serif;
    font-size:.7rem;font-weight:500;
    letter-spacing:.55em;
    text-transform:uppercase;
    color:var(--aql-text-soft);
    opacity:0;
    transform:translateY(8px);
    animation:csFadeUp .8s cubic-bezier(.22,1,.36,1) 1.3s forwards;
    display:flex;align-items:center;gap:.85rem;
    padding-left:.55em;
}
@keyframes csFadeUp{
    to{opacity:1;transform:translateY(0)}
}
.cs-loader .aql-tagline::before,
.cs-loader .aql-tagline::after{
    content:'';
    width:30px;height:1px;
    background:linear-gradient(90deg,transparent,var(--aql-text-faint),transparent);
}

@media(max-width:768px){
    .cs-loader .aql-wave-wrap{height:32vh}
    .cs-loader .aql-wave-fill{stroke-width:3}
    .cs-loader .aql-wave-glow{stroke-width:11;filter:blur(8px);opacity:.28}
    .cs-loader .aql-stage{gap:1.2rem;padding:.5em 1rem}
    .cs-loader .aql-title{
        font-size:clamp(2.6rem,12vw,4.4rem);
        gap:.18em;
        padding:.1em .15em .2em;
    }
}

@media(max-width:560px){
    .cs-loader{
        --aql-mx:0 !important;
        --aql-my:0 !important;
    }
    .cs-loader .aql-stage{
        transform:none;
        transition:none;
        gap:1rem;
        padding:.4em .8rem;
    }
    .cs-loader .aql-wave-parallax{transform:none;transition:none}
    .cs-loader .aql-wave-wrap{height:30vh}
    .cs-loader .aql-wave-fill{stroke-width:2.6}
    .cs-loader .aql-wave-glow{stroke-width:9;filter:blur(7px);opacity:.26}
    .cs-loader .aql-title{
        flex-direction:column;
        align-items:center;
        gap:0;
        font-size:clamp(3.2rem,14vw,5rem);
        line-height:1.15;
        padding:.05em .1em .15em;
    }
    .cs-loader .aql-w-aqua .aql-letter{
        font-size:1.5em;
        padding:0 .035em;
    }
    .cs-loader .aql-w-cookies .aql-letter{
        letter-spacing:-.02em;
    }
    .cs-loader .aql-drip{
        width:.18em;height:.27em;
        filter:drop-shadow(0 1px 5px rgba(34,211,238,.7)) drop-shadow(0 0 3px rgba(165,243,252,.6));
    }
    html.dark .cs-loader .aql-drip{
        filter:drop-shadow(0 1px 6px rgba(103,232,249,.85)) drop-shadow(0 0 3px rgba(207,250,254,.55));
    }
    .cs-loader .aql-tagline{
        font-size:.62rem;
        letter-spacing:.42em;
        gap:.6rem;
        padding-left:.42em;
        margin-top:.4rem;
    }
    .cs-loader .aql-tagline::before,
    .cs-loader .aql-tagline::after{width:22px}
    .cs-loader .aql-bubble{
        box-shadow:
            inset -2px -3px 6px rgba(8,116,165,.3),
            inset 1.5px 1.5px 4px rgba(255,255,255,.7),
            0 2px 12px rgba(34,211,238,.28);
    }
}

@media(max-width:380px){
    .cs-loader .aql-stage{gap:.85rem;padding:.3em .5rem}
    .cs-loader .aql-title{
        font-size:clamp(2.8rem,13vw,3.8rem);
        gap:0;
    }
    .cs-loader .aql-tagline{
        font-size:.58rem;
        letter-spacing:.36em;
        gap:.5rem;
    }
    .cs-loader .aql-tagline::before,
    .cs-loader .aql-tagline::after{width:18px}
    .cs-loader .aql-wave-wrap{height:26vh}
}

@media(orientation:landscape) and (max-height:500px){
    .cs-loader .aql-title{
        flex-direction:row;
        font-size:clamp(2rem,7vw,3.2rem);
        gap:.25em;
        line-height:1.4;
    }
    .cs-loader .aql-w-aqua .aql-letter{font-size:1.25em}
    .cs-loader .aql-stage{gap:.7rem}
    .cs-loader .aql-wave-wrap{height:55vh}
    .cs-loader .aql-tagline{font-size:.55rem;letter-spacing:.38em}
}

@media(prefers-reduced-motion:reduce){
    .cs-loader .aql-letter,
    .cs-loader .aql-tagline,
    .cs-loader .aql-drip,
    .cs-loader .aql-bubble,
    .cs-loader .aql-wave-shift{animation:none !important}
    .cs-loader .aql-letter{opacity:1;transform:none;filter:none}
    .cs-loader .aql-tagline{opacity:1;transform:none}
}