@font-face {
  font-family: 'Hive Inter';
  src: url('/assets/fonts/google/inter-variable.woff2') format('woff2'), url('/assets/fonts/google/inter-variable.ttf') format('truetype');
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
}

:root {
  --hive-font-sans: 'Hive Inter', ui-sans-serif, system-ui, -apple-system, "Segoe UI", sans-serif;
  --hive-font-mono: ui-monospace, "SFMono-Regular", Menlo, Consolas, monospace;
}

body {
  font-family: var(--hive-font-sans);
}

/* The vendored design system scopes its own legacy font tokens directly onto
   the authentication overlay. Rebind that scope without changing donor bytes. */
body .profile-auth-overlay,
body .profile-auth-card {
  --hive-font-sans: 'Hive Inter', ui-sans-serif, system-ui, -apple-system, "Segoe UI", sans-serif;
  --hive-font-mono: ui-monospace, "SFMono-Regular", Menlo, Consolas, monospace;
  font-family: var(--hive-font-sans);
}

.profile-auth-brand {
  min-height: 42px;
  gap: 7px;
}

.profile-auth-brand-logo {
  display: block;
  width: 28px;
  height: 28px;
  object-fit: contain;
}

.profile-auth-brand-name {
  display: inline-flex;
  align-items: baseline;
  color: var(--profile-auth-strong);
  font-size: calc(25px * var(--ui-font-scale, 1));
  font-weight: 650;
  letter-spacing: -1.2px;
  line-height: 1;
}

.profile-auth-brand-name strong {
  font: inherit;
  font-weight: 760;
}

.profile-auth-brand-name span {
  color: var(--accent, #e8971a);
}

.profile-auth-heading {
  margin-top: 4px;
}

.profile-auth-providers {
  gap: 9px;
}

body .profile-auth-overlay .profile-auth-provider {
  grid-template-columns: 28px minmax(0, 1fr) 28px;
  min-height: 43px;
  padding: 0 10px;
  border: 1px solid #d6d8dd;
  border-radius: 999px;
  color: #080808;
  background: #ffffff;
  box-shadow: 0 1px 2px rgba(15, 23, 42, 0.08);
  font-size: calc(13px * var(--ui-font-scale, 1));
  font-weight: 500;
}

body .profile-auth-overlay .profile-auth-provider:hover,
body .profile-auth-overlay .profile-auth-provider:focus-visible {
  border-color: #aeb4be;
  color: #080808;
  background: #f7f8fa;
  box-shadow: 0 2px 6px rgba(15, 23, 42, 0.12);
}

body .profile-auth-overlay .profile-auth-provider:disabled {
  border-color: #d6d8dd;
  color: #080808;
  background: #ffffff;
  opacity: 1;
  cursor: not-allowed;
}

.profile-auth-provider-copy {
  min-width: 0;
  justify-self: center;
  line-height: 1.15;
  text-align: center;
}

.profile-auth-provider-copy strong {
  font: inherit;
  font-weight: 500;
}

.profile-auth-account-avatar {
  display: grid;
  place-items: center;
  width: 24px;
  height: 24px;
  justify-self: center;
  overflow: hidden;
  border-radius: 50%;
  color: #4b5563;
  background: linear-gradient(145deg, #f4d2bd, #c8d6e5);
}

.profile-auth-account-avatar svg {
  width: 18px;
  height: 18px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.7;
  stroke-linecap: round;
  stroke-linejoin: round;
}

body .profile-auth-overlay .profile-auth-provider-icon {
  color: #0b0b0b;
}

.profile-auth-google {
  grid-column: 3;
}

.profile-auth-google svg {
  width: 18px;
  height: 18px;
}

.profile-auth-phone svg,
.profile-auth-email svg {
  fill: none;
  stroke: currentColor;
  stroke-width: 1.75;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.profile-auth-consent {
  max-width: 268px;
  margin: 12px auto 0;
  color: var(--profile-auth-muted);
  font-size: calc(11px * var(--ui-font-scale, 1));
  line-height: 1.45;
  text-align: center;
}

.profile-auth-consent a {
  color: #3b82f6;
  text-decoration: none;
}

.profile-auth-consent a:hover,
.profile-auth-consent a:focus-visible {
  color: #60a5fa;
  text-decoration: underline;
}

.profile-auth-entry-back {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  min-height: 30px;
  margin: -2px 0 4px;
  padding: 0;
  border: 0;
  color: var(--profile-auth-muted);
  background: transparent;
  font: inherit;
  font-size: calc(11px * var(--ui-font-scale, 1));
  cursor: pointer;
}

.profile-auth-entry-back[hidden] {
  display: none;
}

.profile-auth-entry-back svg {
  width: 15px;
  height: 15px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.profile-auth-entry-back:hover,
.profile-auth-entry-back:focus-visible {
  color: var(--profile-auth-strong);
}

.profile-auth-card[data-auth-entry="options"] .profile-auth-divider,
.profile-auth-card[data-auth-entry="options"] .profile-auth-form {
  display: none;
}

.profile-auth-card:not([data-auth-entry="options"]) .profile-auth-divider {
  margin-top: 7px;
}

@media (max-width: 480px) {
  body .profile-auth-overlay .profile-auth-provider {
    min-height: 42px;
  }
}
