.subscription-panel.subscription-with-qr {grid-template-columns:minmax(0,1fr) 300px minmax(220px,.9fr);gap:28px;align-items:center}
.subscription-qr {margin:0;min-width:0;text-align:center;justify-self:center}
.subscription-qr h3 {margin:0 0 14px;font-size:17px;font-weight:600;color:#dff4ff;line-height:1.5}
.subscription-qr-frame {position:relative;display:grid;place-items:center;width:300px;max-width:100%;aspect-ratio:1;padding:4px;border:1px solid #dce9ef;border-radius:12px;background:#fff;box-shadow:0 6px 22px #00000016;cursor:zoom-in;overflow:hidden}
.subscription-qr-frame:disabled {cursor:default;opacity:1}
.subscription-qr-frame img {display:block;width:100%;height:100%;max-width:100%;object-fit:contain}
.subscription-qr-frame .subscription-qr-status {margin:0;color:#385162;font-size:14px;line-height:1.7}
.subscription-qr-enlarge {display:block;margin-top:10px;color:#b7d3df;font-size:13px;line-height:1.6}
.subscription-qr-save {display:inline-flex;align-items:center;justify-content:center;min-height:44px;min-width:110px;margin-top:2px;padding:8px 15px;border:0;border-radius:7px;background:transparent;color:#aaf0e5;font-size:14px;line-height:1.5}
.subscription-qr-save:hover:enabled {background:#78d8c916}
.subscription-qr-save:focus-visible,.subscription-qr-frame:focus-visible {outline:2px solid #9beedd;outline-offset:4px}
.subscription-qr figcaption {color:#9ab9cd;font-size:12px;line-height:1.8}
.subscription-with-qr .subscription-actions {min-width:0}.subscription-with-qr .subscription-actions .button {justify-content:center;text-align:center}
.subscription-qr-dialog {width:min(600px,calc(100vw - 32px));max-width:none;max-height:calc(100dvh - 32px);padding:28px;overflow:auto;text-align:center;background:#102334;border:1px solid #527b88;border-radius:18px;color:#e5f3fb}
.subscription-qr-dialog::backdrop {background:#030912d9;backdrop-filter:blur(8px)}
.subscription-qr-dialog h2 {margin:8px 40px 22px;font-size:22px;line-height:1.5}
.subscription-qr-dialog .dialog-close {width:44px;height:44px;right:8px;top:8px;font-size:26px}
.subscription-qr-large {display:grid;place-items:center;width:min(100%,512px);aspect-ratio:1;margin:0 auto;padding:4px;background:#fff;border-radius:12px;overflow:hidden;color:#385162}
.subscription-qr-large img {display:block;width:100%;height:100%;object-fit:contain}
.subscription-qr-large p {padding:16px;font-size:15px;line-height:1.7}
.subscription-qr-dialog .subscription-qr-private {margin:16px 0 0;font-size:13px;color:#aac5d3;line-height:1.6}
@media(max-width:1100px) {
 .subscription-panel.subscription-with-qr {grid-template-columns:minmax(0,1fr) 280px;gap:24px}
 .subscription-qr-frame {width:280px}
 .subscription-with-qr .subscription-actions {grid-column:1/-1;display:grid;grid-template-columns:1fr 1fr;gap:12px}
 .subscription-with-qr .subscription-actions .button {margin:0}
}
@media(max-width:700px) {
 .subscription-panel.subscription-with-qr {grid-template-columns:minmax(0,1fr);gap:24px;padding:24px}
 .subscription-with-qr .subscription-actions {grid-column:auto;grid-template-columns:minmax(0,1fr);gap:12px}
 .subscription-qr {padding-top:20px;border-top:1px solid #44687966;width:100%}
 .subscription-qr-frame {width:300px;margin:0 auto}
 .subscription-qr-dialog {padding:18px;border-radius:14px}
 .subscription-qr-dialog h2 {margin:12px 26px 20px;font-size:18px}
}
@media(max-width:360px) {.subscription-panel.subscription-with-qr {padding:21px 18px}}