/* One shared backdrop and a physical top-right menu, independent of language. */
body.mumin-layout,body.mumin-layout #startupScreen{background:#2e2118 url('../assets/home-gallery/gallery-background-1024.webp') center/cover fixed!important}
body.mumin-layout .app,body.mumin-layout #main,body.mumin-layout .app>header{background:transparent!important}
body.mumin-layout .aqq-main-menu{position:absolute;top:calc(env(safe-area-inset-top,0px) + 16px);right:max(calc(env(safe-area-inset-right,0px) + 16px),calc((100vw - 960px)/2 + 16px));left:auto;z-index:40;display:grid;place-items:center;width:44px;min-width:44px;height:44px;min-height:44px;margin:0;padding:10px;border:0;border-radius:0;background:transparent;color:#f5e8d1;box-shadow:none;touch-action:manipulation}
body.mumin-layout .aqq-main-menu svg{display:block;width:24px;height:24px}
body.mumin-layout .aqq-main-menu:focus-visible{outline:3px solid #f3e7cf;outline-offset:4px}
body.mumin-layout .aqq-menu-space{display:block;width:44px;height:44px;pointer-events:none}
body.mumin-layout #settingsSheet{inset-inline:auto;left:auto;right:0}
@media(max-width:540px){body.mumin-layout,body.mumin-layout #startupScreen{background-image:url('../assets/home-gallery/gallery-background-768.webp')!important;background-attachment:scroll!important}}
/* Inner pages use a real top bar, not the former tall Home-logo placeholder. */
body.shared-canvas .app>header.aqq-brand-bar{height:auto!important;min-height:calc(76px + env(safe-area-inset-top,0px));flex:none;padding:calc(16px + env(safe-area-inset-top,0px)) max(16px,env(safe-area-inset-right,0px)) 0 max(16px,env(safe-area-inset-left,0px))!important}
body.shared-canvas .aqq-brand-bar .interface-language-bar{width:100%!important;padding:0!important}
body.shared-canvas #main:has(>.quest-home>.missing-word-subtitle),body.shared-canvas #main:has(>.arrange-practice[data-ap-phase=types]){flex:none;padding-top:82px!important;padding-bottom:32px!important}
body.mumin-layout #main .quest-home:has(>.missing-word-subtitle),body.mumin-layout #main>.arrange-practice[data-ap-phase=types]{width:100%;max-width:620px;margin:0 auto;padding:0;flex:none;gap:20px}
body.mumin-layout #main .missing-word-subtitle,body.mumin-layout #main>.arrange-practice[data-ap-phase=types]>h1{font-size:clamp(22px,3vw,27px)!important;font-weight:500;line-height:1.5;margin:0;text-align:center}
body.mumin-layout #main .quest-home .gallery-type-grid,body.mumin-layout #main .arrange-practice[data-ap-phase=types] .ap-modes{display:grid;grid-template-columns:minmax(0,1fr);gap:14px;width:100%;padding:0;margin:0}
body.mumin-layout #main .arrange-practice[data-ap-phase=types] .ap-modes{margin-top:20px}
body.mumin-layout #main .gallery-type-grid .gallery-menu-card,body.mumin-layout #main .arrange-practice[data-ap-phase=types] .ap-modes button{min-height:88px;margin:0;padding:18px 24px;box-sizing:border-box}
body.mumin-layout #main .gallery-type-grid .gallery-menu-copy,body.mumin-layout #main .gallery-type-grid .gallery-menu-copy strong{font-size:18px;font-weight:500;line-height:1.5}
body.mumin-layout #main .arrange-practice[data-ap-phase=types] .ap-modes button{display:flex;align-items:center;justify-content:center;gap:16px}
body.mumin-layout #main .arrange-practice[data-ap-phase=types] .ap-modes button>svg{width:70px;height:36px;flex:none}
@media(min-width:700px){body.mumin-layout #main .quest-home .gallery-type-grid,body.mumin-layout #main .arrange-practice[data-ap-phase=types] .ap-modes{grid-template-columns:repeat(2,minmax(0,1fr))}body.mumin-layout #main .gallery-type-grid .gallery-menu-card,body.mumin-layout #main .arrange-practice[data-ap-phase=types] .ap-modes button{min-height:128px}body.mumin-layout #main .arrange-practice[data-ap-phase=types] .ap-modes button{flex-direction:column;gap:10px}}

/* Screen wrappers share the backdrop; readable cards keep their own surfaces. */
body.shared-canvas .players-panel.cozy-players{background:transparent;border:0;box-shadow:none}
/* Back is keyboard-accessible text below the content, never a boxed arrow. */
body.mumin-layout .app:has(>.aqq-back-navigation){padding-bottom:0}
body.mumin-layout .aqq-back-navigation{order:3;display:flex;justify-content:center;width:100%;margin-top:auto;padding:20px 16px max(16px,env(safe-area-inset-bottom,0px));box-sizing:border-box;background:transparent}
body.mumin-layout .aqq-back-link{display:inline-flex;align-items:center;justify-content:center;min-width:44px;min-height:44px;padding:8px 16px;border:0;border-radius:0;background:transparent;color:#f3e7cf;box-shadow:none;font:inherit;font-size:16px;line-height:1.5;text-decoration:underline;text-underline-offset:4px;cursor:pointer;touch-action:manipulation}
body.mumin-layout .aqq-back-link:focus-visible{outline:2px solid #f3e7cf;outline-offset:3px}
/* Two compact picture frames reuse the approved Home frame and paper assets. */
body.mumin-layout #main .quest-home .gallery-type-grid,body.mumin-layout #main .arrange-practice[data-ap-phase=types] .ap-modes{grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
body.mumin-layout #main .gallery-type-grid .gallery-choice-card,body.mumin-layout #main .arrange-practice[data-ap-phase=types] .ap-modes .gallery-choice-card{display:flex;align-items:stretch;justify-content:center;min-width:0;min-height:190px;aspect-ratio:1;margin:0;padding:18px 16px;border:0;outline:none;border-radius:0;box-shadow:none;color:#352619}
body.mumin-layout #main .gallery-choice-card .gallery-choice-paper{display:flex;flex:1;flex-direction:column;align-items:center;justify-content:center;gap:12px;min-width:0;width:100%;padding:4px;color:#352619}
body.mumin-layout #main .gallery-choice-card strong{font:600 clamp(16px,3.5vw,22px)/1.45 Georgia,'Times New Roman',serif;color:#352619;text-wrap:balance;overflow-wrap:normal}
html[lang=ar] body.mumin-layout #main .gallery-choice-card strong{font-family:var(--arabic-font,Arial,sans-serif);line-height:1.7}
body.mumin-layout #main .arrange-practice[data-ap-phase=types] .ap-modes .gallery-choice-paper>svg{width:min(100%,90px);height:46px;flex:none;fill:#75583e;color:#75583e}
body.mumin-layout #main .gallery-type-grid .gallery-choice-card:focus-visible,body.mumin-layout #main .arrange-practice[data-ap-phase=types] .ap-modes .gallery-choice-card:focus-visible{outline:3px solid #f3e7cf;outline-offset:5px}
@media(min-width:700px){body.mumin-layout #main .gallery-type-grid .gallery-choice-card,body.mumin-layout #main .arrange-practice[data-ap-phase=types] .ap-modes .gallery-choice-card{min-height:210px;padding:24px}}

/* Mode menus retain the same logo and artwork-led two-frame hierarchy as Home. */
body.mumin-layout:has(.gallery-submenu-logo) .app>header.aqq-brand-bar{display:none!important}
body.mumin-layout #main .gallery-submenu-logo{display:block;width:280px;max-width:85%;height:auto;margin:0 auto}
body.mumin-layout #main .arrange-practice[data-ap-phase=types]>.gallery-submenu-logo{margin-bottom:20px}
body.mumin-layout #main .gallery-choice-art{display:block;width:100%;max-width:180px;height:auto;aspect-ratio:3/2;object-fit:contain;pointer-events:none}
@media(max-width:540px){body.mumin-layout #main .gallery-submenu-logo{width:250px}body.mumin-layout #main .gallery-choice-card .gallery-choice-paper{gap:8px}}
