/* Touch workspace: drawers on phones/tablets; desktop preferences stay independent. */
.menu-backdrop[hidden]{display:none}.menu-backdrop{position:fixed;inset:0;z-index:40;border:0;border-radius:0;background:#10182880;backdrop-filter:blur(3px);padding:0}
@media screen and (max-width:1100px){
 body{overflow-wrap:break-word}.shell,.shell.menu-floating,.shell.menu-hidden{display:block;width:100%;min-width:0}
 .shell>.main,.shell.menu-floating>.main,.shell.menu-hidden>.main,.main:has(.compact-register){width:100%;min-width:0;padding:16px 20px 76px}
 .shell>aside#main-sidebar{position:fixed;inset:0 auto 0 0;width:min(330px,88vw);height:100dvh;z-index:50;display:flex;flex-direction:column;overflow:hidden;padding:18px 16px;background:var(--surface);color:var(--ink);border-right:1px solid var(--border);box-shadow:12px 0 40px #0003}
 .shell.menu-hidden>aside#main-sidebar{display:none!important}
 .shell>aside .nav{display:flex;flex-direction:column;flex:1;min-height:0;overflow-y:auto;overflow-x:hidden;gap:4px;overscroll-behavior:contain}
 .shell>aside .nav button:not(.active){color:var(--ink)}.shell>aside .nav button{white-space:normal;min-height:44px;line-height:1.35;padding:10px 12px;font-size:14px;text-align:left}
 .shell>aside .nav .workspace-open{flex-basis:40px;text-align:center;padding:5px}
 .shell>aside .account{display:block;flex-shrink:0;border-top:1px solid var(--border);padding-top:12px;margin-top:12px;color:var(--ink)}.shell>aside .account button{width:100%;min-height:44px;background:var(--soft);color:var(--ink);margin-top:8px}
 .shell>aside .product-brand{min-height:0;flex-shrink:0;margin:0}.shell>aside .product-brand img{width:76px;height:76px;object-fit:contain}.shell>aside .brand-logo{display:none}.shell>aside .subtitle{margin:0 0 12px;color:var(--muted)}
 .shell .menu-controls{margin:0 0 10px;padding:0}.menu-controls button{width:44px;height:44px}.menu-controls button[hidden]{display:none}
 #menu-edge{left:12px;top:max(12px,env(safe-area-inset-top));width:44px;height:44px;border-radius:12px;z-index:35;background:var(--accent);color:var(--accent-on,#fff);box-shadow:0 4px 16px #0002}
 .mobile-menu-open{overflow:hidden}.menu-mobile-open>.main{pointer-events:none}
 .topline{min-height:52px;padding:0 0 12px 48px;gap:8px;margin-bottom:16px;align-items:center}.topline>.school-identity{min-width:0;max-width:100%;flex-wrap:wrap}.school-identity strong,.school-identity b{overflow-wrap:anywhere}.topline>span{font-size:11px}
 .workspace-toolbar{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:16px}.workspace-toolbar small{display:none}
 #page,#page>*,.panel,.card,.two>*,.form-grid>*,.heading>*,.toolbar>*{min-width:0;max-width:100%}
 .heading,.section-title{flex-wrap:wrap;gap:12px}.heading{align-items:flex-start}.heading .actions{width:100%}.actions{gap:8px}.actions button{white-space:normal}
 .legend span{white-space:normal;overflow-wrap:anywhere}.toolbar{flex-wrap:wrap;gap:10px}.toolbar #search,.toolbar input,.toolbar select,.toolbar label{min-width:0;max-width:100%}
 .table-wrap{width:100%;max-width:100%;overflow:auto;overscroll-behavior-x:contain;-webkit-overflow-scrolling:touch}.table-top-scroll{max-width:100%}.grid .sticky{max-width:150px}
 .two{grid-template-columns:minmax(0,1fr)}.settings-directory{grid-template-columns:repeat(2,minmax(0,1fr))}
 input:not([type=checkbox]):not([type=radio]),select,textarea{font-size:16px;max-width:100%}button,.button-link,summary{min-height:44px}
 .compact-register .mark{min-width:36px;width:36px;height:40px}.compact-register .grid-count{font-size:16px;min-height:40px}.compact-register .lesson-head button{min-height:40px}
 dialog{max-width:calc(100vw - 24px);max-height:calc(100dvh - 24px);overflow:auto;overscroll-behavior:contain}dialog .form-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.dialog-head{gap:8px;flex-wrap:wrap}.form-actions{display:flex;flex-wrap:wrap;gap:8px}
 .tabs{flex-wrap:nowrap;overflow-x:auto;max-width:100%;padding:4px 0 10px}.tabs .tab{flex-shrink:0;white-space:nowrap}
 .dashboard-widget{max-width:100%}.dashboard-widget:not(.card){grid-column:span 12!important}.dashboard-widget.card{grid-column:span 6!important}.widget-content{overflow-wrap:anywhere}
}
@media screen and (max-width:600px){
 .shell>.main,.shell.menu-floating>.main,.shell.menu-hidden>.main,.main:has(.compact-register){padding:12px 12px 76px}
 .topline{padding-left:52px}.topline>span:not(.school-identity){display:none}.heading h1,h1{font-size:26px;line-height:1.2;letter-spacing:-.6px}.panel,.card{padding:16px;border-radius:14px}
 .settings-directory,.form-grid,dialog .form-grid,.course-cards{grid-template-columns:minmax(0,1fr)}
 .toolbar>label,.toolbar>#search{flex:1 1 100%;width:100%}.actions>button,.actions>.button-link{flex:1 1 auto}
 .person-page-tabs{display:flex;overflow-x:auto;gap:8px;padding-bottom:8px}.person-page-tabs button{flex:0 0 auto;white-space:nowrap}
 dialog{width:calc(100vw - 16px);max-width:calc(100vw - 16px);max-height:calc(100dvh - 16px);padding:16px;border-radius:16px}.dialog-head h2{font-size:20px}
 .dashboard-canvas{gap:12px}.dashboard-widget:not(.school-home-image):not([data-widget=school_logo]){height:auto!important;min-height:0}.dashboard-widget .widget-content{max-height:none;padding:18px}.dashboard-widget.welcome .widget-content{padding:22px}.dashboard-widget.welcome h2{font-size:27px}.dashboard-widget.card strong{font-size:26px}.dashboard-widget .row-list{flex-wrap:wrap}
 .student-card-panel{display:flex;flex-direction:column-reverse;padding:16px;gap:16px}.student-card-panel>*{min-width:0;max-width:100%}.student-card-preview{width:100%;height:auto}
 .auth{width:calc(100% - 24px);max-width:460px;margin:24px auto;padding:22px}.auth input{font-size:16px}.auth .product-brand img{max-width:100%}
}
@media(prefers-reduced-motion:no-preference){@keyframes drawer-enter{from{transform:translateX(-100%)}to{transform:translateX(0)}}.menu-mobile-open>aside{animation:drawer-enter .18s ease-out}}
@media print{.menu-backdrop,#menu-edge{display:none!important}}

@media screen and (max-width:1100px){.main:has(.dashboard-scene) .topline,:root[data-glass=yes] .topline{padding:12px 12px 12px 52px}.topline .school-identity{display:flex;gap:8px;align-items:center}.school-identity>span{min-width:0;flex:1}.topline .school-identity small{white-space:normal}.topline .school-identity img{width:34px;height:34px}.topline .guide-header-link{margin-left:auto}}

@media screen and (max-width:360px){.dashboard-widget.card{grid-column:span 12!important}}


