/* KAHReady SG mobile viewport containment — stable iPhone assessment layout. */
html,body{width:100%;max-width:100%;overflow-x:hidden;overscroll-behavior-x:none}
body{position:relative}
main,#mainContent,.view,.wrap,.learning-hub-shell,.learning-hub-main,.hub-welcome,.hub-continue-card,.hub-module-roadmap,.practice-mode-grid,.institutional-modes,.hub-study-insights,.academy-section,.ecosystem-section,.v6134-conversion-hero,.v6142-pricing-section,.v6142-demo-section,.decision-path-strip,.cro-difference-section{min-width:0;max-width:100%}
img,svg,video,canvas{max-width:100%;height:auto}

@media(max-width:820px){
  html,body{overflow-x:clip;touch-action:pan-y}
  html:has(body.exam-focus),html.kr-exam-no-smooth{scroll-behavior:auto!important}
  #mainContent,.view{width:100%;overflow-x:clip}
  .wrap{width:min(100%,calc(100vw - 28px));max-width:100%;margin-left:auto;margin-right:auto}
  .learning-hub-shell,.learning-hub-main,.hub-welcome,.hub-continue-card,.hub-module-roadmap,.practice-mode-grid,.institutional-modes,.hub-study-insights{width:100%;max-width:100%;min-width:0}
  .learning-hub-main>*{min-width:0;max-width:100%}
  .hub-welcome>*,.hub-continue-card>*,.institutional-modes>*,.hub-study-insights>*{min-width:0}
  .hub-welcome h1,.hub-welcome p,.hub-course-copy h2,.hub-course-copy p,.hub-module-roadmap h3,.hub-module-roadmap p,.practice-mode-grid h3,.practice-mode-grid p{overflow-wrap:anywhere;word-break:normal}
  .topbar,.academy-topbar,.institutional-topbar{width:100%;max-width:100%;overflow:hidden}
  .nav{min-width:0}
  .brand,.academy-brand{min-width:0;max-width:calc(100vw - 108px)}
  .brand span,.academy-brand span{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .mobile-menu,.cart-drawer{max-width:100vw}
  .cro-mobile-dock{left:10px!important;right:10px!important;width:auto!important;max-width:calc(100vw - 20px)!important}

  /* Keep Save & Exit and counters in normal flow; never overlay question text. */
  body.exam-focus #quiz{padding-top:max(8px,env(safe-area-inset-top,0px))!important}
  body.exam-focus .premium-quiz-card .quiz-exit-row{
    position:relative!important;
    top:auto!important;
    z-index:20!important;
    display:flex!important;
    flex-direction:row!important;
    align-items:center!important;
    justify-content:space-between!important;
    gap:10px!important;
    margin:0!important;
    padding:9px 0 10px!important;
    background:#fff!important;
    border-bottom:1px solid #d8e1e7!important;
    border-radius:0!important;
    box-shadow:none!important;
    backdrop-filter:none!important;
    -webkit-backdrop-filter:none!important;
  }
  body.exam-focus .quiz-exit-row .quiz-counts{
    display:flex!important;
    flex-direction:row!important;
    align-items:center!important;
    gap:6px!important;
    flex-wrap:wrap!important;
    min-width:0!important;
  }
  body.exam-focus .quiz-exit-row #qExit{
    min-height:40px!important;
    padding:8px 11px!important;
    margin:0!important;
    white-space:nowrap!important;
    flex:0 0 auto!important;
  }

  /* Do not fake spacing with negative margins/padding. The single JS controller
     positions .question-meta once when the question number changes. */
  body.exam-focus #qText{padding-top:0!important;margin-top:0!important;scroll-margin-top:0!important}
  body.exam-focus .question-meta,body.exam-focus #qCounter{scroll-margin-top:0!important}

  /* iOS Safari performs noticeably better with an opaque fixed action bar than
     with a live backdrop blur over a long scrolling assessment. */
  body.exam-focus .quiz-actions{
    background:#fff!important;
    backdrop-filter:none!important;
    -webkit-backdrop-filter:none!important;
    box-shadow:0 -2px 10px rgba(7,31,54,.06)!important;
  }
}

@supports not (overflow:clip){
  @media(max-width:820px){html,body,#mainContent,.view{overflow-x:hidden}}
}