/* KUMIHAN install guide: canonical layout shared by product sites. */
    :root {
      color-scheme: light;
      --paper: #f5f3ee;
      --white: #fff;
      --paper-soft: #eeebe4;
      --ink: #252521;
      --ink-2: #4a4943;
      --muted: #625f58;
      --line: #d9d5cc;
      --red: #ae2d31;
      --red-soft: #f5e6e2;
      --measure: 72ch;
      --font-jp: "Hiragino Kaku Gothic ProN", "Hiragino Sans", "Yu Gothic", Meiryo, system-ui, sans-serif;
    }
    *, *::before, *::after { box-sizing: border-box; }
    html { scroll-behavior: smooth; scroll-padding-top: 28px; }
    body { margin: 0; background: var(--paper); color: var(--ink); font-family: var(--font-jp); -webkit-font-smoothing: antialiased; }
    html[lang="zh-Hant-TW"] body { font-family: "PingFang TC", "Microsoft JhengHei", "Noto Sans CJK TC", system-ui, sans-serif; }
    button, input { font: inherit; }
    a { color: inherit; }
    img { display: block; max-width: 100%; height: auto; }
    [hidden] { display: none !important; }
    a:focus-visible, button:focus-visible, summary:focus-visible { outline: 3px solid var(--red); outline-offset: 4px; }
    .shell { width: min(1184px, calc(100% - 88px)); margin-inline: auto; }
    .skip-link { position: absolute; z-index: 100; top: -90px; left: 16px; background: var(--ink); color: #fff; padding: 12px 18px; }
    .skip-link:focus { top: 12px; }
    .site-header { border-bottom: 1px solid var(--line); background: var(--paper); }
    .header-inner { min-height: 83px; display: flex; align-items: center; gap: 28px; }
    .brand { font: 850 22px/1 Arial, Helvetica, sans-serif; letter-spacing: -.055em; text-decoration: none; white-space: nowrap; }
    .brand::before { content: ""; display: inline-block; background: var(--red); width: 9px; height: 9px; margin-inline-end: 12px; vertical-align: 2px; }
    .header-nav { display: flex; gap: 24px; margin-left: auto; align-items: center; }
    .header-nav a { text-decoration: none; font-size: 13px; color: var(--ink-2); font-weight: 680; text-underline-offset: 5px; }
    .header-nav a:hover, .header-nav a[aria-current="page"] { color: var(--red); text-decoration: underline; }
    .hero { border-bottom: 1px solid var(--line); }
    .breadcrumb { display: flex; flex-wrap: wrap; align-items: center; gap: 9px; color: var(--muted); padding-top: 31px; font-size: 12px; }
    .breadcrumb a { text-underline-offset: 4px; }
    .hero-grid { display: grid; grid-template-columns: minmax(0, 1fr) 170px; align-items: center; gap: 40px; padding: 54px 0 66px; }
    .eyebrow { font: 760 11px/1.6 Arial, Helvetica, sans-serif; letter-spacing: .14em; color: var(--red); text-transform: uppercase; }
    .hero h1 { font-size: clamp(33px,4.1vw,54px); font-weight: 790; line-height: 1.28; letter-spacing: -.065em; margin: 18px 0 19px; overflow-wrap: break-word; }
    .hero-desc { margin: 0; font-size: clamp(15px,1.28vw,17px); line-height: 1.9; color: var(--ink-2); max-width: 660px; }
    .hero-logo { background: #fff; padding: 15px; border: 1px solid #dedbd4; box-shadow: 10px 10px 0 #e8e4dc; }
    .hero-logo img { width: 100%; }
    .language-switch { display: inline-flex; gap: 4px; margin-top: 30px; padding: 4px; border: 1px solid #bcb6a9; background: #eeebe5; border-radius: 5px; }
    .language-switch button { border: 0; background: transparent; min-width: 90px; min-height: 44px; padding: 10px 16px; border-radius: 3px; color: var(--ink-2); font-size: 13px; font-weight: 760; cursor: pointer; }
    .language-switch button[aria-pressed="true"] { color: white; background: var(--ink); }
    .platform-nav { border-bottom: 1px solid var(--line); background: var(--white); }
    .platform-inner { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 0; }
    .platform-nav a { display: flex; justify-content: space-between; align-items: center; gap: 12px; padding: 23px 24px; border-right: 1px solid var(--line); text-decoration: none; color: var(--ink-2); font-size: 13px; font-weight: 740; }
    .platform-nav a:first-child { border-left: 1px solid var(--line); }
    .platform-nav a[aria-current="page"] { box-shadow: inset 0 -4px 0 var(--red); background: #fbf9f5; color: var(--ink); }
    .platform-nav a:hover { background: var(--paper-soft); }
    .platform-nav .arrow { color: var(--red); }
    .content-layout { display: grid; grid-template-columns: 236px minmax(0,1fr); gap: clamp(42px,6vw,94px); align-items: start; padding-top: 75px; padding-bottom: 140px; }
    .toc { position: sticky; top: 28px; padding-top: 4px; min-width: 0; }
    .toc-title { margin: 0 0 18px; color: var(--ink); font-weight: 790; font-size: 12px; letter-spacing: .035em; }
    .toc-details summary { display: none; }
    .toc ol { list-style: none; padding: 0; margin: 0; border-left: 1px solid var(--line); }
    .toc li a { display: block; padding: 9px 10px 9px 15px; margin-left: -1px; border-left: 2px solid transparent; font-size: 12px; line-height: 1.65; color: var(--muted); text-decoration: none; overflow-wrap: anywhere; }
    .toc li a:hover, .toc li a[aria-current="location"] { border-left-color: var(--red); color: var(--ink); }
    .toc li.secondary a { padding-left: 25px; font-size: 11px; }
    .toc-note { border-top: 1px solid var(--line); padding-top: 20px; margin-top: 28px; }
    .toc-note strong { display: block; color: var(--red); font: 780 12px/1.7 Arial, Helvetica, sans-serif; }
    .toc-note p { font-size: 12px; line-height: 1.85; color: var(--muted); margin: 7px 0 0; }
    .source-link { display: inline-block; max-width: 100%; margin-top: 18px; font-size: 12px; font-weight: 750; text-underline-offset: 4px; overflow-wrap: anywhere; hyphens: auto; }
    .guide { min-width: 0; }
    .guide-head { border-top: 3px solid var(--ink); padding: 22px 0; display: flex; align-items: center; justify-content: space-between; gap: 16px; }
    .guide-head span { color: var(--muted); font: 700 11px/1.4 Arial, Helvetica, sans-serif; letter-spacing: .11em; }
    .guide-head .step-label { color: var(--red); }
    .guide-pane > h1:first-child, .guide-pane > h1:first-child + p { display: none; }
    .guide-pane > br { display: none; }
    .guide-pane { font-size: 15.5px; line-height: 1.95; color: var(--ink-2); overflow-wrap: break-word; }
    .guide-pane > p { max-width: var(--measure); margin: 0 0 21px; }
    .guide-pane h2 { text-wrap: balance; margin: 58px 0 20px; padding: 0 0 15px; border-bottom: 1px solid var(--line); color: var(--ink); font-size: clamp(24px,2.6vw,33px); line-height: 1.46; font-weight: 780; letter-spacing: -.035em; scroll-margin-top: 26px; }
    .guide-pane h2:first-of-type { margin-top: 15px; }
    .guide-pane h3 { text-wrap: balance; margin: 35px 0 14px; color: var(--ink); font-size: 19px; line-height: 1.5; letter-spacing: -.025em; scroll-margin-top: 26px; }
    .guide-pane strong { color: var(--ink); font-weight: 785; }
    .guide-pane a { color: #8f2529; text-decoration-thickness: 1px; text-underline-offset: 4px; overflow-wrap: anywhere; }
    .guide-pane a:hover { color: #501618; }
    .guide-pane ul, .guide-pane ol { padding-left: 1.55em; margin: 0 0 22px; }
    .guide-pane li { margin-bottom: 9px; padding-left: 2px; }
    .guide-pane li > ul, .guide-pane li > ol { margin-top: 11px; }
    .guide-pane blockquote { margin: 25px 0 30px; padding: 20px 25px; border-left: 4px solid var(--red); background: #efe8e1; color: var(--ink); }
    .guide-pane blockquote p { margin: 0 0 9px; }
    .guide-pane blockquote p:last-child { margin-bottom: 0; }
    .guide-pane table { display: block; max-width: 100%; overflow-x: auto; border-collapse: collapse; margin: 23px 0 29px; font-size: 14px; -webkit-overflow-scrolling: touch; }
    .guide-pane th, .guide-pane td { min-width: 110px; padding: 12px 13px; border: 1px solid var(--line); line-height: 1.7; text-align: left; vertical-align: top; }
    .guide-pane th { background: #ebe7dd; color: var(--ink); font-weight: 770; }
    .guide-pane td { background: #fffefa; }
    .guide-pane code { font: 500 .9em/1.5 ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; background: #e9e7e1; padding: 2px 5px; border-radius: 3px; overflow-wrap: anywhere; }
    .guide-pane pre { margin: 0; padding: 22px 22px 24px; overflow-x: auto; -webkit-overflow-scrolling: touch; font: 500 13px/1.8 ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; color: #faf7f0; background: #252521; tab-size: 2; white-space: pre; }
    .guide-pane pre code { padding: 0; margin: 0; color: inherit; background: transparent; font-size: inherit; line-height: inherit; overflow-wrap: anywhere; }
    .code-shell { position: relative; margin: 22px 0 26px; border: 1px solid #3c3c35; min-width: 0; }
    .code-shell .highlighter-rouge, .code-shell .highlight { margin: 0; }
    .code-shell pre { padding-top: 58px; }
    .copy-code { position: absolute; top: 11px; right: 11px; z-index: 2; min-height: 36px; padding: 7px 15px; background: #44443d; border: 1px solid #77736b; color: white; font-size: 12px; font-weight: 700; cursor: pointer; }
    .copy-code:hover { background: #656056; }
    .guide-pane hr { margin: 52px 0 35px; border: 0; border-top: 1px solid var(--line); }
    .footer { background: #20201d; color: #f6f3ec; padding: 48px 0 52px; }
    .footer-inner { display: flex; justify-content: space-between; gap: 30px; align-items: start; }
    .footer strong { font: 790 22px Arial, Helvetica, sans-serif; }
    .footer p { font-size: 12px; line-height: 1.8; color: #bbb6ad; margin: 10px 0 0; }
    .footer a { color: #f6f3ec; text-underline-offset: 4px; font-size: 12px; }
    .footer p a { color: inherit; }
    @media (max-width: 950px) {
      .shell { width: min(100% - 52px,1184px); }
      .header-nav { gap: 13px; }
      .content-layout { grid-template-columns: 188px minmax(0,1fr); gap: 35px; }
      .hero-grid { grid-template-columns: minmax(0,1fr) 125px; gap: 25px; }
      .platform-nav a { padding-inline: 15px; }
    }
    @media (max-width: 710px) {
      .header-inner { flex-wrap: wrap; padding: 20px 0 13px; gap: 18px; }
      .header-nav { order: 3; width: 100%; margin-left: 0; padding-top: 13px; border-top: 1px solid var(--line); justify-content: space-between; }
      .hero-grid { padding: 40px 0 52px; grid-template-columns: minmax(0,1fr) 96px; gap: 20px; }
      .hero-logo { padding: 7px; box-shadow: 6px 6px 0 #e8e4dc; }
      .hero h1 { font-size: clamp(28px,5vw,42px); }
      .platform-inner { grid-template-columns: 1fr; }
      .platform-nav a { border-right: 0; border-bottom: 1px solid var(--line); padding: 15px 10px; min-height: 50px; }
      .platform-nav a:first-child { border-left: 0; }
      .platform-nav a:last-child { border-bottom: 0; }
      .platform-nav a[aria-current="page"] { box-shadow: inset 4px 0 0 var(--red); }
      .content-layout { grid-template-columns: 1fr; gap: 38px; padding-top: 48px; }
      .toc { position: static; }
      .toc-details summary { display: block; cursor: pointer; border: 1px solid var(--line); background: #eeebe5; padding: 14px 17px; font-weight: 780; font-size: 13px; }
      .toc-details ol { padding-top: 14px; }
      .toc ol { columns: 2; column-gap: 20px; }
      .toc-note { display: none; }
      .toc li { break-inside: avoid; }
      .toc-note { margin-top: 16px; padding-top: 16px; }
    }
    @media (max-width: 480px) {
      .shell { width: calc(100% - 36px); }
      .header-nav a { font-size: 12px; }
      .hero-grid { grid-template-columns: 1fr; padding: 35px 0 43px; gap: 20px; }
      .hero-logo { display: none; }
      .hero h1 { font-size: clamp(30px,8vw,41px); }
      .hero-desc { font-size: 14px; }
      .language-switch { width: 100%; }
      .language-switch button { flex: 1; min-width: 0; padding-inline: 8px; }
      .toc ol { columns: 1; }
      .content-layout { padding-bottom: 85px; }
      .guide-pane { font-size: 14.5px; line-height: 1.9; }
      .guide-pane h2 { font-size: 24px; }
      .guide-pane th, .guide-pane td { padding: 10px; font-size: 12px; min-width: 105px; }
      .guide-pane blockquote { padding: 16px; }
      .footer-inner { flex-direction: column; }
    }
    @media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }
  
    /* ------------------------------------------------------------------
       Product install guides (TH / ZH-CN / KO / ZH-HAN).
       Everything above is copied verbatim from _layouts/installation.html,
       the canonical KUMIHAN install guide. Below: static language links,
       a static table of contents, and product content blocks.
       ------------------------------------------------------------------ */
    html[lang="ja"] body { line-break: strict; }
    html[lang="th"] body { font-family: "Noto Sans Thai", Thonburi, "Leelawadee UI", Tahoma, system-ui, sans-serif; }
    html[lang="th"] .hero h1, html[lang="th"] .guide-pane h2, html[lang="th"] .guide-pane h3 { letter-spacing: 0; line-height: 1.55; }
    html[lang="th"] .guide-pane { line-height: 2.0; }
    html[lang="ko-KR"] body { font-family: "Apple SD Gothic Neo", "Noto Sans KR", "Malgun Gothic", system-ui, sans-serif; word-break: keep-all; }
    html[lang="ko-KR"] .hero h1 { letter-spacing: -.035em; }
    html[lang="zh-Hans-CN"] body { font-family: "PingFang SC", "Microsoft YaHei", "Noto Sans CJK SC", system-ui, sans-serif; }
    html[lang="zh-Hans-CN"] .hero h1, html[lang="zh-Hant-TW"] .hero h1 { letter-spacing: -.04em; }
    html[lang="en"] .hero h1 { letter-spacing: -.045em; }
    .brand .brand-sub { margin-inline-start: 2px; font-weight: 700; letter-spacing: 0; }
    .header-nav a[aria-current="page"] { color: var(--red); }
    .language-switch a { display: inline-flex; align-items: center; justify-content: center; min-width: 90px; min-height: 44px; padding: 10px 16px; border-radius: 3px; color: var(--ink-2); font-size: 13px; font-weight: 760; text-decoration: none; }
    .language-switch a[aria-current="page"] { color: white; background: var(--ink); }
    .language-switch a:hover:not([aria-current="page"]) { background: #e2ddd3; }
    .platform-nav a span:first-child { min-width: 0; overflow-wrap: anywhere; }
    .guide:focus { outline: none; }
    .guide-head { flex-wrap: wrap; }
    .breadcrumb { flex-wrap: wrap; row-gap: 4px; }
    .breadcrumb > * { min-width: 0; overflow-wrap: anywhere; }
    .guide-head span { min-width: 0; overflow-wrap: anywhere; }
    .header-inner > *, .hero-grid > * { min-width: 0; }
    .header-nav { flex-wrap: wrap; row-gap: 6px; min-width: 0; }
    .header-nav a { overflow-wrap: anywhere; }
    .guide-pane > section { scroll-margin-top: 26px; }
    .guide-pane > section > h2:first-child, .guide-pane > section:first-child > .section-kicker + h2 { margin-top: 15px; }
    .guide-pane > section + section > h2:first-child { margin-top: 58px; }
    .guide-pane .eyebrow, .guide-pane .section-kicker { margin: 52px 0 -8px; font: 760 11px/1.6 Arial, Helvetica, sans-serif; letter-spacing: .14em; color: var(--red); text-transform: uppercase; }
    .guide-pane > section:first-child > .eyebrow:first-child, .guide-pane > section:first-child > .section-kicker:first-child { margin-top: 0; }
    .guide-pane ul.downloads, .guide-pane ul.download-list { list-style: none; padding: 0; border-top: 1px solid var(--ink); }
    .guide-pane ul.downloads li, .guide-pane ul.download-list li { margin: 0; padding: 0; border-bottom: 1px solid var(--line); }
    .guide-pane ul.downloads a, .guide-pane ul.download-list a { display: block; padding: 13px 4px; font-weight: 700; }
    .guide-pane .note, .guide-pane .host-status, .guide-pane .limit-note, .guide-pane .status { margin: 25px 0 30px; padding: 18px 22px; border-left: 4px solid var(--red); background: #efe8e1; color: var(--ink); }
    .guide-pane .limit-note p, .guide-pane .status p { margin: 0 0 9px; }
    .guide-pane .limit-note p:last-child, .guide-pane .status p:last-child { margin-bottom: 0; }
    .guide-pane .host-status { font: 500 13px/1.8 ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; }
    .guide-pane pre.sample, .guide-pane pre { white-space: pre-wrap; overflow-wrap: anywhere; }
    .guide-pane .button, .guide-pane .copy, .guide-pane .btn { display: inline-flex; align-items: center; min-height: 44px; margin: 14px 0 6px; padding: 10px 18px; border: 1px solid var(--ink); background: transparent; color: var(--ink); font-size: 13px; font-weight: 760; text-decoration: none; cursor: pointer; }
    .guide-pane .button:hover, .guide-pane .copy:hover, .guide-pane .btn:hover { background: #e8e3da; }
    .guide-pane .copy-status:empty { display: none; }
    .guide-pane .steps { border-top: 1px solid var(--ink); }
    .guide-pane .step > * { min-width: 0; }
    .guide-pane pre.sample code, .guide-pane .step pre code, .guide-pane :is(th, td) { overflow-wrap: anywhere; }
    .guide-pane .step { display: grid; grid-template-columns: 52px minmax(0,1fr); gap: 12px; padding: 22px 0 6px; border-bottom: 1px solid var(--line); }
    .guide-pane .step h3 { margin-top: 0; }
    .guide-pane .step-index { font: 800 11px/2.6 Arial, sans-serif; color: var(--red); }
    .guide-pane .step pre { border: 0 !important; background: #252521 !important; padding: 18px 20px !important; margin: 0 0 22px; }
    .guide-pane .download-panel, .guide-pane .download-grid { display: block; width: auto; }
    .guide-pane .downloads:not(ul) { border-top: 1px solid var(--ink); margin: 0 0 22px; }
    .guide-pane .download-row { display: flex; justify-content: space-between; gap: 16px; padding: 14px 4px; border-bottom: 1px solid var(--line); font-weight: 700; text-decoration: none; }
    .guide-pane .download-row:hover { background: #ece8e0; }
    .guide-pane .install-options { border-top: 1px solid var(--ink); margin: 0 0 22px; }
    .guide-pane .install-row { display: flex; justify-content: space-between; gap: 16px; padding: 14px 4px; border-bottom: 1px solid var(--line); font-weight: 700; text-decoration: none; }
    .guide-pane .install-row:hover { background: #ece8e0; }
    .guide-pane .external-mark { color: var(--red); flex: 0 0 auto; }
    .guide-pane .checksum { margin: 22px 0; padding: 16px 20px; border-left: 4px solid var(--red); background: #efe8e1; }
    .guide-pane .checksum span { display: block; font-size: 12px; color: var(--muted); }
    .guide-pane .checksum code { display: block; margin-top: 6px; background: transparent; padding: 0; }
    .guide-pane .option-grid, .guide-pane .host-grid, .guide-pane .verify-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 14px; margin: 0 0 22px; }
    .guide-pane .option-grid > *, .guide-pane .host-grid > *, .guide-pane .verify-grid > * { padding: 4px 20px 18px; background: #eeebe5; border: 1px solid #e1ddd4; }
    .guide-pane .back-line { margin-top: 36px; }
    @media (max-width: 710px) {
      .language-switch a { min-width: 0; flex: 1; }
      .guide-pane .step { grid-template-columns: minmax(0,1fr); gap: 0; }
    }
    @media (max-width: 480px) {
      .language-switch a { padding-inline: 8px; }
      .brand { white-space: normal; overflow-wrap: anywhere; }
    }
    /* Right-to-left pages (e.g. Arabic): mirror the physical edges of the
       canonical layout; code and commands stay left-to-right. */
    html[dir="rtl"] .toc ol { border-left: 0; border-right: 1px solid var(--line); }
    html[dir="rtl"] .toc li a { margin-left: 0; margin-right: -1px; border-left: 0; border-right: 2px solid transparent; padding: 9px 15px 9px 10px; }
    html[dir="rtl"] .toc li a:hover, html[dir="rtl"] .toc li a[aria-current="location"] { border-right-color: var(--red); }
    html[dir="rtl"] .platform-nav a { border-right: 0; border-left: 1px solid var(--line); }
    html[dir="rtl"] .platform-nav a:first-child { border-left: 1px solid var(--line); border-right: 1px solid var(--line); }
    html[dir="rtl"] .platform-nav .arrow, html[dir="rtl"] .guide-pane .external-mark { transform: scaleX(-1); }
    html[dir="rtl"] .guide-pane ul, html[dir="rtl"] .guide-pane ol { padding-left: 0; padding-right: 1.55em; }
    html[dir="rtl"] .guide-pane blockquote, html[dir="rtl"] .guide-pane .note, html[dir="rtl"] .guide-pane .host-status,
    html[dir="rtl"] .guide-pane .limit-note, html[dir="rtl"] .guide-pane .status, html[dir="rtl"] .guide-pane .checksum { border-left: 0; border-right: 4px solid var(--red); }
    html[dir="rtl"] .guide-pane pre, html[dir="rtl"] .guide-pane code { direction: ltr; text-align: left; }
    html[dir="rtl"] .copy-code { right: auto; left: 11px; }
    html[dir="rtl"] :is(.platform-nav a span:first-child, .eyebrow, .guide-head span:first-child) { direction: ltr; unicode-bidi: isolate; }
    html[dir="rtl"] :is(.footer a, .breadcrumb a, .toc-note strong) { unicode-bidi: isolate; }
    html[dir="rtl"] .footer p { unicode-bidi: plaintext; text-align: right; }
    html[lang="ar"] body { font-family: "Noto Naskh Arabic", "Noto Sans Arabic", "Geeza Pro", "Segoe UI", Tahoma, system-ui, sans-serif; }
    html[lang="ar"] :is(.hero h1, .guide-pane h2, .guide-pane h3, .brand, .eyebrow) { letter-spacing: 0; }
    html[lang="ar"] .hero h1 { line-height: 1.6; }
    html[lang="ar"] .guide-pane { line-height: 2.05; }
    @media (max-width: 710px) {
      html[dir="rtl"] .platform-nav a { border-left: 0; }
      html[dir="rtl"] .platform-nav a[aria-current="page"] { box-shadow: inset -4px 0 0 var(--red); }
    }
    /* Copy buttons added by assets/kumihan-install.js. */
    .guide-pane .code-shell { margin: 22px 0 26px; }
    .guide-pane .code-shell pre { margin: 0; padding-top: 58px !important; }
    .copy-code:focus-visible { outline: 3px solid var(--red); outline-offset: 3px; }
    .copy-status-live { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }