/* Shared mobile and tablet refinements. Loaded after page styles. */
html{scroll-padding-top:100px;-webkit-text-size-adjust:100%}
.workspace,main,main section,main article,.panel,.split>*,.journal-layout>*,.lesson-layout>*,.footer-column{min-width:0}
@media(max-width:1024px){
.sidebar{position:sticky;inset:auto;top:0;width:100%;height:auto;overflow:visible;flex-direction:row;flex-wrap:wrap;align-items:center;border-right:0;border-bottom:1px solid var(--border-dark);padding-top:env(safe-area-inset-top);z-index:30}
.brand{padding:12px 16px;border:0;display:grid;grid-template-columns:auto 1fr;gap:0 12px;align-items:center;min-width:0}
.brandmark{font-size:2rem;grid-row:span 2}.brand strong{margin:0;font-size:.82rem}.brand small{font-size:.5rem;margin:0}
.menu-toggle{display:block;margin-left:auto;margin-right:16px;background:var(--navy-raised);color:var(--on-dark);border:1px solid var(--border-dark);border-radius:5px;padding:10px 12px;min-height:44px;font-size:.8rem}
.sidebar nav{display:none;width:100%;max-height:calc(100vh - 85px);max-height:calc(100dvh - 85px - env(safe-area-inset-top));overflow-y:auto;overscroll-behavior:contain;padding:8px 16px 18px}.sidebar nav.open{display:block}.sidebar nav a{min-height:48px;margin:4px 0}.nav-label,.side-bottom{display:none}
.workspace{margin-left:0}.topbar{height:52px;padding:0 20px}.avatar{width:44px;height:44px}.topbar>div{gap:10px}
body.mobile-menu-open{overflow:hidden}
.academy-feature{scroll-margin-top:100px}
button,.button,.compact,.filters button,.note-card button,.dialog-head button,.dialog-foot button{min-height:44px}
input:not([type=checkbox]):not([type=radio]),select,textarea,.search input{font-size:16px}
input[type=range]{min-height:44px}.compare-check{min-height:44px}.compare-check input[type=checkbox]{width:22px;height:22px}
.text-link,.back,.footer-column a,.footer-top-link,.academy-source>a,.f1-source{display:inline-flex;align-items:center;min-height:44px}
.table-scroll{max-width:100%;overscroll-behavior-x:contain}.table-scroll:focus-visible{outline:3px solid var(--focus);outline-offset:3px}
dialog{max-height:90vh;max-height:90dvh}.dialog-head{z-index:1}
}
@media(max-width:720px){
main{padding:24px max(16px,env(safe-area-inset-right)) 36px max(16px,env(safe-area-inset-left))}
h1{font-size:clamp(1.45rem,6vw,1.8rem);line-height:1.4}.subtitle{font-size:.9rem;line-height:1.75}.pagehead{gap:12px}
.section-head{flex-wrap:wrap;gap:6px}.section-head .text-link{white-space:normal}
.panel{padding:20px}.actions{gap:10px}.actions .button{min-width:0}.discovery-strip .actions{display:grid;grid-template-columns:1fr;width:100%}.discovery-strip .button{white-space:normal}
.hero-meta{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}.hero-meta b{font-size:.77rem}.hero-meta span{font-size:.63rem}
.f1-screen{min-height:0;aspect-ratio:16/9;max-height:none}.f1-toolbar{gap:16px}.f1-toolbar .actions{display:grid;grid-template-columns:1fr 1fr;width:100%}.f1-toolbar .button{gap:6px;padding:11px 8px;font-size:.84rem}.f1-source{grid-column:1/-1;white-space:normal}.f1-help{overflow-wrap:anywhere}
.engine-studio audio{width:100%;min-width:0}.finder-controls button{width:100%}.search{min-width:0;width:100%;flex-basis:100%}
.session-stats{grid-template-columns:repeat(2,minmax(0,1fr))}.session-stats strong{font-size:clamp(1rem,4.7vw,1.35rem);overflow-wrap:anywhere}
.lesson-list>a>div{min-width:0;flex-basis:calc(100% - 40px)}.lesson-state{margin-left:30px}.lesson-nav .button{flex:1}
.premium-footer{padding-bottom:calc(24px + env(safe-area-inset-bottom))}.footer-column h3{overflow-wrap:anywhere}.footer-column a{font-size:.84rem;line-height:1.5}.footer-bottom{gap:12px}.footer-bottom p{overflow-wrap:anywhere}
#toast{bottom:calc(16px + env(safe-area-inset-bottom));width:max-content;max-width:calc(100vw - 32px)}
}
@media(max-width:380px){
.brand{padding:12px 10px;gap:0 7px}.brandmark{font-size:1.65rem}.brand strong{font-size:.72rem}.brand small{font-size:.45rem}.menu-toggle{margin-right:10px;padding:8px;font-size:.72rem}
.topbar{padding:0 16px}.topbar>span{font-size:.48rem;letter-spacing:.03em}.local-badge{font-size:.6rem}
.hero-copy{padding:24px 18px}.hero h2{font-size:1.7rem}.library-grid{grid-template-columns:1fr}.academy-logo-panel{padding:8px}.academy-secondary{grid-template-columns:1fr}.academy-secondary img{height:150px}.footer-columns{column-gap:16px}.result-row{grid-template-columns:85px 1fr 25px;gap:8px}
}