@charset "UTF-8";

/*!
 * 調査・法務用語集 専用スタイル
 * 202608 光武商事（調査法人ツミトル）／ 開発README §3・§4・§6
 *
 * 対象：第1層 /glossary/（.word-index）／第2層 /glossary/{row}-gyo/（.word-row）
 *       第3層 /glossary/{term-slug}/（.word-detail）
 * 読み込み：inc/word-query.php の tsumitoru_word_enqueue_assets()（用語集配下のみ・R-14）
 *
 * デザイン方向：A 信頼・誠実型
 *   - 既存B2Bサイトの色変数を参照し、用語集専用の新色を足さない
 *   - 影・グラデーション・ガラスモーフィズム・絵文字・欧文Webフォント追加は使わない
 *   - 区切りは「1px罫＋余白」。詳細ありの識別は「2pxアクセント罫＋バッジ＋ボタン」
 *
 * ---------------------------------------------------------------------------
 * JSと共有する状態クラス（正本＝assets/js/word.js の実コード）
 * ---------------------------------------------------------------------------
 * 2026-08-24 改定：CSSとJSを並行実装したため命名が7点ずれていた。
 * DOMの生成元であるJSを正本とし、本CSS側を合わせた（旧名は下部に併記）。
 *
 * PHPが出力済み（正本＝PHP）
 *   .kana-nav__item.is-current    現在の行（リンクにしない・aria-current="page"）
 *   .kana-nav__item.is-disabled   0語の行（aria-disabled="true"・pointer-events: none）
 *   .word-theme-filter__button.is-active  選択中のテーマチップ（aria-pressed="true"）
 *     ※ 初期値「すべて」はPHPが is-active 付きで出力し、以後はJSが付け替える
 *
 * JSが付け外しする（word.js の実コードで確認済み）
 *   .word-search.is-open              候補リストを開いている（root に付与）
 *   .word-search.is-empty             入力はあるが該当0件（root に付与）
 *                                     旧 .word-search__results.is-empty ＝誤り
 *   .word-search__result.is-selected  ↑↓で選択中の候補（aria-selected="true"）
 *   .word-list__item.is-hidden        テーマ絞り込みで非表示にした用語
 *   .word-list__group.is-hidden       絞り込みで全件消えた行グループ
 *   .row-jump__link.is-active         IntersectionObserverで検出した現在の音（aria-current="true"）
 *   .row-jump.is-stuck                sticky が効いている状態（下辺罫を強める）
 *   .word-entry.is-open               用語アコーディオンが開いている（2026-08-25）
 *   .word-term-tooltip.is-open             ツールチップ配置確定後に表示（hidden属性と併用）
 *
 * ルート要素に付くフラグ（PHPが wp_head で付ける・inc/word-query.php）
 *   html.word-js                      JSが動く環境。**これが無いと折りたたまない。**
 *                                     JS無効時に本文が読めなくなることを防ぐための土台で、
 *                                     word.js ではなく wp_head のインラインで付ける
 *                                     （フッタで付けるとちらつくため）
 *
 * JSが生成するマークアップのクラス（検索候補・ツールチップ／PHPには存在しない）
 *   li.word-search__result > a.word-search__link
 *     span.word-search__name / __kana / __row / __summary
 *     旧 .word-search__result-name / -kana / -row / -summary ＝誤り
 *   li.word-search__empty
 *     span.word-search__empty-text ／ a.word-search__empty-link
 *   div.word-term-tooltip
 *     p.word-term-tooltip__summary ／ a.word-term-tooltip__link
 *       span.word-term-tooltip__link-text ／ svg.word-term-tooltip__icon
 *
 * JSが生成しないため削除した旧セレクタ
 *   .word-search__result-badge  検索辞書に detail フラグはあるが renderHit() は
 *                               バッジを出さない。実装する際はJSを先に直し、
 *                               その命名（例 .word-search__badge）でCSSを足す
 *
 * Phase1では出力されないが仕様・CSSとも保持する（PM申し送り 2026-08-21）
 *   .word-search 一式／.word-theme-filter 一式
 *   .word-popular ／ .word-cta ／ .word-term-link ／ .word-term-tooltip
 *
 * 【2026-08-24】.row-jump 一式は保持から有効化に変わった（PM final.md 9-5-2）。
 * Phase1で閾値5,000字以上の行（さ行・た行）に出力される。
 *   .row-jump.is-hidden（R-13のSP収納）は word.js が付け外しする（実装済み・D-a1）。
 *
 * 【2026-08-25】用語エントリをアコーディオン化した（オーナー指示・視認性向上）。
 * 追加したのは §11 の .word-row__controls 一式と、§15 の .word-entry__toggle /
 * .word-entry__panel 一式。あわせて §15 の .word-entry__body に h4 / ul / ol / li の
 * 定義を足した（それまで p 以外が未定義で、ブラウザ既定のまま出ていた）。
 *
 * ---------------------------------------------------------------------------
 * 【2026-08-26】既存テーマ（tsumitoru）への再スキン — DESIGN.md §4 に従う
 * ---------------------------------------------------------------------------
 * 上の「既存B2Bサイトの色変数を参照し」以下の記述は、既存テーマを見ないまま
 * 書かれたものである（記録として残す）。実測の結果、前提が次のとおり外れていた。
 *
 *   誤：濃紺 #082451 ／ ブルー #1b74be ／ ライトブルー #72bcff
 *   正：深緑 --color-theme: #2B635E ／ ゴールド --color-brown: #C4A666
 *
 *   誤：--color-primary / --color-secondary / --color-accent / --color-text /
 *       --color-text-sub / --color-border を var() で参照
 *   正：この6変数は既存テーマに存在しない。var() が常にフォールバック（紺）に
 *       落ちていたため、プレビューは100%紺で描画されていた。実変数のみ参照する。
 *
 * 命名の規約（将来の保守者へ・DESIGN.md §3-2）
 *   本テーマの規約は「`m-` は複数ページ共用モジュール、素の名前はページ固有ブロック」
 *   である。用語集はページ固有ブロックなので `word-*` の素の名前で書いている。
 *   `m-` を付けないことこそが既存テーマの規約に一致する。
 *
 * 既存テーマの実測に合わせた主な値（DESIGN.md §1）
 *   本文 16px / line-height 1.6 / font-weight 500（body の 300 を打ち消す）
 *   見出し H1 30px・H2 24px・H3 20px、行高はすべて 1.6
 *   セクション間 PC 80px ／ SP 60px、左右ガター PC/SP とも 20px
 *   本文カラム 620px ／ 広幅 1200px（.container）
 *   BP 768px（主）／ 1000px（ヘッダー切替）／ 900・500px（カードグリッド）
 *   ヘッダー高 70px（>=1001px）／ 60px（<=1000px）
 *   SPの vw フォント可変（calc(N*100vw/750)）は既存テーマに無い挙動のため撤去した
 */

/* ===========================================================================
   1. トークン
   =========================================================================== */

:root {
  /* 既存テーマ（tsumitoru/css/style.css:4-18）の変数を第一参照にする。
     存在しない変数を var() で参照しないこと（フォールバックに落ちて色が別物になる） */
  --word-primary-rgb: 43, 99, 94;
  --word-color-primary: var(--color-theme, #2B635E);
  --word-color-secondary: var(--color-theme, #2B635E);
  --word-color-accent: var(--color-brown, #C4A666);
  --word-color-text: #323232;
  --word-color-text-sub: rgba(var(--word-primary-rgb), 0.78);
  --word-color-bg: var(--color-white, #ffffff);
  --word-color-bg-subtle: rgba(var(--word-primary-rgb), 0.035);
  --word-color-bg-tint: rgba(var(--word-primary-rgb), 0.06);
  --word-color-border: rgba(var(--word-primary-rgb), 0.16);
  --word-color-border-strong: rgba(var(--word-primary-rgb), 0.32);
  --word-color-muted: rgba(var(--word-primary-rgb), 0.55);
  --word-color-disabled: rgba(var(--word-primary-rgb), 0.34);
  --word-color-on-primary: var(--color-white, #ffffff);

  /* 余白（既存テーマ実測：セクション間＝記事本文H2の上マージン PC 80px／SP 60px） */
  --word-space-3xs: 4px;
  --word-space-2xs: 8px;
  --word-space-xs: 12px;
  --word-space-sm: 16px;
  --word-space-md: 24px;
  --word-space-lg: 32px;
  --word-space-xl: 40px;
  --word-section-gap: 80px;
  --word-gutter: 20px;

  /* 幅（既存テーマ実測：.single-article__container 620px ／ .container 1200px） */
  --word-content-width: 620px;
  --word-wide-width: 1200px;

  /* フォントサイズ（既存テーマ実測。SPでは変えない＝vw可変は使わない） */
  --word-fs-xs: 12px;
  --word-fs-sm: 14px;
  --word-fs-body: 16px;
  --word-fs-lg: 18px;
  --word-fs-definition: 16px;
  --word-fs-h3: 20px;
  --word-fs-h2: 24px;
  --word-fs-h1: 30px;
  --word-fs-kana: 40px;

  --word-lh-tight: 1.6;
  --word-lh-base: 1.6;

  --word-radius: 4px;
  --word-radius-pill: 999px;

  /* sticky・アンカーのオフセット（既存ヘッダー高 70px／60px を正本にする） */
  --word-sticky-top: 70px;
  --word-sticky-height: 56px;
  --word-anchor-offset: 86px;
  --word-anchor-offset-sticky: 142px;

  --word-transition: 160ms ease;
}

/* ヘッダーが切り替わる幅。フォントサイズはここで変えない */
@media screen and (max-width: 1000px) {

  :root {
    --word-sticky-top: 60px;
    --word-anchor-offset: 76px;
    --word-anchor-offset-sticky: 124px;
  }

}

/* レイアウトのSP分岐。実テーマの主ブレークポイント */
@media screen and (max-width: 768px) {

  :root {
    --word-section-gap: 60px;
    --word-sticky-height: 48px;
    --word-fs-kana: 32px;
  }

}

/* ===========================================================================
   2. ページ共通レイアウト
        既存テーマのラッパー階層（DESIGN.md §5）に載せる。
        第1・2層  main.word-index / main.word-row
                    > article.page.word-glossary
                      > .page-default-content
                        > .page-content__container.container（1200px）
                          > .page-content__body
        第3層      main.word-detail
                    > article.single.single-post.word-detail__article
                      > .single-default-content
                        > .single-content__container.container（1200px）
                          > .single-article__container（620px）
   =========================================================================== */

/* body { font-weight: 300 } を打ち消す。既存テーマも記事本文で
   .single-content__body p { font-weight: var(--weight-medium) } と明示している
   （tsumitoru/css/style.css:1511）。用語集は用語集ルートで一括して打ち消す */

.word-index,
.word-row,
.word-detail {
  color: var(--word-color-text);
  font-size: var(--word-fs-body);
  font-weight: var(--weight-medium, 500);
  line-height: var(--word-lh-base);
}

/* .page-default-content は左右パディングを持たない（tsumitoru/css/style.css:1323-1325）。
   .post-chiepita と同じ作法で用語集側から 20px を足す */

.word-glossary .page-default-content {
  padding-right: var(--word-gutter);
  padding-left: var(--word-gutter);
}

/* 本文カラムは記事詳細と同じ 620px */

.word-index .page-content__body > *,
.word-row .page-content__body > * {
  max-width: var(--word-content-width);
  margin-right: auto;
  margin-left: auto;
}

.word-index .page-content__body > * + *,
.word-row .page-content__body > * + * {
  margin-top: var(--word-section-gap);
}

/* カードグリッドと行タイルだけ .container と同じ 1200px で使う */

.word-index .page-content__body > .word-list,
.word-index .page-content__body > .kana-nav--tile {
  max-width: var(--word-wide-width);
}

/* sticky バーは container の左右端までベタで敷く（親の 20px を打ち消す） */

.word-row .page-content__body > .row-jump {
  max-width: none;
  margin-right: calc(var(--word-gutter) * -1);
  margin-left: calc(var(--word-gutter) * -1);
}

/* 第3層は既存の .single-article__container（620px）に載るため幅を持たない。
   関連ブロックは 620px の外・.container（1200px）の中に置かれる（DESIGN.md §5-4） */

.word-detail .word-detail__header {
  margin-top: var(--word-space-md);
}

.word-detail .word-detail__definition,
.word-detail .word-detail__toc,
.word-detail .word-detail__body,
.word-detail .word-detail__nav,
.word-detail .word-supervisor,
.word-detail .word-disclaimer,
.word-detail .word-related-terms--detail,
.word-detail .word-related-columns,
.word-detail .word-service-cta,
.word-detail .word-cta {
  margin-top: var(--word-section-gap);
}

.word-index h1,
.word-index h2,
.word-index h3,
.word-row h1,
.word-row h2,
.word-row h3,
.word-detail h1,
.word-detail h2,
.word-detail h3 {
  line-height: var(--word-lh-tight);
}

/* ===========================================================================
   3. パンくず
        【2026-08-26】用語集側の .breadcrumb / .breadcrumb__* 定義（約57行）は削除した。
        既存テーマの .page-default-breadcrumb / .breadcrumb（tsumitoru/css/style.css:1305-1331）
        に一本化する。word.css × style.css で唯一の実クラス衝突だったため
        （DESIGN.md §3-3 変更点1）。マークアップ側は担当Aが既存と同一構造に揃える。
   =========================================================================== */

/* ===========================================================================
   4. 第1層ヒーロー word-index
   =========================================================================== */

.word-index__hero {
  padding-bottom: var(--word-space-lg);
  border-bottom: 1px solid var(--word-color-border);
}

.word-index__title {
  margin: 0;
  color: var(--word-color-primary);
  font-size: var(--word-fs-h1);
  font-weight: 700;
}

.word-index__lead {
  margin: var(--word-space-sm) 0 0;
  max-width: 40em;
  color: var(--word-color-text);
}

.word-index__meta {
  display: flex;
  flex-wrap: wrap;
  gap: var(--word-space-xs) var(--word-space-lg);
  margin: var(--word-space-md) 0 0;
}

.word-index__meta-item {
  display: flex;
  align-items: baseline;
  gap: var(--word-space-2xs);
}

.word-index__meta-label {
  color: var(--word-color-muted);
  font-size: var(--word-fs-xs);
  font-weight: var(--weight-medium, 500);
}

.word-index__count,
.word-index__updated {
  margin: 0;
  color: var(--word-color-primary);
  font-size: var(--word-fs-sm);
  font-weight: 700;
}

.word-index__credentials {
  margin: var(--word-space-xs) 0 0;
  color: var(--word-color-muted);
  font-size: var(--word-fs-xs);
}

/* ===========================================================================
   5. 用語検索 word-search（Phase1では出力されない・§4-4）
   =========================================================================== */

.word-search {
  position: relative;
}

.word-search__field {
  display: flex;
  align-items: center;
  gap: var(--word-space-2xs);
  padding: var(--word-space-2xs) var(--word-space-xs);
  border: 1px solid var(--word-color-border-strong);
  border-radius: var(--word-radius);
  background: var(--word-color-bg);
}

.word-search.is-open .word-search__field {
  border-bottom-right-radius: 0;
  border-bottom-left-radius: 0;
}

.word-search__label {
  flex: 0 0 auto;
  color: var(--word-color-muted);
  font-size: var(--word-fs-xs);
  white-space: nowrap;
}

.word-search__input {
  flex: 1 1 auto;
  min-width: 0;
  padding: var(--word-space-2xs) 0;
  border: 0;
  background: transparent;
  color: var(--word-color-text);
  font-family: inherit;
  font-size: var(--word-fs-body);
  line-height: var(--word-lh-tight);
  appearance: none;
}

.word-search__input:focus {
  outline: none;
}

.word-search__field:focus-within {
  border-color: var(--word-color-secondary);
  outline: 2px solid var(--word-color-secondary);
  outline-offset: 1px;
}

.word-search__clear {
  display: inline-flex;
  align-items: center;
  gap: var(--word-space-3xs);
  flex: 0 0 auto;
  padding: var(--word-space-3xs) var(--word-space-2xs);
  border: 1px solid var(--word-color-border);
  border-radius: var(--word-radius);
  background: transparent;
  color: var(--word-color-muted);
  font-family: inherit;
  font-size: var(--word-fs-xs);
  line-height: 1;
  cursor: pointer;
}

.word-search__clear[hidden] {
  display: none;
}

.word-search__clear:hover {
  border-color: var(--word-color-border-strong);
  color: var(--word-color-primary);
}

.word-search__clear-text {
  display: inline;
}

.word-search__clear-icon {
  display: block;
  flex: 0 0 auto;
}

.word-search__count {
  margin: var(--word-space-2xs) 0 0;
  min-height: 1.4em;
  color: var(--word-color-muted);
  font-size: var(--word-fs-xs);
  line-height: var(--word-lh-tight);
}

.word-search__results {
  position: absolute;
  z-index: 30;
  right: 0;
  left: 0;
  max-height: 60vh;
  margin: 0;
  padding: 0;
  overflow-y: auto;
  border: 1px solid var(--word-color-border-strong);
  border-top: 0;
  border-radius: 0 0 var(--word-radius) var(--word-radius);
  background: var(--word-color-bg);
  list-style: none;
}

.word-search__results[hidden] {
  display: none;
}

.word-search__result {
  border-top: 1px solid var(--word-color-border);
}

.word-search__result:first-child {
  border-top: 0;
}

.word-search__link {
  display: block;
  padding: var(--word-space-xs) var(--word-space-sm);
  color: inherit;
  text-decoration: none;
}

.word-search__result:hover,
.word-search__result.is-selected {
  background: var(--word-color-bg-tint);
}

.word-search__name {
  display: inline;
  color: var(--word-color-primary);
  font-size: var(--word-fs-body);
  font-weight: 700;
}

.word-search__kana {
  display: inline;
  margin-left: var(--word-space-2xs);
  color: var(--word-color-muted);
  font-size: var(--word-fs-xs);
}

.word-search__row {
  display: inline-block;
  margin-left: var(--word-space-2xs);
  padding: var(--word-space-3xs) var(--word-space-xs);
  border: 1px solid var(--word-color-border);
  border-radius: var(--word-radius);
  color: var(--word-color-muted);
  font-size: var(--word-fs-xs);
  line-height: var(--word-lh-base);
}

.word-search__summary {
  display: block;
  margin-top: var(--word-space-3xs);
  color: var(--word-color-text-sub);
  font-size: var(--word-fs-sm);
  line-height: var(--word-lh-base);
}

.word-search__empty {
  padding: var(--word-space-sm);
  color: var(--word-color-muted);
  font-size: var(--word-fs-sm);
}

.word-search__empty-text {
  display: block;
  color: var(--word-color-text-sub);
  line-height: var(--word-lh-base);
}

.word-search__empty-link {
  display: inline-block;
  margin-top: var(--word-space-2xs);
  color: var(--word-color-secondary);
  font-size: var(--word-fs-xs);
  text-decoration: none;
}

.word-search__empty-link:hover {
  text-decoration: underline;
}

/* 0件のときは候補パネルの罫を弱め、当たりのある候補一覧と見分けられるようにする */
.word-search.is-empty .word-search__results {
  border-color: var(--word-color-border);
}

/* ===========================================================================
   6. 行ナビ kana-nav（--tile ＝ 第1層タイル／--row ＝ 第2層テキストリンク列）
   =========================================================================== */

.kana-nav__title {
  margin: 0 0 var(--word-space-sm);
  color: var(--word-color-primary);
  font-size: var(--word-fs-h2);
  font-weight: 700;
}

.kana-nav__list {
  margin: 0;
  padding: 0;
  list-style: none;
}

.kana-nav__link {
  display: block;
  color: inherit;
  text-decoration: none;
}

/* --- タイル型（第1層） --- */

.kana-nav--tile .kana-nav__list {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
  gap: var(--word-space-sm);
}

.kana-nav--tile .kana-nav__item {
  display: flex;
}

.kana-nav--tile .kana-nav__link {
  display: flex;
  flex-direction: column;
  gap: var(--word-space-3xs);
  width: 100%;
  padding: var(--word-space-sm) var(--word-gutter);
  border: 1px solid var(--word-color-primary);
  border-radius: var(--word-radius);
  background: var(--word-color-bg);
  transition: background-color var(--word-transition);
}

.kana-nav--tile a.kana-nav__link:hover {
  background: var(--word-color-bg-tint);
}

.kana-nav--tile .kana-nav__label {
  color: var(--word-color-primary);
  font-size: var(--word-fs-h3);
  font-weight: 700;
  line-height: var(--word-lh-tight);
}

.kana-nav--tile .kana-nav__count {
  color: var(--word-color-muted);
  font-size: var(--word-fs-xs);
}

.kana-nav--tile .kana-nav__samples {
  margin-top: var(--word-space-3xs);
  padding-top: var(--word-space-2xs);
  border-top: 1px solid var(--word-color-border);
  color: var(--word-color-text-sub);
  font-size: var(--word-fs-xs);
  line-height: var(--word-lh-base);
}

.kana-nav--tile .kana-nav__item.is-disabled .kana-nav__link {
  border-style: dashed;
  background: var(--word-color-bg-subtle);
  pointer-events: none;
}

.kana-nav--tile .kana-nav__item.is-disabled .kana-nav__label,
.kana-nav--tile .kana-nav__item.is-disabled .kana-nav__count {
  color: var(--word-color-disabled);
}

.kana-nav--tile .kana-nav__item.is-current .kana-nav__link {
  border-color: var(--word-color-primary);
  border-width: 2px;
}

/* --- テキストリンク型（第2層） --- */

.kana-nav--row .kana-nav__list {
  display: flex;
  flex-wrap: wrap;
  gap: var(--word-space-2xs) var(--word-space-sm);
  padding-top: var(--word-space-xs);
  padding-bottom: var(--word-space-xs);
  border-top: 1px solid var(--word-color-border);
  border-bottom: 1px solid var(--word-color-border);
}

.kana-nav--row .kana-nav__link {
  display: inline-flex;
  align-items: baseline;
  gap: var(--word-space-3xs);
  color: var(--word-color-secondary);
  font-size: var(--word-fs-sm);
}

.kana-nav--row a.kana-nav__link:hover {
  text-decoration: underline;
}

.kana-nav--row .kana-nav__count {
  color: var(--word-color-muted);
  font-size: var(--word-fs-xs);
}

.kana-nav--row .kana-nav__item.is-current .kana-nav__link {
  color: var(--word-color-primary);
  font-weight: 700;
  text-decoration: underline;
  text-underline-offset: 4px;
}

.kana-nav--row .kana-nav__item.is-disabled .kana-nav__link {
  color: var(--word-color-disabled);
  pointer-events: none;
}

.kana-nav--row .kana-nav__item.is-disabled .kana-nav__count {
  color: var(--word-color-disabled);
}

@media screen and (max-width: 768px) {

  .kana-nav--tile .kana-nav__list {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

}

/* ===========================================================================
   7. テーマ絞り込み word-theme-filter（Phase1では出力されない）
   =========================================================================== */

.word-theme-filter__title {
  margin: 0 0 var(--word-space-sm);
  color: var(--word-color-primary);
  font-size: var(--word-fs-h2);
  font-weight: 700;
}

.word-theme-filter__list {
  display: flex;
  flex-wrap: wrap;
  gap: var(--word-space-2xs);
  margin: 0;
  padding: 0;
  list-style: none;
}

.word-theme-filter__item {
  display: flex;
}

/* 既存テーマの .archive-columns__category-list__item（tsumitoru/css/style.css:1352-1365）
   と同じ意匠：padding 8px 20px ／ 1px 緑罫 ／ radius 4px ／ .is-active で緑ベタ反転 */

.word-theme-filter__button {
  padding: var(--word-space-2xs) var(--word-gutter);
  border: 1px solid var(--word-color-primary);
  border-radius: var(--word-radius);
  background: var(--word-color-bg);
  color: var(--word-color-primary);
  font-family: inherit;
  font-size: var(--word-fs-sm);
  font-weight: var(--weight-medium, 500);
  line-height: var(--word-lh-base);
  cursor: pointer;
  transition: background-color var(--word-transition), color var(--word-transition);
}

.word-theme-filter__button:hover {
  background: var(--word-color-bg-tint);
}

.word-theme-filter__button.is-active {
  border-color: var(--word-color-primary);
  background: var(--word-color-primary);
  color: var(--word-color-on-primary);
  font-weight: 700;
}

/* ===========================================================================
   8. 全用語一覧 word-list ／ 用語カード word-card
   =========================================================================== */

.word-list__title {
  margin: 0 0 var(--word-space-md);
  color: var(--word-color-primary);
  font-size: var(--word-fs-h2);
  font-weight: 700;
}

.word-list__group + .word-list__group {
  margin-top: var(--word-space-xl);
}

.word-list__group.is-hidden {
  display: none;
}

.word-list__group-head {
  display: flex;
  align-items: baseline;
  gap: var(--word-space-xs);
  padding-bottom: var(--word-space-2xs);
  border-bottom: 1px solid var(--word-color-border);
}

.word-list__group-title {
  margin: 0;
  color: var(--word-color-primary);
  font-size: var(--word-fs-h3);
  font-weight: 700;
}

.word-list__group-title a {
  color: inherit;
  text-decoration: none;
}

.word-list__group-title a:hover {
  color: var(--word-color-secondary);
  text-decoration: underline;
}

.word-list__group-count {
  margin: 0;
  color: var(--word-color-muted);
  font-size: var(--word-fs-xs);
}

/* 既存テーマの .archive-columns__article-list（tsumitoru/css/style.css:1367-1370）と
   完全に同じ挙動：3列 → 900px で2列 → 500px で1列・gap 40px */

.word-list__items {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: var(--word-space-xl);
  margin: var(--word-space-md) 0 0;
  padding: 0;
  list-style: none;
}

@media screen and (max-width: 900px) {

  .word-list__items {
    grid-template-columns: repeat(2, 1fr);
  }

}

@media screen and (max-width: 500px) {

  .word-list__items {
    grid-template-columns: repeat(1, 1fr);
  }

}

.word-list__item {
  display: flex;
}

.word-list__item.is-hidden {
  display: none;
}

/* 既存テーマのカード質感（tsumitoru/css/style.css:1372-1387）：
   白面＋box-shadow 0 5px 20px rgba(0,0,0,.10)・罫なし・内側 20px */

.word-card {
  display: flex;
  flex-direction: column;
  gap: var(--word-space-3xs);
  width: 100%;
  min-width: 0;
  padding: var(--word-gutter);
  background: var(--word-color-bg);
  box-shadow: 0 5px 20px 0 rgba(0, 0, 0, 0.1);
  color: inherit;
  text-decoration: none;
  transition: box-shadow var(--word-transition);
}

.word-card:hover {
  box-shadow: 0 5px 20px 0 rgba(0, 0, 0, 0.2);
}

.word-card__category {
  align-self: flex-start;
  padding: var(--word-space-3xs) var(--word-space-xs);
  border: 1px solid var(--word-color-primary);
  border-radius: var(--word-radius);
  color: var(--word-color-primary);
  font-size: var(--word-fs-xs);
  font-weight: var(--weight-medium, 500);
  line-height: var(--word-lh-base);
}

.word-card__title {
  display: block;
  color: var(--word-color-primary);
  font-size: var(--word-fs-lg);
  font-weight: 700;
  line-height: var(--word-lh-tight);
}

.word-card__badge {
  display: inline-block;
  margin-left: var(--word-space-2xs);
  padding: 0 var(--word-space-2xs);
  border: 1px solid var(--word-color-accent);
  border-radius: var(--word-radius);
  color: var(--word-color-primary);
  font-size: var(--word-fs-xs);
  font-weight: var(--weight-medium, 500);
  line-height: var(--word-lh-base);
  vertical-align: middle;
}

.word-card__reading {
  display: block;
  color: var(--word-color-muted);
  font-size: var(--word-fs-xs);
}

.word-card__summary {
  display: -webkit-box;
  margin-top: var(--word-space-3xs);
  overflow: hidden;
  color: var(--word-color-text-sub);
  font-size: var(--word-fs-sm);
  line-height: var(--word-lh-base);
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  line-clamp: 2;
}

.word-card--compact {
  gap: 0;
  padding: var(--word-space-xs) var(--word-space-sm);
}

.word-card--compact .word-card__title {
  font-size: var(--word-fs-body);
}

.word-card--compact:hover {
  transform: none;
}

/* ===========================================================================
   9. よく見られている用語 word-popular（Phase1では出力されない）
   =========================================================================== */

.word-popular {
  padding: var(--word-space-md);
  border: 1px solid var(--word-color-border);
  border-radius: var(--word-radius);
  background: var(--word-color-bg-subtle);
}

.word-popular__title {
  margin: 0 0 var(--word-space-xs);
  color: var(--word-color-primary);
  font-size: var(--word-fs-h3);
  font-weight: 700;
}

.word-popular__list {
  display: flex;
  flex-wrap: wrap;
  gap: var(--word-space-2xs) var(--word-space-sm);
  margin: 0;
  padding: 0;
  list-style: none;
}

.word-popular__item a {
  color: var(--word-color-secondary);
  font-size: var(--word-fs-sm);
  text-decoration: none;
}

.word-popular__item a:hover {
  text-decoration: underline;
}

/* ===========================================================================
   10. 相談導線 word-cta（Phase1では出力されない）
        旧記述「c-btn は既存テーマ側の定義」は誤り。既存テーマに .c-btn は存在しない
        （2026-08-26 実測・DESIGN.md §2-3）。ボタンは下で自前定義する
   =========================================================================== */

.word-cta {
  padding: var(--word-space-lg) var(--word-space-md);
  border: 1px solid var(--word-color-border-strong);
  border-radius: var(--word-radius);
  background: var(--word-color-bg-subtle);
  text-align: left;
}

.word-cta__title {
  margin: 0;
  color: var(--word-color-primary);
  font-size: var(--word-fs-h3);
  font-weight: 700;
}

.word-cta__text {
  margin: var(--word-space-xs) 0 0;
  color: var(--word-color-text);
  font-size: var(--word-fs-sm);
}

.word-cta__button {
  margin: var(--word-space-md) 0 0;
}

/* 既存テーマにボタンの共通定義（.c-btn）は存在しない（DESIGN.md §2-3）。
   .single-page-nav__prev a（tsumitoru/css/style.css:1646-1658）に実測で揃える */

.word-cta__button a {
  display: inline-flex;
  align-items: center;
  gap: var(--word-space-sm);
  padding: var(--word-space-sm) 30px;
  border-radius: 8px;
  background-color: var(--word-color-primary);
  color: var(--word-color-on-primary);
  font-size: var(--word-fs-body);
  font-weight: var(--weight-medium, 500);
  text-decoration: none;
  transition: opacity var(--word-transition);
}

.word-cta__button a:hover {
  opacity: 0.7;
}

.word-cta__note {
  margin: var(--word-space-2xs) 0 0;
  color: var(--word-color-muted);
  font-size: var(--word-fs-xs);
}

@media screen and (max-width: 768px) {

  .word-cta {
    padding: var(--word-space-md) var(--word-space-sm);
  }

}

/* ===========================================================================
   11. 第2層ヒーロー・空表示・行ナビ word-row
   =========================================================================== */

.word-row__hero {
  padding-bottom: var(--word-space-md);
  border-bottom: 1px solid var(--word-color-border);
}

.word-row__title {
  margin: 0;
  color: var(--word-color-primary);
  font-size: var(--word-fs-h1);
  font-weight: 700;
}

.word-row__desc {
  margin: var(--word-space-sm) 0 0;
  max-width: 40em;
}

.word-row__count {
  margin: var(--word-space-xs) 0 0;
  color: var(--word-color-primary);
  font-size: var(--word-fs-sm);
  font-weight: 700;
}

.word-row__credentials {
  margin: var(--word-space-3xs) 0 0;
  color: var(--word-color-muted);
  font-size: var(--word-fs-xs);
}

.word-row__empty {
  padding: var(--word-space-lg) var(--word-space-md);
  border: 1px solid var(--word-color-border);
  border-radius: var(--word-radius);
  background: var(--word-color-bg-subtle);
}

.word-row__empty-text {
  margin: 0;
  color: var(--word-color-text);
}

.word-row__empty-link {
  margin: var(--word-space-xs) 0 0;
}

.word-row__empty-link a {
  color: var(--word-color-secondary);
}

.word-row__groups {
  display: block;
}

/* 既存テーマの .single-page-nav（tsumitoru/css/style.css:1638-1658）に揃える：
   上1px罫＋padding-top 40px、リンクは緑ベタ・白文字・radius 8px・padding 16px 30px */

.word-row__nav {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: var(--word-gutter);
  padding-top: var(--word-space-xl);
  border-top: 1px solid var(--word-color-border-strong);
}

.word-row__nav a {
  display: inline-flex;
  align-items: center;
  gap: var(--word-space-sm);
  padding: var(--word-space-sm) 30px;
  border-radius: 8px;
  background-color: var(--word-color-primary);
  color: var(--word-color-on-primary);
  font-size: var(--word-fs-body);
  font-weight: var(--weight-medium, 500);
  text-decoration: none;
  transition: opacity var(--word-transition);
}

.word-row__nav a:hover {
  opacity: 0.7;
}

.word-row__nav-prev,
.word-row__nav-index,
.word-row__nav-next {
  margin: 0;
}

.word-row__nav-text {
  display: inline;
}

.word-row__nav-icon {
  display: block;
  flex: 0 0 auto;
}

@media screen and (max-width: 768px) {

  .word-row__nav {
    flex-direction: column;
    align-items: flex-start;
  }

  .word-row__empty {
    padding: var(--word-space-md) var(--word-space-sm);
  }

}

/* --- 用語アコーディオンの一括開閉（2026-08-25） -----------------------------
   `html.word-js` が付く＝JSが動く環境でだけ出す。JS無効時は全項目が開いており、
   この操作子は意味を持たないため出さない。 */

.word-row__controls {
  display: none;
}

.word-js .word-row__controls {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--word-space-2xs) var(--word-space-md);
  margin-bottom: var(--word-space-lg);
  padding-bottom: var(--word-space-xs);
  border-bottom: 1px solid var(--word-color-border);
}

.word-row__expand {
  display: inline-flex;
  align-items: center;
  gap: var(--word-space-2xs);
  padding: var(--word-space-2xs) var(--word-space-sm);
  border: 1px solid var(--word-color-border-strong);
  border-radius: var(--word-radius);
  background: var(--word-color-bg);
  color: var(--word-color-primary);
  font-family: inherit;
  font-size: var(--word-fs-sm);
  line-height: var(--word-lh-tight);
  cursor: pointer;
  transition: background-color var(--word-transition);
}

.word-row__expand:hover {
  background: var(--word-color-bg-tint);
}

.word-row__expand-icon {
  display: block;
  flex: 0 0 auto;
  transition: transform var(--word-transition);
}

.word-row__expand[aria-expanded="true"] .word-row__expand-icon {
  transform: rotate(180deg);
}

.word-row__controls-note {
  margin: 0;
  color: var(--word-color-muted);
  font-size: var(--word-fs-xs);
  line-height: var(--word-lh-tight);
}

/* ===========================================================================
   12. sticky 行内ナビ row-jump
        Phase1で有効（PM final.md 9-5-2・2026-08-24。旧：PM判断(c)で出力しない）。
        出るのは行本文量が閾値5,000字以上の行だけ。CSSは2026-08-21から変更していない。
   =========================================================================== */

.row-jump {
  position: sticky;
  top: var(--word-sticky-top);
  z-index: 20;
  display: flex;
  align-items: center;
  gap: var(--word-space-sm);
  min-height: var(--word-sticky-height);
  max-width: none;
  padding-right: var(--word-gutter);
  padding-left: var(--word-gutter);
  border-bottom: 1px solid var(--word-color-border);
  background: var(--word-color-bg);
  transition: transform var(--word-transition), border-color var(--word-transition);
}

.row-jump.is-stuck {
  border-bottom-color: var(--word-color-border-strong);
}

.row-jump__list {
  display: flex;
  flex: 1 1 auto;
  gap: var(--word-space-2xs);
  margin: 0;
  padding: var(--word-space-2xs) 0;
  overflow-x: auto;
  list-style: none;
  scrollbar-width: thin;
}

.row-jump__item {
  flex: 0 0 auto;
}

.row-jump__link {
  display: inline-block;
  min-width: 2.75em;
  padding: var(--word-space-3xs) var(--word-space-xs);
  border: 1px solid var(--word-color-border-strong);
  border-radius: var(--word-radius);
  background: var(--word-color-bg);
  color: var(--word-color-primary);
  font-size: var(--word-fs-sm);
  font-weight: var(--weight-medium, 500);
  line-height: var(--word-lh-base);
  text-align: center;
  text-decoration: none;
  transition: background-color var(--word-transition), color var(--word-transition);
}

.row-jump__link:hover {
  background: var(--word-color-bg-tint);
}

.row-jump__link.is-active {
  border-color: var(--word-color-primary);
  background: var(--word-color-primary);
  color: var(--word-color-on-primary);
  font-weight: 700;
}

.row-jump__top {
  display: inline-flex;
  align-items: center;
  gap: var(--word-space-3xs);
  flex: 0 0 auto;
  color: var(--word-color-secondary);
  font-size: var(--word-fs-xs);
  text-decoration: none;
  white-space: nowrap;
}

.row-jump__top:hover {
  text-decoration: underline;
}

.row-jump__top-text {
  display: inline;
}

.row-jump__top-icon {
  display: block;
  flex: 0 0 auto;
}

@media screen and (max-width: 768px) {

  .row-jump__top {
    display: none;
  }

  /* R-13：下方向スクロール中の一時収納。word.js が .is-hidden を付け外しする。 */
  .row-jump.is-hidden {
    transform: translateY(calc(-100% - var(--word-sticky-top)));
  }

}

/* ===========================================================================
   13. この行の用語一覧 row-toc
   =========================================================================== */

.row-toc {
  padding: var(--word-space-md);
  border: 1px solid var(--word-color-border);
  border-radius: var(--word-radius);
  background: var(--word-color-bg-subtle);
}

.row-toc__title {
  margin: 0 0 var(--word-space-xs);
  color: var(--word-color-primary);
  font-size: var(--word-fs-h3);
  font-weight: 700;
}

.row-toc__group + .row-toc__group {
  margin-top: var(--word-space-xs);
  padding-top: var(--word-space-xs);
  border-top: 1px solid var(--word-color-border);
}

.row-toc__group-label {
  margin: 0 0 var(--word-space-3xs);
  font-size: var(--word-fs-sm);
  font-weight: 700;
}

.row-toc__group-label a {
  color: var(--word-color-primary);
  text-decoration: none;
}

.row-toc__group-label a:hover {
  text-decoration: underline;
}

.row-toc__list {
  display: flex;
  flex-wrap: wrap;
  gap: var(--word-space-3xs) var(--word-space-sm);
  margin: 0;
  padding: 0;
  list-style: none;
}

.row-toc__item {
  font-size: var(--word-fs-sm);
}

.row-toc__link {
  color: var(--word-color-secondary);
  text-decoration: none;
}

.row-toc__link:hover {
  text-decoration: underline;
}

/* ===========================================================================
   14. 音グループ word-group
   =========================================================================== */

/* 既存テーマが html { scroll-padding-top: 70px } を持つ（tsumitoru/css/style.css:86）。
   scroll-margin-top はそこへ上乗せされるため、そのまま 86px を書くと二重に効いて
   156px 下げてしまう。差分だけを持たせ、合計が --word-anchor-offset になるようにする。
   （--word-sticky-top はヘッダー高＝70/60px。PCでは 86-70=16px の余白が残る） */

.word-group {
  scroll-margin-top: calc(var(--word-anchor-offset) - var(--word-sticky-top));
}

/* row-jump を出す行ページだけアンカーオフセットを sticky バー分だけ深くする */
.word-row:has(.row-jump) .word-group,
.word-row:has(.row-jump) .word-entry {
  scroll-margin-top: calc(var(--word-anchor-offset-sticky) - var(--word-sticky-top));
}

.word-row__groups > .word-group + .word-group {
  margin-top: var(--word-section-gap);
}

/* 既存テーマの .single-content__body h2（padding-bottom 20px＋緑2px下罫）に揃える */

.word-group__head {
  display: flex;
  align-items: baseline;
  gap: var(--word-space-xs);
  padding-bottom: var(--word-gutter);
  border-bottom: 2px solid var(--word-color-primary);
}

.word-group__kana {
  margin: 0;
  color: var(--word-color-primary);
  font-size: var(--word-fs-kana);
  font-weight: 700;
  line-height: var(--word-lh-tight);
}

.word-group__count {
  margin: 0;
  color: var(--word-color-muted);
  font-size: var(--word-fs-xs);
}

.word-group__back {
  margin: var(--word-space-md) 0 0;
  text-align: right;
}

.word-group__back a {
  color: var(--word-color-secondary);
  font-size: var(--word-fs-xs);
  text-decoration: none;
}

.word-group__back a:hover {
  text-decoration: underline;
}

/* ===========================================================================
   15. 用語エントリ word-entry
        囲み枠は作らない（35個並ぶと視覚ノイズになる・§4-5）。区切りは1px罫＋32px余白。
   =========================================================================== */

.word-entry {
  margin-top: var(--word-space-lg);
  scroll-margin-top: calc(var(--word-anchor-offset) - var(--word-sticky-top));
}

.word-entry + .word-entry {
  padding-top: var(--word-space-lg);
  border-top: 1px solid var(--word-color-border);
}

.word-entry--detailed {
  border-left: 2px solid var(--word-color-accent);
  padding-left: var(--word-space-sm);
}

.word-entry__head {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: var(--word-space-2xs);
}

.word-entry__title {
  margin: 0;
  color: var(--word-color-primary);
  font-size: var(--word-fs-h3);
  font-weight: 700;
}

.word-entry__title a {
  color: var(--word-color-secondary);
  text-decoration: none;
}

.word-entry__title a:hover {
  text-decoration: underline;
  text-underline-offset: 3px;
}

.word-entry__badge {
  display: inline-block;
  padding: 0 var(--word-space-2xs);
  border: 1px solid var(--word-color-accent);
  border-radius: var(--word-radius);
  color: var(--word-color-primary);
  font-size: var(--word-fs-xs);
  font-weight: var(--weight-medium, 500);
  line-height: var(--word-lh-base);
}

.word-entry__meta {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: var(--word-space-3xs) var(--word-space-xs);
  margin: var(--word-space-2xs) 0 0;
  color: var(--word-color-muted);
  font-size: var(--word-fs-xs);
  line-height: var(--word-lh-tight);
}

.word-entry__meta > span:not(:first-child) {
  padding-left: var(--word-space-xs);
  border-left: 1px solid var(--word-color-border);
}

.word-entry__reading,
.word-entry__en,
.word-entry__reviewed {
  font-style: normal;
}

.word-entry__reviewed time {
  white-space: nowrap;
}

.word-entry__category {
  color: var(--word-color-secondary);
}

.word-entry__definition {
  margin: var(--word-space-xs) 0 0;
  padding: var(--word-space-xs) var(--word-space-sm);
  border: 1px solid var(--word-color-border);
  border-radius: var(--word-radius);
  background: var(--word-color-bg-subtle);
  color: var(--word-color-text);
  font-size: var(--word-fs-definition);
  font-weight: var(--weight-medium, 500);
  line-height: var(--word-lh-base);
}

.word-entry__body {
  margin: var(--word-space-sm) 0 0;
}

/* 標準版本文は <h4>／<ul><li> を含む（word_body_standard・35語すべて）。
   2026-08-25 まで p 以外の定義が無く、ブラウザ既定のまま出ていた。
   §21 の .word-detail__body と同じ設計で、見出しは1段小さく取る */

.word-entry__body > * {
  margin: 0;
}

.word-entry__body > * + * {
  margin-top: var(--word-space-md);
}

.word-entry__body p {
  font-size: var(--word-fs-body);
  font-weight: var(--weight-medium, 500);
  line-height: var(--word-lh-base);
}

.word-entry__body h4 {
  margin-top: var(--word-space-md);
  color: var(--word-color-primary);
  font-size: var(--word-fs-lg);
  font-weight: 700;
  line-height: var(--word-lh-tight);
}

.word-entry__body h4:first-child {
  margin-top: 0;
}

/* リストは既存テーマの .single-content__body ul（tsumitoru/css/style.css:1546-1560）に揃える。
   マーカーは list-style ではなく 8px の緑丸を ::before で置く */

.word-entry__body ul,
.word-entry__body ol {
  padding-left: 1em;
}

.word-entry__body ol {
  padding-left: 2em;
  list-style: decimal;
}

.word-entry__body ul {
  list-style: none;
}

.word-entry__body li {
  margin-bottom: var(--word-space-xs);
  font-size: var(--word-fs-body);
  font-weight: var(--weight-medium, 500);
  line-height: var(--word-lh-base);
}

.word-entry__body ul li {
  position: relative;
  padding-left: var(--word-gutter);
}

.word-entry__body ul li::before {
  content: "";
  position: absolute;
  top: calc(11 / 16 * 1em);
  left: 0;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background-color: var(--word-color-primary);
}

.word-entry__body li:last-child {
  margin-bottom: 0;
}

.word-entry__body a {
  color: var(--word-color-secondary);
}

.word-entry__detail-link {
  margin: var(--word-space-sm) 0 0;
}

.word-entry__detail-button {
  display: inline-flex;
  align-items: center;
  gap: var(--word-space-2xs);
  padding: var(--word-space-2xs) var(--word-space-sm);
  border: 1px solid var(--word-color-secondary);
  border-radius: var(--word-radius);
  color: var(--word-color-secondary);
  font-size: var(--word-fs-sm);
  line-height: var(--word-lh-tight);
  text-decoration: none;
  transition: background-color var(--word-transition), color var(--word-transition);
}

.word-entry__detail-button:hover {
  background: var(--word-color-secondary);
  color: var(--word-color-on-primary);
}

.word-entry__detail-text {
  display: inline;
}

.word-entry__detail-icon {
  display: block;
  flex: 0 0 auto;
}

/* エントリ内に入る関連用語は控えめに */
.word-entry .word-related-terms {
  margin-top: var(--word-space-sm);
}

/* --- アコーディオン（2026-08-25・オーナー指示「視認性を高くしたい」） ---------
   常時表示   ：見出し・メタ・一言定義
   折りたたみ ：.word-entry__panel（本文・関連用語・詳細ページへのボタン）

   **折りたたむのは `html.word-js` が付く環境だけ。** JS無効時は全項目が開いた
   状態で表示され、トグルは出ない。本文は display:none にせず、常にDOMへ残す
   （か行・さ行・た行・は行の行ページは index, follow の収益動線・§5-8）。

   `hidden="until-found"` は word.js が対応ブラウザにだけ付ける。付いている間は
   UAが content-visibility: hidden にするので、下の max-height と併用して問題ない。 */

.word-entry__toggle {
  display: none;
}

.word-js .word-entry__toggle {
  display: inline-flex;
  align-items: center;
  gap: var(--word-space-2xs);
  margin-top: var(--word-space-xs);
  padding: var(--word-space-3xs) var(--word-space-2xs) var(--word-space-3xs) 0;
  border: 0;
  background: none;
  color: var(--word-color-secondary);
  font-family: inherit;
  font-size: var(--word-fs-sm);
  line-height: var(--word-lh-tight);
  cursor: pointer;
}

.word-js .word-entry__toggle:hover .word-entry__toggle-text {
  text-decoration: underline;
}

.word-entry__toggle-icon {
  display: block;
  flex: 0 0 auto;
  transition: transform var(--word-transition);
}

.word-entry.is-open > .word-entry__toggle .word-entry__toggle-icon {
  transform: rotate(180deg);
}

.word-js .word-entry__panel {
  max-height: 0;
  overflow: hidden;
  transition: max-height 320ms ease;
}

/* JSが実測値をインラインで入れる。この値は transitionend が飛ばなかったときの保険 */
.word-js .word-entry.is-open > .word-entry__panel {
  max-height: 400vh;
}

.word-entry__panel-inner {
  padding-bottom: var(--word-space-3xs);
}

@media screen and (max-width: 768px) {

  .word-entry--detailed {
    padding-left: var(--word-space-xs);
  }

  .word-entry__definition {
    padding: var(--word-space-2xs) var(--word-space-xs);
  }

  .word-entry__body ul,
  .word-entry__body ol {
    margin: 28px 0;
  }

}

/* ===========================================================================
   16. 関連用語 word-related-terms（--row ＝ 行ページ内／--detail ＝ 個別ページ）
   =========================================================================== */

.word-related-terms__title {
  margin: 0 0 var(--word-space-2xs);
  color: var(--word-color-primary);
  font-size: var(--word-fs-sm);
  font-weight: 700;
}

.word-related-terms__list {
  margin: 0;
  padding: 0;
  list-style: none;
}

.word-related-terms__item a {
  color: var(--word-color-secondary);
  text-decoration: none;
}

.word-related-terms__item a:hover {
  text-decoration: underline;
}

.word-related-terms--row .word-related-terms__list {
  display: flex;
  flex-wrap: wrap;
  gap: var(--word-space-3xs) var(--word-space-xs);
}

.word-related-terms--row .word-related-terms__item {
  font-size: var(--word-fs-sm);
}

.word-related-terms--detail {
  padding: var(--word-space-md);
  border: 1px solid var(--word-color-border);
  border-radius: var(--word-radius);
}

.word-related-terms--detail .word-related-terms__title {
  font-size: var(--word-fs-h3);
}

.word-related-terms--detail .word-related-terms__item {
  padding: var(--word-space-2xs) 0;
}

.word-related-terms--detail .word-related-terms__item + .word-related-terms__item {
  border-top: 1px solid var(--word-color-border);
}

.word-related-terms__summary {
  display: block;
  color: var(--word-color-muted);
  font-size: var(--word-fs-xs);
  line-height: var(--word-lh-base);
}

/* ===========================================================================
   17. 関連コラム word-related-columns
   =========================================================================== */

.word-related-columns__title {
  margin: 0 0 var(--word-space-sm);
  color: var(--word-color-primary);
  font-size: var(--word-fs-h3);
  font-weight: 700;
}

/* 既存テーマの .single-relative-article__list（tsumitoru/css/style.css:1776-1780・1836-1845）
   と同じ挙動：3列 → 800px で2列 → 450px で1列・gap 40px */

.word-related-columns__list {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: var(--word-space-xl);
  margin: 0;
  padding: 0;
  list-style: none;
}

@media screen and (max-width: 800px) {

  .word-related-columns__list {
    grid-template-columns: repeat(2, 1fr);
  }

}

@media screen and (max-width: 450px) {

  .word-related-columns__list {
    grid-template-columns: repeat(1, 1fr);
  }

}

.word-related-columns__item {
  display: flex;
}

.word-related-columns__link {
  display: flex;
  flex-direction: column;
  gap: var(--word-space-3xs);
  width: 100%;
  min-width: 0;
  overflow: hidden;
  background: var(--word-color-bg);
  box-shadow: 0 5px 20px 0 rgba(0, 0, 0, 0.1);
  color: inherit;
  text-decoration: none;
  transition: box-shadow var(--word-transition);
}

.word-related-columns__link:hover {
  box-shadow: 0 5px 20px 0 rgba(0, 0, 0, 0.2);
}

.word-related-columns__thumb {
  display: block;
  aspect-ratio: 16 / 9;
  overflow: hidden;
  background: var(--word-color-bg-subtle);
}

.word-related-columns__thumb img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.word-related-columns__label {
  margin: var(--word-space-2xs) var(--word-gutter) 0;
  color: var(--word-color-muted);
  font-size: var(--word-fs-xs);
}

.word-related-columns__name {
  margin: 0 var(--word-gutter) var(--word-gutter);
  color: var(--word-color-primary);
  font-size: var(--word-fs-lg);
  font-weight: 700;
  line-height: var(--word-lh-base);
}

/* ===========================================================================
   18. 関連サービス導線 word-service-cta（第3層で唯一のCTA）
   =========================================================================== */

.word-service-cta {
  padding: var(--word-space-lg) var(--word-space-md);
  border: 1px solid var(--word-color-border-strong);
  border-radius: var(--word-radius);
  background: var(--word-color-bg-subtle);
}

.word-service-cta__title {
  margin: 0;
  color: var(--word-color-primary);
  font-size: var(--word-fs-h3);
  font-weight: 700;
}

.word-service-cta__text {
  margin: var(--word-space-xs) 0 0;
  font-size: var(--word-fs-sm);
}

.word-service-cta__list {
  display: grid;
  gap: var(--word-space-xs);
  margin: var(--word-space-md) 0 0;
  padding: 0;
  list-style: none;
}

.word-service-cta__item {
  display: flex;
}

.word-service-cta__link {
  display: grid;
  grid-template-columns: 1fr auto;
  align-items: center;
  gap: var(--word-space-3xs) var(--word-space-xs);
  width: 100%;
  padding: var(--word-space-xs) var(--word-space-sm);
  border: 1px solid var(--word-color-border);
  border-radius: var(--word-radius);
  background: var(--word-color-bg);
  color: inherit;
  text-decoration: none;
  transition: border-color var(--word-transition);
}

.word-service-cta__link:hover {
  border-color: var(--word-color-secondary);
}

.word-service-cta__name {
  grid-column: 1;
  color: var(--word-color-secondary);
  font-size: var(--word-fs-body);
  font-weight: 700;
}

.word-service-cta__desc {
  grid-column: 1;
  color: var(--word-color-text-sub);
  font-size: var(--word-fs-sm);
  line-height: var(--word-lh-base);
}

.word-service-cta__icon {
  grid-row: 1 / -1;
  grid-column: 2;
  display: block;
  color: var(--word-color-secondary);
}

.word-service-cta__note {
  margin: var(--word-space-xs) 0 0;
  color: var(--word-color-muted);
  font-size: var(--word-fs-xs);
}

@media screen and (max-width: 768px) {

  .word-service-cta {
    padding: var(--word-space-md) var(--word-space-sm);
  }

  .word-service-cta__link {
    padding: var(--word-space-xs);
  }

}

/* ===========================================================================
   19. 監修者 word-supervisor
   =========================================================================== */

.word-supervisor {
  display: grid;
  grid-template-columns: 72px 1fr;
  align-items: start;
  gap: var(--word-space-3xs) var(--word-space-sm);
  padding: var(--word-space-md);
  border: 1px solid var(--word-color-border);
  border-radius: var(--word-radius);
  scroll-margin-top: calc(var(--word-anchor-offset) - var(--word-sticky-top));
}

.word-supervisor__title {
  grid-column: 1 / -1;
  margin: 0 0 var(--word-space-2xs);
  color: var(--word-color-muted);
  font-size: var(--word-fs-xs);
  font-weight: var(--weight-medium, 500);
  letter-spacing: 0.08em;
}

.word-supervisor__photo {
  grid-row: 2 / span 3;
  grid-column: 1;
  margin: 0;
}

.word-supervisor__photo img {
  display: block;
  width: 72px;
  height: 72px;
  border-radius: 50%;
  object-fit: cover;
}

.word-supervisor__name {
  grid-column: 2;
  margin: 0;
  color: var(--word-color-primary);
  font-size: var(--word-fs-lg);
  font-weight: 700;
}

.word-supervisor__qualification {
  grid-column: 2;
  margin: 0;
  color: var(--word-color-muted);
  font-size: var(--word-fs-xs);
}

.word-supervisor__text {
  grid-column: 2;
  margin: var(--word-space-2xs) 0 0;
  font-size: var(--word-fs-sm);
  line-height: var(--word-lh-base);
}

/* 写真がない場合は本文列を左端から使う */
.word-supervisor:not(:has(.word-supervisor__photo)) {
  grid-template-columns: 1fr;
}

.word-supervisor:not(:has(.word-supervisor__photo)) .word-supervisor__name,
.word-supervisor:not(:has(.word-supervisor__photo)) .word-supervisor__qualification,
.word-supervisor:not(:has(.word-supervisor__photo)) .word-supervisor__text {
  grid-column: 1;
}

@media screen and (max-width: 768px) {

  .word-supervisor {
    grid-template-columns: 56px 1fr;
    padding: var(--word-space-sm);
  }

  .word-supervisor__photo img {
    width: 56px;
    height: 56px;
  }

}

/* ===========================================================================
   20. 法的注意書き word-disclaimer
   =========================================================================== */

.word-disclaimer {
  padding: var(--word-space-md);
  border: 1px solid var(--word-color-border);
  border-radius: var(--word-radius);
  background: var(--word-color-bg-subtle);
}

.word-disclaimer--strong {
  border-left: 4px solid var(--word-color-primary);
}

.word-disclaimer__title {
  margin: 0 0 var(--word-space-2xs);
  color: var(--word-color-primary);
  font-size: var(--word-fs-sm);
  font-weight: 700;
}

.word-disclaimer__text {
  margin: 0;
  color: var(--word-color-text);
  font-size: var(--word-fs-xs);
  line-height: var(--word-lh-base);
}

/* ===========================================================================
   21. 第3層 個別用語ページ word-detail
   =========================================================================== */

.word-detail__header {
  padding-bottom: var(--word-space-md);
  border-bottom: 1px solid var(--word-color-border);
}

/* 既存テーマの .single-category（tsumitoru/css/style.css:1486-1495）と同値。
   担当Aが detail-header.php を .single-category に置き換えたあとは
   この定義は使われないが、機能フラグ運用のため残す（DESIGN.md §5-5） */

.word-detail__category {
  display: inline-block;
  margin: var(--word-gutter) 0;
  padding: var(--word-space-2xs) var(--word-gutter);
  border: 1px solid var(--word-color-primary);
  border-radius: var(--word-radius);
  color: var(--word-color-primary);
  font-size: var(--word-fs-sm);
  font-weight: var(--weight-medium, 500);
  line-height: var(--word-lh-base);
}

.word-detail__title {
  margin: 0;
  color: var(--word-color-primary);
  font-size: var(--word-fs-h1);
  font-weight: 700;
}

.word-detail__reading {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: var(--word-space-3xs) var(--word-space-xs);
  margin: var(--word-space-2xs) 0 0;
  color: var(--word-color-muted);
  font-size: var(--word-fs-sm);
  line-height: var(--word-lh-tight);
}

.word-detail__kana,
.word-detail__en {
  color: var(--word-color-muted);
}

.word-detail__en {
  font-style: normal;
}

.word-detail__reading > span:not(:first-child) {
  padding-left: var(--word-space-xs);
  border-left: 1px solid var(--word-color-border);
}

.word-detail__meta {
  display: flex;
  flex-wrap: wrap;
  gap: var(--word-space-3xs) var(--word-space-md);
  margin: var(--word-space-xs) 0 0;
  font-size: var(--word-fs-xs);
  line-height: var(--word-lh-tight);
}

.word-detail__meta-item {
  display: flex;
  align-items: baseline;
  gap: var(--word-space-2xs);
}

.word-detail__meta-label {
  color: var(--word-color-muted);
  font-weight: var(--weight-medium, 500);
}

.word-detail__meta-value {
  margin: 0;
  color: var(--word-color-text);
}

.word-detail__supervisor {
  color: var(--word-color-secondary);
  text-decoration: none;
}

.word-detail__supervisor:hover {
  text-decoration: underline;
}

.word-detail__credentials {
  margin: var(--word-space-xs) 0 0;
  color: var(--word-color-muted);
  font-size: var(--word-fs-xs);
}

.word-detail__definition {
  padding: var(--word-space-sm) var(--word-space-md);
  border: 1px solid var(--word-color-border-strong);
  border-left-width: 4px;
  border-left-color: var(--word-color-primary);
  border-radius: var(--word-radius);
  background: var(--word-color-bg-subtle);
}

.word-detail__definition-text {
  margin: 0;
  color: var(--word-color-text);
  font-size: var(--word-fs-definition);
  font-weight: var(--weight-medium, 500);
  line-height: var(--word-lh-base);
}

/* 既存テーマの .table-of-contents（tsumitoru/css/style.css:1673-1745）に揃える：
   淡色面＋緑2px罫＋radius 8px＋内側24px、見出しは20px緑文字＋緑2px下罫 */

.word-detail__toc {
  padding: var(--word-space-md);
  border: 2px solid var(--word-color-primary);
  border-radius: 8px;
  background: var(--word-color-bg-subtle);
}

.word-detail__toc-title {
  margin: 0 0 var(--word-space-sm);
  padding-bottom: var(--word-space-xs);
  border-bottom: 2px solid var(--word-color-primary);
  color: var(--word-color-primary);
  font-size: var(--word-fs-h3);
  font-weight: 700;
}

.word-detail__toc ol,
.word-detail__toc ul,
.word-detail__toc-list {
  margin: 0;
  padding-left: 1.4em;
}

.word-detail__toc li,
.word-detail__toc-item {
  margin-bottom: var(--word-space-xs);
  font-size: var(--word-fs-sm);
  line-height: var(--word-lh-base);
}

.word-detail__toc li:last-child,
.word-detail__toc-item:last-child {
  margin-bottom: 0;
}

.word-detail__toc a,
.word-detail__toc-link {
  color: var(--word-color-secondary);
  text-decoration: none;
}

.word-detail__toc a:hover,
.word-detail__toc-link:hover {
  text-decoration: underline;
}

/* 既存テーマの .single-content__body（tsumitoru/css/style.css:1507-1600）と同値にする。
   p 16px/1.6/500・下24px、h2 24px/上80px/下罫2px緑、h3 20px/緑文字/上50px、
   ul li は 20px 左パディング＋8px の緑丸 */

.word-detail__body {
  font-size: var(--word-fs-body);
  font-weight: var(--weight-medium, 500);
  line-height: var(--word-lh-base);
}

.word-detail__body h2 {
  margin: var(--word-section-gap) 0 0;
  padding-bottom: var(--word-gutter);
  border-bottom: 2px solid var(--word-color-primary);
  color: var(--word-color-text);
  font-size: var(--word-fs-h2);
  font-weight: 700;
  scroll-margin-top: calc(var(--word-anchor-offset) - var(--word-sticky-top));
}

.word-detail__body h3 {
  margin: 50px 0 0;
  color: var(--word-color-primary);
  font-size: var(--word-fs-h3);
  font-weight: 700;
  scroll-margin-top: calc(var(--word-anchor-offset) - var(--word-sticky-top));
}

.word-detail__body h2:first-child,
.word-detail__body h3:first-child {
  margin-top: 0;
}

.word-detail__body p {
  margin: var(--word-space-md) 0;
  font-size: var(--word-fs-body);
  font-weight: var(--weight-medium, 500);
  line-height: var(--word-lh-base);
}

.word-detail__body ul,
.word-detail__body ol {
  margin: 36px 0;
  padding-left: 1em;
}

.word-detail__body ol {
  padding-left: 2em;
  list-style: decimal;
}

.word-detail__body ul {
  list-style: none;
}

.word-detail__body li {
  margin-bottom: var(--word-space-xs);
  font-size: var(--word-fs-body);
  font-weight: var(--weight-medium, 500);
  line-height: var(--word-lh-base);
}

.word-detail__body ul li {
  position: relative;
  padding-left: var(--word-gutter);
}

.word-detail__body ul li::before {
  content: "";
  position: absolute;
  top: calc(11 / 16 * 1em);
  left: 0;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background-color: var(--word-color-primary);
}

.word-detail__body a {
  color: var(--word-color-secondary);
}

.word-detail__body table {
  width: 100%;
  margin: 0 0 1em;
  border-collapse: collapse;
  font-size: var(--word-fs-sm);
}

.word-detail__body th,
.word-detail__body td {
  padding: var(--word-space-2xs) var(--word-space-xs);
  border: 1px solid var(--word-color-border);
  text-align: left;
  vertical-align: top;
}

.word-detail__body th {
  background: var(--word-color-bg-subtle);
  font-weight: 700;
}

/* 既存テーマの .single-page-nav（tsumitoru/css/style.css:1638-1658）に揃える */

.word-detail__nav {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: var(--word-gutter);
  padding-top: var(--word-space-xl);
  border-top: 1px solid var(--word-color-border-strong);
}

.word-detail__nav p {
  margin: 0;
}

.word-detail__nav-row,
.word-detail__nav-index {
  margin: 0;
}

.word-detail__nav a {
  display: inline-flex;
  align-items: center;
  gap: var(--word-space-sm);
  padding: var(--word-space-sm) 30px;
  border-radius: 8px;
  background-color: var(--word-color-primary);
  color: var(--word-color-on-primary);
  font-size: var(--word-fs-body);
  font-weight: var(--weight-medium, 500);
  text-decoration: none;
  transition: opacity var(--word-transition);
}

.word-detail__nav a:hover {
  opacity: 0.7;
}

@media screen and (max-width: 768px) {

  .word-detail__nav {
    flex-direction: column;
    align-items: flex-start;
  }

  .word-detail__definition {
    padding: var(--word-space-xs) var(--word-space-sm);
  }

  .word-detail__body table {
    display: block;
    overflow-x: auto;
  }

  /* 既存テーマの SP 値（tsumitoru/css/style.css:1837-1848・1855-1858） */

  .word-detail__body h3 {
    margin-top: var(--word-space-lg);
  }

  .word-detail__body ul,
  .word-detail__body ol {
    margin: 28px 0;
  }

  .word-detail__toc {
    padding: var(--word-space-sm);
  }

  .word-detail__toc-title {
    font-size: var(--word-fs-lg);
  }

}

/* ===========================================================================
   22. 記事本文の用語リンクとツールチップ（§4-6・Phase1では出力されない）
   =========================================================================== */

/* 記事本文内では .single-content__body p a（詳細度 0,2,1）が
   .word-term-link（0,1,0）に勝つ（DESIGN.md §2-15）。
   .single-content__body p .word-term-link（0,3,1）で確実に上書きする。
   段落以外（li 等）に出た場合の素の定義も残す */

.word-term-link {
  color: var(--word-color-secondary);
  text-decoration: none;
  border-bottom: 1px dotted currentColor;
}

.word-term-link:hover {
  border-bottom-style: solid;
}

.single-content__body p .word-term-link {
  color: var(--word-color-secondary);
  text-decoration: none;
  border-bottom: 1px dotted currentColor;
}

.single-content__body p .word-term-link:hover {
  text-decoration: none;
  border-bottom-style: solid;
}

.word-term-tooltip {
  position: absolute;
  z-index: 30;
  max-width: 320px;
  padding: var(--word-space-xs) var(--word-space-sm);
  border: 1px solid var(--word-color-border-strong);
  border-radius: var(--word-radius);
  background: var(--word-color-bg);
  font-size: var(--word-fs-sm);
  font-weight: var(--weight-medium, 500);
  line-height: var(--word-lh-base);

  /* word.js の place() は hidden を外して寸法を測ってから座標を確定させる。
     測定中の左上0,0への一瞬の描画を出さないため、既定は不可視・非当たり判定にし、
     座標確定後に付く .is-open で見せる */
  opacity: 0;
  pointer-events: none;
  transition: opacity var(--word-transition);
}

.word-term-tooltip.is-open {
  opacity: 1;
  pointer-events: auto;
}

.word-term-tooltip[hidden] {
  display: none;
}

.word-term-tooltip__summary {
  margin: 0;
  color: var(--word-color-text);
}

.word-term-tooltip__link {
  display: inline-flex;
  align-items: center;
  gap: var(--word-space-3xs);
  margin-top: var(--word-space-2xs);
  color: var(--word-color-secondary);
  font-size: var(--word-fs-xs);
  text-decoration: none;
}

.word-term-tooltip__link:hover {
  text-decoration: underline;
}

.word-term-tooltip__link-text {
  display: inline;
}

.word-term-tooltip__icon {
  display: block;
  flex: 0 0 auto;
}

@media (hover: none) {

  .word-term-tooltip {
    display: none;
  }

}

/* ===========================================================================
   23. フォーカス可視・モーション
   =========================================================================== */

.word-index a:focus-visible,
.word-index button:focus-visible,
.word-row a:focus-visible,
.word-row button:focus-visible,
.word-detail a:focus-visible,
.word-detail button:focus-visible,
.word-term-link:focus-visible {
  outline: 2px solid var(--word-color-secondary);
  outline-offset: 2px;
  border-radius: 2px;
}

.word-search__input:focus-visible {
  outline: none;
}

@media (prefers-reduced-motion: reduce) {

  html {
    scroll-behavior: auto;
  }

  .word-card,
  .kana-nav--tile .kana-nav__link,
  .row-jump,
  .word-related-columns__link,
  .word-service-cta__link,
  .word-entry__detail-button,
  .word-entry__panel,
  .word-entry__toggle-icon,
  .word-row__expand,
  .word-row__expand-icon,
  .word-theme-filter__button,
  .row-jump__link,
  .word-term-tooltip {
    transition: none;
  }

  .word-card:hover,
  .kana-nav--tile a.kana-nav__link:hover {
    transform: none;
  }

}

/* ===========================================================================
   24. 印刷（法務担当が用語ページを印刷する想定）
   =========================================================================== */

@media print {

  .word-index,
  .word-row,
  .word-detail {
    color: #000000;
    font-size: 10.5pt;
    line-height: 1.7;
  }

  .word-glossary .page-default-content,
  .word-index .page-content__body > *,
  .word-row .page-content__body > *,
  .word-detail .single-article__container {
    max-width: none;
    padding-right: 0;
    padding-left: 0;
  }

  .word-index .page-content__body > * + *,
  .word-row .page-content__body > * + * {
    margin-top: 12pt;
  }

  .word-detail .word-detail__definition,
  .word-detail .word-detail__toc,
  .word-detail .word-detail__body,
  .word-detail .word-supervisor,
  .word-detail .word-disclaimer,
  .word-detail .word-related-terms--detail {
    margin-top: 12pt;
  }

  /* 操作用のUIは紙に出さない */
  .word-search,
  .word-theme-filter,
  .kana-nav,
  .row-jump,
  .word-popular,
  .word-cta,
  .word-service-cta,
  .word-related-columns,
  .word-group__back,
  .word-row__nav,
  .word-detail__nav,
  .word-term-tooltip {
    display: none;
  }

  /* 操作用のUIのうち、.word-js 付きでしか出ないものは同じ詳細度で消す */
  .word-js .word-entry__toggle,
  .word-js .word-row__controls {
    display: none;
  }

  /* アコーディオンは紙では常に開く。
     hidden="until-found" が残っていても、word.js が入れたインラインの
     max-height が残っていても出す必要があるため、ここだけ !important を使う */
  .word-js .word-entry__panel,
  .word-js .word-entry__panel[hidden] {
    max-height: none !important;
    overflow: visible;
    content-visibility: visible;
  }

  .word-index__hero,
  .word-row__hero,
  .word-detail__header,
  .word-group__head,
  .row-toc,
  .word-supervisor,
  .word-disclaimer,
  .word-entry__definition,
  .word-detail__definition,
  .word-detail__toc {
    border-color: #000000;
    background: transparent;
  }

  .word-index__title,
  .word-row__title,
  .word-detail__title,
  .word-group__kana,
  .word-entry__title,
  .word-list__group-title {
    color: #000000;
  }

  .word-entry,
  .word-group__head,
  .word-supervisor,
  .word-disclaimer {
    break-inside: avoid;
  }

  .word-group {
    break-before: page;
  }

  .word-row__groups > .word-group:first-child {
    break-before: auto;
  }

  .word-entry--detailed {
    border-left-color: #000000;
  }

  .word-card,
  .word-related-columns__link {
    box-shadow: none;
    border: 1px solid #000000;
  }

  /* 紙では参照先URLを残す（法務の照合用） */
  .word-detail__body a[href^="http"]::after,
  .word-entry__body a[href^="http"]::after {
    content: " <" attr(href) ">";
    font-size: 9pt;
    word-break: break-all;
  }

  .word-disclaimer {
    border: 1px solid #000000;
  }

}