/* Full-screen learning experience, optimized for touch tablets. */
.nav-button{border:0;background:#f1edff;color:#6047c9;border-radius:13px;padding:10px 14px;font:800 15px Nunito;cursor:pointer}
.fullscreen-button{background:#7157df;color:#fff;box-shadow:0 6px 16px #7157df38}
.learner-mode{min-height:100dvh;display:flex;flex-direction:column}
.learner-mode main{width:100%;flex:1}
.learner-mode footer{margin-top:auto}

@media (min-width:701px) and (max-width:1180px){
  body.learner-mode{font-size:18px;background-size:22px 22px}
  .learner-mode header{height:76px;padding:max(10px,env(safe-area-inset-top)) max(22px,env(safe-area-inset-right)) 8px max(22px,env(safe-area-inset-left));box-shadow:0 8px 30px #483a8a12}
  .learner-mode .brand{font-size:24px;white-space:nowrap}.learner-mode .brand span{font-size:29px}
  .learner-mode nav{align-items:center;gap:8px}.learner-mode nav a,.learner-mode .nav-button{min-height:46px;display:flex;align-items:center;padding:10px 14px}
  .learner-mode .user-chip{max-width:170px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-weight:900}
  .learner-mode main{max-width:none;padding:30px clamp(28px,5vw,64px) 64px}
  .learner-mode footer{padding:18px}
  .learner-mode .hero{min-height:300px;padding:38px 52px;border-radius:32px}.learner-mode .hero h1{font-size:46px}.learner-mode .mascot{font-size:100px}
  .learner-mode .grade-grid{gap:18px}.learner-mode .grade-card{min-height:245px;padding:24px}.learner-mode .grade-card strong{font-size:58px}
  .learner-mode .subject-grid,.learner-mode .lesson-list,.learner-mode .lesson-page{max-width:100%}
  .learner-mode .subject-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}.learner-mode .subject-card{min-height:128px;padding:24px}
  .learner-mode .lesson-row{min-height:112px;padding:22px 25px}.learner-mode .lesson-row h2{font-size:26px}
  .learner-mode .chapter-block{margin:24px 0 52px}.learner-mode .chapter-head{position:sticky;top:76px;z-index:3;background:#fffdf9ee;backdrop-filter:blur(12px);padding:12px 4px;border-radius:15px}
  .learner-mode .mode-actions a{min-height:48px;display:flex;align-items:center;padding:11px 16px}
  .learner-mode .lesson-content{font-size:20px;padding:36px;line-height:1.8}.learner-mode .video{border-radius:28px}
  .learner-mode .primary,.learner-mode .secondary{min-height:56px;padding:16px 28px;font-size:19px}
  .learner-mode .quiz{max-width:940px}.learner-mode .quiz>h1{font-size:43px;margin:20px 0 30px}
  .learner-mode .quiz-head{position:sticky;top:76px;z-index:4;background:#fffdf9e8;backdrop-filter:blur(14px);padding:14px 6px;margin:-10px 0 14px;border-radius:16px}
  .learner-mode fieldset{padding:30px;margin:28px 0;border-radius:28px;box-shadow:0 14px 35px #453a800d}.learner-mode legend{font-size:27px;line-height:1.3;max-width:94%}
  .learner-mode fieldset label{min-height:66px;padding:16px 20px;border-radius:18px;font-size:20px}.learner-mode fieldset label span{width:42px;height:42px;flex:0 0 42px}
  .learner-mode .quiz>.primary{display:block;position:sticky;bottom:max(18px,env(safe-area-inset-bottom));z-index:5;margin:32px auto 0;min-width:280px;box-shadow:0 12px 30px #5138ca55}
  .learner-mode .difficulty-card{min-height:260px}.learner-mode .difficulty-card strong{font-size:31px}
  .learner-mode .result{max-width:760px;padding:55px}.learner-mode .result h1{font-size:64px}
}

@media (min-width:701px) and (max-width:1180px) and (orientation:landscape){
  .learner-mode main{padding:24px clamp(34px,6vw,80px) 50px}
  .learner-mode .hero{min-height:250px}.learner-mode .grade-card{min-height:210px}
  .learner-mode .lesson-page{max-width:1050px}.learner-mode .lesson-page.has-video{display:grid;grid-template-columns:1.1fr 1fr;gap:28px}
  .learner-mode .quiz{max-width:1000px}
}

@media (display-mode:fullscreen){.learner-mode header{padding-top:max(8px,env(safe-area-inset-top))}}
.learner-mode.is-fullscreen footer{display:none}.learner-mode.is-fullscreen main{padding-bottom:max(32px,env(safe-area-inset-bottom))}

@media(max-width:700px){.fullscreen-button span{display:none}.fullscreen-button{padding:8px 10px}.learner-mode nav{gap:4px}.learner-mode .user-chip{display:none}}
