/* MOBILE NAV01: no desktop geometry changes. Existing instrument layout stays intact. */
@media(min-width:901px){.mobile-menu-only,#mobileMenuActions{display:none!important}}
@media(max-width:900px){
 .topbar{position:sticky;top:0;z-index:57;background:var(--ap-bg);display:flex;flex-direction:row;align-items:center;flex-wrap:nowrap;gap:0;min-height:0;padding:4px 0 10px}
 .topbar>.brand-wrap{display:flex;align-items:center;flex:1 1 auto;min-width:0;gap:10px;width:100%;margin:0}
 .topbar>.topbar-actions{display:none!important}
 .topbar #navToggle{flex:0 0 42px;min-width:42px;width:42px;height:44px;padding:6px;font-size:24px}
 .topbar .brand{display:flex;flex:1 1 auto;align-items:center;min-width:0;gap:8px}
 .topbar .brand-mark{flex:0 0 36px;min-width:36px;width:36px;height:36px;font-size:20px}
 .topbar .brand-copy{min-width:0}
 .topbar .brand-copy strong{font-size:clamp(14px,3.6vw,27px);white-space:nowrap;line-height:1.15;letter-spacing:.045em}
 .topbar .brand-copy small{font-size:clamp(6px,1.55vw,10px);white-space:nowrap;letter-spacing:.075em}
 body.mobile-menu-open{overflow:hidden}
 #workspaceSidebar{width:min(92vw,370px);max-width:100%;top:var(--mobile-nav-top,64px);height:calc(100dvh - var(--mobile-nav-top,64px));max-height:calc(100dvh - var(--mobile-nav-top,64px));overflow-y:auto;overscroll-behavior:contain;touch-action:pan-y;clip-path:none;padding:16px 14px 24px;background:var(--ap-bg);border-right:1px solid var(--ap-gold)}
 #workspaceSidebar .close-sidebar{margin-left:auto;min-width:40px;min-height:40px}
 #workspaceSidebar .sidebar-head{padding:10px 0 16px;margin-bottom:14px;border-bottom:1px solid var(--ap-gold)}
 #workspaceSidebar .sidebar-head::after{content:'ATELIER MENÜ';display:block;margin-top:8px;letter-spacing:.22em;font:12px var(--ap-display);color:var(--ap-gold)}
 #workspaceSidebar .sidebar-head h1{font-size:22px;margin:0;color:var(--ap-headline)}
 #workspaceSidebar .sidebar-head>p,#workspaceSidebar .sidebar-head>.tiny-kicker,#workspaceSidebar .sidebar-meta{display:none}
 #mobileMenuActions{padding-bottom:16px;margin-bottom:16px;border-bottom:1px solid var(--ap-gold)}
 #mobileMenuActions .topbar-actions{display:flex;flex-direction:column;align-items:stretch;flex-wrap:nowrap;gap:12px;width:100%;overflow:visible;margin:0}
 #mobileMenuActions .topbar-actions>*{width:100%;min-width:0;flex:0 0 auto;margin:0}
 #mobileMenuActions button,#mobileMenuActions .button{min-height:44px;text-align:left;justify-content:flex-start;white-space:normal}
 #mobileMenuActions .theme-picker{display:flex;flex-direction:column;align-items:stretch;gap:6px}
 #mobileMenuActions .theme-picker select{width:100%;max-width:100%;min-height:44px}
 #mobileMenuActions #guideOpen{width:100%}
 #mobileMenuActions #guideNavPanel{position:static;width:100%;max-width:100%;max-height:none;overflow:visible;margin-top:10px;box-shadow:none;padding:8px;clip-path:none;background:var(--ap-panel)}
 #mobileMenuActions .guide-nav-head{font-size:15px}
 #mobileMenuActions .guide-menu-chapter>summary{flex-wrap:wrap;padding:10px;font-size:12px}
 #mobileMenuActions .guide-menu-chapter>summary small{white-space:normal}
 #mobileFreePlay{display:block;width:100%;margin-bottom:12px;font-size:11px;border-color:var(--ap-gold)}
 #mobileFreePlay[hidden]{display:none}
 #pageNav::before{content:'ARBEITSBEREICHE';display:block;margin:0 0 8px;color:var(--ap-gold);font:12px var(--ap-display);letter-spacing:.12em}
 #pageNav .page-link{min-height:44px}
 .mobile-menu-open #navBackdrop{top:var(--mobile-nav-top,64px);touch-action:none}
}
@media(max-width:900px){
 /* The existing cascading guide tree is the single mobile guide entry. */
 #workspaceSidebar .lesson-details,#workspaceSidebar #sidebarGuide{display:none!important}
}
