.account-tabs{display:flex;gap:5px;align-items:center;padding:4px;border:1px solid var(--line);border-radius:12px;background:var(--surface)}
.account-tabs [role=tab][aria-selected=true]{background:#234538;color:var(--green);border-color:#497464}
.billing-view{max-width:1384px;margin:auto;padding:36px 28px 65px}
.billing-view .intro{max-width:770px;padding:14px 0 30px}
.billing-view .intro h1{font-size:clamp(30px,4vw,48px);margin:14px 0 20px;line-height:1.15}
.billing-view .intro h1 span{color:var(--green)}
.billing-view .intro>p:last-child{color:var(--muted);line-height:1.8;font-size:15px}
.billing-view .notice{padding:14px 18px;border:1px solid #655b37;border-radius:12px;background:#29291f;color:#e9d48f;margin-bottom:20px}
.billing-view .summary{display:grid;grid-template-columns:1fr 1.3fr 1.5fr;background:var(--surface);border:1px solid var(--line);border-radius:16px;margin:12px 0 30px}
.billing-view .summary article{padding:24px}
.billing-view .summary article+article{border-left:1px solid var(--line)}
.billing-view .summary span,.billing-view .summary small{display:block;color:var(--muted);font-size:12px}
.billing-view .summary strong{display:block;font-size:29px;margin:10px 0;color:var(--green)}
.billing-view .summary p{font-size:13px;line-height:1.7;margin:10px 0}
.billing-view .summary a{color:var(--green);font-size:13px}
.billing-view .plans{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}
.billing-view .plan{display:flex;flex-direction:column;padding:26px 22px;border:1px solid var(--line);border-radius:18px;background:var(--surface)}
.billing-view .plan.featured{border-color:var(--green);background:linear-gradient(145deg,#143931,#111c28)}
.billing-view .plan h2{font-size:19px;margin:0 0 25px}
.billing-view .credits{font-size:29px;font-weight:650;letter-spacing:-1px}
.billing-view .duration{font-size:12px;color:var(--muted);margin:8px 0 25px}
.billing-view .price{font-size:30px;letter-spacing:-1px;font-weight:650;white-space:nowrap}
.billing-view .unit{font-size:12px;line-height:1.6;color:var(--muted);min-height:40px;margin:8px 0 20px}
.billing-view .plan ul{padding-left:18px;font-size:12px;line-height:1.9;color:#b9cbd6;margin:0 0 24px}
.billing-view button{font:inherit;cursor:pointer;border:1px solid var(--line);border-radius:10px;padding:11px 15px;font-size:12px;font-weight:600}
.billing-view .primary{background:var(--green);border-color:var(--green);color:#103426}
.billing-view .secondary{background:#1d2d3c;color:var(--text)}
.billing-view .plan button{margin-top:auto;width:100%}
.billing-view .rules{margin:42px 0}
.billing-view .rules h2,.billing-view .section-heading h2,.billing-view section>h2{font-size:22px;letter-spacing:-.5px;margin-bottom:16px}
.billing-view .rules>div{display:grid;grid-template-columns:repeat(3,1fr);gap:28px}
.billing-view .rules p{font-size:13px;line-height:1.8;color:var(--muted)}
.billing-view .rules b{display:block;color:var(--text);margin-bottom:6px}
.billing-view .section-heading{display:flex;justify-content:space-between;align-items:center;gap:12px;margin:25px 0 10px}
.billing-view .table-wrap{overflow:auto;background:var(--surface);border:1px solid var(--line);border-radius:12px;margin:15px 0 26px}
.billing-view table{width:100%;min-width:610px;border-collapse:collapse;font-size:12px}
.billing-view th,.billing-view td{text-align:left;padding:15px;border-bottom:1px solid var(--line);overflow-wrap:anywhere}
.billing-view th{color:var(--muted);font-weight:600}
.billing-view td button{padding:7px 10px;margin:3px}
.billing-view .subscription{display:flex;align-items:center;justify-content:space-between;gap:18px;background:var(--surface);border:1px solid var(--line);border-radius:12px;padding:20px;margin:12px 0}
.billing-view .subscription p{margin:7px 0}
.billing-view .muted{font-size:12px;line-height:1.7;color:var(--muted)}
.billing-view .error{color:var(--danger)}
.billing-view .actions{display:flex;gap:8px;flex-wrap:wrap}
.billing-view dialog{background:var(--surface);color:var(--text);border:1px solid var(--line);border-radius:18px;width:min(620px,calc(100vw - 24px));max-height:90vh;padding:26px;box-shadow:0 25px 90px #0008}
.billing-view dialog::backdrop{background:#050b13b3}
.billing-view dialog p{margin:14px 0;line-height:1.7}
.billing-view dialog .section-heading{margin-top:0}
.billing-view .form-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.billing-view label{display:block;font-size:12px;font-weight:600}
.billing-view input,.billing-view textarea{display:block;width:100%;margin-top:7px;min-width:0;padding:11px;font:inherit;border:1px solid #344153;border-radius:8px;background:#0c1621;color:var(--text)}
.billing-view .wide{grid-column:1/-1}
.billing-view .consent{display:flex;gap:10px;line-height:1.7;margin:20px 0}
.billing-view .consent input{width:18px;flex-shrink:0}
@media(max-width:1100px){.billing-view .plans{grid-template-columns:repeat(2,minmax(0,1fr))}.topbar:has(.account-tabs){height:auto;min-height:78px;flex-wrap:wrap;padding-top:15px;padding-bottom:15px}.account:has(.account-tabs){flex-wrap:wrap;justify-content:flex-end}}
@media(max-width:600px){.billing-view{padding:24px 18px 40px}.billing-view .plans,.billing-view .summary,.billing-view .rules>div,.billing-view .form-grid{grid-template-columns:1fr}.billing-view .summary article+article{border-left:0;border-top:1px solid var(--line)}.billing-view .rules>div{gap:16px}.billing-view .subscription{align-items:flex-start;flex-direction:column}.billing-view dialog{padding:20px}.account-tabs{order:-1;flex:1 0 100%;justify-content:center}.account-tabs button{flex:1}.account:has(.account-tabs){width:100%;gap:8px}.billing-view .intro h1{font-size:30px}}

.billing-view .payment-steps{padding-left:24px;margin:16px 0 24px;line-height:1.7;color:var(--muted);font-size:14px}
.billing-view .payment-steps li{padding-left:4px;margin:10px 0;overflow-wrap:anywhere}
.billing-view .payment-steps li::marker{color:var(--accent);font-weight:700}
.billing-view dialog h3{margin:22px 0 8px;font-size:16px}

.payment-pagination{display:flex;align-items:center;justify-content:center;gap:16px;margin:0 0 28px}.pending-notice{padding:14px;border:1px solid var(--line);border-radius:10px;color:var(--muted);line-height:1.7}
