.pwa-banner[hidden], .pwa-dialog [hidden] { display: none !important; }
.pwa-banner { position: fixed; z-index: 90; bottom: calc(18px + env(safe-area-inset-bottom, 0px)); left: 16px; right: 16px; max-width: 430px; margin-inline: auto; display: flex; align-items: flex-start; gap: 12px; padding: 18px; border: 1px solid #dad6cb; border-radius: 18px; background: #fffefa; color: #302c29; box-shadow: 0 8px 35px #302c2926; font: 14px/1.5 var(--sans); }
.pwa-banner img, .pwa-dialog img, .install-page > img { border-radius: 16px; flex-shrink: 0; }
.pwa-banner strong { font-size: 16px; font-weight: 600; }
.pwa-banner p { font-size: 12px; margin: 5px 0 0; color: #68645b; }
.pwa-banner .pwa-close { position: absolute; right: 3px; top: 3px; width: 36px; min-height: 36px; }
.pwa-banner > div { padding-right: 12px; }
.pwa-close { border: 0; background: transparent; font-size: 25px; line-height: 1; color: #68645b; min-height: 44px; width: 44px; cursor: pointer; flex-shrink: 0; }
.pwa-link { border: 0; background: transparent; color: #4b5a3f; padding: 10px 0 0; min-height: 44px; font-size: 13px; font-weight: 600; cursor: pointer; text-align: left; }
.pwa-dialog { border: 1px solid #e1dcd1; border-radius: 24px; background: #fffefa; color: #302c29; padding: 26px; width: min(460px, calc(100% - 24px)); max-height: calc(100dvh - 40px - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px)); overflow-y: auto; overscroll-behavior: contain; font: 15px/1.6 var(--sans); }
.pwa-dialog::backdrop { background: #292c2466; }
.pwa-dialog-top { display: flex; justify-content: space-between; align-items: flex-start; }
.pwa-dialog h2 { font: 34px/1.15 var(--serif); letter-spacing: -.04em; margin: 22px 0 10px; }
.pwa-dialog p { margin: 0 0 18px; color: #68645b; }
.pwa-platforms { display: flex; gap: 4px; margin: 20px 0; padding: 4px; background: #f0eee7; border-radius: 12px; }
.pwa-platforms button { flex: 1; border: 0; background: transparent; color: #68645b; border-radius: 9px; font-size: 12px; min-height: 44px; padding: 6px; cursor: pointer; }
.pwa-platforms button[aria-pressed="true"] { background: #fffefa; color: #302c29; box-shadow: 0 1px 4px #302c2915; }
.pwa-dialog ol { padding-left: 24px; margin: 0 0 22px; }
.pwa-dialog li { padding: 0 0 12px 5px; }
.pwa-dialog li::marker { color: #626e52; font-weight: 600; }
.pwa-primary, .pwa-secondary { width: 100%; min-height: 46px; border-radius: 12px; padding: 11px 18px; border: 1px solid #dad6cb; font-size: 14px; font-weight: 600; cursor: pointer; }
.pwa-primary { background: #4b5a3f; color: #fffefa; border-color: #4b5a3f; }
.pwa-secondary { background: transparent; color: #302c29; }
.pwa-dialog .pwa-small { font-size: 12px; }
.pwa-dialog .pwa-notice { background: #eeeade; padding: 12px; border-radius: 10px; font-size: 13px; }
#pwa-ui :is(button, a, select, input, summary):focus-visible { outline: 3px solid #ae563e; outline-offset: 3px; }
.pwa-browser-label { display: block; font-size: 12px; font-weight: 600; margin-bottom: 6px; }
.pwa-browser-choice { margin-bottom: 20px; }
.pwa-browser-choice > select { margin-bottom: 0; }
.pwa-browser { width: 100%; min-width: 0; min-height: 44px; margin-bottom: 20px; padding: 10px 12px; border: 1px solid #dad6cb; border-radius: 10px; background: #fffefa; color: #302c29; font: 16px var(--sans); }
.pwa-help { border-top: 1px solid #e1dcd1; margin-bottom: 18px; font-size: 13px; }
.pwa-help summary { cursor: pointer; padding: 12px 0; min-height: 44px; }
.pwa-help .pwa-small { margin: 0; }
.pwa-help .pwa-link { padding-top: 0; }
.install-page { display: grid; grid-template-columns: 1fr 1fr; gap: 64px; align-items: start; max-width: 1120px; margin: 0 auto; padding: 64px 6%; }
.install-intro > img { border-radius: 16px; margin-bottom: 22px; }
.install-intro .eyebrow { font-size: 10px; margin-bottom: 12px; }
.install-intro h1 { font-size: clamp(36px, 4vw, 54px); letter-spacing: -1.6px; }
.install-intro > p { margin-top: 18px; font-size: 15px; }
.install-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 20px; margin-top: 24px; }
.install-intro .install-connection-note { padding: 14px 16px; border-left: 3px solid var(--olive); background: var(--olive-light); font-size: 13px; }
.install-connection-note strong { display: block; color: var(--ink); margin-bottom: 4px; }
.install-guide { background: #fffdf8; border: 1px solid var(--line); border-radius: 18px; padding: 26px; scroll-margin-top: 20px; }
.install-guide h2 { font: 25px/1.2 var(--serif); letter-spacing: -.5px; margin-bottom: 12px; }
.install-guide p, .install-guide ol { font-size: 14px; }
.install-guide details { border-bottom: 1px solid var(--line); }
.install-guide details p { padding-bottom: 20px; }
.install-guide summary { padding: 16px 0; font-weight: 500; font-size: 14px; }
.install-guide ol { padding-left: 21px; color: var(--muted); }
.install-guide li { margin-bottom: 12px; padding-left: 4px; }
.install-page .install-small { font-size: 12px; margin-top: 20px; }
body:has(.pwa-dialog[open]) { overflow: hidden; }
@media (max-width: 760px) {
    body:has(.daily-bottom-nav) .pwa-banner, body:has(.studio-admin) .pwa-banner { bottom: calc(90px + env(safe-area-inset-bottom, 0px)); }
    .pwa-dialog { padding: 22px; }
    .install-page { grid-template-columns: 1fr; gap: 28px; padding: 28px 6% 40px; }
    .install-intro > img { width: 64px; height: 64px; margin-bottom: 16px; }
    .install-guide { padding: 22px; }
}
/* Installed views respect the notch and home indicator, including landscape. */
@media (display-mode: standalone), (display-mode: fullscreen) {
    body { padding-top: env(safe-area-inset-top, 0px); padding-left: env(safe-area-inset-left, 0px); padding-right: env(safe-area-inset-right, 0px); }
    .daily-bottom-nav, .admin-sidebar { padding-left: max(8px, env(safe-area-inset-left, 0px)); padding-right: max(8px, env(safe-area-inset-right, 0px)); }
}