/* 評価値グラフ（graph.js）と振り返りの区画の評価値の並び。本将棋・トライ将棋が同じ物を使う（2026-10-24 本将棋の style.css から移した）。
   席の色 --s0・--s1 はアプリが上書きできる（既定は本将棋の色）。 */
.graph {
  width: 100%;
  height: auto;
  display: block;
}
.g-frame {
  fill: none;
  stroke: var(--border);
}
.g-grid {
  stroke: var(--border);
  stroke-dasharray: 2 3;
}
.g-zero {
  stroke: var(--text-2);
}
.g-tick {
  font-size: 8px;
  fill: var(--text-2);
}
.g-line {
  fill: none;
  stroke: var(--accent);
  stroke-width: 1.6;
}
.g-dot {
  fill: var(--accent);
}
.g-mark.s0 {
  fill: var(--s0, #2b6cd6);
}
.g-mark.s1 {
  fill: var(--s1, #d23f3f);
}
.g-cursor {
  stroke: var(--text);
  stroke-width: 1;
}
.g-mark.g-blunder,
.graph-legend .g-mark.g-blunder {
  fill: #dc2626;
  stroke: none;
}
/* 王手 = 👑（フレネミー将棋と同じ字）。絵文字が出ない端末（svg.no-emoji）は「王」の字 */
.g-mark.g-check {
  font-family: 'Apple Color Emoji', 'Segoe UI Emoji', 'Noto Color Emoji', sans-serif;
  paint-order: stroke;
  stroke: var(--bg);
  stroke-width: 1.5px;
  stroke-linejoin: round;
}
.g-emoji-alt,
.no-emoji .g-emoji {
  display: none;
}
.no-emoji .g-emoji-alt {
  display: inline;
  font-family: inherit;
  font-weight: 700;
}
/* 両取り = 席の色の丸に「両」 */
.g-mark-char {
  fill: #fff;
  font-weight: 700;
  pointer-events: none;
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme='light']) .g-mark.g-blunder {
    fill: #f87171;
  }
}
:root[data-theme='dark'] .g-mark.g-blunder {
  fill: #f87171;
}
/* 評価値グラフの凡例（印の形はグラフと同じ SVG。graph.mjs の MARK_KINDS） */
.graph-legend {
  display: flex;
  flex-wrap: wrap;
  gap: 2px 12px;
  margin: 4px 0 0;
  padding: 0;
  list-style: none;
  font-size: 0.72rem;
  color: var(--text-2);
}
.graph-legend li {
  display: inline-flex;
  align-items: center;
  gap: 3px;
}
.graph-legend svg {
  width: 14px;
  height: 14px;
}
.graph-legend .g-mark,
.graph-legend .g-dot {
  fill: var(--text-2);
}
.graph-legend .g-mark.g-trait {
  fill: none;
  stroke: var(--text-2);
}
.graph-legend .seat-s0 {
  color: var(--s0, #2b6cd6);
  font-weight: 700;
}
.graph-legend .seat-s1 {
  color: var(--s1, #d23f3f);
  font-weight: 700;
}

/* ===== S2b・S3: 読み込み・ギャラリー・統計・解析 ===== */
.g-mark.g-trait {
  fill: none;
  stroke-width: 1.2;
}
.g-mark.g-trait.s0 {
  stroke: var(--s0, #2b6cd6);
}
.g-mark.g-trait.s1 {
  stroke: var(--s1, #d23f3f);
}
.review .graph {
  display: block;
}
.graph-src {
  display: flex;
  margin: 0 0 4px;
}
.graph-src button {
  min-height: 32px;
  padding: 4px 8px;
  font-size: 0.8rem;
}
.review-actions {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 6px;
  margin-top: 6px;
}
.review-actions button {
  padding: 6px 8px;
  font-size: 0.85rem;
}
.review .hint {
  min-height: 1.4em;
  margin: 4px 0 0;
}
/* 逆解析（2026-10-25）: 比べる点の列（対局中に AI が思った評価）は点線、詰みまで読み切れた局面は大きい点 */
.g-ghost {
  fill: none;
  stroke: var(--text-2);
  stroke-width: 1.2;
  stroke-dasharray: 3 3;
}
.g-proven {
  stroke: var(--bg);
  stroke-width: 0.8;
}
/* 逆解析の添え書き（グラフの下の 1 行） */
.graph-note {
  margin: 4px 0 0;
  font-size: 0.8em;
}