.pwa-splash { position: fixed; z-index: 10000; inset: 0; display: grid; place-content: center; justify-items: center; gap: 14px; background: #f7f3e8; color: #17383b; opacity: 1; transition: opacity .24s ease; }
.pwa-splash.is-complete { opacity: 0; pointer-events: none; }
.pwa-splash img { width: 96px; height: 96px; border-radius: 22px; }
.pwa-splash strong { font-size: 18px; letter-spacing: .08em; }
.pwa-splash > span:last-child { color: #58716c; font: 15px/1.6 "Microsoft YaHei","Noto Sans CJK SC",system-ui,sans-serif; }
.pwa-progress { width: min(240px,60vw); height: 3px; overflow: hidden; border-radius: 999px; background: #d8ddd5; }
.pwa-progress i { display: block; width: 0; height: 100%; background: #1f5d72; transition: width .18s ease; }
.pwa-network-state { position: sticky; z-index: 9999; top: 0; padding: 9px 16px; background: #7b342e; color: white; text-align: center; font-size: 13px; line-height: 1.5; }
.pwa-network-state[hidden] { display: none !important; }
.pwa-update-state { position: fixed; z-index: 9998; right: 16px; bottom: 16px; display: flex; align-items: center; gap: 12px; max-width: calc(100% - 32px); padding: 12px 14px; border: 1px solid #b9c7c0; border-radius: 10px; background: #fffef9; color: #173c32; box-shadow: 0 12px 35px rgba(24,54,45,.18); font-size: 13px; }
.pwa-update-state button { min-height: 36px; padding: 0 12px; border: 0; border-radius: 7px; background: #2f6758; color: white; font: inherit; font-weight: 700; cursor: pointer; }
@media (prefers-reduced-motion: reduce) { .pwa-splash,.pwa-progress i { transition: none; } }