.header-actions {
  display: flex;
  align-items: center;
  gap: var(--sp-3);
}
.wallet-pill {
  display: inline-flex;
  align-items: center;
  gap: var(--sp-2);
  background: var(--surface-raised);
  border: 1px solid var(--border);
  border-radius: var(--r-pill);
  padding: var(--sp-1);
}
.wallet-pill .wallet-value { padding: 0 var(--sp-1); }
.wallet-sep {
  flex: none;
  width: 1px;
  height: 18px;
  background: var(--border-strong);
}

/* boxed wallet cluster: [ [+] | [value] | [avatar] | [exit] ] — every segment its own chip */
.wallet-pill--boxed { border-radius: var(--r-md); background: var(--surface-dim); }
.wallet-pill--boxed .wallet-add {
  border-radius: var(--r-sm);
  background: var(--primary-deep);          /* match the $0.00 value chip: dark fill... */
  border: 1px solid var(--primary-edge);    /* ...edge... */
  color: var(--success);                    /* ...green glyph */
}
.wallet-pill--boxed .avatar--square {
  border-radius: var(--r-sm);
  background: var(--primary-deep);
  border: 1px solid var(--primary-edge);
}
.wallet-pill--boxed .wallet-value {
  display: inline-flex;
  align-items: center;
  height: 28px;
  padding: 0 var(--sp-3);
  background: var(--primary-deep);
  border: 1px solid var(--primary-edge);
  border-radius: var(--r-sm);
  color: var(--success);
}
.wallet-pill--boxed .icon-btn {
  width: 28px; height: 28px;
  background: var(--primary-deep);
  border: 1px solid var(--primary-edge);
  border-radius: var(--r-sm);
  color: var(--primary-tint);
}
.wallet-pill--boxed .icon-btn:hover {
  border-color: var(--primary);
  color: var(--text);
  background: var(--primary-deep);
}
.wallet-add {
  width: 28px; height: 28px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 0;
  border-radius: 50%;
  background: var(--gradient-primary);
  color: var(--on-primary);
  cursor: pointer;
}
.wallet-add:hover { filter: brightness(1.12); }
.wallet-value {
  font-size: var(--fs-sm);
  font-weight: 700;
}
.avatar {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  background: var(--gradient-primary);
  color: var(--on-primary);
  font-weight: 700;
  user-select: none;
}
.avatar--sm { width: 34px; height: 34px; font-size: var(--fs-sm); }
.avatar--md { width: 46px; height: 46px; font-size: var(--fs-lg); }
.icon-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 34px; height: 34px;
  border: 0;
  border-radius: var(--r-sm);
  background: transparent;
  color: var(--muted);
  cursor: pointer;
}
.icon-btn:hover { color: var(--text); background: var(--surface-raised); }