/* /Components/Layout/ReconnectModal.razor.rz.scp.css */
.components-reconnect-first-attempt-visible[b-ub2xkyxywr],
.components-reconnect-repeated-attempt-visible[b-ub2xkyxywr],
.components-reconnect-failed-visible[b-ub2xkyxywr],
.components-pause-visible[b-ub2xkyxywr],
.components-resume-failed-visible[b-ub2xkyxywr],
.components-rejoining-animation[b-ub2xkyxywr] {
    display: none;
}

#components-reconnect-modal.components-reconnect-show .components-reconnect-first-attempt-visible[b-ub2xkyxywr],
#components-reconnect-modal.components-reconnect-show .components-rejoining-animation[b-ub2xkyxywr],
#components-reconnect-modal.components-reconnect-paused .components-pause-visible[b-ub2xkyxywr],
#components-reconnect-modal.components-reconnect-resume-failed .components-resume-failed-visible[b-ub2xkyxywr],
#components-reconnect-modal.components-reconnect-retrying[b-ub2xkyxywr],
#components-reconnect-modal.components-reconnect-retrying .components-reconnect-repeated-attempt-visible[b-ub2xkyxywr],
#components-reconnect-modal.components-reconnect-retrying .components-rejoining-animation[b-ub2xkyxywr],
#components-reconnect-modal.components-reconnect-failed[b-ub2xkyxywr],
#components-reconnect-modal.components-reconnect-failed .components-reconnect-failed-visible[b-ub2xkyxywr] {
    display: block;
}


#components-reconnect-modal[b-ub2xkyxywr] {
    background-color: white;
    width: 20rem;
    margin: 20vh auto;
    padding: 2rem;
    border: 0;
    border-radius: 0.5rem;
    box-shadow: 0 3px 6px 2px rgba(0, 0, 0, 0.3);
    opacity: 0;
    transition: display 0.5s allow-discrete, overlay 0.5s allow-discrete;
    animation: components-reconnect-modal-fadeOutOpacity-b-ub2xkyxywr 0.5s both;
    &[open]

{
    animation: components-reconnect-modal-slideUp-b-ub2xkyxywr 1.5s cubic-bezier(.05, .89, .25, 1.02) 0.3s, components-reconnect-modal-fadeInOpacity-b-ub2xkyxywr 0.5s ease-in-out 0.3s;
    animation-fill-mode: both;
}

}

#components-reconnect-modal[b-ub2xkyxywr]::backdrop {
    background-color: rgba(0, 0, 0, 0.4);
    animation: components-reconnect-modal-fadeInOpacity-b-ub2xkyxywr 0.5s ease-in-out;
    opacity: 1;
}

@keyframes components-reconnect-modal-slideUp-b-ub2xkyxywr {
    0% {
        transform: translateY(30px) scale(0.95);
    }

    100% {
        transform: translateY(0);
    }
}

@keyframes components-reconnect-modal-fadeInOpacity-b-ub2xkyxywr {
    0% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
}

@keyframes components-reconnect-modal-fadeOutOpacity-b-ub2xkyxywr {
    0% {
        opacity: 1;
    }

    100% {
        opacity: 0;
    }
}

.components-reconnect-container[b-ub2xkyxywr] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 1rem;
}

#components-reconnect-modal p[b-ub2xkyxywr] {
    margin: 0;
    text-align: center;
}

#components-reconnect-modal button[b-ub2xkyxywr] {
    border: 0;
    background-color: #6b9ed2;
    color: white;
    padding: 4px 24px;
    border-radius: 4px;
}

    #components-reconnect-modal button:hover[b-ub2xkyxywr] {
        background-color: #3b6ea2;
    }

    #components-reconnect-modal button:active[b-ub2xkyxywr] {
        background-color: #6b9ed2;
    }

.components-rejoining-animation[b-ub2xkyxywr] {
    position: relative;
    width: 80px;
    height: 80px;
}

    .components-rejoining-animation div[b-ub2xkyxywr] {
        position: absolute;
        border: 3px solid #0087ff;
        opacity: 1;
        border-radius: 50%;
        animation: components-rejoining-animation-b-ub2xkyxywr 1.5s cubic-bezier(0, 0.2, 0.8, 1) infinite;
    }

        .components-rejoining-animation div:nth-child(2)[b-ub2xkyxywr] {
            animation-delay: -0.5s;
        }

@keyframes components-rejoining-animation-b-ub2xkyxywr {
    0% {
        top: 40px;
        left: 40px;
        width: 0;
        height: 0;
        opacity: 0;
    }

    4.9% {
        top: 40px;
        left: 40px;
        width: 0;
        height: 0;
        opacity: 0;
    }

    5% {
        top: 40px;
        left: 40px;
        width: 0;
        height: 0;
        opacity: 1;
    }

    100% {
        top: 0px;
        left: 0px;
        width: 80px;
        height: 80px;
        opacity: 0;
    }
}
/* /Components/Pages/Admin.razor.rz.scp.css */
.admin[b-oq3y0rrn5t] {
    min-height: 100vh;
    background: #120a24;
    color: #e8e2f4;
    font-family: system-ui, sans-serif;
}

/* ---- barra superiore ---- */
.topbar[b-oq3y0rrn5t] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: .8rem 1.4rem;
    background: #1d1238;
    border-bottom: 1px solid #34245c;
    position: sticky;
    top: 0;
    z-index: 10;
}
.brand[b-oq3y0rrn5t] { font-weight: 800; font-size: 1.1rem; }
.brand span[b-oq3y0rrn5t] { color: #ffd23f; }
.topbar-right[b-oq3y0rrn5t] { display: flex; align-items: center; gap: 1rem; }
.status[b-oq3y0rrn5t] {
    padding: .25rem .8rem;
    border-radius: 999px;
    font-size: .85rem;
    font-weight: 700;
}
.status-idle[b-oq3y0rrn5t] { background: #34245c; color: #cdb6f0; }
.status-playing[b-oq3y0rrn5t] { background: #14532d; color: #7dffb0; }
.status-solved[b-oq3y0rrn5t] { background: #713f12; color: #ffd23f; }
.link-display[b-oq3y0rrn5t] { color: #9fd2ff; text-decoration: none; font-size: .9rem; }
.link-display:hover[b-oq3y0rrn5t] { text-decoration: underline; }

/* ---- griglia pannelli ---- */
.grid[b-oq3y0rrn5t] {
    display: grid;
    grid-template-columns: minmax(330px, 420px) 1fr;
    gap: 1.2rem;
    padding: 1.2rem;
    align-items: start;
}
@media (max-width: 980px) {
    .grid[b-oq3y0rrn5t] { grid-template-columns: 1fr; }
}
.panel[b-oq3y0rrn5t] {
    background: #1d1238;
    border: 1px solid #34245c;
    border-radius: 14px;
    padding: 1.2rem;
}
.panel h2[b-oq3y0rrn5t] {
    font-size: 1rem;
    text-transform: uppercase;
    letter-spacing: .08em;
    color: #cdb6f0;
    margin: 0 0 1rem;
}
.panel h2.mt[b-oq3y0rrn5t] { margin-top: 1.6rem; }
.mt-small[b-oq3y0rrn5t] { margin-top: .6rem; }

/* ---- campi ---- */
.field[b-oq3y0rrn5t] { margin-bottom: .9rem; }
.field > label[b-oq3y0rrn5t] { display: block; font-size: .9rem; margin-bottom: .3rem; color: #b9a6da; }
.field label input[type="checkbox"][b-oq3y0rrn5t] { margin-right: .4rem; }
.field input[type="number"][b-oq3y0rrn5t], .field input[type="text"][b-oq3y0rrn5t], .field select[b-oq3y0rrn5t], .field textarea[b-oq3y0rrn5t] {
    width: 100%;
    background: #120a24;
    color: #fff;
    border: 1px solid #43306e;
    border-radius: 8px;
    padding: .45rem .6rem;
    font-size: 1rem;
}
.radio-row[b-oq3y0rrn5t] { display: flex; gap: 1.2rem; flex-wrap: wrap; }
.radio-row label[b-oq3y0rrn5t] { font-size: .95rem; }
.radio-row input[b-oq3y0rrn5t] { margin-right: .3rem; }
fieldset[b-oq3y0rrn5t] { border: 0; padding: 0; margin: 0; }
fieldset:disabled[b-oq3y0rrn5t] { opacity: .55; }

.themes-list[b-oq3y0rrn5t] {
    max-height: 240px;
    overflow-y: auto;
    border: 1px solid #34245c;
    border-radius: 8px;
    padding: .4rem;
    display: flex;
    flex-direction: column;
    gap: .15rem;
}
.theme-item[b-oq3y0rrn5t] {
    display: flex;
    align-items: center;
    gap: .5rem;
    padding: .3rem .5rem;
    border-radius: 6px;
    cursor: pointer;
}
.theme-item:hover[b-oq3y0rrn5t] { background: #2a1b4d; }
.theme-name[b-oq3y0rrn5t] { flex: 1; }
.theme-count[b-oq3y0rrn5t] { color: #8d76b8; font-size: .85rem; }

.words-info[b-oq3y0rrn5t] { color: #9fd2ff; font-size: .9rem; margin-top: .6rem; }
.msg[b-oq3y0rrn5t] { color: #ffd23f; font-size: .9rem; }

/* ---- controllo frasi (validazione lunghezza) ---- */
.validation[b-oq3y0rrn5t] { display: flex; gap: .6rem; flex-wrap: wrap; margin-top: .6rem; }
.vbadge[b-oq3y0rrn5t] { padding: .2rem .7rem; border-radius: 999px; font-size: .85rem; font-weight: 700; }
.vbadge.ok[b-oq3y0rrn5t] { background: #14532d; color: #7dffb0; }
.vbadge.warn[b-oq3y0rrn5t] { background: #5b1a1a; color: #ff9d9d; }
.vall-ok[b-oq3y0rrn5t] { color: #7dffb0; font-size: .85rem; align-self: center; }
.oversize-list[b-oq3y0rrn5t] { margin-top: .5rem; font-size: .88rem; }
.oversize-list summary[b-oq3y0rrn5t] { cursor: pointer; color: #ff9d9d; font-weight: 700; }
.oversize-list ul[b-oq3y0rrn5t] { margin: .5rem 0 0; padding-left: 1.1rem; max-height: 200px; overflow-y: auto; }
.oversize-list li[b-oq3y0rrn5t] { margin-bottom: .2rem; color: #e8e2f4; }
.ov-cat[b-oq3y0rrn5t] { color: #ffd23f; font-weight: 700; margin-right: .3rem; }
.ov-lines[b-oq3y0rrn5t] { color: #8d76b8; font-size: .8rem; }

/* ---- bottoni ---- */
.btn[b-oq3y0rrn5t] {
    border: 0;
    border-radius: 10px;
    padding: .6rem 1.1rem;
    font-size: 1rem;
    font-weight: 700;
    cursor: pointer;
    color: #fff;
    background: #43306e;
}
.btn:hover[b-oq3y0rrn5t] { filter: brightness(1.15); }
.btn:disabled[b-oq3y0rrn5t] { opacity: .4; cursor: not-allowed; }
.btn-apply[b-oq3y0rrn5t] { background: #2563eb; }
.btn-sec[b-oq3y0rrn5t] { background: #43306e; }
.btn-start[b-oq3y0rrn5t] { background: #16a34a; font-size: 1.1rem; }
.btn-next[b-oq3y0rrn5t] { background: #2563eb; }
.btn-solve[b-oq3y0rrn5t] { background: #ca8a04; }
.btn-reset[b-oq3y0rrn5t] { background: #7f1d1d; }

.controls-main[b-oq3y0rrn5t] { display: flex; gap: .7rem; flex-wrap: wrap; margin-bottom: 1rem; }

/* ---- concorrenti (accanto alla tastiera) ---- */
.players-title[b-oq3y0rrn5t] {
    display: flex;
    align-items: center;
    gap: .8rem;
    font-size: 1rem;
    text-transform: uppercase;
    letter-spacing: .08em;
    color: #cdb6f0;
    margin: 1.4rem 0 .6rem;
    flex-wrap: wrap;
}
.players-count[b-oq3y0rrn5t] { display: flex; align-items: center; gap: .35rem; text-transform: none; font-size: .9rem; }
.players-count input[b-oq3y0rrn5t] {
    width: 56px;
    background: #120a24;
    color: #fff;
    border: 1px solid #43306e;
    border-radius: 6px;
    padding: .25rem .4rem;
}
.btn-mini[b-oq3y0rrn5t] {
    background: #43306e;
    color: #fff;
    border: 0;
    border-radius: 6px;
    padding: .3rem .6rem;
    font-size: .8rem;
    font-weight: 700;
    cursor: pointer;
    text-transform: none;
}
.btn-mini:hover[b-oq3y0rrn5t] { filter: brightness(1.2); }
.players-grid[b-oq3y0rrn5t] { display: flex; flex-direction: column; gap: .25rem; }
.player-row.off[b-oq3y0rrn5t] { opacity: .5; }
.player-row.off .player-name-input[b-oq3y0rrn5t] { text-decoration: line-through; }
.btn-toggle[b-oq3y0rrn5t] {
    background: #5b1a1a;
    color: #ff9d9d;
    border: 0;
    border-radius: 6px;
    padding: .3rem .55rem;
    font-size: .8rem;
    font-weight: 700;
    cursor: pointer;
    white-space: nowrap;
}
.btn-toggle.off[b-oq3y0rrn5t] { background: #14532d; color: #7dffb0; }
.btn-toggle:hover[b-oq3y0rrn5t] { filter: brightness(1.2); }
.player-row[b-oq3y0rrn5t] {
    display: flex;
    align-items: center;
    gap: .5rem;
    padding: .4rem;
    border-radius: 8px;
    margin-bottom: .3rem;
    border: 1px solid transparent;
    flex-wrap: wrap;
}
.player-row.active[b-oq3y0rrn5t] { border-color: #ffd23f; background: rgba(255,210,63,.07); }
.btn-turn[b-oq3y0rrn5t] {
    background: transparent;
    border: 0;
    font-size: 1.1rem;
    cursor: pointer;
    color: #ffd23f;
}
.player-name-input[b-oq3y0rrn5t] {
    flex: 1;
    min-width: 110px;
    background: #120a24;
    color: #fff;
    border: 1px solid #43306e;
    border-radius: 6px;
    padding: .3rem .5rem;
}
.player-score-view[b-oq3y0rrn5t] { font-weight: 800; color: #ffd23f; min-width: 70px; text-align: right; }
.score-btns[b-oq3y0rrn5t] { display: flex; gap: .25rem; flex-wrap: wrap; }
.score-btns button[b-oq3y0rrn5t] {
    background: #14532d;
    color: #7dffb0;
    border: 0;
    border-radius: 6px;
    padding: .2rem .45rem;
    font-size: .8rem;
    font-weight: 700;
    cursor: pointer;
}
.score-btns button.neg[b-oq3y0rrn5t] { background: #5b1a1a; color: #ff9d9d; }
.score-btns button:hover[b-oq3y0rrn5t] { filter: brightness(1.2); }

/* ---- partita ---- */
.puzzle-head[b-oq3y0rrn5t] {
    display: flex;
    align-items: center;
    gap: 1rem;
    flex-wrap: wrap;
    margin-bottom: .8rem;
}
.puzzle-progress[b-oq3y0rrn5t] { color: #8d76b8; font-weight: 700; }
.puzzle-cat[b-oq3y0rrn5t] { color: #ffd23f; font-weight: 800; letter-spacing: .05em; }
.solved-tag[b-oq3y0rrn5t] { color: #7dffb0; font-weight: 800; }
.remaining-tag[b-oq3y0rrn5t] { color: #9fd2ff; font-size: .9rem; }

/* ---- mini tabellone (regia) ---- */
.mini-board[b-oq3y0rrn5t] {
    display: flex;
    flex-direction: column;
    gap: 4px;
    padding: 10px;
    background: #120a24;
    border: 2px solid #43306e;
    border-radius: 10px;
    width: fit-content;
    max-width: 100%;
    overflow-x: auto;
    margin-bottom: 1.2rem;
}
.mini-row[b-oq3y0rrn5t] { display: flex; gap: 4px; }
.mcell[b-oq3y0rrn5t] {
    width: 34px;
    height: 42px;
    border-radius: 4px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.25rem;
    font-weight: 800;
    font-family: Georgia, serif;
    flex-shrink: 0;
}
.mcell.outside[b-oq3y0rrn5t] { background: transparent; }
.mcell.empty[b-oq3y0rrn5t] { background: #0a5436; }
.mcell.on[b-oq3y0rrn5t] { background: #e8ecf4; color: #101a33; }
.mcell.on.flash[b-oq3y0rrn5t] { background: #ffd23f; color: #221500; }
.mcell.off[b-oq3y0rrn5t] { background: #2a1b4d; color: #8d76b8; border: 1px dashed #43306e; }

/* ---- tastiera ---- */
.kb-label[b-oq3y0rrn5t] { font-weight: 700; margin-bottom: .4rem; color: #cdb6f0; }
.kb-sub[b-oq3y0rrn5t] { font-weight: 400; color: #8d76b8; font-size: .85rem; }
.keyboard[b-oq3y0rrn5t] { display: flex; gap: .35rem; flex-wrap: wrap; margin-bottom: .5rem; }
.key[b-oq3y0rrn5t] {
    width: 46px;
    height: 50px;
    border: 0;
    border-radius: 8px;
    background: #34245c;
    color: #fff;
    font-size: 1.25rem;
    font-weight: 800;
    cursor: pointer;
}
.key:hover:not(:disabled)[b-oq3y0rrn5t] { background: #4a347e; }
.key.vowel[b-oq3y0rrn5t] { background: #1e3a5f; }
.key.vowel:hover:not(:disabled)[b-oq3y0rrn5t] { background: #2a4f80; }
.key.found[b-oq3y0rrn5t] { background: #14532d; color: #7dffb0; }
.key.miss[b-oq3y0rrn5t] { background: #5b1a1a; color: #ff9d9d; text-decoration: line-through; }
.key:disabled[b-oq3y0rrn5t] { cursor: not-allowed; opacity: .8; }
.key:disabled:not(.found):not(.miss)[b-oq3y0rrn5t] { opacity: .35; }

.call-result[b-oq3y0rrn5t] {
    margin-top: .6rem;
    padding: .5rem .9rem;
    border-radius: 8px;
    font-size: .95rem;
    width: fit-content;
}
.call-result.good[b-oq3y0rrn5t] { background: rgba(76,212,176,.15); color: #7dffd9; }
.call-result.bad[b-oq3y0rrn5t] { background: rgba(255,93,93,.12); color: #ff9d9d; }
.call-result b[b-oq3y0rrn5t] { font-size: 1.1rem; }

.idle-msg[b-oq3y0rrn5t] { color: #8d76b8; font-size: 1.1rem; padding: 2rem 0; text-align: center; }
.actions-hint[b-oq3y0rrn5t] { color: #8d76b8; font-size: .85rem; padding: .3rem; }
/* /Components/Pages/Display.razor.rz.scp.css */
.display[b-h7q8yldykh] {
    position: fixed;
    inset: 0;
    display: flex;
    flex-direction: column;
    font-family: system-ui, sans-serif;
    color: #fff;
    background: radial-gradient(circle at 50% 35%, #3d1860 0%, #0d0520 75%);
    overflow: hidden;
    transition: background .25s;
}
.display.is-solved[b-h7q8yldykh] { background: radial-gradient(circle at 50% 40%, #1d6e3a 0%, #06200f 80%); }

/* ---- lettere omaggio (angolo in alto a sinistra) ---- */
.gift-corner[b-h7q8yldykh] {
    position: fixed;
    top: 1.5vh;
    left: 1vw;
    z-index: 5;
    background: rgba(255,255,255,.07);
    border: 1px solid rgba(255,210,63,.4);
    border-radius: .6vw;
    padding: .8vh .8vw;
    text-align: center;
}
.gift-label[b-h7q8yldykh] {
    font-size: min(.9vw, 1.6vh);
    letter-spacing: .15em;
    color: #ffd23f;
    font-weight: 700;
    margin-bottom: .4vh;
}
.gift-letters[b-h7q8yldykh] { display: flex; gap: .3vw; justify-content: center; }
.gift-letter[b-h7q8yldykh] {
    width: min(1.9vw, 3.4vh);
    height: min(1.9vw, 3.4vh);
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(255,210,63,.18);
    border-radius: .25vw;
    font-size: min(1.2vw, 2.2vh);
    font-weight: 800;
    color: #ffe784;
}

/* ---- fascia categoria ---- */
.category-band[b-h7q8yldykh] {
    flex-shrink: 0;
    text-align: center;
    padding: min(1.6vh, 1vw) 4vw;
    font-size: min(3.4vw, 6vh);
    line-height: 1.15;
    font-weight: 800;
    letter-spacing: .4vw;
    color: #ffd23f;
    text-shadow: 0 0.3vw 1.5vw rgba(0,0,0,.6);
}

/* ---- palco centrale ---- */
.stage[b-h7q8yldykh] {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: min(2.5vh, 1.6vw);
    padding: 1vh 3vw;
    min-height: 0;
}

/* ---- tabellone ----
   La dimensione delle celle scala con larghezza, altezza, numero di COLONNE
   (--cols) e numero di RIGHE (--rows) del tabellone corrente, così non esce
   mai dal proprio spazio nemmeno con layout larghi (es. righe da 26 celle). */
.board[b-h7q8yldykh] {
    --cols: 14;
    --rows: 4;
    /* Larghezza tabellone ≈ cella·(1.105·cols + 0.6) per via di gap/padding/bordo;
       altezza ≈ cella·(1.34·rows + 0.5). I divisori tengono conto di questo. */
    --cell: min(
        9vh,                                       /* tetto: celle non troppo grandi */
        calc(92vw / (var(--cols) * 1.15)),         /* sta in larghezza (gap inclusi) */
        calc(85vh / (var(--rows) * 1.4))           /* sta in altezza (gap inclusi) */
    );
    display: flex;
    flex-direction: column;
    gap: calc(var(--cell) * .105);
    padding: calc(var(--cell) * .23);
    background: #1a0b33;
    border: calc(var(--cell) * .065) solid #6c43a8;
    border-radius: calc(var(--cell) * .19);
    box-shadow: 0 1vh 4vh rgba(0,0,0,.6), inset 0 0 2vh rgba(108,67,168,.35);
    flex-shrink: 0;
}
.board-row[b-h7q8yldykh] { display: flex; gap: calc(var(--cell) * .105); }

.cell[b-h7q8yldykh] {
    width: var(--cell);
    height: calc(var(--cell) * 1.23);
    border-radius: calc(var(--cell) * .07);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: calc(var(--cell) * .8);
    font-weight: 900;
    font-family: Georgia, 'Times New Roman', serif;
    line-height: 1;
    user-select: none;
}
.cell.outside[b-h7q8yldykh] { background: transparent; }
.cell.empty[b-h7q8yldykh] {
    background: linear-gradient(180deg, #0f7a4d 0%, #0a5436 100%);
    box-shadow: inset 0 0 .8vh rgba(0,0,0,.4);
}
.cell.letter.hidden[b-h7q8yldykh] {
    background: linear-gradient(180deg, #ffffff 0%, #d8dde8 100%);
    box-shadow: inset 0 -0.4vh 0 rgba(0,0,0,.12);
}
.cell.letter.revealed[b-h7q8yldykh],
.cell.punct[b-h7q8yldykh] {
    background: linear-gradient(180deg, #ffffff 0%, #e8ecf4 100%);
    color: #101a33;
    box-shadow: inset 0 -0.4vh 0 rgba(0,0,0,.12);
    animation: turn-b-h7q8yldykh .35s ease-out;
}
.cell.letter.revealed.flash[b-h7q8yldykh] {
    background: linear-gradient(180deg, #ffe784 0%, #ffd23f 100%);
    color: #221500;
    box-shadow: 0 0 1.6vh rgba(255,210,63,.85);
}
@keyframes turn-b-h7q8yldykh {
    from { transform: rotateY(90deg); }
    to   { transform: rotateY(0deg); }
}

/* ---- messaggi ---- */
.solved-banner[b-h7q8yldykh] {
    font-size: min(5.5vw, 8vh);
    font-weight: 900;
    letter-spacing: .8vw;
    color: #7dffb0;
    text-shadow: 0 0 3vh rgba(125,255,176,.6);
    animation: pop-b-h7q8yldykh .3s ease-out;
    flex-shrink: 0;
}
@keyframes pop-b-h7q8yldykh { from { transform: scale(.85); opacity: 0; } to { transform: scale(1); opacity: 1; } }

.big-msg[b-h7q8yldykh] { font-size: 9vw; font-weight: 900; letter-spacing: 1vw; }
.big-msg.dim[b-h7q8yldykh] { color: #6e5a9c; }

/* ---- lettere chiamate ---- */
.called-strip[b-h7q8yldykh] {
    display: flex;
    gap: min(.6vw, 1vh);
    flex-wrap: wrap;
    justify-content: center;
    flex-shrink: 0;
    max-width: 90vw;
}
.called[b-h7q8yldykh] {
    width: min(2.8vw, 4.5vh);
    height: min(2.8vw, 4.5vh);
    min-width: 26px;
    min-height: 26px;
    border-radius: .4vh;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: min(1.6vw, 2.6vh);
    font-weight: 800;
}
.called.found[b-h7q8yldykh] { background: rgba(76,212,176,.25); color: #7dffd9; border: 1px solid rgba(76,212,176,.5); }
.called.miss[b-h7q8yldykh] { background: rgba(255,93,93,.18); color: #ff9d9d; border: 1px solid rgba(255,93,93,.4); text-decoration: line-through; }

/* ---- punteggi ---- */
.scores[b-h7q8yldykh] {
    flex-shrink: 0;
    display: flex;
    justify-content: center;
    gap: min(2vw, 3vh);
    padding: min(1.6vh, 1vw) 3vw min(2.4vh, 1.4vw);
}
.player[b-h7q8yldykh] {
    min-width: min(16vw, 30vh);
    text-align: center;
    padding: min(1vh, .6vw) 2vw;
    border-radius: min(1vw, 1.8vh);
    background: rgba(255,255,255,.06);
    border: .15vw solid rgba(255,255,255,.14);
    transition: opacity .2s;
}
.player.active[b-h7q8yldykh] {
    background: rgba(255,210,63,.14);
    border-color: #ffd23f;
    box-shadow: 0 0 2vh rgba(255,210,63,.35);
}
.player.disabled[b-h7q8yldykh] { opacity: .35; filter: grayscale(.8); }
.player-name[b-h7q8yldykh] { font-size: min(1.5vw, 2.6vh); font-weight: 700; color: #cdb6f0; letter-spacing: .1vw; }
.player.active .player-name[b-h7q8yldykh] { color: #ffd23f; }
.player-score[b-h7q8yldykh] { font-size: min(2.6vw, 4.4vh); font-weight: 900; }
/* /Components/Pages/Remote.razor.rz.scp.css */
.remote[b-kmcbtsgrji] {
    position: fixed;
    inset: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 4vh;
    background: #120a24;
    color: #fff;
    font-family: system-ui, sans-serif;
    padding: 4vw;
}
.r-cat[b-kmcbtsgrji] {
    font-size: 5vw;
    font-weight: 800;
    color: #ffd23f;
    letter-spacing: .1em;
    text-align: center;
}
.r-grid[b-kmcbtsgrji] {
    display: grid;
    grid-template-columns: repeat(6, 1fr);
    gap: 2vw;
    width: 100%;
    max-width: 560px;
}
.r-key[b-kmcbtsgrji] {
    aspect-ratio: 1;
    border: 0;
    border-radius: 12px;
    background: #34245c;
    color: #fff;
    font-size: clamp(1.2rem, 6vw, 2rem);
    font-weight: 800;
    cursor: pointer;
}
.r-key.vowel[b-kmcbtsgrji] { background: #1e3a5f; }
.r-key.found[b-kmcbtsgrji] { background: #14532d; color: #7dffb0; }
.r-key.miss[b-kmcbtsgrji] { background: #5b1a1a; color: #ff9d9d; text-decoration: line-through; }
.r-key:disabled[b-kmcbtsgrji] { opacity: .75; }
.r-result[b-kmcbtsgrji] {
    font-size: 6vw;
    font-weight: 800;
    padding: 1vh 5vw;
    border-radius: 999px;
}
.r-result.good[b-kmcbtsgrji] { background: rgba(76,212,176,.18); color: #7dffd9; }
.r-result.bad[b-kmcbtsgrji] { background: rgba(255,93,93,.15); color: #ff9d9d; }
.r-msg[b-kmcbtsgrji] { font-size: 6vw; color: #8d76b8; font-weight: 700; text-align: center; }
.r-msg.good[b-kmcbtsgrji] { color: #7dffb0; }