.qvbb-pwa-launcher {
    position: fixed;
    z-index: 99980;
    right: max(18px, env(safe-area-inset-right));
    bottom: max(18px, env(safe-area-inset-bottom));
    display: grid;
    justify-items: end;
    gap: 10px;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    opacity: 0;
    transform: translateY(12px);
    transition: opacity .2s ease, transform .2s ease;
}
.qvbb-pwa-launcher.is-visible { opacity: 1; transform: translateY(0); }
.qvbb-pwa-launcher[hidden], .qvbb-pwa-panel[hidden] { display: none !important; }
.qvbb-pwa-launcher-button {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    min-height: 46px;
    padding: 10px 16px;
    border: 1px solid rgba(7,92,198,.18);
    border-radius: 999px;
    background: #fff;
    color: #093b63;
    box-shadow: 0 12px 32px rgba(6,55,77,.18);
    font-weight: 750;
    cursor: pointer;
}
.qvbb-pwa-launcher-button > span:first-child {
    color: #f2b400;
    font-size: 22px;
    line-height: 1;
}
.qvbb-pwa-panel {
    position: relative;
    width: min(390px, calc(100vw - 28px));
    padding: 22px;
    border: 1px solid #d8e9ee;
    border-radius: 22px;
    background: rgba(255,255,255,.98);
    color: #173b4b;
    box-shadow: 0 22px 60px rgba(6,55,77,.24);
    opacity: 0;
    transform: translateY(8px) scale(.98);
    transition: opacity .18s ease, transform .18s ease;
    backdrop-filter: blur(12px);
}
.qvbb-pwa-panel.is-open { opacity: 1; transform: translateY(0) scale(1); }
.qvbb-pwa-panel > img {
    float: left;
    margin: 0 15px 10px 0;
    border-radius: 16px;
    box-shadow: 0 6px 16px rgba(5,76,118,.16);
}
.qvbb-pwa-panel-copy h3 { margin: 0 26px 6px 0; color: #075cc6; font-size: 20px; line-height: 1.2; }
.qvbb-pwa-panel-copy p { margin: 0; color: #526d79; font-size: 14px; line-height: 1.5; }
.qvbb-pwa-close {
    position: absolute;
    top: 10px;
    right: 12px;
    width: 34px;
    height: 34px;
    padding: 0;
    border: 0;
    border-radius: 50%;
    background: #eef6f9;
    color: #294c5b;
    font-size: 24px;
    line-height: 1;
    cursor: pointer;
}
.qvbb-pwa-actions { clear: both; display: grid; grid-template-columns: 1fr 1fr; gap: 10px; padding-top: 16px; }
.qvbb-pwa-actions button {
    min-height: 44px;
    padding: 10px 13px;
    border-radius: 12px;
    font-weight: 750;
    cursor: pointer;
}
.qvbb-pwa-primary { border: 1px solid #075cc6; background: #075cc6; color: #fff; }
.qvbb-pwa-secondary { border: 1px solid #bdd8e3; background: #f5fbfd; color: #07527c; }
.qvbb-pwa-actions button:disabled { opacity: .58; cursor: default; }
.qvbb-pwa-actions button.is-complete { border-color: #3a8f2a; background: #eaf7e7; color: #27651e; }
.qvbb-pwa-status { min-height: 18px; margin: 12px 0 0; color: #60747d; font-size: 13px; line-height: 1.4; }
.qvbb-pwa-status.is-success { color: #287322; }
.qvbb-pwa-status.is-error { color: #b62e2e; }
.qvbb-pwa-status.is-warning { color: #9d6100; }
.qvbb-pwa-status.is-info { color: #075cc6; }

@media (max-width: 600px) {
    .qvbb-pwa-launcher {
        left: max(12px, env(safe-area-inset-left));
        right: max(12px, env(safe-area-inset-right));
        bottom: max(12px, env(safe-area-inset-bottom));
        justify-items: stretch;
    }
    .qvbb-pwa-launcher-button { justify-content: center; width: 100%; }
    .qvbb-pwa-panel { width: auto; }
    .qvbb-pwa-actions { grid-template-columns: 1fr; }
}

@media (prefers-reduced-motion: reduce) {
    .qvbb-pwa-launcher, .qvbb-pwa-panel { transition: none; }
}