.account-shell { display: grid; grid-template-columns: 220px minmax(0, 1fr); gap: 2rem; align-items: start; }
.account-menu { position: sticky; top: 1.5rem; display: grid; gap: .35rem; }
.account-menu button { border: 0; border-radius: .65rem; background: transparent; color: #566076; padding: .8rem 1rem; text-align: left; font-weight: 500; }
.account-menu button:hover { background: #f1f4f9; color: #13234b; }
.account-menu button[aria-selected="true"] { background: #eaf0ff; color: #1649c5; }
.account-panel { min-width: 0; }
.account-section-card { border: 1px solid #e4e8f0; border-radius: 1rem; background: #fff; padding: 1.5rem; margin-bottom: 1.25rem; }
.account-plan { border: 1px solid #dce2ec; border-radius: .85rem; padding: 1.25rem; margin-top: 1rem; }
.account-plan-title { display: flex; align-items: flex-start; justify-content: space-between; gap: 1rem; }
.account-payment { display: flex; align-items: center; justify-content: space-between; gap: 1rem; flex-wrap: wrap; }
.account-card-mark { display: inline-grid; place-items: center; min-width: 3.2rem; height: 2rem; padding: 0 .5rem; border: 1px solid #ccd3df; border-radius: .35rem; background: #f8f9fb; font-size: .72rem; font-weight: 700; text-transform: uppercase; }
.account-invoices th { color: #667085; font-size: .78rem; text-transform: uppercase; letter-spacing: .04em; }
.account-invoices td, .account-invoices th { padding: .85rem .5rem; vertical-align: middle; }
.account-actions { display: flex; gap: .5rem; flex-wrap: wrap; }
.account-danger { border-color: #efb6b6; }
.account-muted-box { border-radius: .75rem; background: #f7f8fb; padding: 1rem; }
@media (max-width: 991.98px) {
  .account-shell { grid-template-columns: 1fr; gap: 1rem; }
  .account-menu { position: static; grid-template-columns: repeat(3, 1fr); }
  .account-menu button { text-align: center; }
}
@media (max-width: 575.98px) {
  .account-menu { grid-template-columns: 1fr; }
  .account-menu button { text-align: left; }
  .account-section-card { padding: 1.1rem; }
}