/* GB i18n — 0.1.4
 *
 * 🔴 スコープを body.gb-locale から html[lang] へ変えた（tasks #1106・2026-09-21）。
 *    **GB本番の SWELL は <body> にクラスを1つも出さない**（memory 実測）。
 *    body_class フィルタは動いているのに、テーマがその値を出力しないので、
 *    0.1.1 の CSS は**1行も当たっていなかった**。<html lang> は本プラグインの
 *    language_attributes フィルタが確実に書き換えるので、そこを起点にする。
 *    ★body_class フィルタ自体は残してある（テーマを替えた時に効くようになるため）。
 *
 * ★日本語面には1行も効かせない。lang="ja" を選ぶセレクタは1つも書かない。
 *   （:not([lang="ja"]) は使わない＝lang が欠けたページに当たってしまう）
 */

/* ---------------------------------------------------------------- 翻訳ページだけ */

html[lang="en"] .l-sidebar,
html[lang="en"] #sidebar,
html[lang="en"] aside.l-sidebar,
html[lang="en"] .l-sidebar__inner,
html[lang="en"] .p-sidebar,
html[lang="zh-Hant"] .l-sidebar,
html[lang="zh-Hant"] #sidebar,
html[lang="zh-Hant"] aside.l-sidebar,
html[lang="zh-Hant"] .l-sidebar__inner,
html[lang="zh-Hant"] .p-sidebar,
html[lang="ko"] .l-sidebar,
html[lang="ko"] #sidebar,
html[lang="ko"] aside.l-sidebar,
html[lang="ko"] .l-sidebar__inner,
html[lang="ko"] .p-sidebar {
	display: none !important;
}

html[lang="en"] .l-mainContent,
html[lang="zh-Hant"] .l-mainContent,
html[lang="ko"] .l-mainContent {
	width: 100% !important;
	max-width: 100% !important;
}

/* ------------------------------------------- 英語の読みやすさ（0.1.4・2026-10-02 CEO指摘）
 *
 * 🔴 実測（ベルーナ英語版・PC 1366px）: 本文の幅 1,238px で 1行約155字。日本語版は 882px で約48字。
 *    サイドバーを消して本文を 100% に広げた（上の .l-mainContent）うえに、英字は和文の約半分の幅なので、
 *    同じ幅に倍近く入っていた。英文の読みやすさの目安は 1行45〜75字（WCAG 1.4.8 は80字以内）。
 *    CEO「英語習ってるけど、これは読むの疲れる」。
 * ★記事の列（題名・アイキャッチ・本文）をまとめて中央に寄せて絞る。ハブ（.gb-guides を含むページ）は
 *   カード一覧なので絞らない。
 * ★書体は英語圏の標準の並び（Mac/iOS＝San Francisco、Windows＝Segoe UI、Android＝Roboto）。
 *   和文の文字（駅名の併記）は後ろの Noto Sans JP / Hiragino に落ちる。外部フォントは読み込まない。
 * ★スマホも同じ指定で崩れない（列幅は max-width なので画面が狭ければ画面幅になる）。 */
html[lang="en"] body {
	font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial,
		"Noto Sans JP", "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, sans-serif;
}

html[lang="en"] .l-mainContent__inner:not(:has(.gb-guides)) {
	max-width: 680px;
	margin-left: auto;
	margin-right: auto;
}

/* 文字サイズは SWELL が `#main_content .post_content { font-size: var(--swl-fz--content) }`（ID つき）で
 * 決めているので、規則を上書きせず変数を差し替える。スマホは SWELL の値（実測 20px・1行約47字）で
 * 適正なので PC 幅だけ 18px にする。 */
@media (min-width: 960px) {
	html[lang="en"] {
		--swl-fz--content: 18px;
	}
}

html[lang="en"] .post_content {
	line-height: 1.7;
	/* 駅名の和文併記（例: Shimoyamaguchi (下山口)）を行末で途中から割らない */
	word-break: keep-all;
	/* ★anywhere にしない＝表の狭い列で英単語が途中から割れた（"Gat|e" "fl|oor"・2026-10-02 実測）。
	 *   break-word は「1語が行に収まらないときだけ」割る（長いURL対策）。 */
	overflow-wrap: break-word;
}

/* 表：英単語は単語の切れ目でだけ折り返す。列の幅は中身に合わせる */
html[lang="en"] .post_content table {
	table-layout: auto;
}

html[lang="en"] .post_content th,
html[lang="en"] .post_content td {
	word-break: normal;
	overflow-wrap: normal;
}

html[lang="en"] .post_content p {
	margin-bottom: 1.2em;
}

html[lang="en"] .post_content li {
	line-height: 1.6;
	margin-bottom: 0.4em;
}

/* 日本語の関連記事・次の記事（翻訳ページから日本語面へ読者を落とさない＝同一言語内で閉じる）
 * ★スコープを記事下（.l-articleBottom__inner）に限る。
 *   .p-postListWrap は SWELL が本文中の投稿リストブロック全般に使うラッパなので、
 *   限定しないと翻訳ページ本文に置いた一覧まで !important で黙って消える。 */
html[lang="en"] .l-articleBottom__inner .p-postListWrap,
html[lang="en"] .l-articleBottom__inner .p-postList--related,
html[lang="en"] .c-pageJump,
html[lang="zh-Hant"] .l-articleBottom__inner .p-postListWrap,
html[lang="zh-Hant"] .l-articleBottom__inner .p-postList--related,
html[lang="zh-Hant"] .c-pageJump,
html[lang="ko"] .l-articleBottom__inner .p-postListWrap,
html[lang="ko"] .l-articleBottom__inner .p-postList--related,
html[lang="ko"] .c-pageJump {
	display: none !important;
}

/* パンくずの先頭（0.1.3・tasks #1361）
 * SWELL は先頭に「ホーム」（日本語トップ / へのリンク）を出す。翻訳ページでは隠し、
 * 次の項目＝言語ハブ（/en/ 等＝その言語のホーム）を先頭にする。
 * ★文字を CSS で書き換えない（content: で差し替えると読み上げと検索で食い違う）。 */
html[lang="en"] .p-breadcrumb__item:first-child,
html[lang="zh-Hant"] .p-breadcrumb__item:first-child,
html[lang="ko"] .p-breadcrumb__item:first-child {
	display: none !important;
}

/* 開示ラベル（全翻訳ページ末尾の固定文・設計書 §5-5） */
html[lang="en"] .gb-i18n-disclosure,
html[lang="zh-Hant"] .gb-i18n-disclosure,
html[lang="ko"] .gb-i18n-disclosure,
.gb-guides__disclosure {
	margin-top: 2.5em;
	padding: 1em 1.25em;
	border: 1px solid rgba(0, 0, 0, 0.12);
	border-radius: 4px;
	font-size: 0.85em;
	line-height: 1.8;
	color: #555;
}

/* ------------------------------------------------- 言語切替リンク（#1127・全言語）
 *
 * ★ここだけは日本語面にも出る。日本語記事に英語版が在るとき、
 *   英語圏の読者が「English」を押して移動できるようにするのが目的なので、
 *   日本語面に出さなければ意味が無い。
 * ★控えめに＝勝っている記事の本文の上に置くので、主張しない見た目にする。
 *   色も枠も足さず、文字サイズを落として右に寄せるだけ。
 */
.gb-i18n-switch {
	display: flex;
	flex-wrap: wrap;
	gap: 0.75em;
	justify-content: flex-end;
	margin: 0 0 1.5em;
	font-size: 0.85em;
	line-height: 1.6;
}

.gb-i18n-switch__link {
	color: inherit;
	opacity: 0.75;
	text-decoration: underline;
	text-underline-offset: 0.25em;
}

.gb-i18n-switch__link:hover,
.gb-i18n-switch__link:focus {
	opacity: 1;
}
