@import url("./styles.v166.css?release=v409");

/*
 * v412: Redmi/MIUI can report a phone-shaped portrait viewport wider than
 * 700 CSS pixels. The desktop level dashboard uses a 19.5rem minimum column;
 * after the phone font scaling that column can consume almost the whole
 * screen and crush the course pane. Restore the normal single-column phone
 * flow for this specific tall-portrait surface.
 */
@media (orientation: portrait) and (min-width: 700px) and (max-aspect-ratio: 2 / 3) {
  body[data-route="level"] #view > div.level-page {
    display: flex !important;
    height: auto;
    min-height: 0;
    max-height: none;
    overflow: visible;
  }

  body[data-route="level"] .level-left-pane,
  body[data-route="level"] .level-right-pane {
    width: 100%;
    height: auto;
    min-height: 0;
    overflow: visible;
    padding-right: 0;
    padding-bottom: 0;
  }

  body[data-route="level"] .level-module-list,
  body[data-route="level"] #word-list {
    max-height: none;
    overflow: visible;
  }
}
