.account-branding-page { display: grid; gap: 24px; }
.business-setup { margin-bottom: 24px; }
.business-setup-steps { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
.business-setup-steps a { display: flex; flex-direction: column; gap: 4px; height: 100%; padding: 16px; border: 1px solid var(--ui-color-border); border-radius: 12px; background: var(--ui-color-surface); }
.business-setup-steps a:hover, .business-setup-steps a[aria-current="page"] { border-color: var(--ui-color-primary); }
.business-setup-steps a:focus-visible { outline: 2px solid var(--ui-color-primary); outline-offset: 3px; }
.business-setup-steps strong { font-size: 14px; color: var(--ui-color-text); }
.business-setup-steps span, .business-setup > p { font-size: 12px; line-height: 1.6; color: var(--ui-color-text-muted); }
.business-setup > p { margin-top: 10px; }
.account-company-card { display: flex; align-items: center; flex-wrap: wrap; gap: 28px; padding: 28px; }
.account-company-card > div:nth-child(2) { flex: 1; min-width: 200px; }
.account-company-logo { width: 250px; max-width: 100%; background: #fff; padding: 20px; border-radius: 12px; }
.account-company-logo img { width: 100%; height: auto; }
.account-branding-page h2 { font-size: 20px; font-weight: 600; color: var(--ui-color-text, #1d2939); }
.account-branding-page h3 { font-size: 14px; font-weight: 600; margin-bottom: 12px; }
.account-eyebrow { font-size: 12px; letter-spacing: .08em; text-transform: uppercase; margin-bottom: 6px; }
.account-description { font-size: 14px; line-height: 1.6; color: var(--ui-color-text-muted, #667085); margin-top: 8px; }
.account-branding-section { padding: 24px; }
.account-name-form { display: flex; align-items: flex-end; flex-wrap: wrap; gap: 16px; margin: 20px 0 28px; }
.account-name-form > div { width: 420px; max-width: 100%; }
.account-logo-slots { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 20px; }
.account-asset-preview { background: #f3f5f7; border: 1px solid #e4e7ec; border-radius: 12px; height: 128px; display: flex; align-items: center; justify-content: center; padding: 20px; margin-bottom: 16px; }
.account-asset-preview-dark { background: #172b25; border-color: #172b25; }
.account-asset-preview img { max-height: 100%; max-width: 100%; object-fit: contain; }
.account-asset-preview img.account-preview-icon { width: 64px; height: 64px; }
.account-logo-slot { min-width: 0; }
.account-logo-slot input[type="file"] { width: 100%; min-height: 44px; font-size: 12px; }
.account-download-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; margin-top: 24px; }
.account-download-links { display: flex; flex-wrap: wrap; gap: 8px; }
.account-download-links .ui-btn { min-height: 44px; }
.account-profile-link { display: flex; align-items: center; gap: 16px; padding: 20px 24px; margin-bottom: 24px; }
.account-profile-link img { width: 40px; height: 40px; object-fit: contain; }
.account-profile-link > div { flex: 1; }
.account-menu-company { display: flex; gap: 10px; align-items: center; border-bottom: 1px solid var(--ui-color-border, #e4e7ec); padding: 8px 4px 14px; margin-bottom: 12px; }
.account-menu-company img { width: 32px; height: 32px; object-fit: contain; }
.account-menu-company strong, .account-menu-company span { display: block; }
.account-menu-company strong { font-size: 14px; }
.account-menu-company span { font-size: 12px; margin-top: 3px; }
.account-sidebar-brand { display: flex; align-items: center; width: 100%; min-width: 0; height: 64px; }
.account-sidebar-logo { display: block; width: 220px; max-width: 100%; }
.account-sidebar-logo img { width: 100%; height: auto; max-height: 64px; object-fit: contain; }
.account-sidebar-brand .logo-icon { display: none; flex-shrink: 0; width: 40px; height: 40px; object-fit: contain; }
/* The same toggle opens the mobile drawer and collapses the desktop rail. */
@media (min-width: 1280px) {
  .app-sidebar.is-open .account-sidebar-brand { justify-content: center; }
  .app-sidebar.is-open .account-sidebar-logo { display: none; }
  .app-sidebar.is-open .account-sidebar-brand .logo-icon { display: block; }
}
.account-auth-logo { width: min(360px, 100%); height: auto; }
.account-auth-panel-logo { width: min(420px, 80%); }
.account-auth-panel-logo img { width: 100%; height: auto; }
body.dark .account-branding-page h2 { color: #f2f4f7; }
body.dark .account-description { color: #98a2b3; }
@media (max-width: 1199px) {
  .account-logo-slots { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 767px) {
  .business-setup-steps { grid-template-columns: 1fr; }
  .account-download-grid { grid-template-columns: 1fr; }
  .account-company-card, .account-branding-section { padding: 20px; }
}
@media (max-width: 480px) {
  .account-logo-slots { grid-template-columns: 1fr; }
  .account-profile-link { flex-wrap: wrap; }
}