/* Compact mobile browser chrome. The loader never installs this marker in native or installed apps. */
@media(max-width:760px) and (display-mode:browser){
 html[data-brekmen-browser-density]{--app-header:64px}
 /* Preserve journey's responsive queries without making body a fixed-position containing block. */
 html[data-brekmen-browser-density] body.pr-site[data-brekmen-journey]{container-type:normal;container-name:none}
 html[data-brekmen-browser-density] body.pr-site[data-brekmen-journey]>main{container-type:inline-size;container-name:lp-screen;width:100%;min-width:0}
 html[data-brekmen-browser-density] body.pr-site:has(.app-bottom-nav){padding-bottom:calc(68px + env(safe-area-inset-bottom,0px))}
 html[data-brekmen-browser-density] .pr-site .pr-header{display:grid;grid-template-columns:minmax(0,1fr) auto 36px 36px;align-items:center;gap:6px;height:auto;min-height:64px;padding:9px 12px;flex-wrap:nowrap}
 html[data-brekmen-browser-density] .pr-site .pr-header>a.pr-brand{grid-column:1;grid-row:1;order:0;min-width:0;max-width:100%;margin-inline-end:auto;gap:7px}
 html[data-brekmen-browser-density] .pr-site .pr-header .app-original-wordmark{--bk-name-width:clamp(98px,31vw,135px);max-inline-size:100%}
 html[data-brekmen-browser-density] .pr-site .pr-header>a.pr-brand>.brekmen-brand-prefix-k{flex-basis:22px;width:22px;height:22px;inline-size:22px;block-size:22px}
 html[data-brekmen-browser-density] .pr-site .pr-header>.app-language-switch{grid-column:2;grid-row:1;order:0;gap:3px;margin:0;font-size:10px;white-space:nowrap}
 html[data-brekmen-browser-density] .pr-site .pr-header>.app-language-switch button{min-height:36px;padding:5px;font-size:10px;line-height:1.5;border-radius:7px}
 html[data-brekmen-browser-density] .pr-site .pr-header>.pr-header-actions{grid-column:3;grid-row:1;order:0;display:flex;width:36px;flex-basis:auto;padding:0;gap:0}
 html[data-brekmen-browser-density] .pr-site .pr-header .pr-header-actions>.header-find{display:none!important}
 html[data-brekmen-browser-density] .pr-site .pr-header .pr-header-actions>.header-ask{position:relative;display:flex;align-items:center;justify-content:center;flex:0 0 36px;width:36px;height:36px;min-height:36px;padding:6px;border-radius:9px}
 html[data-brekmen-browser-density] .pr-site .pr-header .header-ask>.brekmen-ask-icon{width:22px;height:22px;flex:none}
 html[data-brekmen-browser-density] .pr-site .pr-header [data-header-ask-label]{position:absolute;width:1px;height:1px;margin:-1px;padding:0;border:0;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
 html[data-brekmen-browser-density] .pr-site .pr-header>.pr-menu{grid-column:4;grid-row:1;order:0;width:36px;height:36px;min-height:36px;flex-basis:auto;padding:6px}
 html[data-brekmen-browser-density] .pr-site .pr-header.is-open>nav{top:calc(100% + 8px);inset-inline:12px}
 html[data-brekmen-browser-density] .pr-site .pr-tray{display:none!important}
 html[data-brekmen-browser-density] .app-bottom-nav{height:calc(52px + env(safe-area-inset-bottom,0px));padding:4px 12px calc(4px + env(safe-area-inset-bottom,0px));gap:8px;box-shadow:0 -2px 12px #143d3307}
 html[data-brekmen-browser-density] .app-bottom-nav>a,html[data-brekmen-browser-density] .app-bottom-nav>button{min-height:44px;gap:2px;border-radius:8px;font-size:10px;line-height:1.3}
 html[data-brekmen-browser-density] .app-bottom-nav .pr-icon{width:18px;height:18px}
 html[data-brekmen-browser-density] .app-bottom-nav span b:not(:empty){font-size:9px;line-height:1.3;padding:1px 4px}
 html[data-brekmen-browser-density] .pr-site .pr-footer-bottom{padding-block:10px;gap:7px;font-size:9px}
}

/* Home keeps both compact entry actions in its one-row mobile browser header. */
@media(max-width:760px) and (display-mode:browser){
 html[data-brekmen-browser-density] body.ref-home .pr-header{position:sticky;top:0;grid-template-columns:minmax(0,1fr) auto 88px 36px;padding-inline:10px}
 html[data-brekmen-browser-density] body.ref-home .pr-header .app-original-wordmark{--bk-name-width:clamp(84px,25vw,114px)}
 html[data-brekmen-browser-density] body.ref-home .pr-header>.pr-header-actions{width:88px;gap:4px}
 html[data-brekmen-browser-density] body.ref-home .pr-header .pr-header-actions>.header-ask{flex-basis:32px;width:32px;height:36px;min-height:36px;padding:5px}
 html[data-brekmen-browser-density] body.ref-home .pr-header .pr-header-actions>.header-find{display:inline-flex!important;flex:1 1 auto;min-width:0;min-height:36px;height:36px;margin:0;padding:5px 4px;font:600 10px/1.4 Cairo,sans-serif;white-space:nowrap;border-radius:9px}
}
@media(max-width:360px) and (display-mode:browser){
 html[data-brekmen-browser-density] body.ref-home .pr-header{grid-template-columns:minmax(0,1fr) auto 80px 32px;gap:4px;padding-inline:6px}
 html[data-brekmen-browser-density] body.ref-home .pr-header>a.pr-brand{gap:6px}
 html[data-brekmen-browser-density] body.ref-home .pr-header>a.pr-brand>.brekmen-brand-prefix-k{flex-basis:18px;width:18px;height:18px;inline-size:18px;block-size:18px}
 html[data-brekmen-browser-density] body.ref-home .pr-header>.app-language-switch{gap:2px;font-size:9px}
 html[data-brekmen-browser-density] body.ref-home .pr-header>.app-language-switch button{font-size:9px;padding-inline:3px}
 html[data-brekmen-browser-density] body.ref-home .pr-header>.pr-header-actions{width:80px}
 html[data-brekmen-browser-density] body.ref-home .pr-header .pr-header-actions>.header-ask{flex-basis:28px;width:28px;padding:3px}
 html[data-brekmen-browser-density] body.ref-home .pr-header .header-ask>.brekmen-ask-icon{width:20px;height:20px}
 html[data-brekmen-browser-density] body.ref-home .pr-header .pr-header-actions>.header-find{font-size:9px;padding-inline:4px}
 html[data-brekmen-browser-density] body.ref-home .pr-header>.pr-menu{width:32px;padding-inline:4px}
}

/* Compose after published density styles; do not restore the duplicate selected-project tray. */
@media(max-width:760px) and (display-mode:browser){html[data-brekmen-browser-density]{--app-bottom-nav-height:58px}html[data-brekmen-browser-density] .app-bottom-nav{height:calc(var(--app-bottom-nav-height,58px) + env(safe-area-inset-bottom,0px));padding:5px 8px calc(5px + env(safe-area-inset-bottom,0px));gap:4px}html[data-brekmen-browser-density] .app-bottom-nav>a,html[data-brekmen-browser-density] .app-bottom-nav>button{min-height:44px;font-size:11px;line-height:1.3;gap:3px}html[data-brekmen-browser-density] .app-bottom-nav :is(svg,.pr-icon){width:20px;height:20px}html[data-brekmen-browser-density] .bp-app-fixed{bottom:calc(var(--app-bottom-nav-height,58px) + 12px + env(safe-area-inset-bottom,0px))}}

/* Mobile browser controls share the screen edges, leaving the project in view. */
@media(max-width:760px) and (display-mode:browser){
 html[data-brekmen-browser-density]{--app-header:40px;--app-bottom-nav-height:54px!important}
 html[data-brekmen-browser-density] body.pr-site .pr-header{grid-template-columns:minmax(0,1fr) auto 32px 32px;gap:4px;height:40px;min-height:40px;padding:2px 8px}
 html[data-brekmen-browser-density] body.pr-site .pr-header>a.pr-brand{gap:5px}
 html[data-brekmen-browser-density] body.pr-site .pr-header .app-original-wordmark{--bk-name-width:clamp(84px,29vw,112px)}
 html[data-brekmen-browser-density] body.pr-site .pr-header>a.pr-brand>.brekmen-brand-prefix-k{width:18px;height:18px;inline-size:18px;block-size:18px;flex-basis:18px}
 html[data-brekmen-browser-density] body.pr-site .pr-header>.app-language-switch{gap:2px;font-size:10px}
 html[data-brekmen-browser-density] body.pr-site .pr-header>.app-language-switch button{height:36px;min-height:36px;padding:3px;font-size:10px}
 html[data-brekmen-browser-density] body.pr-site .pr-header>.pr-header-actions{width:32px}
 html[data-brekmen-browser-density] body.pr-site .pr-header .pr-header-actions>.header-ask{width:32px;height:36px;min-height:36px;flex-basis:32px;padding:5px;border-radius:8px}
 html[data-brekmen-browser-density] body.pr-site .pr-header .header-ask>.brekmen-ask-icon{width:18px;height:18px}
 html[data-brekmen-browser-density] body.pr-site .pr-header>.pr-menu{width:32px;height:36px;min-height:36px;padding:5px;font-size:18px}
 html[data-brekmen-browser-density] body.pr-site .pr-header>.pr-menu svg{width:20px;height:20px}
 html[data-brekmen-browser-density] body.ref-home .pr-header{grid-template-columns:minmax(0,1fr) auto 88px 32px}
 html[data-brekmen-browser-density] body.ref-home .pr-header>.pr-header-actions{width:88px}
 html[data-brekmen-browser-density] body.pr-site .app-bottom-nav{bottom:0;inset-inline:0;height:calc(var(--app-bottom-nav-height) + env(safe-area-inset-bottom,0px));padding:6px 8px env(safe-area-inset-bottom,0px);gap:4px}
 html[data-brekmen-browser-density] body.pr-site .app-bottom-nav>a,html[data-brekmen-browser-density] body.pr-site .app-bottom-nav>button{min-height:44px;min-width:0;gap:2px;font-size:10px}
 html[data-brekmen-browser-density] body.pr-site .app-bottom-nav :is(svg,.pr-icon){width:18px;height:18px}
 /* This value matches the full nav box; safe area is counted once, not again on a measured height. */
 html[data-brekmen-browser-density] body.pr-site[data-brekmen-journey][data-project]>.lp-project-floating:has(>.brekmen-context-ask){bottom:calc(var(--app-bottom-nav-height) + env(safe-area-inset-bottom,0px) + 2px)!important;padding:4px;gap:3px;border-radius:12px}
 html[data-brekmen-browser-density] body.pr-site[data-brekmen-journey][data-project]>.lp-project-floating:has(>.brekmen-context-ask) button{min-height:44px;padding:6px 4px;line-height:1.3}
 html[data-brekmen-browser-density] body.pr-site[data-brekmen-journey][data-project] .bp-app-fixed{bottom:calc(var(--app-bottom-nav-height) + env(safe-area-inset-bottom,0px) + 2px);width:40px;height:40px;min-height:40px}
}
@media(max-width:360px) and (display-mode:browser){
 html[data-brekmen-browser-density] body.ref-home .pr-header{grid-template-columns:minmax(0,1fr) auto 80px 32px;padding-inline:6px}
 html[data-brekmen-browser-density] body.ref-home .pr-header>.pr-header-actions{width:80px}
}
