.account-page { padding: var(--space-8) 0 var(--space-16); }
.account-layout { display: grid; grid-template-columns: 280px 1fr; gap: var(--space-8); align-items: start; }
.account-sidebar { display: flex; flex-direction: column; gap: var(--space-4); }
.member-card {
  background: linear-gradient(135deg, var(--color-primary) 0%, var(--color-primary-dark) 100%);
  color: #fff; border-radius: var(--radius-xl); padding: var(--space-6); box-shadow: var(--shadow-lg);
}
.member-card.premium { background: linear-gradient(135deg, #CC0000 0%, #660000 100%); }
.member-card-name { font-size: var(--font-size-xl); font-weight: 900; margin-bottom: var(--space-1); }
.member-card-number { font-family: monospace; font-size: var(--font-size-sm); opacity: .8; margin-bottom: var(--space-4); }
.member-card-tier { display: inline-block; background: rgba(255,255,255,.2); padding: 2px var(--space-3); border-radius: var(--radius-full); font-size: var(--font-size-xs); font-weight: 700; text-transform: uppercase; letter-spacing: 1px; }
.member-card-tier.premium { background: var(--color-accent); color: #333; }
.member-card-logo { font-weight: 900; font-size: var(--font-size-base); opacity: .5; margin-bottom: var(--space-2); }
.account-nav { background: var(--color-surface); border-radius: var(--radius-lg); box-shadow: var(--shadow-sm); overflow: hidden; }
.account-nav-item { padding: var(--space-4) var(--space-5); font-size: var(--font-size-sm); font-weight: 600; display: flex; align-items: center; gap: var(--space-3); color: var(--color-text-secondary); cursor: pointer; transition: all var(--transition-fast); border-left: 3px solid transparent; }
.account-nav-item:hover { background: var(--color-bg); color: var(--color-text); }
.account-nav-item.active { border-left-color: var(--color-primary); color: var(--color-primary); background: var(--color-bg); }
.account-content { background: var(--color-surface); border-radius: var(--radius-lg); box-shadow: var(--shadow-sm); padding: var(--space-8); }
.account-section-title { font-size: var(--font-size-xl); margin-bottom: var(--space-6); color: var(--color-text); }
.info-row { display: flex; justify-content: space-between; padding: var(--space-3) 0; border-bottom: 1px solid var(--color-border); font-size: var(--font-size-sm); }
.info-row:last-child { border-bottom: none; }
.info-label { color: var(--color-text-secondary); }
.info-value { font-weight: 600; }
@media (max-width: 768px) { .account-layout { grid-template-columns: 1fr; } }