/* Neutral chat UI; Local Exposure motion is scoped to authentication pages. */
html:not(.high-contrast-light):not(.high-contrast-dark) {
  --accent-primary: 64 64 64; --accent-primary-hover: 38 38 38;
  --surface-submit: 38 38 38; --surface-submit-hover: 64 64 64;
  --ring-primary: 115 115 115;
}
html.dark:not(.high-contrast-dark) {
  --surface-primary: 33 33 33; --surface-primary-alt: 24 24 24;
  --surface-primary-contrast: 47 47 47;
  --surface-secondary: 24 24 24; --surface-secondary-alt: 47 47 47;
  --surface-tertiary: 47 47 47; --surface-tertiary-alt: 47 47 47;
  --surface-dialog: 47 47 47; --surface-chat: 33 33 33;
  --header-primary: 33 33 33; --header-hover: 47 47 47;
  --surface-hover: 47 47 47; --surface-active: 56 56 56;
  --surface-submit: 245 245 245; --surface-submit-hover: 212 212 212;
  --accent-primary: 229 229 229; --accent-primary-hover: 255 255 255;
  --text-primary: 236 236 236; --text-secondary: 180 180 180;
}
/* The existing auth logo element is replaced through CSS as well, avoiding stale logo caches. */
img[src="assets/logo.svg"] {
  content: url('/branding/icon.svg?v=2'); width: 58px !important; height: 58px !important;
  max-width: 58px; margin-inline: auto; filter: none;
  animation: le-float 6s ease-in-out infinite;
}
div.relative.flex.min-h-screen:has(img[src="assets/logo.svg"]) {
  isolation: isolate; background: #f4f4f5;
}
.dark div.relative.flex.min-h-screen:has(img[src="assets/logo.svg"]) { background: #090c15; }
div.relative.flex.min-h-screen:has(img[src="assets/logo.svg"])::before {
  content: ''; position: absolute; inset: 0; z-index: -1; pointer-events: none;
  background: radial-gradient(ellipse at 15% 20%, #0ea5e92b, transparent 55%),
    radial-gradient(ellipse at 85% 75%, #8b5cf62b, transparent 55%),
    radial-gradient(ellipse at 50% 45%, #38bdf815, transparent 65%);
  background-size: 160% 160%; animation: le-gradient 22s ease-in-out infinite alternate;
}
div.relative.flex.min-h-screen:has(img[src="assets/logo.svg"]) .w-authPageWidth { background: transparent; }
div.relative.flex.min-h-screen:has(img[src="assets/logo.svg"]) .mt-6.h-10 { height: 64px; margin-top: 36px; }
.dark div.relative.flex.min-h-screen:has(img[src="assets/logo.svg"]) {
  --surface-primary: 9 12 21; --surface-submit: 56 189 248;
  --surface-submit-hover: 125 211 252;
}
@keyframes le-float {
  0%,100% { transform: translateY(0); filter: drop-shadow(0 0 10px #38bdf820); }
  50% { transform: translateY(-6px); filter: drop-shadow(0 0 18px #38bdf855); }
}
@keyframes le-gradient { from { background-position: 0% 20%; } to { background-position: 100% 80%; } }
@media (prefers-reduced-motion: reduce) {
  img[src="assets/logo.svg"], div.relative.flex.min-h-screen::before { animation: none !important; }
}

.dark:not(.high-contrast-dark) [class~="bg-surface-submit"] { color: #171717; }
.dark div.relative.flex.min-h-screen:has(img[src="assets/logo.svg"]) button[type="submit"] { color: #052536; }
