@import url(https://prismjs.catppuccin.com/frappe.css);

:root {
  /* catppuccin palette */
  --rosewater: hsl(10, 57%, 88%) !important;
  --flamingo: hsl(0, 58%, 84%) !important;
  --pink: hsl(316, 73%, 84%) !important;
  --mauve: hsl(277, 59%, 76%) !important;
  --red: hsl(359, 68%, 71%) !important;
  --maroon: hsl(358, 66%, 76%) !important;
  --peach: hsl(20, 79%, 70%) !important;
  --yellow: hsl(40, 62%, 73%) !important;
  --green: hsl(96, 44%, 68%) !important;
  --teal: hsl(172, 39%, 65%) !important;
  --sky: hsl(189, 48%, 73%) !important;
  --sapphire: hsl(199, 55%, 69%) !important;
  --blue: hsl(222, 74%, 74%) !important;
  --lavender: hsl(239, 66%, 84%) !important;
  --text: hsl(227, 70%, 87%) !important;
  --subtext1: hsl(227, 44%, 80%) !important;
  --subtext0: hsl(228, 29%, 73%) !important;
  --overlay2: hsl(228, 22%, 66%) !important;
  --overlay1: hsl(227, 17%, 58%) !important;
  --overlay0: hsl(229, 13%, 52%) !important;
  --surface2: hsl(228, 13%, 44%) !important;
  --surface1: hsl(227, 15%, 37%) !important;
  --surface0: hsl(230, 16%, 30%) !important;
  --base: hsl(229, 19%, 23%) !important;
  --mantle: hsl(231, 19%, 20%) !important;
  --crust: hsl(229, 20%, 17%) !important;
  --theme-color: var(--red) !important;
}
.progress {
  background-color: var(--theme-color) !important;
}
input[type="search"] {
  background: var(--mantle) !important;
  border-color: var(--mantle) !important;
  color: var(--subtext2) !important;
}
.search {
  border-color: var(--crust) !important;
}
.search .search-keyword,
.search a:hover {
  color: var(--theme-color) !important;
}
.search .search-keyword {
  color: var(--theme-color) !important;
}
.search .results-panel {
  color: var(--surface2) !important;
}
.search .matching-post {
  border-color: var(--surface0) !important;
}
body {
  color: var(--subtext1) !important;
}
kbd {
  border-color: var(--mantle) !important;
}
.app-nav a {
  color: inherit !important;
}
.app-nav a.active,
.app-nav a:hover {
  color: var(--theme-color) !important;
}
.app-nav a.active {
  border-color: var(--theme-color) !important;
  color: var(--theme-color) !important;
}
.app-nav li ul {
  background-color: var(--text) !important;
  border-color: var(--subtext0) !important;
  border-bottom-color: var(--subtext0) !important;
}
.github-corner svg {
  color: var(--mantle) !important;
  fill: var(--theme-color) !important;
}
.anchor span {
  color: var(--theme-color) !important;
}
.sidebar {
  border-color: var(--surface1) !important;
}
.sidebar > h1 a {
  color: inherit !important;
  color: var(--theme-color) !important;
}
.sidebar li > p {
  color: var(--theme-color) !important;
}
.sidebar::-webkit-scrollbar-thumb {
  background: transparent !important;
}
.sidebar:hover::-webkit-scrollbar-thumb {
  background: var(--subtext1) !important;
}
.sidebar:hover::-webkit-scrollbar-track {
  background: var(--subtext1) !important;
}
.sidebar-toggle {
  background-color: transparent !important;
}
.sidebar-toggle-button {
  background-color: var(--mantle) !important;
}
.sidebar-toggle .sidebar-toggle-button:hover {
  background-color: var(--crust) !important;
}
.sidebar-toggle span {
  background-color: var(--theme-color) !important;
}
.markdown-section hr {
  border-color: var(--subtext1) !important;
}
.markdown-section iframe {
  border-color: var(--subtext1) !important;
}
.markdown-section td,
.markdown-section th {
  border-color: var(--subtext2) !important;
}
.markdown-section tr {
  border-color: var(--subtext1) !important;
}
.markdown-section p.tip,
.markdown-section tr:nth-child(2n) {
  background-color: var(--mantle) !important;
}
.markdown-section p.tip {
  border-color: var(--theme-color) !important;
}
.markdown-section p.tip:before {
  background-color: var(--theme-color) !important;
  color: var(--text) !important;
}
.markdown-section p.tip code {
  background-color: var(--mantle) !important;
}
.markdown-section p.tip em {
  color: var(--subtext2) !important;
}
.markdown-section p.warn {
  background: var(--base) !important;
}
section.cover {
  background: var(--mauve) !important;
}
section.cover.has-mask .mask {
  background-color: var(--text) !important;
}
section.cover .cover-main > p:last-child a {
  border-color: var(--theme-color) !important;
  color: var(--theme-color) !important;
}
section.cover .cover-main > p:last-child a:last-child {
  background-color: var(--theme-color) !important;
  color: var(--subtext1) !important;
}
section.cover .cover-main > p:last-child a:last-child:hover {
  color: var(--subtext1) !important;
}
section.cover blockquote > p > a {
  border-color: var(--theme-color) !important;
}
section.cover blockquote > p > a:hover {
  color: var(--theme-color) !important;
}
.sidebar,
body {
  background-color: var(--base) !important;
}
body.close {
  background-color: var(--base) !important;
}
.sidebar {
  color: var(--surface2) !important;
}
.sidebar ul li a {
  color: var(--text) !important;
}
.sidebar ul li.active > a {
  color: var(--theme-color) !important;
}
.markdown-section h1,
.markdown-section h2,
.markdown-section h3,
.markdown-section h4,
.markdown-section strong {
  color: var(--text) !important;
  border-color: var(--surface2);
}
.markdown-section a {
  color: var(--theme-color) !important;
}
.markdown-section blockquote {
  border-color: var(--theme-color) !important;
  color: var(--subtext1) !important;
}
.markdown-section em {
  color: var(--subtext2) !important;
}
.markdown-section code {
  color: var(--text) !important;
}
.markdown-section code,
.markdown-section pre {
  background-color: var(--mantle) !important;
}

.markdown-section pre > code {
  background-color: var(--mantle) !important;
  color: var(--subtext1) !important;
}
pre:after {
  color: var(--subtext1) !important;
}
