/* =====================================================================
   V05.7.0 · FASE 7 · PULIDO FINAL + MAC / iPAD / PWA
   Capa exclusivamente visual y responsive sobre V05.6.0 aprobada.
   NO modifica motores, contenidos, intro, subrayado, planificador,
   banco de frases, Rosaritos ni chulazos.
   ===================================================================== */

/* 1 · Seguridad de maquetación: nada debe ensanchar un panel por accidente. */
.leftPanel,.rightPanel,.sideContent,
.contentCard,.modulePanel,.lolaCard,.emptyState,
.supLayout,.repasoLayout,.noConfLayout,.tribunalGrid,.cantorGrid,
.examRandomGrid,.fallosLayout,.falloFormGrid,.falloFormGrid.two,
.planGrid,.rutaStudyGrid,.rutaStudySplit,
.fichaCoreGrid,.fichaStatsGrid,.examSelectorGrid,.examTopicGrid,
.comparoTableWrap,.comparoModalBox,.planModalBox{
  min-width:0!important;
  box-sizing:border-box!important;
}
.sideContent > *{max-width:100%;box-sizing:border-box;}
.sideContent{scrollbar-gutter:stable;overscroll-behavior:contain;}

/* 2 · Texto y controles: evitar cortes feos sin cambiar el contenido. */
.rightPanel h1,.rightPanel h2,.rightPanel h3,.rightPanel h4,.rightPanel h5,
.rightPanel p,.rightPanel li,.rightPanel blockquote,.rightPanel label,
.rightPanel .badge,.rightPanel .miniBtn,.rightPanel .pedePrimaryBtn,
.rightPanel .ghostBtn,.rightPanel button{
  overflow-wrap:break-word;
  word-break:normal;
}
.rightPanel input,.rightPanel select,.rightPanel textarea{
  max-width:100%;
  min-width:0;
  box-sizing:border-box;
}
.moduleActions,.tribunalActions,.miniBar,.badgeRow,.moduleBadges{
  align-items:center;
}
.moduleActions > button,.tribunalActions > button,.miniBar > button{
  max-width:100%;
}

/* 3 · Ritmo visual: mismas separaciones en los módulos sin reconstruirlos. */
.sideContent{padding-bottom:34px!important;}
.contentCard,.modulePanel,.lolaCard{margin-bottom:16px;}
.contentCard:last-child,.modulePanel:last-child,.lolaCard:last-child{margin-bottom:0;}
.modulePanel h4,.contentCard h4{line-height:1.16;}
.moduleListItem{min-width:0;}
.moduleListItem strong,.moduleListItem span{overflow-wrap:anywhere;}

/* 4 · Focus visible consistente para teclado/táctil asistido. */
.rightPanel button:focus-visible,.sideRail button:focus-visible,
.rightPanel input:focus-visible,.rightPanel select:focus-visible,
.rightPanel textarea:focus-visible{
  outline:3px solid rgba(228,51,141,.30)!important;
  outline-offset:2px!important;
}

/* 5 · Modales: nunca deben salirse de la pantalla. */
.comparoModalBox,.planModalBox{
  width:min(1180px,calc(100vw - 32px))!important;
  max-height:min(90vh,900px)!important;
  overflow:hidden!important;
}
.comparoModalBody,.planModalBody{
  min-width:0!important;
  overflow:auto!important;
  overscroll-behavior:contain;
  -webkit-overflow-scrolling:touch;
}
.comparoTableWrap{max-width:100%;overflow:auto!important;}

/* 6 · Mac pequeño / ventanas no maximizadas: bajar complejidad antes de romper. */
@media (max-width:1320px) and (pointer:fine){
  .examSelectorGrid{grid-template-columns:repeat(2,minmax(0,1fr))!important;}
  .falloFormGrid{grid-template-columns:repeat(2,minmax(0,1fr))!important;}
  .falloFormGrid.two{grid-template-columns:repeat(2,minmax(0,1fr))!important;}
  .rutaStudyGrid{grid-template-columns:repeat(2,minmax(0,1fr))!important;}
}

/* 7 · iPad horizontal: el panel derecho real es estrecho aunque el viewport sea 1366px. */
@media (pointer:coarse) and (min-width:901px) and (max-width:1366px){
  .sideContent{padding:12px 13px calc(22px + var(--ipad-safe-bottom))!important;}
  .contentCard,.modulePanel,.lolaCard{padding:16px!important;border-radius:20px!important;}
  .contentCard h4,.modulePanel h4,.lolaCard h4{font-size:20px!important;}

  .supLayout,.repasoLayout,.noConfLayout,.tribunalGrid,.cantorGrid,
  .examRandomGrid,.fallosLayout,.rutaStudySplit{
    grid-template-columns:1fr!important;
  }
  .falloFormGrid,.falloFormGrid.two,.rutaStudyGrid,.examSelectorGrid,
  .fichaCoreGrid,.fichaStatsGrid{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
  }
  .repasoStats{grid-template-columns:repeat(2,minmax(0,1fr))!important;}
  .moduleActions > button,.tribunalActions > button,.miniBar > button{
    min-height:44px!important;
  }
  .moduleTextarea,.tribunalTextarea{font-size:16px!important;}
  .comparoModalBox,.planModalBox{
    width:calc(100vw - 24px)!important;
    max-height:calc(100vh - 24px - var(--ipad-safe-top) - var(--ipad-safe-bottom))!important;
  }
}

/* 8 · iPad vertical / estrecho: una columna real, sin solapamientos. */
@media (pointer:coarse) and (max-width:900px){
  .sideContent{padding:12px 12px calc(20px + var(--ipad-safe-bottom))!important;}
  .contentCard,.modulePanel,.lolaCard,.emptyState{padding:14px!important;border-radius:18px!important;}
  .contentCard h4,.modulePanel h4,.lolaCard h4{font-size:19px!important;}

  .supLayout,.repasoLayout,.noConfLayout,.tribunalGrid,.cantorGrid,
  .examRandomGrid,.fallosLayout,.falloFormGrid,.falloFormGrid.two,
  .planGrid,.rutaStudyGrid,.rutaStudySplit,.examSelectorGrid,.examTopicGrid,
  .fichaCoreGrid,.fichaStatsGrid,.repasoStats,.compactGrid{
    grid-template-columns:1fr!important;
  }
  .moduleActions,.tribunalActions,.miniBar{display:grid!important;grid-template-columns:1fr!important;}
  .moduleActions > button,.tribunalActions > button,.miniBar > button{
    width:100%!important;min-height:46px!important;
  }
  .badgeRow,.moduleBadges{gap:6px!important;}
  .comparoModalBox,.planModalBox{
    width:calc(100vw - 16px)!important;
    max-height:calc(100vh - 16px - var(--ipad-safe-top) - var(--ipad-safe-bottom))!important;
    border-radius:18px!important;
  }
}

/* 9 · Evitar animaciones accesorias si el sistema pide movimiento reducido. */
@media(prefers-reduced-motion:reduce){
  .rightPanel *,.sideRail *{scroll-behavior:auto!important;}
}