/* CPCS PWA V1 + V2 */
.cpcs-pwa-network-pill{
    position:fixed;
    left:50%;
    bottom:18px;
    z-index:9500;
    transform:translate(-50%,14px);
    opacity:0;
    pointer-events:none;
    padding:9px 14px;
    border:1px solid rgba(76,126,173,.28);
    border-radius:999px;
    background:rgba(246,251,255,.78);
    box-shadow:0 10px 34px rgba(23,60,94,.12);
    backdrop-filter:blur(18px);
    color:#23496d;
    font-size:12px;
    font-weight:800;
    transition:opacity .18s ease,transform .18s ease;
}
.cpcs-pwa-network-pill.is-visible{opacity:1;transform:translate(-50%,0)}
.cpcs-pwa-network-pill.is-offline{
    border-color:rgba(180,113,28,.28);
    background:rgba(255,248,232,.86);
    color:#77510c;
}
.cpcs-pwa-navbar-btn{position:relative}
.cpcs-pwa-queue-badge{
    position:absolute;
    top:4px;
    right:4px;
    min-width:15px;
    height:15px;
    padding:0 4px;
    display:none;
    align-items:center;
    justify-content:center;
    border-radius:999px;
    background:#2563eb;
    color:#fff;
    font-size:9px;
    line-height:1;
    font-weight:900;
    box-shadow:0 0 0 2px rgba(239,247,255,.95);
}
.cpcs-pwa-queue-badge.is-visible{display:flex}
.cpcs-pwa-overlay{
    position:fixed;
    inset:0;
    z-index:20000;
    display:grid;
    place-items:center;
    padding:24px;
    background:rgba(10,35,61,.24);
    backdrop-filter:blur(12px);
}
.cpcs-pwa-panel{
    width:min(620px,100%);
    max-height:min(760px,calc(100vh - 32px));
    overflow:auto;
    padding:24px;
    border:1px solid rgba(108,151,190,.30);
    border-radius:24px;
    background:linear-gradient(145deg,rgba(255,255,255,.88),rgba(235,247,255,.78));
    box-shadow:0 30px 90px rgba(10,49,84,.22);
    color:#153452;
}
.cpcs-pwa-panel-head{
    display:flex;
    gap:18px;
    align-items:flex-start;
    justify-content:space-between;
}
.cpcs-pwa-kicker{
    display:block;
    margin-bottom:6px;
    color:#2563eb;
    font-size:11px;
    font-weight:900;
    letter-spacing:.12em;
}
.cpcs-pwa-panel h2{margin:0;color:#0b2a52;font-size:25px}
.cpcs-pwa-panel-head p{margin:7px 0 0;color:#61798f;line-height:1.55}
.cpcs-pwa-close{
    flex:0 0 auto;
    width:38px;
    height:38px;
    border:1px solid rgba(100,143,183,.25);
    border-radius:12px;
    background:rgba(255,255,255,.58);
    color:#23496d;
    cursor:pointer;
}
.cpcs-pwa-status-grid{
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:10px;
    margin:22px 0;
}
.cpcs-pwa-status-grid>div{
    padding:14px;
    border:1px solid rgba(100,143,183,.20);
    border-radius:15px;
    background:rgba(255,255,255,.44);
}
.cpcs-pwa-status-grid span{
    display:block;
    margin-bottom:5px;
    color:#71869a;
    font-size:11px;
}
.cpcs-pwa-status-grid strong{color:#163e62;font-size:14px}
.cpcs-pwa-actions{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:10px;
}
.cpcs-pwa-actions .cpcs-btn{
    min-height:44px;
    justify-content:center;
    gap:8px;
}
.cpcs-pwa-note{
    display:flex;
    gap:12px;
    margin-top:18px;
    padding:14px;
    border:1px solid rgba(72,128,181,.20);
    border-radius:16px;
    background:rgba(225,242,255,.48);
    color:#4a647b;
}
.cpcs-pwa-note svg{flex:0 0 auto;color:#2563eb}
.cpcs-pwa-note p{margin:0;font-size:12px;line-height:1.55}
.cpcs-pwa-panel footer{
    margin-top:16px;
    color:#8799aa;
    font-size:10px;
    text-align:right;
}
@media(max-width:700px){
    .cpcs-pwa-overlay{padding:12px}
    .cpcs-pwa-panel{padding:18px;border-radius:20px}
    .cpcs-pwa-status-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
    .cpcs-pwa-actions{grid-template-columns:1fr}
}
@media(display-mode:standalone){
    body{overscroll-behavior-y:none}
}