/* Redesign phase 4: Salas lobby (p-04 / p-10), Luisa episode (p-05 / p-06), Practicar and Perfil in the same glass style. */
.s4-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;margin:4px 0 2px}
.s4-head h1{margin:0;font-size:clamp(1.8rem,7vw,2.4rem);font-weight:800;letter-spacing:-.02em;line-height:1.05}
.s4-sub{margin:4px 0 0;font-size:.9rem;color:var(--mut)}
.s4-lv{flex:0 0 auto;padding:8px 14px;border-radius:999px;background:var(--glass-2);border:1px solid var(--edge);box-shadow:var(--sh-sm);font-weight:800;font-size:.85rem;color:var(--on-card)}
.s4-grid{display:flex;flex-direction:column;gap:12px}
.s4-col,.s4-side{display:flex;flex-direction:column;gap:12px;min-width:0}
.s4-hero{position:relative;overflow:hidden;padding:18px 20px 20px;border-radius:26px;background:linear-gradient(150deg,rgba(255,77,141,.16),rgba(124,58,237,.14)),var(--glass-2);border:1px solid var(--edge);box-shadow:var(--sh);-webkit-backdrop-filter:blur(22px) saturate(1.6);backdrop-filter:blur(22px) saturate(1.6)}
.s4-kick{display:flex;align-items:center;gap:8px;margin:0 0 6px;font-size:.72rem;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:var(--acc-tx)}
.s4-live{width:9px;height:9px;border-radius:50%;background:#1f8f43;box-shadow:0 0 0 4px rgba(31,143,67,.18)}
.s4-hero .sala-comm-head{margin:0;padding:0;background:none;border:0;box-shadow:none}
.s4-hero #sala-community-name{margin:0;font-size:1.6rem;font-weight:800;letter-spacing:-.01em;line-height:1.15}
.s4-hero .sala-online-count{margin:4px 0 0;font-weight:700;color:var(--ok)}
.s4-lead{margin:8px 0 14px;font-size:.92rem;color:var(--on-card-mut);max-width:52ch}
.s4-hero #sala-quick{width:100%;min-height:52px;border-radius:16px}
.s4-box{display:block;padding:14px 16px;border-radius:22px;background:var(--glass-2);border:1px solid var(--edge);box-shadow:var(--sh-sm);-webkit-backdrop-filter:blur(22px) saturate(1.6);backdrop-filter:blur(22px) saturate(1.6)}
.s4-eyebrow{margin:0 0 10px;font-size:.72rem;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:var(--on-card-mut)}
.s4-box .sala-code{margin-top:10px}
.s4-practice{display:flex;align-items:center;gap:12px;text-decoration:none;color:var(--on-card);background:linear-gradient(135deg,rgba(124,58,237,.16),rgba(168,85,247,.10)),var(--glass-2)}
.s4-practice .s4-ic{flex:0 0 46px;height:46px;border-radius:50%;display:grid;place-items:center;font-size:1.3rem;background:var(--glass);border:1px solid var(--edge)}
.s4-practice>span:nth-child(2){flex:1;min-width:0;display:flex;flex-direction:column}
.s4-practice small{font-size:.72rem;font-weight:800;color:var(--violet)}
.s4-practice b{font-size:1rem;font-weight:800}
.s4-practice em{font-style:normal;font-size:.82rem;color:var(--on-card-mut)}
.s4-go{flex:0 0 auto;padding:10px 16px;border-radius:14px;background:linear-gradient(135deg,#7c3aed,#9d4edd);color:#fff;font-weight:800;font-size:.88rem}
.s4-notes .sala-note{margin:0 0 6px}.s4-notes .sala-note:last-child{margin:0}
@media (min-width:1000px){
  .s4-grid{display:grid;grid-template-columns:minmax(0,1.6fr) minmax(280px,1fr);gap:18px;align-items:start}
  .s4-hero{padding:24px 26px}
  .s4-hero #sala-community-name{font-size:2rem}
  .s4-hero #sala-quick{width:auto;min-width:220px;padding:0 28px}
}
/* Luisa episode */
.lu-back{display:inline-flex;align-items:center;gap:8px;margin:0 0 10px;font-weight:700;color:var(--on-card);text-decoration:none}
.lu-back span{color:var(--acc);font-size:1.4rem;line-height:1}
.lu-card{border-radius:28px;padding:22px}
.lu-kicker{font-weight:800;letter-spacing:.08em;line-height:1.4}
.lu-lvl{background:var(--acc);color:#fff}
.lu-title{font-size:clamp(1.7rem,6.5vw,2.2rem);font-weight:800;letter-spacing:-.02em;line-height:1.1;margin:4px 0 8px}
.lu-player{border-radius:22px;background:#2a1830}
.lu-player video{background:#2a1830}
.lu-ctl .btn.big{min-height:54px;border-radius:16px}
/* Practicar */
#app:has(#tour-practice)>h1,#app:has(#pf-out)>h1{font-size:clamp(1.8rem,7vw,2.4rem);font-weight:800;letter-spacing:-.02em;margin:4px 0 14px}
#tour-practice .gamecard{align-items:flex-start;text-align:left;padding:16px;border-radius:24px;background:var(--glass-2);gap:6px}
#tour-practice .gamecard .ge{width:46px;height:46px;border-radius:14px;display:grid;place-items:center;font-size:1.4rem;background:linear-gradient(135deg,rgba(255,77,141,.18),rgba(124,58,237,.18))}
#tour-practice .gamecard b{font-size:1rem;font-weight:800}
#app:has(#tour-practice) .card h2,#app:has(#pf-out) .card h2{font-size:1.1rem;font-weight:800;letter-spacing:-.01em}
/* Perfil */
#app:has(#pf-out) .card{border-radius:26px}
#app:has(#pf-out) .card:first-of-type{background:linear-gradient(150deg,rgba(255,77,141,.14),rgba(124,58,237,.14)),var(--glass-2)}
#app:has(#pf-out) .avatar{width:64px;height:64px;font-size:1.7rem;font-weight:800;box-shadow:0 8px 20px -8px rgba(216,27,107,.6)}
#app:has(#pf-out) .stat{padding:12px 6px;border-radius:18px;background:var(--glass);border:1px solid var(--edge)}
#app:has(#pf-out) .stat b{font-weight:800;font-size:1.8rem}
@media (min-width:1000px){
  #tour-practice{grid-template-columns:repeat(3,minmax(0,1fr))}
}
@media (min-width:1000px){
  .s4-practice{flex-wrap:wrap}
  .s4-practice .s4-ic{display:none}
  .s4-practice .s4-go{margin-left:auto}
  .s4-side .salas-actions .btn{font-size:.88rem;white-space:nowrap;padding-left:10px;padding-right:10px}
}
