/* Final navigation and responsive presentation; loaded before the first paint. */
/* LAB scrolls with the hero. Keep its controls and floating labels behind
   navigation at every viewport size, including RTL and device previews. */
html.wlb-hero-lab .site-header{z-index:10008!important;background:var(--paper,#fcfcf9)!important}
/* The exported sticky wrapper owns the header's outer stacking context. */
html.wlb-hero-lab div:has(> .wonder-component .site-header){z-index:10008!important}
html.wlb-hero-lab :is(#wl-lab-label,.wl-workshop-tip){z-index:10007!important}
html.wlb-hero-lab.wl-workshop-ready .site-header :is(.minimal-mobile-canon,.minimal-mobile-vision,.minimal-mobile-reset,.lab-reveal,.theme-toggle){display:none!important}
html.wlb-hero-lab.wl-workshop-ready .site-header .locale-switch--mobile{display:none!important}
@media(max-width:1099px){
 html.wlb-hero-lab.wl-workshop-ready .site-header.site-header .header-inner{display:grid!important;grid-template-columns:minmax(0,1fr) auto!important;min-height:64px!important;padding-block:0!important;gap:0!important;position:relative}
 html.wlb-hero-lab.wl-workshop-ready .site-header .brand{grid-column:1!important;grid-row:1!important}
 html.wlb-hero-lab.wl-workshop-ready .site-header .header-tools{grid-column:2!important;grid-row:1!important;display:flex!important;min-width:0!important;padding:0!important;margin:0!important}
 html.wlb-hero-lab.wl-workshop-ready .site-header .header-tools::before{display:none!important}
 html.wlb-hero-lab.wl-workshop-ready .site-header .mobile-menu-toggle{display:inline-flex!important;min-width:44px;min-height:44px}
 html.wlb-hero-lab.wl-workshop-ready .site-header .locale-switch--desktop{display:none!important}
 html.wlb-hero-lab.wl-workshop-ready .site-header #primary-navigation{display:none!important;transform:none!important}
 html.wlb-hero-lab.wl-workshop-ready .site-header.mobile-menu-open #primary-navigation{display:flex!important;flex-direction:column!important;align-items:stretch!important;position:absolute!important;inset:100% 0 auto!important;grid-area:auto!important;box-sizing:border-box;width:100%!important;max-width:none!important;max-height:calc(100dvh - var(--wl-menu-top,64px) - 16px);overflow:auto;overscroll-behavior:contain;margin:0!important;padding:16px 24px!important;gap:4px!important;background:var(--paper,#fcfcf9)!important;border:0!important;border-bottom:1px solid var(--line)!important;visibility:visible!important;opacity:1!important;pointer-events:auto!important;z-index:1!important}
 html.wlb-hero-lab.wl-workshop-ready .site-header.mobile-menu-open #primary-navigation>a{display:flex!important;justify-content:flex-start!important;min-height:44px;width:100%;margin:0!important}
 html.wlb-hero-lab.wl-workshop-ready .site-header.mobile-menu-open .locale-switch--mobile{display:flex!important;gap:4px!important;padding:12px 0 0!important;margin:8px 0 0!important;border-top:1px solid var(--line)}
 html.wlb-hero-lab.wl-workshop-ready .site-header .locale-switch--mobile>a{min-width:44px!important;min-height:44px!important}
 html.wlb-hero-lab.wl-workshop-ready .site-header .locale-switch-label{display:none!important}
}
/* Navigation owns the foreground while open. Its content is anchored only once,
   to the bottom of the 64 px header, independent of the header's grid rows. */
html.wl-nav-open{overflow:hidden!important;scrollbar-gutter:stable}
html.wl-nav-open .site-header{z-index:10020!important}
html.wl-nav-open :is(#hero-lab,#wl-lab-label,#wl-workshop-info,.vision-overlay,.type-lab-panel,#wonderlab-column-grid,#wonderla-canon-grid,#wl-reading-note){visibility:hidden!important;pointer-events:none!important}
@media(min-width:1100px){html.wlb-hero-lab.wl-workshop-ready .site-header .mobile-menu-toggle{display:none!important}}
/* Symmetric canvas: center on the complete screen, not the leftover space. */
html.wl-responsive-on #wl-responsive-stage{padding:0!important;justify-content:flex-start!important}
html.wl-responsive-on body>:not(#wl-responsive-stage):not(#hero-lab):not(#wl-lab-label):not(script):not(style):not(link){display:none!important}
html.wl-responsive-on #wl-responsive-frame{margin-inline:auto!important}
#hero-lab[data-lab-startup]{pointer-events:none}
#wl-workshop-info{max-height:min(220px,35dvh);overflow:auto}

html.wl-responsive-on #intro#intro#intro#intro#intro #hero-lab{display:none!important}
