/* Shared install/update controls; keep independent of the cached main stylesheet. */
.notification-link { color: #a5f3fc; font-size: .75rem; text-decoration: none; padding: 12px 6px; min-height: 44px; display: inline-flex; align-items: center; }
.notification-link:focus-visible, .pwa-update button:focus-visible { outline: 2px solid #22d3ee; outline-offset: 3px; }
.pwa-update { position: fixed; z-index: 20000; bottom: max(20px, env(safe-area-inset-bottom)); left: 50%; transform: translateX(-50%); display: flex; align-items: center; gap: 16px; padding: 16px 20px; width: min(480px, calc(100% - 32px)); background: #10212d; border: 1px solid #22d3ee; border-radius: 14px; box-shadow: 0 12px 40px #0008; color: #edf7fa; font-size: .9rem; }
.pwa-update[hidden], .notifications-page [hidden] { display: none !important; }
.pwa-update button { flex-shrink: 0; background: #22d3ee; color: #07111a; border: 0; padding: 12px; border-radius: 8px; cursor: pointer; font-weight: 600; }
.notifications-page { max-width: 720px; margin: 36px auto; }
.notifications-page h2 { font-family: 'Spectral', serif; font-size: clamp(2rem, 5vw, 3rem); letter-spacing: -.02em; text-transform: none; line-height: 1.2; margin: 8px 0 16px; }
.notifications-intro { color: #a9bbce; line-height: 1.7; }
.notifications-card { margin: 24px 0; padding: clamp(20px, 4vw, 32px); border: 1px solid #223344; border-radius: 18px; background: linear-gradient(135deg, #10202c, #0c131d); }
.notifications-card h3 { margin: 0 0 14px; }
.notifications-card p, .notifications-card li { line-height: 1.7; }
.notifications-card ul { padding-left: 20px; color: #a9bbce; }
.notifications-card li + li { margin-top: 12px; }
.notifications-card label { display: block; margin: 24px 0 10px; }
.notifications-card input { display: block; width: 100%; min-height: 48px; padding: 12px; background: #070e18; border: 1px solid #426076; border-radius: 8px; color: #edf7fa; font: inherit; box-sizing: border-box; }
.notifications-help { color: #a9bbce; font-size: .85rem; }
.notifications-actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 24px; }
.notifications-card .btn { min-height: 44px; }
@media (max-width: 480px) {
 .notification-link { font-size: .7rem; }
 .pwa-update { gap: 12px; padding: 12px; }
}