/*
 Sitiincontri.info - correzioni grafiche v0.7.8.
 Caricato DOPO gli altri fogli di stile. Nessuna modifica ai dati.
*/


/* HOME: l'H1 resta nel DOM ed e' accessibile ma non occupa spazio visivo. */
.home-intro h1 {
    position:absolute!important;
    width:1px!important;
    height:1px!important;
    padding:0!important;
    margin:-1px!important;
    overflow:hidden!important;
    clip:rect(0,0,0,0)!important;
    clip-path:inset(50%)!important;
    white-space:nowrap!important;
    border:0!important;
}
body .home-intro {
    padding:0!important;
    margin:0!important;
    border:0!important;
    background:transparent!important;
    min-height:0!important;
    height:0!important;
    overflow:visible!important;
}


/* CLASSIFICA GENERALE: serie di 10 simboli piu' piccola e leggibile. */
.ranking-card .rank-main .rating-ten {
    --rating-size:23px;
    max-width:100%;
    margin:6px 0 10px;
    line-height:1.35;
}
.ranking-card .rank-main .rating-ten-scale {
    display:block;
    width:calc(var(--rating-size) * 10);
    max-width:100%;
    height:auto;
    aspect-ratio:10;
}
.ranking-card .rank-main .rating-ten-caption {
    font-size:12px;
    line-height:1.4;
    margin-top:5px;
}
.ranking-card .rank-main {min-width:0;}
.ranking-card .rank-score {font-size:36px;}


/* CLASSIFICA DEGLI UTENTI: icone, valori e testo separati e senza sovrapporsi. */
.side-card.user-ranking,
.side-card.user-ranking ol,
.side-card.user-ranking li {
    min-width:0;
}
.side-card.user-ranking ol {
    margin-top:10px;
    padding-left:1.4em;
}
.side-card.user-ranking li {
    padding:11px 0 13px 2px;
}
.side-card.user-ranking .user-ranking-link {
    display:flex;
    width:100%;
    min-width:0;
    justify-content:space-between;
    align-items:center;
    flex-wrap:wrap;
    column-gap:6px;
    row-gap:3px;
    padding:0;
    font-size:13px;
    line-height:1.35;
}
.side-card.user-ranking .user-ranking-link span {
    min-width:0;
    overflow-wrap:anywhere;
}
.side-card.user-ranking .user-ranking-link strong {
    flex:0 0 auto;
    margin-left:auto;
    font-size:16px;
    line-height:1.3;
    white-space:nowrap;
}
.side-card.user-ranking .user-ranking-link strong small {
    font-size:9px;
}
.side-card.user-ranking .user-ranking-logo {
    width:36px;
    height:36px;
    flex-basis:36px;
    object-fit:contain;
    transform:none;
}
.side-card.user-ranking .rating-ten {
    --rating-size:18px;
    width:100%;
    max-width:100%;
    margin:5px 0 2px;
    line-height:1.3;
}
.side-card.user-ranking .rating-ten-scale {
    width:calc(var(--rating-size) * 10);
    max-width:100%;
    height:auto;
    aspect-ratio:10;
    overflow:hidden;
}
.side-card.user-ranking .rating-ten-caption {
    margin-top:4px;
    font-size:11px;
    line-height:1.35;
    overflow-wrap:break-word;
}
.side-card.user-ranking .user-ranking-voters {
    margin-top:3px;
    font-size:11px;
    line-height:1.35;
}


/* TABLET E MOBILE: anche sotto i 700px la fila di simboli rimane compatta. */
@media (max-width:1100px) {
    .ranking-card .rank-main .rating-ten {--rating-size:21px;}
    .side-card.user-ranking .rating-ten {--rating-size:18px;}
}
@media (max-width:700px) {
    .ranking-card .rank-main .rating-ten {
        --rating-size:20px;
        margin:7px 0 6px;
    }
    .ranking-card .rank-score {font-size:31px;}
    .side-card.user-ranking .rating-ten {--rating-size:18px;}
}
@media (max-width:360px) {
    .ranking-card .rank-main .rating-ten {--rating-size:18px;}
    .side-card.user-ranking .rating-ten {--rating-size:16px;}
}
