/*
 * Unified atmosphere — one approved homepage glow across every page and surface.
 * The radial gradient is shared by the page canvas and all major content surfaces.
 * Theme-specific color values live in Design System tokens.
 */
body {
  min-height: 100vh;
  min-height: 100svh;
  min-height: 100dvh;
  min-height: var(--tg-viewport-stable-height, 100dvh);
  background-color: var(--color-bg);
  background-image: var(--gradient-home-atmosphere);
  background-position: right top;
  background-repeat: no-repeat;
}

/* The site header intentionally remains solid black without the shared glow. */
.site-header {
  background-color: var(--color-header-background);
  background-image: none;
}

/*
 * Every major page layer, panel and card uses the exact same background layer.
 * Borders, spacing, typography and interactive control states remain component-specific.
 */
:is(
  .sidebar,
  .hero,
  .cta-band,
  .placeholder,
  .auth-card,
  .auth-switches,
  .auth-notice,
  .formats article,
  .ideas-empty,
  .ideas-loading,
  .ideas-error,
  .owner-console-workspace:not(.is-detail-view),
  .owner-console-workspace.is-detail-view,
  .ideas-filters,
  .idea-card,
  .ideas-detail,
  .ideas-form,
  .ideas-convert-confirm,
  .pin-lock-root,
  .pin-lock-card
) {
  background-color: var(--color-bg);
  background-image: var(--gradient-home-atmosphere);
  background-position: right top;
  background-repeat: no-repeat;
}

/* Keep the shared page glow consistent on compact screens. */
@media (max-width: 760px) {
  body,
  :is(
    .sidebar,
    .hero,
    .cta-band,
    .placeholder,
    .auth-card,
    .auth-switches,
    .auth-notice,
    .formats article,
    .ideas-empty,
    .ideas-loading,
    .ideas-error,
    .owner-console-workspace:not(.is-detail-view),
    .owner-console-workspace.is-detail-view,
    .ideas-filters,
    .idea-card,
    .ideas-detail,
    .ideas-form,
    .ideas-convert-confirm,
    .pin-lock-root,
    .pin-lock-card
  ) {
    background-position: right top;
  }
}

@media (prefers-reduced-motion: reduce) {
  body {
    scroll-behavior: auto;
  }
}