styles.css

@tailwind base;
@tailwind components;
@tailwind utilities;

html {
  font-feature-settings: "rlig" 1, "calt" 1, "ss01" 1, "ss06" 1 !important;
}

[data-reach-skip-link] {
  @apply sr-only;
}

[data-reach-skip-link]:focus {
  @apply fixed top-0 z-50 px-6 py-2 mt-2 ml-6 text-lg bg-white outline-none not-sr-only focus:ring;
}

.dark .invert-on-dark {
  filter: invert(1) brightness(1.8);
}

body {
  background: linear-gradient(to bottom, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 1) 300px),
    fixed 0 0 / 20px 20px radial-gradient(#d1d1d1 1px, transparent 0),
    fixed 10px 10px / 20px 20px radial-gradient(#d1d1d1 1px, transparent 0);
}

.dark body {
  background: linear-gradient(to bottom, rgba(0, 0, 0, 0) 0%, #111 300px),
    fixed 0 0 / 20px 20px radial-gradient(#313131 1px, transparent 0),
    fixed 10px 10px / 20px 20px radial-gradient(#313131 1px, transparent 0);
}

.markdown a {
  color: #006be6;
}

.markdown code {
  border-radius: 4px;
}

.markdown td {
  padding: 6px 13px;
  border: 1px solid #d0d7de;
}

.text-balance {
  text-wrap: balance;
}