/* V33 · Coherencia de cards, navegación y estabilidad móvil */
:root{
  --v33-card:#ffffff;
  --v33-soft:#f5f9f7;
  --v33-ink:#17382e;
  --v33-muted:#687b72;
  --v33-line:#dce7e1;
  --v33-green:#075d45;
  --v33-green-2:#0a7957;
  --v33-gold:#f5cb5d;
  --v33-shadow:0 14px 34px rgba(5,49,35,.075);
}

/* Emojis más cuidados en escritorio */
.v29-desktop-nav a,.v29-desktop-nav button{display:flex!important;align-items:center!important;gap:8px!important}
.v29-desktop-nav button{font-family:inherit!important}
.v33-nav-emoji{
  width:28px;height:28px;display:grid;place-items:center;flex:0 0 28px;
  border-radius:9px;background:rgba(255,255,255,.11);border:1px solid rgba(255,255,255,.12);
  font-style:normal;font-size:16px;line-height:1;filter:saturate(1.05);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.08);
  transition:.2s ease;
}
.v29-desktop-nav a:hover .v33-nav-emoji,.v29-desktop-nav button:hover .v33-nav-emoji,
.v29-desktop-nav a.active .v33-nav-emoji{background:rgba(255,255,255,.20);transform:translateY(-1px) scale(1.04)}

@media(min-width:820px){
  .v29-quick-grid i{width:52px;height:52px;display:grid;place-items:center;border-radius:16px;background:linear-gradient(180deg,#f4f8f6,#eaf3ef);font-size:27px!important;box-shadow:inset 0 1px 0 #fff,0 8px 18px rgba(6,64,47,.07)}
  .v29-quick-grid .v29-game-quick i{background:linear-gradient(180deg,#ffe790,#f6ca51);box-shadow:0 8px 18px rgba(212,161,31,.18)}
  .v32-manual-quick i{background:linear-gradient(180deg,#edf6f2,#e5f0eb)!important}
  .v32-var-quick i{background:linear-gradient(180deg,#eff5fa,#e5edf5)!important}
}

/* Manual: misma familia visual de cards, sin bloque amarillo diferente */
.v32-manual-card.v33-standard-card{
  background:var(--v33-card)!important;border:1px solid var(--v33-line)!important;color:var(--v33-ink)!important;
  box-shadow:var(--v33-shadow)!important;
}
.v32-manual-card.v33-standard-card .v32-manual-icon{
  background:linear-gradient(180deg,#edf7f2,#e4f1eb)!important;color:var(--v33-green)!important;
  box-shadow:none!important;border:1px solid #d6e7de;
}
.v32-manual-card.v33-standard-card .v32-manual-copy small{color:var(--v33-green-2)!important}
.v32-manual-card.v33-standard-card .v32-manual-copy h2{color:var(--v33-ink)!important}
.v32-manual-card.v33-standard-card .v32-manual-copy p{color:var(--v33-muted)!important}
.v32-manual-card.v33-standard-card .v32-manual-actions button{
  background:var(--v33-soft)!important;border:1px solid var(--v33-line)!important;color:var(--v33-ink)!important;
}
.v32-manual-card.v33-standard-card .v32-manual-actions button:hover{background:#edf6f2!important;border-color:#cbded4!important}

/* Manual interactivo con cards iguales */
.manual-modal{background:#f3f7f5!important}
.manual-modal-head{background:#fff;border:1px solid var(--v33-line);border-radius:20px;padding:15px 58px 15px 15px;box-shadow:var(--v33-shadow)}
.manual-tabs{background:#fff;border:1px solid var(--v33-line);border-radius:18px;padding:7px;margin:10px 0!important;box-shadow:0 8px 20px rgba(5,49,35,.05)}
.manual-tabs button{border:0!important;background:#f2f7f4!important;color:#36584c!important;border-radius:13px!important;min-height:38px;font-size:10px!important}
.manual-tabs button.active{background:var(--v33-green)!important;color:#fff!important}
.manual-search{background:#fff;border:1px solid var(--v33-line);border-radius:18px;padding:7px 10px;box-shadow:0 8px 20px rgba(5,49,35,.05)}
.manual-search input{border:0!important;background:transparent!important;margin:0!important;box-shadow:none!important;padding:9px!important}
.v33-manual-group{margin-top:12px!important;background:#fff;border:1px solid var(--v33-line);border-radius:20px;padding:13px;box-shadow:var(--v33-shadow)}
.v33-manual-group-head{display:flex;align-items:center;gap:10px;margin-bottom:10px}
.v33-manual-group-head>span{width:42px;height:42px;border-radius:13px;background:#edf6f2;display:grid;place-items:center;font-size:21px}
.v33-manual-group-head h3{margin:0!important;font-size:15px!important;color:var(--v33-ink)}
.v33-manual-group-head small{display:block;margin-top:2px;font-size:9px;color:var(--v33-muted)}
.v33-manual-grid{display:grid;gap:8px}
.manual-item.v33-manual-item{display:grid!important;grid-template-columns:40px minmax(0,1fr)!important;gap:10px!important;align-items:start;border:1px solid #e2ebe6!important;background:#f9fbfa!important;border-radius:16px!important;padding:11px!important}
.v33-manual-item-icon{width:40px;height:40px;border-radius:12px;background:#fff;border:1px solid #e1ebe6;display:grid;place-items:center;font-size:20px}
.v33-manual-item-copy small{display:block;font-size:8px;font-weight:900;color:var(--v33-green-2);margin-bottom:4px}
.v33-manual-item-copy p{margin:0!important;font-size:11px!important;line-height:1.45!important;color:#425f54}

/* Actualizar app: siempre disponible y claramente accionable */
#updateAppButton{pointer-events:auto!important;opacity:1!important;cursor:pointer!important}
#updateAppButton>i{background:linear-gradient(180deg,#eaf6f0,#dff0e8)!important}
#updateAppButton.is-updating{animation:v33UpdatePulse .8s ease-in-out infinite alternate}
@keyframes v33UpdatePulse{to{transform:scale(.98);opacity:.78}}

/* Bosco completo: el personaje no se corta dentro del módulo */
.v29-game-art{overflow:visible!important}
.v29-game-art img{object-fit:contain!important;object-position:center bottom!important;transform-origin:center bottom!important}

@media(max-width:819px){
  /* Todas las piezas principales usan exactamente el mismo lenguaje de card */
  .v29-home-intro,.v29-leader-shell,.v29-today-card,.v32-quick-shell,.v32-manual-card,.v29-game-card,.v29-voice-card,
  .v29-view-head,.v29-search,.category-tabs,.v29-ranking-board,.challenge-card,.v29-category-card,.v31-live-hero,.v31-live-toolbar,
  .v31-feed-panel,.v31-live-side,.v31-var-hero,.v31-var-info article,.v31-var-board,.v29-awards-intro,#awards .recognitions-public{
    border-radius:22px!important;border:1px solid var(--v33-line)!important;box-shadow:var(--v33-shadow)!important;
  }

  /* Menos etiquetas innecesarias */
  .v29-kicker,.v29-game-copy>span,.v31-live-kicker,.v31-live-status>small,.v31-live-toolbar>div:first-child small,
  .v31-panel-head small,.v31-side-head small,.v31-var-hero small,.v31-var-board .v31-panel-head small{display:none!important}

  /* Header móvil estable; no cambia de tamaño mientras se desplaza */
  .v29-topbar,.v29-topbar.compact{transform:none!important;height:var(--header-h)!important;transition:box-shadow .2s ease!important}

  /* Minijuego: card vertical, Don Bosco completo y visible */
  .v29-game-card{
    display:flex!important;flex-direction:column!important;min-height:390px!important;overflow:hidden!important;
    background:linear-gradient(180deg,rgba(4,52,39,.96),rgba(5,85,60,.90)),url('../img/game/salesiano-patio.png') center/cover no-repeat!important;
  }
  .v29-game-copy{padding:18px 18px 4px!important;z-index:4!important}
  .v29-game-copy h2{font-size:31px!important;max-width:none!important;margin:0 0 8px!important}
  .v29-game-copy p{font-size:11px!important;max-width:290px!important;margin-bottom:5px!important}
  .v29-game-copy>a{font-size:12px!important;min-height:44px;padding:0 14px!important}
  .v29-game-art{height:220px!important;min-height:220px!important;position:relative!important;overflow:visible!important;z-index:2!important}
  .v29-game-art:before{inset:0!important;background:radial-gradient(circle at 70% 60%,rgba(255,222,118,.28),transparent 42%)!important}
  .v29-game-art img{height:205px!important;max-height:205px!important;width:auto!important;right:9%!important;left:auto!important;bottom:0!important;transform:none!important;animation:v33BoscoFloat 3s ease-in-out infinite!important}
  .game-promo-ranking{display:block!important;left:17px!important;right:auto!important;top:auto!important;bottom:16px!important;max-width:145px!important;background:rgba(3,30,23,.83)!important}
  @keyframes v33BoscoFloat{50%{transform:translateY(-5px)}}

  /* Manual card igual al resto */
  .v32-manual-card.v33-standard-card{background:#fff!important}
  .v32-manual-card.v33-standard-card .v32-manual-actions{grid-template-columns:repeat(3,1fr)!important}
  .v32-manual-card.v33-standard-card .v32-manual-actions button:last-child{grid-column:auto!important}

  /* Manual modal también parece una pantalla de cards */
  .manual-modal{padding:12px!important;background:#eef4f1!important}
  .manual-modal-head{border-radius:22px!important;padding:14px 52px 14px 14px!important}
  .manual-tabs{border-radius:18px!important;display:grid!important;grid-template-columns:1fr 1fr!important;overflow:visible!important;gap:6px!important}
  .manual-tabs button{width:100%!important;min-height:42px!important;font-size:10px!important}
  .manual-search{border-radius:18px!important}
  .v33-manual-group{border-radius:20px!important;padding:11px!important}
  .manual-item.v33-manual-item{border-radius:15px!important;padding:10px!important}
  .v33-manual-item-copy p{font-size:11px!important}

  /* Más opciones: actualizar nunca se ve bloqueado */
  #updateAppButton{background:#f4faf7!important;border-color:#d7e6de!important}
  #updateAppButton b{color:#184a39!important}
}

@media(max-width:430px){
  .v29-game-card{min-height:405px!important}
  .v29-game-art{height:235px!important;min-height:235px!important}
  .v29-game-art img{height:220px!important;max-height:220px!important;right:5%!important}
  .v32-manual-card.v33-standard-card .v32-manual-actions{grid-template-columns:1fr 1fr!important}
  .v32-manual-card.v33-standard-card .v32-manual-actions button:last-child{grid-column:1/-1!important}
}

@media(prefers-reduced-motion:reduce){.v29-game-art img,#updateAppButton.is-updating{animation:none!important}}
