/*
 * Keep the application background identical to the live PolyClaw shell.
 * This file intentionally does not alter cards or component colors.
 */
html,
body,
#root {
  min-height: 100%;
  background-color: #020617;
}

:root {
  --pc-header-height: 72px;
}

html {
  scroll-padding-top: var(--pc-header-height);
}

#root .min-h-screen.bg-gradient-to-br.from-slate-950.via-sky-950.to-cyan-950 {
  background-color: #020617 !important;
  background-image: linear-gradient(
    to bottom right,
    #020617,
    #052f4a,
    #083344
  ) !important;
}

/*
 * The application header is fixed and therefore outside normal document flow.
 * The compiled Tailwind stylesheet does not contain the pt-[72px] utility, so
 * provide the intended route offset explicitly on every viewport size.
 */
#root .relative.z-10 > .relative.pt-\[72px\] {
  padding-top: var(--pc-header-height) !important;
}

/* Keep the landing metrics directly below the embedded AI terminal. */
#ai-terminal + .grid {
  margin-top: 0 !important;
}