/* Phase 2E.2: visibly larger and optically centered PWA branding.
   Only installed smartphone PWA. Normal browser website stays unchanged. */
@media (max-width: 1000px) {
    html.pwa-mobile-app .site-header {
        gap: 4px;
        padding-top: 7px;
        padding-bottom: 7px;
    }
    html.pwa-mobile-app .site-home-link {
        align-items: center;
        gap: 4px;
        min-width: 0;
    }
    html.pwa-mobile-app .site-header .logo-symbol-img {
        flex: 0 0 54px;
        width: 54px;
        height: 54px;
        margin: 0;
    }
    html.pwa-mobile-app .site-header .site-branding {
        display: flex;
        align-items: center;
        min-width: 0;
        min-height: 54px;
        margin: 0;
        padding: 0;
    }
    html.pwa-mobile-app .site-header .site-branding .site-title {
        display: block;
        position: relative;
        top: 5px;
        margin: 0;
        padding: 0;
        font-size: clamp(18px, 5.65vw, 24px);
        font-weight: 900;
        letter-spacing: -.065em;
        line-height: 1.08;
        white-space: nowrap;
    }
}
@media (min-width: 400px) and (max-width: 1000px) {
    html.pwa-mobile-app .site-header .logo-symbol-img {
        flex-basis: 58px;
        width: 58px;
        height: 58px;
    }
    html.pwa-mobile-app .site-header .site-branding { min-height: 58px; }
}
@media (max-width: 359px) {
    html.pwa-mobile-app .site-header {
        padding-left: max(9px, env(safe-area-inset-left));
        padding-right: max(9px, env(safe-area-inset-right));
    }
    html.pwa-mobile-app .site-header .logo-symbol-img {
        flex-basis: 50px;
        width: 50px;
        height: 50px;
    }
    html.pwa-mobile-app .site-header .site-branding { min-height: 50px; }
    html.pwa-mobile-app .site-header .site-branding .site-title {
        font-size: clamp(17px, 5.4vw, 19px);
    }
}
@media (max-width: 329px) {
    html.pwa-mobile-app .site-header {
        padding-left: max(8px, env(safe-area-inset-left));
        padding-right: max(8px, env(safe-area-inset-right));
    }
    html.pwa-mobile-app .site-home-link { gap: 3px; }
    html.pwa-mobile-app .site-header .logo-symbol-img {
        flex-basis: 46px;
        width: 46px;
        height: 46px;
    }
    html.pwa-mobile-app .site-header .site-branding { min-height: 46px; }
    html.pwa-mobile-app .site-header .site-branding .site-title { font-size: 17px; }
}