/* A quiet, dark authentication panel; workspace forms keep their own palette. */
body:has(#portal-root) .auth-page .auth-card {
  color: #e7edf5;
  background: linear-gradient(135deg, #253144ed, #1b2534f5 55%, #172130f5);
  border: 1px solid #a2b9ce23;
  box-shadow: 0 25px 75px #03080f36, inset 0 1px 0 #d1e3f308;
  backdrop-filter: blur(22px);
  position: relative;
  isolation: isolate;
  transform-origin: 50% 50%;
  transform: perspective(1400px) translate3d(var(--auth-shift-x, 0px), var(--auth-shift-y, 0px), 0) rotateX(var(--auth-tilt-x, 0deg)) rotateY(var(--auth-tilt-y, 0deg));
}
body:has(#portal-root) .auth-page .auth-card::before {
  content: '';
  position: absolute;
  inset: 0;
  border-radius: inherit;
  pointer-events: none;
  z-index: -1;
  background: radial-gradient(ellipse at var(--auth-light-x, 50%) var(--auth-light-y, 30%), #b1dbed0c, transparent 65%);
}
body:has(#portal-root) .auth-page .auth-card h2 { color: #f0f4fa; }
body:has(#portal-root) .auth-page .auth-card > p { color: #98aabe; }
body:has(#portal-root) .auth-page .auth-tabs {
  background: #121c2b66;
  border: 1px solid #9bb8d016;
  box-shadow: inset 0 1px 6px #050a1214;
}
body:has(#portal-root) .auth-page .auth-tabs button { color: #869cb3; }
body:has(#portal-root) .auth-page .auth-tabs button:hover { color: #c0d7e7; }
body:has(#portal-root) .auth-page .auth-tabs button[aria-selected=true] {
  background: #3b506766;
  color: #d9edf6;
  box-shadow: 0 3px 12px #07101a18, inset 0 1px 0 #a1c2d91a;
}
body:has(#portal-root) .auth-page .form-field > span { color: #b9c9d8; }
body:has(#portal-root) .auth-page .form-field input {
  background: #111d2b75;
  border-color: #a5bfd129;
  color: #ecf3fa;
  color-scheme: dark;
  box-shadow: inset 0 1px 5px #050c1714;
}
body:has(#portal-root) .auth-page .form-field input::placeholder { color: #7890a6; }
body:has(#portal-root) .auth-page .form-field input:focus {
  border-color: #99ddea81;
  background: #13223399;
  box-shadow: 0 0 0 3px #99ddea0b;
}
body:has(#portal-root) .auth-page .form-field input:-webkit-autofill {
  -webkit-text-fill-color: #ecf3fa;
  box-shadow: 0 0 0 1000px #1a293b inset;
  caret-color: #ecf3fa;
}
body:has(#portal-root) .auth-page .form-field small { color: #8198ad; }
body:has(#portal-root) .auth-page .auth-legal { color: #8fa4ba; }
body:has(#portal-root) .auth-page .auth-legal a { color: #b8e2ee; }
body:has(#portal-root) .auth-page .form-error {
  background: #5c314733;
  border: 1px solid #dd8c9925;
  color: #edb5ba;
}
body:has(#portal-root) .auth-page .auth-card .button {
  background: #ffa88a;
  color: #243046;
  box-shadow: 0 7px 22px #ffa88a09;
}
body:has(#portal-root) .auth-page .auth-card .button:hover { background: #ffb69d; }
/* Local 3D tokens replace the standalone monogram and orbit decoration. */
body:has(#portal-root) .auth-page .auth-tokens {
  position: relative;
  width: min(470px, 100%);
  height: 220px;
  margin: 24px 0 -12px;
  isolation: isolate;
  overflow: hidden;
}
body:has(#portal-root) .auth-page .auth-coins {
  position: absolute;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
}
body:has(#portal-root) .auth-page .auth-coins-fallback {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: contain;
  opacity: .75;
  filter: saturate(.72) brightness(1.12);
  animation: auth-fallback-drift 12s ease-in-out infinite;
}
body:has(#portal-root) .auth-page .has-live-auth-coins .auth-coins-fallback {
  opacity: 0;
  visibility: hidden;
}
@keyframes auth-fallback-drift {
  0%, 100% { transform: translateY(2px) rotate(-2deg); }
  50% { transform: translateY(-5px) rotate(1deg); }
}
@media(max-width:980px) {
  body:has(#portal-root) .auth-page .auth-tokens { height: 190px; margin-top: 20px; }
}
@media(max-width:760px) {
  body:has(#portal-root) .auth-page .auth-tokens { display: block; height: 134px; margin: 15px 0 -8px; }
  body:has(#portal-root) .auth-page .auth-layout { gap: 26px; }
}
@media(hover:none),(pointer:coarse) {
  body:has(#portal-root) .auth-page .auth-card { transform: none; }
}
@media(prefers-reduced-motion:reduce) {
  body:has(#portal-root) .auth-page .auth-card { transform: none; }
  body:has(#portal-root) .auth-page .auth-coins-fallback { animation: none; }
}