/* ============================================================================
   UI consistency pass — 2026-10-15
   目視レビューで指摘された 3 点だけを直す。既存 CSS は書き換えず、
   layout-fixes.css の後に読み込んで後勝ちさせる。
   対象は「1440px の実レンダリングで欠陥が確認できた箇所」のみに限定する。
   ============================================================================ */

/* ----------------------------------------------------------------------------
   1. <details> のネイティブ ▶ マーカーを、既存 FAQ と同じ +/− アイコンに統一

   既に整形済みなのは .wn-faq（themes/navigator/assets/css/main.css:1519-1525）と
   .dlp-faq だけで、残り 57 個はブラウザ既定の ▶/▼ が出ていた。
   見た目の方言を増やさないよう、アイコンもトランジションも .wn-faq と同じものを使う。

   下の一覧は実レンダリングでネイティブマーカーが出ていたコンポーネントのみ。
   3 サイトで同一ファイルにしてあるため、そのサイトに存在しないクラスは単に一致しない。
   .wn-faq / .dlp-faq は入れていないので、整形済みのものには触れない。
   ---------------------------------------------------------------------------- */
:root {
  --wn-acc-icon: var(--c-accent, #B5430D);
}

html body[class] details:is(
  .wn-profile-questions, .wn-cr-case__detail, .wn-page-preparation,
  .wn-contact-prep, .r26-guide,
  .wn-blog-preparation, .wn-service-supplement, .wn-review-detail,
  .wn-guide-index-mobile, .wn-guide-questions, .wn-more-reviews,
  .wn-consult__optional, .wn-directory-toc, .wn-category-details
) > summary,
/* com の /faq/ はクラスを持たない素の <details> で、.wn-faq の中にも入っていない。
   直下セレクタなので .wn-faq 配下の整形済みのものには一致しない。 */
html body[class] .page-default__content > details:not([class]) > summary {
  /* display:flex にすると list-item ではなくなり、▶ マーカー自体が生成されない。 */
  display: flex;
  align-items: flex-start;
  gap: .75rem;
  list-style: none;
  cursor: pointer;
  color: var(--c-ink, #1B2547);
  transition: color var(--dur, .25s) var(--ease, cubic-bezier(.2, .7, .25, 1));
}

html body[class] details:is(
  .wn-profile-questions, .wn-cr-case__detail, .wn-page-preparation,
  .wn-contact-prep, .r26-guide,
  .wn-blog-preparation, .wn-service-supplement, .wn-review-detail,
  .wn-guide-index-mobile, .wn-guide-questions, .wn-more-reviews,
  .wn-consult__optional, .wn-directory-toc, .wn-category-details
) > summary::-webkit-details-marker,
html body[class] .page-default__content > details:not([class]) > summary::-webkit-details-marker {
  display: none;
}

/* +（閉）→ 90度回転して −（開）。.wn-faq と同じ作り方の 2 本のグラデーション。 */
html body[class] details:is(
  .wn-profile-questions, .wn-cr-case__detail, .wn-page-preparation,
  .wn-contact-prep, .r26-guide,
  .wn-blog-preparation, .wn-service-supplement, .wn-review-detail,
  .wn-guide-index-mobile, .wn-guide-questions, .wn-more-reviews,
  .wn-consult__optional, .wn-directory-toc, .wn-category-details
) > summary::after,
html body[class] .page-default__content > details:not([class]) > summary::after {
  content: "";
  flex: none;
  margin-left: auto;
  /* 複数行の summary でも 1 行目の高さに合わせる。 */
  margin-top: .3em;
  width: 18px;
  height: 18px;
  background:
    linear-gradient(var(--wn-acc-icon), var(--wn-acc-icon)) center / 100% 2px no-repeat,
    linear-gradient(var(--wn-acc-icon), var(--wn-acc-icon)) center / 2px 100% no-repeat;
  transition: transform var(--dur, .25s) var(--ease, cubic-bezier(.2, .7, .25, 1));
}

html body[class] details:is(
  .wn-profile-questions, .wn-cr-case__detail, .wn-page-preparation,
  .wn-contact-prep, .r26-guide,
  .wn-blog-preparation, .wn-service-supplement, .wn-review-detail,
  .wn-guide-index-mobile, .wn-guide-questions, .wn-more-reviews,
  .wn-consult__optional, .wn-directory-toc, .wn-category-details
)[open] > summary::after,
html body[class] .page-default__content > details:not([class])[open] > summary::after {
  transform: rotate(90deg);
  background: linear-gradient(var(--wn-acc-icon), var(--wn-acc-icon)) center / 100% 2px no-repeat;
}

/* 押せることを色で示す（LP辞典「ホバーリフト」の意図。行を浮かせると読み位置がぶれるため色のみ）。 */
html body[class] details:is(
  .wn-profile-questions, .wn-cr-case__detail, .wn-page-preparation,
  .wn-contact-prep, .r26-guide,
  .wn-blog-preparation, .wn-service-supplement, .wn-review-detail,
  .wn-guide-index-mobile, .wn-guide-questions, .wn-more-reviews,
  .wn-consult__optional, .wn-directory-toc, .wn-category-details
) > summary:hover,
html body[class] .page-default__content > details:not([class]) > summary:hover {
  color: var(--c-accent-text, #B5430D);
}

/* キーボード操作時のフォーカス位置を明示する。 */
html body[class] details:is(
  .wn-profile-questions, .wn-cr-case__detail, .wn-page-preparation,
  .wn-contact-prep, .r26-guide,
  .wn-blog-preparation, .wn-service-supplement, .wn-review-detail,
  .wn-guide-index-mobile, .wn-guide-questions, .wn-more-reviews,
  .wn-consult__optional, .wn-directory-toc, .wn-category-details
) > summary:focus-visible,
html body[class] .page-default__content > details:not([class]) > summary:focus-visible {
  outline: 2px solid var(--c-accent, #B5430D);
  outline-offset: 3px;
  border-radius: 6px;
}

/* ----------------------------------------------------------------------------
   2. 左寄せセクションで見出し・アイブロウ・リードの左端を揃える

   layout-fixes.css:386 の margin-inline:auto !important は
   「中央寄せセクションのコピーを読みやすい幅に収める」ためのもので、
   .wn-voices のような左寄せセクションにも無条件にかかっていた。
   その結果 1440px では eyebrow=440px / title=153px / lede=377px と
   左端が 3 つに割れていた（実測）。.wn-voices に限って解除する。
   .wn-voices__cta は text-align:center の締めの一行なので中央寄せのまま残す。
   ---------------------------------------------------------------------------- */
html body[class] .wn-voices > .wn-voices__eyebrow,
html body[class] .wn-voices > .wn-voices__lede {
  margin-inline: 0 !important;
}

/* ============================================================================
   2026-10-15 厳格監査（全 118 ルート x デスクトップ 1440 / モバイル 390）で
   検出した欠陥の修正。実測値はコメントに残す。
   ============================================================================ */

/* ----------------------------------------------------------------------------
   4. コントラスト（WCAG AA 4.5:1）
   ---------------------------------------------------------------------------- */

/* 4-1. モバイル下部ナビの「緊急」が読めなかった。
   design-polish.css:2301 がナビ全体を rgba(15,30,90,.94) の濃紺に変えた一方、
   main.css の「緊急文脈では crimson に戻す」ルールが据え置かれ、
   濃い赤 #9B2D2D を濃紺の上に置いていた。実測 1.77:1。
   色相は保ったまま明度だけ上げる（実効背景 rgb(29,44,100) に対し 6.64:1）。 */
/* main.css の緊急文脈ルールは body.page[class*="wp-emergency"] … の形で詳細度 (0,4,1)。
   .bottom-nav を挟んで (0,4,2) にし、読み込み順に依存せず確実に上書きする。 */
html body[class] .bottom-nav .bottom-nav__item--emergency .bottom-nav__label {
  color: #EFA5A5;
}

/* 4-2. 保守プランの注記がオレンジ地の上で 4.43:1 と基準をわずかに下回っていた。 */
html body[class] .wn-price-multi-note {
  color: #434E68;
}

/* 4-3. store の一次ボタンが文字色を指定しておらず、本文の濃紺 rgb(27,37,71) を
   継承してオレンジ地 rgb(181,67,13) の上に乗り 2.69:1 になっていた。 */
html body[class] .hp-form__button.button-primary,
html body[class] .hp-form__button.button-primary span {
  color: #fff;
}

/* ----------------------------------------------------------------------------
   5. レイアウト（モバイル 390px でのはみ出し）
   ---------------------------------------------------------------------------- */

/* 5-1. 幅が親と同じ 317px なのに左右 20px のマージンが付き、20px はみ出していた。
   マージンを含めた幅になるよう width を自動にする。 */
html body[class] .wn-editorial,
html body[class] .wn-editorial__links {
  width: auto;
}

/* 5-2. 相談ボタンのグリッドが、コンテナ 161px に対し 182px のトラックを作り
   21px はみ出していた（/troubleshooting-guide/ と /contact/ の計 10 箇所）。
   トラックをコンテナ幅に収め、ボタン自身も縮めるようにする。 */
html body[class] .wn-consult__options {
  grid-template-columns: minmax(0, 1fr);
}
html body[class] .wn-consult__options > button {
  min-width: 0;
}

/* ----------------------------------------------------------------------------
   6. 見出し・構造
   ---------------------------------------------------------------------------- */

/* 6-1. サイトマップの入口カードは nav 内のリンクラベルであり文書の節ではないため
   h3 から span に変更した。ブロック要素として見た目を保つ。 */
html body[class] .wn-sitemap-entry__title {
  display: block;
}

/* 6-2. /profile/ のモバイルで、アイブロウだけが写真の隣（2 列目）に残り、
   肩書き・氏名・リードは全幅に落ちていたため左端が 145px と 41px に割れていた。
   モバイルではアイブロウも全幅にして左端を揃える。 */
/* wn-screenshot-review.css の .wn-pf .wn-pf-intro :is(...) が詳細度 (0,4,2)。
   クラスを二重に書いて (0,5,2) にする。
   .wn-pg-in のような JS が付ける状態クラスは prefers-reduced-motion: reduce では
   付与されないため、セレクタの土台には使わない。 */
@media (max-width: 600px) {
  html body[class] .wn-pf .wn-pf-intro .wn-pf-eyebrow.wn-pf-eyebrow {
    grid-column: 1 / -1;
  }
}

/* ============================================================================
   7. z-index の管理 — 2026-10-16
   9999 / 9998 / 9990 / 9980… と各ファイルに散っていた値を 1 か所に集める。
   値そのものは変えない（下げると第三者製プラグインや管理バー z-index:99999 との
   前後関係が変わり、重なりが静かに壊れるため）。
   唯一 .wn-v61-progress の 2147483000 だけ、管理バーより上を保ったまま下げる。
   ============================================================================ */
:root {
  --z-back-to-top:      89;
  --z-bottom-nav:       90;
  --z-site-header:     100;
  --z-mobile-drawer:   999;
  --z-sos-fab:        1000;
  --z-store-cta-rail: 9000;
  --z-store-header-3: 9978;
  --z-store-header-2: 9979;
  --z-store-header-1: 9980;
  --z-mobile-nav:     9990;
  --z-reading-progress: 9998;
  --z-overlay:        9999;   /* CTA レール・離脱モーダル */
  --z-top-progress: 100000;   /* 旧 2147483000。管理バー(99999)より上を維持 */
}