/* Responsive stability: safely cascade after older theme */
html,body,.app {max-width:100%;min-width:0} body{overflow-x:hidden}
.app{height:100dvh;min-height:0;display:flex;flex-direction:column}
.top{flex:0 0 auto;min-width:0;max-width:100%;overflow-x:auto;scrollbar-width:thin}
.layout{flex:1 1 auto;min-height:0;min-width:0;max-width:100%;overflow:hidden}
.layout>*,.layout .center,.canvas-wrap,.canvas-container{min-width:0;min-height:0}
.workshop-menus,.top>input,.top>button{flex-shrink:0}
#filename{min-width:100px;max-width:190px;width:clamp(100px,13vw,190px)}
.worksheet-tabs,.sheet-tabs,.tabs{min-width:0;max-width:100%;overflow-x:auto;scrollbar-width:thin}
.panel{max-height:100%;overscroll-behavior:contain}
[hidden]{display:none!important}
dialog{max-width:min(960px,calc(100vw - 28px));max-height:calc(100dvh - 28px);box-sizing:border-box}
dialog .practice-body,dialog .learning-body{overflow-y:auto;max-height:calc(100dvh - 135px)}
input,select,textarea{max-width:100%;box-sizing:border-box}
@media(max-width:1199px){.layout{position:relative}.layout .panel.right{width:min(370px,90vw);max-width:90vw}.layout .panel.left{width:min(300px,90vw);max-width:90vw}}
@media(max-width:760px){.top{gap:5px;padding:6px;flex-wrap:nowrap;overflow-x:auto}.top button{min-height:36px;white-space:nowrap}.layout{width:100%;overflow:hidden} .layout .center{flex:1 1 auto;min-width:0}.status,.statusbar,.bottom-bar{max-width:100%;overflow-x:auto;white-space:nowrap} .practice-selects{display:grid;grid-template-columns:1fr;gap:8px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;transition-duration:.01ms!important}}
