/* MOBILE-01B: mantiene accesibles los paneles y paletas en teléfonos apaisados.
   Los lienzos conservan touch-action:none para que el trazo siga directo. */
@media (orientation: landscape) and (max-width: 900px) {
  #trivia.active:has(.pfe.creator-v1) .pfe-layout:has(> .pfe-toolbox) {
    grid-template-columns: minmax(0, 1fr) minmax(200px, min(280px, 42vw));
    gap: 6px;
  }

  #trivia.active:has(.pfe.creator-v1) .pfe-toolbox {
    min-width: 0;
    min-height: 0;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    overscroll-behavior: contain;
    -webkit-overflow-scrolling: touch;
    touch-action: pan-y;
    scrollbar-width: thin;
  }

  #trivia.active:has(.pfe.creator-v1) .pfe-toolbox > .pfe-panel[open] {
    min-height: 0;
    flex: 0 0 auto !important;
    overflow: visible !important;
  }

  #trivia.active:has(.pfe.creator-v1) .pfe-toolbox > .pfe-panel[open] > .pfe-panel-body {
    flex: 0 0 auto !important;
    min-height: 0;
    max-height: none !important;
    overflow: visible !important;
  }

  #modo-pintar.active:has(.free-shell) .fp-palette,
  #modo-pintar.active:has(.pv3-shell) .pv3-palette {
    min-height: 0;
    max-height: 100%;
    overflow-x: hidden;
    overflow-y: auto;
    align-content: start;
    overscroll-behavior: contain;
    -webkit-overflow-scrolling: touch;
    touch-action: pan-y;
    scrollbar-width: thin;
  }

  #modo-pintar.active:has(.free-shell) .fp-actions,
  #modo-pintar.active:has(.pv3-shell) .pv3-actions {
    min-height: 0;
    max-height: 100%;
    overflow-x: hidden;
    overflow-y: auto;
    align-content: start;
    overscroll-behavior: contain;
    -webkit-overflow-scrolling: touch;
    touch-action: pan-y;
    scrollbar-width: thin;
  }
}