/* [SL-341] Móvil como una app (≤600 px). Se carga la ÚLTIMA hoja: solo sobrescribe.
 * Antes: margen de #tw-root (14) + .wj-shell/.wd-page (16) + relleno de tarjeta (16-24) → el texto empezaba
 * a 31-75 px del borde en una pantalla de 375 y todo parecía una web estrecha y centrada.
 * Ahora: un solo margen de 12 px y las tarjetas principales van de borde a borde, como bandas. */
@media (max-width: 600px) {
  .tw-main { padding-left: 12px !important; padding-right: 12px !important; }
  /* Segundo margen lateral que se sumaba al de .tw-main. */
  .wj-shell, .wd-page { padding-left: 0 !important; padding-right: 0 !important; }
  /* Hueco de ~38 px bajo la cabecera (12 + 12 + 14) → 12. */
  .wj-shell { padding-top: 0 !important; }
  .wj-shell > div:first-child > .mp:first-child { margin-top: 0 !important; }

  /* Tarjetas con relleno propio → bandas a todo el ancho, 16 px de relleno lateral. */
  :is(.wa, .wd-panel, .wd-narrative, .wd-onboarding, .wj-brain, .wj-brief, .wj-research, .wj-card, .wj-legacy-history,
      .tw-narr-card, .tw-radar-summary, .tw-narr-conclusion, .tw-score-metric, .tw-ticker-row, .tw-cat-item,
      .op-card, .op-method, .tw-etf-card, .tw-ea-card, .tw-agenda, .tw-analyzer-empty, .tw-analyzer-picker,
      .tw-precios-block, .tw-precios-card, .ri-hero, .ri-team, .ri-reason, .ri-today-change, .ri-today-focus, .ri-change,
      .ri-day-schedule, .da-root, .mb-entry) {
    margin-left: -12px !important; margin-right: -12px !important;
    border-left-width: 0 !important; border-right-width: 0 !important; border-radius: 0 !important;
    padding-left: 16px !important; padding-right: 16px !important;
    max-width: none !important; box-sizing: border-box;
  }
  /* Contenedores cuyo relleno está en las secciones internas: solo se ensanchan. */
  :is(.mp, .rt-panel, .tw-conf-card) {
    margin-left: -12px !important; margin-right: -12px !important;
    border-left-width: 0 !important; border-right-width: 0 !important; border-radius: 0 !important;
    max-width: none !important;
  }
  .mp :is(.mp-ph, .mp-state, .mp-legend, .mp-detail) { padding-left: 16px; padding-right: 16px; }
  /* Tesis del Radar: la tarjeta interior no repite margen. */
  .rt-section .rt-card { padding-left: 14px; padding-right: 14px; }
}
