/* 日本語版の追加スタイル (原文CSSには手を入れない) */
.ja-banner {
  background: #1f2a24;
  color: #f4f1ea;
  font: 13px/1.6 system-ui, -apple-system, "Hiragino Sans", "Noto Sans JP", sans-serif;
  padding: 8px 16px;
  text-align: center;
}
.ja-banner a { color: #bfe3c9; text-decoration: underline; }
.ja-notice { margin-top: 4px; font-size: 12px; color: #d9d4c7; }
.ja-credit {
  margin: 2.5rem 0 1rem;
  padding-top: 1rem;
  border-top: 1px solid rgba(0, 0, 0, .15);
  font-size: 13px;
  color: #555;
}
.ja-credit a { text-decoration: underline; }
/* 原文サイトは本文を画面高さ(h-screen)の内側スクロール領域に収めている。日本語版には
   AGI Hub のヘッダー・バナー・フッターが並ぶため、1画面に押し込むと本文の領域が
   潰れる (スマホで約200px)。内側のスクロールをやめ、ページ全体を普通にスクロールさせる */
body > .h-screen, body > .bg-vivid-background > .h-screen { height: auto; min-height: 0; }
.h-screen > .min-h-0 > .overflow-y-auto.min-h-0 { overflow: visible; }
/* 描画時の固定幅 (width="944" など) のグラフが本文を押し広げないよう、横スクロールに収める */
main { min-width: 0; max-width: 100%; }
main.max-w-6xl { max-width: min(100%, 72rem); }
/* 分析ページの main (max-w-5xl) も同じ。「入力パラメータの相関」を開くと幅 520px のヒートマップが
   main を押し広げ、スマホでページ全体が横に広がっていた (原文は内側スクロール領域で右端が切れる) */
main.max-w-5xl { max-width: min(100%, 64rem); }
main div:has(> svg[width]) { max-width: 100%; overflow-x: auto; overflow-y: hidden; }
/* 和文の読みやすさ: 欧文フォントに無い字形は和文フォントへ落とす */
body { font-feature-settings: normal; }
:lang(ja) .prose p, :lang(ja) .prose li { line-break: strict; }
:lang(ja) .font-et-book, :lang(ja) .prose h1, :lang(ja) .prose h2, :lang(ja) .prose h3 {
  font-family: et-book, "Hiragino Mincho ProN", "Yu Mincho", "Noto Serif JP", serif;
}
input[disabled], select[disabled], button[disabled] { cursor: default; }
/* React 版 (assets/app/index.js): デスクトップの詳細設定パネルは、ページ全体をスクロールさせる
   日本語版では本文と一緒に流れてしまうので、画面の高さに固定して内側でスクロールさせる */
#advanced-panel { position: sticky; top: 0; align-self: flex-start; max-height: 100vh; }
/* React 版のグラフ (2026-10-01、Safari での文字の重なりの報告。原文サイトでも同じ崩れ方をする):
   値ラベル (グラフ端の数値・マイルストーン名) は線の上に描かれるので、背景色で縁取って線と重なっても読めるようにする */
svg text[alignment-baseline="middle"][font-weight="500"] {
  paint-order: stroke;
  stroke: var(--vivid-background, #fffff8);
  stroke-width: 3px;
  stroke-linejoin: round;
}
/* ツールチップ (z-index:1000 の吹き出し) を出しているグラフを、後ろに並ぶグラフより前に出す。
   iOS Safari では隣のグラフの線や見出しが吹き出しの上に描かれていた */
.relative:has(> * [style*="z-index: 1000"]), .relative:has(> [style*="z-index: 1000"]) { z-index: 40; }