.commerce{max-width:1160px}.commerce .panel{margin:24px 0;scroll-margin-top:20px}.commerce-tabs{display:flex;flex-wrap:wrap;gap:12px;margin:20px 0}.commerce-tabs a{padding:12px 17px;border:1px solid #403d51;border-radius:12px;color:#e7ddff;text-decoration:none;background:#211d30}.plan-card{display:flex;gap:28px;align-items:center;justify-content:space-between}.plan-card h2{font-size:44px}.plan-card h2 small{font-size:18px;font-weight:400}.balance-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}.balance-grid article{padding:22px;border:1px solid #403d51;border-radius:18px;background:#1d1928}.balance-grid strong{display:block;font-size:27px;margin-top:10px}.commerce .scroll-table{overflow:auto;max-width:100%;margin:18px 0}.commerce table{border-collapse:collapse;width:100%;min-width:550px;text-align:left}.commerce th,.commerce td{padding:15px 12px;border-bottom:1px solid #35333f;white-space:nowrap}.commerce th{font-size:13px;color:#b8aecf}.commerce td{font-size:14px}.commerce .row-card{padding:20px 0;border-bottom:1px solid #373342}.commerce .row-card h3{margin:0 0 12px}.commerce .row-card form{display:flex;flex-wrap:wrap;gap:12px;align-items:end}.commerce .row-card label{display:block;margin-top:8px}.commerce .row-card input,.commerce .row-card select{max-width:320px}.commerce #notice{border-radius:12px;padding:0;color:#c3ffa8}.commerce #notice:not(:empty){padding:16px;border:1px solid #537854;margin-bottom:20px}.commerce #notice.error{color:#ffbcb6;border-color:#a75555}.signup{max-width:600px;margin:auto!important}.commerce form small{display:block;margin:14px 0}.commerce input[readonly]{min-width:0}.commerce .muted{color:#aca4bb}.commerce .primary{margin-top:10px}.commerce .badge{display:inline-block;padding:5px 9px;border-radius:8px;background:#312640}.commerce .row-card p{overflow-wrap:anywhere}.commerce [hidden]{display:none!important}@media(max-width:700px){.balance-grid{grid-template-columns:repeat(2,1fr)}.plan-card{display:block}.commerce-tabs{gap:8px}.commerce-tabs a{padding:9px 12px}.commerce .row-card form{display:block}.commerce .row-card input,.commerce .row-card select{max-width:100%}.commerce .page-title{align-items:start}.commerce h1{font-size:30px}.commerce .panel{padding:22px}.balance-grid article{padding:15px}.balance-grid strong{font-size:22px}.top nav{flex-wrap:wrap;gap:12px}}

/* Compact plan selector. Explicit radio sizing overrides the shared text-input rule. */
.commerce #plan-view{max-width:820px}
.commerce .plan-card{display:block;padding:24px}
.commerce .plan-card h2{font-size:22px;margin:0 0 8px}
.commerce .plan-card p{font-size:13px;margin:0 0 12px}
.commerce .plan-options{border:0;padding:0;margin:18px 0 16px;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;min-width:0}
.commerce .plan-options legend{font-size:12px;margin-bottom:10px;color:#bfb5cd}
.commerce .plan-options .plan-option{display:grid;grid-template-columns:18px minmax(0,1fr);gap:12px;align-items:start;min-width:0;border:1px solid #484052;border-radius:12px;padding:16px;margin:0;background:#15121e;cursor:pointer;font-size:12px;font-weight:400;line-height:1.5;text-align:left}
.commerce .plan-option:has(input:checked){border-color:#b58aff;background:#261c39;box-shadow:0 0 0 1px #b58aff}
.commerce .plan-option:focus-within{outline:2px solid #ddd0ff;outline-offset:3px}
.commerce .plan-options .plan-option>input[type=radio]{appearance:auto;display:block;box-sizing:border-box;width:18px;height:18px;min-width:18px;max-width:18px;padding:0;margin:2px 0 0;border:initial;border-radius:50%;background:initial;accent-color:#b58aff}
.commerce .plan-option>span{display:grid;min-width:0;gap:6px;color:#bab3c8}
.commerce .plan-option strong{font-size:14px;color:#eee7ff}
.commerce .plan-option .plan-price{display:flex;align-items:baseline;gap:6px;flex-wrap:nowrap;white-space:nowrap;font-size:28px;font-weight:700;line-height:1.3;color:#fff;margin:2px 0}
.commerce .plan-price small{display:inline;margin:0;font-size:12px;font-weight:400;white-space:nowrap}
.commerce .plan-saving{font-size:12px;color:#cfb5ff;line-height:1.5}
.commerce .plan-card #checkout{margin-top:2px;padding:11px 16px;font-size:13px}
.commerce .plan-card #checkout-info{font-size:12px;line-height:1.5;margin:10px 0 0;max-width:600px}
@media(max-width:600px){.commerce .plan-options{grid-template-columns:1fr;gap:10px}.commerce .plan-card{padding:18px}.commerce .plan-options .plan-option{padding:14px}.commerce .plan-card #checkout{width:100%}}