/*
  Yokubi — custom styling

  Fonts:
  - Default: prioritize Simplified Chinese fonts (readability for zh).
  - Japanese runs: use a Japanese sans-serif font and a theme-aware tint.
*/

body {
  font-family:
    -apple-system,
    BlinkMacSystemFont,
    "Noto Sans SC",
    "PingFang SC",
    "Microsoft YaHei",
    "Hiragino Sans GB",
    "Source Han Sans SC",
    "WenQuanYi Micro Hei",
    "Segoe UI",
    sans-serif;
}

[lang="ja"] {
  font-family:
    "Noto Sans JP",
    "Hiragino Kaku Gothic ProN",
    "Yu Gothic",
    Meiryo,
    sans-serif;
}

html.light, html.rust {
  --yokubi-ja-bg: #e8f2ff;
  --yokubi-ja-border: #bdd7f2;
}

html.navy, html.coal, html.ayu {
  --yokubi-ja-bg: #304154;
  --yokubi-ja-border: #506b85;
}

.content [lang="ja"] {
  background-color: var(--yokubi-ja-bg);
  border-radius: 0.2em;
  box-shadow: inset 0 -1px var(--yokubi-ja-border);
  padding: 0.03em 0.14em;
  -webkit-box-decoration-break: clone;
  box-decoration-break: clone;
}

.content p[lang="ja"] {
  padding: 0.25em 0.4em;
}

pre {
  display: block;
  width: 80%;
  margin: 0 auto;
  background-color: transparent;
  background: rgba(200, 200, 200, 0.04);
  padding: 0.5em;
  white-space: pre-wrap;
  overflow-wrap: anywhere;
  /* Example blocks in this book are often raw <pre> with bilingual lines.
     Keep them in the normal text font so Chinese matches the body.
     Actual code blocks are rendered as <pre><code>…</code></pre> and are
     handled by the rule below. */
  font-family: inherit;
}

pre code {
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
}

/* Per-lesson progress controls */
.yokubi-progress-tools {
  padding: 0.8em 0.4em 0.5em;
  margin-top: 0.8em;
  border-top: 1px solid var(--sidebar-spacer);
  color: var(--sidebar-fg);
  font-size: 0.85em;
}

.yokubi-progress-tools p { margin: 0.35em 0; }
.yokubi-progress-actions { display: flex; flex-wrap: wrap; gap: 0.4em; }
.yokubi-progress-tools select,
.yokubi-progress-tools button {
  color: var(--sidebar-fg);
  background: var(--sidebar-bg);
  border: 1px solid var(--sidebar-spacer);
  border-radius: 0.25em;
  padding: 0.3em;
  font: inherit;
}
.yokubi-progress-tools select { width: 100%; margin: 0.3em 0; }
.yokubi-progress-tools button { cursor: pointer; }
.yokubi-progress-tools button:hover { color: var(--sidebar-active); }
.yokubi-progress-status { min-height: 1.2em; }
.yokubi-lesson-check { align-self: baseline; flex: none; margin: 0.25em 0.35em 0 0; accent-color: var(--sidebar-active); }
.chapter .section { padding-inline-start: 0; }
.chapter li.chapter-item.yokubi-lesson { align-items: baseline; }
.chapter li.chapter-item.yokubi-lesson > a { flex: 1; min-width: 0; }
.chapter li.yokubi-part > a.toggle { margin-inline-start: 0; padding: 0 0.4em; flex: none; }
.chapter li.yokubi-part > a:first-child { min-width: 0; }
.chapter li.yokubi-clickable { cursor: pointer; }
html.light, html.rust { --yokubi-ring-track: #b8c4cb; }
html.navy, html.coal, html.ayu { --yokubi-ring-track: #66717f; }
.yokubi-progress-ring {
  --yokubi-ring-color: #2ca36b;
  --yokubi-progress: 0%;
  display: inline-block;
  position: relative;
  flex: none;
  align-self: center;
  width: 1.05em;
  height: 1.05em;
  margin-inline-start: auto;
  border-radius: 50%;
  background: conic-gradient(var(--yokubi-ring-color) var(--yokubi-progress), var(--yokubi-ring-track) 0);
}
.yokubi-progress-ring::after {
  content: "";
  position: absolute;
  inset: 0.19em;
  border-radius: 50%;
  background: var(--sidebar-bg);
}
.yokubi-progress-ring.is-complete { --yokubi-ring-color: #428cf5; }
.chapter li.chapter-item.yokubi-hidden,
.chapter li.yokubi-hidden,
.chapter .part-title.yokubi-hidden { display: none; }
.yokubi-page-check {
  display: flex;
  align-items: center;
  gap: 0.5em;
  width: fit-content;
  margin: 0.7em 0 1.5em;
  padding: 0.5em 0.7em;
  border: 1px solid var(--quote-border);
  border-radius: 0.35em;
  background: var(--quote-bg);
  cursor: pointer;
}
.yokubi-page-check input { accent-color: var(--links); }
@media print { .yokubi-progress-tools, .yokubi-page-check { display: none; } }