/* v58.70 – no-scroll portrait lesson and placement. A full-width chessboard
   remains square; secondary UI uses the remaining viewport, never scrollbars.
   Kept separate from the v58.69 stylesheet so existing desktop rules survive. */
@media (max-width:799px) and (orientation:portrait) {
  .mastery-shell .mastery-lesson-screen {
    height:100dvh; overflow:hidden!important; overscroll-behavior:none;
  }
  .mastery-shell .mastery-lesson-layout {
    box-sizing:border-box; height:100%; min-height:0; max-height:100%;
    padding: max(3px, env(safe-area-inset-top)) 0 max(11px, env(safe-area-inset-bottom));
    gap:3px; overflow:hidden;
  }
  .mastery-shell .mastery-lesson-header {
    flex:0 0 39px; height:39px; min-height:0; margin-inline:7px;
    gap:7px; overflow:hidden;
  }
  .mastery-shell .mastery-lesson-header .mastery-lesson-back {
    width:33px; height:33px; min-width:33px; border-radius:10px;
  }
  .mastery-shell .mastery-lesson-header .mastery-lesson-heading small {
    display:block; font-size:.59rem; line-height:1.35;
  }
  .mastery-shell .mastery-lesson-header .mastery-lesson-heading h2 {
    font-size:clamp(.84rem,3.3vw,1.05rem); line-height:1.35;
  }
  .mastery-shell .mastery-lesson-header .mastery-lesson-counter {
    min-width:53px;
  }
  .mastery-shell .mastery-lesson-progress-row {
    flex:0 0 16px; height:16px; min-height:0; margin-inline:7px;
    gap:7px; grid-template-columns:minmax(0,1fr) auto;
  }
  .mastery-shell .mastery-lesson-progress-row progress {height:7px;}
  .mastery-shell .mastery-lesson-rating {
    font-size:.61rem; padding:2px 7px; min-width:0;
  }
  .mastery-shell .mastery-lesson-main {
    box-sizing:border-box; display:flex!important; flex:1 1 0; flex-direction:column;
    align-items:stretch; justify-content:flex-start; gap:3px; min-height:0;
    overflow:hidden!important; padding:0;
  }
  .mastery-shell .mastery-lesson-board-column {
    box-sizing:border-box; flex:0 0 100vw; order:0; width:100vw;
    height:100vw; max-height:none; min-height:0;
    align-items:stretch; justify-content:center;
  }
  .mastery-shell .mastery-lesson-board-frame {
    box-sizing:border-box; display:block; flex:0 0 100%;
    width:100%!important; height:100%!important;
    max-width:none!important; aspect-ratio:1; margin:0;
    border:0!important; border-radius:0!important; box-shadow:none!important;
  }
  .mastery-shell .mastery-lesson-panel {
    box-sizing:border-box; flex:1 1 0; order:1; width:auto;
    min-height:0; height:auto; align-self:stretch; justify-self:stretch;
    margin:0 5px; padding:5px 8px 6px; border-radius:13px;
    display:grid; grid-template-rows:minmax(0,1fr) auto; gap:3px;
    overflow:hidden; box-shadow:none;
  }
  .mastery-shell .mastery-lesson-task {
    box-sizing:border-box; min-height:0; display:grid;
    grid-template-columns:minmax(0,1fr) minmax(0,1.12fr);
    grid-template-rows:auto auto; align-items:center;
    gap:1px 6px; overflow:hidden;
  }
  .mastery-shell .mastery-mascot-assistant {
    grid-column:1; grid-row:1/3;
    display:flex!important; align-items:center;
    box-sizing:border-box; width:100%; height:100%; min-height:0;
    padding:1px 4px; margin:0; gap:4px; border-radius:10px;
  }
  .mastery-shell .mastery-assistant-pawn {
    display:grid; flex:0 0 var(--km-mascot-size,clamp(82px, min(30vw,16dvh),128px));
    width:var(--km-mascot-size,clamp(82px, min(30vw,16dvh),128px)); min-width:var(--km-mascot-size,clamp(82px, min(30vw,16dvh),128px));
    height:var(--km-mascot-size,clamp(82px, min(30vw,16dvh),128px)); max-height:100%;
  }
  .mastery-shell .mastery-assistant-speech {
    flex:1; min-width:0; font-size:clamp(.57rem,2.1vw,.76rem);
    line-height:1.32; display:-webkit-box; -webkit-line-clamp:3;
    -webkit-box-orient:vertical; overflow:hidden;
  }
  .mastery-shell .mastery-companion-hud {
    grid-column:2; grid-row:1; margin:0; gap:3px;
    flex-wrap:wrap; justify-content:center;
  }
  .mastery-shell .mastery-companion-level-chip,
  .mastery-shell .mastery-companion-energy-chip {
    padding:3px 5px; font-size:.65rem;
  }
  .mastery-shell .mastery-companion-energy-chip [data-energy-meter]{display:none;}
  .mastery-shell .mastery-lesson-meta {
    grid-column:2; grid-row:2; margin:0; gap:0; min-width:0;
    justify-content:center;
  }
  .mastery-shell .mastery-companion-rating-chip {
    max-width:100%; font-size:clamp(.53rem,1.9vw,.67rem);
    padding:3px 6px; gap:3px; white-space:normal; line-height:1.25;
    text-align:center;
  }
  .mastery-shell .mastery-lesson-kicker {display:none;}
  .mastery-shell [data-mission-puzzle-title] {display:none!important;}
  .mastery-shell .mastery-lesson-task [data-mission-status] {
    grid-column:1/-1; grid-row:3; margin:1px 0 0;
    min-height:0; line-height:1.25; font-size:clamp(.64rem,2.35vw,.79rem);
    max-height:2.5em; overflow:hidden; text-align:center;
  }
  .mastery-shell .mastery-lesson-actions {
    display:grid; grid-template-columns:repeat(2,minmax(0,1fr));
    flex-wrap:nowrap; gap:5px; margin:0;
  }
  .mastery-shell .mastery-lesson-action {
    min-height:31px; padding:4px 6px; font-size:.7rem;
    border-radius:9px; min-width:0; box-shadow:none;
  }

  /* In short portrait viewports nonessential wording is folded down. The
     character, board and essential controls remain usable. */
  .mastery-shell .mastery-lesson-screen.km-fit-tight .mastery-lesson-panel {
    padding:3px 6px 4px; gap:2px;
  }
  .mastery-shell .mastery-lesson-screen.km-fit-tight .mastery-assistant-pawn {
    --km-mascot-size:66px;
  }
  .mastery-shell .mastery-lesson-screen.km-fit-tight .mastery-assistant-speech {
    -webkit-line-clamp:2; font-size:.6rem;
  }
  .mastery-shell .mastery-lesson-screen.km-fit-tight .mastery-lesson-action {
    min-height:28px; font-size:.66rem;
  }
  .mastery-shell .mastery-lesson-screen.km-fit-tight [data-mission-status] {
    font-size:.65rem; white-space:nowrap; text-overflow:ellipsis;
  }
  .mastery-shell .mastery-lesson-screen.km-fit-ultra .mastery-lesson-header {
    height:31px; flex-basis:31px;
  }
  .mastery-shell .mastery-lesson-screen.km-fit-ultra .mastery-lesson-header .mastery-lesson-heading small,
  .mastery-shell .mastery-lesson-screen.km-fit-ultra .mastery-assistant-speech,
  .mastery-shell .mastery-lesson-screen.km-fit-ultra .mastery-lesson-meta {
    display:none!important;
  }
  .mastery-shell .mastery-lesson-screen.km-fit-ultra .mastery-lesson-progress-row {
    height:12px; flex-basis:12px;
  }
  .mastery-shell .mastery-lesson-screen.km-fit-ultra .mastery-lesson-panel {
    padding:2px 4px; grid-template-rows:minmax(0,1fr) auto; gap:1px;
  }
  .mastery-shell .mastery-lesson-screen.km-fit-ultra .mastery-lesson-task {
    grid-template-columns:66px minmax(0,1fr);
    grid-template-rows:minmax(0,1fr); gap:3px;
  }
  .mastery-shell .mastery-lesson-screen.km-fit-ultra .mastery-mascot-assistant {
    grid-column:1; grid-row:1; padding:0; border:0; background:none!important;
  }
  .mastery-shell .mastery-lesson-screen.km-fit-ultra .mastery-assistant-pawn {
    --km-mascot-size:clamp(43px, calc(100dvh - 100vw - 110px), 64px);
  }
  .mastery-shell .mastery-lesson-screen.km-fit-ultra .mastery-companion-hud {
    grid-column:2; grid-row:1; align-self:start;
  }
  .mastery-shell .mastery-lesson-screen.km-fit-ultra [data-mission-status]{
    display:block; grid-column:2; grid-row:1; align-self:end;
    font-size:.61rem; white-space:nowrap; text-overflow:ellipsis;
  }
  .mastery-shell .mastery-lesson-screen.km-fit-ultra .mastery-lesson-action {
    min-height:25px; padding:1px 4px; font-size:.64rem;
  }

  .mastery-shell .mastery-placement-dialog {
    box-sizing:border-box; position:fixed; inset:0; margin:0; padding:0;
    width:100vw; max-width:100vw; height:100dvh; max-height:100dvh;
    overflow:hidden!important; overscroll-behavior:none;
  }
  .mastery-shell .mastery-placement-modal {
    box-sizing:border-box; display:flex; flex-direction:column;
    width:100%; height:100%; max-height:100%; min-height:0;
    padding:max(3px,env(safe-area-inset-top)) 0 max(3px,env(safe-area-inset-bottom));
    gap:3px; overflow:hidden;
  }
  .mastery-shell .mastery-placement-head {
    flex:0 0 39px; height:39px; min-height:0;
    margin-inline:7px; align-items:center; overflow:hidden;
  }
  .mastery-shell .mastery-placement-head .mastery-placement-kicker{display:none;}
  .mastery-shell .mastery-placement-head h2 {
    margin:0; font-size:clamp(.85rem,3.2vw,1.06rem); line-height:1.35;
    white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
  }
  .mastery-shell .mastery-placement-head button {
    flex:0 0 32px; width:32px; height:32px; border-radius:9px;
  }
  .mastery-shell .mastery-placement-progress-row {
    flex:0 0 17px; height:17px; min-height:0; margin-inline:7px;
    gap:8px; font-size:.67rem;
  }
  .mastery-shell .mastery-placement-progress-row progress {height:7px;}
  .mastery-shell .mastery-placement-content {
    box-sizing:border-box; flex:1 1 0; min-height:0; width:100%;
    display:flex!important; flex-direction:column; align-items:stretch;
    gap:3px; overflow:hidden;
  }
  .mastery-shell .mastery-placement-board-wrap {
    box-sizing:border-box; display:block; flex:0 0 100vw;
    width:100vw!important; max-width:none!important;
    height:100vw!important; aspect-ratio:1;
    margin:0; padding:0; border:0; border-radius:0;
    box-shadow:none; overflow:hidden;
  }
  .mastery-shell .mastery-placement-side {
    box-sizing:border-box; flex:1 1 0; min-height:0; width:auto;
    margin:0 5px; padding:3px 7px; gap:2px 6px;
    display:grid!important;
    grid-template-columns:clamp(62px, min(23vw, 12dvh), 115px) minmax(0,1fr) auto;
    grid-template-rows:auto auto auto;
    align-content:start; align-items:center; justify-items:stretch;
    overflow:hidden;
  }
  .mastery-shell .mastery-placement-character {
    grid-column:1; grid-row:1/3;
    width:clamp(62px, min(23vw, 12dvh), 115px);
    height:clamp(67px, min(25vw, 13dvh), 122px);
    min-height:0; margin:0;
    justify-self:center; align-self:center;
  }
  .mastery-shell .mastery-placement-turn {
    box-sizing:border-box; grid-column:2; grid-row:1;
    justify-self:start; font-size:clamp(.57rem,2vw,.73rem);
    padding:3px 7px; white-space:normal; line-height:1.3;
  }
  .mastery-shell .mastery-placement-category {
    grid-column:2; grid-row:2; justify-self:start;
    font-size:.63rem; padding:2px 6px; white-space:nowrap;
    max-width:100%; overflow:hidden; text-overflow:ellipsis;
  }
  .mastery-shell .mastery-placement-side [data-placement-message] {
    grid-column:1/-1; grid-row:3; margin:0;
    font-size:clamp(.63rem,2.2vw,.8rem); line-height:1.35;
    text-align:center; max-height:2.7em; overflow:hidden;
  }
  .mastery-shell .mastery-placement-side > small {display:none;}
  .mastery-shell .mastery-placement-skip,
  .mastery-shell .mastery-placement-done-button {
    grid-column:3; grid-row:1/3; justify-self:end;
    min-height:32px; max-width:110px; padding:4px 7px;
    font-size:.66rem; white-space:normal; line-height:1.3;
  }
  .mastery-shell .mastery-placement-result {
    grid-column:1/-1; grid-row:4; min-width:0;
    overflow:auto; max-height:100%;
  }
  .mastery-shell .mastery-placement-dialog.km-fit-tight .mastery-placement-character {
    width:45px; height:48px;
  }
  .mastery-shell .mastery-placement-dialog.km-fit-tight .mastery-placement-side {
    grid-template-columns:47px minmax(0,1fr) auto;
    padding:2px 6px; gap:0 3px;
  }
  .mastery-shell .mastery-placement-dialog.km-fit-tight [data-placement-message] {
    font-size:.62rem; white-space:nowrap; text-overflow:ellipsis;
  }
  .mastery-shell .mastery-placement-dialog.km-fit-ultra .mastery-placement-head {
    flex-basis:30px; height:30px;
  }
  .mastery-shell .mastery-placement-dialog.km-fit-ultra .mastery-placement-progress-row {
    flex-basis:12px; height:12px;
  }
  .mastery-shell .mastery-placement-dialog.km-fit-ultra .mastery-placement-character,
  .mastery-shell .mastery-placement-dialog.km-fit-ultra .mastery-placement-category {
    display:none!important;
  }
  .mastery-shell .mastery-placement-dialog.km-fit-ultra .mastery-placement-side {
    grid-template-columns:minmax(0,1fr) auto; grid-template-rows:1fr auto;
  }
  .mastery-shell .mastery-placement-dialog.km-fit-ultra .mastery-placement-turn {
    grid-column:1; grid-row:1; padding:2px 5px;
  }
  .mastery-shell .mastery-placement-dialog.km-fit-ultra .mastery-placement-skip {
    grid-column:2; grid-row:1; min-height:26px;
  }
  .mastery-shell .mastery-placement-dialog.km-fit-ultra [data-placement-message] {
    display:block; grid-column:1/-1; grid-row:2;
    font-size:.6rem; line-height:1.25;
    white-space:nowrap; text-overflow:ellipsis; max-height:1.25em;
  }
  .mastery-shell .mastery-placement-dialog.km-fit-ultra .mastery-placement-result {
    grid-column:1/-1; grid-row:2;
  }
  /* An ended placement exam hides its board and uses the newly available room
     to display the complete, untruncated result and actions. */
  .mastery-shell .mastery-placement-board-wrap[hidden] + .mastery-placement-side {
    flex:1 1 auto; display:flex!important; flex-direction:column;
    justify-content:center; align-items:stretch; gap:10px;
    padding:12px 16px; overflow:auto;
  }
  .mastery-shell .mastery-placement-board-wrap[hidden] + .mastery-placement-side .mastery-placement-result {
    overflow:visible; max-height:none;
  }
}
@media (prefers-reduced-motion:reduce){
  .mastery-shell .mastery-placement-side *,
  .mastery-shell .mastery-lesson-panel * {scroll-behavior:auto;}
}
@media (max-width:799px) and (orientation:portrait) {
  .mastery-shell .mastery-lesson-screen.km-fit-micro .mastery-mascot-assistant {
    display:none!important;
  }
  .mastery-shell .mastery-lesson-screen.km-fit-micro .mastery-lesson-task {
    display:grid; grid-template-columns:minmax(0,1fr);
    grid-template-rows:auto auto; align-items:center; justify-content:center;
  }
  .mastery-shell .mastery-lesson-screen.km-fit-micro .mastery-companion-hud {
    grid-column:1; grid-row:1;
  }
  .mastery-shell .mastery-lesson-screen.km-fit-micro [data-mission-status] {
    display:block; grid-column:1; grid-row:2; font-size:.6rem;
  }
  .mastery-shell .mastery-lesson-screen.km-fit-micro .mastery-lesson-progress-row {
    display:none;
  }
  .mastery-shell .mastery-lesson-screen.km-fit-micro .mastery-lesson-panel {
    padding:1px 4px; gap:1px;
  }
}
