/* Global Reset & Base Styles */
html, body {
  height: 100%;
  margin: 0;
  padding: 0;
  color: var(--text-primary);
  font-family: var(--font-family);
  font-size: var(--font-size-base);
  line-height: var(--line-height-base);
  overflow-x: hidden;

  /* Background from assets/common.css (fancier) */
  background:
    radial-gradient( circle at 30% 10%, rgba(255,255,255,0.04), transparent 40%),
    radial-gradient( circle at 80% 0%, rgba(255,255,255,0.03), transparent 30%),
    linear-gradient(130deg, var(--bg-gradient-start) 0%, var(--bg-gradient-middle) 48%, var(--bg-gradient-end) 100%);
}

body {
  min-height: 100vh;
}

/* Scrollbars */
html { scrollbar-width: thin; scrollbar-color: var(--scroll-thumb-a) var(--scroll-track); }
::-webkit-scrollbar { width: 10px; height: 10px; }
::-webkit-scrollbar-track { background: var(--scroll-track); border-radius: 8px; }
::-webkit-scrollbar-thumb {
  background: linear-gradient(180deg, var(--scroll-thumb-a), var(--scroll-thumb-b));
  border-radius: 8px;
  border: 2px solid var(--scroll-track);
}
::-webkit-scrollbar-thumb:hover { background: linear-gradient(180deg, var(--scroll-thumb-a-hover), var(--scroll-thumb-b-hover)); }

/* --- Light Theme Overrides --- */
[data-theme="light"], [data-theme="light"] body {
  background:
    radial-gradient( circle at 30% 10%, rgba(0,0,0,0.02), transparent 40%),
    radial-gradient( circle at 80% 0%, rgba(0,0,0,0.01), transparent 30%),
    linear-gradient(130deg, var(--bg-gradient-start) 0%, var(--bg-gradient-middle) 48%, var(--bg-gradient-end) 100%);
}