/* Shared authentication palette: the same focused violet used by the in-app voice action. */
:root {
  --brand: #6d4aff;
  --brand-dark: #5635df;
  --grad: linear-gradient(135deg, #7a4df3 0%, #a936c8 100%);
}

body::before {
  background: radial-gradient(ellipse 70% 50% at 50% 12%, rgba(109, 74, 255, .075) 0%, transparent 62%) !important;
}

input:focus {
  border-color: var(--brand) !important;
  box-shadow: 0 0 0 3px rgba(109, 74, 255, .11) !important;
}

.btn,
.btn-sign {
  background: var(--grad) !important;
  box-shadow: 0 8px 24px rgba(109, 74, 255, .24) !important;
}

.alt-row a:hover,
.back:hover,
.legal a:hover,
.show-pw:hover {
  color: var(--brand-dark) !important;
}

.auth-right {
  background: var(--grad) !important;
}

/* Keep the depth, remove the old blue/pink competing color blobs. */
.auth-right .ar-s1,
.auth-right .ar-s2 {
  filter: blur(1px);
}

.auth-right .ar-s1 {
  background: rgba(255, 255, 255, .11) !important;
}

.auth-right .ar-s2 {
  background: rgba(49, 27, 121, .16) !important;
}

.auth-right .ar-s3 {
  background: rgba(255, 255, 255, .13) !important;
}

.auth-right .ar-ring {
  border-color: rgba(255, 255, 255, .16) !important;
}

::selection {
  color: #fff;
  background: rgba(109, 74, 255, .78);
}

@media (prefers-reduced-motion: reduce) {
  .btn { transition-duration: .01ms !important; }
}