.account-page { width: 100%; }
.account-page-head { margin: 6px 0 28px; }
.account-page h1 { margin: 0; color: var(--home-heading); letter-spacing: -.045em; overflow-wrap: anywhere; font-size: var(--text-title); line-height: var(--leading-title); font-weight: var(--weight-semibold); }
.account-id-line { display: flex; align-items: center; gap: 12px; width: fit-content; max-width: 100%; margin-top: 18px; padding: 10px 14px; border: 1px solid var(--line); border-radius: var(--radius); background: var(--paper); }
.account-id-label { flex: 0 0 auto; color: var(--muted); font-size: var(--text-compact); line-height: var(--leading-compact); }
.account-full-id { min-width: 0; color: var(--home-heading); overflow-wrap: anywhere; font-size: var(--text-compact); line-height: var(--leading-compact); }
.account-id-line .copy-button { flex: 0 0 auto; }
.account-page .card { min-width: 0; border-radius: var(--radius); box-shadow: none; }
.account-page .card-head { gap: 12px; padding: var(--panel-inset); border-bottom: 0; }
.account-page .card-head > div:first-child { flex-direction: column; align-items: flex-start; gap: 6px; }
.account-page .card-head h2 { color: var(--home-heading); letter-spacing: -.025em; font-size: var(--text-section); line-height: var(--leading-section); font-weight: var(--weight-semibold); }
.account-page .card-head .row-subtitle { margin: 0; color: var(--muted); font-size: var(--text-meta); line-height: var(--leading-meta); }
.account-page .card-body { padding: 0 var(--panel-inset) var(--panel-inset); }
.account-page .card + .card { margin-top: 24px; }
.account-page .empty { padding: 36px 24px; color: var(--muted); text-align: center; }
.account-page .empty strong { font-weight: var(--weight-normal); font-size: var(--text-meta); line-height: var(--leading-meta); }
.account-page .button { min-height: 40px; border-radius: var(--radius-control); background: var(--paper); color: var(--home-heading); box-shadow: none; font-weight: var(--weight-medium); font-size: var(--text-data); line-height: var(--leading-data); }
.account-page .button:hover { border-color: var(--accent); color: var(--accent); }
.account-page .button:disabled { cursor: wait; opacity: .65; }
.account-value-card { display: grid; grid-template-columns: minmax(0, 1fr) minmax(220px, .8fr); align-items: center; gap: 24px 48px; padding: var(--panel-inset); }
.account-value-heading { display: flex; align-items: center; flex-wrap: wrap; gap: 10px; }
.account-value-heading h2 { margin: 0; color: var(--home-heading); font-size: var(--text-data); line-height: var(--leading-data); font-weight: var(--weight-medium); }
.account-value-partial { padding: 3px 7px; border-radius: var(--radius); color: var(--muted); background: var(--surface); font-size: var(--text-caption); line-height: var(--leading-caption); }
.account-total-value { display: block; margin-top: 12px; color: var(--home-heading); letter-spacing: normal; font-variant-numeric: tabular-nums; overflow-wrap: anywhere; font-size: var(--text-balance); line-height: var(--leading-balance); font-weight: var(--weight-semibold); }
.account-value-main p, .account-value-detail p { margin: 10px 0 0; color: var(--muted); font-size: var(--text-meta); line-height: var(--leading-meta); }
.account-value-main, .account-value-detail { min-width: 0; }
.account-value-detail { text-align: right; }
.account-price-context { color: var(--muted); font-size: var(--text-meta); line-height: var(--leading-meta); }
.account-price-context a { color: var(--accent); }
.account-price-context a:hover { text-decoration: underline; }
.account-coin-table-head, .account-coin-row { grid-template-columns: minmax(0, 1.4fr) minmax(95px, .6fr) minmax(0, 1fr) minmax(95px, .65fr); gap: 24px; padding-inline: var(--panel-inset); }
.account-coin-table-head { min-height: 42px; border-top: 1px solid var(--line); background: color-mix(in srgb, var(--bg) 55%, var(--paper)); font-weight: var(--weight-normal); letter-spacing: normal; text-transform: none; font-size: var(--text-compact); line-height: var(--leading-compact); }
.account-coin-row { min-height: 88px; padding-block: 16px; }
.account-coin-row.primary { background: var(--paper); }
.account-coin-logo { overflow: visible; }
.account-coin-logo:has(img) > span:first-child { visibility: hidden; }
.account-coin-verified { position: absolute; top: -3px; right: -4px; display: grid; width: 14px; height: 14px; place-items: center; border: 2px solid var(--paper); border-radius: 50%; background: var(--accent); color: var(--button-ink); }
.account-coin-verified svg { width: 10px; height: 10px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.account-coin-identity strong { color: var(--home-heading); font-weight: var(--weight-semibold); overflow-wrap: anywhere; }
.account-coin-identity small { white-space: normal; line-height: var(--leading-meta); overflow-wrap: anywhere; }
.account-coin-identity .mono { color: var(--muted); line-height: var(--leading-data); }
.account-coin-balance strong { overflow: visible; color: var(--home-heading); font-family: var(--mono); font-weight: var(--weight-medium); line-height: var(--leading-data); font-variant-numeric: tabular-nums; white-space: normal; overflow-wrap: anywhere; }
.account-coin-value { color: var(--home-heading); font-weight: var(--weight-medium); overflow-wrap: anywhere; font-variant-numeric: tabular-nums; }
.account-page .sender-profile-placeholder { margin: 24px 0; background: var(--paper); }
.account-page .sender-profile-card { margin-bottom: 24px; }
.account-page .sender-profile-body h3 { color: var(--home-heading); font-weight: var(--weight-semibold); font-size: var(--text-body); line-height: var(--leading-body); }
.account-page .sender-profile-tags span { border-radius: var(--radius-control); font-weight: var(--weight-medium); }
.account-page .sender-profile-evidence { line-height: var(--leading-body); }
.account-object-row { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 24px; padding: 18px 24px; }
.account-object-row:first-child { border-top: 1px solid var(--line); }
.account-object-identity { display: flex; min-width: 0; align-items: flex-start; flex-direction: column; gap: 6px; }
.account-object-name { color: var(--home-heading); font-weight: var(--weight-semibold); overflow-wrap: anywhere; font-size: var(--text-data); line-height: var(--leading-data); }
.account-object-name:hover, .account-object-name:focus-visible { color: var(--accent); }
.account-object-id-line { display: flex; max-width: 100%; align-items: center; gap: 8px; }
.account-object-id { color: var(--accent); overflow-wrap: anywhere; font-size: var(--text-meta); line-height: var(--leading-meta); }
.account-object-id:hover { text-decoration: underline; }
.account-object-type { max-width: 100%; color: var(--muted); overflow-wrap: anywhere; font-size: var(--text-meta); line-height: var(--leading-meta); }
.account-object-version { display: flex; flex-direction: column; gap: 5px; align-self: center; color: var(--muted); text-align: right; font-size: var(--text-data); line-height: var(--leading-data); }
.account-object-version strong { color: var(--home-heading); font-weight: var(--weight-medium); font-variant-numeric: tabular-nums; overflow-wrap: anywhere; }
.account-page .account-list-pagination { padding: 18px 24px; }
.account-value-heading .data-pillar { flex-basis: 100%; }
.account-value-detail .data-pillar { display: block; margin-bottom: 8px; }
.account-allocation { margin-top: 24px; }
.allocation-bar { display: block; width: 100%; height: 44px; margin-bottom: 10px; border-radius: 2px; overflow: visible; }
.allocation-bar rect { cursor: pointer; }
.allocation-bar rect:focus-visible { outline: 2px solid var(--ink); outline-offset: 2px; }
.allocation-colour-0 { fill: var(--accent); background: var(--accent); }
.allocation-colour-1 { fill: #477d91; background: #477d91; }
.allocation-colour-2 { fill: #aa854b; background: #aa854b; }
.allocation-colour-3 { fill: #777aa0; background: #777aa0; }
.allocation-colour-4 { fill: #758955; background: #758955; }
.allocation-colour-5 { fill: var(--muted); background: var(--muted); }
.allocation-item { border-top: 1px solid var(--line); }
.allocation-item > summary { display: grid; grid-template-columns: 10px minmax(0, 1fr) auto minmax(85px, auto); align-items: center; gap: 12px; padding: 14px 0; cursor: pointer; list-style: none; }
.allocation-item > summary::-webkit-details-marker { display: none; }
.allocation-item > summary::after { display: none; }
.allocation-name { color: var(--home-heading); overflow-wrap: anywhere; }
.allocation-name::after { content: ' +'; color: var(--muted); }
.allocation-item[open] > summary .allocation-name::after { content: ' −'; }
.allocation-dot { width: 10px; height: 10px; }
.allocation-percentage, .allocation-value { font-variant-numeric: tabular-nums; text-align: right; overflow-wrap: anywhere; }
.allocation-value { color: var(--muted); }
.allocation-members { padding: 0 0 18px 22px; }
.allocation-members > div { display: flex; flex-wrap: wrap; gap: 8px 16px; padding: 10px 0; }
.allocation-members span, .allocation-members strong { overflow-wrap: anywhere; min-width: 0; }
.allocation-identity { display: flex; align-items: flex-start; gap: 8px; flex-basis: 100%; }
.allocation-members code { min-width: 0; overflow-wrap: anywhere; font-size: var(--text-caption); color: var(--muted); }
.allocation-members .copy-button { flex-shrink: 0; }
.account-coin-card > summary, .account-activity-context > summary { display: flex; flex-wrap: wrap; align-items: baseline; gap: 12px; padding: var(--panel-inset); cursor: pointer; color: var(--home-heading); }
.account-unrecognised { margin: 0 var(--panel-inset) var(--panel-inset); }
.account-unrecognised > summary { padding: 16px 0; cursor: pointer; }
.account-unrecognised .account-coin-row, .account-unrecognised .account-coin-table-head { padding-inline: 0; }
.account-activity-context .sender-profile-card { border: 0; }
@media (max-width: 600px) {
  .allocation-item > summary { gap: 8px; grid-template-columns: 8px minmax(0, 1fr) auto minmax(65px, auto); font-size: var(--text-meta); }
}
@media (max-width: 900px) {
  .account-coin-table-head, .account-coin-row { grid-template-columns: minmax(0, 1.2fr) 80px minmax(0, 1fr) 80px; gap: 16px; }
}
@media (max-width: 600px) {
  .account-page-head { margin: 4px 0 22px; }
  .account-id-line { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 4px 8px; padding: 10px 12px; }
  .account-id-label { grid-column: 1; }
  .account-full-id { grid-column: 1; }
  .account-id-line .copy-button { grid-column: 2; grid-row: 1 / 3; }
  .account-value-card { grid-template-columns: minmax(0, 1fr); gap: 16px; }
  .account-value-detail { padding-top: 14px; border-top: 1px solid var(--line); text-align: left; }
  .account-coin-row { grid-template-columns: repeat(2, minmax(0, 1fr)); grid-template-areas: "coin coin" "balance balance" "price value"; gap: 10px 12px; padding: var(--panel-inset); }
  .account-coin-cell:not(.account-coin-identity) { flex-wrap: wrap; gap: 3px 6px; }
  .account-coin-cell > small { font-weight: var(--weight-normal); letter-spacing: normal; text-transform: none; font-size: var(--text-meta); line-height: var(--leading-meta); }
  .account-coin-balance { overflow: visible; }
  .account-coin-balance strong { display: block; max-width: 100%; }
  .account-coin-identity small { max-width: 100%; }
  .account-coin-price { padding-top: 2px; }
  .account-object-row { grid-template-columns: minmax(0, 1fr); gap: 12px; padding: 16px; }
  .account-object-version { flex-direction: row; flex-wrap: wrap; gap: 8px; text-align: left; }
  .account-page .account-list-pagination { padding: 16px; }
}
