/* 多言語の部品（2026-10-25。automation/site_i18n.py。設計案の 14.）：言語の切り替え・1行の案内・やさしい日本語のふりがな・言語ごとの字 */

/* ベトナム語の声調の付いた字（Nunito。Google Fonts。OFL）。この字が出るページでだけ読み込まれる */
@font-face{font-family:"Nunito";font-style:normal;font-weight:400 800;font-display:swap;src:url(fonts/nunito-vietnamese.woff2) format("woff2");unicode-range:U+0102-0103,U+0110-0111,U+0128-0129,U+0168-0169,U+01A0-01A1,U+01AF-01B0,U+0300-0301,U+0303-0304,U+0308-0309,U+0323,U+0329,U+1EA0-1EF9,U+20AB}

/* 中国語・韓国語・タイ語はスマホの字に任せる（Zen Maru Gothic は日本語の字の形なので使わない）。日本語の部分（lang="ja"）だけ Zen Maru Gothic */
html:lang(zh),html:lang(ko),html:lang(th){--font:"Nunito",system-ui,-apple-system,"Segoe UI",sans-serif}
html:lang(zh) h2,html:lang(ko) h2,html:lang(th) h2{font-family:var(--font);font-weight:800}
html:lang(zh) [lang=ja],html:lang(ko) [lang=ja],html:lang(th) [lang=ja]{font-family:"Zen Maru Gothic",var(--font)}

/* 上の帯：言語の切り替え（国旗は使わない。言語の名前はその言語で） */
.topbar{max-width:1080px;margin:0 auto;padding:10px 16px 0;display:flex;justify-content:flex-end;position:relative;z-index:30}
.lang-menu{position:relative}
.lang-menu summary{list-style:none;cursor:pointer;display:inline-flex;align-items:center;gap:6px;padding:6px 12px 6px 10px;border-radius:999px;background:#fff;border:1.5px solid var(--line);font-weight:800;font-size:13px;color:var(--ink);user-select:none}
.lang-menu summary::-webkit-details-marker{display:none}
.lang-menu summary svg{width:18px;height:18px;fill:var(--ink-soft);flex:none}
.lang-menu summary .caret{width:14px;height:14px}
.lang-menu[open] summary{border-color:var(--ink)}
.lang-menu ul{position:absolute;right:0;top:calc(100% + 6px);background:#fff;border-radius:14px;box-shadow:0 8px 28px rgba(59,42,32,.2);list-style:none;margin:0;padding:6px;min-width:210px;max-height:70vh;overflow:auto}
.lang-menu li a{display:block;padding:9px 12px;border-radius:10px;text-decoration:none;font-weight:700;font-size:15px;color:var(--ink)}
.lang-menu li a:hover{background:var(--cream)}
.lang-menu li a[aria-current]{background:var(--tile);font-weight:800}

/* 英語のページで、スマホの言語がほかの言語のときだけ出す1行の案内（閉じたら出さない） */
.lang-hint{background:var(--gen);color:#fff;font-size:14px;font-weight:700;line-height:1.4;display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:6px 12px;padding:9px 48px 9px 14px;position:relative;text-align:center}
.lang-hint a{color:var(--gen);background:#fff;padding:4px 14px;border-radius:999px;text-decoration:none;font-weight:800;white-space:nowrap}
.lang-hint button{position:absolute;right:6px;top:50%;transform:translateY(-50%);width:36px;height:36px;border:0;border-radius:50%;background:rgba(255,255,255,.14);color:#fff;font:700 20px/1 var(--font);cursor:pointer}

/* ほかの言語のページで「本は英語で書かれている」・プライバシーポリシーの1行 */
.lang-note{margin:-4px 0 12px;font-size:13.5px;font-weight:700;color:var(--ink-soft)}
.doc .lang-note{background:var(--cream);border-radius:12px;padding:10px 12px;margin:0 0 16px;color:var(--ink)}
footer .disclosure-l{margin:0;opacity:.85}

/* やさしい日本語（/ja/）：本文は Zen Maru Gothic Medium（太い字は Black）。Black だけだと文の多いページが太すぎる */
@font-face{font-family:"Zen Maru Text";font-style:normal;font-weight:400 600;font-display:swap;src:url(fonts/zenmaru-medium-sub.woff) format("woff")}
@font-face{font-family:"Zen Maru Text";font-style:normal;font-weight:700 900;font-display:swap;src:url(fonts/zenmaru-sub.woff) format("woff")}
html:lang(ja){--font:"Nunito","Zen Maru Text",system-ui,-apple-system,"Segoe UI",sans-serif}
html:lang(ja) .doc h2{display:block}

/* ふりがな・読む練習の案内 */
ruby{ruby-position:over}
rt{font-size:.5em;font-weight:600;color:var(--ink-soft);letter-spacing:0}
footer rt,.lang-hint rt{color:inherit;opacity:.8}
html.no-furi rt{visibility:hidden}
html:lang(ja) .note,html:lang(ja) .doc p,html:lang(ja) .tagline,html:lang(ja) .lang-note{line-height:2.1}
html:lang(ja) .video .title{line-height:1.9}
.ja-intro{display:flex;flex-wrap:wrap;align-items:center;gap:10px 14px;background:#fff;border-radius:16px;padding:12px 14px;margin:10px 0 4px;box-shadow:var(--shadow)}
.ja-intro p{margin:0;flex:1 1 260px;font-size:14.5px;line-height:2.1;font-weight:700}
.ja-intro .en{display:block;font-size:12.5px;line-height:1.5;font-weight:600;color:var(--ink-soft)}
.furi-btn{flex:none;border:0;border-radius:999px;background:var(--shiba);color:#fff;font:800 14px var(--font);padding:9px 16px;cursor:pointer;box-shadow:0 2px 0 var(--shiba-dark)}
.furi-btn:active{transform:translateY(2px);box-shadow:none}