/* GESTISCI PROFILI (profili, 4 ottobre 2026, giro 4): righe come le Impostazioni, a 1920x1080; i riquadri sopra su un velo scuro. */
.gp-pagina { position: absolute; top: 0; left: 0; right: 0; bottom: 0; padding: 40px 140px; box-sizing: border-box; display: flex; flex-direction: column; font-family: "Poppins", sans-serif; color: #fff; }
.gp-titolo { font-size: 48px; font-weight: 500; margin-bottom: 18px; }
.gp-editor-testa { display: flex; align-items: center; margin-bottom: 10px; }
.gp-avatar-grande { width: 150px; height: 150px; border-radius: 50%; object-fit: cover; }
.gp-nome-grande { margin-left: 24px; font-size: 40px; font-weight: 700; }
.gp-sotto { font-size: 22px; color: rgba(255, 255, 255, 0.7); margin-bottom: 10px; }
.gp-voci { flex: 1; overflow-y: auto; }
.gp-intestazione { margin: 18px 0 6px; font-size: 24px; font-weight: 600; color: #e7a101; }
.gp-intestazione.gp-piccola { font-size: 20px; font-weight: 400; color: rgba(255, 255, 255, 0.6); }
.gp-riga { display: flex; justify-content: space-between; align-items: center; padding: 16px 24px; margin: 4px 0; border-radius: 10px; background: rgba(255, 255, 255, 0.06); border: 3px solid transparent; font-size: 30px; cursor: pointer; }
.gp-destra { color: rgba(255, 255, 255, 0.7); font-size: 26px; margin-left: 30px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 50%; }
.gp-pulsante { margin: 18px 20px 0 0; padding: 14px 34px; font-family: "Poppins", sans-serif; font-size: 28px; font-weight: 600; color: #fff; background: rgba(255, 255, 255, 0.12); border: 3px solid rgba(255, 255, 255, 0.25); border-radius: 8px; cursor: pointer; outline: none; }
.gp-riga.gp-focused, .gp-pulsante.gp-focused { border-color: #e7a101; background: rgba(231, 161, 1, 0.2); }
.gp-velo { position: absolute; top: 0; left: 0; right: 0; bottom: 0; background: rgba(0, 0, 0, 0.8); display: flex; align-items: center; justify-content: center; }
.gp-riquadro { background: #161b22; border: 2px solid rgba(255, 255, 255, 0.2); border-radius: 14px; padding: 36px 44px; max-width: 1500px; max-height: 900px; display: flex; flex-direction: column; align-items: center; box-sizing: border-box; }
.gp-domanda { font-size: 32px; text-align: center; max-width: 1100px; margin-bottom: 22px; }
.gp-tasti { display: flex; }
.gp-campo { font-family: "Poppins", sans-serif; font-size: 40px; padding: 12px 20px; width: 520px; border-radius: 10px; border: 3px solid #e7a101; background: rgba(255, 255, 255, 0.08); color: #fff; text-align: center; outline: none; }
.gp-gruppo-nome { color: #e7a101; }
.gp-griglia { display: flex; flex-wrap: wrap; width: 1312px; max-height: 760px; overflow-y: auto; }
.gp-av { width: 140px; height: 140px; margin: 12px; border-radius: 50%; object-fit: cover; border: 6px solid transparent; box-sizing: border-box; cursor: pointer; }
.gp-av.gp-scelto { border-color: rgba(255, 255, 255, 0.6); }
.gp-av.gp-focused { border-color: #e7a101; }
.gp-categorie { width: 1100px; max-height: 760px; overflow-y: auto; }
.gp-cat.gp-adulta { opacity: 0.45; }

/* LA PAGINA CATEGORIE SUI TV (15 ottobre 2026, punto 26a; pages/CategoriePage.js): le stesse misure della web (web.css, html.web .cat-*,
   che sulla web vincono per specificita'), dentro l'area sicura dei TV (60 px sopra, 140 ai lati); il fondo nero (sulla web lo da' la
   pagina, sui TV no: era bianco); il titolo come .gp-titolo. Niente gap ne' inset (Chromium 63: test-compat). */
.cat-pagina { position: absolute; top: 0; left: 0; right: 0; bottom: 0; overflow-y: auto; padding: 0 140px 40px; box-sizing: border-box; font-family: "Poppins", sans-serif; color: #fff; background: #000; }
.cat-testa { position: sticky; top: 0; z-index: 3; padding-top: 60px; background: #000; }
.cat-selettori { display: flex; flex-wrap: wrap; padding: 14px 0 10px; }
.cat-selettore { margin: 0 14px 6px 0; padding: 8px 22px; border-radius: 22px; border: 3px solid transparent; background: rgba(255, 255, 255, 0.2); color: #fff; font-family: "Poppins", sans-serif; font-size: 24px; font-weight: 600; outline: none; }
.cat-selettore.cat-attivo { background: #e7a101; color: #111; }
.cat-selettore.cat-focused { border-color: #fff; box-shadow: 0 0 0 3px #e7a101; }
.cat-lista { display: flex; flex-direction: column; }
.cat-riga { display: flex; align-items: center; padding: 12px 24px; margin-bottom: 8px; border-radius: 12px; background: #0d0d0d; border: 2px solid #333; font-size: 28px; }
.cat-riga.cat-focused { border-color: #e7a101; box-shadow: 0 0 0 3px #e7a101; }
.cat-riga.cat-off { color: #888; }
.cat-riga.cat-lucchettata { color: #888; }
.cat-numero { width: 64px; flex: 0 0 auto; color: #e7a101; font-weight: 600; }
.cat-off .cat-numero { color: #888; }
.cat-nome { flex: 1 1 auto; min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.cat-spenta-testo { font-size: 22px; color: #888; margin-left: 10px; }
.cat-lucchetto { color: #888; margin-left: 10px; }
.cat-freccia { width: 56px; height: 44px; margin-left: 10px; border-radius: 8px; border: 2px solid transparent; background: rgba(255, 255, 255, 0.13); color: #fff; font-size: 20px; outline: none; flex: 0 0 auto; }
.cat-freccia.cat-ferma { color: rgba(255, 255, 255, 0.3); }
.cat-freccia.cat-focused { border-color: #e7a101; background: rgba(231, 161, 1, 0.25); box-shadow: 0 0 0 2px #e7a101; }
.cat-vuota { padding: 20px 0; font-size: 26px; color: #aaa; }
.cat-guida { margin-top: 10px; font-size: 20px; color: rgba(255, 255, 255, 0.7); }

/* LA FINESTRA DEGLI AVATAR A GRUPPI SUI TV (15 ottobre 2026, punto 26c; decisione 52): le misure della web (web.css, html.web .gp-avatar-web,
   .gp-gruppi, .gp-gruppo, che sulla web vincono): 85 % dello schermo, i quattro gruppi in alto col conteggio, la griglia di UN gruppo sotto,
   che scorre lei; l'avatar in uso con l'anello bianco, quello a fuoco in oro. */
.gp-riquadro.gp-avatar-web { width: 85%; height: 85%; max-width: none; max-height: none; padding: 30px 40px; flex-wrap: nowrap; overflow: hidden; }
.gp-avatar-web .gp-domanda { margin-bottom: 14px; }
.gp-gruppi { display: flex; justify-content: center; flex-wrap: wrap; margin-bottom: 16px; flex: 0 0 auto; }
.gp-gruppo { margin: 0 8px 8px; padding: 10px 26px; border-radius: 24px; border: 3px solid transparent; background: rgba(255, 255, 255, 0.12); color: #fff; font-family: "Poppins", sans-serif; font-size: 26px; font-weight: 600; outline: none; }
.gp-gruppo.gp-attivo { background: #e7a101; color: #111; }
.gp-gruppo.gp-focused { border-color: #fff; box-shadow: 0 0 0 3px #e7a101; }
.gp-avatar-web .gp-griglia { width: 100%; flex: 1 1 auto; min-height: 0; max-height: none; justify-content: center; align-content: flex-start; }
.gp-avatar-web .gp-av.gp-scelto { border-color: #fff; }
.gp-avatar-web .gp-av.gp-focused { border-color: #e7a101; }