/* Default Observable Light Theme Overrides */

:root {
  /* Stark white background, typical of art blogs */
  --theme-background: #ffffff;
  --theme-background-alt: #f8f8f8;
  
  /* High contrast text */
  --theme-foreground: #111111;
  --theme-foreground-muted: #555555;
  --theme-foreground-faint: #aaaaaa;

  /* Typography inspired by Colossal */
  --sans-serif: 'Inter', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  --serif: 'Lora', Georgia, Cambria, "Times New Roman", Times, serif;

  /* Spacing */
  --layout-max-width: 1000px;
}

body {
  font-family: var(--serif);
  color: var(--theme-foreground);
  background-color: var(--theme-background);
  line-height: 1.8;
  font-size: 1.125rem;
  letter-spacing: -0.01em;
}

h1, h2, h3, h4, h5, h6 {
  font-family: var(--sans-serif);
  font-weight: 800;
  letter-spacing: -0.02em;
  color: var(--theme-foreground);
  margin-top: 2em;
  margin-bottom: 0.5em;
  line-height: 1.2;
}

a {
  color: var(--theme-foreground);
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: 4px;
}

a:hover {
  color: var(--theme-foreground-muted);
}

/* Colossal Image Style */
img, video {
  max-width: 100%;
  height: auto;
  display: block;
  margin: 3rem auto;
}

.full-bleed {
  margin-left: calc(-50vw + 50%);
  margin-right: calc(-50vw + 50%);
  max-width: 100vw;
  width: 100vw;
}

/* Specific component resets */
.observablehq-sidebar {
  font-family: var(--sans-serif);
  background-color: var(--theme-background);
  border-right: 1px solid var(--theme-background-alt);
}

.observablehq-sidebar summary, .observablehq-sidebar a {
  color: var(--theme-foreground-muted);
  font-weight: 500;
  text-decoration: none;
}

.observablehq-sidebar a:hover, .observablehq-sidebar a[aria-current="page"] {
  color: var(--theme-foreground);
}

.observablehq-header, .observablehq-footer {
  font-family: var(--sans-serif);
  color: var(--theme-foreground-muted);
}
