.family-shell{display:grid;gap:15px;padding-bottom:32px}
.family-card{background:rgba(34,22,46,.85);border:1px solid rgba(250,220,246,.18);padding:18px;border-radius:18px}
.family-card h2,.family-card h3{margin:4px 0 10px}
.family-card p{line-height:1.5}
.family-profile-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,185px),1fr));gap:12px}
.family-profile-choice{display:grid;justify-items:center;gap:7px;padding:20px 12px;min-height:152px;border-radius:19px;
 background:rgba(70,45,84,.6);border:1px solid rgba(255,219,177,.34);color:#fff;text-align:center;cursor:pointer}
.family-profile-choice:hover,.family-profile-choice:focus-visible{outline:3px solid #f7c983;outline-offset:3px}
.family-profile-choice>span:first-child{font-size:2.6rem}
.family-profile-choice strong{font-size:1.05rem}
.family-profile-choice small{color:#d8cadb}
.family-fields{display:grid;gap:12px;max-width:570px}
.family-fields label{display:grid;gap:7px;font-size:.91rem}
.family-fields input,.family-fields select,.family-fields textarea{box-sizing:border-box;width:100%;min-height:46px;
 padding:10px;border-radius:11px;background:#251b31;border:1px solid #90779d;color:#fff;font-size:16px}
.family-fields textarea{min-height:80px}
.family-checkbox{display:flex!important;align-items:center;gap:10px!important}
.family-checkbox input{width:20px;min-height:20px;flex:none}
.family-nav{display:flex;flex-wrap:wrap;gap:9px}
.family-nav button,.family-nav a{min-height:44px;display:inline-flex;align-items:center;justify-content:center;padding:10px 15px;border-radius:12px;
 border:1px solid rgba(255,212,120,.43);background:#523755;color:#fff;font-weight:700;text-decoration:none;cursor:pointer}
.family-nav .selected{background:#80609b}
.family-status{font-size:.8rem;border-radius:11px;padding:5px 10px;background:#4a385b;display:inline-block}
.family-player-bar{display:flex;justify-content:space-between;align-items:center;gap:13px;flex-wrap:wrap}
.family-player-bar>div{display:flex;align-items:center;gap:9px}
.family-player-bar strong{font-size:1.05rem}
.family-list{display:grid;gap:13px}
.family-game{border:1px solid rgba(255,255,255,.18);border-radius:16px;background:#33263c;padding:16px}
.family-game .family-badge{font-size:.76rem;color:#ffdda8}
.family-game p{font-size:.88rem}
.family-game .btn,.family-game .btn-secondary{min-height:45px;margin-top:8px}
.family-answer{display:grid;gap:10px;padding:14px;margin:13px 0;border:1px solid rgba(255,255,255,.24);border-radius:14px}
.family-answer legend{font-weight:700;line-height:1.45;padding:0 6px}
.family-answer label{display:flex;align-items:center;gap:10px;min-height:43px;padding:8px;border-radius:9px;background:rgba(255,255,255,.06)}
.family-answer input{width:19px;height:19px;flex:none}
.family-question-form button{min-height:47px}
.family-photo{width:100%;height:auto;max-height:360px;object-fit:contain;border-radius:13px;background:#221827;margin:10px 0}
.family-signed{max-width:540px}
.family-warning{border-left:3px solid #ffd478;padding:12px 14px;background:rgba(255,212,120,.09);font-size:.88rem;line-height:1.5}
.family-note{font-size:.82rem;color:#e0d2e7;line-height:1.5}
.family-game[data-family-disabled]{opacity:.78}
.family-game a{color:#ffe6ae}
.family-stat-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
.family-stat-grid>div{display:grid;gap:3px;padding:15px;border-radius:13px;background:rgba(255,255,255,.07)}
.family-stat-grid strong{font-size:1.4rem}
.family-rank{padding:11px 0;border-bottom:1px solid rgba(255,255,255,.15);display:flex;gap:10px;align-items:center}
.family-rank>span:nth-child(2){flex:1;min-width:0;overflow-wrap:anywhere}
.family-rank.current{color:#fff1c9;font-weight:800}
.family-card button:focus-visible,.family-card a:focus-visible{outline:3px solid #ffd478;outline-offset:3px}
@media(max-width:480px){.family-card{padding:14px}.family-profile-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.family-profile-choice{padding:13px 8px;min-height:135px}.family-player-bar{align-items:stretch;flex-direction:column}.family-nav>*{flex:1}}

/* Modo Familia: el juego del perfil activo debe ser visible antes de cualquier regreso al titular. */
.family-event-marker{font-size:.84rem;font-weight:650;color:#efd7e3;line-height:1.45;
 padding:5px 3px 0;overflow-wrap:anywhere}
.family-event-marker span{color:#ffd478;text-transform:uppercase;letter-spacing:.09em;font-size:.72rem}
.family-quick-play{padding:14px;border:1px solid rgba(255,212,120,.37);border-radius:18px;
 background:linear-gradient(125deg,rgba(255,212,120,.12),rgba(226,100,171,.12))}
.family-quick-play>.eyebrow{margin:0 0 10px;font-size:.72rem;line-height:1.5}
.family-quick-play-button{width:100%;display:flex;justify-content:space-between;align-items:center;gap:13px;
 text-align:left;padding:14px 16px;min-height:58px;border:1px solid rgba(255,255,255,.3);border-radius:13px;
 background:linear-gradient(110deg,#ffd388,#f2a5b9);color:#211326;cursor:pointer}
.family-quick-play-button span:first-child{display:grid;gap:4px;min-width:0}
.family-quick-play-button small{font-size:.78rem;font-weight:700}
.family-quick-play-button strong{font-size:1rem;line-height:1.35;overflow-wrap:anywhere}
.family-quick-play-button span:last-child{font-size:1.35rem;flex:none}
.family-quick-play-button:focus-visible{outline:3px solid #ffda81;outline-offset:3px}
.family-games-heading h2{margin:0 0 10px;font-size:1.15rem}
.family-games-info{margin:0}
.family-games-info>summary{cursor:pointer;color:#dfd0e7;font-size:.83rem;min-height:35px}
.family-games-info>p{margin:5px 0 8px}
.family-game,.family-question-form{scroll-margin-top:18px}
@media(max-width:480px){
 .family-event-marker{font-size:.78rem}
 .family-quick-play{padding:12px}
 .family-quick-play-button{padding:12px;min-height:55px}
}

/* Modo Familia 2.0: turnos rápidos y tablero agregado, sin puntajes nuevos */
.family-turn-switch{padding-top:12px;border-top:1px solid rgba(255,255,255,.13)}
.family-turn-switch p{margin:0 0 8px}
.family-turn-choices{display:flex;gap:8px;flex-wrap:wrap}
.family-turn-choices button{min-height:44px;padding:9px 12px;border-radius:11px;
 border:1px solid rgba(255,220,154,.44);background:rgba(255,220,154,.12);color:#ffe6b6;font-weight:750;cursor:pointer}
.family-team-list{margin-top:12px;display:grid;gap:9px}
.family-team-member{display:grid;grid-template-columns:35px minmax(0,1fr) auto;gap:8px;align-items:center;
 padding:11px;border:1px solid rgba(255,255,255,.13);border-radius:13px;background:rgba(255,255,255,.055)}
.family-team-member>span{font-size:1.55rem}
.family-team-member>div{min-width:0}
.family-team-member>div strong{overflow-wrap:anywhere}
.family-team-member small{display:block;color:#d6c5dc;font-size:.76rem;margin-top:4px;line-height:1.4}
.family-team-member>strong{white-space:nowrap;color:#ffdfaa}
.family-team-member button{grid-column:2/-1;justify-self:stretch;min-height:40px;border-radius:9px;
 background:rgba(245,199,123,.15);border:1px solid rgba(245,199,123,.38);color:#ffe5b7;font-weight:800;cursor:pointer}
.family-team-member button:focus-visible,.family-turn-choices button:focus-visible{outline:3px solid #ffd478;outline-offset:2px}
@media(max-width:480px){.family-nav button{padding:8px 10px;font-size:.82rem}
 .family-team-member{grid-template-columns:34px minmax(0,1fr) auto}
 .family-turn-choices button{flex:1 1 44%}}

/* Navegación familiar y votaciones con acciones accesibles en móvil. */
.family-game-destination{display:grid;gap:13px;min-width:0;scroll-margin-top:14px}
.family-vote-options{display:grid;gap:10px;margin:14px 0}
.family-vote-choice{min-height:48px;width:100%;text-align:left;overflow-wrap:anywhere}
#familyBack{min-height:44px;display:inline-flex;align-items:center;overflow-wrap:anywhere}
#familyBack:focus-visible,.family-vote-choice:focus-visible{outline:3px solid #ffdc89;outline-offset:3px}
@media(max-width:380px){.family-vote-options{gap:8px}.family-vote-choice{padding:12px}}


/* Auditoría: selector de fotografía familiar accesible en Android y escritorio. */
.family-photo-picker{display:grid;gap:10px;position:relative;padding:13px;border-radius:14px;
 border:1px solid rgba(255,212,120,.3);background:rgba(255,255,255,.045)}
.family-photo-actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.family-fields .family-photo-action{display:flex;justify-content:center;align-items:center;min-height:52px;
 text-align:center;padding:10px 12px;cursor:pointer;font-weight:750;border-radius:12px;
 border:1px solid rgba(255,212,120,.45);background:#523755;color:#fff;line-height:1.3}
.family-fields .family-photo-action:active{background:#6a4973}
.family-fields .family-photo-file{position:absolute;width:1px;height:1px;min-height:1px;padding:0;
 opacity:0;overflow:hidden;pointer-events:none}
.family-photo-picker:has(.family-photo-file:focus-visible) .family-photo-action{outline:2px solid #ffd478;outline-offset:2px}
.family-photo-filename{font-size:.88rem;overflow-wrap:anywhere;margin:0;color:#efdfef}
.family-photo-preview{display:block;width:100%;max-height:340px;object-fit:contain;
 background:#21182d;border-radius:12px}
.family-photo-preview[hidden],.family-photo-remove[hidden]{display:none!important}
.family-photo-remove{justify-self:start}
@media(max-width:380px){.family-photo-actions{grid-template-columns:1fr}}

/* Entrada a pareja: evitar cortes de texto y desplazamiento horizontal en Samsung. */
.family-pair-access{display:flex;flex-direction:column;gap:5px;width:100%;min-width:0;box-sizing:border-box;
 padding:14px 16px;margin-top:13px;border:1px solid rgba(255,218,166,.48);border-radius:14px;
 background:rgba(255,217,168,.10);color:#ffebc4!important;text-decoration:none!important;
 white-space:normal;overflow-wrap:anywhere;word-break:normal;line-height:1.35}
.family-pair-access-title{display:flex;align-items:center;justify-content:space-between;gap:12px;
 font-size:1rem;font-weight:800;white-space:normal}
.family-pair-access small{display:block;font-size:.8rem;color:#e9dbe7;white-space:normal;line-height:1.4}
.family-pair-access:hover,.family-pair-access:focus-visible{background:rgba(255,217,168,.18)}

/* El participante solo ve desafíos abiertos y conserva sus resultados previos. */
.family-history{display:grid;gap:11px;margin-top:16px}
.family-history h2{font-size:1.16rem;margin:0}
.family-history-list{display:grid;gap:9px}
.family-history-item{display:grid;gap:3px;padding:12px 14px;border:1px solid rgba(255,255,255,.14);
 border-radius:13px;background:rgba(255,255,255,.045);min-width:0}
.family-history-item strong{line-height:1.35;overflow-wrap:anywhere}
.family-history-item small{display:block;color:#dfd0e3;margin-top:4px;font-size:.81rem;line-height:1.4}
.family-empty-games h3{margin:0 0 6px;font-size:1.04rem}
.family-empty-games p{margin:0;color:#ded1e2;line-height:1.5}