:root {
  --doc-bg: #f6f3ef;
  --doc-ink: #1d1e21;
  --doc-text: #55565b;
  --doc-muted: #77787d;
  --doc-faint: #9a9a9e;
  --doc-line: rgba(29, 30, 33, .1);
  --doc-line-2: rgba(29, 30, 33, .06);
  --doc-card: rgba(255, 255, 255, .62);
  --doc-card-head: #efebe6;
  --doc-warn: rgba(236, 63, 28, .06);
  --doc-warn-line: rgba(236, 63, 28, .16);
  --doc-code: #efebe6;
  --doc-accent: #ec3f1c;
  --doc-head-bg: rgba(246, 243, 239, .62);
  --doc-head-line: rgba(29, 30, 33, .06);
  --doc-nav: #55565b;
  --doc-nav-hover: #ece7e1;
  --doc-btn: #25272c;
  --doc-btn-ink: #ffffff;
  --doc-btn-hover: #000000;
  --doc-foot-bg: #efebe6;
  --doc-foot-text: #77787d;
  --doc-glow-1: rgba(248, 160, 132, .36);
  --doc-glow-2: rgba(249, 196, 168, .18);
}
html[data-theme="dark"] {
  color-scheme: dark;
  --doc-bg: #171615;
  --doc-ink: #f3efe9;
  --doc-text: #c9c4bd;
  --doc-muted: #a19c95;
  --doc-faint: #8a857e;
  --doc-line: rgba(243, 239, 233, .13);
  --doc-line-2: rgba(243, 239, 233, .07);
  --doc-card: rgba(255, 255, 255, .03);
  --doc-card-head: #24221f;
  --doc-warn: rgba(236, 63, 28, .12);
  --doc-warn-line: rgba(236, 63, 28, .28);
  --doc-code: #2a2825;
  --doc-accent: #f2643f;
  --doc-head-bg: rgba(23, 22, 21, .72);
  --doc-head-line: rgba(243, 239, 233, .08);
  --doc-nav: #c9c4bd;
  --doc-nav-hover: #2a2825;
  --doc-btn: #f3efe9;
  --doc-btn-ink: #171615;
  --doc-btn-hover: #ffffff;
  --doc-foot-bg: #1f1d1b;
  --doc-foot-text: #a19c95;
  --doc-glow-1: rgba(236, 63, 28, .16);
  --doc-glow-2: rgba(236, 120, 80, .07);
}
html, body { background: var(--doc-bg); }
body { color: var(--doc-ink); }
.hf-doc { background: var(--doc-bg); }
:focus-visible { outline-color: var(--doc-accent); }
.hf-doc .hf-skip { background: var(--doc-accent); }
.hf-doc .hf-top { background: var(--doc-head-bg); border-bottom-color: var(--doc-head-line); }
.hf-doc .hf-brand { color: var(--doc-ink); }
.hf-doc .hf-nav-link { color: var(--doc-nav); }
.hf-doc .hf-nav-link:hover { background: var(--doc-nav-hover); color: var(--doc-ink); }
.hf-doc .hf-nav-link.is-current { color: var(--doc-ink); font-weight: 700; }
.hf-doc .hf-dash { background: var(--doc-btn); color: var(--doc-btn-ink); }
.hf-doc .hf-dash:hover { background: var(--doc-btn-hover); color: var(--doc-btn-ink); }
.hf-doc .hf-foot { background: var(--doc-foot-bg); color: var(--doc-foot-text); }
.hf-doc .hf-foot-nav { border-bottom-color: var(--doc-line); }
.hf-doc .hf-foot-line { border-top-color: var(--doc-line); }       
.hf-doc .hf-foot-nav a:hover { color: var(--doc-ink); }
.doc-glow {
  position: absolute; top: -360px; left: 50%; z-index: 0; pointer-events: none;
  width: min(120vw, 1200px); height: 780px; margin-left: calc(min(120vw, 1200px) / -2);
  background: radial-gradient(closest-side at 64% 50%, var(--doc-glow-1), var(--doc-glow-2) 55%, transparent);
  filter: blur(30px);
}
.doc-main { position: relative; z-index: 1; padding: clamp(120px, 13vw, 168px) 0 clamp(72px, 9vw, 120px); }
.doc-wrap { max-width: 820px; margin: 0 auto; padding: 0 20px; }
.dochead { padding: 0 0 clamp(28px, 4vw, 40px); border-bottom: 1px solid var(--doc-line); }
.lb {
  display: block; font-family: 'JetBrains Mono', monospace; font-size: 11px; font-weight: 600;
  letter-spacing: .12em; color: var(--doc-faint);
}
.dochead h1 {
  margin: 14px 0 0; font-size: clamp(32px, 3.6vw, 48px); font-weight: 800;
  letter-spacing: -.045em; line-height: 1.2; color: var(--doc-ink);
}
.dochead .rev {
  margin: 16px 0 0; font-size: 14px; line-height: 1.6; color: var(--doc-muted);
  font-variant-numeric: tabular-nums;
}
.doc { margin: clamp(32px, 4vw, 44px) 0 0; font-size: 16px; line-height: 1.75; color: var(--doc-text); }
.doc p { margin: 0 0 14px; }
.doc p:last-child { margin-bottom: 0; }
.doc h2 {
  margin: 44px 0 12px; font-size: 19px; font-weight: 700; letter-spacing: -.02em;
  line-height: 1.45; color: var(--doc-ink);
}
.doc > h2:first-child { margin-top: 0; }
.doc h2.chap {
  margin: 72px 0 4px; padding-top: 28px; border-top: 1px solid var(--doc-line);
  font-size: clamp(24px, 2.4vw, 28px); font-weight: 800; letter-spacing: -.035em; line-height: 1.3;
}
.doc h2.chap + h2 { margin-top: 20px; }
.doc h3 {
  margin: 32px 0 10px; font-size: 17px; font-weight: 700; letter-spacing: -.02em;
  line-height: 1.5; color: var(--doc-ink);
}
.doc h2 + h3 { margin-top: 16px; }
.doc ol, .doc ul { margin: 0 0 14px; padding-left: 22px; }
.doc li { margin-bottom: 8px; }
.doc li::marker { color: var(--doc-faint); }
.doc ul ul, .doc ol ul, .doc ol ol { margin: 8px 0 0; }
.doc b { color: var(--doc-ink); font-weight: 700; }
.doc a {
  color: var(--doc-ink); text-decoration: underline; text-decoration-color: var(--doc-line);
  text-underline-offset: 4px; transition: text-decoration-color .2s;
}
.doc a:hover { text-decoration-color: var(--doc-accent); }
.doc code {
  padding: 2px 7px; border-radius: 6px; background: var(--doc-code);
  font-size: 14px; color: var(--doc-ink);
}
.doc .muted { font-size: 14px; color: var(--doc-muted); }
.note-box {
  margin: 0 0 20px; padding: 20px 22px; border-radius: 16px;
  background: var(--doc-card); box-shadow: inset 0 0 0 1px var(--doc-line-2);
}
.note-box p,
.note-box li { font-size: 15px; line-height: 1.7; }
.note-box ol,
.note-box ul { margin-bottom: 0; }
.note-box ul { margin-top: 0; }
.note-box.warn { background: var(--doc-warn); box-shadow: inset 0 0 0 1px var(--doc-warn-line); }
.tblwrap {
  overflow-x: auto; margin: 0 0 18px; border: 1px solid var(--doc-line); border-radius: 14px;
  background: var(--doc-card);
}
.tbl { width: 100%; border-collapse: collapse; font-size: 14px; line-height: 1.65; }
.tbl th,
.tbl td {
  padding: 12px 16px; border-bottom: 1px solid var(--doc-line-2);
  text-align: left; vertical-align: top;
}
.tbl thead th { color: var(--doc-ink); font-weight: 700; background: var(--doc-card-head); }
.tbl tbody th { color: var(--doc-ink); font-weight: 600; }
.tbl thead th { white-space: nowrap; }
.tbl tr:last-child th,
.tbl tr:last-child td { border-bottom: 0; }
@media not all and (min-width: 768px) {
  .doc-main { padding: 104px 0 64px; }
  .dochead h1 { font-size: 28px; }
  .doc { font-size: 15px; }
  .doc h2 { margin-top: 36px; font-size: 17px; }
  .doc h2.chap { margin-top: 56px; padding-top: 24px; font-size: 22px; }
  .doc h3 { font-size: 16px; }
  .doc ol,
  .doc ul { padding-left: 20px; }
  .note-box { padding: 16px 18px; border-radius: 14px; }
  .note-box p,
  .note-box li { font-size: 14px; }
  .tbl { font-size: 13px; }
  .tbl th,
  .tbl td { padding: 10px 6px; }
  .tbl thead th { font-size: 12px; }
  .hf-doc .hf-foot-in { padding-left: 20px; padding-right: 20px; }
}
@media (prefers-reduced-motion: reduce) {
  * { transition: none !important; }
}