/* =====================================================================
   FORMS
   ===================================================================== */
input, select{
  font-family: inherit;
  padding: 10px 13px;
  border-radius: var(--r-sm);
  border: 1px solid var(--border);
  background: var(--surface);
  color: var(--ink);
  font-size: 13.5px;
  transition: border-color var(--dur-fast), box-shadow var(--dur-fast);
}
input::placeholder{ color: var(--faint); }
input:focus, select:focus{
  outline: none; border-color: var(--accent);
  box-shadow: 0 0 0 3px var(--accent-wash);
}
select option{ background: var(--surface-raised); color: var(--ink); }

.toolbar input{ flex: 1; min-width: 160px; }

/* ---------- login ---------- */
.login-card{
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--r-lg);
  box-shadow: var(--shadow-card);
  padding: 40px 30px;
  max-width: 340px; width: 100%;
  text-align: center;
  display: grid; gap: var(--sp-3);
}
.login-card .eyebrow{ justify-self: center; }
.login-card h2{ margin: 0; font-size: 19px; }
.login-card input{ width: 100%; text-align: center; padding: 12px 16px; font-size: 15px; }
.login-card .btn{ width: 100%; padding: 12px; margin-top: var(--sp-1); }
.login-msg{ color: var(--danger); font-size: 12.5px; min-height: 16px; }