/* ============================================================
   設定の「使い方」（アプリ内マニュアル）専用（v223 新設・v224 で全画面シート方式に作り替え）
   - 入口は #backupTab の一番下の行ボタン（data-set なし＝設定のタブ切替・並び替えの対象外）
   - 全画面シート #manualSheet は、規約のシート #aboutSheet（css/about.css）と同じ作り
   - 色は変数だけを使う（ライト／ダーク／白黒に追従）。影・ぼかし・グラデーションは使わない
   ============================================================ */
/* 入口の行ボタン（利用規約の行 .ab-row と同じ見た目） */
.mn-open{display:flex;align-items:center;gap:10px;width:100%;padding:6px 2px;background:none;border:none;color:var(--text);font-size:1rem;cursor:pointer;text-align:left}
.mn-open svg{width:24px;height:24px;fill:none;stroke:var(--sub);stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;flex:none}
.mn-open svg:last-child{width:20px;height:20px;margin-left:auto}
.mn-open span{font-weight:700}
/* 全画面シート */
#manualSheet{display:none}
#manualSheet.on{display:flex;flex-direction:column;position:fixed;inset:0;z-index:700;background:var(--bg);color:var(--text);box-sizing:border-box}
.mn-top{flex:none;display:flex;align-items:center;gap:10px;padding:calc(12px + env(safe-area-inset-top)) 16px 8px;background:var(--bg)}
.mn-top-t{flex:1;font-size:1.15rem;line-height:1.3}
.mn-back,.mn-close{flex:none;font-size:.95rem;padding:8px 12px;border:1px solid var(--input-border);border-radius:999px;background:var(--card-bg);color:var(--text);cursor:pointer}
.mn-view{flex:1;overflow-y:auto;padding:2px 16px calc(24px + env(safe-area-inset-bottom))}
/* ピンチ拡大の入れ物：拡大したときだけ高さを確保し、中身は transform で広げる */
.mn-pinch{position:relative;overflow:hidden}
.mn-pinch-in{transform-origin:0 0;width:100%}
/* 一覧の行 */
.mn-lead{margin:8px 0 4px;line-height:1.6}
.mn-row{display:flex;align-items:center;gap:8px;width:100%;min-height:52px;padding:10px 2px;background:none;border:none;border-bottom:1px solid var(--border);color:var(--text);font-size:1rem;text-align:left;cursor:pointer}
.mn-row svg{width:20px;height:20px;margin-left:auto;flex:none;fill:none;stroke:var(--sub);stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
.mn-row-ch>span{font-weight:700}
/* 節の行は少し右にずらして、章との階層の違いを出す */
.mn-row-sec{padding-left:22px}
/* 本文中のカメラの印（📷 の置き換え。本体の撮影ボタンと同じ線画） */
.mn-cam{width:1.15em;height:1.15em;vertical-align:-.18em;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
/* 本文 */
.mn-pinch-in p{margin:6px 0;line-height:1.65}
.mn-h{margin:12px 0 4px;font-size:.98rem}
.mn-ul,.mn-ol{margin:6px 0 6px 1.3em;padding:0;line-height:1.65}
.mn-ul li,.mn-ol li{margin:3px 0}
/* 表（横にあふれたら表の中だけ横スクロール） */
.mn-tablewrap{overflow-x:auto;margin:8px 0}
.mn-table{border-collapse:collapse;width:100%;font-size:.92rem;line-height:1.5}
.mn-table th,.mn-table td{border:1px solid var(--border);padding:5px 7px;text-align:left;vertical-align:top}
.mn-table th{background:var(--tint);font-weight:700}
/* 図（共通） */
.mn-dia{margin:10px 0;padding:10px;border:2px solid var(--border);border-radius:10px;background:var(--card-bg)}
.mn-step{display:flex;align-items:flex-start;gap:10px}
.mn-num{flex:none;width:26px;height:26px;border:2px solid var(--text);border-radius:50%;display:flex;align-items:center;justify-content:center;font-weight:700;line-height:1;margin-top:1px}
.mn-step-t{flex:1;line-height:1.55;padding-top:2px}
.mn-step-t .em{font-size:1.05em}
.mn-arrow{display:flex;justify-content:flex-start;padding:3px 0 3px 7px}
.mn-arrow svg{width:18px;height:22px;fill:none;stroke:var(--sub);stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round}
.mn-warn{display:flex;gap:10px;align-items:flex-start;margin-top:10px;padding:9px 10px;border:2px solid var(--high);border-radius:8px;line-height:1.55}
.mn-warn-ic{flex:none;width:24px;height:24px;border:2px solid var(--high);border-radius:50%;display:flex;align-items:center;justify-content:center;font-weight:700;line-height:1;margin-top:1px}
