.pwa-open-pill[hidden] { display: none !important; }
.pwa-open-pill { display: inline-flex; align-items: center; gap: 8px; padding: 10px 18px; border: 1px solid #e3d8da; border-radius: 99px; background: var(--white); color: var(--primary-dark); font: 700 14px/1 var(--sans); cursor: pointer; box-shadow: 0 2px 8px rgba(31,16,22,.06); }
.pwa-open-pill:hover { background: #faf1f2; border-color: var(--primary); }
.pwa-open-pill:focus-visible { outline: 2px solid var(--primary-dark); outline-offset: 2px; }
.pwa-open-pill img { width: 20px; height: 20px; }
.discovery-heading .pwa-open-pill { margin-bottom: 16px; }
.pwa-install[hidden], .pwa-install [hidden] { display: none !important; }
.pwa-install {
    position: fixed;
    inset: 0;
    margin: auto;
    width: min(380px, calc(100% - 32px));
    max-height: calc(100dvh - 48px - env(safe-area-inset-top) - env(safe-area-inset-bottom));
    overflow-y: auto;
    padding: 24px;
    border: 1px solid #eadfe1;
    border-radius: 24px;
    background: var(--background);
    color: var(--dark);
    box-shadow: 0 10px 28px rgba(31,16,22,.08);
}
.pwa-install::backdrop { background: rgba(31,16,22,.25); }
.pwa-install-logo { margin: 0 auto 18px; border-radius: 16px; }
.pwa-install h2, .pwa-install > p { text-align: center; }
.pwa-install .pwa-install-next { margin: 18px 0 0; padding-top: 14px; border-top: 1px solid var(--rose-tint); }
.pwa-install-next > strong { display: block; margin-bottom: 8px; color: var(--primary-dark); font-size: 14px; }
.pwa-install-next p { margin: 0 0 10px; }
html:has(.pwa-install[open]) { overflow: hidden; }
.pwa-install h2 { margin: 0 20px 12px 0; font: 30px/1.1 var(--serif); }
.pwa-install-title-icon { display: inline-block; width: 26px; height: 26px; vertical-align: -3px; filter: brightness(0) saturate(100%) invert(22%) sepia(38%) saturate(1900%) hue-rotate(318deg) brightness(90%) contrast(92%); }
.pwa-install p, .pwa-install li { font-size: 13px; line-height: 1.5; }
.pwa-install .pwa-install-after { margin: 16px 0 0; color: var(--primary-dark); text-align: left; }
.pwa-install .pwa-install-bell { display: inline-block; width: 18px; height: 18px; vertical-align: -3px; }
.pwa-install p { margin: 0 0 16px; color: var(--muted); }
.pwa-install .button { width: 100%; border: 0; cursor: pointer; }
.pwa-install-close { position: absolute; top: 8px; right: 8px; width: 36px; height: 36px; border: 0; background: transparent; color: var(--primary-dark); font-size: 24px; cursor: pointer; }
.pwa-install ol { margin: 16px 0 0; padding-left: 22px; }
.pwa-install li + li { margin-top: 10px; }
.pwa-install-symbol { color: var(--primary-dark); font-size: 20px; vertical-align: middle; }
.pwa-install-share { display: inline-block; width: 20px; height: 20px; vertical-align: middle; fill: none; stroke: var(--primary-dark); stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.pwa-install-options { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 8px; margin-top: 12px; }
.pwa-install-options button { padding: 8px 0; border: 0; background: transparent; color: var(--primary-dark); font: inherit; font-size: 12px; text-decoration: underline; cursor: pointer; }
.pwa-install button:focus-visible { outline: 2px solid var(--primary-dark); outline-offset: 3px; }
.pwa-install-actions { display: grid; gap: 8px; margin-top: 20px; }
.pwa-install-actions button { font: 700 14px var(--sans); cursor: pointer; }
.pwa-install-later { min-height: 44px; border: 0; border-radius: 14px; background: transparent; color: var(--primary-dark); }
@media (max-width: 700px), (max-width: 1024px) and (orientation: portrait) {
    .pwa-install { width: min(380px, calc(100% - 32px - env(safe-area-inset-left) - env(safe-area-inset-right))); padding: 24px; }
}