/* Decorative login layer: no layout changes or interaction interception. */
.login-ambient {
  position: fixed;
  inset: 0;
  overflow: hidden;
  pointer-events: none;
  opacity: .26;
}
.login-ambient-orb {
  position: absolute;
  width: min(760px, 85vw);
  height: min(760px, 100vh);
  border-radius: 50%;
  background: radial-gradient(ellipse, rgba(var(--accent-rgb), .105), transparent 68%);
}
.login-ambient-orb-primary {
  left: -12%;
  top: -15%;
  animation: login-ambient-drift 22s ease-in-out infinite alternate;
}
.login-ambient-orb-secondary {
  right: -18%;
  bottom: -28%;
  background: radial-gradient(ellipse, rgba(var(--accent-rgb), .075), transparent 68%);
  animation: login-ambient-drift 28s ease-in-out -12s infinite alternate-reverse;
}
.login-brand-halo {
  position: fixed;
  left: clamp(18px, 7vw, 110px);
  top: 50%;
  width: min(430px, 43vw);
  aspect-ratio: 1;
  transform: translateY(-50%);
  pointer-events: none;
}
.login-brand-halo span {
  display: block;
  width: 100%;
  height: 100%;
  background: radial-gradient(ellipse, rgba(var(--accent-rgb), .12), transparent 70%);
  opacity: .22;
}
.bg-glow { opacity: .35; }
/* A separate, faint light can follow the mouse across either login column. */
.login-cursor-glow {
  position: fixed;
  inset: 0;
  overflow: hidden;
  z-index: 2;
  pointer-events: none;
  opacity: 0;
  transition: opacity .4s ease;
}
.login-cursor-glow span {
  position: absolute;
  left: 0;
  top: 0;
  width: min(440px, 55vw);
  aspect-ratio: 1;
  background: radial-gradient(ellipse, rgba(var(--accent-rgb), .075), transparent 70%);
  transform: translate3d(var(--login-cursor-x, 0px), var(--login-cursor-y, 0px), 0) translate(-50%, -50%);
}
.login-pointer-active .login-cursor-glow { opacity: .85; }
.login-pointer-active .login-cursor-glow span { transition: transform .2s ease-out; }
/* Only copy assembles on arrival; fields, buttons and final layout stay fixed. */
.wrap { animation: none; }
.login-text-enter {
  animation: login-text-assemble 1.1s cubic-bezier(.16, 1, .3, 1) both;
  animation-delay: var(--login-text-delay, 0s);
}
.login-copy-slot { overflow: clip; }
.login-copy-slot > .login-text-enter { display: block; }
.login-text-from-top { --login-text-y: clamp(-220px, -30vh, -90px); --login-text-delay: .12s; }
.login-text-from-top.login-brand-wordmark { --login-text-y: clamp(-160px, -22vh, -65px); --login-text-delay: .04s; }
.login-text-from-bottom { --login-text-y: min(20vh, 160px); --login-text-delay: .18s; }
.login-text-from-right { --login-text-x: min(20vw, 250px); --login-text-delay: .16s; }
.login-text-subtitle { --login-text-y: 45px; --login-text-delay: .22s; }
.login-text-footer { --login-text-y: min(8vh, 64px); --login-text-delay: .26s; }
.login-copy-ready .form-panel .login-text-enter { animation: none; }
@keyframes login-text-assemble {
  from { opacity: 0; transform: translate3d(var(--login-text-x, 0px), var(--login-text-y, 0px), 0); }
  to { opacity: 1; transform: translate3d(0, 0, 0); }
}
.form-panel {
  background: linear-gradient(155deg, rgba(255,255,255,.018), transparent 40%), rgba(34,38,43,.96);
  box-shadow: inset 1px 0 rgba(var(--accent-rgb), .045), -24px 0 70px rgba(0,0,0,.08);
}
.form-panel .field label { transition: color .25s ease; }
.form-panel .field:focus-within label { color: var(--accent); }
.form-panel .field input:focus {
  box-shadow: 0 0 0 3px rgba(var(--accent-rgb), .1), 0 5px 24px rgba(var(--accent-rgb), .075);
}
.btn-login::after {
  content: "";
  position: absolute;
  inset: 0 auto 0 0;
  width: 35%;
  background: linear-gradient(100deg, transparent, rgba(255,255,255,.24), transparent);
  transform: translateX(-350%) skewX(-18deg);
  pointer-events: none;
}
.btn-login:focus-visible { outline: 2px solid var(--accent); outline-offset: 4px; }
.btn-login:focus-visible:not(:disabled)::after { animation: login-button-sheen .85s ease-out; }
@media (hover: hover) and (pointer: fine) {
  .btn-login:hover:not(:disabled)::after { animation: login-button-sheen .85s ease-out; }
}
@keyframes login-ambient-drift {
  from { transform: translate3d(0, 0, 0) scale(.96); opacity: .65; }
  to { transform: translate3d(8%, 10%, 0) scale(1.08); opacity: 1; }
}
@keyframes login-button-sheen {
  to { transform: translateX(390%) skewX(-18deg); }
}
.login-motion-paused .login-ambient-orb,
.login-motion-paused .bg-brand-watermark { animation-play-state: paused; }
@media (max-width: 760px) {
  .login-brand-halo, .login-cursor-glow { display: none; }
  .login-ambient-orb { width: 100vw; height: 70vh; }
  .login-ambient-orb-primary { animation: none; opacity: .6; }
  .login-ambient-orb-secondary { display: none; }
  .form-panel { box-shadow: none; }
  .login-text-enter { animation-duration: .7s; }
  .login-text-from-right { --login-text-x: 36px; }
  .login-text-subtitle, .login-text-footer { --login-text-y: 24px; }
}
@media (prefers-reduced-motion: reduce) {
  .login-ambient-orb, .btn-login::after, .login-text-enter { animation: none !important; }
  .login-text-enter { opacity: 1; transform: none; }
  .login-cursor-glow { display: none; transition: none; }
  .form-panel .field label, .form-panel .field input { transition: none; }
}
