#winnerToastStack{
    position:fixed;
    top:18px;
    right:18px;
    bottom:auto;
    z-index:80;
    width:min(288px,calc(100vw - 28px));
    display:flex;
    flex-direction:column;
    gap:8px;
    pointer-events:none;
}

.winner-toast-card{
    width:100%;
    background:#101725;
    border:1px solid #64748b;
    border-left:4px solid var(--green);
    border-radius:13px;
    padding:10px;
    box-shadow:0 14px 38px #000b;
    display:grid;
    grid-template-columns:46px 1fr;
    gap:10px;
    align-items:center;
    opacity:0;
    transform:translateY(-10px) scale(.98);
}

.winner-toast-card.show{animation:winnerToastFadeIn .18s ease-out forwards}
.winner-toast-card.hiding{animation:winnerToastFadeOut .28s ease-in forwards}

.winner-toast-avatar{
    width:46px;
    height:46px;
    border-radius:50%;
    overflow:hidden;
    background:#243044;
    border:2px solid var(--yellow);
    display:grid;
    place-items:center;
    color:var(--yellow);
    font-size:19px;
    font-weight:1000;
}

.winner-toast-avatar img{width:100%;height:100%;object-fit:cover}
.winner-toast-label{font-size:8px;font-weight:1000;letter-spacing:.08em;color:#a5b4fc;text-transform:uppercase}
.winner-toast-name{font-size:14px;font-weight:1000;color:#fff;margin-top:2px}
.winner-toast-card-name{font-size:10px;color:#cbd5e1;margin-top:2px;line-height:1.25}

@keyframes winnerToastFadeIn{
    from{opacity:0;transform:translateY(-10px) scale(.98)}
    to{opacity:1;transform:translateY(0) scale(1)}
}

@keyframes winnerToastFadeOut{
    from{opacity:1;transform:translateY(0) scale(1)}
    to{opacity:0;transform:translateY(-8px) scale(.98)}
}

/* Conserva los avisos internos, pero no los muestra a usuarios normales. */
body.user-only-layout .toast{
    display:none!important;
}

@media (max-width:700px){
    #winnerToastStack{
        top:10px;
        right:10px;
        width:min(250px,calc(100vw - 20px));
        gap:6px;
    }
}
