:root{
    --dss-bg-main:#061426;
    --dss-bg-soft:#0b2340;
    --dss-bg-glow:#123d6b;

    --dss-card-bg:rgba(255,255,255,0.10);
    --dss-card-border:rgba(255,255,255,0.18);

    --dss-text-main:#f4f7fb;
    --dss-text-muted:#aeb8c6;

    --dss-accent:#3ba7ff;
    --dss-accent-soft:#7cc7ff;

    --dss-danger:#7b1e26;
    --dss-success:#2e7d32;

    --dss-radius-card:26px;
    --dss-radius-button:16px;

    --dss-shadow-card:0 18px 45px rgba(0,0,0,0.35);
    --dss-shadow-soft:0 8px 22px rgba(0,0,0,0.22);
}

/* BASIS */
html,body{
    margin:0;
    padding:0;
    min-min-height:100dvh;
    background:
        radial-gradient(circle at 50% 18%, rgba(59,167,255,0.22), transparent 32%),
        radial-gradient(circle at 85% 90%, rgba(18,61,107,0.45), transparent 35%),
        linear-gradient(145deg, var(--dss-bg-main), var(--dss-bg-soft));
    color:var(--dss-text-main);
    font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
}

/* APP WRAPPER */
.dss-theme{
    min-min-height:100dvh;
    color:var(--dss-text-main);
}

/* CARDS */
.dss-card{
    background:var(--dss-card-bg);
    border:1px solid var(--dss-card-border);
    border-radius:var(--dss-radius-card);
    box-shadow:var(--dss-shadow-card);
    backdrop-filter:blur(16px);
}

/* BUTTONS */
.dss-btn{
    border:none;
    border-radius:var(--dss-radius-button);
    background:linear-gradient(135deg, var(--dss-accent), #1e6fb8);
    color:white;
    font-weight:900;
    box-shadow:var(--dss-shadow-soft);
}

/* INPUTS */
.dss-input{
    background:rgba(255,255,255,0.13);
    border:1px solid rgba(255,255,255,0.22);
    color:var(--dss-text-main);
    border-radius:18px;
}

.dss-input::placeholder{
    color:rgba(244,247,251,0.58);
}

/* LOGIN DSS THEME FIX */
body.dss-theme{
    background:
        radial-gradient(circle at 50% 18%, rgba(59,167,255,0.28), transparent 34%),
        radial-gradient(circle at 85% 90%, rgba(18,61,107,0.55), transparent 38%),
        linear-gradient(145deg, #061426, #0b2340) !important;
}

.login-card-container.dss-card{
    background:
        linear-gradient(rgba(5,14,28,0.35), rgba(5,14,28,0.48)),
        url('/static/img/uploads/team_logo.png') center/cover no-repeat !important;

    border:1px solid rgba(255,255,255,0.22) !important;
    box-shadow:0 22px 55px rgba(0,0,0,0.42) !important;
    backdrop-filter:blur(10px);
}

.login-card-container.dss-card *{
    position:relative;
    z-index:2;
}

.login-card-container.dss-card::before{
    content:"";
    position:absolute;
    inset:0;
    border-radius:35px;
    background:rgba(255,255,255,0.10);
    z-index:1;
    pointer-events:none;
}

.login-card-container{
    position:relative;
    overflow-x:hidden;
}

.kachel-input.dss-input{
    background:rgba(255,255,255,0.88) !important;
    color:#111 !important;
}

.kachel-input.dss-input::placeholder{
    color:#555 !important;
}


/* LOGIN LAYOUT FIX */
body.dss-theme{
    display:flex;
    justify-content:center;
    align-items:center;
    min-min-height:100dvh;
    overflow-x:hidden;
}

.login-wrapper,
.login-container{
    width:100%;
    display:flex;
    justify-content:center;
    align-items:center;
    padding:24px;
    box-sizing:border-box;
}

.login-card-container{
    width:100%;
    max-width:430px;
    margin:auto;
}


/* LOGIN FOOTER FIX */
.crafted-by,
.footer-text,
.login-footer{
    width:100%;
    text-align:center !important;
    margin-top:18px;
    color:rgba(255,255,255,0.72);
    font-size:13px;
}


/* LOGIN CREDIT */
.login-credit{
    width:100%;
    text-align:center;
    margin-top:18px;
    color:rgba(255,255,255,0.70);
    font-size:13px;
    font-weight:700;
}


/* LOGIN FINAL CENTER FIX */
body.dss-theme{
    display:flex !important;
    flex-direction:column !important;
    justify-content:center !important;
    align-items:center !important;
    min-height:100dvh !important;
    width:100% !important;
}

.login-card-container{
    margin:0 auto !important;
}

.login-credit{
    display:block !important;
    width:100% !important;
    text-align:center !important;
    margin:16px auto 0 auto !important;
}



/* =========================================================
   DSS LOGIN GLASS / METALLIC THEME
   ========================================================= */

body.dss-theme{
    display:flex !important;
    flex-direction:column !important;
    justify-content:center !important;
    align-items:center !important;
    min-height:100dvh !important;
    width:100% !important;
    overflow-x:hidden !important;

    background:
        radial-gradient(circle at 50% 10%, rgba(70,160,255,0.30), transparent 34%),
        radial-gradient(circle at 50% 45%, rgba(30,95,160,0.34), transparent 42%),
        linear-gradient(145deg, #030b16 0%, #071a31 45%, #0b2848 100%) !important;
}

/* Login-Kachel */
.login-card-container.dss-card,
.login-card-container{
    position:relative !important;
    overflow-x:hidden !important;

    width:88% !important;
    max-width:420px !important;
    margin:0 auto !important;
    padding:38px 26px 32px 26px !important;

    border-radius:32px !important;

    background:
        linear-gradient(rgba(7,22,42,0.48), rgba(4,14,28,0.66)),
        url('/static/img/uploads/team_logo.png') center/cover no-repeat !important;

    border:1px solid rgba(116,185,255,0.55) !important;
    box-shadow:
        0 24px 70px rgba(0,0,0,0.55),
        inset 0 1px 0 rgba(255,255,255,0.22),
        inset 0 -1px 0 rgba(0,0,0,0.35) !important;

    backdrop-filter:blur(16px) saturate(130%) !important;
}

/* blauer Glasfilm über dem Mannschaftslogo */
.login-card-container::before{
    content:"";
    position:absolute;
    inset:0;
    z-index:1;
    pointer-events:none;

    background:
        linear-gradient(135deg, rgba(58,155,255,0.25), rgba(4,18,38,0.54)),
        radial-gradient(circle at 50% 0%, rgba(120,205,255,0.22), transparent 35%);
}

/* Spiegelkante oben */
.login-card-container::after{
    content:"";
    position:absolute;
    left:10%;
    right:10%;
    top:0;
    height:2px;
    z-index:3;
    pointer-events:none;

    background:linear-gradient(
        90deg,
        transparent,
        rgba(135,215,255,0.95),
        transparent
    );

    box-shadow:
        0 0 18px rgba(80,180,255,0.95),
        0 0 38px rgba(80,180,255,0.45);
}

.login-card-container > *{
    position:relative;
    z-index:4;
}

/* Eingabefelder */
.login-card-container .kachel-input,
.login-card-container .dss-input{
    width:100% !important;
    box-sizing:border-box !important;

    padding:15px 18px !important;
    margin-bottom:15px !important;

    border-radius:18px !important;
    border:1px solid rgba(130,200,255,0.45) !important;

    background:rgba(255,255,255,0.16) !important;
    color:#f4f7fb !important;

    box-shadow:
        inset 0 1px 0 rgba(255,255,255,0.20),
        0 8px 18px rgba(0,0,0,0.18) !important;

    backdrop-filter:blur(10px) !important;
}

.login-card-container .kachel-input::placeholder{
    color:rgba(244,247,251,0.70) !important;
}

/* Login Button Bild-Button sauber halten */
.login-btn,
button.login-btn,
button[type="submit"]{
    background:transparent !important;
    border:none !important;
    box-shadow:none !important;
    padding:0 !important;
    margin:18px auto 6px auto !important;
    display:block !important;
    cursor:pointer;
}

.login-btn img,
button[type="submit"] img{
    display:block !important;
    width:82px !important;
    height:auto !important;
    margin:0 auto !important;
    filter:drop-shadow(0 10px 16px rgba(0,0,0,0.35));
}

/* LOGIN Text unter Button */
.login-card-container button + div,
.login-card-container .login-label{
    color:#f4f7fb !important;
    font-weight:900 !important;
    text-shadow:0 2px 8px rgba(0,0,0,0.55);
}

/* Registrieren Link */
.login-card-container a{
    color:rgba(244,247,251,0.78) !important;
    text-shadow:0 2px 8px rgba(0,0,0,0.55);
}

.login-card-container a b,
.login-card-container a strong,
.login-card-container a span,
.login-card-container a[href="/register"]{
    color:#6fc1ff !important;
}

/* Credit */
.login-credit{
    display:block !important;
    width:100% !important;
    text-align:center !important;
    margin:18px auto 0 auto !important;
    color:rgba(244,247,251,0.70) !important;
    font-size:13px !important;
    font-weight:800 !important;
    text-shadow:0 2px 8px rgba(0,0,0,0.55);
}

/* Mobile Feinjustierung */
@media (max-width:420px){
    .login-card-container{
        width:90% !important;
        padding:34px 22px 30px 22px !important;
        border-radius:30px !important;
    }

    .login-btn img,
    button[type="submit"] img{
        width:76px !important;
    }
}


/* FORCE LOGIN GLASS STYLE */
#login-card.login-card-container.dss-card{
    background:
        linear-gradient(rgba(7,22,42,0.38), rgba(4,14,28,0.62)),
        radial-gradient(circle at 50% 0%, rgba(90,185,255,0.28), transparent 42%),
        url('/static/img/uploads/team_logo.png') center/cover no-repeat !important;

    border:1px solid rgba(120,200,255,0.58) !important;
    box-shadow:
        0 24px 70px rgba(0,0,0,0.55),
        inset 0 1px 0 rgba(255,255,255,0.28),
        inset 0 -1px 0 rgba(0,0,0,0.35),
        0 0 35px rgba(55,155,255,0.20) !important;

    backdrop-filter:blur(16px) saturate(135%) !important;
}

#login-card.login-card-container.dss-card::before{
    content:"";
    position:absolute;
    inset:0;
    z-index:1;
    pointer-events:none;
    border-radius:inherit;

    background:
        linear-gradient(135deg, rgba(60,160,255,0.32), rgba(5,18,38,0.54)),
        radial-gradient(circle at 50% 0%, rgba(135,215,255,0.24), transparent 38%) !important;
}

#login-card.login-card-container.dss-card::after{
    content:"";
    position:absolute;
    left:10%;
    right:10%;
    top:0;
    height:2px;
    z-index:3;
    pointer-events:none;

    background:linear-gradient(90deg, transparent, rgba(145,220,255,0.95), transparent) !important;
    box-shadow:0 0 18px rgba(90,190,255,0.95) !important;
}

#login-card.login-card-container.dss-card > *{
    position:relative;
    z-index:4;
}



/* =========================================================
   DSS LOGIN - FINAL GLASS METALLIC
   ========================================================= */

html,
body.dss-login-page{
    margin:0 !important;
    padding:0 !important;
    width:100% !important;
    min-height:100dvh !important;
    overflow-x:hidden !important;
}

body.dss-login-page{
    display:flex !important;
    flex-direction:column !important;
    align-items:center !important;
    justify-content:center !important;

    background:
        radial-gradient(circle at 50% 10%, rgba(55,150,255,0.34), transparent 34%),
        radial-gradient(circle at 50% 48%, rgba(28,90,165,0.28), transparent 44%),
        linear-gradient(145deg, #020914 0%, #06182e 45%, #0b2a4d 100%) !important;

    color:#f4f7fb !important;
    font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif !important;
}

/* Splash direkt im DSS Look */
#splash-screen{
    position:fixed;
    inset:0;
    z-index:9999;
    display:flex;
    align-items:center;
    justify-content:center;
    background:
        radial-gradient(circle at 50% 10%, rgba(55,150,255,0.34), transparent 34%),
        linear-gradient(145deg, #020914 0%, #06182e 45%, #0b2a4d 100%) !important;
    transition:opacity .6s ease-in-out;
}

/* Login Card */
#login-card,
.dss-login-card{
    position:relative !important;
    overflow-x:hidden !important;

    width:88% !important;
    max-width:430px !important;
    min-height:360px !important;

    padding:38px 26px 34px 26px !important;
    margin:0 auto !important;

    border-radius:32px !important;
    border:1px solid rgba(110,195,255,0.62) !important;

    background:
        linear-gradient(rgba(4,15,31,0.58), rgba(2,10,23,0.78)),
        url('/static/img/uploads/team_logo.png') center/cover no-repeat !important;

    box-shadow:
        0 28px 80px rgba(0,0,0,0.62),
        0 0 44px rgba(45,145,255,0.28),
        inset 0 1px 0 rgba(255,255,255,0.24),
        inset 0 -1px 0 rgba(0,0,0,0.45) !important;

    backdrop-filter:blur(18px) saturate(145%) !important;
}

/* dunkler Glasfilm */
#login-card::before,
.dss-login-card::before{
    content:"";
    position:absolute;
    inset:0;
    z-index:1;
    pointer-events:none;
    border-radius:inherit;

    background:
        linear-gradient(135deg, rgba(45,145,255,0.20), rgba(2,8,20,0.72)),
        radial-gradient(circle at 50% 0%, rgba(125,215,255,0.24), transparent 38%) !important;
}

/* Spiegelkante */
#login-card::after,
.dss-login-card::after{
    content:"";
    position:absolute;
    left:9%;
    right:9%;
    top:0;
    height:2px;
    z-index:3;
    pointer-events:none;

    background:linear-gradient(90deg, transparent, rgba(140,220,255,1), transparent) !important;
    box-shadow:
        0 0 18px rgba(80,185,255,1),
        0 0 46px rgba(80,185,255,0.55) !important;
}

#login-card > *,
.dss-login-card > *{
    position:relative;
    z-index:4;
}

/* Inputs */
#login-card input,
.dss-login-card input,
#login-card .kachel-input,
.dss-login-card .kachel-input{
    width:100% !important;
    box-sizing:border-box !important;

    padding:15px 18px !important;
    margin-bottom:15px !important;

    border-radius:18px !important;
    border:1px solid rgba(125,200,255,0.55) !important;

    background:rgba(255,255,255,0.13) !important;
    color:#f4f7fb !important;

    box-shadow:
        inset 0 1px 0 rgba(255,255,255,0.22),
        0 10px 20px rgba(0,0,0,0.24) !important;

    backdrop-filter:blur(12px) !important;
}

#login-card input::placeholder,
.dss-login-card input::placeholder{
    color:rgba(244,247,251,0.74) !important;
}

/* Button / Login Bild */
#login-card button,
.dss-login-card button{
    background:transparent !important;
    border:none !important;
    box-shadow:none !important;
    outline:none !important;
    padding:0 !important;
    margin:20px auto 6px auto !important;
    display:block !important;
    cursor:pointer !important;
}

#login-card button img,
.dss-login-card button img,
.login-icon-btn{
    width:82px !important;
    height:auto !important;
    display:block !important;
    margin:0 auto !important;
    filter:
        drop-shadow(0 14px 18px rgba(0,0,0,0.45))
        drop-shadow(0 0 12px rgba(70,170,255,0.28)) !important;
}

/* Login Text */
#login-card button + div,
.dss-login-card button + div{
    color:#ffffff !important;
    font-size:18px !important;
    font-weight:900 !important;
    letter-spacing:.5px;
    text-shadow:0 3px 12px rgba(0,0,0,0.7);
}

/* Register Link */
#login-card a,
.dss-login-card a{
    color:rgba(244,247,251,0.78) !important;
    text-decoration:none !important;
    font-weight:900 !important;
    text-shadow:0 3px 12px rgba(0,0,0,0.7);
}

#login-card a[href="/register"],
.dss-login-card a[href="/register"]{
    color:#6fc1ff !important;
}

/* Credit */
.login-credit{
    width:100% !important;
    text-align:center !important;
    margin:18px auto 0 auto !important;
    color:rgba(244,247,251,0.70) !important;
    font-size:13px !important;
    font-weight:800 !important;
    text-shadow:0 3px 12px rgba(0,0,0,0.7);
}

/* Mobile */
@media (max-width:430px){
    #login-card,
    .dss-login-card{
        width:90% !important;
        max-width:360px !important;
        min-height:330px !important;
        padding:34px 22px 30px 22px !important;
        border-radius:30px !important;
    }

    #login-card button img,
    .dss-login-card button img,
    .login-icon-btn{
        width:76px !important;
    }
}

/* SPLASH LOGO FIX */
#splash-screen img{
    width:150px !important;
    height:150px !important;
    max-width:45vw !important;
    max-height:45vw !important;
    object-fit:cover !important;
    border-radius:50% !important;
    box-shadow:
        0 18px 45px rgba(0,0,0,0.45),
        0 0 35px rgba(70,170,255,0.35) !important;
}

@media (max-width:430px){
    #splash-screen img{
        width:135px !important;
        height:135px !important;
    }
}


/* =========================================================
   DSS LOGIN PREMIUM TUNING
   ========================================================= */

/* Splash größer */
#splash-screen img{
    width:230px !important;
    height:230px !important;
    max-width:62vw !important;
    max-height:62vw !important;

    border-radius:50% !important;

    box-shadow:
        0 25px 70px rgba(0,0,0,0.58),
        0 0 55px rgba(65,165,255,0.42) !important;
}

/* Card dunkler + echter Glass Look */
#login-card,
.dss-login-card{
    background:
        linear-gradient(rgba(3,10,20,0.72), rgba(2,8,18,0.82)),
        url('/static/img/uploads/team_logo.png') center/cover no-repeat !important;

    border:1px solid rgba(120,205,255,0.72) !important;

    box-shadow:
        0 30px 90px rgba(0,0,0,0.72),
        0 0 55px rgba(40,140,255,0.32),
        inset 0 1px 0 rgba(255,255,255,0.22),
        inset 0 -1px 0 rgba(0,0,0,0.55) !important;
}

/* stärkerer Metallic Film */
#login-card::before,
.dss-login-card::before{
    background:
        linear-gradient(
            145deg,
            rgba(55,150,255,0.24),
            rgba(3,10,22,0.82)
        ),
        radial-gradient(
            circle at 50% 0%,
            rgba(135,220,255,0.32),
            transparent 42%
        ) !important;
}

/* stärkerer Glow oben */
#login-card::after,
.dss-login-card::after{
    height:3px !important;

    background:
        linear-gradient(
            90deg,
            transparent,
            rgba(165,235,255,1),
            transparent
        ) !important;

    box-shadow:
        0 0 22px rgba(85,190,255,1),
        0 0 60px rgba(85,190,255,0.72) !important;
}

/* Inputs echter Glaslook */
#login-card input,
.dss-login-card input{
    background:rgba(255,255,255,0.09) !important;

    border:1px solid rgba(130,210,255,0.52) !important;

    box-shadow:
        inset 0 1px 0 rgba(255,255,255,0.18),
        0 12px 28px rgba(0,0,0,0.34),
        0 0 16px rgba(55,150,255,0.12) !important;

    color:#f8fbff !important;
}

/* Login Button Glow */
#login-card button img,
.dss-login-card button img{
    filter:
        drop-shadow(0 16px 24px rgba(0,0,0,0.52))
        drop-shadow(0 0 18px rgba(70,170,255,0.45)) !important;
}

/* Register heller */
#login-card a[href="/register"],
.dss-login-card a[href="/register"]{
    color:#78cfff !important;
    text-shadow:
        0 0 12px rgba(70,170,255,0.45) !important;
}



/* =========================================================
   DSS EXACT NEON LOGIN
   ========================================================= */

html,
body.dss-login-page{
    margin:0 !important;
    padding:0 !important;
    width:100% !important;
    min-height:100dvh !important;
    overflow-x:hidden !important;
}

body.dss-login-page{
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;

    background:
        radial-gradient(circle at 50% 0%, rgba(0,105,255,0.55), transparent 35%),
        radial-gradient(circle at 50% 42%, rgba(0,70,170,0.28), transparent 42%),
        linear-gradient(145deg, #020715 0%, #061426 48%, #020711 100%) !important;

    color:#f4f8ff !important;
    font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif !important;
}

/* Splash */
#splash-screen{
    position:fixed;
    inset:0;
    z-index:9999;

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

    background:
        radial-gradient(circle at 50% 0%, rgba(0,105,255,0.55), transparent 35%),
        linear-gradient(145deg, #020715 0%, #061426 48%, #020711 100%) !important;

    transition:opacity .65s ease;
}

#splash-screen img{
    width:230px !important;
    height:230px !important;
    max-width:62vw !important;
    max-height:62vw !important;
    object-fit:cover !important;
    border-radius:50% !important;

    box-shadow:
        0 30px 90px rgba(0,0,0,0.65),
        0 0 70px rgba(0,160,255,0.55) !important;
}

/* Wrapper */
.dss-login-wrap{
    width:100%;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    padding:24px;
    box-sizing:border-box;
}

/* Main Card */
.dss-login-card{
    position:relative;
    width:88%;
    max-width:720px;
    min-height:455px;

    padding:58px 58px 42px 58px;
    box-sizing:border-box;

    border-radius:34px;
    overflow-x:hidden;

    background:
        linear-gradient(rgba(0,16,42,0.72), rgba(0,8,24,0.88)),
        url('/static/img/uploads/team_logo.png') center/cover no-repeat;

    border:2px solid rgba(0,170,255,0.88);

    box-shadow:
        0 0 0 1px rgba(105,210,255,0.25),
        0 0 38px rgba(0,155,255,0.68),
        0 0 90px rgba(0,95,255,0.38),
        0 35px 110px rgba(0,0,0,0.72),
        inset 0 1px 0 rgba(255,255,255,0.20),
        inset 0 -1px 0 rgba(0,0,0,0.60);

    opacity:0;
    transform:translateY(8px) scale(.98);
    transition:opacity .5s ease, transform .5s ease;
}

.dss-login-card.show{
    opacity:1;
    transform:translateY(0) scale(1);
}

/* Dark blue glass overlay */
.dss-login-card::before{
    content:"";
    position:absolute;
    inset:0;
    z-index:1;
    pointer-events:none;

    background:
        linear-gradient(135deg, rgba(0,95,210,0.28), rgba(0,6,20,0.82)),
        radial-gradient(circle at 50% 0%, rgba(90,210,255,0.22), transparent 38%);
}

/* Top mirror light */
.dss-login-card::after{
    content:"";
    position:absolute;
    left:8%;
    right:8%;
    top:0;
    height:3px;
    z-index:3;
    pointer-events:none;

    background:linear-gradient(90deg, transparent, rgba(145,240,255,1), transparent);

    box-shadow:
        0 0 24px rgba(0,190,255,1),
        0 0 75px rgba(0,150,255,0.9);
}

.dss-login-card > *{
    position:relative;
    z-index:4;
}

/* Form */
.dss-login-form{
    display:flex;
    flex-direction:column;
    align-items:center;
    width:100%;
}

/* Input rows */
.dss-login-input-row{
    width:100%;
    height:74px;
    margin-bottom:28px;

    display:flex;
    align-items:center;
    gap:18px;

    padding:0 30px;
    box-sizing:border-box;

    border-radius:24px;
    border:1.5px solid rgba(75,190,255,0.92);

    background:rgba(8,42,92,0.42);

    box-shadow:
        0 0 18px rgba(0,145,255,0.26),
        inset 0 1px 0 rgba(255,255,255,0.18),
        inset 0 -1px 0 rgba(0,0,0,0.38);

    backdrop-filter:blur(18px) saturate(150%);
}

.dss-login-input-row input{
    flex:1;
    width:100%;
    border:none;
    outline:none;
    background:transparent;
    color:#eaf5ff;

    font-size:25px;
    font-weight:600;
}

.dss-login-input-row input::placeholder{
    color:rgba(230,242,255,0.62);
}

.dss-login-icon,
.dss-login-eye{
    color:rgba(235,248,255,0.92);
    font-size:34px;
    line-height:1;
    text-shadow:
        0 0 12px rgba(90,190,255,0.75),
        0 2px 8px rgba(0,0,0,0.65);
}

.dss-login-eye{
    cursor:pointer;
}

/* Main Login Button */
.dss-login-main-btn{
    width:148px;
    height:148px;

    margin:36px auto 22px auto;

    border:none;
    border-radius:22px;

    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    gap:10px;

    color:white;
    font-size:25px;
    font-weight:700;
    letter-spacing:.5px;

    background:
        radial-gradient(circle at 50% 0%, rgba(130,230,255,0.50), transparent 38%),
        linear-gradient(145deg, rgba(20,105,190,0.88), rgba(0,16,45,0.96));

    border:1.5px solid rgba(90,215,255,0.95);

    box-shadow:
        0 0 26px rgba(0,175,255,0.85),
        0 0 65px rgba(0,120,255,0.50),
        0 20px 45px rgba(0,0,0,0.50),
        inset 0 1px 0 rgba(255,255,255,0.30),
        inset 0 -1px 0 rgba(0,0,0,0.55);

    cursor:pointer;
}

.dss-lock{
    font-size:36px;
    line-height:1;
    text-shadow:0 0 18px rgba(160,230,255,0.85);
}

/* Text */
.dss-login-label{
    color:#ffffff;
    font-size:26px;
    font-weight:800;
    letter-spacing:.7px;
    text-shadow:0 4px 16px rgba(0,0,0,0.8);
}

.dss-register-link{
    display:block;
    margin-top:38px;

    text-align:center;
    text-decoration:none;

    color:rgba(226,238,255,0.72);
    font-size:23px;
    font-weight:800;

    text-shadow:0 4px 16px rgba(0,0,0,0.8);
}

.dss-register-link span{
    color:#09a7ff;
    text-shadow:
        0 0 16px rgba(0,165,255,0.72),
        0 4px 16px rgba(0,0,0,0.8);
}

.login-credit{
    width:100%;
    margin-top:28px;

    text-align:center;

    color:rgba(225,236,255,0.58);
    font-size:19px;
    font-weight:800;

    text-shadow:0 4px 16px rgba(0,0,0,0.85);
}

/* Mobile */
@media (max-width:520px){
    .dss-login-card{
        width:92%;
        max-width:390px;
        min-height:430px;
        padding:38px 24px 34px 24px;
        border-radius:30px;
    }

    .dss-login-input-row{
        height:58px;
        padding:0 18px;
        gap:12px;
        margin-bottom:18px;
        border-radius:18px;
    }

    .dss-login-input-row input{
        font-size:17px;
    }

    .dss-login-icon,
    .dss-login-eye{
        font-size:24px;
    }

    .dss-login-main-btn{
        width:112px;
        height:112px;
        margin:28px auto 18px auto;
        font-size:19px;
    }

    .dss-lock{
        font-size:27px;
    }

    .dss-login-label{
        font-size:22px;
    }

    .dss-register-link{
        margin-top:28px;
        font-size:18px;
    }

    .login-credit{
        font-size:14px;
        margin-top:20px;
    }
}

@media (max-height:720px){
    .dss-login-card{
        min-height:auto;
        padding-top:30px;
        padding-bottom:28px;
    }

    .dss-login-main-btn{
        margin-top:18px;
    }

    .dss-register-link{
        margin-top:22px;
    }
}

/* DSS LOGIN BLUE BACKGROUND RESTORE */
html,
body.dss-login-page,
body:has(.login-screen){
    min-height:100dvh !important;
    background:
        radial-gradient(circle at top, rgba(0,183,255,.22), transparent 34%),
        radial-gradient(circle at bottom, rgba(0,70,160,.14), transparent 42%),
        linear-gradient(145deg,#02050a,#06111f 48%,#02050a) !important;
}

body.dss-login-page{
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    overflow:hidden !important;
}

.login-screen{
    background:transparent !important;
}

/* DSS ADMIN BOTTOM BAR FINAL FIX */
/* DSS GLOBAL BOTTOM BAR FIX ADMIN PAGES */
.dss-bottom-nav{
    position:fixed !important;
    left:50% !important;
    bottom:calc(10px + env(safe-area-inset-bottom)) !important;
    transform:translateX(-50%) !important;
    z-index:999999 !important;

    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    gap:10px !important;

    width:auto !important;
    max-width:calc(100vw - 28px) !important;

    padding:10px 14px !important;
    border-radius:999px !important;

    background:
        radial-gradient(circle at top,rgba(0,190,255,.22),transparent 48%),
        linear-gradient(145deg,rgba(5,24,48,.96),rgba(2,10,24,.96)) !important;

    border:1px solid rgba(0,174,255,.45) !important;

    box-shadow:
        0 0 24px rgba(0,160,255,.34),
        inset 0 0 16px rgba(255,255,255,.045) !important;

    backdrop-filter:blur(16px) !important;
    -webkit-backdrop-filter:blur(16px) !important;
}

.dss-bottom-nav a,
.dss-bottom-nav-item{
    min-width:74px !important;
    min-height:44px !important;

    display:inline-flex !important;
    flex-direction:column !important;
    align-items:center !important;
    justify-content:center !important;
    gap:3px !important;

    color:#e9fbff !important;
    text-decoration:none !important;

    font-size:11px !important;
    font-weight:900 !important;
    line-height:1 !important;
    white-space:nowrap !important;

    padding:7px 10px !important;
    border-radius:999px !important;

    background:rgba(255,255,255,.045) !important;
    border:1px solid rgba(120,215,255,.18) !important;

    text-shadow:0 0 9px rgba(0,190,255,.55) !important;
}

.dss-nav-icon{
    font-size:17px !important;
    line-height:1 !important;
}


/* =========================================
   DSS GLOBAL BOTTOM BAR FINAL ALL PAGES
========================================= */

.dss-bottom-nav{
    position:fixed !important;
    left:50% !important;
    bottom:calc(10px + env(safe-area-inset-bottom)) !important;
    transform:translateX(-50%) !important;
    z-index:999999 !important;

    display:flex !important;
    align-items:center !important;
    justify-content:space-around !important;
    gap:8px !important;

    width:calc(100% - 24px) !important;
    max-width:560px !important;
    box-sizing:border-box !important;

    padding:8px 12px !important;
    border-radius:999px !important;

    background:
        radial-gradient(circle at top,rgba(0,190,255,.22),transparent 48%),
        linear-gradient(145deg,rgba(5,24,48,.96),rgba(2,10,24,.96)) !important;

    border:1px solid rgba(0,174,255,.45) !important;

    box-shadow:
        0 0 24px rgba(0,160,255,.34),
        inset 0 0 16px rgba(255,255,255,.045) !important;

    backdrop-filter:blur(16px) !important;
    -webkit-backdrop-filter:blur(16px) !important;

    overflow:hidden !important;
}

.dss-bottom-nav a,
.dss-bottom-nav-item{
    flex:1 1 0 !important;
    min-width:0 !important;
    max-width:150px !important;
    min-height:44px !important;

    display:inline-flex !important;
    flex-direction:column !important;
    align-items:center !important;
    justify-content:center !important;
    gap:3px !important;

    padding:7px 10px !important;
    box-sizing:border-box !important;

    border-radius:999px !important;

    color:#e9fbff !important;
    text-decoration:none !important;
    text-align:center !important;

    font-size:11px !important;
    font-weight:900 !important;
    line-height:1 !important;
    white-space:nowrap !important;

    background:rgba(255,255,255,.045) !important;
    border:1px solid rgba(120,215,255,.18) !important;

    text-shadow:0 0 9px rgba(0,190,255,.55) !important;
}

.dss-nav-icon{
    font-size:17px !important;
    line-height:1 !important;
}

body{
    padding-bottom:92px !important;
}

@media(max-width:600px){
    .dss-bottom-nav{
        width:calc(100% - 20px) !important;
        max-width:560px !important;
        gap:6px !important;
        padding:8px 10px !important;
    }

    .dss-bottom-nav a,
    .dss-bottom-nav-item{
        font-size:10px !important;
        padding:7px 6px !important;
    }
}


/* =========================================
   DSS SAFE AREA ÜBER BOTTOM BAR
========================================= */

body,
.main-content,
.dashboard-container,
.content-wrapper,
.page-wrapper{
    padding-bottom:140px !important;
}

/* Handy extra Luft */
@media (max-width: 768px){

    body,
    .main-content,
    .dashboard-container,
    .content-wrapper,
    .page-wrapper{
        padding-bottom:165px !important;
    }

}

/* Pyramidenspiel Match-Start Button */
.pyramid-card form[action*="/pyramid/challenge/"] .pyramid-btn{
    color:#ffffff !important;
}

/* Matchscreen Scrollbars ausblenden */
html,
body,
.game-container,
.match-container,
.score-container,
.app-container,
.content{
    scrollbar-width:none !important;
}

html::-webkit-scrollbar,
body::-webkit-scrollbar,
.game-container::-webkit-scrollbar,
.match-container::-webkit-scrollbar,
.score-container::-webkit-scrollbar,
.app-container::-webkit-scrollbar,
.content::-webkit-scrollbar{
    display:none !important;
}