/* ==========================================================
   VAERO ENGINE — WELCOME REFERENCE
   FINAL VISUAL OVERRIDE LAYER

   PURPOSE
   ----------------------------------------------------------
   • welcome-screen.css üzerine son görsel düzen
   • Desktop reference composition
   • Mobile landing + mobile authentication
   • Existing HTML / JS structure preserved
   • No duplicated base architecture
   • Premium VAERO gold / deep-space identity
   ========================================================== */


/* ==========================================================
   01. SHARED REFERENCE POLISH
   ========================================================== */

.vaero-welcome-screen{
    --reference-gold:#dfb56a;
    --reference-gold-soft:#d3ac67;
    --reference-gold-bright:#f1ca7d;

    --reference-text:#f7f4ed;

    --reference-panel:
        rgba(8,12,19,.84);

    --reference-border:
        rgba(255,255,255,.11);

    --reference-muted:
        rgba(236,232,223,.64);

    --reference-ease:
        cubic-bezier(.22,.8,.2,1);
}


/* ==========================================================
   02. FEATURE ICON FOUNDATION
   ========================================================== */

.vaero-welcome-screen
.welcome-feature-icon{
    color:
        var(--reference-gold);

    transition:
        transform .28s
        var(--reference-ease),

        color .28s ease,

        filter .28s ease;
}

.vaero-welcome-screen
.welcome-feature-icon svg{
    display:block;

    overflow:visible;
}

.vaero-welcome-screen
.welcome-feature-icon svg path,
.vaero-welcome-screen
.welcome-feature-icon svg ellipse,
.vaero-welcome-screen
.welcome-feature-icon svg circle{
    fill:none;

    stroke:currentColor;

    stroke-width:1.8;

    stroke-linecap:round;
    stroke-linejoin:round;

    vector-effect:
        non-scaling-stroke;
}

.vaero-welcome-screen
.welcome-feature-icon svg
.welcome-orbit-node{
    fill:currentColor;

    stroke:none;
}


/* ==========================================================
   03. MOBILE ACTION DEFAULT
   ========================================================== */

.vaero-welcome-screen
.welcome-mobile-actions{
    display:none;
}


/* ==========================================================
   04. MOBILE BACK BUTTON BASE
   ========================================================== */

.vaero-welcome-screen
.welcome-mobile-back{
    position:absolute;

    top:
        calc(
            18px +
            env(
                safe-area-inset-top,
                0px
            )
        );

    left:18px;

    z-index:5;

    display:flex;

    align-items:center;
    justify-content:center;

    width:38px;
    height:38px;

    margin:0;

    padding:0;

    border:
        1px solid
        rgba(255,255,255,.12);

    border-radius:50%;

    outline:none;

    background:
        rgba(6,10,17,.55);

    color:
        var(--reference-gold);

    box-shadow:
        inset
        0
        1px
        0
        rgba(255,255,255,.02),

        0
        10px
        28px
        rgba(0,0,0,.14);

    backdrop-filter:blur(14px);
    -webkit-backdrop-filter:blur(14px);

    font:inherit;

    font-size:22px;

    cursor:pointer;

    -webkit-tap-highlight-color:
        transparent;

    transition:
        transform .18s
        var(--reference-ease),

        border-color .18s ease,

        background .18s ease;
}

.vaero-welcome-screen
.welcome-mobile-back:hover{
    border-color:
        rgba(223,181,106,.28);

    background:
        rgba(223,181,106,.055);

    transform:
        translateY(-1px);
}

.vaero-welcome-screen
.welcome-mobile-back:active{
    transform:
        scale(.96);
}


/* ==========================================================
   05. DESKTOP
   ========================================================== */

@media (min-width:769px){

    /* ------------------------------------------------------
       DESKTOP MOBILE-ONLY ELEMENTS
       ------------------------------------------------------ */

    .vaero-welcome-screen
    .welcome-mobile-actions,
    .vaero-welcome-screen
    .welcome-mobile-back{
        display:none;
    }


    /* ------------------------------------------------------
       DESKTOP SCENE OVERLAY
       ------------------------------------------------------ */

    .vaero-welcome-screen::after{
        content:"";

        position:absolute;

        inset:0;

        z-index:1;

        pointer-events:none;

        background:
            linear-gradient(
                90deg,
                rgba(1,5,11,.36) 0%,
                rgba(1,5,11,.045) 46%,
                rgba(1,5,11,.46) 100%
            ),

            linear-gradient(
                180deg,
                rgba(0,3,8,.11),
                rgba(0,3,8,.39)
            );
    }

    .vaero-welcome-screen
    .welcome-scene img{
        object-fit:cover;

        object-position:
            center
            center;

        filter:
            brightness(.66)
            saturate(.88)
            contrast(1.015);
    }

    .vaero-welcome-screen
    .welcome-stars{
        z-index:1;

        opacity:.18;
    }


    /* ------------------------------------------------------
       DESKTOP LAYOUT
       ------------------------------------------------------ */

    .vaero-welcome-screen
    .welcome-layout{
        position:relative;

        z-index:2;

        display:grid;

        grid-template-columns:
            minmax(0,1.3fr)
            minmax(390px,.75fr);

        align-items:stretch;

        width:100%;
        height:100%;

        min-width:0;
        min-height:0;

        padding:
            30px
            44px
            24px;

        gap:
            clamp(
                44px,
                5vw,
                82px
            );

        overflow:hidden;
    }


    /* ------------------------------------------------------
       LEFT COLUMN
       ------------------------------------------------------ */

    .vaero-welcome-screen
    .welcome-left{
        position:relative;

        display:flex;

        flex-direction:column;

        width:100%;
        height:100%;

        min-width:0;
        min-height:0;
    }


    /* ------------------------------------------------------
       DESKTOP BRAND
       ------------------------------------------------------ */

    .vaero-welcome-screen
    .welcome-brand{
        display:block;

        width:max-content;
        max-width:100%;

        margin:0;

        color:#deb66c;

        text-align:center;
    }

    .vaero-welcome-screen
    .welcome-brand strong{
        display:block;

        margin:0;

        color:#e1ba72;

        background:none;

        -webkit-background-clip:initial;
        background-clip:initial;

        font-size:27px;
        font-weight:650;

        line-height:1;

        letter-spacing:.28em;
        text-indent:.28em;

        text-shadow:
            0
            0
            28px
            rgba(225,186,114,.035);
    }

    .vaero-welcome-screen
    .welcome-brand span{
        display:block;

        margin-top:8px;

        color:#d3ac67;

        font-size:9px;
        font-weight:600;

        line-height:1;

        letter-spacing:.52em;
        text-indent:.52em;
    }


    /* ------------------------------------------------------
       DESKTOP INTRO
       ------------------------------------------------------ */

    .vaero-welcome-screen
    .welcome-intro{
        width:
            min(
                100%,
                590px
            );

        margin:
            auto
            0;

        padding:
            18px
            0
            40px
            28px;
    }

    .vaero-welcome-screen
    .welcome-intro h1{
        max-width:510px;

        margin:0;

        color:
            var(--reference-text);

        font-size:
            clamp(
                42px,
                3.7vw,
                54px
            );

        font-weight:650;

        line-height:1.06;

        letter-spacing:-.045em;

        text-wrap:balance;
    }

    .vaero-welcome-screen
    .welcome-intro h1 span{
        display:block;

        margin-top:4px;

        color:#dfb76f;
    }

    .vaero-welcome-screen
    .welcome-description{
        max-width:500px;

        margin:
            24px
            0
            0;

        color:
            var(--reference-muted);

        font-size:16px;

        line-height:1.65;
    }


    /* ------------------------------------------------------
       DESKTOP FEATURES
       ------------------------------------------------------ */

    .vaero-welcome-screen
    .welcome-features{
        display:grid;

        grid-template-columns:
            repeat(
                3,
                minmax(0,1fr)
            );

        width:
            min(
                100%,
                560px
            );

        margin-top:42px;

        gap:0;

        justify-items:stretch;
    }

    .vaero-welcome-screen
    .welcome-feature{
        display:block;

        min-width:0;

        padding:
            0
            20px;

        border:0;

        border-right:
            1px solid
            rgba(218,177,103,.14);

        border-radius:0;

        background:none;

        text-align:center;

        backdrop-filter:none;
        -webkit-backdrop-filter:none;
    }

    .vaero-welcome-screen
    .welcome-feature:first-child{
        padding-left:0;
    }

    .vaero-welcome-screen
    .welcome-feature:last-child{
        padding-right:0;

        border-right:0;
    }

    .vaero-welcome-screen
    .welcome-feature-icon{
        display:flex;

        align-items:center;
        justify-content:center;

        width:48px;
        height:48px;

        margin:
            0
            auto
            14px;

        border:0;

        border-radius:0;
    }

    .vaero-welcome-screen
    .welcome-feature:hover
    .welcome-feature-icon{
        color:
            var(--reference-gold-bright);

        transform:
            translateY(-3px)
            scale(1.04);

        filter:
            drop-shadow(
                0
                7px
                12px
                rgba(218,174,94,.18)
            );
    }

    .vaero-welcome-screen
    .welcome-feature-icon svg{
        width:46px;
        height:46px;
    }

    .vaero-welcome-screen
    .welcome-feature:nth-child(1)
    .welcome-feature-icon svg{
        width:42px;
        height:42px;
    }

    .vaero-welcome-screen
    .welcome-feature:nth-child(2)
    .welcome-feature-icon svg{
        width:44px;
        height:44px;
    }

    .vaero-welcome-screen
    .welcome-feature:nth-child(3)
    .welcome-feature-icon svg{
        width:42px;
        height:42px;

        transform:
            translateY(-1px);
    }

    .vaero-welcome-screen
    .welcome-feature strong{
        display:block;

        color:#f3eee5;

        font-size:13px;
        font-weight:500;

        line-height:1.25;
    }

    .vaero-welcome-screen
    .welcome-feature p{
        margin:
            6px
            0
            0;

        color:
            rgba(228,224,216,.48);

        font-size:10px;

        line-height:1.45;
    }


    /* ------------------------------------------------------
       COPYRIGHT
       ------------------------------------------------------ */

    .vaero-welcome-screen
    .welcome-copyright{
        position:absolute;

        bottom:0;
        left:0;

        margin:0;

        color:
            rgba(233,228,218,.34);

        font-size:10px;
    }


    /* ------------------------------------------------------
       RIGHT COLUMN
       ------------------------------------------------------ */

    .vaero-welcome-screen
    .welcome-right{
        position:relative;

        display:flex;

        align-items:center;
        justify-content:flex-end;

        width:100%;
        height:100%;

        min-width:0;
        min-height:0;

        margin:0;
    }


    /* ------------------------------------------------------
       THEME TOGGLE
       ------------------------------------------------------ */

    .vaero-welcome-screen
    .welcome-theme-toggle{
        position:absolute;

        top:0;
        right:12px;

        z-index:3;

        display:flex;

        overflow:hidden;

        padding:3px;

        border:
            1px solid
            rgba(255,255,255,.12);

        border-radius:14px;

        background:
            rgba(5,9,15,.64);

        box-shadow:
            inset
            0
            1px
            0
            rgba(255,255,255,.018);

        backdrop-filter:blur(14px);
        -webkit-backdrop-filter:blur(14px);
    }

    .vaero-welcome-screen
    .welcome-theme-toggle button{
        display:flex;

        align-items:center;
        justify-content:center;

        width:34px;
        height:28px;

        margin:0;
        padding:0;

        border:0;

        border-radius:10px;

        background:transparent;

        color:
            rgba(255,255,255,.58);

        cursor:pointer;

        transition:
            background .18s ease,
            color .18s ease;
    }

    .vaero-welcome-screen
    .welcome-theme-toggle button:hover{
        color:
            rgba(255,255,255,.88);

        background:
            rgba(255,255,255,.035);
    }

    .vaero-welcome-screen
    .welcome-theme-toggle button.is-active{
        color:#e0b76e;

        background:
            rgba(219,177,99,.13);
    }


    /* ------------------------------------------------------
       AUTH PANEL
       ------------------------------------------------------ */

    .vaero-welcome-screen
    .welcome-auth-panel{
        position:relative;

        display:flex;

        flex-direction:column;

        justify-content:center;

        width:100%;
        max-width:440px;

        min-height:620px;

        margin:0;

        padding:
            34px
            36px
            30px;

        overflow:hidden;

        border:
            1px solid
            rgba(255,255,255,.12);

        border-radius:18px;

        background:
            radial-gradient(
                circle at 50% -5%,
                rgba(223,181,106,.025),
                transparent 30%
            ),
            linear-gradient(
                145deg,
                rgba(16,20,28,.89),
                rgba(7,10,16,.83)
            );

        box-shadow:
            0
            28px
            80px
            rgba(0,0,0,.48),

            inset
            0
            1px
            0
            rgba(255,255,255,.025);

        backdrop-filter:
            blur(24px)
            saturate(112%);

        -webkit-backdrop-filter:
            blur(24px)
            saturate(112%);
    }


    /* ------------------------------------------------------
       AUTH LOGO
       ------------------------------------------------------ */

    .vaero-welcome-screen
    .welcome-auth-logo{
        display:flex;

        align-items:center;
        justify-content:center;

        width:66px;
        height:66px;

        margin:
            0
            auto
            14px;

        color:
            var(--reference-gold);

        font-size:52px;
        font-weight:300;

        line-height:1;

        transform:none;
    }

    .vaero-welcome-screen
    .welcome-auth-logo svg{
        display:block;

        width:72px;
        height:64px;

        overflow:visible;
    }


    /* ------------------------------------------------------
       AUTH HEADING
       ------------------------------------------------------ */

    .vaero-welcome-screen
    .welcome-auth-heading{
        margin:
            0
            0
            25px;

        text-align:center;
    }

    .vaero-welcome-screen
    .welcome-auth-heading h2{
        margin:0;

        color:#f4f1ea;

        font-size:22px;
        font-weight:500;

        letter-spacing:-.02em;
    }

    .vaero-welcome-screen
    .welcome-auth-heading span{
        display:block;

        margin-top:9px;

        color:
            rgba(232,228,219,.48);

        font-size:12px;

        line-height:1.5;
    }


    /* ------------------------------------------------------
       AUTH FORM
       ------------------------------------------------------ */

    .vaero-welcome-screen
    .welcome-auth-form{
        display:grid;

        gap:15px;
    }

    .vaero-welcome-screen
    .welcome-auth-form label{
        display:grid;

        gap:8px;
    }

    .vaero-welcome-screen
    .welcome-auth-form label > span{
        color:
            rgba(243,239,231,.72);

        font-size:12px;
    }


    /* ------------------------------------------------------
       INPUTS
       ------------------------------------------------------ */

    .vaero-welcome-screen
    .welcome-input-wrap{
        position:relative;

        display:flex;

        align-items:center;

        width:100%;
        height:47px;

        padding:
            0
            14px;

        border:
            1px solid
            rgba(255,255,255,.11);

        border-radius:8px;

        background:
            rgba(255,255,255,.035);
    }

    .vaero-welcome-screen
    .welcome-input-wrap > span{
        display:flex;

        flex:0 0 auto;

        align-items:center;
        justify-content:center;

        width:20px;

        color:
            rgba(255,255,255,.5);

        font-size:14px;
    }

    .vaero-welcome-screen
    .welcome-input-wrap input{
        flex:1;

        width:auto;
        height:100%;

        min-width:0;

        padding:
            0
            8px;

        border:0;

        outline:0;

        background:transparent;

        box-shadow:none;

        color:#f4f1eb;

        font:inherit;

        font-size:13px !important;
    }

    .vaero-welcome-screen
    .welcome-input-wrap input::placeholder{
        color:
            rgba(255,255,255,.3);
    }

    .vaero-welcome-screen
    .welcome-password-toggle{
        flex:0 0 auto;

        padding:5px;

        border:0;

        background:transparent;

        color:
            rgba(255,255,255,.5);

        cursor:pointer;
    }

    .vaero-welcome-screen
    .welcome-forgot-password{
        justify-self:end;

        margin-top:-6px;

        padding:0;

        border:0;

        background:transparent;

        color:#d2a85e;

        font-size:11px;

        cursor:pointer;
    }


    /* ------------------------------------------------------
       AUTH BUTTONS
       ------------------------------------------------------ */

    .vaero-welcome-screen
    .welcome-primary,
    .vaero-welcome-screen
    .welcome-secondary{
        width:100%;
        height:47px;

        min-height:0;

        border-radius:8px;

        font:inherit;

        font-size:13px;
        font-weight:600;

        cursor:pointer;
    }

    .vaero-welcome-screen
    .welcome-primary{
        margin:0;

        border:0;

        color:#171108;

        background:
            linear-gradient(
                100deg,
                #cda554,
                #f0d28b,
                #c89442
            );

        box-shadow:
            0
            12px
            28px
            rgba(203,157,72,.15);
    }

    .vaero-welcome-screen
    .welcome-divider{
        display:grid;

        grid-template-columns:
            1fr
            auto
            1fr;

        align-items:center;

        gap:13px;

        margin:
            17px
            0;
    }

    .vaero-welcome-screen
    .welcome-divider span{
        height:1px;

        background:
            rgba(255,255,255,.1);
    }

    .vaero-welcome-screen
    .welcome-divider small{
        color:
            rgba(255,255,255,.3);

        font-size:11px;
    }

    .vaero-welcome-screen
    .welcome-secondary{
        border:
            1px solid
            rgba(208,166,92,.3);

        background:
            rgba(255,255,255,.015);

        color:
            rgba(247,242,232,.86);
    }

    .vaero-welcome-screen
    .welcome-learn-more{
        display:flex;

        align-items:center;
        justify-content:center;

        gap:9px;

        margin-top:24px;

        color:#d2aa62;

        font-size:11px;

        text-decoration:none;
    }


    /* ------------------------------------------------------
       LEGACY HIDDEN
       ------------------------------------------------------ */

    .vaero-welcome-screen
    .welcome-content,
    .vaero-welcome-screen
    .welcome-actions,
    .vaero-welcome-screen
    .welcome-message{
        display:none;
    }


    /* ------------------------------------------------------
       LIGHT THEME VISUAL VARIANT
       ------------------------------------------------------ */

    .vaero-welcome-screen.is-light-theme
    .welcome-scene img{
        filter:
            brightness(.82)
            saturate(.96);
    }

    .vaero-welcome-screen.is-light-theme::after{
        background:
            linear-gradient(
                90deg,
                rgba(1,5,11,.22) 0%,
                rgba(1,5,11,.02) 47%,
                rgba(1,5,11,.30) 100%
            ),

            linear-gradient(
                180deg,
                rgba(0,3,8,.04),
                rgba(0,3,8,.22)
            );
    }

    .vaero-welcome-screen.is-light-theme
    .welcome-auth-panel{
        background:
            linear-gradient(
                145deg,
                rgba(24,29,38,.85),
                rgba(10,14,21,.79)
            );
    }

}


/* ==========================================================
   06. SHORT DESKTOP
   ========================================================== */

@media
(
    min-width:769px
)
and
(
    max-height:760px
){

    .vaero-welcome-screen
    .welcome-layout{
        padding:
            18px
            36px
            12px;

        gap:
            clamp(
                34px,
                4vw,
                64px
            );
    }

    .vaero-welcome-screen
    .welcome-intro{
        padding:
            12px
            0
            10px
            28px;
    }

    .vaero-welcome-screen
    .welcome-intro h1{
        font-size:
            clamp(
                38px,
                3.7vw,
                54px
            );
    }

    .vaero-welcome-screen
    .welcome-description{
        margin-top:14px;

        line-height:1.45;
    }

    .vaero-welcome-screen
    .welcome-features{
        margin-top:34px;
    }

    .vaero-welcome-screen
    .welcome-right{
        align-items:center;

        padding:
            20px
            0
            8px;
    }

    .vaero-welcome-screen
    .welcome-auth-panel{
        position:relative;

        display:block;

        width:100%;
        max-width:440px;

        height:540px;

        min-height:0;

        max-height:
            calc(
                100vh - 58px
            );

        margin:0;

        padding:
            98px
            36px
            52px;

        transform:
            translateY(5px);
    }

    .vaero-welcome-screen
    .welcome-auth-logo{
        position:absolute;

        top:20px;
        left:50%;

        width:62px;
        height:58px;

        margin:0;

        transform:
            translateX(-50%);
    }

    .vaero-welcome-screen
    .welcome-auth-logo svg{
        width:62px;
        height:58px;
    }

    .vaero-welcome-screen
    .welcome-auth-heading{
        margin:
            0
            0
            22px;
    }

    .vaero-welcome-screen
    .welcome-auth-heading span{
        letter-spacing:.025em;
    }

    .vaero-welcome-screen
    .welcome-auth-form{
        gap:10px;
    }

    .vaero-welcome-screen
    .welcome-input-wrap,
    .vaero-welcome-screen
    .welcome-primary,
    .vaero-welcome-screen
    .welcome-secondary{
        height:42px;
    }

    .vaero-welcome-screen
    .welcome-forgot-password{
        margin-top:1px;
        margin-bottom:3px;
    }

    .vaero-welcome-screen
    .welcome-divider{
        margin:
            15px
            0;
    }

    .vaero-welcome-screen
    .welcome-learn-more{
        position:absolute;

        right:36px;
        bottom:25px;
        left:36px;

        margin:0;
        padding:0;
    }

}

/* ==========================================================
   07. MOBILE
   ========================================================== */

@media (max-width:768px){

    .vaero-welcome-screen{
        width:100%;
        height:100dvh;

        min-height:0;

        overflow:hidden;
    }


    /* ------------------------------------------------------
       MOBILE OVERLAY
       ------------------------------------------------------ */

    .vaero-welcome-screen::after{
        content:"";

        position:absolute;

        inset:0;

        z-index:1;

        pointer-events:none;

        background:
            linear-gradient(
                180deg,
                rgba(1,5,11,.18) 0%,
                rgba(1,5,11,.025) 34%,
                rgba(1,5,11,.48) 72%,
                rgba(1,5,11,.92) 100%
            );
    }


    /* ------------------------------------------------------
       MOBILE SCENE
       ------------------------------------------------------ */

    .vaero-welcome-screen
    .welcome-scene{
        position:absolute;

        inset:0;
    }

    .vaero-welcome-screen
    .welcome-scene img{
        width:100%;
        height:100%;

        object-fit:cover;

        object-position:
            center
            center;

        filter:
            brightness(.68)
            saturate(.9);
    }

    .vaero-welcome-screen
    .welcome-stars{
        position:absolute;

        inset:0;

        z-index:1;

        opacity:.2;

        pointer-events:none;
    }


    /* ------------------------------------------------------
       MOBILE ROOT LAYOUT
       ------------------------------------------------------ */

    .vaero-welcome-screen
    .welcome-layout{
        position:relative;

        z-index:2;

        display:block;

        width:100%;
        height:100%;

        min-height:0;

        padding:0;

        overflow:hidden;
    }


    /* ======================================================
       MOBILE LANDING
       ====================================================== */

    .vaero-welcome-screen
    .welcome-left{
        position:relative;

        display:flex;

        flex-direction:column;

        width:100%;
        height:100%;

        min-width:0;
        min-height:0;

        padding:
            calc(
                30px +
                env(
                    safe-area-inset-top,
                    0px
                )
            )
            22px
            calc(
                20px +
                env(
                    safe-area-inset-bottom,
                    0px
                )
            );

        overflow-x:hidden;
        overflow-y:auto;

        overscroll-behavior-y:contain;

        scrollbar-width:none;

        -webkit-overflow-scrolling:touch;
    }

    .vaero-welcome-screen
    .welcome-left::-webkit-scrollbar{
        display:none;
    }


    /* ------------------------------------------------------
       MOBILE BRAND
       ------------------------------------------------------ */

    .vaero-welcome-screen
    .welcome-brand{
        width:max-content;
        max-width:100%;

        margin:
            0
            auto;

        text-align:center;
    }

    .vaero-welcome-screen
    .welcome-brand strong{
        display:block;

        margin:0;

        color:#e1ba72;

        background:none;

        -webkit-background-clip:initial;
        background-clip:initial;

        font-size:31px;
        font-weight:650;

        line-height:1;

        letter-spacing:.25em;
        text-indent:.25em;
    }

    .vaero-welcome-screen
    .welcome-brand span{
        display:block;

        margin-top:9px;

        color:#d3ac67;

        font-size:9px;
        font-weight:600;

        line-height:1;

        letter-spacing:.56em;
        text-indent:.56em;
    }


    /* ------------------------------------------------------
       MOBILE INTRO
       ------------------------------------------------------ */

    .vaero-welcome-screen
    .welcome-intro{
        display:flex;

        flex:
            1
            0
            auto;

        flex-direction:column;

        width:100%;

        min-width:0;

        margin:0;

        padding:0;

        text-align:center;
    }

    .vaero-welcome-screen
    .welcome-intro h1{
        max-width:430px;

        margin:
            70px
            auto
            0;

        color:
            var(--reference-text);

        font-size:
            clamp(
                37px,
                10.5vw,
                48px
            );

        font-weight:650;

        line-height:1.04;

        letter-spacing:-.045em;

        text-wrap:balance;
    }

    .vaero-welcome-screen
    .welcome-intro h1 br{
        display:none;
    }

    .vaero-welcome-screen
    .welcome-intro h1 span{
        display:block;

        margin-top:7px;

        color:#dfb76f;
    }

    .vaero-welcome-screen
    .welcome-description{
        max-width:390px;

        margin:
            25px
            auto
            0;

        color:
            rgba(236,232,223,.72);

        font-size:14px;

        line-height:1.55;
    }


    /* ------------------------------------------------------
       MOBILE FEATURES
       ------------------------------------------------------ */

    .vaero-welcome-screen
    .welcome-features{
        display:grid;

        grid-template-columns:
            repeat(
                3,
                minmax(0,1fr)
            );

        width:
            calc(
                100% + 16px
            );

        margin:
            62px
            -8px
            0;

        gap:0;
    }

    .vaero-welcome-screen
    .welcome-feature{
        display:flex;

        flex-direction:column;

        align-items:center;

        min-width:0;

        padding:
            0
            10px;

        border:0;

        border-right:
            1px solid
            rgba(218,177,103,.17);

        border-radius:0;

        background:none;

        text-align:center;

        backdrop-filter:none;
        -webkit-backdrop-filter:none;
    }

    .vaero-welcome-screen
    .welcome-feature:last-child{
        border-right:0;
    }

    .vaero-welcome-screen
    .welcome-feature-icon{
        display:flex;

        align-items:center;
        justify-content:center;

        width:43px;
        height:43px;

        margin:
            0
            auto
            11px;

        border:0;

        color:
            var(--reference-gold);
    }

    .vaero-welcome-screen
    .welcome-feature-icon svg{
        width:40px;
        height:40px;
    }

    .vaero-welcome-screen
    .welcome-feature strong{
        display:block;

        max-width:100%;

        color:#f3eee5;

        font-size:11px;
        font-weight:600;

        line-height:1.3;

        white-space:nowrap;
    }

    .vaero-welcome-screen
    .welcome-feature p{
        display:block;

        margin:
            7px
            0
            0;

        color:
            rgba(228,224,216,.52);

        font-size:9px;

        line-height:1.42;
    }


    /* ------------------------------------------------------
       MOBILE ACTIONS
       ------------------------------------------------------ */

    .vaero-welcome-screen
    .welcome-mobile-actions{
        display:block;

        width:100%;

        margin-top:auto;

        padding-top:48px;
    }

    .vaero-welcome-screen
    .welcome-mobile-primary,
    .vaero-welcome-screen
    .welcome-mobile-secondary{
        width:100%;
        height:58px;

        min-height:58px;

        margin:0;

        border-radius:16px;

        outline:none;

        font:inherit;

        font-size:17px;
        font-weight:650;

        cursor:pointer;

        -webkit-tap-highlight-color:
            transparent;

        transition:
            transform .18s
            var(--reference-ease),

            border-color .18s ease,

            background .18s ease;
    }

    .vaero-welcome-screen
    .welcome-mobile-primary{
        border:0;

        color:#171108;

        background:
            linear-gradient(
                100deg,
                #cda554,
                #f0d28b,
                #c89442
            );

        box-shadow:
            0
            16px
            36px
            rgba(203,157,72,.17),

            inset
            0
            1px
            0
            rgba(255,255,255,.32);
    }

    .vaero-welcome-screen
    .welcome-mobile-secondary{
        border:
            1px solid
            rgba(215,174,99,.62);

        background:
            rgba(4,8,14,.32);

        color:#f5f1e9;

        backdrop-filter:blur(10px);
        -webkit-backdrop-filter:blur(10px);
    }

    .vaero-welcome-screen
    .welcome-mobile-primary:active,
    .vaero-welcome-screen
    .welcome-mobile-secondary:active{
        transform:
            scale(.985);
    }

    .vaero-welcome-screen
    .welcome-mobile-divider{
        display:grid;

        grid-template-columns:
            1fr
            auto
            1fr;

        align-items:center;

        gap:14px;

        margin:
            18px
            0;
    }

    .vaero-welcome-screen
    .welcome-mobile-divider span{
        height:1px;

        background:
            rgba(255,255,255,.14);
    }

    .vaero-welcome-screen
    .welcome-mobile-divider small{
        color:
            rgba(255,255,255,.45);

        font-size:13px;
    }

    .vaero-welcome-screen
    .welcome-mobile-security{
        display:flex;

        align-items:center;
        justify-content:center;

        gap:8px;

        margin:
            20px
            0
            0;

        color:
            rgba(233,228,218,.55);

        font-size:12px;

        text-align:center;
    }

    .vaero-welcome-screen
    .welcome-copyright{
        display:none;
    }


    /* ------------------------------------------------------
       HIDE AUTH ON INITIAL MOBILE LANDING
       ------------------------------------------------------ */

    .vaero-welcome-screen
    .welcome-right{
        display:none;
    }


    /* ======================================================
       MOBILE AUTH OPEN
       ====================================================== */

    .vaero-welcome-screen.is-mobile-auth-open
    .welcome-left{
        display:none;
    }

    .vaero-welcome-screen.is-mobile-auth-open
    .welcome-right{
        position:relative;

        display:flex;

        align-items:center;
        justify-content:center;

        width:100%;
        height:100%;

        min-width:0;
        min-height:0;

        margin:0;

        padding:
            calc(
                68px +
                env(
                    safe-area-inset-top,
                    0px
                )
            )
            20px
            calc(
                22px +
                env(
                    safe-area-inset-bottom,
                    0px
                )
            );

        overflow-x:hidden;
        overflow-y:auto;

        overscroll-behavior-y:contain;

        scrollbar-width:none;

        -webkit-overflow-scrolling:touch;
    }

    .vaero-welcome-screen.is-mobile-auth-open
    .welcome-right::-webkit-scrollbar{
        display:none;
    }


    /* ------------------------------------------------------
       MOBILE THEME TOGGLE
       ------------------------------------------------------ */

    .vaero-welcome-screen
    .welcome-theme-toggle{
        position:absolute;

        top:
            calc(
                18px +
                env(
                    safe-area-inset-top,
                    0px
                )
            );

        right:20px;

        z-index:4;

        display:flex;

        overflow:hidden;

        padding:3px;

        border:
            1px solid
            rgba(255,255,255,.12);

        border-radius:14px;

        background:
            rgba(5,9,15,.7);

        backdrop-filter:blur(14px);
        -webkit-backdrop-filter:blur(14px);
    }

    .vaero-welcome-screen
    .welcome-theme-toggle button{
        display:flex;

        align-items:center;
        justify-content:center;

        width:34px;
        height:29px;

        margin:0;
        padding:0;

        border:0;

        border-radius:10px;

        background:transparent;

        color:
            rgba(255,255,255,.56);
    }

    .vaero-welcome-screen
    .welcome-theme-toggle button.is-active{
        color:#e0b76e;

        background:
            rgba(219,177,99,.13);
    }


    /* ------------------------------------------------------
       MOBILE AUTH PANEL
       ------------------------------------------------------ */

    .vaero-welcome-screen
    .welcome-auth-panel{
        position:relative;

        display:block;

        width:100%;
        max-width:430px;

        min-height:0;

        margin:0;

        padding:
            31px
            24px
            25px;

        overflow:visible;

        border:
            1px solid
            rgba(255,255,255,.12);

        border-radius:22px;

        background:
            radial-gradient(
                circle at 50% 0%,
                rgba(223,181,106,.03),
                transparent 29%
            ),

            linear-gradient(
                145deg,
                rgba(16,20,28,.93),
                rgba(7,10,16,.9)
            );

        box-shadow:
            0
            26px
            70px
            rgba(0,0,0,.46),

            inset
            0
            1px
            0
            rgba(255,255,255,.022);

        backdrop-filter:
            blur(24px)
            saturate(112%);

        -webkit-backdrop-filter:
            blur(24px)
            saturate(112%);
    }


    /* ------------------------------------------------------
       MOBILE AUTH LOGO
       ------------------------------------------------------ */

    .vaero-welcome-screen
    .welcome-auth-logo{
        display:flex;

        align-items:center;
        justify-content:center;

        width:70px;
        height:64px;

        margin:
            0
            auto
            18px;

        color:
            var(--reference-gold);

        transform:none;
    }

    .vaero-welcome-screen
    .welcome-auth-logo svg{
        display:block;

        width:70px;
        height:64px;
    }


    /* ------------------------------------------------------
       MOBILE AUTH HEADING
       ------------------------------------------------------ */

    .vaero-welcome-screen
    .welcome-auth-heading{
        margin:
            0
            0
            27px;

        text-align:center;
    }

    .vaero-welcome-screen
    .welcome-auth-heading h2{
        margin:0;

        color:#f4f1ea;

        font-size:22px;
        font-weight:500;

        letter-spacing:-.02em;
    }

    .vaero-welcome-screen
    .welcome-auth-heading span{
        display:block;

        margin-top:10px;

        color:
            rgba(232,228,219,.5);

        font-size:13px;

        line-height:1.55;

        letter-spacing:.015em;
    }


    /* ------------------------------------------------------
       MOBILE AUTH FORM
       ------------------------------------------------------ */

    .vaero-welcome-screen
    .welcome-auth-form{
        display:grid;

        gap:15px;
    }

    .vaero-welcome-screen
    .welcome-auth-form label{
        display:grid;

        gap:8px;
    }

    .vaero-welcome-screen
    .welcome-auth-form label > span{
        color:
            rgba(243,239,231,.76);

        font-size:13px;
    }

    .vaero-welcome-screen
    .welcome-input-wrap{
        display:flex;

        align-items:center;

        width:100%;
        height:53px;

        padding:
            0
            15px;

        border:
            1px solid
            rgba(255,255,255,.13);

        border-radius:11px;

        background:
            rgba(255,255,255,.04);
    }

    .vaero-welcome-screen
    .welcome-input-wrap > span{
        display:flex;

        flex:0 0 auto;

        align-items:center;
        justify-content:center;

        width:22px;

        color:
            rgba(255,255,255,.52);
    }

    .vaero-welcome-screen
    .welcome-input-wrap input{
        flex:1;

        width:auto;
        height:100%;

        min-width:0;

        padding:
            0
            10px;

        border:0;

        outline:0;

        background:transparent;

        box-shadow:none;

        color:#f4f1eb;

        font:inherit;

        font-size:16px !important;
    }

    .vaero-welcome-screen
    .welcome-input-wrap input::placeholder{
        color:
            rgba(255,255,255,.32);
    }

    .vaero-welcome-screen
    .welcome-password-toggle{
        flex:0 0 auto;

        padding:6px;

        border:0;

        background:transparent;

        color:#d2aa62;
    }

    .vaero-welcome-screen
    .welcome-forgot-password{
        justify-self:end;

        margin-top:0;

        padding:0;

        border:0;

        background:transparent;

        color:#d2a85e;

        font-size:12px;
    }


    /* ------------------------------------------------------
       MOBILE AUTH BUTTONS
       ------------------------------------------------------ */

    .vaero-welcome-screen
    .welcome-primary,
    .vaero-welcome-screen
    .welcome-secondary{
        width:100%;
        height:53px;

        min-height:53px;

        border-radius:11px;

        font:inherit;

        font-size:15px;
        font-weight:650;
    }

    .vaero-welcome-screen
    .welcome-primary{
        margin-top:2px;

        border:0;

        color:#171108;

        background:
            linear-gradient(
                100deg,
                #cda554,
                #f0d28b,
                #c89442
            );
    }

    .vaero-welcome-screen
    .welcome-divider{
        display:grid;

        grid-template-columns:
            1fr
            auto
            1fr;

        align-items:center;

        gap:13px;

        margin:
            18px
            0;
    }

    .vaero-welcome-screen
    .welcome-divider span{
        height:1px;

        background:
            rgba(255,255,255,.11);
    }

    .vaero-welcome-screen
    .welcome-divider small{
        color:
            rgba(255,255,255,.34);

        font-size:12px;
    }

    .vaero-welcome-screen
    .welcome-secondary{
        border:
            1px solid
            rgba(208,166,92,.42);

        background:
            rgba(255,255,255,.015);

        color:
            rgba(247,242,232,.9);
    }

    .vaero-welcome-screen
    .welcome-learn-more{
        display:flex;

        align-items:center;
        justify-content:center;

        gap:8px;

        margin-top:23px;

        color:#d2aa62;

        font-size:11px;

        text-align:center;

        text-decoration:none;
    }

}


/* ==========================================================
   08. MOBILE SHORT HEIGHT
   ========================================================== */

@media
(
    max-width:768px
)
and
(
    max-height:850px
){

    .vaero-welcome-screen
    .welcome-left{
        padding-top:
            calc(
                22px +
                env(
                    safe-area-inset-top,
                    0px
                )
            );

        padding-bottom:
            calc(
                15px +
                env(
                    safe-area-inset-bottom,
                    0px
                )
            );
    }

    .vaero-welcome-screen
    .welcome-brand strong{
        font-size:27px;
    }

    .vaero-welcome-screen
    .welcome-brand span{
        margin-top:7px;
    }

    .vaero-welcome-screen
    .welcome-intro h1{
        margin-top:46px;

        font-size:
            clamp(
                34px,
                9.5vw,
                42px
            );
    }

    .vaero-welcome-screen
    .welcome-description{
        margin-top:18px;

        font-size:13px;

        line-height:1.45;
    }

    .vaero-welcome-screen
    .welcome-features{
        margin-top:39px;
    }

    .vaero-welcome-screen
    .welcome-feature-icon{
        width:38px;
        height:38px;

        margin-bottom:8px;
    }

    .vaero-welcome-screen
    .welcome-feature-icon svg{
        width:36px;
        height:36px;
    }

    .vaero-welcome-screen
    .welcome-feature p{
        margin-top:5px;

        font-size:8px;
    }

    .vaero-welcome-screen
    .welcome-mobile-actions{
        padding-top:30px;
    }

    .vaero-welcome-screen
    .welcome-mobile-primary,
    .vaero-welcome-screen
    .welcome-mobile-secondary{
        height:52px;
        min-height:52px;

        border-radius:14px;

        font-size:15px;
    }

    .vaero-welcome-screen
    .welcome-mobile-divider{
        margin:
            13px
            0;
    }

    .vaero-welcome-screen
    .welcome-mobile-security{
        margin-top:13px;
    }


    /* AUTH */

    .vaero-welcome-screen.is-mobile-auth-open
    .welcome-right{
        align-items:flex-start;

        padding-top:
            calc(
                60px +
                env(
                    safe-area-inset-top,
                    0px
                )
            );
    }

    .vaero-welcome-screen
    .welcome-auth-panel{
        padding:
            24px
            22px
            22px;
    }

    .vaero-welcome-screen
    .welcome-auth-logo{
        width:58px;
        height:53px;

        margin-bottom:11px;
    }

    .vaero-welcome-screen
    .welcome-auth-logo svg{
        width:58px;
        height:53px;
    }

    .vaero-welcome-screen
    .welcome-auth-heading{
        margin-bottom:20px;
    }

    .vaero-welcome-screen
    .welcome-auth-heading span{
        margin-top:7px;

        font-size:11px;
    }

    .vaero-welcome-screen
    .welcome-auth-form{
        gap:11px;
    }

    .vaero-welcome-screen
    .welcome-input-wrap,
    .vaero-welcome-screen
    .welcome-primary,
    .vaero-welcome-screen
    .welcome-secondary{
        height:48px;
        min-height:48px;
    }

    .vaero-welcome-screen
    .welcome-divider{
        margin:
            13px
            0;
    }

    .vaero-welcome-screen
    .welcome-learn-more{
        margin-top:16px;
    }

}


/* ==========================================================
   09. SMALL MOBILE
   ========================================================== */

@media (max-width:390px){

    .vaero-welcome-screen
    .welcome-left{
        padding-left:17px;
        padding-right:17px;
    }

    .vaero-welcome-screen
    .welcome-brand strong{
        font-size:25px;
    }

    .vaero-welcome-screen
    .welcome-brand span{
        font-size:7px;

        letter-spacing:.49em;
        text-indent:.49em;
    }

    .vaero-welcome-screen
    .welcome-intro h1{
        font-size:
            clamp(
                31px,
                9.7vw,
                39px
            );
    }

    .vaero-welcome-screen
    .welcome-features{
        width:
            calc(
                100% + 10px
            );

        margin-left:-5px;
        margin-right:-5px;
    }

    .vaero-welcome-screen
    .welcome-feature{
        padding:
            0
            7px;
    }

    .vaero-welcome-screen
    .welcome-feature strong{
        font-size:10px;
    }

    .vaero-welcome-screen
    .welcome-mobile-primary,
    .vaero-welcome-screen
    .welcome-mobile-secondary{
        font-size:14px;
    }

}


/* ==========================================================
   10. TOUCH DEVICES
   ========================================================== */

@media (hover:none){

    .vaero-welcome-screen
    .welcome-feature:hover
    .welcome-feature-icon{
        color:
            var(--reference-gold);

        transform:none;

        filter:none;
    }

    .vaero-welcome-screen
    .welcome-mobile-back:hover{
        transform:none;

        background:
            rgba(6,10,17,.55);
    }

}


/* ==========================================================
   11. REDUCED MOTION
   ========================================================== */

@media (prefers-reduced-motion:reduce){

    .vaero-welcome-screen
    .welcome-feature-icon,
    .vaero-welcome-screen
    .welcome-mobile-primary,
    .vaero-welcome-screen
    .welcome-mobile-secondary,
    .vaero-welcome-screen
    .welcome-mobile-back{
        transition:none;
    }

}


/* ==========================================================
   12. FINAL REFERENCE SAFETY
   ========================================================== */

.vaero-welcome-screen
.welcome-feature,
.vaero-welcome-screen
.welcome-auth-panel,
.vaero-welcome-screen
.welcome-input-wrap,
.vaero-welcome-screen
.welcome-mobile-actions{
    min-width:0;
}

.vaero-welcome-screen
.welcome-feature p,
.vaero-welcome-screen
.welcome-description,
.vaero-welcome-screen
.welcome-auth-heading span{
    overflow-wrap:break-word;
}


/* ==========================================================
   END — VAERO WELCOME REFERENCE
   ========================================================== */