/* 添加到主屏幕提示（非 PWA standalone 时） */
.pwa-install-hint {
    position: fixed;
    left: 12px;
    right: 12px;
    z-index: 2147481500;
    max-width: 496px;
    margin: 0 auto;
    pointer-events: auto;
    animation: pwa-install-hint-in 0.35s cubic-bezier(0.32, 0.72, 0, 1);
}

@keyframes pwa-install-hint-in {
    from {
        opacity: 0;
        transform: translateY(12px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.pwa-install-hint-inner {
    background: var(--color-bg-elevated, rgba(255, 255, 255, 0.96));
    backdrop-filter: saturate(180%) blur(20px);
    -webkit-backdrop-filter: saturate(180%) blur(20px);
    border-radius: 14px;
    padding: 14px 16px;
    box-shadow:
        0 4px 24px rgba(0, 0, 0, 0.12),
        0 0 0 0.5px rgba(60, 60, 67, 0.12);
}

.pwa-install-hint-text {
    margin: 0 0 8px;
    font-size: 14px;
    line-height: 1.45;
    color: var(--color-label, #1c1c1e);
    font-weight: 500;
}

.pwa-install-hint-steps {
    margin: 0 0 12px;
    font-size: 12px;
    line-height: 1.45;
    color: var(--color-label-secondary, #8e8e93);
}

.pwa-install-hint-actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 12px;
}

.pwa-install-hint-link {
    font-size: 14px;
    color: var(--color-tint, #007aff);
    text-decoration: none;
}

.pwa-install-hint-link:active {
    opacity: 0.7;
}

.pwa-install-hint-dismiss {
    border: none;
    background: var(--color-tint, #007aff);
    color: #fff;
    font-size: 14px;
    font-weight: 500;
    padding: 8px 16px;
    border-radius: 8px;
    cursor: pointer;
}

.pwa-install-hint-dismiss:active {
    opacity: 0.85;
}

@media (prefers-color-scheme: dark) {
    .pwa-install-hint-inner {
        background: rgba(44, 44, 46, 0.94);
        box-shadow:
            0 4px 24px rgba(0, 0, 0, 0.35),
            0 0 0 0.5px rgba(255, 255, 255, 0.08);
    }
}
