/* The page uses the site's original theme. These styles only cover documentation controls. */
html { scroll-behavior: smooth; scroll-padding-top: var(--docs-scroll-offset, 90px); }
html.docs-modal-open { overflow: hidden; }
.chf4-documentation-page .blog-content__post { min-width:0; }
.chf4-documentation-page .chf4-full-width { grid-template-columns:minmax(0,1fr); gap:0; }
.chf4-documentation-page .chf4-full-width>.blog-content__post { grid-column:1 / -1; }
.chf4-docs { --docs-ink:var(--mainColor,#333646); --docs-paper:var(--lightColor,#fff); --docs-muted:var(--greyColor,#525661); --docs-line:var(--borderColor,#eff0f8); --docs-soft:var(--greyBg,#f7f6fb); --docs-link:var(--hoverColor,#1c59bc); margin-bottom:0; min-width:0; }
.chf4-docs [hidden] { display:none!important; }
.chf4-docs button,.chf4-docs input { font-family:inherit; }
.chf4-docs :focus-visible { outline:2px solid var(--docs-link); outline-offset:3px; }
.chf4-docs .docs-toolbar { position:sticky; top:var(--docs-toolbar-top,0px); z-index:25; display:flex; align-items:center; gap:12px; padding:12px 0; margin:0 0 24px; background:var(--docs-paper); border-block:1px solid var(--docs-line); }
.chf4-docs .reading-title { flex:1; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:13px; color:var(--docs-muted); }
.chf4-docs .docs-tools { display:flex; align-items:center; gap:8px; margin:0; flex-shrink:0; }
.chf4-docs .search-trigger,.chf4-docs .contents-trigger { display:inline-flex; align-items:center; justify-content:center; gap:8px; padding:9px 12px; border:1px solid var(--docs-line); border-radius:5px; background:var(--docs-soft); color:var(--docs-ink); font-size:13px; line-height:20px; text-decoration:none; cursor:pointer; white-space:nowrap; }
.chf4-docs .search-trigger:hover,.chf4-docs .contents-trigger:hover { color:var(--docs-link); border-color:var(--docs-link); }
.chf4-docs .search-trigger svg { flex-shrink:0; }
.chf4-docs .search-trigger kbd { margin:0; padding:0 4px; border:1px solid var(--docs-line); border-radius:3px; font-family:inherit; font-size:10px; line-height:18px; color:var(--docs-muted); white-space:nowrap; }
.chf4-docs .docs-contents { margin:0 0 40px; scroll-margin-top:12px; }
.chf4-docs .toc-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:18px; }
@media(min-width:1050px) { .chf4-documentation-page .toc-grid { grid-template-columns:repeat(3,minmax(0,1fr)); } }
.chf4-docs .toc-grid>.toc-group { margin:0; padding:18px; border:1px solid var(--docs-line); border-radius:6px; }
.chf4-docs .toc-group-title { display:flex; gap:8px; align-items:baseline; margin:0 0 12px; font-size:15px; font-weight:600; line-height:1.5; }
.chf4-docs .toc-group-title>a { color:var(--docs-ink); text-decoration:none; }
.chf4-docs .toc-group-title>a:hover { color:var(--docs-link); }
.chf4-docs .toc-group-index,.chf4-docs .toc-group-count { color:var(--docs-muted); font-size:11px; font-weight:400; font-variant-numeric:tabular-nums; }
.chf4-docs .toc-group-count { margin-left:auto; }
.chf4-docs .toc-group ol { list-style:none; margin:0; padding:0; }
.chf4-docs .toc-group li,.chf4-docs .toc-group li:not(:last-child) { list-style:none; padding:0; margin:0; }
.chf4-docs .toc-group li::before,.chf4-docs .toc-group li::marker { content:none; }
.chf4-docs .toc-link { display:flex; gap:8px; align-items:baseline; padding:6px; margin:0 -6px; border-radius:4px; font-size:14px; line-height:1.5; color:var(--docs-ink); text-decoration:none; }
.chf4-docs .toc-link:hover,.chf4-docs .toc-link.is-active { color:var(--docs-link); background:var(--docs-soft); }
.chf4-docs .toc-number { min-width:16px; font-size:10px; color:var(--docs-muted); font-variant-numeric:tabular-nums; }
.chf4-docs .toc-link>span:last-child { overflow-wrap:anywhere; }
.chf4-docs .docs-content { margin:0; min-width:0; counter-reset:doc-article; }
.chf4-docs .docs-chapter { margin:0 0 50px; scroll-margin-top:12px; }
.chf4-docs .chapter-heading { padding-top:24px; border-top:1px solid var(--docs-line); }
.chf4-docs .doc-article { counter-increment:doc-article; margin:32px 0 40px; padding:0 0 28px; border-bottom:1px solid var(--docs-line); scroll-margin-top:12px; }
.chf4-docs .article-title { margin-top:0; }
.chf4-docs .article-title::before { content:counter(doc-article,decimal-leading-zero) ". "; color:var(--docs-muted); }
.chf4-docs .article-meta { font-size:13px; color:var(--docs-muted); }
.chf4-docs .article-meta a { color:inherit; }
.chf4-docs .article-body { min-width:0; }
.chf4-docs .article-body img { max-width:100%; height:auto; }
.chf4-docs .article-body iframe { max-width:100%; }
.chf4-docs .article-body pre { max-width:100%; overflow-x:auto; }
.chf4-docs .article-body pre code { display:block; margin:0; padding:0; background:transparent; color:inherit; font-family:inherit; font-size:inherit; line-height:inherit; white-space:pre; }
.chf4-docs .code-block { margin:24px 0; border:1px solid var(--docs-line); border-radius:5px; overflow:hidden; min-width:0; }
.chf4-docs .code-block pre { margin:0; padding:16px 18px; border:0; border-radius:0; background:var(--docs-soft); color:var(--docs-ink); font-size:13px; line-height:1.7; }
.chf4-docs .code-toolbar { display:flex; align-items:center; justify-content:space-between; gap:12px; margin:0; padding:8px 12px; border-bottom:1px solid var(--docs-line); color:var(--docs-muted); background:var(--docs-soft); font-size:11px; line-height:1.5; }
.chf4-docs .copy-code { display:inline-flex; align-items:center; gap:6px; padding:5px 8px; border:1px solid var(--docs-line); border-radius:4px; background:var(--docs-paper); color:var(--docs-ink); font-size:12px; line-height:18px; cursor:pointer; }
.chf4-docs .copy-code:hover { color:var(--docs-link); }
.chf4-docs .copy-code svg { width:13px; height:13px; }
.chf4-docs .image-zoom { display:block; padding:0; margin:0; border:0; background:none; width:100%; cursor:zoom-in; }
.chf4-docs .image-zoom img { display:block; margin-inline:auto; }
.chf4-docs .docs-source { font-size:14px; }
.chf4-docs .docs-dialog { padding:0; margin:7dvh auto; width:min(680px,calc(100vw - 32px)); max-height:86dvh; border:1px solid var(--docs-line); border-radius:6px; background:var(--docs-paper); color:var(--docs-ink); font:inherit; box-shadow:0 15px 60px #0003; overflow:hidden; }
.chf4-docs .docs-dialog:not([open]) { display:none; }
.chf4-docs .docs-dialog::backdrop { background:#11182780; }
.chf4-docs .docs-dialog div { margin-bottom:0; }
.chf4-docs .dialog-header { display:flex; align-items:center; justify-content:space-between; gap:16px; padding:18px 22px; border-bottom:1px solid var(--docs-line); }
.chf4-docs .dialog-header h2 { margin:0; font-size:21px; line-height:1.4; }
.chf4-docs .dialog-header small { font-size:12px; font-weight:400; color:var(--docs-muted); margin-left:8px; }
.chf4-docs .icon-button { display:inline-flex; align-items:center; justify-content:center; width:34px; height:34px; padding:0; border:1px solid var(--docs-line); border-radius:4px; color:var(--docs-ink); background:var(--docs-soft); font-size:26px; line-height:1; cursor:pointer; flex-shrink:0; }
.chf4-docs .icon-button:hover { color:var(--docs-link); }
.chf4-docs .search-input-wrap { display:block; margin:20px 22px 0; }
.chf4-docs .search-input-wrap input { box-sizing:border-box; width:100%; padding:12px; margin:0; border:1px solid var(--docs-line); border-radius:5px; background:var(--docs-soft); color:var(--docs-ink); font-size:16px; line-height:24px; }
.chf4-docs .search-summary { margin:0; padding:12px 22px; font-size:12px; color:var(--docs-muted); line-height:1.6; }
.chf4-docs .search-results { padding:0 12px 12px; max-height:calc(86dvh - 235px); overflow:auto; overscroll-behavior:contain; }
.chf4-docs .search-result { display:block; padding:12px; border-radius:5px; text-decoration:none; color:var(--docs-ink); line-height:1.5; }
.chf4-docs .search-result:hover,.chf4-docs .search-result.is-selected { background:var(--docs-soft); color:var(--docs-link); }
.chf4-docs .search-result small { display:block; margin-bottom:4px; font-size:11px; color:var(--docs-muted); }
.chf4-docs .search-result strong { display:block; font-size:16px; font-weight:600; }
.chf4-docs .search-result p { margin:6px 0 0; font-size:13px; line-height:1.6; color:var(--docs-muted); overflow-wrap:anywhere; }
.chf4-docs .search-result mark { background:#fff0b4; color:#333646; padding:0 1px; }
.chf4-docs .search-empty { padding:28px 12px; text-align:center; font-size:15px; }
.chf4-docs .search-empty strong { display:block; margin-bottom:8px; }
.chf4-docs .dialog-hint { display:flex; justify-content:space-between; gap:12px; padding:12px 22px; border-top:1px solid var(--docs-line); color:var(--docs-muted); font-size:11px; }
.chf4-docs .contents-dialog { width:min(760px,calc(100vw - 32px)); }
.chf4-docs .dialog-toc { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:26px; padding:22px; max-height:calc(86dvh - 82px); overflow:auto; overscroll-behavior:contain; }
.chf4-docs .image-dialog { width:max-content; max-width:calc(100vw - 32px); max-height:94dvh; margin:3dvh auto; padding:44px 12px 12px; }
.chf4-docs .image-dialog>.icon-button { position:absolute; top:6px; right:10px; width:30px; height:30px; }
.chf4-docs .image-dialog>img { display:block; max-width:100%; max-height:calc(94dvh - 58px); width:auto; height:auto; object-fit:contain; }
.chf4-docs .docs-toast { position:fixed; z-index:10000; bottom:24px; left:50%; transform:translate(-50%,15px); margin:0; padding:10px 18px; max-width:calc(100vw - 40px); border-radius:5px; background:var(--mainColor,#333646); color:var(--lightColor,#fff); font-size:14px; text-align:center; pointer-events:none; opacity:0; transition:opacity .15s,transform .15s; }
.chf4-docs .docs-toast.is-visible { opacity:1; transform:translate(-50%,0); }
@media(max-width:1100px) { .chf4-docs .search-trigger kbd { display:none; } .chf4-docs .toc-grid>.toc-group { padding:15px; } }
@media(max-width:600px) { .chf4-docs .reading-title { display:none; } .chf4-docs .docs-tools { width:100%; } .chf4-docs .search-trigger { flex:1; min-width:0; padding-inline:8px; font-size:12px; gap:6px; } .chf4-docs .contents-trigger { font-size:12px; padding-inline:9px; } .chf4-docs .toc-grid { grid-template-columns:1fr; gap:14px; } .chf4-docs .toc-link { padding-block:8px; } .chf4-docs .doc-article { margin-block:26px; } .chf4-docs .code-block pre { padding:14px; font-size:12px; } .chf4-docs .docs-dialog { width:calc(100vw - 24px); margin:3dvh auto; max-height:90dvh; } .chf4-docs .dialog-header { padding:14px 16px; } .chf4-docs .dialog-header h2 { font-size:18px; } .chf4-docs .search-input-wrap { margin:16px 16px 0; } .chf4-docs .search-summary { padding-inline:16px; } .chf4-docs .search-results { max-height:calc(90dvh - 230px); } .chf4-docs .dialog-toc { grid-template-columns:1fr; max-height:calc(90dvh - 75px); padding:18px 22px; } .chf4-docs .dialog-hint { font-size:10px; padding-inline:16px; } }
@media(prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } .chf4-docs .docs-toast { transition:none; } }
@media print { .chf4-docs .docs-toolbar,.chf4-docs .docs-contents,.chf4-docs .docs-dialog,.chf4-docs .docs-toast,.chf4-docs .copy-code { display:none!important; } .chf4-docs .article-title { break-after:avoid; } .chf4-docs .article-body pre,.chf4-docs .article-body pre code { white-space:pre-wrap; overflow-wrap:anywhere; } }