/* LAIREN / Enfrentamientos / Arquetipo A — teléfono v11.
   Aislamiento: no afecta el meta general, A vs B ni escritorio. */
@media(max-width:700px){
  /* Selectores A / VS / B en una sola fila. Filtros queda debajo. */
  .mu-page[data-view="A_SELECTED"] .mu-topbar{
    display:flex!important;flex-direction:column!important;align-items:stretch!important;
    gap:8px!important;height:auto!important;min-height:0!important
  }
  .mu-page[data-view="A_SELECTED"] .mu-controls{
    display:grid!important;
    grid-template-columns:minmax(0,1fr) 22px minmax(0,1fr)!important;
    grid-template-rows:36px 34px!important;
    gap:6px!important;align-items:center!important;
    width:100%!important;min-width:0!important;margin:0!important
  }
  .mu-page[data-view="A_SELECTED"] .mu-controls>.mu-picker{
    display:block!important;min-width:0!important;width:100%!important;height:36px!important
  }
  .mu-page[data-view="A_SELECTED"] .mu-controls>.mu-picker input{
    display:block!important;width:100%!important;min-width:0!important;
    height:36px!important;min-height:36px!important;padding:0 9px!important;
    font-size:12px!important;overflow:hidden!important;text-overflow:ellipsis
  }
  .mu-page[data-view="A_SELECTED"] .mu-controls>.mu-vs{
    display:flex!important;align-items:center!important;justify-content:center!important;
    grid-column:2!important;grid-row:1!important;
    width:22px!important;height:36px!important;min-height:36px!important;margin:0!important;
    font-size:11px!important
  }
  .mu-page[data-view="A_SELECTED"] .mu-controls>.mu-swap{display:none!important}
  .mu-page[data-view="A_SELECTED"] .mu-controls>.mu-filter-trigger{
    display:flex!important;grid-column:1/-1!important;grid-row:2!important;
    align-items:center!important;justify-content:center!important;
    height:34px!important;min-height:34px!important;width:100%!important;margin:0!important
  }
  .mu-page[data-view="A_SELECTED"] .mu-picker .mu-suggestions{
    top:37px!important;max-height:min(45dvh,250px)!important;z-index:100!important
  }

  /* Métricas sin duplicar el nombre ni la insignia del arquetipo. */
  .mu-page[data-view="A_SELECTED"] .mu-primary-summary>header{display:none!important}
  .mu-page[data-view="A_SELECTED"] .mu-primary-summary{
    display:block!important;height:auto!important;min-height:0!important;max-height:none!important
  }
  .mu-page[data-view="A_SELECTED"] .mu-global-performance{
    display:grid!important;grid-template-columns:33px minmax(0,1fr)!important;
    gap:8px!important;height:auto!important;min-height:0!important;
    padding:9px 10px 4px!important;margin:0!important
  }
  .mu-page[data-view="A_SELECTED"] .mu-primary-identity,
  .mu-page[data-view="A_SELECTED"] .mu-primary-identity .mu-identity{
    display:flex!important;align-items:center!important;justify-content:center!important;
    width:32px!important;height:32px!important;min-width:32px!important;min-height:32px!important
  }
  .mu-page[data-view="A_SELECTED"] .mu-primary-performance{
    display:flex!important;align-items:baseline!important;flex-wrap:wrap!important;
    gap:3px 8px!important;min-height:0!important
  }
  .mu-page[data-view="A_SELECTED"] .mu-primary-performance>strong{font-size:23px!important;line-height:1.1!important}
  .mu-page[data-view="A_SELECTED"] .mu-primary-performance>span{font-size:9px!important}
  .mu-page[data-view="A_SELECTED"] .mu-primary-performance>b{font-size:12px!important}
  .mu-page[data-view="A_SELECTED"] .mu-primary-record{
    display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr))!important;
    gap:4px!important;height:auto!important;min-height:0!important;
    padding:3px 9px!important;margin:0!important
  }
  .mu-page[data-view="A_SELECTED"] .mu-primary-record>div{gap:0!important;min-height:0!important}
  .mu-page[data-view="A_SELECTED"] .mu-primary-record dd{font-size:15px!important;line-height:1!important}
  .mu-page[data-view="A_SELECTED"] .mu-primary-record dt{font-size:8px!important;line-height:1.1!important}
  .mu-page[data-view="A_SELECTED"] .mu-primary-meta{
    display:flex!important;flex-wrap:wrap!important;gap:4px 10px!important;
    padding:3px 11px!important;margin:0!important;font-size:10px!important;line-height:1.2!important
  }
  .mu-page[data-view="A_SELECTED"] .mu-primary-summary>footer{
    min-height:0!important;height:auto!important;padding:4px 11px 8px!important;
    margin:0!important;font-size:10px!important;line-height:1.2!important
  }
  /* Balance en tres estadísticas, sin aro vacío ni espacios muertos. */
  .mu-page[data-view="A_SELECTED"] .mu-balance>header,
  .mu-page[data-view="A_SELECTED"] .mu-challenge>header{
    min-height:29px!important;padding:7px 10px!important
  }
  .mu-page[data-view="A_SELECTED"] .mu-balance>header h2,
  .mu-page[data-view="A_SELECTED"] .mu-challenge>header h2{font-size:11px!important}
  .mu-page[data-view="A_SELECTED"] #balance-summary{
    display:block!important;height:auto!important;min-height:0!important;
    padding:7px 10px 6px!important
  }
  .mu-page[data-view="A_SELECTED"] #balance-summary>.mu-balance-ring{display:none!important}
  .mu-page[data-view="A_SELECTED"] .mu-balance dl{
    display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr))!important;
    gap:5px!important;width:100%!important;height:auto!important;margin:0!important;padding:0!important
  }
  .mu-page[data-view="A_SELECTED"] .mu-balance dl div{display:block!important;min-height:0!important}
  .mu-page[data-view="A_SELECTED"] .mu-balance dd{font-size:13px!important;line-height:1.1!important}
  .mu-page[data-view="A_SELECTED"] .mu-balance dd small{font-size:9px!important}
  .mu-page[data-view="A_SELECTED"] .mu-balance dt{margin:1px 0 0!important;font-size:8px!important;line-height:1.2!important}
  .mu-page[data-view="A_SELECTED"] #balance-summary>p{
    display:block!important;margin:0!important;padding:5px 0 0!important;
    border:0!important;font-size:9px!important;line-height:1.1!important
  }
  /* Más desafiante: rival, rendimiento, WR, registro y evidencia en dos renglones. */
  .mu-page[data-view="A_SELECTED"] #most-challenging{
    display:grid!important;grid-template-columns:minmax(0,1fr) auto!important;
    grid-template-rows:auto auto!important;gap:4px 6px!important;
    align-items:center!important;padding:7px 10px!important
  }
  .mu-page[data-view="A_SELECTED"] .mu-challenge-main{
    grid-column:1/-1!important;grid-row:1!important;
    display:flex!important;gap:7px!important;align-items:center!important
  }
  .mu-page[data-view="A_SELECTED"] .mu-challenge-identity,
  .mu-page[data-view="A_SELECTED"] .mu-challenge-identity .mu-identity{
    width:27px!important;height:27px!important;min-width:27px!important;min-height:27px!important;flex:0 0 27px!important
  }
  .mu-page[data-view="A_SELECTED"] .mu-challenge-copy{
    display:flex!important;flex-direction:row!important;flex-wrap:wrap!important;align-items:baseline!important;
    gap:2px 6px!important;min-width:0!important
  }
  .mu-page[data-view="A_SELECTED"] .mu-challenge-copy>b{font-size:11px!important}
  .mu-page[data-view="A_SELECTED"] .mu-challenge-copy>span{font-size:8px!important}
  .mu-page[data-view="A_SELECTED"] .mu-challenge-copy>strong{font-size:17px!important}
  .mu-page[data-view="A_SELECTED"] .mu-challenge-copy>small{font-size:9px!important}
  .mu-page[data-view="A_SELECTED"] .mu-challenge-record{
    grid-column:2!important;grid-row:2!important;font-size:9px!important;
    padding:0!important;min-height:0!important;white-space:nowrap!important
  }
  .mu-page[data-view="A_SELECTED"] .mu-challenge footer{
    grid-column:1!important;grid-row:2!important;
    padding:0!important;margin:0!important;min-height:0!important;font-size:9px!important
  }

  /* Tabla de rivales sin estilos heredados de tarjetas apiladas. */
  .mu-page[data-view="A_SELECTED"] #matchup-list-results{
    display:block!important;width:100%!important;
    overflow-x:auto!important;overflow-y:auto!important;max-height:min(66dvh,580px)!important;
    overscroll-behavior:contain;-webkit-overflow-scrolling:touch
  }
  .mu-page[data-view="A_SELECTED"] #matchup-list-results .mu-phone-a-table{
    display:block!important;box-sizing:border-box!important;
    width:568px!important;min-width:568px!important;max-width:none!important;
    background:#091827
  }
  .mu-page[data-view="A_SELECTED"] #matchup-list-results .mu-phone-a-head,
  .mu-page[data-view="A_SELECTED"] #matchup-list-results .mu-phone-a-row{
    box-sizing:border-box!important;display:grid!important;
    grid-template-columns:155px 69px 57px 36px 36px 36px 39px 70px 22px!important;
    column-gap:4px!important;align-items:center!important;
    width:568px!important;min-width:568px!important;height:36px!important;min-height:36px!important;
    padding:0 8px!important;margin:0!important;border-radius:0!important
  }
  .mu-page[data-view="A_SELECTED"] #matchup-list-results .mu-phone-a-head{
    position:sticky!important;top:0!important;z-index:7!important;
    height:33px!important;min-height:33px!important;
    background:#071625!important;border-bottom:1px solid #36516a!important
  }
  .mu-page[data-view="A_SELECTED"] #matchup-list-results .mu-phone-a-head>span,
  .mu-page[data-view="A_SELECTED"] #matchup-list-results .mu-phone-a-row>span{
    display:flex!important;align-items:center!important;justify-content:center!important;
    position:static!important;grid-column:auto!important;grid-row:auto!important;
    min-width:0!important;max-width:100%!important;height:auto!important;
    padding:0!important;margin:0!important;overflow:hidden!important;
    white-space:nowrap!important;text-overflow:ellipsis!important
  }
  .mu-page[data-view="A_SELECTED"] #matchup-list-results .mu-phone-a-row{
    appearance:none;border:0!important;border-bottom:1px solid #263f54!important;
    background:#0b1b2b!important;color:#e4edf7!important;cursor:pointer;
    font-family:inherit!important;font-size:10px!important;font-weight:650!important;line-height:1.15!important
  }
  .mu-page[data-view="A_SELECTED"] #matchup-list-results .mu-phone-a-row:nth-child(even){
    background:#10263a!important
  }
  .mu-page[data-view="A_SELECTED"] #matchup-list-results .mu-phone-a-row>span:first-child{
    justify-content:flex-start!important;text-align:left!important;gap:5px!important
  }
  .mu-page[data-view="A_SELECTED"] #matchup-list-results .mu-phone-a-name b{
    font-size:10px!important;font-weight:700!important;overflow:hidden!important;
    white-space:nowrap!important;text-overflow:ellipsis!important
  }
  .mu-page[data-view="A_SELECTED"] #matchup-list-results .mu-phone-a-name .mu-identity,
  .mu-page[data-view="A_SELECTED"] #matchup-list-results .mu-phone-a-name .mu-archetype-badge{
    width:22px!important;height:22px!important;min-width:22px!important;min-height:22px!important;
    flex:0 0 22px!important
  }
  .mu-page[data-view="A_SELECTED"] #matchup-list-results .mu-phone-a-head .mu-a-sort-head{
    display:inline-flex!important;align-items:center!important;justify-content:center!important;
    width:100%!important;max-width:100%!important;min-height:30px!important;
    gap:2px!important;padding:0!important;margin:0!important;
    border:0!important;background:transparent!important;color:#a5b7c8!important;
    font-family:inherit!important;font-size:9px!important;font-weight:750!important;line-height:1!important;
    white-space:nowrap!important;cursor:pointer;touch-action:manipulation
  }
  .mu-page[data-view="A_SELECTED"] #matchup-list-results .mu-phone-a-head>span:first-child .mu-a-sort-head{
    justify-content:flex-start!important
  }
  .mu-page[data-view="A_SELECTED"] #matchup-list-results .mu-phone-a-head .mu-a-sort-head span{
    font-size:9px!important;line-height:1!important
  }
  .mu-page[data-view="A_SELECTED"] #matchup-list-results .mu-phone-a-head .mu-a-sort-head.is-active{
    color:#d7acfa!important
  }
  .mu-page[data-view="A_SELECTED"] #matchup-list-results .mu-phone-a-evidence{font-size:9px!important;color:#c5a9e4!important}
  .mu-page[data-view="A_SELECTED"] #matchup-list-results .mu-phone-a-detail{font-size:16px!important;color:#63c9ff!important}
  .mu-page[data-view="A_SELECTED"] #matchup-list-results .mu-phone-a-row .good{color:#4ad99f!important}
  .mu-page[data-view="A_SELECTED"] #matchup-list-results .mu-phone-a-row .even{color:#e5bd58!important}
  .mu-page[data-view="A_SELECTED"] #matchup-list-results .mu-phone-a-row .bad{color:#ee7181!important}
}


/* Ajuste móvil A_SELECTED v12 — escala tipográfica común y limpieza visual.
   4 niveles: título de pantalla; KPI (15px); texto/títulos (12px); auxiliar (10px). */
@media(max-width:700px){
  .mu-page[data-view="A_SELECTED"]{
    --mu-phone-kpi:15px;
    --mu-phone-copy:12px;
    --mu-phone-caption:10px;
  }

  /* Solo FILTROS. Se conserva la información del período dentro del panel. */
  .mu-page[data-view="A_SELECTED"] #filters-toggle{
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    gap:0!important;
    font-size:var(--mu-phone-copy)!important;
    font-weight:750!important;
  }
  .mu-page[data-view="A_SELECTED"] #filters-toggle #active-filter-count{
    display:none!important;
  }

  /* Métrica principal: mismo tamaño y jerarquía para Performance y WR. */
  .mu-page[data-view="A_SELECTED"] .mu-primary-performance{
    display:flex!important;
    flex-direction:row!important;
    align-items:baseline!important;
    flex-wrap:wrap!important;
    column-gap:7px!important;
    row-gap:2px!important;
  }
  .mu-page[data-view="A_SELECTED"] .mu-primary-performance>strong,
  .mu-page[data-view="A_SELECTED"] .mu-primary-performance>span,
  .mu-page[data-view="A_SELECTED"] .mu-primary-performance>b{
    font-size:var(--mu-phone-kpi)!important;
    line-height:1.2!important;
    margin:0!important;
    letter-spacing:0!important;
    white-space:nowrap!important;
  }
  .mu-page[data-view="A_SELECTED"] .mu-primary-performance>strong{
    font-weight:800!important;
  }
  .mu-page[data-view="A_SELECTED"] .mu-primary-performance>span{
    font-weight:600!important;
  }
  .mu-page[data-view="A_SELECTED"] .mu-primary-performance>b{
    font-weight:750!important;
  }

  /* La tarjeta Más desafiante se retira de esta vista de teléfono. */
  .mu-page[data-view="A_SELECTED"] .mu-a-main>.mu-challenge{
    display:none!important;
  }

  /* Tipografía unificada para las tarjetas restantes. */
  .mu-page[data-view="A_SELECTED"] .mu-primary-record dd,
  .mu-page[data-view="A_SELECTED"] .mu-balance dd{
    font-size:var(--mu-phone-kpi)!important;
    line-height:1.15!important;
  }
  .mu-page[data-view="A_SELECTED"] .mu-primary-record dt,
  .mu-page[data-view="A_SELECTED"] .mu-balance dt,
  .mu-page[data-view="A_SELECTED"] .mu-balance dd small{
    font-size:var(--mu-phone-caption)!important;
  }
  .mu-page[data-view="A_SELECTED"] .mu-primary-meta,
  .mu-page[data-view="A_SELECTED"] .mu-primary-summary>footer,
  .mu-page[data-view="A_SELECTED"] #balance-summary>p,
  .mu-page[data-view="A_SELECTED"] #matchup-list-note{
    font-size:var(--mu-phone-caption)!important;
    line-height:1.3!important;
  }
  .mu-page[data-view="A_SELECTED"] .mu-balance>header h2,
  .mu-page[data-view="A_SELECTED"] .mu-rivals>header h2,
  .mu-page[data-view="A_SELECTED"] .mu-reading>header h2,
  .mu-page[data-view="A_SELECTED"] .mu-reading h3{
    font-size:var(--mu-phone-copy)!important;
    line-height:1.25!important;
    letter-spacing:0!important;
  }
  .mu-page[data-view="A_SELECTED"] .mu-reading>header>span,
  .mu-page[data-view="A_SELECTED"] .mu-reading-list li small{
    font-size:var(--mu-phone-caption)!important;
    line-height:1.35!important;
  }
  .mu-page[data-view="A_SELECTED"] .mu-reading p,
  .mu-page[data-view="A_SELECTED"] .mu-reading-list li b,
  .mu-page[data-view="A_SELECTED"] .mu-reading-list li strong{
    font-size:var(--mu-phone-copy)!important;
    line-height:1.35!important;
  }
  .mu-page[data-view="A_SELECTED"] #matchup-list-results .mu-phone-a-head .mu-a-sort-head,
  .mu-page[data-view="A_SELECTED"] #matchup-list-results .mu-phone-a-head .mu-a-sort-head span,
  .mu-page[data-view="A_SELECTED"] #matchup-list-results .mu-phone-a-row,
  .mu-page[data-view="A_SELECTED"] #matchup-list-results .mu-phone-a-name b,
  .mu-page[data-view="A_SELECTED"] #matchup-list-results .mu-phone-a-evidence{
    font-size:var(--mu-phone-caption)!important;
  }

  /* Evidencia: «0 Alta  /  3 Media  /  32 Baja». Separadores reales y legibles. */
  .mu-page[data-view="A_SELECTED"] .mu-reading-evidence{
    display:flex!important;
    flex-wrap:wrap!important;
    grid-template-columns:none!important;
    align-items:center!important;
    gap:6px 10px!important;
    width:100%!important;
    margin:0 0 9px!important;
  }
  .mu-page[data-view="A_SELECTED"] .mu-reading-evidence>span{
    display:inline-flex!important;
    position:relative!important;
    align-items:baseline!important;
    justify-content:flex-start!important;
    gap:5px!important;
    width:auto!important;
    min-height:0!important;
    padding:0!important;
    border:0!important;
    border-radius:0!important;
    background:transparent!important;
    font-size:var(--mu-phone-copy)!important;
    line-height:1.3!important;
    white-space:nowrap!important;
  }
  .mu-page[data-view="A_SELECTED"] .mu-reading-evidence>span:not(:first-child)::before{
    content:"/"!important;
    display:inline-block!important;
    color:#7892a8!important;
    margin-right:4px!important;
  }
  .mu-page[data-view="A_SELECTED"] .mu-reading-evidence>span>b{
    display:inline!important;
    font-size:var(--mu-phone-kpi)!important;
    line-height:1.1!important;
    margin:0!important;
    padding:0!important;
  }
}
