/* ===== 評価バー・評価グラフ・検討の共通スタイル（/play/ と /shuban/ が同じものを読む） =====
   もとは /play/index.html の中にあったものをそのまま出した（2026-08-20）。
   直すのはこのファイル1本だけ。直したら参照している全ページを ?v= を新しくして同時にアップする。 */

/* 評価バー・グラフの置き場所＝ページの一番下（フッター位置）。
   ここを出し入れしても盤と操作ボタンは1pxも動かない */
#evalfoot{display:none;margin-top:8px}
#evalfoot.on{display:block}
#evalfoot .evalwrap,#evalfoot .graphwrap{display:none}
#evalfoot.show .evalwrap,#evalfoot.show .graphwrap{display:block}

/* 「評価値 オン／オフ」ボタン。評価バーのすぐ上・右寄せ＝バーから離さない（2026-07-30ユーザー指示） */
/* 「まった」の手送り ◀▶（2026-08-09ユーザー指示）。「評価値 オン／オフ」と同じ行の左のあきに置く＝
   行が増えないので評価グラフの高さも盤も1pxも変わらない。
   タップ判定44pxは ::after を下向きに取る（上に広げると操作ボタンのタップ範囲を奪う）。
   下は評価バー（押しても何も起きない表示）なので取り合いにならない */
.evalrow{display:none;align-items:center;justify-content:flex-end;height:28px}
.evalrow.on{display:flex}
.evalrow .mnav{display:none;flex:none;position:relative;width:64px;height:28px;margin-right:6px;padding:0;
 background:#1b2c4c;border:1px solid #ffffff2b;border-radius:6px;color:#fff;font-size:15px;line-height:26px;
 font-family:inherit;cursor:pointer}
.evalrow.nav .mnav{display:block}
#btnMFwd{margin-right:auto}   /* ▶の右をあけて「評価値」ボタンを右端に残す（:last-of-typeはタグで数えるので使わない） */
.evalrow .mnav[disabled]{opacity:.42;cursor:default}
.evalrow .mnav:not([disabled]):active{transform:scale(.97)}
.evalrow .mnav::after{content:"";position:absolute;left:-6px;right:-6px;top:0;height:44px}
.evtg{flex:none;position:relative;min-width:84px;height:28px;line-height:28px;padding:0 10px;border:1px solid #ffffff33;
 border-radius:6px;background:#1b2c4c;color:#cfe0ff;font-size:11.5px;font-weight:700;font-family:inherit;cursor:pointer}
.evtg[aria-pressed="true"]{background:var(--accent);border-color:var(--accent);color:#fff}
.evtg::after{content:"";position:absolute;left:-8px;right:-8px;top:-8px;height:44px}

/* 評価バー（将棋ウォーズ配色 先手=赤／後手=青・/kifu-quiz/ と同じ）。高さ24px固定 */
.evalwrap{height:24px;margin:3px 0 2px}
.evalbar{display:flex;height:24px;border-radius:6px;overflow:hidden;font-size:12px;font-weight:700;line-height:24px;
 box-shadow:inset 0 0 0 1px #ffffff22}
.evalbar .b{background:linear-gradient(180deg,#e0685c,#c0392b);color:#fff;text-align:left;padding-left:7px;
 white-space:nowrap;overflow:hidden;transition:width .25s}
.evalbar .w{background:linear-gradient(180deg,#4b8ae8,#2f6fd0);color:#fff;text-align:right;padding-right:7px;
 white-space:nowrap;overflow:hidden;flex:1}

/* 評価グラフ（解析ツールと同じ折れ線）。高さはJS（sizeGraph）が「画面の余り全部」に広げる（2026-07-31ユーザー指示）。
   40px はJSが動く前・動けない時の下限値 */
.graphwrap{height:40px;margin:2px 0}
.graphwrap canvas{display:block;width:100%;height:100%;border-radius:6px;background:#0b162b;
 box-shadow:inset 0 0 0 1px #ffffff1c}
/* 「アドレスバーが出ている時の画面の高さ」（svh）を測るための見えない棒。
   スマホはアドレスバーの出入りで window.innerHeight が変わるが svh は変わらない。
   ここを基準にすれば、アドレスバーが出入りしても画面がカクカク動かない（2026-07-31修正） */
#vhprobe{position:fixed;left:0;top:0;width:1px;height:100vh;visibility:hidden;pointer-events:none}
@supports (height:100svh){#vhprobe{height:100svh}}
/* 検討中はグラフを押した場所の手数へ移動できる（/kifu-quiz/ と同じ・2026-07-30ユーザー指示） */
body.reviewing .graphwrap canvas{cursor:pointer;touch-action:pan-y}

/* 検討の手送り（対局が終わったあとだけ出す） */
.navrow{display:none;align-items:center;gap:6px;margin:8px auto 0;max-width:calc(min(100vw,430px) - 16px)}
.navrow.on{display:flex}
.navrow button{flex:1;min-width:0;height:44px;background:#1b2c4c;border:1px solid #ffffff2b;color:#fff;border-radius:9px;
 font-size:15px;font-family:inherit;cursor:pointer}
.navrow button[disabled]{opacity:.42;cursor:default}
.navrow .navnum{flex:none;width:84px;text-align:center;font-size:13px;color:#cfe0ff;font-variant-numeric:tabular-nums}