/* Shared login and portal presentation; numeric settings are set on the decorative root. */
body.chloe-scenic-active { isolation: isolate; }
body.chloe-scenic-active::before,
body.chloe-scenic-active .content::before { display: none !important; }
body.chloe-scenic-active .content { background: transparent !important; }
.chloe-scenic {
  display: none;
  position: fixed;
  inset: 0;
  z-index: -1;
  overflow: hidden;
  pointer-events: none;
  background: #edf5ff url('/assets/chloe-background.svg?v=2') center / cover no-repeat;
}
.chloe-scenic-active .chloe-scenic { display: block; }
.chloe-scenic-image {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  max-width: none;
  object-fit: cover;
  object-position: center;
  pointer-events: none;
  opacity: 0;
  filter: saturate(var(--scenic-saturation, 1.06)) brightness(var(--scenic-brightness, 1.03));
  transition: opacity var(--scenic-fade, 2000ms) ease;
}
.chloe-scenic-image.is-visible { opacity: 1; }
.chloe-scenic::after {
  content: '';
  position: absolute;
  inset: 0;
  pointer-events: none;
  background: linear-gradient(145deg, #f5faff, #ddecff 58%, #f6f8ff);
  opacity: var(--scenic-overlay, .60);
}
/* Login's existing pseudo-overlay must not wash out the shared overlay a second time. */
body.auth-page.chloe-scenic-active::after { display: none !important; }
body.auth-page.chloe-scenic-active .auth-identity,
body.chloe-scenic-active .card,
body.auth-page.chloe-scenic-active .auth-purpose {
  background: rgba(255,255,255,.94) !important;
}
body.chloe-scenic-active .dashboard-workspace-header {
  background: rgba(255,255,255,.94) !important;
}
.chloe-scenic-toggle {
  margin: 4px 0;
  position: relative;
  width: auto !important;
  min-height: 32px;
  flex: 0 0 auto;
  padding: 4px 8px;
  background: transparent !important;
  box-shadow: none !important;
  font-size: 12px;
}
@media (prefers-reduced-motion: reduce) {
  .chloe-scenic-image { transition: none !important; }
}
@media (forced-colors: active), print {
  .chloe-scenic, .chloe-scenic-toggle { display: none !important; }
}