/* 戦国の覇者2
   ・Lv10 共通UI 予約: 左上 180x60（menu）・左下 高さ120（mp3）。HUD はそこを避ける */
:root {
    --地: #14181f;
    --面: #1d232d;
    --面2: #262e3a;
    --線: #3a4556;
    --字: #e8e4d8;
    --淡: #9aa3b0;
    --金: #e0b84a;
    --赤: #e05a4a;
    --緑: #6cc070;
    --選: #f2d16b;
    --文字倍率: var(--lv10-文字倍率, 1);
}
* { box-sizing: border-box; }
html, body { margin: 0; height: 100%; overflow: hidden; background: var(--地); color: var(--字);
    font-family: "Yu Gothic UI", "Hiragino Sans", "Meiryo", sans-serif; font-size: calc(15px * var(--文字倍率)); }
button { font: inherit; color: inherit; }
[hidden] { display: none !important; }

/* ---------- タイトル ---------- */
.全面 { position: fixed; inset: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 18px;
    background: radial-gradient(ellipse at 50% 40%, #2a3342 0%, #12161d 70%); }
/* タイトルの背景の絵（index.php が --題絵 を入れる）。城は絵の中ほどにあるので、文字の後ろだけ暗くして読めるように */
#タイトル画面.絵あり { background: radial-gradient(ellipse 34% 60% at 50% 52%, #0b0e14c8 0%, #0b0e1488 55%, #0b0e1400 100%),
    linear-gradient(#0b0e1460, #0b0e1430 40%, #0b0e1490), var(--題絵) center / cover no-repeat, #12161d; }
.題字 { font-size: calc(64px * var(--文字倍率)); font-weight: 800; letter-spacing: .12em; text-shadow: 0 4px 0 #000, 0 0 24px #b8862f55; }
.題字 span { color: var(--金); margin-left: .1em; }
.版 { color: var(--淡); font-size: 13px; margin-top: -10px; }
.縦メニュー { display: flex; flex-direction: column; gap: 10px; min-width: 260px; margin-top: 20px; }
.縦メニュー button, .大ボタン { background: var(--面2); border: 1px solid var(--線); padding: 12px 18px; border-radius: 6px; cursor: pointer; font-size: 1.1em; }
.縦メニュー button:hover, .縦メニュー button.lv10-focus, .縦メニュー button:focus-visible { border-color: var(--選); background: #34404f; }
/* 戦略版・ストーリーは 戦国・三国志・水滸伝 の横3列（2026-10-18 本人。後で DG6・DG7・DG2-2 を足せる） */
.縦メニュー .横段 { display: grid; grid-template-columns: auto repeat(3, 1fr); gap: 10px; align-items: center; width: min(200%, 96vw); margin-left: calc((100% - min(200%, 96vw)) / 2); }   /* 2026-10-18 本人「横幅倍に増やしていいので戦略版とストーリーのボタンサイズを倍に」。チュートリアル以下は今のまま */
.縦メニュー .横段 .段名 { font-size: 1.1em; color: var(--淡, #bbb); padding-right: 8px; min-width: 6em; text-align: right; }
#タイトル画面 .縦メニュー .横段 .段名 { color: #f2ead6; font-weight: 700; text-shadow: 0 0 4px #000, 0 1px 3px #000, 0 0 10px #000c; }   /* 背景の霧に溶けないように（2026-10-20 無人自走 Q4） */
.縦メニュー .横段 button { padding: 12px 12px; font-size: 1.5em; }   /* 上下の余白は狭く（2026-10-18 本人） */

/* ---------- ゲーム ---------- */
#ゲーム { position: fixed; inset: 0; }
#地図 { position: absolute; inset: 0; width: 100%; height: 100%; display: block; cursor: grab; }
#地図.掴み中 { cursor: grabbing; }

#上部 { position: absolute; top: 6px; left: 250px; right: 8px; height: 40px; display: flex; align-items: center; gap: 14px;
    padding: 0 12px; background: #11151bdd; border: 1px solid var(--線); border-radius: 6px; white-space: nowrap; overflow: hidden; }
#上部 .家 { font-weight: 700; padding: 2px 8px; border-radius: 4px; }
#上部 .資源 { color: var(--淡); font-size: .92em; }
#上部 .資源 b { color: var(--字); font-weight: 600; margin-left: 2px; }
#上部 .資源 b.不足 { color: var(--赤); }
#上部 button.小 { margin-left: auto; }
#上部 button.小 + button.小 { margin-left: 0; }
button.小 { background: var(--面2); border: 1px solid var(--線); border-radius: 4px; padding: 4px 12px; cursor: pointer; }
button.小.停止中 { color: var(--選); border-color: var(--選); }
button.丸 { width: 28px; height: 28px; border-radius: 50%; border: 1px solid var(--線); background: var(--面2); cursor: pointer; padding: 0; font-weight: 700; }

#情報窓 { position: absolute; top: 54px; right: 8px; width: calc(340px * var(--文字倍率)); max-height: calc(100% - 64px); overflow-y: auto;
    background: #11151bee; border: 1px solid var(--線); border-radius: 6px; padding: 10px 12px; }
#情報窓 h2 { margin: 0 0 6px; font-size: 1.2em; display: flex; align-items: baseline; gap: 8px; }
#情報窓 h2 small { font-size: .7em; color: var(--淡); font-weight: 400; }
/* 武将の窓（動かせる。全自城の武将を城ごとに） */
#武将窓 { position: absolute; left: 8px; top: 64px; width: calc(360px * var(--文字倍率)); max-height: calc(100% - 200px); display: flex; flex-direction: column;
    background: #11151bee; border: 1px solid var(--線); border-radius: 6px; z-index: 5; }
#武将窓.掴み中 { opacity: .85; }
.武将窓題 { display: flex; align-items: baseline; gap: 8px; padding: 6px 8px 6px 12px; border-bottom: 1px solid var(--線); cursor: move; user-select: none; touch-action: none; }
.武将窓題 b { color: var(--金); }
.武将窓題 .今の城 { font-weight: 700; flex: 1; }
.武将窓題 .今の城 small { color: var(--淡); font-weight: 400; margin-left: 8px; font-size: .8em; }
.武将窓題 button { align-self: center; width: 24px; height: 24px; }
.武将窓本文 { overflow-y: auto; padding: 4px 8px 8px; contain: content; }
.将群 { border-radius: 4px; margin-top: 4px; }
.武将窓本文 .将群 { content-visibility: auto; contain-intrinsic-size: auto 120px; }   /* 見えていない城の群れは描かない（武将が数百人の家で 50ms を超える枠が出ていた。2026-10-19） */
/* 地方の大きな群れ（▼▼ 九州地方）。城の群れはその中に少し下げて並ぶ */
.地方群 { margin-top: 6px; }
.武将窓題 .地方名切替 { margin-right: 6px; padding: 2px 8px; font-size: .8em; white-space: nowrap; }
.地方題 { cursor: pointer; padding: 4px 4px; background: #ffffff0a; border-bottom: 1px solid var(--線); border-radius: 4px 4px 0 0; font-weight: 700; color: var(--金, #f2d16b); user-select: none; }
.地方題 i { font-style: normal; color: var(--淡); display: inline-block; width: 1.8em; font-size: .75em; letter-spacing: -2px; }
.地方題 small { color: var(--淡); margin-left: 8px; font-size: .8em; font-weight: 400; }
.地方群 > .将群 { margin-left: 6px; }
/* 選んでいる城の欄は枠で囲む（2026-10-13 本人「名前が薄い黄色になるだけでは分かりにくい。リスト自体を囲んで」） */
.将群.今 { outline: 2px solid var(--選); outline-offset: -1px; background: #f2d16b12; }
.将群.今 > .将群題 { color: var(--選); font-weight: 700; }
.将群.落とせる { outline: 2px dashed var(--選); background: #f2d16b14; }
.将群題 { cursor: pointer; padding: 3px 4px; border-bottom: 1px solid var(--線); user-select: none; }
.将群題 i { font-style: normal; color: var(--淡); display: inline-block; width: 1.2em; font-size: .8em; }
.将群題 small { color: var(--淡); margin-left: 8px; font-size: .85em; }
/* 建設の窓（動かせる。全種類を1つの並びに） */
#建設窓 { position: absolute; left: 380px; top: 64px; width: calc(400px * var(--文字倍率)); max-height: calc(100% - 200px); display: flex; flex-direction: column;
    background: #11151bee; border: 1px solid var(--線); border-radius: 6px; z-index: 6; }
#建設窓.掴み中 { opacity: .85; }
#建設窓 .建設窓所 { font-weight: 700; flex: 1; }
#建設窓 .建設窓所 small { color: var(--淡); font-weight: 400; margin-left: 8px; font-size: .8em; }
.建設窓本文 { overflow-y: auto; padding: 2px 8px 8px; }
.建設系 { color: var(--金); font-size: .82em; margin: 8px 2px 2px; border-bottom: 1px solid var(--線); }
.建設行 { display: grid; grid-template-columns: minmax(6em, auto) 1fr auto; gap: 8px; align-items: baseline; width: 100%; text-align: left;
    background: var(--面2); border: 1px solid var(--線); border-radius: 4px; padding: 4px 8px; margin-top: 3px; cursor: pointer; }
.建設行:hover { border-color: var(--選); }
.建設行 .副 { color: var(--淡); font-size: .85em; text-align: right; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.建設行 .費 { font-weight: 700; white-space: nowrap; }
.建設行.無効 { opacity: .45; cursor: default; }
.建設行.無効:hover { border-color: var(--線); }
.浪人群 { margin-top: 10px; }
.浪人群 > .将群題 { color: var(--淡); }
.浪人群.有り > .将群題 { color: var(--緑); font-weight: 700; }
.武将窓題 .浪人数 { color: var(--緑); font-weight: 700; }
.将群 small.所 { color: var(--淡); font-size: .8em; margin-left: 4px; }
.登用ボタン { background: var(--面2); border: 1px solid var(--緑); color: var(--緑); border-radius: 4px; padding: 0 8px; cursor: pointer; font-size: .95em; line-height: 1.5; }
.登用ボタン:hover { background: #6cc07022; }
.将群 .小表 { table-layout: fixed; }
.将群 .小表 td:first-child { width: 38%; overflow: hidden; text-overflow: ellipsis; }
.将群 .小表 td.数 { width: 9%; }
.将群 .小表 td.状態 { width: 26%; overflow: hidden; text-overflow: ellipsis; }
.将群 tr[data-将] { cursor: default; }
.将群 tr.運べる { cursor: grab; }
.将群 tr.運べる:hover td { background: #ffffff0d; }
.将群 tr.運び中 { opacity: .4; }
.表 { display: grid; grid-template-columns: auto 1fr; gap: 2px 12px; margin: 6px 0; }
.表 > span:nth-child(odd) { color: var(--淡); }
.棒 { height: 6px; background: #000; border-radius: 3px; overflow: hidden; margin-top: 2px; }
.棒 > i { display: block; height: 100%; background: var(--緑); }
.節 { margin: 10px 0 4px; color: var(--金); font-size: .9em; border-bottom: 1px solid var(--線); padding-bottom: 2px; }
.命令列 { display: grid; grid-template-columns: repeat(3, 1fr); gap: 6px; margin-top: 8px; }
.命令列 button, .行ボタン { background: var(--面2); border: 1px solid var(--線); border-radius: 4px; padding: 7px 4px; cursor: pointer; }
.命令列 button:hover, .行ボタン:hover, .命令列 button.lv10-focus, .行ボタン.lv10-focus { border-color: var(--選); }
.命令列 button:disabled, .行ボタン:disabled, .行ボタン.無効 { opacity: .4; cursor: default; }
.小表 { width: 100%; border-collapse: collapse; font-size: .9em; }
.小表 td, .小表 th { padding: 2px 4px; text-align: left; white-space: nowrap; }
.小表 th { color: var(--淡); font-weight: 400; }
.小表 td.数 { text-align: right; font-variant-numeric: tabular-nums; }
.女 { color: #f0a0c0; }
.奉行, .女.奉行 { color: #ff9a3c; }   /* 募兵奉行（2026-10-12 本人: 見やすいように橙） */
.状態 { color: var(--淡); font-size: .9em; }

#ログ { position: absolute; left: 260px; bottom: 10px; max-width: 520px; pointer-events: none; display: flex; flex-direction: column; gap: 3px; }
#ログ div { background: #0d1015cc; padding: 3px 10px; border-radius: 4px; font-size: .9em; animation: 消える 9s forwards; }
@keyframes 消える { 0%, 80% { opacity: 1; } 100% { opacity: 0; } }

#大名選択帯 { position: absolute; left: 8px; top: 70px; bottom: 130px; width: calc(340px * var(--文字倍率)); max-width: calc(100vw - 16px); overflow-y: auto;   /* 340: 「長宗我部家 長宗我部元親」が1行に収まる幅（2026-10-16 本人） */
    background: #11151bee; border: 1px solid var(--線); border-radius: 6px; padding: 8px; display: flex; flex-direction: column; gap: 4px; }
#大名選択帯 .節 { margin-top: 0; }
#大名選択帯 .切れ { color: var(--赤); }   /* 登場しない家の領地を封じて城が地続きでない（始められない） */
.元服切替 { flex: none; display: flex; justify-content: space-between; padding: 6px 8px; border: 1px solid var(--線); border-radius: 4px; cursor: pointer; background: var(--面); color: inherit; text-align: left; }
.元服切替 b { color: var(--淡); }
.元服切替.オン b { color: var(--金); }
.元服切替:hover, .元服切替.lv10-focus { border-color: var(--選); }
.大名行 { display: flex; align-items: center; gap: 8px; padding: 6px 8px; border: 1px solid transparent; border-radius: 4px; cursor: pointer; background: var(--面); text-align: left; }
.大名行 .色 { width: 12px; height: 12px; border-radius: 2px; flex: none; }
.大名行 .名 { flex: 1; }
.大名行 .数 { color: var(--淡); font-size: .85em; }
.大名行.選択, .大名行.lv10-focus, .大名行:hover { border-color: var(--選); }

/* ---------- 窓 ---------- */
.窓 { position: fixed; inset: 0; background: #0008; display: flex; align-items: center; justify-content: center; z-index: 5000; }
.窓中 { width: min(calc(560px * var(--文字倍率)), 94vw); max-height: 90vh; overflow-y: auto; background: var(--面); border: 1px solid var(--線); border-radius: 8px; padding: 14px 16px; }
.窓中.小 { width: min(420px, 92vw); }
/* 命令の結果を地図で見せる間（80_UI の UI.演出を見せる）: 窓を薄く・地図の暗さを外す */
.窓 { transition: background-color .2s; }
.窓 .窓中 { transition: opacity .2s; }
.窓.演出中 { background: transparent; }
.窓.演出中 .窓中 { opacity: .15; }
.窓題 { font-size: 1.15em; font-weight: 700; margin-bottom: 10px; display: flex; gap: 10px; align-items: baseline; }
.窓題 small { color: var(--淡); font-weight: 400; font-size: .8em; }
.窓本文 { display: flex; flex-direction: column; gap: 5px; }
.行ボタン { display: flex; align-items: center; gap: 10px; text-align: left; padding: 7px 10px; width: 100%; }
.行ボタン .主 { flex: 1; }
/* 武将の顔（44_顔。索引がある時だけ出る） */
img.顔 { display: inline-block; vertical-align: middle; object-fit: cover; object-position: top; border-radius: 3px; background: #0004; }
img.顔.小 { width: 1.6em; height: 1.6em; margin-right: .35em; }
img.顔.中 { width: 2.8em; height: 2.8em; margin-right: .5em; }
.行ボタン .副 { color: var(--淡); font-size: .88em; font-variant-numeric: tabular-nums; }
.行ボタン.選択 { border-color: var(--金); background: #3a3420; }
.窓下段 { display: flex; gap: 8px; margin-top: 10px; }
.窓下段 button { flex: 1; justify-content: center; }   /* 閉じる・戻る も字を真ん中に（2026-10-12 本人） */
.兵数欄 { display: flex; align-items: center; gap: 8px; }
.兵数欄 input[type=range] { flex: 1; min-width: 60px; }
.兵増列 { display: grid; grid-template-columns: repeat(4, 1fr); gap: 6px; margin-top: 4px; }
.兵増列 .行ボタン { justify-content: center; padding: 6px 4px; }
.行群 { display: grid; gap: 5px; }
.行群 .行ボタン { min-width: 0; }
.行群 .行ボタン .副 { white-space: nowrap; }
.兵数欄 b { min-width: 70px; text-align: right; font-variant-numeric: tabular-nums; }
/* ---------- 結果（天下統一／滅亡）: 窓→題→行の順に出る。押すと .即 で飛ばす ---------- */
#結果窓 { animation: 結果暗転 .8s ease-out both; }
#結果窓 .結果中 { width: min(calc(480px * var(--文字倍率)), 92vw); text-align: center; border-width: 2px; animation: 結果窓入り .6s .3s ease-out both; }
#結果窓 .結果中.勝 { border-color: var(--金); box-shadow: 0 0 40px #e0b84a55; }
#結果窓 .結果中.負 { border-color: #8a3a32; box-shadow: 0 0 40px #e05a4a33; }
#結果窓 .窓題 { justify-content: center; margin-bottom: 6px; }
.結果題 { font-size: calc(46px * var(--文字倍率)); font-weight: 800; letter-spacing: .25em; padding-left: .25em; text-shadow: 0 3px 0 #000;
    animation: 結果題入り 1s .7s cubic-bezier(.2, 1.4, .4, 1) both; }
.勝 .結果題 { color: var(--金); text-shadow: 0 3px 0 #000, 0 0 24px #e0b84aaa; }
.負 .結果題 { color: var(--赤); }
.結果家 { font-size: 1.15em; font-weight: 700; display: flex; justify-content: center; align-items: center; gap: 8px; }
.結果家 small { color: var(--淡); font-weight: 400; }
.結果中 .色 { display: inline-block; width: 12px; height: 12px; border-radius: 2px; flex: none; }
.結果表 { text-align: left; margin: 8px auto; gap: 4px 18px; font-variant-numeric: tabular-nums; }
.結果表 > span:nth-child(even) { text-align: right; }
.結果表 small { color: var(--淡); }
.結果続行 { margin: 10px 4px 0; color: var(--淡); font-size: .9em; text-align: center; }   /* 目標達成の後の続行の案内（80_UI） */
.結果表 .良 { color: var(--緑); }
.結果表 .負 { color: var(--赤); }
.結果年表 { max-height: calc(160px * var(--文字倍率)); overflow-y: auto; text-align: left; font-size: .9em; display: flex; flex-direction: column; gap: 2px;
    padding-right: 8px; scrollbar-color: var(--線) transparent; scrollbar-width: thin; }
.結果年表 > div { display: flex; align-items: center; gap: 8px; color: var(--淡); }
.結果年表 > div.自分 { color: var(--字); }
.結果年表 .日 { width: 6.5em; font-variant-numeric: tabular-nums; }
.結果年表 .名 { flex: 1; }
.結果中 .結果家, .結果表 > span, .結果中 .節, .結果年表, .結果中 .窓下段 { animation: 結果行 .4s calc(1.5s + var(--i, 0) * .12s) ease-out both; }
#結果窓.即, #結果窓.即 * { animation-delay: 0s !important; animation-duration: 0s !important; }
@keyframes 結果暗転 { from { background: #0000; } to { background: #000a; } }
@keyframes 結果窓入り { from { opacity: 0; transform: translateY(20px) scale(.96); } to { opacity: 1; transform: none; } }
@keyframes 結果題入り { 0% { opacity: 0; transform: scale(2.2); letter-spacing: .6em; } 60% { opacity: 1; } 100% { opacity: 1; transform: none; letter-spacing: .25em; } }
@keyframes 結果行 { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: none; } }
.行ボタン .費 { color: var(--字); font-weight: 600; white-space: nowrap; font-variant-numeric: tabular-nums; min-width: 6.5em; text-align: right; }
.窓下段 .決定ボタン { flex: 2; justify-content: center; font-weight: 800; font-size: 1.12em; padding: 10px 12px;
    color: #1a1406; background: linear-gradient(#f2d16b, #d9a93a); border: 2px solid #ffe8a0; }
.窓下段 .決定ボタン:hover, .窓下段 .決定ボタン.lv10-focus { border-color: #fff; box-shadow: 0 0 0 2px var(--金); }
.窓下段 .決定ボタン:disabled { color: var(--淡); background: var(--面2); border: 2px solid var(--線); opacity: .45; box-shadow: none; }
.窓下段 { position: sticky; bottom: -14px; background: var(--面); padding: 8px 0 4px; }
.大名決定 { position: sticky; bottom: -8px; margin-top: 6px; flex: none; padding: 12px 10px; border-radius: 6px; cursor: pointer;
    font-weight: 800; font-size: 1.12em; color: #1a1406; background: linear-gradient(#f2d16b, #d9a93a); border: 2px solid #ffe8a0; box-shadow: 0 -6px 10px #11151b; }
.大名決定:hover, .大名決定.lv10-focus { border-color: #fff; }
#指定帯 { position: absolute; top: 54px; left: 50%; transform: translateX(-50%); z-index: 20; display: flex; align-items: center; gap: 12px;
    max-width: calc(100% - 520px); padding: 8px 14px; background: #11151bee; border: 2px solid var(--金); border-radius: 6px; white-space: nowrap; }
#指定帯 .題 { color: var(--金); font-size: 1.1em; }
#指定帯 .内容 { display: flex; align-items: center; gap: 10px; overflow: hidden; }
#指定帯 .内容 span { color: var(--淡); }
#指定帯 .内容 .日 { color: var(--字); font-weight: 700; }
.窓中.広 { width: min(calc(760px * var(--文字倍率)), 94vw); }
.横組 { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 14px; align-items: start; }
.横組 .左 { display: flex; flex-direction: column; gap: 5px; max-height: calc(90vh - 150px); overflow-y: auto; }
.横組 .右 .節:first-child { margin-top: 0; }
.横組 .右 .命令列 { margin-top: 0; }
.行ボタン:hover:not(.lv10-focus):not(.選択):not(.決定ボタン) { border-color: #7d8899; }
/* ---------- 六角格子の UI（v0.1.6〜） ---------- */
.命令列.四 { grid-template-columns: repeat(4, 1fr); }
.命令列.四 .行ボタン { flex-direction: column; gap: 0; align-items: center; padding: 5px 2px; }
.押せる行 { cursor: pointer; }
.押せる行:hover td { color: var(--選); }
#情報窓 .不足 { color: var(--赤); }
#指定帯.不可 { border-color: var(--線); }
#指定帯.不可 .内容 .日 { color: var(--淡); }
.節 small { color: var(--淡); font-weight: 400; margin-left: 6px; }
.窓本文 > .窓下段 { order: 99; }
.窓下段 .決定ボタン { order: 9; }
/* ---------- 出陣（天道式: 軍勢＝部隊1〜5・陣形）と命令選択 ---------- */
.窓中.特大 { width: min(calc(1120px * var(--文字倍率)), 96vw); max-height: 94vh; }
.出陣組 { display: grid; grid-template-columns: minmax(0, 1fr) calc(260px * var(--文字倍率)); gap: 14px; align-items: start; }
.出左, .出右 { display: flex; flex-direction: column; gap: 5px; min-width: 0; }
.出陣組 .行ボタン { width: auto; padding: 5px 8px; justify-content: center; }
.出陣組 .節:first-child { margin-top: 0; }
.並び替え { display: inline-flex; gap: 4px; margin-left: 10px; }
.並び替え .行ボタン { padding: 1px 8px; font-size: .9em; }
.名札列 { display: flex; flex-wrap: wrap; gap: 4px; max-height: calc(120px * var(--文字倍率)); overflow-y: auto; }
.名札列 .行ボタン { padding: 4px 8px; gap: 6px; }
.名札列 small { color: var(--淡); font-variant-numeric: tabular-nums; }
.一括列 { display: grid; grid-template-columns: repeat(4, 1fr); gap: 6px; margin: 4px 0; }
.部隊行 { display: flex; align-items: center; gap: 4px; padding: 3px 6px; background: var(--面2); border: 1px solid var(--線); border-radius: 4px; min-height: 36px; }
.部隊行.空 { opacity: .55; }
.部隊行 .番 { color: var(--金); width: 3.4em; flex: none; font-size: .9em; }
.部隊行 .将 { flex: 1; min-width: 5em; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.部隊行 .兵 { min-width: 3.6em; text-align: right; font-variant-numeric: tabular-nums; }
.部隊行 .上 { color: var(--淡); min-width: 3.6em; font-variant-numeric: tabular-nums; }
.部隊行 .行ボタン { padding: 3px 6px; font-size: .9em; flex: none; }
.陣形列 { display: grid; grid-template-columns: repeat(5, 1fr); gap: 5px; }
.陣形列 .行ボタン { flex-direction: column; gap: 0; padding: 4px 2px; }
.陣形列 .行ボタン .副 { font-size: .75em; white-space: normal; text-align: center; }
.出右 .表 { margin: 2px 0; }
.表 .良 { color: var(--緑); }
#情報窓 .方針文 { font-size: .9em; }
#命令選択 { position: absolute; right: 8px; bottom: 10px; z-index: 21; width: calc(380px * var(--文字倍率));
    background: #11151bf2; border: 2px solid var(--金); border-radius: 6px; padding: 10px 12px; }
#命令選択 .題 { font-weight: 700; color: var(--金); margin-bottom: 4px; }
#命令選択 .題 small { color: var(--淡); font-weight: 400; margin-left: 6px; }
#命令選択 .方針表 { display: grid; grid-template-columns: auto 1fr 1fr; gap: 4px 6px; align-items: center; margin-top: 6px; }
#命令選択 .方針表 > span { color: var(--淡); font-size: .92em; }
#命令選択 .方針表 .行ボタン { padding: 3px 6px; justify-content: center; }
#命令選択.方針中 .方針表 { outline: 1px dashed var(--選); outline-offset: 3px; }
#命令選択 .窓下段 { position: static; background: none; padding: 0; margin-top: 8px; }
.窓中.特大 .窓下段 { justify-content: flex-end; }
.窓中.特大 .窓下段 button { flex: none; width: auto; min-width: 140px; justify-content: center; }
.窓中.特大 .窓下段 .決定ボタン { min-width: 260px; }
/* ---------- 系統（城の命令・建設）と兵器・適性 ---------- */
.命令列.系統列 { grid-template-columns: repeat(4, 1fr); margin-bottom: 4px; }
.命令列.系統列 button { padding: 4px 2px; font-size: .9em; }
.命令列.系統列 button.選択 { border-color: var(--金); background: #3a3420; }
.タブ列 { display: flex; gap: 4px; margin-bottom: 4px; }
.タブ列 .行ボタン { flex: 1; justify-content: center; padding: 5px 4px; }
.タブ列 .行ボタン small { margin-left: 4px; color: var(--淡); }
.兵器表 { display: grid; grid-template-columns: auto auto 2.2em auto 1fr; gap: 4px 6px; align-items: center; }
.兵器表 > span { color: var(--淡); }
.兵器表 b { text-align: center; }
.兵器表 small { color: var(--淡); }
.兵器表 .行ボタン { padding: 2px 8px; }
.部隊行 .戦法 { color: var(--金); font-size: .82em; flex: none; }
small.一門 { color: var(--金); }
/* 戦略版の大名選択の案内（ストーリー未クリアの人へ5秒。押しても通り抜ける） */
#未クリア案内 { position: fixed; left: 50%; top: 16%; transform: translateX(-50%); width: max-content; max-width: min(calc(560px * var(--文字倍率)), 90vw); padding: 14px 22px;
    background: rgba(20, 24, 31, .94); border: 1px solid var(--金); border-radius: 8px; box-shadow: 0 6px 24px rgba(0, 0, 0, .5);
    color: #f3ead6; line-height: 1.7; text-align: center; pointer-events: none; z-index: 60; opacity: 1; transition: opacity .6s; }
#未クリア案内.消える { opacity: 0; }
small.図鑑 { margin-left: 6px; padding: 0 5px; border: 1px solid var(--線); border-radius: 4px; color: var(--淡); font-weight: normal; }   /* 図鑑（解放）に入っているか（武将の札） */
small.図鑑.済 { border-color: #5fae6a; color: #8fd18f; }
.諸印 { color: #9fd0c0; }
/* ---------- 会話: DG1式の上下フキダシ（共有\www_DG1\セリフ.css の値を写す。見た目を新しく作らない） ---------- */
#会話 { position: fixed; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 100vw; height: 56.25vw; max-height: 100vh; max-width: 177.78vh;
    container-type: size; z-index: 6000; font-family: 'NotoSerifJP', 'Yu Mincho', serif; pointer-events: auto; cursor: pointer; overflow: hidden; }
#会話 .Go吹出 { position: absolute; margin-left: -1.6cqw; width: 100cqw; height: 60cqh; background-size: 100% 100%; background-repeat: no-repeat; pointer-events: none; padding: 0; overflow: visible; }
#会話 .窓_上 { top: 0; }
#会話 .窓_下 { bottom: 0; }
#会話 .Go吹出.配置_左 { left: 2cqw; right: auto; }
#会話 .Go吹出.配置_右 { right: 2cqw; left: auto; }
#会話 .Go吹出.システム発言 { width: 80cqw; height: 28cqh; margin: 1cqw; left: 10cqw; right: auto; font-size: 2cqw; background-color: rgba(63, 63, 63, 0.65);
    border: 1px solid rgba(180, 180, 200, 0.4); border-radius: 8px; }
#会話 .Go吹出.システム発言 .吹出中身 { padding: 3cqh 3cqw; justify-content: center; text-align: center; }
#会話 .Go吹出.システム発言 .吹出名前 { display: none; }
#会話 .吹出中身 { display: flex; flex-direction: column; justify-content: center; box-sizing: border-box; width: 100%; height: 100%; color: #fff;
    text-shadow: 2px 2px 4px #000; padding: 3cqh 5cqw 0 5cqw; }
#会話 .Go吹出.配置_左 .吹出中身 { padding-left: 27cqw; }
#会話 .Go吹出.配置_右 .吹出中身 { padding-right: 28cqw; padding-left: 11.7cqw; padding-top: 13.9cqh; }
#会話 .吹出名前 { position: absolute; font-family: 'MS Gothic', 'ＭＳ ゴシック', monospace; font-size: 1.7cqw; font-weight: bold; color: #fff;
    -webkit-text-stroke: 2px #000; paint-order: stroke fill; text-shadow: none; white-space: nowrap; }
#会話 .窓_上 .吹出名前 { bottom: 10.2cqh; top: auto; left: 29cqw; right: auto; }
#会話 .窓_下 .吹出名前 { top: 23.1cqh; bottom: auto; right: 28cqw; left: auto; }
#会話 .吹出本文 { font-size: 2.6cqw; line-height: 1.5; white-space: pre-wrap; }
#会話 .Go吹出.窓_上 .吹出本文 { padding-left: 25px; margin-right: -25px; }
/* 改行位置（2026-10-07 本人指摘「改行位置がずれる」）: フキダシ画像の暗い所は 上＝横 12〜94%・下＝横 2〜83%。
   DG1 の値のままだと上は右端が画像の外（〜97%）まで出て、下は 72% で早く折り返していた。本文の右端を画像の内側に収める */
#会話 .Go吹出.窓_上.配置_左 .吹出中身 { padding-right: 9cqw; }
#会話 .吹出本文 { line-break: strict; }   /* 行頭に「ょ」「。」などを置かない（禁則） */
#会話 .Go吹出.窓_上 .吹出本文 { margin-right: 0; }
/* 立ち絵の無い間（今は全員）は、立ち絵の場所を空けずにフキダシの内側いっぱいに使う */
#会話 .Go吹出.窓_上.肖像なし .吹出中身 { padding-left: 15cqw; }
#会話 .Go吹出.窓_上.肖像なし .吹出本文 { padding-left: 0; }
#会話 .Go吹出.窓_上.肖像なし .吹出名前 { left: 16cqw; }
#会話 .Go吹出.窓_下.肖像なし .吹出中身 { padding-right: 21cqw; }
#会話 .Go吹出.窓_下.肖像なし .吹出名前 { right: 21cqw; }
#会話 .会話肖像 { position: absolute; height: 55cqh; max-width: 28cqw; object-fit: contain; object-position: bottom; pointer-events: none; }
#会話 .会話肖像.垂直_上 { top: 0; left: 2cqw; }
#会話 .会話肖像.垂直_下 { bottom: 0; right: 2cqw; }
/* ナレーション（話し手の無い行＝システム発言）は立ち絵の余白を取らない（2026-10-16 本人「ナレーション文にもキャラ立ち絵配置の余白が入っている」）。
   上の 肖像なし の左右の余白（15cqw・21cqw）と本文の 25px を打ち消して、枠の内側いっぱい・中央に置く */
#会話 .Go吹出.システム発言.肖像なし .吹出中身, #会話 .Go吹出.システム発言.システム発言 .吹出中身 { padding: 3cqh 3cqw; }
#会話 .Go吹出.システム発言 .吹出本文 { padding-left: 0; margin-right: 0; }
/* フキダシの絵が読めていない間（80_UI 会話絵）: 文の後ろに暗い角丸の枠を敷いて読めるようにする */
#会話 .Go吹出.絵なし .吹出中身 { background: rgba(14, 18, 26, 0.82); border: 2px solid rgba(255, 255, 255, 0.55); border-radius: 2cqw; background-clip: padding-box; }

/* 武将の表（武将一覧・賞罰）: 見出しと行を同じ列の格子に揃える。見出しは押すと並べ替え */
.窓中.武将表 { --表列: minmax(8em, 1.2fr) minmax(4.5em, .8fr) repeat(4, 2.4em) 5em 3.6em 4.6em 5em 3.6em minmax(7em, 1.6fr); overflow-x: auto; }   /* 名 城 統武知政 身分 勲功 役職 官位 忠誠 行動（2026-10-16 本人: 勲功は身分の右） */
.武将表 .表欄:nth-child(7) { padding-left: 1em; }   /* 政 の右に全角1文字分の余白（2026-10-16 本人） */
.武将表 .表見出し, .武将表 .行ボタン .主 { display: grid; grid-template-columns: var(--表列); column-gap: 8px; align-items: center; min-width: 780px; }
.武将表 .表見出し { position: sticky; top: -14px; z-index: 1; background: var(--面); padding: 4px 11px 6px; margin-bottom: 4px; border-bottom: 1px solid var(--線); }
.武将表 .表見出し button { padding: 4px 2px; font-size: .85em; color: var(--淡); background: none; border: 1px solid transparent; border-radius: 4px; text-align: left; white-space: nowrap; }
.武将表 .表見出し button:hover, .武将表 .表見出し button.今 { color: var(--金); border-color: #5a5030; }
.武将表 .表欄 { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.武将表 .行ボタン .表欄 { font-size: .92em; }
.武将表 .行ボタン .表欄:first-child { font-size: 1em; }
.武将表 .表欄.数 { text-align: right; font-variant-numeric: tabular-nums; }
.武将表 .表見出し button:nth-child(n+3):nth-child(-n+6), .武将表 .表見出し button:nth-child(8), .武将表 .表見出し button:nth-child(11) { text-align: right; }

/* 地図の一言: 押しても何も開かない所に、理由を赤字で一瞬出す（区画が一杯・工事中など） */
.地図一言 { position: fixed; z-index: 60; pointer-events: none; white-space: nowrap; color: #ff5040; font-weight: 700; font-size: 1.15em;
    text-shadow: 0 0 3px #000, 0 0 6px #000, 0 1px 2px #000; transform: translate(-50%, -100%); animation: 地図一言 1.4s ease-out forwards; }
@keyframes 地図一言 {
    0% { opacity: 0; transform: translate(-50%, -60%) scale(.7); }
    12% { opacity: 1; transform: translate(-50%, -110%) scale(1.15); }
    24% { transform: translate(-50%, -100%) scale(1); }
    70% { opacity: 1; }
    100% { opacity: 0; transform: translate(-50%, -170%); }
}

/* システム変更: 今の値は金色。登録の書式は2列の欄 */
.系今 { color: var(--金); }
.系書式 { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px 14px; margin: 4px 0 10px; }
.系欄 { display: flex; align-items: center; gap: 8px; }
.系欄.広 { grid-column: 1 / -1; }
.系欄 > span { min-width: 3.5em; color: var(--淡); font-size: .9em; }
.系欄 input, .系欄 select, .系欄 textarea { flex: 1; min-width: 0; padding: 6px 8px; background: #11151b; color: var(--字); border: 1px solid var(--線); border-radius: 4px; font: inherit; }
.系欄 input:focus, .系欄 select:focus, .系欄 textarea:focus { outline: none; border-color: var(--金); }

/* 大名選択の帯のシステム変更（開閉）。灰色＝ゲームの途中では変えられない行 */
.帯系 { flex: none; display: flex; flex-direction: column; gap: 3px; padding: 4px 0 6px; border-bottom: 1px solid var(--線); margin-bottom: 4px; }
.帯系行 { display: flex; flex-direction: column; align-items: flex-start; gap: 1px; padding: 5px 8px; border: 1px solid var(--線); border-radius: 4px; background: var(--面); color: inherit; text-align: left; cursor: pointer; }
.帯系行 .主 { font-size: .9em; }
.帯系行 .副 { font-size: .8em; color: var(--淡); }
.帯系行:hover:not(:disabled), .帯系行.lv10-focus { border-color: var(--選); }
.帯系行.無効, .帯系行:disabled { opacity: .45; cursor: default; }

/* 勢力の配置（大名選択の帯）: 行の右に 登場 の切替、帯の上に ランダム配置／元に戻す */
.配置ボタン { flex: none; display: flex; gap: 4px; margin-bottom: 4px; }
.配置ボタン .元服切替 { flex: 1; justify-content: center; }
/* 武将を選ぶ窓の並べの帯（80_UI 選び並べの帯。2026-10-25） */
.選び並べ { display: flex; flex-wrap: wrap; gap: 4px; margin: 0 0 6px; }
.選び並べ button { padding: 2px 10px; font-size: .85em; line-height: 1.6; background: rgba(0,0,0,.25); color: #cfd6e0; border: 1px solid rgba(255,255,255,.18); border-radius: 4px; cursor: pointer; }
.選び並べ button.今 { color: #f2d16b; border-color: #c9a24a; }
.配置記録 { flex-wrap: wrap; }   /* 配置記録1〜4（2026-10-24）: 2つずつ2段。押す＝戻す・右の「記録」＝今の配置を残す */
.配置記録枠 { flex: 1 1 calc(50% - 2px); display: flex; gap: 2px; min-width: 0; }
.配置記録枠 .記録押し { flex: none; padding-left: 6px; padding-right: 6px; font-size: .85em; }
.配置記録枠 .元服切替.空 { opacity: .45; }
.配置記録枠 .元服切替 { white-space: nowrap; min-width: 0; padding-left: 4px; padding-right: 4px; }
.配置記録枠 small { margin-left: .3em; color: var(--淡); font-size: .78em; }
.大名行枠 { flex: none; display: flex; gap: 3px; align-items: stretch; }
.大名行枠 .大名行 { flex: 1; min-width: 0; }
.大名行枠.不登場 .大名行 { opacity: .4; cursor: default; }
.登場切替 { flex: none; width: 2.2em; padding: 0; border: 1px solid var(--線); border-radius: 4px; background: var(--面); color: var(--淡); cursor: pointer; font-weight: 700; }
.登場切替.オン { color: var(--金); border-color: #5a5030; }
.登場切替:hover, .登場切替.lv10-focus { border-color: var(--選); }
/* 一括登場（2026-10-18 本人。80_UI 一括の欄） */
.一括行 .一括名 { cursor: default; }
.一括行 .登場切替 { width: 3.4em; font-size: 0.9em; }

/* 広い一覧（武将の登録・出現・家宝）: 名・城・印は1行に収める（2026-10-08 本人: 部分的に2行になるのは良くない） */
.窓中.広 .行ボタン .主, .窓中.広 .行ボタン .副 { white-space: nowrap; }
.窓中.広 .行ボタン .主 small { white-space: nowrap; }

/* 文字の範囲選択をさせない（2026-10-08 本人）。文字を打つ欄だけ選べる */
body { -webkit-user-select: none; user-select: none; }
input, textarea { -webkit-user-select: text; user-select: text; }

/* 収支の窓・HUD の詳細ボタン */
#上部 .詳細ボタン { margin-left: 4px; padding: 1px 8px; font-size: .8em; border-radius: 4px; background: var(--面); color: var(--字); border: 1px solid var(--金); cursor: pointer; }
.収支要 { display: flex; flex-wrap: wrap; gap: 6px 22px; margin: 2px 0 6px; }
.収支要 b { font-size: 1.1em; font-variant-numeric: tabular-nums; }
.収支注 { color: var(--淡); font-size: .82em; margin-bottom: 8px; }
.収支表 { width: 100%; border-collapse: collapse; font-size: .9em; }
.収支表 th { color: var(--淡); font-weight: 400; text-align: right; padding: 4px 6px; border-bottom: 1px solid var(--線); white-space: nowrap; position: sticky; top: -14px; background: var(--面); }
.収支表 th:first-child, .収支表 td:first-child { text-align: left; }
.収支表 td { padding: 4px 6px; border-bottom: 1px solid #ffffff10; white-space: nowrap; }
.収支表 td.数 { text-align: right; font-variant-numeric: tabular-nums; }
.収支表 tr[data-収支城] { cursor: pointer; }
.収支表 tr[data-収支城]:hover { background: #ffffff0d; }
.収支表 .計 { color: var(--金); }
.収支表 .計行 td { border-top: 1px solid var(--線); font-weight: 700; }
.収支表 .淡, .収支表 td.淡 { color: var(--淡); }
.収支表 .赤, .収支要 .赤 { color: #ff7a6a; }
/* 2026-10-12 本人: 兵｜金｜兵糧｜物資 を縦線で区切る */
.収支表 .区 { border-left: 2px solid var(--線); }
.収支表 .群見 th { text-align: center; color: var(--金); font-weight: 700; border-bottom: none; top: -14px; }
.収支表 .群見 + tr th { top: 12px; }
.収支要 .収支組 { display: inline-flex; gap: 6px; align-items: baseline; }
.収支要 .収支組.区 { border-left: 2px solid var(--線); padding-left: 22px; }
.収支要 .収支名 { color: var(--金); font-weight: 700; }

/* 武将の窓の複数選び（Shift＋押す） */
#武将窓 tr.選び中 td { background: #3a3420; }
#武将窓 tr.選び中 td:first-child { box-shadow: inset 3px 0 0 var(--金); }
/* 出陣の窓（82_出陣窓。左下・mp3 ミニプレーヤーの上） */
#出陣窓 { position: absolute; left: 8px; bottom: 130px; width: calc(580px * var(--文字倍率)); max-width: calc(100vw - 16px);   /* 380→580: 主力軍の行に ○○勢と出撃の今を出す（2026-10-16 本人「横幅200px増やしていい」） */ max-height: calc(100% - 330px); min-height: 0; display: flex; flex-direction: column;
    background: #11151bee; border: 1px solid var(--線); border-radius: 6px; z-index: 4; }
#出陣窓.掴み中 { opacity: .85; }
/* 人物のひとこと（88_台詞）: 画面の下の真ん中に顔つきの吹き出し・札の中の1行 */
#台詞吹き出し { position: fixed; left: 50%; bottom: 150px; transform: translateX(-50%); z-index: 30; display: flex; flex-direction: column; gap: 6px; pointer-events: none; align-items: center; }
#台詞吹き出し .台詞 { display: flex; align-items: center; gap: 10px; padding: 6px 14px 6px 6px; background: #11151bf0; border: 1px solid var(--金); border-radius: 26px; box-shadow: 0 4px 14px #0008;
    animation: 台詞出る .25s ease-out; transition: opacity .6s; max-width: min(640px, 90vw); }
#台詞吹き出し .台詞.消える { opacity: 0; }
#台詞吹き出し .台詞 img { width: 44px; height: 44px; border-radius: 50%; object-fit: cover; object-position: top; border: 2px solid var(--線); background: #0c0f14; }
#台詞吹き出し .台詞 b { display: block; color: var(--金); font-size: .85em; }
#台詞吹き出し .台詞 b.女 { color: #f0a0c0; }
#台詞吹き出し .台詞 span { font-size: 1.05em; }
@keyframes 台詞出る { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: none; } }
.札台詞 { margin: 6px 2px 0; padding: 6px 10px; border-left: 3px solid var(--金); color: #e8e0c8; font-size: .92em; background: #ffffff08; }
/* 台詞は「
」の改行を見せ、行頭に句読点・小さい字を置かない（禁則）。短い1字だけの行も作らない（2026-10-19 本人「改行機能がない。行頭禁則が出て見づらい」） */
.札台詞, #台詞吹き出し .台詞 span, #会話 .吹出本文 { white-space: pre-wrap; line-break: strict; word-break: normal; word-break: auto-phrase; overflow-wrap: break-word; text-wrap: pretty; }   /* auto-phrase＝文節で折る（「終わら／ぬ」のように語の途中で折らない。Chrome・lang=ja） */
/* 進行の窓（87_進行窓。HUD の ⧉ で取り出す） */
#進行窓 { position: absolute; display: flex; align-items: center; gap: 6px; padding: 5px 6px; background: #11151bee; border: 1px solid var(--線); border-radius: 6px; z-index: 5; }
#進行窓[hidden] { display: none; }
#進行窓.掴み中 { opacity: .85; }
#進行窓 .進行窓題 { cursor: move; user-select: none; touch-action: none; color: var(--淡); padding: 0 4px; font-size: 1.1em; }
#進行窓 [data-進行窓="閉"] { width: 22px; height: 22px; }
#進行窓ボタン.押し中 { border-color: var(--金); color: var(--金); }
/* 全図（88_全図。HUD の「全図」で出す／しまう） */
#全図 { position: absolute; padding: 0 4px 4px; background: #11151bee; border: 1px solid var(--線); border-radius: 6px; z-index: 4; box-shadow: 0 2px 10px #0008; }
#全図[hidden] { display: none; }
#全図.掴み中 { opacity: .85; }
#全図 .全図題 { display: flex; align-items: center; justify-content: space-between; gap: 6px; cursor: move; user-select: none; touch-action: none; color: var(--淡); font-size: .85em; padding: 2px 0 3px 2px; }
#全図 .全図題 button { width: 20px; height: 20px; }
#全図 .全図絵 { display: block; cursor: crosshair; touch-action: none; border-radius: 3px; }
#全図ボタン.押し中 { border-color: var(--金); color: var(--金); }
#全図 .全図帯 { display: flex; height: 8px; margin-top: 4px; border-radius: 2px; overflow: hidden; background: #0008; }
#全図 .全図帯 i { display: block; min-width: 1px; box-shadow: inset -1px 0 0 #0009; cursor: pointer; }
#全図 .全図帯 i.自 { box-shadow: inset 0 0 0 1.5px var(--金); }
/* 武将の窓の列の見出し（81_武将窓見出し）。列の幅は .将群 .小表 と同じ。左は 地方群 の中の城の群れの字下げ（6px）に合わせる */
.武将窓見出し { padding: 2px 8px 2px 14px; border-bottom: 1px solid var(--線); }
.武将窓見出し .小表 { table-layout: fixed; font-size: .8em; }
.武将窓見出し td { color: var(--淡); padding-top: 0; padding-bottom: 0; }
.武将窓見出し td:first-child { width: 38%; padding-left: 22px; }
.武将窓見出し td.数 { width: 9%; }
.武将窓見出し td.状態 { width: 26%; }
.武将窓見出し .待機だけ切替 { font-size: .9em; padding: 0 6px; margin-left: 4px; line-height: 1.5; }
.武将窓見出し .待機だけ切替.押し中 { border-color: var(--金); color: var(--金); }
#武将窓.待機だけ .将群:not(.浪人群) tr[data-将]:not(.運べる) { display: none; }
/* 能力の数字の色（81_能力色）: 90〜＝明るい金の太字・80〜＝金・〜39＝灰 */
.能高 { color: #ffd76a !important; font-weight: 700; }
.能良 { color: #e3c56a !important; }
.能低 { color: #8a909a !important; }
.能極 { color: #7ee08f !important; font-weight: 700; }   /* 120（上限）＝緑 */
/* 家紋（81_家紋。SVG の図形だけ） */
.家紋枠 { display: inline-block; vertical-align: -0.22em; line-height: 0; }
.家紋枠 svg.家紋 { width: 1.25em; height: 1.25em; display: block; }
#表示_家紋 svg.家紋 { width: 26px; height: 26px; }
#上部 #表示_家紋 { margin-right: -8px; }
.大名紋 { margin-right: 6px; }
.題紋 { margin-right: 4px; vertical-align: -0.25em; }
/* 城一覧の表（83_城一覧。80_UI の 武将表 の css に列だけ替える） */
.窓中.武将表[data-型="城表"] { --表列: minmax(7em, 1.2fr) minmax(6em, 1fr) 7em 7em 3em 3em 3em 4em 4em 4.5em 5em 5em; }
.窓中[data-型="城表"] .表見出し button:nth-child(n+3) { text-align: right; }
.窓中[data-型="城表"] .表欄:nth-child(7) { padding-left: 0; }
.窓中[data-型="城表"] .表欄 small { color: var(--淡); font-size: .85em; }
/* 部隊一覧の表（83_部隊一覧） */
.窓中.武将表[data-型="部隊表"] { --表列: minmax(9em, 1.4fr) minmax(6em, 1fr) 7em 3.5em 3.5em minmax(6em, 1fr) 3em 3em 4em; }
.窓中[data-型="部隊表"] .表見出し button:nth-child(3), .窓中[data-型="部隊表"] .表見出し button:nth-child(n+7) { text-align: right; }
.窓中[data-型="部隊表"] .表見出し button:nth-child(4), .窓中[data-型="部隊表"] .表見出し button:nth-child(5), .窓中[data-型="部隊表"] .表見出し button:nth-child(6) { text-align: left; }
.窓中[data-型="部隊表"] .表欄:nth-child(7) { padding-left: 0; }
.窓中[data-型="部隊表"] .表欄 small { color: var(--淡); font-size: .85em; }
.窓中[data-型="部隊表"] .表欄 .不足 { color: var(--赤); }
/* 画面下の知らせ（88_知らせ）: 自家＝金の縁・合戦＝赤の縁・城の知らせは押せる */
#ログ div.知_自 { box-shadow: inset 3px 0 0 var(--金); }
#ログ div.知_戦 { box-shadow: inset 3px 0 0 #e0503c; }
#ログ div.知_押せる { pointer-events: auto; cursor: pointer; }
#ログ div.知_押せる:hover { background: #2a2f38ee; }
#ログ div .家紋枠 svg.家紋 { width: 1.1em; height: 1.1em; }
/* 記録の窓の切り替え（83_記録） */
.記録札 { display: flex; gap: 6px; margin: 2px 0 8px; }
.記録札 button { min-width: 4.5em; }
.記録札 button.今 { border-color: var(--金); color: var(--金); }
/* 指し札（88_指し札。地図の城・部隊にマウスを止めると出る） */
#指し札 { position: fixed; z-index: 30; pointer-events: none; background: #0f1318f2; border: 1px solid var(--線); border-radius: 6px; padding: 5px 9px 6px; font-size: .86em; box-shadow: 0 3px 12px #000a; min-width: 150px; }
#指し札[hidden] { display: none; }
#指し札 .指し札題 { display: flex; align-items: center; gap: 5px; margin-bottom: 3px; white-space: nowrap; }
#指し札 .指し札題 small { color: var(--淡); margin-left: 4px; }
#指し札 table { border-collapse: collapse; }
#指し札 td { padding: 0 8px 0 0; white-space: nowrap; }
#指し札 td:first-child { color: var(--淡); }
#指し札 td + td { font-variant-numeric: tabular-nums; }
.大名紋 svg.家紋 { width: 20px; height: 20px; }
#出陣窓.畳 { width: auto; }
#出陣窓.空 { width: auto; min-width: calc(200px * var(--文字倍率)); } #出陣窓.空 .出陣窓本文 { display: none; }   /* 部隊も主力軍も攻めて来る敵も無い時は題の帯だけ（自走の仮採用 Q88） */
#出陣窓 .出陣数 { flex: 1; color: var(--淡); font-size: .85em; }
.出陣窓本文 { overflow-y: auto; padding: 2px 6px 6px; }
.出陣行 { display: grid; grid-template-columns: minmax(6.5em, 1.3fr) 4.2em 4.5em minmax(4em, 1fr) 3.2em; gap: 6px; align-items: baseline; width: 100%; text-align: left;
    background: transparent; border: 1px solid transparent; border-radius: 4px; padding: 3px 4px; cursor: pointer; font-size: .9em; }
.出陣行:hover { border-color: var(--選); }
.出陣行.選択 { background: #2a2414; border-color: var(--選); }
.出陣行 span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.出陣行 .名 i { font-style: normal; margin-right: 3px; }
.出陣行 .兵, .出陣行 .糧 { text-align: right; }
.出陣行 .先 { color: var(--淡); }
.出陣行 .不足 { color: var(--赤); }
.出陣なし { color: var(--淡); padding: 4px 6px; }
.出陣見出し { padding: 4px 6px 2px; font-size: .82em; color: var(--淡); border-top: 1px solid var(--線); }
.出陣見出し.敵 { color: var(--赤); display: flex; align-items: center; justify-content: space-between; gap: 6px; }
.出陣見出し .並び切替 { padding: 1px 8px; border: 1px solid var(--線); border-radius: 4px; background: var(--面2); color: var(--淡); font-size: 1em; cursor: pointer; }
.出陣見出し .並び切替:hover { border-color: var(--選); color: inherit; }
.出陣行.敵行 { background: rgba(160, 40, 40, .12); }
.出陣行 .家 { color: var(--淡); font-size: .85em; text-align: right; }
.主力行 { display: flex; align-items: center; gap: 6px; padding: 3px 4px; border-bottom: 1px solid var(--線); font-size: .9em; cursor: pointer; }   /* 押すとその組の所へ地図を寄せる（82_出陣窓） */
.主力行:hover { background: #ffffff0d; }
.主力行 b { color: var(--金); white-space: nowrap; }   /* ○○勢（大将の名） */
.主力行 small { color: var(--淡); white-space: nowrap; }
.主力行 .状 { flex: 1; color: var(--淡); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.主力行 .兵 { text-align: right; white-space: nowrap; font-variant-numeric: tabular-nums; }   /* 出撃できる兵（出陣中は部隊の兵）。+N人＝加わる近くの武将 */
.主力行 .兵.淡 { color: var(--淡); }
.主力行 .小ボタン { padding: 2px 8px; border: 1px solid var(--線); border-radius: 4px; background: var(--面2); cursor: pointer; }
.主力行 .小ボタン:hover:not(:disabled) { border-color: var(--選); }
.主力行 .小ボタン:disabled { opacity: .45; cursor: default; }
/* ストーリーモードの一覧（80_UI の 窓型 '話'）: 系列の見出しと、字下げした幕・編。説明は出さない（2026-10-09 本人の並び） */
.窓中[data-型="話"] { width: min(calc(900px * var(--文字倍率)), 94vw); }
.窓中[data-型="話"] .行ボタン.話見出し, .窓中[data-型="話"] .行ボタン.話見出し:disabled { opacity: 1; background: transparent; border: none; cursor: default; pointer-events: none; color: var(--金); font-weight: 700; padding: 10px 4px 2px; }
.窓中[data-型="話"] .行ボタン.話項 .主 { display: flex; align-items: baseline; gap: 14px; white-space: nowrap; overflow: hidden; }
.窓中[data-型="話"] .行ボタン.段1 { margin-left: 18px; width: calc(100% - 18px); }
.窓中[data-型="話"] .行ボタン.段2 { margin-left: 48px; width: calc(100% - 48px); }   /* 外伝・閑話は本編より 30px 下げる */
.窓中[data-型="話"] .幕名 { min-width: 3.5em; color: var(--淡); }
.窓中[data-型="話"] .話名 { font-weight: 700; }
.窓中[data-型="話"] .話副題 { color: var(--淡); font-size: .9em; overflow: hidden; text-overflow: ellipsis; }
.窓中[data-型="話"] .話済 { margin-left: auto; flex: none; padding-left: 10px; color: #ffd84a; font-weight: 800; letter-spacing: .06em; }   /* クリア済みの印（右に黄色で CLEAR。2026-10-12 本人） */
.窓中[data-型="話"] .話鍵 { margin-right: -6px; }   /* 遊べない話（準備中・前の幕の後・DLC）の鍵 */
/* 鍵の印（2026-10-24 本人「PCによって表示されないものがある。使う部分だけ差し替え」）: 中の絵文字 🔒 は字体しだいで出ないので隠し、同じ形を SVG の型抜きで描く */
.話鍵 { display: inline-block; width: 1em; height: 1em; vertical-align: -0.14em; overflow: hidden; text-indent: 2em; white-space: nowrap; flex: none;
    background-color: #d8c08a; -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M4.5 7V5a3.5 3.5 0 0 1 7 0v2h.5a1 1 0 0 1 1 1v6a1 1 0 0 1-1 1H4a1 1 0 0 1-1-1V8a1 1 0 0 1 1-1zm1.8 0h3.4V5a1.7 1.7 0 0 0-3.4 0zM8 9.2a1.1 1.1 0 0 0-.6 2v1.3h1.2v-1.3a1.1 1.1 0 0 0-.6-2z' fill-rule='evenodd'/%3E%3C/svg%3E") center / contain no-repeat;
    mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M4.5 7V5a3.5 3.5 0 0 1 7 0v2h.5a1 1 0 0 1 1 1v6a1 1 0 0 1-1 1H4a1 1 0 0 1-1-1V8a1 1 0 0 1 1-1zm1.8 0h3.4V5a1.7 1.7 0 0 0-3.4 0zM8 9.2a1.1 1.1 0 0 0-.6 2v1.3h1.2v-1.3a1.1 1.1 0 0 0-.6-2z' fill-rule='evenodd'/%3E%3C/svg%3E") center / contain no-repeat; }
.窓中[data-型="話"] .話DLC { flex: none; padding: 1px 8px; border: 1px solid #ffd84a; border-radius: 4px; color: #ffd84a; font-size: .8em; font-weight: 800; letter-spacing: .04em; }   /* 話ごとの DLC の値段の印（2026-10-18 本人） */
/* 武将の登録（80_UI の 窓型 '武将登録'）: シリーズの見出しと、ストーリーの人物の書き換えの DLC の値段（2026-10-18 本人） */
.窓中[data-型="武将登録"] .行ボタン.話見出し, .窓中[data-型="武将登録"] .行ボタン.話見出し:disabled { opacity: 1; background: transparent; border: none; cursor: default; pointer-events: none; color: var(--金); font-weight: 700; padding: 12px 4px 2px; }
.窓中[data-型="武将登録"] .行ボタン.話見出し .主 { display: flex; align-items: center; gap: 12px; }
.窓中[data-型="武将登録"] .行ボタン.小見出し, .窓中[data-型="武将登録"] .行ボタン.小見出し:disabled { color: var(--淡); font-size: .92em; padding: 6px 4px 0 18px; }
.窓中[data-型="武将登録"] .登表 button:not(.今) { color: var(--淡); opacity: .6; }   /* 表示の切り替え: 金の枠＝表示・薄い＝非表示 */
.窓中[data-型="武将登録"] .行ボタン.畳見出し { pointer-events: auto; cursor: pointer; }   /* シリーズの見出しを押すとたたむ／開く */
.窓中[data-型="武将登録"] .行ボタン.畳見出し:hover, .窓中[data-型="武将登録"] .行ボタン.畳見出し:focus-visible { text-decoration: underline; }
.窓中[data-型="武将登録"] .話DLC { flex: none; padding: 1px 8px; border: 1px solid #ffd84a; border-radius: 4px; color: #ffd84a; font-size: .8em; font-weight: 800; letter-spacing: .04em; }
.窓中[data-型="武将登録"] .話鍵 { margin-right: 6px; }
.窓中[data-型="話"] .話量 { flex: none; padding: 1px 8px; border: 1px solid #6cb4ff; border-radius: 4px; color: #6cb4ff; font-size: .8em; font-weight: 800; letter-spacing: .04em; }   /* 話のボリューム（大・中・小。青の枠と文字・DLC の枠と同じ大きさ。2026-10-18 本人） */
.窓中[data-型="話"] .行ボタン.話項:disabled, .窓中[data-型="話"] .行ボタン.話項.無効 { opacity: 1; }   /* 鍵の話も DLC の枠（黄）とボリューム（青）は薄めない。ほかの文字だけ薄くする */
.窓中[data-型="話"] .行ボタン.話項:disabled .主 > :not(.話DLC):not(.話量), .窓中[data-型="話"] .行ボタン.話項.無効 .主 > :not(.話DLC):not(.話量) { opacity: .4; }
/* クリアの窓（84_終幕） */
.クリア窓 { text-align: center; padding: 6px 4px 12px; }
.クリア窓 .クリア題 { font-size: 1.8em; font-weight: 700; color: var(--金); letter-spacing: .15em; }
.クリア窓 .クリア祝 { margin: 6px 0 14px; }
.クリア窓 .クリア品 { margin: 10px auto; padding: 10px 12px; max-width: 30em; border: 1px solid var(--線); border-radius: 6px; background: #2a2414; line-height: 1.6; }
.クリア窓 .クリア品.淡 { background: transparent; color: var(--淡); }


/* 武将の編集の一覧（86_武将編集。2026-10-16 本人「能力の並べ替えと組分け（D&D・組の名の追加と変更）」） */
.編一覧 { display: flex; flex-direction: column; gap: 5px; }
.編道具 { display: flex; flex-wrap: wrap; align-items: center; gap: 4px; padding: 2px 0 6px; border-bottom: 1px solid var(--線); }
.編道具 > span { color: var(--淡); font-size: .85em; margin-right: 2px; }
.編道具 button { background: var(--面2); border: 1px solid var(--線); border-radius: 4px; padding: 3px 9px; cursor: pointer; font-size: .9em; }
.編道具 button.今 { border-color: var(--金); color: var(--金); }
.編道具 button.組追加 { margin-left: auto; }
.編組 { display: flex; flex-direction: column; gap: 4px; border: 1px solid transparent; border-radius: 5px; padding: 2px; }
.編組.落とし先 { border-color: var(--金); background: #3a342033; }
.編組頭 { display: flex; align-items: center; gap: 6px; padding: 4px 6px; background: var(--面); border: 1px solid var(--線); border-radius: 4px; cursor: grab; }
.編組頭 .編組名 { font-weight: 700; color: var(--金); }
.編組頭 small { color: var(--淡); }
.編組頭 button { background: transparent; border: 1px solid transparent; border-radius: 3px; padding: 1px 6px; cursor: pointer; color: var(--淡); }
.編組頭 button:hover { border-color: var(--線); color: var(--字); }
.編組頭 .右寄 { margin-left: auto; }
.編組頭 input { flex: 1; min-width: 0; padding: 3px 6px; background: #11151b; color: var(--字); border: 1px solid var(--金); border-radius: 4px; font: inherit; }
.編組中 { display: flex; flex-direction: column; gap: 4px; padding-left: 10px; min-height: 6px; }
.編行[draggable="true"] { cursor: grab; }
.編行.運び中 { opacity: .45; }
.配置表 { display: grid; grid-template-columns: 3.2em minmax(0, 1.2fr) minmax(0, 1.4fr) minmax(0, .9fr); gap: 6px 8px; align-items: center; margin: 2px 0 10px; }
.配置表 > b { color: var(--金); }
.配置表 select { min-width: 0; padding: 5px 6px; background: #11151b; color: var(--字); border: 1px solid var(--線); border-radius: 4px; font: inherit; }
.配置表 select:disabled { opacity: .5; }
.配置表 .配今 { grid-column: 2 / -1; margin-top: -3px; color: var(--淡); font-size: .85em; }

/* 武将の詳細の家宝（80_UI 武将の家宝欄。2026-10-16 本人「武将詳細にも家宝を。D&D で装備」）: 持つ欄へ蔵の札をドラッグで与える */
.宝欄 { display: flex; flex-direction: column; gap: 4px; margin: 0 0 8px; }
.宝見 { color: var(--金); font-size: .9em; }
.宝見 small { color: var(--淡); margin-left: 4px; }
.宝持, .宝蔵 { display: flex; flex-wrap: wrap; gap: 4px; min-height: 2em; padding: 4px; border: 1px dashed var(--線); border-radius: 4px; }
.宝持.落とし先 { border-color: var(--金); background: #3a342033; }
.宝札 { display: inline-flex; align-items: baseline; gap: 2px; padding: 2px 8px; border: 1px solid var(--線); border-radius: 12px; background: var(--面2); font-size: .9em; white-space: nowrap; }
.宝札 small { color: var(--淡); }
.宝札.運べる { cursor: grab; }
.宝札.運べる:hover { border-color: var(--選); }
.宝札.運び中 { opacity: .45; }
/* 大名選択の家の札（88_大名札。自走の仮採用 10-20 券 Q21） */
#大名札 { position: absolute; top: 12px; right: 12px; width: calc(300px * var(--文字倍率)); max-width: calc(100vw - 380px * var(--文字倍率)); padding: 10px 12px; background: #11151bf0; border: 1px solid var(--線); border-top: 3px solid var(--家色, var(--選)); border-radius: 8px; z-index: 5; box-shadow: 0 4px 16px #0009; display: flex; flex-direction: column; gap: 8px; }
#大名札[hidden] { display: none; }
#大名札 .札題 { display: flex; align-items: center; gap: 8px; }
#大名札 .札題 svg.家紋 { width: 30px; height: 30px; flex: none; }
#大名札 .札名 { font-size: 1.25em; font-weight: 700; }
#大名札 .札題 small { margin-left: auto; color: var(--淡); }
#大名札 .札主 { display: flex; gap: 10px; align-items: center; }
#大名札 .札顔 { width: 72px; height: 72px; flex: none; object-fit: cover; object-position: top; object-view-box: inset(2% 22% 42% 22%); border: 2px solid var(--家色, var(--線)); border-radius: 6px; background: #0c0f14; }
#大名札 .札顔.無 { background: #1e242d; }
#大名札 .札主名 { font-size: 1.1em; font-weight: 700; }
#大名札 .札主名 small { color: var(--淡); font-weight: 400; }
#大名札 .札能 { display: flex; gap: 10px; margin-top: 4px; color: var(--淡); }
#大名札 .札能 b { color: #e6e9ee; margin-left: 2px; font-size: 1.1em; }
#大名札 .札数 { display: grid; grid-template-columns: repeat(4, auto); gap: 3px 12px; font-size: .9em; color: var(--淡); border-top: 1px solid var(--線); padding-top: 6px; }
#大名札 .札数 b { color: #e6e9ee; margin-left: 4px; font-weight: 600; }
#大名札 .札隣 { display: flex; flex-wrap: wrap; align-items: center; gap: 4px; border-top: 1px solid var(--線); padding-top: 6px; }
#大名札 .札隣 > small { color: var(--淡); margin-right: 2px; }
#大名札 .札隣 button { display: inline-flex; align-items: center; gap: 3px; padding: 2px 6px 2px 3px; border: 1px solid var(--線); border-radius: 12px; background: var(--面2); color: inherit; font-size: .85em; cursor: pointer; }
#大名札 .札隣 button:hover { border-color: var(--選); }
#大名札 .札隣 svg.家紋 { width: 16px; height: 16px; }
#大名札 .札無 { color: var(--淡); font-size: .85em; }
/* 勢力一覧の表（83_勢力一覧。自走の仮採用 10-20 券 Q22） */
.窓中.武将表[data-型="勢力表"] { --表列: minmax(8em, 1.3fr) minmax(6em, 1fr) 3.5em 5.5em 4em minmax(6.5em, .8fr) 4.5em minmax(5em, .8fr) 3em; }
.窓中[data-型="勢力表"] .表見出し button:nth-child(3), .窓中[data-型="勢力表"] .表見出し button:nth-child(4), .窓中[data-型="勢力表"] .表見出し button:nth-child(5), .窓中[data-型="勢力表"] .表見出し button:nth-child(7) { text-align: right; }
.窓中[data-型="勢力表"] .表欄:nth-child(9) { text-align: center; color: var(--選); }
.窓中[data-型="勢力表"] .表欄 small { color: var(--淡); font-size: .85em; }
.窓中[data-型="勢力表"] .表欄 .朝敵 { color: var(--赤); }
.窓中[data-型="勢力表"] .自家行 { border-color: var(--選); }
.勢表切替 { display: flex; justify-content: flex-end; margin: 0 0 4px; }
.勢表切替 button { min-width: 6em; }
.窓中[data-型="勢力表"] .表見出し button:nth-child(6), .窓中[data-型="勢力表"] .表見出し button:nth-child(8) { text-align: left; }
.窓中[data-型="勢力表"] .表見出し button:nth-child(9) { text-align: center; }
/* 城の情報の隣の城（88_隣城。自走の仮採用 10-20 券 Q23） */
#情報窓 .隣城欄 { display: flex; flex-wrap: wrap; gap: 4px; margin-bottom: 6px; }
#情報窓 .隣城 { display: inline-flex; align-items: center; gap: 4px; padding: 2px 7px 2px 3px; min-height: 0; border: 1px solid var(--線); border-radius: 12px; background: var(--面2); color: inherit; font-size: .85em; cursor: pointer; }
#情報窓 .隣城:hover { border-color: var(--選); }
#情報窓 .隣城.自 { border-color: #b8954a; }
#情報窓 .隣城.盟 { border-color: #5fae6e; }
#情報窓 .隣城.停 { border-color: #6f8fb0; }
#情報窓 .隣城 svg.家紋 { width: 16px; height: 16px; flex: none; }
#情報窓 .隣城 .隣色 { width: 10px; height: 10px; border-radius: 2px; display: inline-block; }
#情報窓 .隣城 b { font-weight: 600; color: #e6e9ee; }
#情報窓 .隣城 b.強 { color: var(--赤); }
/* HUD の月の差し引き（88_月差。自走の仮採用 10-20 券 Q25） */
#上部 .月差 { margin-left: 3px; font-size: .78em; color: var(--淡); }
#上部 .月差.増 { color: #7cc48a; }
#上部 .月差.減 { color: var(--赤); }
@media (max-width: 1280px) { #上部 .月差 { display: none; } }
/* タイトルの続きからの概要（88_続き札。自走の仮採用 10-20 券 Q26） */
#タイトル画面 button[data-題="続き"] .続き概要 { display: block; margin-top: 2px; font-size: .72em; color: var(--淡); }
/* 武将の札の能力の棒（81_能力色。自走の仮採用 10-20 券 Q28） */
#武将札 .札能 .能柱 { display: inline-grid; grid-template-columns: auto auto; align-items: baseline; column-gap: 3px; min-width: 64px; margin-right: 6px; }
#武将札 .札能 .能柱 b { margin-left: 0; }
#武将札 .札能 .能値 { text-align: right; }
#武将札 .札能 .能棒 { grid-column: 1 / 3; display: block; height: 3px; margin-top: 2px; border-radius: 2px; background: linear-gradient(90deg, #8fb7e0 var(--能), #ffffff1a var(--能)); }
#武将札 .札能 .能棒.能良 { background: linear-gradient(90deg, #e3c56a var(--能), #ffffff1a var(--能)); }
#武将札 .札能 .能棒.能高 { background: linear-gradient(90deg, #ffd76a var(--能), #ffffff1a var(--能)); box-shadow: 0 0 4px #ffd76a66; }
#武将札 .札能 .能棒.能低 { background: linear-gradient(90deg, #8a909a var(--能), #ffffff1a var(--能)); }
#武将札 .札能 .能棒.能極 { background: linear-gradient(90deg, #7ee08f var(--能), #ffffff1a var(--能)); box-shadow: 0 0 4px #7ee08f66; }
/* 忠誠の色（81_能力色。自走の仮採用 10-20 券 Q29） */
.忠低 { color: var(--赤) !important; font-weight: 700; }
.忠中 { color: #e8a25a !important; }
/* 上の帯（HUD）が狭い画面で右端のボタンを切らない（自走の仮採用 10-20 券 Q30。広い画面は今まで通り） */
@media (max-width: 1599px) {
    #上部 { gap: 9px; padding: 0 8px; }
    #上部 .資源 { font-size: .86em; }
    #上部 button.小 { padding: 4px 8px; }
    #上部 .月差 { margin-left: 2px; }
}
@media (max-width: 1440px) {
    #上部 { gap: 6px; }
    #上部 #表示_日付 { font-size: .9em; }
    #上部 .月差 { display: none; }
}
@media (max-width: 1320px) { #上部 { gap: 4px; } #上部 .詳細ボタン { padding: 1px 5px; } }
@media (max-width: 1240px) { #上部 .資源:has(#表示_鉄砲), #上部 .資源:has(#表示_軍馬) { display: none; } }   /* 鉄砲・軍馬は「詳細」の収支に出る */
/* 幅いっぱいの窓（特大）の題が左上の lv10 のアイコン（幅 約245px）の下に隠れない（自走の仮採用 10-20 券 Q31。窓の左端が 245px より左になる幅だけ） */
@media (max-width: 1609px) {
    .窓:has(> .窓中.特大) { padding-top: 62px; box-sizing: border-box; }
    .窓中.特大 { max-height: calc(100vh - 72px); }
}
/* 部隊の情報の相手（88_隣城。自走の仮採用 10-20 券 Q32） */
#情報窓 .相手札 { display: inline-flex; align-items: center; gap: 4px; padding: 1px 7px 1px 3px; min-height: 0; border: 1px solid #a0484088; border-radius: 12px; background: #3a1f1f; color: inherit; font-size: .92em; cursor: pointer; }
#情報窓 .相手札:hover { border-color: var(--選); }
#情報窓 .相手札 svg.家紋 { width: 16px; height: 16px; flex: none; }
#情報窓 .相手札 b { font-weight: 600; color: #ffb0a0; }
#情報窓 .相手札 small { color: var(--淡); }
/* 武将の窓の並べ替えの見出し（81_武将窓見出し。自走の仮採用 10-20 券 Q33） */
.武将窓見出し .並べ見出し { cursor: pointer; user-select: none; }
.武将窓見出し .並べ見出し:hover { color: var(--選); }
.武将窓見出し .並べ見出し.今 { color: var(--選); }
.武将窓見出し .並べ見出し { position: relative; }
.武将窓見出し .並べ見出し.今::after { content: '▼'; position: absolute; left: 50%; bottom: -7px; transform: translateX(-50%); font-size: .55em; line-height: 1; }
.窓中[data-型="城表"] .表欄 .不足 { color: var(--赤); font-weight: 600; }   /* 隣の敵が自城の兵より多い（Q34） */
@media (max-width: 1100px) { #上部 #表示_家 { display: none; } #上部 #表示_家紋 { margin-right: 0; } #上部 .資源 { font-size: .8em; } #上部 button.小 { padding: 4px 6px; } #上部 #表示_日付 { font-size: .82em; } }   /* 家は家紋で分かる（Q30 の続き） */
/* 目標を選ぶ帯の兵の比（88_隣城。自走の仮採用 10-20 券 Q35） */
#指定帯 .内容 .兵の比 { color: var(--字); font-weight: 600; padding: 0 6px; border-radius: 4px; background: #ffffff10; }
#指定帯 .内容 .兵の比.優 { color: #7cc48a; }
#指定帯 .内容 .兵の比.劣 { color: var(--赤); }
#指し札 td.指し赤, .指し札 td.指し赤 { color: var(--赤); font-weight: 600; }   /* 指し札の隣の敵が自城の兵より多い（Q36） */
#ログ { overflow: hidden; justify-content: flex-end; }   /* 出陣の窓と重なる時に古い行を上で切る（88_知らせ。Q37） */
#ログ.抑え { -webkit-mask-image: linear-gradient(to bottom, transparent 0, #000 22px); mask-image: linear-gradient(to bottom, transparent 0, #000 22px); }
/* 自城の情報の題の ◀ ▶（88_隣城。自走の仮採用 10-20 券 Q38） */
#情報窓 h2 .城送り { margin-left: auto; display: inline-flex; gap: 4px; align-self: center; }
#情報窓 h2 .城送り button { min-height: 0; padding: 1px 8px; font-size: .7em; line-height: 1.5; border: 1px solid var(--線); border-radius: 4px; background: var(--面2); color: var(--字); cursor: pointer; }
#情報窓 h2 .城送り button:hover { border-color: var(--選); }
/* 勢力一覧の天下への道（83_勢力一覧。自走の仮採用 10-20 券 Q40） */
.天下の道 { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 8px; margin: 0 0 8px; padding: 6px 8px; border: 1px solid var(--線); border-radius: 6px; background: #0d1015aa; font-size: .88em; }
.天下の道 .道名 { color: var(--金); font-weight: 700; margin-left: 6px; }
.天下の道 .道名:first-child { margin-left: 0; }
.天下の道 .道項 { color: var(--淡); white-space: nowrap; }
.天下の道 .道項.済 { color: #7cc48a; }
#結果窓 .結果紋 svg.家紋 { width: 1.15em; height: 1.15em; display: inline-block; vertical-align: -0.2em; margin-right: 6px; }   /* 結果の画面の家紋（81_家紋。Q41） */
#武将窓 .将群題 .将群兵 { float: right; margin-right: 6px; color: var(--淡); font-size: .82em; font-weight: 400; }   /* 城の見出しの兵（81_武将窓見出し。Q43） */
/* 武将の札の適性の色（81_能力色。自走の仮採用 10-20 券 Q44） */
#武将札 .札適 b.適S { color: #ffd76a; }
#武将札 .札適 b.適A { color: #7cc48a; }
#武将札 .札適 b.適B { color: #e6e9ee; }
#武将札 .札適 b.適C { color: #8a909a; }
/* 部隊の情報・出陣の窓の適性の字（81_能力色。Q45） */
.適字.適S { color: #ffd76a; font-weight: 700; }
.適字.適A { color: #7cc48a; }
.適字.適C { color: #8a909a; }
/* 武将一覧の待機だけ（83_武将表待機。自走の仮採用 10-20 券 Q47） */
.武将表待機 { display: flex; justify-content: flex-end; margin: 0 0 4px; }
.窓中.待機だけ .行ボタン.非待機 { display: none; }
#大名札 .札能 span, #大名札 .札数 span { white-space: nowrap; }
/* 上の帯の詰め（88_月差。溢れた時だけ。Q30 の続き） */
#上部.詰1 { gap: 5px; padding: 0 6px; }
#上部.詰1 .資源 { font-size: .84em; }
#上部.詰1 .月差 { display: none; }
#上部.詰1 button.小 { padding: 4px 7px; }
#上部.詰2 #表示_家 { display: none; }
#上部.詰2 .資源:has(#表示_鉄砲), #上部.詰2 .資源:has(#表示_軍馬) { display: none; }
#上部.詰3 { gap: 3px; }
#上部.詰3 .資源, #上部.詰3 #表示_日付 { font-size: .76em; }
#上部.詰3 button.小 { padding: 3px 5px; font-size: .9em; }
#武将窓 .忠印 { display: inline-block; margin-left: 3px; padding: 0 3px; border-radius: 3px; background: #a02c24; color: #fff; font-size: .72em; line-height: 1.35; vertical-align: 1px; }   /* 忠誠40未満（81_武将窓見出し。Q48） */
/* セーブ窓（91_セーブ窓。2026-10-20 本人「タブ式・大名の顔・縮小した全国地図」） */
.窓中[data-型="セーブ"] .セ帯 { display: flex; flex-wrap: wrap; gap: 3px; margin-bottom: 4px; }
.窓中[data-型="セーブ"] .セ型帯 { margin-bottom: 8px; }
.窓中[data-型="セーブ"] .セタブ { padding: 4px 12px; border-radius: 6px 6px 0 0; background: #2a3240; color: var(--淡); border: 1px solid var(--線); font-variant-numeric: tabular-nums; }
.窓中[data-型="セーブ"] .セ型帯 .セタブ { border-radius: 6px; min-width: 7em; }
.窓中[data-型="セーブ"] .セタブ.押し中 { background: #4a4024; color: var(--金); border-color: var(--金); }
.窓中[data-型="セーブ"] .行群 { gap: 8px; }
.窓中[data-型="セーブ"] .行ボタン.セ行 { padding: 6px 8px; min-height: 92px; background: linear-gradient(160deg, #2c3a2a, #1f2a22); border-color: #4c5a46; }
.窓中[data-型="セーブ"] .行ボタン.セ行.選択 { background: linear-gradient(160deg, #4a4428, #2e2c1c); border-color: var(--金); }
.窓中[data-型="セーブ"] .行ボタン.セ行.無効, .窓中[data-型="セーブ"] .行ボタン.セ行:has(.セ空札) { background: #232a33; border-color: var(--線); }
.窓中[data-型="セーブ"] .行ボタン.セ行.無効 { opacity: .55; }
.セ札 { display: flex; align-items: center; gap: 8px; width: 100%; min-width: 0; }
.セ番 { flex: none; width: 2.1em; font-size: 1.7em; font-weight: 800; color: var(--金); text-align: center; font-family: serif; line-height: 1; text-shadow: 0 1px 0 #000; }
.セ札 .セ番:only-child, .セ空札 .セ番 { opacity: .6; }
.セ空 { flex: 1; color: var(--淡); text-align: center; }
.セ中 { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 1px; font-size: .9em; }
.セ中 > span { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.セ時 { color: var(--淡); font-size: .88em; font-variant-numeric: tabular-nums; }
.セ家 { font-weight: 700; display: flex; align-items: center; gap: 4px; }
.セ紋 { width: 1.2em; height: 1.2em; flex: none; }
.セ年 { font-variant-numeric: tabular-nums; }
.セ城 { margin-left: .8em; color: var(--淡); }
.セ題 { color: var(--金); font-size: .92em; }
.セ済 { margin-left: .5em; padding: 0 4px; border-radius: 3px; background: #6a1c18; color: #ffd36b; font-size: .8em; }
.セ小図 { flex: none; width: 58px; height: 72px; object-fit: contain; background: #1d3043; border-radius: 3px; }
.セ顔 { flex: none; width: 60px; height: 72px; object-fit: cover; object-position: top; border-radius: 3px; background: #0005; border: 1px solid #0008; }
.セ無図, .セ無顔 { display: inline-block; background: #0003; }
.セ詳 { display: flex; gap: 14px; align-items: stretch; margin-top: 8px; padding: 10px; border: 1px solid var(--線); border-radius: 6px; background: #161b23; min-height: 150px; }
.セ詳空 { align-items: center; justify-content: center; color: var(--淡); }
.セ大顔 { flex: none; width: 128px; height: 160px; object-fit: cover; object-position: top; border-radius: 4px; border: 2px solid #6b5a2c; background: #0005; }
.セ詳文 { flex: 1; min-width: 0; }
.セ詳家 { font-weight: 700; margin-bottom: 6px; }
.セ詳表 { display: grid; grid-template-columns: auto 1fr; gap: 3px 14px; font-size: .92em; font-variant-numeric: tabular-nums; }
.セ詳表 > span:nth-child(odd) { color: var(--淡); }
.セ詳表 > span:nth-child(even) { display: flex; align-items: center; gap: 4px; }
.セ大図 { flex: none; width: 170px; height: 210px; object-fit: contain; background: #1d3043; border-radius: 4px; }
@media (max-width: 900px) { .窓中[data-型="セーブ"] .行群 { grid-template-columns: 1fr 1fr !important; } .セ大図 { width: 120px; height: 150px; } .セ大顔 { width: 96px; height: 120px; } }
@media (max-width: 600px) { .窓中[data-型="セーブ"] .行群 { grid-template-columns: 1fr !important; } .セ詳 { flex-wrap: wrap; } }
.セ番 small { font-size: .5em; letter-spacing: .02em; }
#情報窓 h2 .城読み, .城読み { color: var(--淡); font-weight: 400; margin-right: .2em; }
/* 官位の窓の能力（2026-10-20 本人「能力も表示しソート」） */
.官能 { display: inline-flex; gap: 8px; margin-right: 14px; font-variant-numeric: tabular-nums; }
.官能 i { font-style: normal; color: var(--淡); }
.官能 b { display: inline-block; min-width: 1.6em; text-align: right; color: var(--字); font-weight: 600; }
/* システム変更の Lv10 メニューバー・ミニ再生プレーヤー（80_UI の UI.Lv10表示を合わせる。2026-10-28 本人） */
html.Lv10バー消す #ログインバー, html.Lv10バー消す #左サイドバー, html.Lv10バー消す #展開コンテンツ { display: none !important; }
html.Lv10ミニ消す #lv10-minibar { display: none !important; }