:root {
  --mbx-font: "UDDK-NKR+Gudea", "BIZUDP+Gudea", "Iosevka Fixed", "Noto Sans CJK JP", Roboto,
    "UD デジタル 教科書体 NK-R", "Sarasa Fixed J Semibold";
  --mbx-font-size: 12pt;
  --mbx-code-font: "Iosevka Fixed Medium", "Sarasa Fixed J Semibold", "Fira Mono";
  --mbx-code-font-size: 0.9em;
  --mbx-heading-font: "Merriweather", "PT Serif", "Times New Roman", Times, "BIZ UDPゴシック",
    "UD デジタル 教科書体 NK-R";
  --mbx-image-border-width: 5px;
  --mbx-image-border-radius: 3px;
  /* for light theme */
  --mbx-color-bg: #eee;
  --mbx-color-fg: #444;
  --mbx-color-surface-bg: #e5e5e5;
  --mbx-color-primary-200: #8bb1fa;
  --mbx-color-primary-300: #6095f8;
  --mbx-color-primary-400: #528bf7;
  --mbx-color-primary: #3578f6;
  --mbx-color-primary-600: #1865f5;
  --mbx-color-primary-700: #0b5cf3;
  --mbx-color-primary-800: #094bc8;
  --mbx-color-heading-3: #d21a43;
  --mbx-color-image-border: #bbb;
  --mbx-color-code-block-title: rgb(0, 105, 146);
  --mbx-color-quote-bg: hsl(226, 15%, 30%);
  --mbx-color-quote-border: hsl(226, 15%, 22%);
  --mbx-color-links: #20609f;
  --mbx-color-quote-links: #ffcc00;
  --mbx-color-gray-100: #f3f9fa;
  --mbx-color-gray-200: #e9ecef;
  --mbx-color-gray-300: #dee2e6;
  --mbx-color-gray-400: #ced4da;
  --mbx-color-gray-500: #adb5bd;
  --mbx-color-gray-600: #6c757d;
  --mbx-color-gray-700: #495057;
  --mbx-color-gray-800: #343a40;
  --mbx-color-gray-900: #212429;
  /* for dark theme */
  --mbx-dark-color-fg: #ddd;
  --mbx-dark-color-bg: #282c2f;
  --mbx-dark-color-surface-bg: #23272a;
  --mbx-dark-color-primary-200: #ffdb4d;
  --mbx-dark-color-primary-300: #ffd426;
  --mbx-dark-color-primary-400: #ffd11a;
  --mbx-dark-color-primary: #ffcc00;
  --mbx-dark-color-primary-600: #e6b800;
  --mbx-dark-color-primary-700: #d9ad00;
  --mbx-dark-color-primary-800: #b38f00;
  /* --mbx-dark-color-highlight: #ff5050; */
  --mbx-dark-color-highlight: #e6b800;
  --mbx-dark-color-heading-3: #0cf;
  --mbx-dark-color-image-border: #888;
  --mbx-dark-color-quote-bg: hsl(226, 15%, 30%);
  --mbx-dark-color-quote-border: hsl(226, 15%, 22%);
  --mbx-dark-color-links: #0096cf;
  --mbx-dark-quote-color-links: #ffcc00;
  --mbx-dark-inline-code-fg: #b8cc52;
  --mbx-dark-inline-code-bg: #191f26;
  /* reader mode */
  /*
  --mbx-color-bg: #f4ecd8;
  --mbx-color-fg: #444;
  --mbx-color-surface-bg: rgb(239, 228, 200);
  --mbx-color-primary-100: #fbf6e3;
  --mbx-color-primary-200: #f7edc7;
  --mbx-color-primary-300: #e8d8a5;
  --mbx-color-primary-400: #d1bc85;
  --mbx-color-primary: #b3995d;
  --mbx-color-primary-600: #997d43;
  --mbx-color-primary-700: #80622e;
  --mbx-color-primary-800: #674a1d;
  --mbx-color-primary-900: #553811;
  */
  /* default: 300px; */
  --sidebar-target-width: 230px;
}
#mdbook-sidebar {
  font-size: 0.8em;
}
/* #mdbook-sidebar ol li ol li ol li {
  display: none;
} */
.chapter li.chapter-item strong {
  color: var(--mbx-color-gray-600);
}

html {
  font-family: var(--mbx-font);
}

body {
  font-size: var(--mbx-font-size);
}

#mdbook-content h1,
#mdbook-content h2,
#mdbook-content h3,
#mdbook-content h4,
#mdbook-content h5,
#mdbook-content h6 {
  font-family: var(--mbx-heading-font);
}

#mdbook-content h2,
#mdbook-content h3 {
  margin-block-start: 1.2em;
}

#mdbook-content main {
  margin-inline-start: 80px; /* default: auto */
  max-width: 900px; /* default: 750px */
  left: unset; /* for mdbook-pagetoc */
}

#mdbook-content h1:before {
  font-family: "FontAwesome";
  content: "\f02d";
  font-weight: 900;
  padding-right: 16px;
}

#mdbook-content h2:before {
  font-family: "FontAwesome";
  content: "\f138";
  font-weight: 900;
  padding-right: 12px;
}

#mdbook-content div.table-wrapper + div.table-wrapper {
  margin-top: 20px;
}

.light {
  --bg: var(--mbx-color-bg);
  --fg: var(--mbx-color-fg);
  --sidebar-bg: var(--mbx-color-surface-bg);
  --sidebar-fg: var(--mbx-color-fg);
  --quote-bg: var(--mbx-color-quote-bg);
  --quote-border: var(--mbx-color-quote-border);
  --table-border-color: var(--mbx-color-image-border);
}

.ayu {
  --bg: var(--mbx-dark-color-bg);
  --fg: var(--mbx-dark-color-fg);
  --sidebar-bg: var(--mbx-dark-color-surface-bg);
  --sidebar-fg: var(--mbx-dark-color-fg);
  --quote-bg: var(--mbx-dark-color-quote-bg);
  --quote-border: var(--mbx-dark-color-quote-border);
  --table-border-color: var(--mbx-dark-color-image-border);
}

.ayu #mdbook-content h3 > a {
  color: var(--mbx-dark-color-heading-3);
}

.ayu #mdbook-content strong {
  color: var(--mbx-dark-color-highlight);
}

.ayu #mdbook-content sup {
  color: var(--mbx-dark-color-highlight);
}

.ayu #mdbook-content h1,
.ayu #mdbook-content h1 a {
  color: var(--mbx-dark-color-primary);
}

.ayu #mdbook-content h2,
.ayu #mdbook-content h2 a {
  color: var(--mbx-dark-color-primary-600);
}

.ayu #mdbook-content table {
  border: var(--mbx-image-border-width) solid var(--mbx-dark-color-image-border);
  border-radius: var(--mbx-image-border-radius);
}

.light #mdbook-content h1:before,
.light #mdbook-content h1 > a {
  color: var(--mbx-color-primary);
}

.light #mdbook-content h2:before,
.light #mdbook-content h2 > a {
  color: var(--mbx-color-primary-600);
}

.light #mdbook-content h3,
.light #mdbook-content h3 > a {
  color: var(--mbx-color-heading-3);
}

.light #mdbook-content table {
  border: var(--mbx-image-border-width) solid var(--mbx-color-image-border);
  border-radius: var(--mbx-image-border-radius);
}

.light #mdbook-content blockquote {
  color: var(--mbx-color-bg);
}

.light #mdbook-content blockquote a {
  color: var(--mbx-color-quote-links);
}

.ayu .sidebar .part-title {
  color: var(--mbx-dark-color-primary-600);
}

.ayu #mdbook-content pre > code {
  line-height: 1.75em;
  border: 2px dashed #376092;
  text-wrap: wrap;
}

.ayu #mdbook-content pre > code.hljs.language-shell {
  background-color: #0b2341;
  border: 2px solid #376092;
}

.ayu #mdbook-content p > code.hljs,
.ayu #mdbook-content li > code.hljs {
  background-color: rgba(255, 255, 255, 20%);
  --inline-code-color: rgba(255, 255, 255, 85%);
  border: 1px solid rgb(20, 20, 20);
}

.ayu #mdbook-content table tbody tr td > code.hljs {
  background-color: var(--mbx-dark-inline-code-bg);
  --inline-code-color: var(--mbx-dark-inline-code-fg);
  padding: 0.25em 0.5em;
}

.ayu #mdbook-content table thead tr {
  border-bottom: 1px solid var(--table-border-color);
}

.ayu #mdbook-content table thead tr th,
.ayu #mdbook-content table tbody tr td {
  border: 1px dashed var(--table-border-color);
}

.light .sidebar .part-title {
  color: var(--mbx-color-primary-600);
}

.light #mdbook-content pre > code {
  line-height: 1.75em;
  border: 1px solid rgb(53, 120, 246);
}

.light #mdbook-content pre > code.hljs.language-shell {
  background-color: rgb(233, 239, 250);
  border: 2px dashed rgb(53, 120, 246);
}

.light #mdbook-content p > code.hljs,
.light #mdbook-content li > code.hljs,
.light #mdbook-content td > code.hljs {
  background-color: rgb(53, 120, 246);
  --inline-code-color: #fefefe;
}

#mdbook-content pre code,
#mdbook-content p code,
#mdbook-content li code,
#mdbook-content ul code,
#mdbook-content td code {
  font-size: var(--mbx-code-font-size);
  font-family: var(--mbx-code-font) !important;
}

#mdbook-content p img {
  display: block;
  margin: auto;
}

#mdbook-content ul ul,
#mdbook-content ul ol,
#mdbook-content ol ul,
#mdbook-content ol ol {
  margin: 10px 0px;
}

#mdbook-content p,
#mdbook-content li {
  line-height: 1.65em;
}

#mdbook-content td {
  font-size: 0.9em;
  padding: 10px 20px;
}

/* for admonish */
#mdbook-content blockquote.blockquote-tag-note {
  border: 1px solid rgba(from var(--blockquote-note-color) r g b / 0.3);
  padding: 0px;
}

#mdbook-content blockquote.blockquote-tag-note p.blockquote-tag-title {
  background-color: rgba(from var(--blockquote-note-color) r g b / 0.1);
  margin: 0px;
  padding: 8px 20px;
  color: var(--blockquote-note-color);
}

#mdbook-content blockquote.blockquote-tag-tip {
  border: 1px solid rgba(from var(--blockquote-tip-color) r g b / 0.3);
  padding: 0px;
}

#mdbook-content blockquote.blockquote-tag-tip p.blockquote-tag-title {
  background-color: rgba(from var(--blockquote-tip-color) r g b / 0.1);
  margin: 0px;
  padding: 8px 20px;
  color: var(--blockquote-tip-color);
}

#mdbook-content blockquote.blockquote-tag-important {
  border: 1px solid rgba(from var(--blockquote-important-color) r g b / 0.3);
  padding: 0px;
}

#mdbook-content blockquote.blockquote-tag-important p.blockquote-tag-title {
  background-color: rgba(from var(--blockquote-important-color) r g b / 0.1);
  margin: 0px;
  padding: 8px 20px;
  color: var(--blockquote-important-color);
}

#mdbook-content blockquote.blockquote-tag-warning {
  border: 1px solid rgba(from var(--blockquote-warning-color) r g b / 0.3);
  padding: 0px;
}

#mdbook-content blockquote.blockquote-tag-warning p.blockquote-tag-title {
  background-color: rgba(from var(--blockquote-warning-color) r g b / 0.1);
  margin: 0px;
  padding: 8px 20px;
  color: var(--blockquote-warning-color);
}

#mdbook-content blockquote.blockquote-tag-caution {
  border: 1px solid rgba(from var(--blockquote-caution-color) r g b / 0.3);
  padding: 0px;
}

#mdbook-content blockquote.blockquote-tag-caution p.blockquote-tag-title {
  background-color: rgba(from var(--blockquote-caution-color) r g b / 0.1);
  margin: 0px;
  padding: 8px 20px;
  color: var(--blockquote-caution-color);
}

#mdbook-content blockquote.blockquote-tag-note > p,
#mdbook-content blockquote.blockquote-tag-tip > p,
#mdbook-content blockquote.blockquote-tag-important > p,
#mdbook-content blockquote.blockquote-tag-warning > p,
#mdbook-content blockquote.blockquote-tag-caution > p {
  padding: 0px 20px;
  margin-block-start: 8px;
  margin-block-end: 8px;
}

#mdbook-content blockquote.blockquote-tag-note > h3,
#mdbook-content blockquote.blockquote-tag-tip > h3,
#mdbook-content blockquote.blockquote-tag-important > h3,
#mdbook-content blockquote.blockquote-tag-warning > h3,
#mdbook-content blockquote.blockquote-tag-caution > h3 {
  margin-block-start: 12px;
  margin-block-end: 8px;
  margin-inline-start: 20px;
}

#mdbook-content blockquote.blockquote-tag-note,
#mdbook-content blockquote.blockquote-tag-tip,
#mdbook-content blockquote.blockquote-tag-important,
#mdbook-content blockquote.blockquote-tag-warning,
#mdbook-content blockquote.blockquote-tag-caution {
  color: var(--fg);
}

/* for mdbook-admonish */
div.admonition {
  border: 1px solid #999;
}
:root {
  --md-admonition-icon--admonish-comment: url("data:image/svg+xml;charset=utf-8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><path d='M21 11.5a8.38 8.38 0 0 1-.9 3.8 8.5 8.5 0 0 1-7.6 4.7 8.38 8.38 0 0 1-3.8-.9L3 21l1.9-5.7a8.38 8.38 0 0 1-.9-3.8 8.5 8.5 0 0 1 4.7-7.6 8.38 8.38 0 0 1 3.8-.9h.5a8.48 8.48 0 0 1 8 8v.5z'></path></svg>");
}
:is(.admonition):is(.admonish-comment) {
  border-color: var(--mbx-dark-color-primary-800);
}
:is(.admonish-comment) > :is(.admonition-title, summary.admonition-title) {
  background-color: rgba(170, 237, 0, 0.1);
}
:is(.admonish-comment) > :is(.admonition-title, summary.admonition-title)::before {
  background-color: var(--mbx-dark-color-primary-600);
  mask-image: var(--md-admonition-icon--admonish-comment);
  -webkit-mask-image: var(--md-admonition-icon--admonish-comment);
  mask-repeat: no-repeat;
  -webkit-mask-repeat: no-repeat;
  mask-size: contain;
  -webkit-mask-size: contain;
}

/* for mdbook-pagetoc */
#pagetoc * {
  font-size: 0.65em;
}

/* for mdbook-katex */
/*
.katex .base,
.katex .mathrm,
.katex .mathnormal,
.katex .amsrm {
  font-family: var(--pixy-font-family-math);
}

.katex .accent-body .mord {
  font-family: KaTeX_Main;
}
*/

.katex .base,
.katex .mathnormal,
.katex .mathrm,
.katex .amsrm {
  /* font-size: var(--pixy-font-size-math); */
  font-weight: 300;
  color: rgb(255, 238, 143);
}

/* for notion */
#content aside {
  border: 1px dashed var(--mbx-dark-color-primary-800);
  background-color: var(--mbx-color-gray-900);
  border-radius: var(--mbx-image-border-radius);
  padding: 1em;
}

#content aside img[src$=".svg"] {
  display: none;
}

@media print {
  :root {
    --bg: white;
  }

  #mdbook-content main {
    margin-inline-start: auto;
  }

  body {
    font-size: 11pt;
  }

  h2,
  h3 {
    margin-block-start: 2em;
  }

  .content img {
    max-width: 75%;
  }
}