/* DPX v0.6.1 patches 14-18: display/input-only final responsive layer. */

/* Patch 14: largest safe prediction typography at non-phone sizes. */
body#dpxRoot #predictions .prediction-table-head { font-size: clamp(10px, .82vw, 14px) !important; }
body#dpxRoot #predictions .prediction-action-cell .pred-side { font-size: clamp(13px, 1vw, 18px) !important; }
body#dpxRoot #predictions .prediction-action-cell :is(.pred-minute, .pred-conf),
body#dpxRoot #predictions .prediction-info-cell,
body#dpxRoot #predictions .prediction-info-cell * { font-size: clamp(10px, .82vw, 14px) !important; }

@media (max-width: 600px) and (orientation: portrait) {
  /* Patch 14: use every safe pixel while retaining one complete five-column row. */
  html body#dpxRoot.phone-tab-layout .trade-card #predictions .prediction-mobile-head,
  html body#dpxRoot.phone-tab-layout .trade-card #predictions .prediction-mobile-row {
    grid-template-columns: minmax(136px, 1.42fr) minmax(58px, .61fr) minmax(40px, .42fr) minmax(36px, .38fr) minmax(50px, .52fr) !important;
  }
  html body#dpxRoot.phone-tab-layout .trade-card #predictions .prediction-mobile-action-stack,
  html body#dpxRoot.phone-tab-layout .trade-card #predictions .prediction-mobile-action-stack .prediction-action-cell {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
  }
  body#dpxRoot .prediction-mobile-head > span { font-size: clamp(8px, 2.35vw, 10px) !important; }
  body#dpxRoot .prediction-mobile-head > span:last-child { font-size: clamp(7px, 2.05vw, 8.5px) !important; }
  body#dpxRoot .prediction-mobile-row { min-height: 40px !important; height: 40px !important; max-height: 40px !important; }
  body#dpxRoot .prediction-mobile-row .prediction-action-cell { padding-inline: 2px !important; }
  body#dpxRoot .prediction-mobile-row .pred-side { font-size: clamp(14px, 4vw, 16px) !important; }
  body#dpxRoot .prediction-mobile-row :is(.pred-minute, .pred-conf),
  body#dpxRoot .prediction-mobile-row > span em,
  body#dpxRoot .prediction-mobile-row .prediction-countdown-value { font-size: clamp(9px, 2.7vw, 11px) !important; }
  body#dpxRoot .prediction-mobile-row > span b { font-size: clamp(7px, 2.15vw, 9px) !important; }

  /* Patch 15: Swap/Restore never introduces a fixed stage or horizontal escape. */
  html body#dpxRoot.phone-tab-layout.manual-trend-swapped,
  html body#dpxRoot.phone-tab-layout.manual-trend-swapped :is(.app-shell,.demo-layout,.trade-card,.trade-market-row,.prediction-workbench,.prediction-panel,#predictions,.phone-tab-panels) {
    box-sizing: border-box !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    height: auto !important;
    max-height: none !important;
    overflow-x: hidden !important;
    overflow-y: visible !important;
  }
  html body#dpxRoot.phone-tab-layout.manual-trend-swapped #phoneTabPanels > .trade-card[aria-hidden="false"] {
    display: block !important;
    position: static !important;
    inset: auto !important;
  }
  html body#dpxRoot.phone-tab-layout :is(.phone-tab-panels,#phoneHistoryPanel) { max-width: 100% !important; overflow-x: hidden !important; }
  html body#dpxRoot.phone-tab-layout #ledgerTableWrap { max-width: 100% !important; overflow-x: auto !important; }

  /* Patch 18: 16px prevents iOS focus zoom; panels scroll around the keyboard. */
  html body#dpxRoot.phone-tab-layout .phone-auto-panel :is(input.text-input, textarea.condition-input, select.select-input),
  html body#dpxRoot.phone-tab-layout #phoneSettingPanel :is(input, textarea, select) {
    font-size: 16px !important;
    line-height: 1.25 !important;
    min-height: 36px !important;
    touch-action: manipulation;
  }
  html body#dpxRoot.phone-tab-layout #phoneSettingPanel[aria-hidden="false"] {
    overflow: visible !important;
    height: auto !important;
    max-height: none !important;
  }
}

@media (max-width: 370px) and (orientation: portrait) {
  html body#dpxRoot.phone-tab-layout .prediction-mobile-row .pred-side { font-size: 13.5px !important; }
  html body#dpxRoot.phone-tab-layout .prediction-mobile-row :is(.pred-minute,.pred-conf) { font-size: 8px !important; }
}

@media (orientation: landscape) and (max-height: 600px) and (max-width: 1100px) {
  /* Patches 14/17: full button text plus four adjacent values, without clipping. */
  body#dpxRoot .trade-card #predictions.prediction-table-layout {
    grid-template-columns: minmax(154px, 1.56fr) minmax(72px, .73fr) minmax(55px, .56fr) minmax(48px, .49fr) minmax(60px, .61fr) !important;
    width: 100% !important;
    min-width: 0 !important;
  }
  body#dpxRoot #predictions .prediction-action-cell {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) max-content max-content !important;
    gap: 4px !important;
    width: 100% !important;
    min-width: 0 !important;
    padding-inline: 6px !important;
    overflow: visible !important;
  }
  body#dpxRoot #predictions .prediction-action-cell .pred-side { font-size: clamp(12px, 1.55vw, 15px) !important; }
  body#dpxRoot #predictions .prediction-action-cell :is(.pred-minute, .pred-conf),
  body#dpxRoot #predictions .prediction-info-cell,
  body#dpxRoot #predictions .prediction-info-cell * { font-size: clamp(9px, 1.15vw, 11px) !important; }
  body#dpxRoot #predictions .prediction-table-head { font-size: clamp(9px, 1.15vw, 11px) !important; }

  /* Patch 18 applies in rotated-phone settings as well. */
  html body#dpxRoot :is(#autoTradingCard,.phone-auto-panel) :is(input.text-input, textarea.condition-input, select.select-input) {
    font-size: 16px !important;
    min-height: 34px !important;
    touch-action: manipulation;
  }
}