/* Customer account, on top of dashboard.css: download panel, device row and settings. */
.acct-intro { grid-template-columns: 1fr; }
.acct-tiles { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.acct-badge { display: inline-flex; align-self: start; justify-self: start; padding: 5px 10px; border-radius: 999px; background: #b318ff1f; color: #d9a6ff; font-size: 12px; }

.acct-os { display: flex; gap: 4px; flex-shrink: 0; padding: 4px; border-radius: 999px; background: var(--raised); }
.acct-os button { min-height: 36px; padding: 0 16px; border: 0; border-radius: 999px; background: transparent; color: var(--secondary); font-size: 14px; font-weight: 500; transition: background .2s ease, color .2s ease; }
.acct-os button:hover { color: #fff; }
.acct-os button[aria-pressed="true"] { background: #f5f5f7; color: #111113; }

.acct-release-main { display: flex; align-items: center; justify-content: space-between; gap: 20px; padding: 20px 22px; border-radius: 16px; background: var(--raised); }
.acct-release-main > div { display: grid; gap: 6px; min-width: 0; }
.acct-release-main strong { font-size: 22px; font-weight: 600; letter-spacing: -.02em; }
.acct-download { display: inline-flex; align-items: center; gap: 9px; flex-shrink: 0; min-height: 46px; padding: 0 22px; font-size: 15px; }
.acct-notes { margin-top: 22px; }
.acct-notes h3, .acct-subtitle { margin: 0; font-size: 15px; font-weight: 500; }
.acct-subtitle { margin-top: 28px; }
.acct-notes .line-list { margin: 8px 0 0; }
.acct-previous { margin: 0; padding: 0; list-style: none; }
.acct-previous li { display: flex; align-items: center; gap: 14px; padding: 10px 0; border-bottom: 1px solid var(--line); font-size: 14px; }
.acct-previous li:last-child { border-bottom: 0; }
.acct-previous li .acct-link { margin-left: auto; }

.acct-link { padding: 6px 0 4px; border: 0; font-size: 14px; }

.acct-device { display: flex; align-items: center; gap: 14px; padding: 16px 18px; border-radius: 16px; background: var(--raised); }
.acct-device > svg { flex-shrink: 0; width: 26px; height: 26px; color: var(--secondary); }
.acct-device > div { display: grid; gap: 4px; min-width: 0; }
.acct-device strong { font-size: 16px; font-weight: 500; }
.acct-device .dash-status { margin-left: auto; flex-shrink: 0; }
.acct-warning, .acct-trust { display: flex; gap: 10px; align-items: flex-start; margin: 16px 0; color: var(--secondary); font-size: 14px; line-height: 1.5; }
.acct-warning svg { flex-shrink: 0; margin-top: 1px; color: #d8b36a; }
.acct-trust { margin: 18px 0 0; padding: 14px 16px; border-radius: 14px; background: #ffffff0a; color: #d0d0d6; }
.acct-trust svg { flex-shrink: 0; margin-top: 1px; color: var(--accent-text); }

.acct-primary { min-height: 44px; padding: 0 22px; }
.acct-note { margin-top: 14px; color: var(--muted); font-size: 13px; line-height: 1.5; }

.acct-settings { margin: 0; padding: 0; list-style: none; }
.acct-settings li { display: flex; align-items: center; justify-content: space-between; gap: 18px; padding: 16px 0; border-bottom: 1px solid var(--line); }
.acct-settings li:first-child { padding-top: 0; }
.acct-settings li > div { display: grid; gap: 4px; min-width: 0; }
.acct-settings strong { font-size: 15px; font-weight: 500; }
.acct-settings .dash-sub { overflow-wrap: anywhere; }
.acct-settings .dash-status { font-size: 13px; }

.acct-help { display: flex; flex-wrap: wrap; gap: 12px 28px; margin-top: 26px; padding: 0 4px; }
.acct-help a { font-size: 14px; }

@media (max-width: 1000px) {
  .acct-tiles { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 720px) {
  .acct-tiles { grid-template-columns: 1fr; }
  .acct-release-main { flex-direction: column; align-items: stretch; }
  .acct-download { justify-content: center; }
  .acct-device { flex-wrap: wrap; }
  .acct-device .dash-status { margin-left: 40px; }
}
@media (max-width: 600px) {
  .acct-settings li { flex-wrap: wrap; }
  .acct-history th, .acct-history td { white-space: normal; }
  .acct-history .dash-status { align-items: flex-start; }
  .acct-history .dash-status i { flex-shrink: 0; margin-top: 6px; }
  .acct-os { align-self: stretch; }
  .acct-os button { flex: 1; }
}
@media (prefers-reduced-motion: reduce) { .acct-os button { transition: none; } }

[hidden]{display:none!important}
#account-email{overflow-wrap:anywhere}
#account-status{padding:20px}
