/* ── Identity chip (topbar) ─────────────────────────────── */
#bbnk-identity-chip {
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 4px 10px;
  border: 1px solid var(--border);
  border-radius: 999px;
  background: var(--bg);
  font-size: 11px;
  color: var(--text);
  height: 28px;
  max-width: 320px;
}
#bbnk-identity-chip.unauth { color: var(--muted); border-style: dashed; cursor: pointer; }
#bbnk-identity-chip .bic-device { color: var(--muted2); letter-spacing: 1px; font-size: 10px; }
#bbnk-identity-chip .bic-sep    { color: var(--muted); }
#bbnk-identity-chip .bic-alias  { color: var(--cyan); font-weight: 600; }
#bbnk-identity-chip .bic-avatar {
  width: 20px; height: 20px; border-radius: 50%; object-fit: cover;
  border: 1px solid var(--border); background: var(--bg2);
}
#bbnk-identity-chip .bic-edit {
  background: transparent; border: none; color: var(--muted); cursor: pointer;
  padding: 0 2px; font-size: 12px; line-height: 1;
}
#bbnk-identity-chip .bic-edit:hover { color: var(--cyan); }
#bbnk-identity-chip .bic-device-edit:hover { color: var(--yellow); }
#bbnk-identity-chip .bic-logout:hover { color: #f87171; }

/* ── Identity modals ─────────────────────────────────────── */
.bi-modal-form { display: flex; flex-direction: column; gap: 10px; margin-bottom: 14px; }
.bi-modal-form label { font-size: 11px; color: var(--muted2); display: flex; flex-direction: column; gap: 4px; }
.bi-modal-form input[type="text"],
.bi-modal-form input[type="password"],
.bi-modal-form textarea {
  background: var(--bg); border: 1px solid var(--border); color: var(--text);
  font-family: var(--font); font-size: 12px; padding: 5px 8px; border-radius: 4px;
  width: 100%; box-sizing: border-box;
}
.bi-modal-form textarea { resize: vertical; min-height: 80px; }
.bi-modal-form .bi-hint { font-size: 10px; color: var(--muted); }
.bi-modal-form .bi-error { color: #f87171; font-size: 11px; min-height: 14px; }

.bi-avatar-preview {
  width: 80px; height: 80px; border-radius: 50%; border: 1px solid var(--border);
  background: var(--bg2); object-fit: cover; display: block;
}
.bi-avatar-row { display: flex; gap: 12px; align-items: center; }