.key-center,.payment-center,.cc-dialog{--cc-surface:var(--rk-surface,#131c2c);--cc-soft:var(--rk-surface-2,#1a263a);--cc-line:var(--rk-line,#2c3a50);--cc-text:var(--rk-ink,#edf2ff);--cc-muted:var(--rk-muted,#a3b1c9);color:var(--cc-text);font-family:inherit}
html.light .key-center,html.light .payment-center,html.light .cc-dialog{--cc-surface:#fff;--cc-soft:#f1f5fc;--cc-line:#d6dfed;--cc-text:#17233b;--cc-muted:#52637d}
#subsPanel.key-center{display:block!important;min-width:0;margin:12px 0 20px;padding:0;grid-column:1}
.key-center-ready #vpnCardsContainer,.key-center-ready #vpnCardsDots,.key-center-ready #vpnPrevBtn,.key-center-ready #vpnNextBtn{display:none!important}
.key-center-ready .carousel-wrap:not(.empty){display:none!important}
.cc-heading{display:flex;justify-content:space-between;align-items:center;gap:16px;margin-bottom:12px}.cc-heading h3{font-size:24px;letter-spacing:-.6px;font-weight:750;margin:3px 0}.cc-heading h4{font-size:19px;font-weight:700;margin:0;overflow-wrap:anywhere}.cc-eyebrow{font-size:10px;letter-spacing:1.8px;font-weight:700;color:#8daeff}.cc-muted{color:var(--cc-muted);font-size:13px;line-height:1.55;overflow-wrap:anywhere}.cc-heading p{margin:5px 0 0}
.cc-key-grid{display:grid;gap:14px;margin:16px 0}.cc-key,.cc-payment{min-width:0;padding:20px;border:1px solid var(--cc-line);background:var(--cc-surface);border-radius:20px}.cc-key.selected{border-color:#5281ff;box-shadow:inset 3px 0 #5281ff}.cc-key-state{flex-shrink:0;font-size:11px;padding:5px 9px;border-radius:20px;background:var(--cc-soft);color:var(--cc-muted)}.cc-key-state.active{color:#54d6b6;background:rgba(25,175,139,.12)}html.light .cc-key-state.active{color:#087758}
.cc-key-metrics{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:18px 0}.cc-key-metrics small,.cc-key-metrics strong{display:block}.cc-key-metrics strong{font-size:16px;font-weight:650;margin-top:4px}.cc-key-traffic{padding:12px 0;border-top:1px solid var(--cc-line)}.cc-key-traffic p{margin:0 0 8px}.cc-key-traffic progress{display:block;width:100%;height:7px;accent-color:#4b7aff;border:0;border-radius:9px;overflow:hidden}.cc-key-traffic progress::-webkit-progress-bar{background:var(--cc-soft)}.cc-key-traffic progress::-webkit-progress-value{background:#4b7aff;border-radius:9px}
.cc-actions{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin-top:12px}.cc-button{display:inline-flex;align-items:center;justify-content:center;min-height:42px;max-width:100%;gap:6px;padding:9px 13px;border:1px solid var(--cc-line);border-radius:11px;background:var(--cc-soft);color:var(--cc-text);font-family:inherit;font-size:12px;font-weight:600;line-height:1.35;text-decoration:none;cursor:pointer;transition:border-color .15s}.cc-button:hover{border-color:#7a9bff}.cc-button:focus-visible,.cc-rename input:focus-visible{outline:3px solid #7296ff;outline-offset:3px}.cc-button.primary,.cc-button.active{background:#4273ed;color:#fff;border-color:#4273ed}.cc-button:disabled{opacity:.45;cursor:not-allowed}.cc-rename{display:flex;gap:8px;margin:12px 0}.cc-rename[hidden]{display:none}.cc-rename input{min-width:0;flex:1;background:var(--cc-soft);border:1px solid var(--cc-line);color:var(--cc-text);padding:10px;border-radius:10px}
.payment-center{margin-top:16px}.cc-filters{display:flex;flex-wrap:wrap;gap:7px;margin:18px 0}.cc-payment-list{display:grid;gap:12px}.cc-payment-top{display:flex;justify-content:space-between;align-items:flex-start;gap:16px}.cc-payment-top h4{font-size:15px;font-weight:650;margin:0;overflow-wrap:anywhere}.cc-payment-top p{margin:5px 0 10px}.cc-amount{font-size:17px;white-space:nowrap}.cc-status{display:inline-block;font-size:12px;font-weight:650;color:var(--cc-muted);padding:5px 9px;background:var(--cc-soft);border-radius:7px}.cc-payment.done .cc-status{color:#54d6b6}.cc-payment.pending .cc-status{color:#ffca76}.cc-payment.processing .cc-status{color:#aeb8ff}.cc-payment.processing{border-color:#6968a8}.cc-payment.pending{border-color:#806843}html.light .cc-payment.done .cc-status{color:#087758}html.light .cc-payment.pending .cc-status{color:#8b5606}html.light .cc-payment.processing .cc-status{color:#554ab3}.cc-bill{font-size:11px;color:var(--cc-muted);overflow-wrap:anywhere}.cc-empty{padding:24px 12px;border:1px dashed var(--cc-line);border-radius:14px;color:var(--cc-muted);line-height:1.6}.cc-error{color:#f8a5a5;font-size:13px}html.light .cc-error{color:#a52c2c}.payment-center>small{display:block;margin-top:16px}
.cc-dialog{width:min(500px,calc(100vw - 32px));max-height:calc(100dvh - 100px);padding:24px;border:1px solid var(--cc-line);border-radius:22px;background:var(--cc-surface);overflow:auto}.cc-dialog::backdrop{background:rgba(3,9,22,.75)}.cc-dialog h3{overflow-wrap:anywhere}.cc-device{border-top:1px solid var(--cc-line);padding:14px 0}.cc-device strong{font-size:15px}.cc-device p{margin:5px 0}
@media(max-width:1023px){#subsPanel.key-center{margin:18px 16px}.cc-key{padding:18px}.cc-heading h3{font-size:21px}.cc-payment{padding:16px}.cc-payment-top{flex-wrap:wrap;gap:6px}.cc-amount{font-size:17px}.cc-heading{gap:10px}.cc-heading>.cc-button{flex-shrink:0}.payment-center .cc-heading h3{font-size:20px}}
@media(prefers-reduced-motion:reduce){.cc-button{transition:none}}
@media(max-width:1023px){.key-center-ready #page_vpn .vpn-content-wrap{display:flex;flex-direction:column}.key-center-ready #page_vpn .vpn-content-wrap>*{order:5}.key-center-ready #welcomeCard{order:0!important}.key-center-ready #mobileHero{order:1!important}.key-center-ready #quickTiles{order:2!important}.key-center-ready #vpnInfo{order:3!important}.key-center-ready #subsPanel{order:4!important}.key-center-ready #subPills{display:none!important}}