@import url('https://fonts.googleapis.com/css2?family=Raleway:ital,wght@0,200;0,300;0,400;0,500;0,600;0,700;0,800;1,400;1,600&display=swap');
:root{--font:'Raleway',sans-serif}
body,body input,body button,body select,body textarea,body code,body pre,body .stem,body .option-text,body .tech-term,body .scen .ttl,body .scen .desc,body .google-mark,body svg text{font-family:var(--font)!important}
img,svg{max-width:100%}input,select,textarea{max-width:100%}
.tutor-dialog [hidden]{display:none!important}
body.exam-mode .tutor-footer{display:block}
#view-exam.wrap{width:100%;padding:12px;max-width:1800px}
#view-exam .exam{height:calc(100dvh - 24px);grid-template-rows:auto minmax(0,1fr);grid-template-columns:minmax(240px,34%) minmax(0,1fr)}
#view-exam .exam-head{padding:12px 18px;gap:12px}
#view-exam .exam-heading{flex:1}
#view-exam .exam-heading strong{white-space:normal;font-size:clamp(14px,1.3vw,17px)}
#view-exam .rail{min-height:0;overflow:auto;overscroll-behavior:contain}
#view-exam .qpanel{min-height:0;height:100%;overflow:hidden}
#view-exam .qbody{overflow:auto;overscroll-behavior:contain;padding:clamp(16px,2vw,28px);scrollbar-gutter:stable}
#view-exam .qfoot{flex:none;padding:12px 24px;background:#fff;border-top:1px solid var(--line)}
#view-exam .stem{font-size:clamp(18px,1.5vw,23px);line-height:1.55}
#view-exam .opt{padding:12px 14px;min-height:52px}
#view-exam .option-text,#view-exam .scen .desc{font-size:15px;line-height:1.65}
#view-exam .scen .ttl{font-size:18px}
.modal{max-height:calc(100dvh - 32px);overflow:auto;overscroll-behavior:contain}
@media(max-width:900px){
 #view-exam .exam{grid-template-columns:minmax(0,1fr);grid-template-rows:auto auto minmax(0,1fr)}
 #view-exam .rail{max-height:25dvh;border-right:0;border-bottom:1px solid var(--line)}
 #view-exam .exam-context-head{padding:8px 16px 0}
 #view-exam .scen-wrap,#view-exam .nav{padding-inline:16px}
 #view-exam .exam-rail-actions{padding:6px 16px;margin:0}
 #view-exam .scen{padding:4px 0 8px}
 #view-exam .nav summary{padding:8px 0}
 #view-exam .exam-tools{gap:6px}
 #view-exam .exam-head{flex-wrap:wrap}
 #view-exam .exam-tools .btn{padding:8px 10px;min-height:40px}
}
@media(max-width:600px){
 #view-exam.wrap{padding:0}
 #view-exam .exam{height:100dvh;border:0;border-radius:0;overflow:hidden}
 #view-exam .exam-head{padding:8px 12px;gap:8px}
 #view-exam .exam-heading{flex-basis:100%}
 #view-exam .exam-tools{width:100%;justify-content:flex-start;gap:5px}
 #view-exam .timer{min-width:64px;padding-right:6px}
 #view-exam .timer .t{font-size:19px}
 #view-exam .exam-tools .btn{font-size:11px;padding:7px;min-height:44px}
 #view-exam .qbody{padding:16px}
 #view-exam .qfoot{padding:8px 16px max(8px,env(safe-area-inset-bottom))}
 #view-exam .rail{max-height:19dvh}
 .tutor-head{padding:12px 16px}
 .tutor-footer{max-height:45dvh;overflow:auto}
}
@media(prefers-reduced-motion:no-preference){.btn,.opt,.provider-card{transition:background-color .18s ease,border-color .18s ease,box-shadow .18s ease}.qbody,.tutor-scroll{scroll-behavior:smooth}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;animation:none!important;transition:none!important}}
@media print{#view-exam .exam{height:auto}}