.po-dropdown {
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: var(--radius-md, 8px);
  box-shadow: var(--shadow-md);
  padding: 4px;
  min-width: 180px;
  max-height: 320px;
  overflow-y: auto;
  z-index: 700;
}

.po-dropdown-option {
  display: flex;
  align-items: center;
  gap: 8px;
  width: 100%;
  padding: 6px 10px;
  border: none;
  border-radius: 4px;
  background: transparent;
  color: var(--ink);
  font-family: inherit;
  font-size: 13px;
  text-align: left;
  cursor: pointer;
}
.po-dropdown-option:hover        { background: var(--hover); }
.po-dropdown-option.is-current   { background: var(--active); font-weight: 600; }
.po-dropdown-option.po-dropdown-clear         { color: var(--danger); }
.po-dropdown-option.po-dropdown-clear:hover   { background: var(--status-red-bg); }
.po-dropdown-option:focus-visible { box-shadow: var(--focus-ring); outline: none; }

.po-dropdown-avatar {
  width: 22px;
  height: 22px;
  border-radius: 50%;
  background: var(--avatar-person-bg);
  color: var(--avatar-person-ink);
  font-size: 9px;
  font-weight: 700;
  font-family: "Geist Mono", ui-monospace, monospace;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
.po-dropdown-avatar.is-unit {
  background: var(--avatar-unit-bg);
  color: var(--avatar-unit-ink);
}

.po-dropdown-divider {
  height: 1px;
  background: var(--line-soft);
  margin: 4px 0;
}