/* Shared recluse account widget — minimal, host pages can override */
.recluse-auth {
  --ra-text: #152033;
  --ra-muted: #5b6b82;
  --ra-border: #d5deea;
  --ra-bg: #fff;
  --ra-accent: #1f6feb;
  --ra-danger: #c62828;
  --ra-ok: #0f7b45;
  font-family: inherit;
  color: var(--ra-text);
  font-size: 0.92rem;
}

.recluse-auth * { box-sizing: border-box; }

.recluse-auth__bar {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
}

.recluse-auth__email {
  color: var(--ra-muted);
  max-width: 220px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.recluse-auth__btn {
  border: 1px solid var(--ra-border);
  background: var(--ra-bg);
  color: var(--ra-text);
  border-radius: 8px;
  padding: 8px 12px;
  font: inherit;
  cursor: pointer;
}

.recluse-auth__btn:hover { border-color: #9db2d1; }
.recluse-auth__btn--primary {
  background: var(--ra-accent);
  border-color: var(--ra-accent);
  color: #fff;
}
.recluse-auth__btn:disabled { opacity: 0.5; cursor: not-allowed; }

.recluse-auth__panel {
  margin-top: 10px;
  padding: 12px 14px;
  border: 1px solid var(--ra-border);
  border-radius: 10px;
  background: var(--ra-bg);
  display: grid;
  gap: 10px;
  max-width: 360px;
}

.recluse-auth__panel[hidden] { display: none !important; }

.recluse-auth__panel label {
  display: flex;
  flex-direction: column;
  gap: 4px;
  font-size: 0.88rem;
}

.recluse-auth__panel input {
  border: 1px solid var(--ra-border);
  border-radius: 8px;
  padding: 8px 10px;
  font: inherit;
}

.recluse-auth__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.recluse-auth__status {
  min-height: 1.2em;
  color: var(--ra-muted);
  font-size: 0.86rem;
  margin: 0;
}

.recluse-auth__status--err { color: var(--ra-danger); }
.recluse-auth__status--ok { color: var(--ra-ok); }