:root {
  --c-background: 250 248 255;
  --c-surface: 250 248 255;
  --c-surface-dim: 210 217 244;
  --c-surface-bright: 250 248 255;
  --c-surface-container-lowest: 255 255 255;
  --c-surface-container-low: 242 243 255;
  --c-surface-container: 234 237 255;
  --c-surface-container-high: 226 231 255;
  --c-surface-container-highest: 218 226 253;
  --c-on-surface: 19 27 46;
  --c-on-surface-variant: 67 70 85;
  --c-inverse-surface: 40 48 68;
  --c-inverse-on-surface: 238 240 255;
  --c-outline: 116 118 134;
  --c-outline-variant: 196 197 215;
  --c-surface-tint: 33 81 218;
  --c-primary: 0 55 176;
  --c-on-primary: 255 255 255;
  --c-primary-container: 29 78 216;
  --c-on-primary-container: 202 211 255;
  --c-inverse-primary: 183 196 255;
  --c-secondary: 160 65 0;
  --c-on-secondary: 255 255 255;
  --c-secondary-container: 254 107 0;
  --c-on-secondary-container: 87 32 0;
  --c-tertiary: 0 79 53;
  --c-on-tertiary: 255 255 255;
  --c-tertiary-container: 0 106 72;
  --c-on-tertiary-container: 96 238 177;
  --c-error: 186 26 26;
  --c-on-error: 255 255 255;
  --c-error-container: 255 218 214;
  --c-on-error-container: 147 0 10;
  --c-primary-fixed: 220 225 255;
  --c-primary-fixed-dim: 183 196 255;
  --c-on-primary-fixed: 0 21 81;
  --c-on-primary-fixed-variant: 0 57 181;
  --c-secondary-fixed: 255 219 204;
  --c-secondary-fixed-dim: 255 182 147;
  --c-on-secondary-fixed: 53 16 0;
  --c-on-secondary-fixed-variant: 122 48 0;
  --c-tertiary-fixed: 111 251 190;
  --c-tertiary-fixed-dim: 78 222 163;
  --c-on-tertiary-fixed: 0 33 19;
  --c-on-tertiary-fixed-variant: 0 82 54;
  --c-on-background: 19 27 46;
  --c-surface-variant: 218 226 253;
}

html.dark {
  --c-background: 15 23 42;
  --c-surface: 15 23 42;
  --c-surface-dim: 30 41 59;
  --c-surface-bright: 51 65 85;
  --c-surface-container-lowest: 2 6 23;
  --c-surface-container-low: 15 23 42;
  --c-surface-container: 30 41 59;
  --c-surface-container-high: 51 65 85;
  --c-surface-container-highest: 71 85 105;
  --c-on-surface: 248 250 252;
  --c-on-surface-variant: 203 213 225;
  --c-inverse-surface: 241 245 249;
  --c-inverse-on-surface: 15 23 42;
  --c-outline: 148 163 184;
  --c-outline-variant: 71 85 105;
  --c-surface-tint: 96 165 250;
  --c-primary: 96 165 250;
  --c-on-primary: 15 23 42;
  --c-primary-container: 37 99 235;
  --c-on-primary-container: 219 234 254;
  --c-inverse-primary: 37 99 235;
  --c-secondary: 251 146 60;
  --c-on-secondary: 15 23 42;
  --c-secondary-container: 234 88 12;
  --c-on-secondary-container: 255 237 213;
  --c-tertiary: 52 211 153;
  --c-on-tertiary: 15 23 42;
  --c-tertiary-container: 5 150 105;
  --c-on-tertiary-container: 209 250 229;
  --c-error: 248 113 113;
  --c-on-error: 15 23 42;
  --c-error-container: 153 27 27;
  --c-on-error-container: 254 226 226;
  --c-on-background: 248 250 252;
  --c-surface-variant: 51 65 85;
}

body {
  font-family: "Plus Jakarta Sans", sans-serif;
  color: rgb(var(--c-on-surface));
  background-color: rgb(var(--c-background));
  overflow-x: hidden;
}

h1, h2, h3, h4, .font-serif-headline {
  font-family: "Newsreader", serif;
}

.no-scrollbar::-webkit-scrollbar {
  display: none;
}
.no-scrollbar {
  -ms-overflow-style: none;
  scrollbar-width: none;
}

.hairline-b {
  border-bottom: 1px solid rgb(var(--c-outline-variant) / 0.5);
}
.hairline-t {
  border-top: 1px solid rgb(var(--c-outline-variant) / 0.5);
}
.hairline-r {
  border-right: 1px solid rgb(var(--c-outline-variant) / 0.5);
}

.prose-article {
  font-family: "Plus Jakarta Sans", sans-serif;
  font-size: 1.125rem;
  line-height: 1.8;
  color: rgb(var(--c-on-surface));
}
.prose-article p {
  margin-bottom: 1.5rem;
}
.prose-article h2 {
  font-family: "Newsreader", serif;
  font-size: 1.75rem;
  font-weight: 700;
  margin-top: 2.25rem;
  margin-bottom: 1rem;
  color: rgb(var(--c-on-surface));
  line-height: 1.3;
}
.prose-article h3 {
  font-family: "Newsreader", serif;
  font-size: 1.35rem;
  font-weight: 600;
  margin-top: 1.75rem;
  margin-bottom: 0.75rem;
  color: rgb(var(--c-on-surface));
}
.prose-article ul, .prose-article ol {
  margin-top: 1rem;
  margin-bottom: 1.5rem;
  padding-left: 1.5rem;
}
.prose-article ul {
  list-style-type: disc;
}
.prose-article ol {
  list-style-type: decimal;
}
.prose-article li {
  margin-bottom: 0.5rem;
}
.prose-article blockquote {
  border-left: 4px solid rgb(var(--c-primary-container));
  padding-left: 1.25rem;
  font-style: italic;
  margin-top: 1.5rem;
  margin-bottom: 1.5rem;
  color: rgb(var(--c-on-surface-variant));
  font-family: "Newsreader", serif;
  font-size: 1.25rem;
}
