/* V70 — Keep question action controls immediately below the answer options.
   Layout-only enhancement. It does not change questions, options, answers, scoring or timer behaviour. */

/* In examination mode, let the question side scroll naturally instead of
   stretching the question area and pushing its controls to the viewport floor. */
body.mce-exam-active #quizArena .quiz-question-column{
  overflow:auto!important;
  overscroll-behavior:contain;
}
body.mce-exam-active #quizArena .single-question-stage{
  height:auto!important;
  min-height:100%!important;
  display:block!important;
}
body.mce-exam-active #quizArena .single-question-mode{
  flex:none!important;
  min-height:0!important;
  overflow:visible!important;
  padding-bottom:8px!important;
}
body.mce-exam-active #quizArena .single-question-nav{
  position:static!important;
  bottom:auto!important;
  margin:0 12px 14px!important;
  padding:10px!important;
  border:1px solid #d8e2ec!important;
  border-radius:12px!important;
  background:#f8fafc!important;
  box-shadow:0 5px 14px rgba(17,49,84,.07)!important;
}

/* Keep the controls compact and easy to tap. */
body.mce-exam-active #quizArena .single-question-nav:not(.hidden){
  display:grid!important;
  grid-template-columns:minmax(120px,.85fr) minmax(130px,1fr) minmax(230px,1.6fr)!important;
  gap:8px!important;
  align-items:stretch!important;
}
body.mce-exam-active #quizArena .single-question-nav .question-status-row,
body.mce-exam-active #quizArena .single-question-nav .question-nav-buttons{
  display:grid!important;
  gap:8px!important;
  margin:0!important;
}
body.mce-exam-active #quizArena .single-question-nav .question-nav-buttons{
  grid-template-columns:1fr 1.2fr!important;
}
body.mce-exam-active #quizArena .single-question-nav .question-action-btn{
  min-height:42px!important;
  width:100%!important;
  margin:0!important;
}

/* Genuine mobile viewport: stack into two clean rows and keep generous tap targets. */
@media(max-width:820px){
  body.mce-exam-active #quizArena .quiz-main-layout{
    overflow:hidden!important;
  }
  body.mce-exam-active #quizArena .quiz-question-column{
    overflow:auto!important;
    -webkit-overflow-scrolling:touch;
  }
  body.mce-exam-active #quizArena .single-question-nav{
    margin:0 8px 12px!important;
    padding:8px!important;
  }
  body.mce-exam-active #quizArena .single-question-nav:not(.hidden){
    grid-template-columns:1fr 1fr!important;
  }
  body.mce-exam-active #quizArena .single-question-nav .question-nav-buttons{
    grid-column:1 / -1!important;
    grid-template-columns:1fr 1.25fr!important;
  }
  body.mce-exam-active #quizArena .single-question-nav .question-action-btn{
    min-height:44px!important;
    font-size:12px!important;
  }
}

@media(max-width:430px){
  body.mce-exam-active #quizArena .single-question-nav:not(.hidden){
    grid-template-columns:1fr 1fr!important;
    gap:7px!important;
  }
  body.mce-exam-active #quizArena .single-question-nav .question-nav-buttons{
    gap:7px!important;
  }
}
