.shell-install{display:inline-flex;align-items:center;justify-content:center;min-height:44px;padding:8px 12px;border:1px solid var(--line);border-radius:4px;background:var(--card);color:var(--fg);font:600 13px var(--ff-body);cursor:var(--cur-hover)}
.shell-install:hover{border-color:var(--accent);color:var(--accent)}
.shell-install[hidden]{display:none}
.pwa-desktop-guide{display:none}
@media(min-width:761px) and (pointer:fine){.pwa-desktop-guide{display:inline-flex}}
.pwa-install-help{width:min(420px,calc(100vw - 32px));max-width:none;padding:24px;border:1px solid var(--line);border-radius:6px;background:var(--panel);color:var(--fg)}
.pwa-install-help::backdrop{background:#0009}
.pwa-install-content{position:relative;padding:4px 24px 4px 0}
.pwa-install-content h2{margin:0 0 12px;font:700 20px/1.4 var(--ff-display)}
.pwa-install-steps{margin:0;color:var(--mut);line-height:1.7}
.pwa-guide-link{display:inline-flex;align-items:center;min-height:44px;margin-top:12px;color:var(--accent);text-underline-offset:4px}
.pwa-install-close{position:absolute;right:-18px;top:-14px;width:44px;height:44px;border:0;background:transparent;color:var(--mut);font-size:24px;cursor:var(--cur-hover)}
.pwa-install-close:focus-visible{outline:2px solid var(--accent);outline-offset:-2px}
/* Loaded last, so the mobile flex shell keeps its expandable navigation. */
.shell-install:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
@media(max-width:760px){
 body[data-hub-page=home] .bar.hub-open .primary-nav{width:auto;max-width:calc(100% - 16px);grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:700px){
 body[data-hub-page=home] .primary-nav .shell-install{grid-column:1/-1;justify-content:flex-start;width:100%;text-align:left}
}
@media(display-mode:standalone){
 html:not([data-pwa-embedded]) body{box-sizing:border-box;padding:env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left)}
 body[data-hub-page=home] #fr{left:env(safe-area-inset-left);width:calc(100% - env(safe-area-inset-left) - env(safe-area-inset-right));top:calc(54px + env(safe-area-inset-top));height:calc(100% - 54px - env(safe-area-inset-top) - env(safe-area-inset-bottom))}
 @media(min-width:701px) and (max-width:760px){
  body[data-hub-page=home] #fr{top:calc(94px + env(safe-area-inset-top));height:calc(100% - 94px - env(safe-area-inset-top) - env(safe-area-inset-bottom))}
 }
 @media(max-width:700px){
  body[data-hub-page=home] #fr{width:100%;height:auto}
 }
}
