/* Shared content and controls at every screen size. */
:root{--surface:#f3f5ff}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%}
body{overflow-wrap:break-word}
main,section,article,aside,form,fieldset,header,footer{min-width:0}
img,video{max-width:100%}
video{height:auto}
.academy-table-scroll{max-width:100%;overscroll-behavior-inline:contain}
.academy-table-scroll small{display:block;overflow-wrap:anywhere}
.academy-message,.source-note,.admin-access{overflow-wrap:anywhere}
input,select,textarea{max-width:100%}
@media(max-width:1100px){
 header{flex-wrap:wrap;gap:16px}
 header .menu{display:block;background:none;border:1px solid var(--ink);padding:10px 16px;min-height:44px;font-size:14px}
 header>nav{display:none;width:100%;flex-direction:column;align-items:stretch;gap:0}
 header>nav.open{display:flex}
 header>nav a,header>nav button{min-height:44px;padding:12px;text-align:left}
 header>nav .nav-cta{padding:12px}
}
@media(max-width:680px){
 .wrap{padding-inline:max(20px,env(safe-area-inset-left)) max(20px,env(safe-area-inset-right))}
 header{padding-inline:20px}
 .hero h1{font-size:clamp(38px,10vw,53px)}
 .actions .button{max-width:100%;white-space:normal;text-align:center}
 input:not([type=checkbox]):not([type=radio]),select,textarea{font-size:16px!important;min-height:46px}
 button,summary{min-height:44px}
 .academy-lesson-layout,.profile-hero,.profile-details,.dimension-results{grid-template-columns:minmax(0,1fr)}
 .profile-details-form,.profile-details-form label{min-width:0}
 .profile-details-form .profile-goal{grid-column:1/-1}
 .placement-form legend{max-width:100%;font-size:clamp(22px,6vw,28px);overflow-wrap:anywhere}
 .profile-result h2{font-size:clamp(34px,9vw,48px);overflow-wrap:anywhere}
 .academy-stats{max-width:100%}
 .guide-dialog{max-width:calc(100vw - 24px);max-height:calc(100dvh - 100px)}
 .guide-launch{right:max(12px,env(safe-area-inset-right));bottom:max(12px,env(safe-area-inset-bottom))}
 footer{padding-bottom:max(82px,calc(60px + env(safe-area-inset-bottom)))}
}
@media(max-width:380px){
 .hero-note{padding-inline:20px}.hero-note h2{font-size:34px}
 .guide-cover h1{font-size:clamp(48px,15vw,60px)}
 .actions{align-items:stretch}.actions .button{width:100%}
 .academy-stats>div{flex-basis:100%}
}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}