.stats-container{
width:420px;
background:#252a38;
padding:24px;
border-radius:12px;
box-shadow:0 12px 35px rgba(0,0,0,0.45);
}

/* CONTROLS */

.controls{
display:flex;
align-items:center;
gap:20px;
margin-bottom:18px;
}

/* CUSTOM DROPDOWN */

.level-dropdown{
position:relative;
width:120px;
}

.dropdown-selected{
background:#404658;
padding:10px 14px;
border-radius:999px;
cursor:pointer;
font-weight:600;
box-shadow:
        0 8px 30px rgba(0, 0, 0, 0.30);
}

.dropdown-menu{
position:absolute;
top:110%;
left:0;
width:100%;
background:rgba(20, 20, 30, 0.50);
backdrop-filter: blur(14px);
border-radius:16px;
padding:0 6px;

box-shadow:0 10px 25px rgba(0,0,0,0.4);

/* animation */
max-height:0;
overflow-y:auto;
opacity:0;

transition:max-height 0.35s ease, opacity 0.25s ease;

/* maximum size */
max-height:0;
}

/* open state */

.dropdown-menu.open{
max-height:260px; /* menu can grow bigger */
opacity:1;
padding:6px;
}

.dropdown-item{
padding:10px 12px;
border-radius:10px;
cursor:pointer;
transition:0.2s;
transform:translateY(-4px);
opacity:0;
}

.dropdown-menu.open .dropdown-item{
transform:translateY(0);
opacity:1;
}

.dropdown-item:hover{
background:rgba(69, 85, 128, 0.5);
}

/* TOGGLE */

.ascension-toggle{
display:flex;
align-items:center;
gap:10px;
cursor:pointer;
}

.ascension-toggle input{
display:none;
}

.toggle{
width:46px;
height:24px;
background:#555;
border-radius:20px;
position:relative;
transition:0.3s;
}

.toggle::before{
content:"";
position:absolute;
width:20px;
height:20px;
left:2px;
top:2px;
background:white;
border-radius:50%;
transition:0.3s;
}

.ascension-toggle input:checked + .toggle{
background:linear-gradient(90deg, #abb1ff, #d4a5ff, #ffaac6, #ffccc0);
}

.ascension-toggle input:checked + .toggle::before{
transform:translateX(22px);
}

.ascension-toggle input:disabled + .toggle{
opacity:0.35;
}

/* STATS */

.stats-box{
background:rgba(20, 20, 30, 0.50);
border: 1px solid rgba(255, 255, 255, 0.08);
padding:16px;
border-radius:10px;
}

.stat-row{
display:flex;
justify-content:space-between;
padding:12px 8px;
border-bottom:1px solid rgba(255,255,255,0.05);
}

.stat-row:last-child{
border:none;
}

.stat-row span:last-child{
font-weight:700;
}

.dropdown-menu::-webkit-scrollbar{
width:6px;
}

.dropdown-menu::-webkit-scrollbar-thumb{
background:linear-gradient(180deg, #abb1ff, #d4a5ff, #ffaac6, #ffccc0);
border-radius:10px;
}