.summary-head, .ledger-head, .invoice-top, .payment-card { display: flex; align-items: center; justify-content: space-between; }
.summary-head { align-items: flex-start; gap: 22px; }
.account-summary::before { background: var(--gold); }
.account-summary .section-label { margin: 0 0 12px; }
.account-chip { padding: 8px 10px; border: 1px solid #4c4538; color: var(--gold); font: 10px/1 ui-monospace, "Cascadia Mono", monospace; white-space: nowrap; }
.summary-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); margin: 26px 0 0; border-top: 1px solid var(--line); border-left: 1px solid var(--line); }
.summary-item { min-height: 88px; padding: 17px; border-right: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.summary-item dt { color: var(--muted-deep); font-size: 10px; }
.summary-item dd { margin: 11px 0 0; color: #d8d5cf; font-size: 14px; font-weight: 600; overflow-wrap: anywhere; }
.manage-link { display: inline-flex; margin-top: 18px; gap: 10px; align-items: center; color: var(--gold); font-size: 11px; text-decoration: none; }
.manage-link:hover { color: var(--text); }

.ledger-section { margin-top: 14px; padding: 27px 28px; border: 1px solid var(--line); background: rgba(12,13,15,.74); }
.ledger-head { gap: 18px; margin-bottom: 18px; }
.ledger-head .section-label { margin: 0 0 9px; }
.ledger-head h2 { margin: 0; font-size: 18px; }
.ledger-head > span { color: var(--muted-deep); font-size: 10px; }
.invoice-list, .payment-list { display: grid; gap: 8px; }
.invoice-card { padding: 16px 17px; border: 1px solid var(--line-soft); background: #0a0b0d; }
.invoice-top { gap: 16px; }
.invoice-date { color: #cbc8c1; font-size: 12px; }
.invoice-amount { color: var(--text); font: 650 17px/1.2 ui-monospace, "Cascadia Mono", monospace; }
.invoice-meta { display: grid; grid-template-columns: 1fr auto auto; gap: 12px; align-items: center; margin-top: 13px; padding-top: 12px; border-top: 1px solid var(--line-soft); color: var(--muted-deep); font-size: 10px; }
.invoice-number { overflow-wrap: anywhere; }
.status { padding: 5px 7px; border: 1px solid currentColor; font: 9px/1 ui-monospace, "Cascadia Mono", monospace; text-transform: uppercase; }
.status-paid { color: var(--green); }
.status-open { color: var(--amber); }
.status-other { color: var(--muted); }
.invoice-link { color: var(--gold); text-decoration: none; white-space: nowrap; }

.payment-card { min-height: 68px; gap: 18px; padding: 13px 16px; border: 1px solid var(--line-soft); background: #0a0b0d; }
.payment-brand { display: flex; align-items: center; gap: 13px; }
.card-mark { display: grid; width: 38px; height: 26px; place-items: center; border: 1px solid #514835; color: var(--gold); font: 8px/1 ui-monospace, monospace; }
.payment-brand strong { display: block; font-size: 12px; text-transform: uppercase; }
.payment-brand span { display: block; margin-top: 5px; color: var(--muted-deep); font: 10px/1 ui-monospace, monospace; }
.payment-expiry { color: var(--muted); font-size: 11px; text-align: right; }
.default-tag { margin-left: 8px; color: var(--green); }

.billing-profile { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 1px; background: var(--line-soft); border: 1px solid var(--line-soft); }
.profile-item { min-height: 78px; padding: 15px; background: #0a0b0d; }
.profile-item span { display: block; color: var(--muted-deep); font-size: 10px; }
.profile-item strong { display: block; margin-top: 10px; color: #d0cdc6; font-size: 12px; line-height: 1.55; font-weight: 500; overflow-wrap: anywhere; }
.section-empty { margin: 0; padding: 18px; border: 1px dashed var(--line); color: var(--muted-deep); font-size: 11px; text-align: center; }

@media (max-width: 720px) {
  .summary-grid { grid-template-columns: repeat(2, minmax(0,1fr)); }
  .ledger-section { padding: 23px 18px; }
}
@media (max-width: 500px) {
  .summary-head { flex-direction: column-reverse; }
  .invoice-meta { grid-template-columns: 1fr auto; }
  .invoice-number { grid-column: 1 / -1; }
  .billing-profile { grid-template-columns: 1fr; }
  .payment-card { align-items: flex-start; }
}