/* クリニックタウン3D — styles
 * スマホファースト / 白×淡ブルー×淡グリーン / タイクーンUI
 */

*, *::before, *::after { margin: 0; padding: 0; box-sizing: border-box; }

/* v94 便AN-1: ゲーム独自のデザイン系 B「板とパネル」(社長決裁 2026-09-12・憲法第22〜24条の外)。
 * 地は板を浮かせるため一段沈める。意味色=決断(藍)/お金(金)/警告(赤)/良い結果(緑)。
 * 文字色は「実際の地色の全組合せ」で 4.5:1 以上(ink-3 #53656D は --bg-deep 上 4.73・gold #7D5A12 4.88・good #286B55 4.91・red #A93F36 4.73) */
:root {
  --bg: #E9EFF2;
  --bg-deep: #DCE4E9;
  --card: #FFFFFF;
  --edge: #C8D6DE; /* 板の下辺(厚み) */
  --ink: #1B2C36;
  --ink-2: #45585F;
  --ink-3: #53656D;
  --blue: #3E7CA6;
  --blue-deep: #2C5F82; /* 決断(これから押す) */
  --blue-pale: #DCEDF6;
  --green: #4FA98C;
  --green-deep: #286B55; /* 良い結果 */
  --green-pale: #DFF2EA;
  --amber: #7D5A12; /* お金(金)。v93 の「いま決める場所」もこの色 */
  --amber-pale: #F6EEDC;
  --gold: var(--amber);
  --red: #A93F36;
  --red-pale: #FAE7E5;
  --line: #D4DFE5;
  --shadow: 0 4px 10px rgba(27, 44, 54, 0.08);
  --shadow-up: 0 -2px 12px rgba(27,44,54,0.10); /* v97: 下辺に重なる板の影 */
  --glass: color-mix(in srgb, var(--card) 90%, transparent); /* v97: 街タブの見出し(9.5px の --ink-3 が最悪でも 4.97:1) */
  --radius: 12px;
  --sans: 'Zen Kaku Gothic New', 'Noto Sans JP', 'Hiragino Sans', system-ui, sans-serif;
  --en: 'Roboto Mono', ui-monospace, 'SF Mono', Menlo, monospace;
}

html { -webkit-font-smoothing: antialiased; }

body {
  font-family: var(--sans);
  background: var(--bg);
  color: var(--ink);
  font-variant-numeric: tabular-nums;
  line-height: 1.8;
  min-height: 100dvh;
  font-feature-settings: "palt" 1;
}

button { font-family: inherit; cursor: pointer; }
a { color: var(--blue-deep); }

/* ---------- ヘッダー ---------- */

.head {
  position: sticky;
  top: 0;
  z-index: 60;
  background: var(--card);
  border-bottom: 2px solid var(--edge);
  padding: 8px 12px 6px;
}
/* HUD 上段(v94): 資金を大きく・速度は3つの区切りボタン・⚙ */
.hud-money { display: flex; align-items: center; gap: 8px; flex: 1 1 auto; min-width: 0; }
.hud-money > .ic { width: 22px; height: 22px; color: var(--gold); margin: 0; }
.hud-money .hud-label { display: block; font: 500 9.5px/1.1 var(--sans); color: var(--ink-3); }
.hud-money .hud-val { display: block; font: 700 22px/1.15 var(--en); color: var(--ink); }
.head-inner {
  max-width: 920px;
  margin: 0 auto;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 8px;
}
.eyebrow {
  font: 700 9.5px/1 var(--en);
  letter-spacing: 0.22em;
  color: var(--blue);
  text-transform: uppercase;
}
.title {
  font: 900 clamp(16px, 4.2vw, 22px)/1.25 var(--sans);
  background: linear-gradient(120deg, var(--blue-deep) 20%, var(--green-deep) 90%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
}
.head-btns { display: flex; gap: 6px; flex: 0 0 auto; }
.brand { min-width: 0; }
.icon-btn {
  width: 44px; height: 44px; /* v75(保留#41): ヘッダー常設ボタンもタップ領域44px(保留#1 v34 の一括化基準に揃える) */
  border: 1px solid var(--line);
  border-radius: 10px;
  background: var(--card);
  color: var(--ink-2);
  font-size: 15px;
  display: inline-flex; align-items: center; justify-content: center;
}
.icon-btn .ic { width: 20px; height: 20px; margin: 0; }

/* HUD(v87 便AM-3): 1段6値=Day/現金/今日の患者/今日の売上/評判/医療スコア。数値を主役に(designer) */
.hud {
  max-width: 920px;
  margin: 6px auto 0;
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr)); /* v94: 資金は上段へ。残り5値を等分 */
  gap: 4px;
}
.hud-item { display: flex; flex-direction: column; align-items: center; line-height: 1.2; min-width: 0; }
.hud-label { font: 600 9.5px/1.3 var(--sans); color: var(--ink-3); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.hud-label span { font-family: var(--en); font-weight: 700; color: var(--ink-3); }
.hud-val { font: 700 20px/1.3 var(--en); color: var(--ink); white-space: nowrap; letter-spacing: -0.01em; overflow: hidden; text-overflow: clip; }
.head-more { display: flex; gap: 6px; margin-top: 6px; align-items: center; flex-wrap: wrap; }
.speed-fast { flex: 0 0 auto; }
.head-more[hidden] { display: none; }
.icon-btn.wide { width: auto; padding: 0 12px; font: 700 12px/1 var(--sans); }
.head:not(.stage2) .speed-btn[data-speed="4"], .head:not(.stage2) .speed-btn[data-speed="8"], .head:not(.stage2) .speed-btn[data-speed="16"], .head:not(.stage2) .speed-btn[data-speed="32"] { display: none; } /* ×4 以上は Day 4 から(決裁③) */
.hud-val.neg { color: var(--red); }
.hud-time { margin-left: auto; text-align: right; }
.hud-time b { font: 800 13px/1.2 var(--en); color: var(--ink); display: block; }
.hud-time span { font: 700 12px/1.2 var(--en); color: var(--ink-3); }

.speed-group { display: inline-flex; gap: 0; border: 1px solid var(--line); border-radius: 10px; overflow: hidden; background: var(--card); flex: 0 0 auto; }
.speed-btn {
  border: 0;
  border-left: 1px solid var(--line);
  background: var(--card);
  color: var(--ink-2);
  font: 700 12px/1 var(--sans);
  border-radius: 0;
  white-space: nowrap;
  padding: 7px 8px; /* v75(保留#41): 横paddingを10→8に詰めて、⏸ を44px幅にしても375pxで1行を保つ(A案) */
  min-height: 44px; /* 44px化はまず高さ(v33 qa指摘の33px)。幅はHUD 8ボタンが390px幅に収まらないため自然幅のまま(WCAG AAの24pxは満たす)。≤360pxは折返し側で上書き */
}
.speed-btn { min-width: 44px; } /* v75(保留#41)は ⏸ だけ 44px 幅。v91: ×1/×2 も 31px 幅だったので全部 44px(320px も 44px=下の ≤360px 側で同値) */
.speed-btn:first-child { border-left: 0; }
.speed-btn.on { background: var(--blue-deep); color: #fff; }
.speed-btn.skip { color: var(--blue-deep); font-weight: 800; }
.speed-btn .ic { width: 16px; height: 16px; margin: 0; }
.speed-btn.skip .ic { margin-right: 2px; }
/* 320px級: 8ボタンは1行に収まらない。圧縮せず折り返す(幅を削るとWCAG AAの24pxを割る) */
@media (max-width: 360px) {
  .hud-val { font-size: 16px; } /* v95: 320px 級は 16px(20px は 5列に収まらない・計測値) */
  .tab-btn { font-size: 10px; padding: 11px 1px; }
  .speed-btn { min-width: 44px; padding: 7px 6px; } /* v91: 38→44。v88 で ×8〜×32 が ⚙ の行へ移り、Day 4 以降も5ボタン+⚙ で 320px に収まる */
  .head-btns { gap: 4px; }
  .head-inner { gap: 6px; }
  .head-btns { gap: 4px; }
  .eyebrow { letter-spacing: 0.14em; } /* v75: ボタン44px化で brand が104px幅になり「CLINIC TOWN 3D」が2行に折れた。字間を詰めて1行に戻す(題は元から2行) */
  .speed-group { flex: 1 1 auto; flex-wrap: nowrap; gap: 3px; } /* v87: 速度は4ボタンなので折り返さず1行(v48 の8ボタン折返しを解除) */
  .speed-btn { flex: 0 0 auto; padding: 7px 5px; }
}


/* ---------- タブ ---------- */

.tabs {
  position: sticky;
  top: 118px;
  z-index: 55;
  max-width: 920px;
  margin: 0 auto;
  display: flex;
  padding: 0 14px;
}
.tab-btn {
  flex: 1;
  border: 0;
  border-top: 3px solid transparent;
  background: transparent;
  color: var(--ink-3);
  font: 700 10.5px/1 var(--sans);
  padding: 8px 4px 6px;
  border-radius: 0;
  margin-right: 0;
  min-height: 56px;
}
.tab-btn.on { background: transparent; color: var(--blue-deep); border-top-color: var(--blue-deep); }
.tab-btn { white-space: nowrap; }
.tab-btn.locked { color: var(--ink-3); font-weight: 600; } /* 開く前のタブ: 名の代わりに「Day N」(v88) */

/* ---------- レイアウト ---------- */

.main {
  max-width: 920px;
  margin: 0 auto;
  padding: 0 14px 64px;
}
.tab-panel { display: none; flex-direction: column; gap: 14px; }
.tab-panel.show { display: flex; }

.card {
  background: var(--card);
  border: 1px solid var(--line);
  border-bottom: 2px solid var(--edge);
  border-radius: var(--radius);
  box-shadow: var(--shadow);
  padding: 14px 14px 14px;
}
.card-title { font: 900 15px/1.35 var(--sans); color: var(--ink); margin: 0 0 10px -14px; padding: 2px 0 2px 10px; border-left: 4px solid var(--blue-deep); letter-spacing: 0.01em; }
.lv3 > .card-title { margin: 0 0 10px; padding-left: 0; border-left: 0; } /* 枠なしの面にはレールを付けない(designer v94) */
.card-title small { font: 500 11px/1.5 var(--sans); color: var(--ink-3); font-weight: 500; }
.sub-title { font: 800 12.5px/1.4 var(--sans); color: var(--ink-2); margin: 14px 0 8px; }

/* ===== 📖 くわしく(v81 便AJ-2): カード見出し行の右に置く統一部品。1カード1個・44px・新色なし ===== */
.card-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 10px; margin-bottom: 12px; }
.card-head .card-title { flex: 1 1 auto; min-width: 0; margin-bottom: 0; }
/* 部品(44px)と題が同じ行を奪い合うと題が句の途中で折返す(375/390 実測)。副題を次行へ落として
   題そのものは折らない。行数は部品の44pxに収まるので高さは増えない(.kijun-row の折返しの先例)
   対象は部品(.learn-toggle)が残るカードだけ(v81 便AJ-2 PM裁定B)。畳むものが無くなったカードは
   ボタンごと外すので、副題は元の行に戻ってよい */
.card-head.has-tool .card-title small { display: block; }
.card-tools { flex: 0 0 auto; display: flex; gap: 6px; }
.mini-btn.learn-toggle { font-weight: 700; padding: 9px 10px; }
.mini-btn.learn-toggle.on { border-color: rgba(62,124,166,0.45); color: var(--blue-deep); background: var(--blue-pale); }
.learn-row { display: flex; justify-content: flex-end; margin: 8px 0 4px; }
[data-learn-fold][hidden] { display: none !important; }
/* 文中の切り替えリンク(レーンの既定) */
.link-btn { border: none; background: none; padding: 6px 0; font: 600 11px/1.6 var(--sans); color: var(--blue-deep); text-decoration: underline; }
.lane-line { text-align: left; }

/* ---------- ステージ ---------- */

.stage-wrap { position: relative; overflow: hidden; } /* v93: 3D はカード枠から出す(.lv3 が枠なしを持つ) */
/* v97 タウン C(社長決裁 B.C.B): 街の 3D を主役に。狭い幅では見出しの下まで広げ、横スクロールで見回せる。営業先の板が下辺に重なる */
.hero-scroll { overflow-x: auto; overflow-y: hidden; scrollbar-width: none; -webkit-overflow-scrolling: touch; }
.hero-scroll::-webkit-scrollbar { display: none; }
.hero-scroll canvas { display: block; }
@media (max-width: 899px) {
  #tab-town.show { gap: 0; }
  #tab-town.show > .stage-wrap.hero { margin: calc(-1 * var(--head-h, 106px)) -14px 0; }
  #tab-town.show > .stage-wrap.hero .hero-scroll { max-height: 420px; }
  #tab-town.show > .stage-wrap.hero .stage-overlay { top: calc(var(--head-h, 106px) + 10px); }
  #tab-town.show > .stage-wrap.hero + .card { margin-top: -24px; position: relative; z-index: 1; box-shadow: var(--shadow-up); } /* 営業先の板がヒーローの下辺に重なる */
  #tab-town.show > .card + .card { margin-top: 14px; }
  body.tab-town-on .head { background: var(--glass); backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); }
  body.tab-town-on .tabs { background: var(--glass); backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); } /* 720〜899 は見出しの下にタブ行が来る(v98 ⑥)。街の上で読めるようにガラスに */
  #tab-town .stage-badges { flex: 1 1 auto; min-width: 0; } #tab-town .stage-overlay .view-group { flex: 0 0 auto; margin-left: auto; }
  #tab-town.show > .stage-wrap.hero .stage-badges { position: absolute; left: 0; bottom: 36px; max-width: calc(100% - 20px); } /* 案内札は左下(板の重なりの上)。見出し直下の帯は本院のラベルに空ける */
  #tab-town.show > .stage-wrap.hero .stage-overlay { bottom: 0; pointer-events: none; }
  #tab-town .stage-badges .badge { max-width: 100%; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } /* 案内札が本院のラベルに乗らない・ボタンの幅を先に確保(designer v97 ①) */
  .hero-scroll { -webkit-mask-image: linear-gradient(90deg, transparent 0, #000 12px, #000 calc(100% - 28px), transparent 100%); mask-image: linear-gradient(90deg, transparent 0, #000 12px, #000 calc(100% - 28px), transparent 100%); } /* 端のラベルの切断を減衰に(②)。横に続く合図も兼ねる */
}
#clinicStage, #townStage { display: block; width: 100%; }

.stage-overlay {
  position: absolute;
  top: 10px; left: 10px; right: 10px;
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 8px;
  pointer-events: none;
}
.stage-badges { display: flex; flex-direction: column; gap: 5px; align-items: flex-start; }
.badge {
  background: rgba(255,255,255,0.92);
  border: 1px solid var(--line);
  border-radius: 999px;
  padding: 7px 12px;
  font: 700 11px/1.3 var(--sans);
  color: var(--ink-2);
  box-shadow: 0 2px 8px rgba(34,51,61,0.08);
}
.badge b { color: var(--blue-deep); }
.badge.hot { color: var(--red); border-color: rgba(196,87,78,0.4); }

.view-group { display: flex; flex-direction: column; gap: 5px; align-items: flex-end; pointer-events: auto; }
.view-btn {
  border: 1px solid var(--line);
  background: rgba(255, 255, 255, 0.92);
  color: var(--ink-2);
  font: 700 11px/1 var(--sans);
  border-radius: 999px;
  padding: 8px 11px;
  box-shadow: 0 2px 8px rgba(34, 51, 61, 0.08);
  min-height: 44px;
  white-space: nowrap; /* 320px で「導線ヒー/ト」と2行に割れる(v88 designer) */
}
.view-btn.on { background: var(--blue-deep); border-color: var(--blue-deep); color: #fff; }

.panic {
  position: absolute;
  left: 50%;
  bottom: 12px;
  transform: translateX(-50%);
  background: var(--red);
  color: #fff;
  font: 700 11.5px/1.4 var(--sans);
  border-radius: 999px;
  padding: 8px 15px;
  box-shadow: 0 4px 14px rgba(196, 87, 78, 0.4);
  white-space: nowrap;
  animation: pulse 1.4s ease infinite;
}
@keyframes pulse { 0%,100%{opacity:1} 50%{opacity:.75} }

/* ---------- ショップ ---------- */

.shop-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 10px;
  min-height: 56px;
  padding: 10px 0;
  border-top: 1px solid var(--line);
}
.shop-info { display: flex; flex-direction: column; min-width: 0; }
.shop-name { font: 700 14px/1.5 var(--sans); color: var(--ink); }
.shop-count { color: var(--blue-deep); font-family: var(--en); margin-left: 4px; }
.shop-hint { font: 400 12px/1.5 var(--sans); color: var(--ink-3); }
.cer { display: grid; grid-template-columns: 48px minmax(0, 1fr); column-gap: 6px; row-gap: 2px; margin-top: 2px; font: 400 13px/1.6 var(--sans); color: var(--ink-2); } /* v92: 費用/効果/リスクの3行型(社長⑥)。v94: 定義リスト型(designer B) */
.cer > b { font: 500 11px/1.6 var(--sans); color: var(--ink-3); }
.cer > span { min-width: 0; display: flex; gap: 4px; align-items: flex-start; }
.cer.cost > span { color: var(--gold); font-weight: 700; }
.cer.risk .ic { width: 14px; height: 14px; color: var(--red); margin: 4px 2px 0 0; }
.shop-btns { display: flex; gap: 6px; flex: 0 0 auto; }

.mini-btn {
  border: 1.5px solid var(--line);
  background: var(--card);
  color: var(--ink-2);
  font: 700 12px/1 var(--sans);
  border-radius: 10px;
  padding: 9px 11px;
  white-space: nowrap;
  min-height: 44px;
  min-width: 44px;
}
.mini-btn.plus { border-color: var(--blue-deep); color: var(--blue-deep); background: var(--card); } /* v94: 塗りは「今日の1手/受ける」だけ。価格は金 */
.mini-btn.plus .gold { color: var(--gold); }
.mini-btn:disabled { opacity: 0.4; cursor: not-allowed; }

.op-row { display: flex; flex-wrap: wrap; gap: 8px; margin: 12px 0; }
.op-btn {
  border: 1.5px solid var(--line);
  background: var(--card);
  color: var(--ink-2);
  font: 700 12px/1.3 var(--sans);
  border-radius: 999px;
  padding: 9px 14px;
  min-height: 44px;
}
.op-btn small { color: var(--ink-3); font-weight: 600; }
/* noteつき投資ボタン: 全幅・左寄せで「何が買えるか」を第2行に(v49 PM裁定A) */
.op-btn.has-note { flex: 1 1 100%; text-align: left; border-radius: 14px; padding: 10px 14px; }
/* noteは購入前の判断材料なので--ink-2(6.78:1=AA)。補足の--ink-3 10px運用(.ctrl-note等)とは役割が違う(v49 designer実測) */
.op-btn.has-note .act-note { display: block; margin-top: 3px; font: 500 10px/1.55 var(--sans); color: var(--ink-2); }
.op-btn.on { background: var(--blue-deep); border-color: var(--blue-deep); color: #fff; }
.op-btn.on small { color: rgba(255,255,255,0.7); }

/* ---------- コントロール ---------- */

.ctrl-grid { display: grid; grid-template-columns: 1fr; gap: 12px; margin-top: 6px; }
.ctrl { display: flex; flex-direction: column; gap: 5px; }
.ctrl-head { font: 600 12.5px/1.5 var(--sans); color: var(--ink-2); }
.ctrl-head b { color: var(--blue-deep); font-weight: 800; margin-left: 4px; }
.branch-card .ctrl-grid .ctrl-head b { display: block; margin-left: 0; } /* 分院の操作パネル: 見出しと値を常に2段に揃える(正式名称で折れる見出しと折れない見出しの非対称を無くす。v83 便AK designer) */
.ctrl-note { font: 500 10.5px/1.6 var(--sans); color: var(--ink-3); }

input[type="range"] {
  -webkit-appearance: none;
  appearance: none;
  width: 100%;
  height: 44px; /* v91: 当たり判定は 44px(社長⑨)。見た目の溝は下の track で 6px のまま */
  margin: 0;
  border-radius: 999px;
  background: transparent;
  outline: none;
}
input[type="range"]::-webkit-slider-runnable-track {
  height: 6px;
  border-radius: 999px;
  background: rgba(62, 124, 166, 0.18);
}
input[type="range"]::-moz-range-track {
  height: 6px;
  border-radius: 999px;
  background: rgba(62, 124, 166, 0.18);
}
input[type="range"]::-webkit-slider-thumb {
  -webkit-appearance: none;
  appearance: none;
  width: 22px; height: 22px;
  margin-top: -8px; /* (22-6)/2: 溝の中心に */
  border-radius: 50%;
  background: linear-gradient(135deg, var(--blue), var(--green));
  border: 2.5px solid #fff;
  box-shadow: 0 2px 8px rgba(62, 124, 166, 0.4);
  cursor: pointer;
}
input[type="range"]::-moz-range-thumb {
  width: 20px; height: 20px;
  border-radius: 50%;
  background: linear-gradient(135deg, var(--blue), var(--green));
  border: 2.5px solid #fff;
  box-shadow: 0 2px 8px rgba(62, 124, 166, 0.4);
  cursor: pointer;
}

/* ---------- タウン ---------- */

.town-guide { margin-top: 12px; display: flex; flex-direction: column; gap: 7px; }
.tg-row {
  font: 500 11.5px/1.6 var(--sans);
  color: var(--ink-2);
  display: flex;
  gap: 8px;
  align-items: baseline;
}
.tg-row span { font-weight: 700; color: var(--ink); flex: 0 0 auto; }

/* ---------- 経営タブ ---------- */

.formula {
  border-top: 4px solid transparent;
  border-image: linear-gradient(90deg, var(--blue), var(--green)) 1;
}
.formula-line {
  font: 900 clamp(19px, 5vw, 26px)/1.4 var(--sans);
  text-align: center;
  margin: 6px 0 10px;
  background: linear-gradient(120deg, var(--blue-deep) 20%, var(--green-deep) 90%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
}
.formula-line span { -webkit-text-fill-color: var(--ink-3); margin: 0 6px; font-weight: 700; }
.formula-sub { display: flex; flex-direction: column; gap: 4px; }
.formula-sub div { font: 500 12px/1.8 var(--sans); color: var(--ink-2); }
.formula-sub b { color: var(--blue-deep); }

.pnl-row {
  display: flex;
  justify-content: space-between;
  gap: 10px; /* ラベルが長い行(紹介など)で数値と密着しないため(v42 designer裁定) */
  font: 500 12.5px/1.7 var(--sans);
  color: var(--ink-2);
  padding: 3px 0;
}
/* 数値書体+「3件」等を行内で割らない(v42の2ルールをv46で併合=保留#19)。
   nowrapは散文入りの<b>(引き継ぐもの等)を1行に強制し320pxで横スクロールさせるため、
   keep-allに置換(数値・単位は割れず、散文は折り返せる=v46 designer実測) */
.pnl-row b { font-family: var(--en); font-weight: 700; word-break: keep-all; }
.pnl-row.total {
  border-top: 1.5px solid var(--line);
  margin-top: 4px;
  padding-top: 7px;
  font-weight: 800;
  color: var(--ink);
}
.pnl-row.total.pos b { color: var(--green-deep); }
.pnl-row.total.neg b { color: var(--red); }
.pnl-empty { font: 500 11.5px/1.6 var(--sans); color: var(--ink-3); }

.pnl-chart {
  display: flex;
  align-items: flex-end;
  gap: 5px;
  height: 74px;
  padding: 4px 2px 0;
}
.bar-col { flex: 1; display: flex; flex-direction: column; align-items: center; justify-content: flex-end; gap: 3px; }
.bar { width: 100%; max-width: 26px; border-radius: 4px 4px 0 0; }
.bar.pos { background: linear-gradient(180deg, var(--green), var(--green-deep)); }
.bar.neg { background: var(--red); }
.bar-col span { font: 600 9px/1 var(--en); color: var(--ink-3); }

/* 事業計画 */
.plan-lead { font: 500 12.5px/1.9 var(--sans); color: var(--ink-2); margin-bottom: 10px; }
.plan-lead b { color: var(--blue-deep); }
.plan-form { display: flex; flex-direction: column; gap: 12px; }
.plan-steppers { display: grid; grid-template-columns: 1fr; gap: 8px; }
.plan-step {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 10px;
  padding: 7px 0;
  border-bottom: 1px dashed var(--line);
  font: 600 12.5px/1.5 var(--sans);
  color: var(--ink-2);
}
.plan-step small { display: block; font-weight: 500; font-size: 10px; color: var(--ink-3); }
.plan-step > div { display: flex; align-items: center; gap: 8px; flex: 0 0 auto; }
.plan-step b { font-family: var(--en); color: var(--blue-deep); min-width: 3.2em; text-align: center; }
.plan-diag { display: flex; flex-direction: column; gap: 6px; }
.diag {
  font: 500 12px/1.75 var(--sans);
  border-radius: 10px;
  padding: 8px 12px;
}
.diag b { font-weight: 800; }
.diag.info { background: var(--bg-deep); color: var(--ink-2); }
.diag.good { background: var(--green-pale); color: var(--green-deep); }
.diag.warn { background: var(--bg-deep); color: var(--ink-2); } /* 注意=中立地(危険の赤地と区別・designer C) */
.diag.bad { background: var(--red-pale); color: var(--red); }

.pv-head { margin-bottom: 10px; }
.pv-rev span { font: 600 11.5px/1.6 var(--sans); color: var(--ink-3); display: block; }
.pv-rev b { font: 800 20px/1.3 var(--en); color: var(--blue-deep); }
.pv-rev b small { font-size: 12px; color: var(--ink-3); }
.pv-track {
  height: 10px;
  background: rgba(62, 124, 166, 0.12);
  border-radius: 999px;
  overflow: hidden;
  flex: 1;
}
.pv-track.big { height: 14px; margin-top: 5px; }
.pv-track i { display: block; height: 100%; border-radius: 999px; transition: width 0.4s ease; }
.pv-track i.low { background: var(--red); }
.pv-track i.mid { background: linear-gradient(90deg, var(--blue), var(--blue-deep)); }
.pv-track i.full { background: linear-gradient(90deg, var(--blue), var(--green)); }
.pv-row {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 7px 0;
  font: 600 12px/1.5 var(--sans);
  color: var(--ink-2);
}
.pv-label { flex: 0 0 11em; color: var(--ink-3); font-weight: 600; }
.pv-num { flex: 0 0 auto; font-family: var(--en); font-weight: 700; color: var(--blue-deep); }
.pv-staff { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; padding: 7px 0; }
.staff-chip {
  font: 700 11px/1 var(--sans);
  border-radius: 999px;
  padding: 7px 11px;
}
.staff-chip.ok { background: var(--green-pale); color: var(--green-deep); }
.staff-chip.under { background: var(--bg-deep); color: var(--ink-2); }
.staff-chip.over { background: var(--red-pale); color: var(--red); }
.pv-rate.good { color: var(--green-deep); }
.pv-rate.warn { color: var(--ink-2); }
.pv-rate.bad { color: var(--red); }
.pnl-note { font: 500 11px/1.7 var(--sans); color: var(--ink-3); margin-top: 6px; text-align: right; }

.kijun-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 10px;
  padding: 10px 0;
  border-bottom: 1px dashed var(--line);
  font: 500 12.5px/1.6 var(--sans);
  color: var(--ink-2);
  /* 長いラベル+.mini-btn(nowrap)の折返し。v46(保留#18)は320px以下だけだったが、375/390でもボタンが幅44pxまで潰れて
     文字が欠けていた(保留#39・v67 designer実測)ので全幅で有効に。子結合子は必須 — ラベル文中のインライン.kijun-badge
     (適用中等)まで飛ばさないため。row-gapで折返し行をラベル側に帰属させる(6/10/10のリズム=designer裁定) */
  flex-wrap: wrap; row-gap: 6px;
}
.kijun-row > .mini-btn,
.kijun-row > .kijun-badge { margin-left: auto; }
.kijun-row b { color: var(--ink); }
.kijun-row small { color: var(--ink-3); }
.kijun-row.ok b { color: var(--green-deep); }
.kijun-badge {
  font: 700 11px/1 var(--sans);
  color: var(--green-deep);
  background: var(--green-pale);
  border: 1px solid rgba(79,169,140,0.35);
  border-radius: 999px;
  padding: 7px 12px;
  white-space: nowrap;
}

.mission-row {
  display: flex;
  gap: 10px;
  padding: 9px 0;
  border-bottom: 1px dashed var(--line);
  font: 500 12.5px/1.7 var(--sans);
  color: var(--ink-2);
}
.mission-row b { color: var(--ink); font-weight: 700; }
.mission-row.done { opacity: 0.85; }
.mission-row.done b { color: var(--green-deep); }
.mission-row.locked { opacity: 0.45; }
.mission-row.now b { color: var(--blue-deep); }
.mission-mark { flex: 0 0 auto; }
.mission-lesson { font: 500 11px/1.8 var(--sans); color: var(--ink-3); margin-top: 3px; }

.tb-card {
  border: 1px solid var(--line);
  border-radius: 12px;
  padding: 10px 14px;
  margin-bottom: 8px;
  background: #FBFDFE;
}
.tb-card summary { font: 700 12.5px/1.6 var(--sans); color: var(--blue-deep); cursor: pointer; }
.tb-card p { font: 500 12px/1.9 var(--sans); color: var(--ink-2); margin-top: 6px; }

.note { font: 500 11px/1.9 var(--sans); color: var(--ink-3); text-align: center; }
.note a { display: inline-flex; align-items: center; min-height: 44px; padding: 0 8px; } /* v91: 12px 高のリンクに 44px の当たり判定 */

/* ---------- 広告(キーワード入札) ---------- */

.ad-kw {
  padding: 10px 0;
  border-bottom: 1px dashed var(--line);
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.ad-head { display: flex; justify-content: space-between; align-items: baseline; gap: 10px; }
.ad-name { font: 700 13px/1.5 var(--sans); color: var(--ink); }
.ad-name small { font: 600 10.5px/1 var(--en); color: var(--ink-3); margin-left: 4px; }
.ad-up { color: var(--red); font-size: 10px; }
.ad-budget { font: 800 13px/1 var(--en); color: var(--blue-deep); white-space: nowrap; }
.ad-stats { display: flex; flex-direction: column; gap: 2px; font: 500 10.5px/1.6 var(--sans); color: var(--ink-3); }
.ad-result { font-weight: 700; color: var(--green-deep); }
.ad-summary {
  display: flex;
  flex-direction: column;
  gap: 4px;
  margin-top: 10px;
  padding: 10px 12px;
  background: var(--bg-deep);
  border-radius: 10px;
  font: 500 11.5px/1.7 var(--sans);
  color: var(--ink-2);
}
.ad-summary b { color: var(--blue-deep); }
.ad-warn { color: var(--red); font-weight: 700; }

/* ---------- 法人・分院 ---------- */

.corp-summary {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 16px;
  padding: 10px 12px;
  background: var(--bg-deep);
  border-radius: 10px;
  margin-bottom: 12px;
  font: 600 12px/1.5 var(--sans);
  color: var(--ink-2);
}
.corp-summary b { font-family: var(--en); color: var(--blue-deep); }
.pos-t { color: var(--green-deep) !important; }
.neg-t { color: var(--red) !important; }

.branch-card {
  border: 1.5px solid var(--line);
  border-radius: 14px;
  padding: 12px 14px;
  margin-bottom: 12px;
  background: #FBFDFE;
}
.branch-head { display: flex; justify-content: space-between; align-items: baseline; flex-wrap: wrap; gap: 4px 10px; }
.branch-head b { font: 800 14px/1.5 var(--sans); color: var(--green-deep); }
.branch-stat { font: 600 11px/1.5 var(--sans); color: var(--ink-3); }
.branch-pnl {
  font: 600 11.5px/1.7 var(--sans);
  color: var(--ink-2);
  padding: 6px 0;
  border-bottom: 1px dashed var(--line);
}
.branch-staff { padding: 4px 0; }
.branch-kijun { font: 600 11px/1.9 var(--sans); color: var(--ink-2); padding-top: 8px; display: block; }
/* 施設基準ブロック(v56 便V): 行動→事実→済みの順。gameNoteは行に従属(.fs-item)、済みは<details>に畳む(ネイティブのまま=motion対応不要) */
.fs-list { display: flex; flex-wrap: wrap; gap: 6px; align-items: flex-start; margin-top: 4px; }
.fs-item { display: flex; flex-direction: column; align-items: flex-start; flex: 0 1 auto; min-width: 0; max-width: 100%; }
.fs-item.has-note { flex: 1 1 300px; }
.fs-item > .kb-cond.is-note { padding-left: 25px; } /* 行のテキスト開始(ボタン/バッジのpadding+border≈13px)から+12pxの段差で従属を示す(v56 designer M1) */
.fs-group { flex: 1 1 100%; display: flex; flex-wrap: wrap; gap: 6px; } /* 行動群と事実群を別行に(≥768pxで混ざらない・v56 designer A1) */
.fs-fold { flex: 1 1 100%; }
.fs-fold > summary { font: 700 11px/1.9 var(--sans); color: var(--ink-2); cursor: pointer; list-style: none; display: flex; align-items: center; gap: 5px; min-height: 44px; }
.fs-fold > summary::-webkit-details-marker { display: none; }
.fs-fold > summary::before { content: '▸'; font-size: 9px; }
.fs-fold[open] > summary::before { content: '▾'; }
.fs-fold-b { display: flex; flex-wrap: wrap; gap: 6px; padding-bottom: 4px; }
.mini-btn.wrap { white-space: normal; text-align: left; }

.expand-row { background: var(--blue-pale); border-radius: 12px; padding: 10px 12px !important; border-bottom: none !important; margin-top: 8px; }
.expand-row.done { background: var(--bg-deep); }
.shop-max { font: 600 10px/1 var(--sans); color: var(--ink-3); }

/* ---------- 現場スタッフ(キャラクター) ---------- */

.staff-strip { /* grid: 奇数枚でも最後の1枚が全幅に伸びない(v67 designer N1)。130px=320幅でも2列 */
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(130px, 1fr));
  gap: 8px;
}
.staff-chip {
  flex: 1 1 auto;
  min-width: 120px;
  display: flex;
  align-items: center;
  gap: 8px;
  background: var(--card);
  border: 1px solid var(--line);
  border-radius: 12px;
  box-shadow: var(--shadow);
  padding: 6px 10px;
}
.staff-chip svg { flex: 0 0 auto; border-radius: 50%; background: var(--bg-deep); }
.staff-meta { display: flex; flex-direction: column; line-height: 1.3; min-width: 0; }
.staff-meta small { font: 600 9px/1.3 var(--sans); color: var(--ink-3); }
.staff-meta b { font: 700 11.5px/1.35 var(--sans); color: var(--ink); white-space: nowrap; }
.staff-chip.mood-warn { border-color: rgba(196, 87, 78, 0.5); background: #FDF6F5; }
.staff-chip.mood-warn .staff-meta b { color: var(--red); }
.staff-chip.mood-tired { border-color: var(--line); background: var(--bg-deep); }
.staff-chip.mood-tired .staff-meta b, .staff-chip.mood-busy .staff-meta b { color: var(--ink-2); }
.staff-chip.mood-good .staff-meta b { color: var(--green-deep); }
.staff-chip.mood-idea { border-color: rgba(62, 124, 166, 0.4); }

.voice-card { padding: 12px 14px !important; }
.voice-row {
  display: flex;
  gap: 10px;
  align-items: flex-start;
  padding: 6px 0;
}
.voice-row + .voice-row { border-top: 1px dashed var(--line); }
.voice-row svg { flex: 0 0 auto; border-radius: 50%; background: var(--bg-deep); }
.voice-txt small { font: 700 10px/1.5 var(--sans); color: var(--ink-3); display: block; }
.voice-txt p { font: 500 12.5px/1.8 var(--sans); color: var(--ink); }

.shop-voice {
  display: flex;
  align-items: center;
  gap: 5px;
  font: 500 10.5px/1.5 var(--sans);
  color: var(--blue-deep);
  margin-top: 3px;
}
.shop-voice svg { border-radius: 50%; background: var(--bg-deep); flex: 0 0 auto; }

/* ---------- 診療時間 ---------- */

.sch-row { display: flex; gap: 6px; flex-wrap: wrap; }
.sch-btn {
  flex: 1;
  min-width: 42px;
  min-height: 44px; /* v91: 43px だった */
  border: 1.5px solid var(--line);
  border-radius: 12px;
  padding: 8px 4px;
  display: flex;
  justify-content: center;
  flex-direction: column;
  align-items: center;
  gap: 2px;
  background: var(--card);
}
.sch-btn .sch-day { font: 800 13px/1 var(--sans); color: var(--ink); }
.sch-btn .sch-kind { font: 600 10px/1 var(--sans); color: var(--ink-3); }
.sch-btn.full { background: var(--green-pale); border-color: rgba(79,169,140,0.4); }
.sch-btn.full .sch-kind { color: var(--green-deep); }
.sch-btn.am { background: var(--blue-pale); border-color: rgba(62,124,166,0.45); }
.sch-btn.am .sch-kind { color: var(--blue-deep); }
.sch-btn.closed { opacity: 0.6; }

/* ---------- KPI ---------- */

.kpi-strip {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
}
.kpi-tile {
  flex: 1 1 auto;
  min-width: 100px;
  background: var(--card);
  border: 1px solid var(--line);
  border-radius: 12px;
  box-shadow: var(--shadow);
  padding: 8px 12px;
  display: flex;
  flex-direction: column;
  line-height: 1.35;
  position: relative;
}
.kpi-tile small { font: 600 9.5px/1.4 var(--sans); color: var(--ink-3); }
.kpi-tile b { font: 800 16px/1.2 var(--en); color: var(--blue-deep); }
.kpi-tile .tr { position: absolute; right: 10px; bottom: 8px; font-style: normal; font-size: 11px; color: var(--ink-3); }
.kpi-tile .tr.up { color: var(--green-deep); }
.kpi-tile .tr.down { color: var(--red); }
.kpi-tile.empty { font: 500 11px/1.6 var(--sans); color: var(--ink-3); }

.kpi-chip {
  border: 1.5px solid var(--line);
  background: var(--card);
  color: var(--ink-2);
  font: 700 11.5px/1 var(--sans);
  border-radius: 999px;
  padding: 8px 12px;
  margin: 0 6px 6px 0;
}
.kpi-chip.on { background: var(--blue-deep); border-color: var(--blue-deep); color: #fff; }
.kpi-why { margin-top: 8px; display: flex; flex-direction: column; gap: 4px; }
.kpi-why p { font: 500 11px/1.7 var(--sans); color: var(--ink-3); }
.kpi-why b { color: var(--blue-deep); }

.wk-table { display: flex; flex-direction: column; gap: 2px; }
.wk-row {
  display: grid;
  grid-template-columns: 10em 1fr 7em 1.4em;
  gap: 8px;
  align-items: baseline;
  font: 500 12px/1.8 var(--sans);
  color: var(--ink-2);
  border-bottom: 1px dashed var(--line);
  padding: 3px 0;
}
.wk-row b { font-family: var(--en); font-weight: 700; color: var(--ink); }
.wk-row small { color: var(--ink-3); }
.wk-row .up { color: var(--green-deep); }
.wk-row .down { color: var(--red); }

/* ---------- 営業関係 ---------- */

.rel-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 10px;
  padding: 9px 0;
  border-bottom: 1px dashed var(--line);
}
.rel-info { display: flex; flex-direction: column; min-width: 0; font: 700 12.5px/1.5 var(--sans); color: var(--ink); }
.rel-info small { font: 500 10.5px/1.6 var(--sans); color: var(--ink-3); font-weight: 500; }
.rel-desc { margin-top: 2px; }
/* 説明を開くと情報側が伸び、nowrap のボタンが最小幅より潰れて横にはみ出す(v81 実測)。
   ボタンは縮ませない(.dec-log .mini-btn の先例) */
.rel-row > .mini-btn { flex: 0 0 auto; }
.rel-stars { color: var(--gold); letter-spacing: 0; font-size: 12px; display: inline-flex; gap: 2px; }
.rel-stars .ic { width: 14px; height: 14px; margin: 0; }
.rel-stars .ic.fill g { fill: var(--gold); stroke: var(--gold); }
.rel-stars .ic:not(.fill) g { stroke: var(--line); }
.mini-btn.two { display: inline-flex; flex-direction: column; align-items: center; justify-content: center; gap: 2px; width: 92px; height: 44px; padding: 0 6px; line-height: 1.2; }
.mini-btn.two small { font: 500 11px/1.2 var(--sans); }
.mini-btn.two .num { font: 700 13px/1.2 var(--en); color: var(--gold); }

/* ---------- 自費メニュー ---------- */

.jihi-item { padding: 10px 0; border-bottom: 1px dashed var(--line); display: flex; flex-direction: column; gap: 8px; }
.jihi-head { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.jihi-stat { font: 600 10.5px/1.5 var(--sans); color: var(--ink-3); }

/* ---------- バナー / トースト ---------- */

.banner {
  position: fixed;
  top: 10px;
  left: 50%;
  transform: translate(-50%, -80px);
  background: var(--ink);
  color: #fff;
  font: 600 12.5px/1.5 var(--sans);
  border-radius: 12px;
  padding: 11px 18px;
  z-index: 300;
  box-shadow: 0 8px 24px rgba(34,51,61,0.3);
  transition: transform 0.3s ease;
  /* width指定なしのleft:50%+translateは、shrink-to-fitでビューポート半分に頭打ちになり
     max-widthに届かない(CSS2.1 10.3.7)。max-contentで自然幅→max-widthの折返しに直す(v46) */
  width: max-content;
  max-width: calc(100vw - 30px);
  overflow-wrap: anywhere; /* 空白のない長いトークンでも端をはみ出さない(v46) */
  pointer-events: none;
}
.banner.show { transform: translate(-50%, 0); }
.banner .pos { color: #8FE3C0; }
.banner .neg { color: #F4A69F; }

.toast {
  position: fixed;
  left: 50%;
  bottom: 24px;
  transform: translate(-50%, 16px);
  background: var(--ink);
  color: #fff;
  font: 600 12.5px/1.5 var(--sans);
  border-radius: 999px;
  padding: 11px 20px;
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.25s ease, transform 0.25s ease;
  z-index: 300;
  width: max-content; /* .bannerと同じshrink-to-fit回避(v46) */
  max-width: calc(100vw - 36px);
  overflow-wrap: anywhere;
}
.toast.show { opacity: 1; transform: translate(-50%, 0); }

/* ---------- モーダル ---------- */

.modal-wrap {
  position: fixed;
  inset: 0;
  background: rgba(34, 51, 61, 0.45);
  display: none;
  align-items: center;
  justify-content: center;
  z-index: 400;
  padding: 20px;
}
.modal-wrap.show { display: flex; }
.modal {
  background: var(--card);
  border-radius: 18px;
  padding: 22px 22px 18px;
  max-width: 460px;
  width: 100%;
  max-height: 80vh;
  overflow-y: auto;
  box-shadow: 0 20px 60px rgba(34,51,61,0.35);
  animation: rise 0.3s ease both;
}
@keyframes rise { from { opacity: 0; transform: translateY(14px); } to { opacity: 1; transform: none; } }
.modal h3 { font: 800 16px/1.5 var(--sans); color: var(--blue-deep); margin-bottom: 10px; }
.modal p { font: 500 13px/1.9 var(--sans); color: var(--ink-2); margin-bottom: 8px; }
.modal b { color: var(--ink); }
.modal-note {
  background: var(--bg-deep);
  border-radius: 10px;
  padding: 10px 12px;
  font-size: 12px !important;
}
.lesson-box {
  background: var(--green-pale);
  border: 1px solid rgba(79,169,140,0.3);
  border-radius: 12px;
  padding: 12px 14px;
  margin: 10px 0;
}
.lesson-box b { font: 700 12px/1.5 var(--sans); color: var(--green-deep); }
.lesson-box p { font: 500 12px/1.9 var(--sans); margin: 4px 0 0; }
.modal-actions { margin: 12px 0 6px; }

.btn-cta {
  display: block;
  width: 100%;
  border: none;
  border-radius: 12px;
  padding: 13px 18px;
  font: 700 14px/1.4 var(--sans);
  background: var(--blue-deep);
  color: #fff;
  box-shadow: none;
  border-radius: 10px;
}
.btn-cta.ghost {
  background: transparent;
  color: var(--ink-3);
  box-shadow: none;
  font-weight: 600;
  padding: 10px;
  min-height: 44px; /* タップ領域44px(保留#38・v58)。modalの閉じる/計画の見直し/共有ボタンに効く */
}
.btn-cta.danger { background: var(--red); box-shadow: none; }

/* ---------- チュートリアル ---------- */

.tutorial {
  position: fixed;
  inset: 0;
  background: rgba(34, 51, 61, 0.5);
  display: none;
  z-index: 500;
  pointer-events: auto;
}
.tutorial.show { display: block; }
.tut-box {
  position: absolute;
  left: 50%;
  bottom: 18px;
  transform: translateX(-50%);
  width: min(480px, calc(100vw - 24px));
  background: var(--card);
  border-radius: 18px;
  padding: 16px 18px 14px;
  box-shadow: 0 16px 50px rgba(34,51,61,0.4);
  /* riseのto{transform:none}がfill-mode:bothで中央寄せtranslateX(-50%)を恒久上書きし、
     320〜768pxで最大171px画面外へはみ出していた(保留#21)。X軸を保つ専用アニメに(v46) */
  animation: riseX 0.35s ease both;
}
@keyframes riseX { from { opacity: 0; transform: translate(-50%, 14px); } to { opacity: 1; transform: translateX(-50%); } }
.tut-head { display: flex; justify-content: space-between; align-items: center; margin-bottom: 8px; }
.tut-chara { font-size: 26px; }
.tut-step { font: 700 11px/1 var(--en); color: var(--ink-3); letter-spacing: 0.08em; }
.tut-text { font: 500 13px/1.95 var(--sans); color: var(--ink-2); min-height: 76px; }
.tut-text b { color: var(--blue-deep); }
.tut-btns { display: flex; gap: 10px; align-items: center; margin-top: 10px; }
.tut-skip { border: none; background: none; color: var(--ink-3); font: 600 12px/1 var(--sans); flex: 0 0 auto; padding: 10px 6px; }
.tut-btns .btn-cta { flex: 1; }

/* ===== 開始の扉(v66): .tut-box の器を縦長・スクロール可にするだけ。1枚=.spec-row(提示)/2枚以上=.choice-row(排他) ===== */
.gate-box { max-height: calc(100dvh - 36px); overflow-y: auto; }
.gate-box .tut-text { min-height: 0; margin-bottom: 10px; }
.gate-box .spec-row { padding: 8px 2px; }
.gate-box .spec-row small { color: var(--ink-2); } /* 判断の材料になる本文はAAを割らない(v56) */
.gate-box .choice-row { margin-top: 6px; }
.gate-box .choice-row small { font-size: 10px; line-height: 1.5; color: var(--ink-2); } /* 判断材料は製品の最小運用10px・AA(designer v66) */
@media (max-width: 360px) { #gateList .choice-row { flex-wrap: wrap; row-gap: 2px; } #gateList .choice-row small { flex: 0 0 100%; } } /* 320px: 科名の幅で1行が折れる科が出るので、4枚とも科名の下に1行を置いて高さを揃える(v82 便AF-3 qa) */
/* ===== 扉のレーン2択(v81 便AJ-2): 科カードの後に置く小チップ2つ。科の選択と同じ顔にしない
   (角丸カードのグリッドを2段作らない=第24条)。寸法は .fix-chip 流用・色は既存トークンのみ ===== */
.lane-pick { margin-top: 12px; }
.lane-lead { font: 700 11.5px/1.6 var(--sans); color: var(--ink-2); }
.lane-chips { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 4px; }
.lane-chip { border: 1.5px solid var(--line); background: var(--card); color: var(--ink-2); font: 700 12px/1.3 var(--sans); border-radius: 999px; padding: 9px 14px; min-height: 44px; }
.lane-chip.on { border-color: var(--blue-deep); background: var(--blue-pale); color: var(--blue-deep); } /* v81 designer: 科カードの選択(blue-pale+左罫)より重くしない。.choice-row.on と同じ流儀 */
.lane-chip:active { transform: scale(0.97); }
.lane-note { font: 500 10.5px/1.6 var(--sans); color: var(--ink-3); margin-top: 6px; }
.lane-note-row { display: block; } /* v81 便AJ-2 PM裁定B: 2レーンの1行を2段で常時表示 */
.lane-note-row.cur { color: var(--ink-2); }
#mainLever .pnl-note { text-align: left; }
@media (prefers-reduced-motion: reduce) { .tut-box { animation: none; } }

.tut-focus {
  position: relative;
  z-index: 501 !important;
  outline: 3px solid var(--green);
  outline-offset: 3px;
  border-radius: 14px;
  box-shadow: 0 0 0 6px rgba(79,169,140,0.25), var(--shadow) !important;
}

/* ---------- v6: 今日やること ---------- */

/* Level クラス(v93 便AM-9): lv1=そのタブで今日最初にタップする1枚(藍レール+淡藍地・1タブ1枚) / lv2=白カード(既定) / lv3=操作の無い面(枠なし) */
.lv1 { } /* v94: B では板と同じ。起点は見出しの藍レールと最上段の位置が示す */
.lv3 { background: transparent; border: 0; box-shadow: none; padding: 0; }
.lv3 > canvas { border-radius: var(--radius); display: block; }
/* 今日の経営(v87 便AM-3): 1〜3行。各行=目標+進捗+タップ先。行全体が data-goto のボタン */
.td-row { display: flex; align-items: center; gap: 10px; width: calc(100% + 28px); min-height: 56px; padding: 10px 14px; margin: 0 -14px; border: 0; border-top: 1px solid var(--line); border-radius: 0; background: transparent; text-align: left; font: inherit; color: var(--ink); }
.td-row.now { background: var(--blue-pale); } /* いま押す行=決断の淡藍(v94。amber はお金へ) */
.td-num { flex: 0 0 auto; font: 800 15px/1 var(--en); color: var(--blue-deep); width: 22px; text-align: center; display: inline-flex; justify-content: center; }
.td-body { flex: 1 1 auto; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.td-text { font: 700 14px/1.4 var(--sans); color: var(--ink); }
.td-sub { font: 400 12px/1.5 var(--sans); color: var(--ink-2); }
.td-go { flex: 0 0 auto; font: 800 16px/1 var(--en); color: var(--blue-deep); }
.td-row.td-req { cursor: default; }
.td-row.done { border-color: var(--line); background: var(--card); opacity: 0.85; } /* 達成は ✅ だけで示す。緑地は使わない(designer v89・第22条) */
.onb-list { margin: 0; padding-left: 1.4em; display: grid; gap: 6px; }
.onb-list li { font: 500 12.5px/1.5 var(--sans); color: var(--ink-2); }
.onb-list li b { color: var(--blue-deep); margin-right: 4px; }
.onb-list li small { display: block; color: var(--ink-3); }
.onb-list li.now { color: var(--ink); font-weight: 700; }
.onb-list li.past { opacity: 0.6; }
.shop-locked { margin: 8px 0 0; font: 600 11.5px/1.5 var(--sans); color: var(--ink-3); }
.yesterday-card .rs-grid.rs-3 { grid-template-columns: repeat(3, 1fr); }
.yesterday-card .rs-item > b { font-weight: 700; font-size: 13px; } /* Level2 は今日の行(13px/700)より格上げしない(designer v90) */
.yesterday-card .rs-more { margin-top: 8px; }
.td-foot { margin-top: 8px; display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }
.todo-row { display: flex; gap: 10px; align-items: flex-start; margin: 4px 0; }
.todo-tag {
  flex: 0 0 auto;
  font: 800 10.5px/1.4 var(--sans);
  color: var(--blue-deep);
  background: var(--blue-pale);
  border-radius: 999px;
  padding: 4px 10px;
  margin-top: 2px;
  white-space: nowrap;
}
.todo-tag.mission { color: var(--blue-deep); background: var(--blue-pale); }
.todo-row p { font: 500 12.5px/1.75 var(--sans); color: var(--ink-2); }

.fix-row { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 10px; }
.fix-chip {
  border: 1px solid var(--blue-deep);
  background: var(--card);
  color: var(--blue-deep);
  font: 700 13px/1.3 var(--sans);
  border-radius: 10px;
  padding: 9px 14px;
  min-height: 44px; /* v91: 36px だった。タップ領域 44px(社長⑨) */
}
.fix-chip:active { transform: scale(0.97); }

/* ---------- v6: 段階解放 ---------- */

.shop-row.locked { opacity: 0.55; }
.shop-row.locked .shop-name { color: var(--ink-3); }
.mgmt-lock {
  font: 600 12.5px/1.8 var(--sans);
  color: var(--ink-2);
  background: var(--card);
  border: 1.5px dashed rgba(62,124,166,0.35);
  border-radius: var(--radius);
  padding: 12px 16px;
}
.unlock-list { margin: 8px 0 8px 4px; list-style: none; }
.unlock-list li { font: 500 13px/2 var(--sans); color: var(--ink-2); }
.unlock-list b { color: var(--blue-deep); }

/* ---------- v6: 1日の結果画面 ---------- */

.rs-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 8px;
  margin: 10px 0;
}
.rs-item {
  background: var(--bg-deep);
  border-radius: 12px;
  padding: 8px 10px;
  display: flex;
  flex-direction: column;
  gap: 1px;
}
.rs-item > small { font: 600 10px/1.4 var(--sans); color: var(--ink-3); }
.rs-item > b { font: 800 15px/1.3 var(--en); color: var(--ink); }
.rs-item > b.pos-t { color: var(--green-deep); }
.rs-item > b.neg-t { color: var(--red); }
.rs-delta { font: 700 10.5px/1.4 var(--en); }
.rs-delta.up { color: var(--green-deep); }
.rs-delta.down { color: var(--red); }
.rs-flat { font: 600 10px/1.4 var(--sans); color: var(--ink-3); }
.rs-bottle {
  background: var(--red-pale);
  border-radius: 10px;
  padding: 9px 12px;
  font: 600 12.5px/1.7 var(--sans);
  color: var(--ink-2);
  margin: 8px 0;
}
.rs-voice { margin-top: 8px; }
.rs-next { font: 600 12.5px/1.7 var(--sans); color: var(--ink-2); margin-top: 8px; }
.rs-next b { color: var(--blue-deep); }

/* ---------- v7: メダル経済・実績・改名 ---------- */

.hud-val.medal { color: var(--ink); }

.badge-btn { cursor: pointer; pointer-events: auto; }
.badge-btn:active { transform: scale(0.97); }
.name-edit { color: var(--ink-3); font-weight: 600; }
.name-input {
  width: 100%;
  border: 1.5px solid var(--line);
  border-radius: 10px;
  padding: 11px 13px;
  font: 700 15px/1.4 var(--sans);
  color: var(--ink);
  margin: 8px 0;
  background: var(--bg);
}
.name-input:focus { outline: 2px solid var(--blue); }

.boost-on {
  font: 800 10px/1.4 var(--sans);
  color: var(--green-deep);
  background: var(--green-pale);
  border-radius: 999px;
  padding: 2px 8px;
  margin-left: 4px;
}

.ach-grid { display: flex; flex-wrap: wrap; gap: 7px; }
.ach-chip {
  font: 600 11px/1.5 var(--sans);
  color: var(--ink-3);
  background: var(--bg-deep);
  border: 1px solid var(--line);
  border-radius: 999px;
  padding: 6px 11px;
}
.ach-chip b { color: var(--ink-3); font-weight: 700; margin-left: 2px; }
.ach-chip.done {
  color: var(--blue-deep);
  background: var(--blue-pale);
  border-color: rgba(62,124,166,0.45);
  font-weight: 700;
}
.ach-chip.done b { color: var(--blue-deep); }

/* ---------- v8: デイリー・殿堂 ---------- */

.todo-tag.daily { color: var(--green-deep); background: var(--green-pale); }
.daily-done { color: var(--green-deep); }
.daily-streak {
  font: 700 15px/1.7 var(--sans);
  color: var(--ink);
  background: var(--blue-pale);
  border-radius: 12px;
  padding: 10px 14px;
  text-align: center;
  margin-bottom: 8px;
}
.daily-streak b { color: var(--blue-deep); font-size: 17px; }
#prestigeCard { border-top: 4px solid transparent; border-image: linear-gradient(90deg, var(--blue), var(--green)) 1; }

/* ---------- v9: コイン・倍速解放・キャラ依頼 ---------- */

.speed-btn.locked { opacity: 0.6; background: var(--bg-deep); color: var(--ink-3); border-style: dashed; }
.daily-req { display: flex; flex-direction: column; gap: 4px; }
.daily-req svg, .todo-row p svg { vertical-align: -5px; margin-right: 2px; }

/* ---------- v6: スマホは下部ナビ(親指ファースト) ---------- */

@media (min-width: 361px) and (max-width: 374px) { .hud-val { font-size: 18px; } } /* v95 qa: 20px では「¥150万」が列幅 64px を 3px 超える。375px 以上は 20px */
@media (max-width: 719px) {
  #hClock { display: none; } /* 時計は PC 幅だけ(Level2) */
  .brand { display: none; } /* v87: 画面の27%を占めたヘッダーを2段に。名は扉と PWA 名が持つ */
  .tabs {
    position: fixed;
    top: auto;
    bottom: 0;
    left: 0;
    right: 0;
    max-width: none;
    z-index: 90;
    background: var(--card);
    border-top: 1px solid var(--line);
    box-shadow: none;
    padding: 0 4px calc(6px + env(safe-area-inset-bottom));
    gap: 0;
  }
  .tab-btn { border-top: 3px solid transparent; border-radius: 0; margin-right: 0; padding: 8px 4px 6px; background: transparent; min-height: 56px; font-size: 10.5px; }
  .tab-btn.on { background: transparent; border-top-color: var(--blue-deep); box-shadow: none; }
  .main { padding-bottom: 96px; }
  .toast { bottom: 88px; }
}

/* ---------- PC ---------- */

@media (min-width: 720px) {
  .ctrl-grid { grid-template-columns: repeat(3, 1fr); }
  .branch-card .ctrl-grid { grid-template-columns: repeat(2, 1fr); } /* 分院の操作パネルは2列: 正式名称の見出し(18字)が3列幅では折れて末尾1字が孤立する(v83 便AK designer) */
  .tabs { top: 108px; }
  .hud { gap: 8px 22px; }
  .hud-val { font-size: 20px; } /* v95: 361px 以上は 20px(決裁 c・計測値) */
  .card { padding: 20px 24px; }
}

/* ---------- v10: 倍速パス・キャラ信頼度・依頼の受諾 ---------- */

.bond-hearts { font-style: normal; color: var(--red); font-size: 10px; letter-spacing: 1px; margin-left: 2px; }
.chain-tag {
  font: 800 10px/1.4 var(--sans);
  color: var(--blue-deep);
  background: var(--blue-pale);
  border-radius: 999px;
  padding: 2px 8px;
  margin: 0 4px 0 2px;
}
.req-body { flex: 1; }
.req-body p { font: 500 12.5px/1.75 var(--sans); color: var(--ink-2); }
.req-on { color: var(--blue-deep); }
.req-passed { color: var(--ink-3); }
.req-note { display: block; font: 500 10.5px/1.6 var(--sans); color: var(--ink-3); margin-top: 2px; }
.fix-chip.ghost { background: var(--card); color: var(--ink-2); border-color: var(--line); }
.td-req .fix-chip:not(.ghost) { background: var(--blue-deep); color: #fff; } /* 依頼の「受ける」=塗り */

/* ---------- v11: 混雑離脱・スペシャル・月間決算 ---------- */

.rs-bottle.rs-balk { background: var(--red-pale); color: var(--red); font-weight: 700; }
.sp-star { font-style: normal; color: var(--blue); font-size: 11px; margin-left: 2px; }

/* ---------- v12: 地域リーグ ---------- */

.lg-table { display: flex; flex-direction: column; margin-top: 10px; }
.lg-row {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 7px 4px;
  border-bottom: 1px dashed var(--line);
  font: 500 12px/1.5 var(--sans);
  color: var(--ink-3);
}
.lg-row b.lg-name { font-weight: 700; color: var(--ink-2); flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.lg-row.beaten { opacity: 0.55; }
.lg-row.beaten .lg-name { text-decoration: line-through; }
.lg-row.you { background: var(--blue-pale); border-left: 4px solid var(--blue); border-radius: 10px; border-bottom: none; padding: 9px 8px; }
.lg-row.you .lg-name { color: var(--blue-deep); }
.lg-tier {
  flex: 0 0 auto;
  font: 800 9.5px/1.4 var(--sans);
  border-radius: 999px;
  padding: 2px 8px;
  background: var(--bg-deep);
  color: var(--ink-3);
}
.lg-tier.t-you { background: var(--blue-deep); color: #fff; }
.lg-rev { font: 700 11px/1.4 var(--en); color: var(--ink-2); white-space: nowrap; }
.lg-check { font: 700 10.5px/1.4 var(--sans); color: var(--green-deep); font-style: normal; white-space: nowrap; }
.lg-gap { font: 800 11px/1.4 var(--sans); color: var(--blue-deep); margin-left: 6px; }

/* ---------- v13: シェア ---------- */

.share-btn { width: 100%; margin-top: 10px; }

/* ---------- v14: レセプト(算定の学び) ---------- */

.receipt-card { border-left: 4px solid var(--blue); }
.rcpt-head { font: 700 12.5px/1.5 var(--sans); color: var(--ink); margin-bottom: 4px; }
.rcpt-head small { color: var(--ink-3); font-weight: 500; }
.rcpt-row {
  display: flex;
  justify-content: space-between;
  gap: 6px; /* 長い行名(薬剤名+規格)が点数と融合しない最低余白(v47 designer実測: 320pxでgap0.14pxの行があった) */
  font: 500 12px/1.7 var(--sans);
  color: var(--ink-2);
  padding: 1.5px 0;
  border-bottom: 1px dotted var(--line);
}
.rcpt-row span { min-width: 0; } /* 名前側を必要なら早めに折り返す */
.rcpt-row b { font-family: var(--en); font-weight: 700; color: var(--blue-deep); }
.rcpt-row.total { border-top: 1.5px solid var(--line); border-bottom: none; margin-top: 3px; padding-top: 5px; font-weight: 800; color: var(--ink); }
.rcpt-row.total b { color: var(--green-deep); font-size: 14px; }
.rcpt-note { font: 500 10px/1.6 var(--sans); color: var(--ink-3); margin-top: 6px; }
.kasan-ten { color: var(--green-deep); }
.rs-learn {
  background: var(--blue-pale);
  border-radius: 10px;
  padding: 9px 12px;
  font: 600 12.5px/1.6 var(--sans);
  color: var(--ink-2);
  margin-top: 8px;
}
.rs-learn small { font-weight: 500; color: var(--ink-3); }

/* ---------- v16: コックピットレイアウト(横持ち・ワイド画面) ----------
 * 900px以上: 左に3Dステージを常時表示(スティッキー)、右に操作パネル。
 * スライダーを動かした瞬間に患者の流れが変わるのを「見ながら」操作できる。 */

@media (min-width: 900px) {

  /* 法人タブは拠点の索引=読む列。行長を本文幅に収める(第23条) */
  #tab-corp.show { max-width: 800px; margin-left: auto; margin-right: auto; }

  /* ステージのあるタブ(院内・タウン): 2カラムのコックピット */
  #tab-clinic.show, #tab-town.show {
    display: grid;
    grid-template-columns: minmax(380px, 46%) minmax(0, 1fr);
    gap: 14px;
    align-items: start;
  }
  #tab-clinic.show > *, #tab-town.show > * { grid-column: 2; min-width: 0; }
  #tab-clinic.show > .stage-wrap, #tab-town.show > .stage-wrap {
    grid-column: 1;
    grid-row: 1 / span 99;
    position: sticky;
    top: 162px;
    border-radius: var(--radius);
    border-top: 1px solid var(--line);
  }
  /* ステージのない経営タブ: 2カラムのダッシュボード */
  #tab-mgmt.show {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: 14px;
    align-items: start;
  }
  #tab-mgmt.show > .note { grid-column: 1 / -1; }
}

/* 横持ちスマホ(背が低い): ヘッダーを流して遊び場を最大化 */
@media (min-width: 900px) and (max-height: 540px) {
  .head { position: static; }
  .tabs { position: static; }
  .eyebrow { display: none; }
  .head { padding-top: 6px; }
  .hud { margin-top: 4px; }
  #tab-clinic.show > .stage-wrap, #tab-town.show > .stage-wrap {
    position: sticky;
    top: 8px;
  }
}

/* ---------- v17: ライブモニター ---------- */

#pulseChart { display: block; width: 100%; max-width: 100%; } /* v91: renderPulse が px 幅を inline で書くため、画面が狭くなった直後(回転)に右へはみ出た */
.pulse-legend {
  display: flex;
  flex-wrap: wrap;
  gap: 6px 14px;
  margin-top: 6px;
  font: 600 11px/1.5 var(--sans);
}
.pulse-legend b { font-family: var(--en); }

/* ---------- v18: 打ち手マーカー・月間レセプト集計 ---------- */

.pulse-ev {
  font: 600 10px/1.5 var(--sans);
  color: var(--blue-deep);
  background: var(--blue-pale);
  border-radius: 999px;
  padding: 2px 8px;
}
.acct-row {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 5px 0;
  border-bottom: 1px dotted var(--line);
}
.acct-info { flex: 1; min-width: 0; }
.acct-name { font: 600 11.5px/1.5 var(--sans); color: var(--ink-2); display: block; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.acct-bar { height: 5px; background: var(--bg-deep); border-radius: 999px; overflow: hidden; }
.acct-bar i { display: block; height: 100%; background: linear-gradient(90deg, var(--blue), var(--green)); border-radius: 999px; }
.acct-n { font: 600 10.5px/1.3 var(--sans); color: var(--ink-3); text-align: right; flex: 0 0 auto; display: flex; flex-direction: column; }
.acct-n small { font-size: 9.5px; }
.acct-yen { font: 700 12px/1.3 var(--en); color: var(--blue-deep); flex: 0 0 auto; min-width: 84px; text-align: right; }

/* ===== v20: 算定クイズ・応援配置 ===== */
.todo-tag.quiz { background: var(--blue-pale); color: var(--blue-deep); }
.quiz-q { font-weight: 700; line-height: 1.6; margin: 4px 0 10px; }
.quiz-actions { display: flex; gap: 10px; }
.quiz-actions .btn-cta { flex: 1; }
.quiz-actions .btn-cta:disabled { opacity: 0.45; pointer-events: none; }

/* ===== v22: 🚶 3D視察モード ===== */
.walk-launch { background: #3E7CA6; color: #fff; border-color: #3E7CA6; }
.walk-ov {
  position: fixed; inset: 0; z-index: 250; display: none;
  background: #DCEAF2; touch-action: none; overscroll-behavior: none;
}
.walk-canvas { position: absolute; inset: 0; width: 100%; height: 100%; display: block; }
.walk-hud-top {
  position: absolute; top: max(10px, env(safe-area-inset-top)); left: 12px; right: 12px;
  display: flex; justify-content: space-between; align-items: flex-start; gap: 10px;
  pointer-events: none;
}
.walk-info {
  background: rgba(34,51,61,0.78); color: #fff; border-radius: 12px;
  padding: 8px 14px; font: 500 12.5px/1.55 var(--sans);
}
.walk-info b { font-size: 13.5px; }
.walk-exit {
  pointer-events: auto; border: none; border-radius: 12px;
  background: rgba(34,51,61,0.85); color: #fff;
  font: 700 13px/1 var(--sans); padding: 12px 16px; white-space: nowrap; /* v96 qa: 320px で「視察を終える」が5行に折れた */
  box-shadow: 0 4px 14px rgba(34,51,61,0.35);
}
.walk-hint {
  position: absolute; bottom: max(10px, env(safe-area-inset-bottom)); left: 50%;
  transform: translateX(-50%);
  background: rgba(255,255,255,0.85); color: #40525E; border-radius: 999px;
  padding: 7px 16px; font: 600 11px/1.4 var(--sans);
  white-space: nowrap; max-width: calc(100vw - 24px); overflow: hidden; text-overflow: ellipsis;
  pointer-events: none;
}
.walk-stick {
  position: absolute; left: 22px; bottom: max(56px, calc(env(safe-area-inset-bottom) + 48px));
  width: 128px; height: 128px; border-radius: 50%;
  background: rgba(255,255,255,0.22); border: 2px solid rgba(255,255,255,0.45);
  touch-action: none; pointer-events: none; opacity: 0.55;
  transition: opacity 0.15s;
}
.walk-stick.on { opacity: 1; background: rgba(255,255,255,0.3); border-color: rgba(255,255,255,0.65); }
.walk-knob {
  position: absolute; left: 50%; top: 50%; width: 54px; height: 54px;
  margin: -27px 0 0 -27px; border-radius: 50%;
  background: rgba(255,255,255,0.88); box-shadow: 0 3px 10px rgba(34,51,61,0.3);
}
@media (hover: hover) and (pointer: fine) { .walk-stick { display: none; } }
.walk-act {
  position: absolute; left: 50%; bottom: max(46px, calc(env(safe-area-inset-bottom) + 40px));
  transform: translateX(-50%);
  border: none; border-radius: 999px;
  background: #4FA98C; color: #fff;
  font: 700 14px/1 var(--sans); padding: 15px 26px;
  box-shadow: 0 6px 20px rgba(34,51,61,0.35);
  max-width: calc(100vw - 180px); white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.walk-act:active { transform: translateX(-50%) scale(0.96); }
.walk-rotate {
  position: absolute; inset: 0; z-index: 5;
  background: rgba(34,51,61,0.72);
  display: flex; align-items: center; justify-content: center;
}
.walk-rotate-box {
  background: #fff; border-radius: 18px; padding: 26px 26px 20px;
  max-width: 320px; text-align: center;
  font: 500 13.5px/1.7 var(--sans); color: var(--ink);
}
.walk-rotate-icon { font-size: 44px; margin-bottom: 8px; animation: walkRotateWiggle 1.6s ease-in-out infinite; }
@keyframes walkRotateWiggle {
  0%, 100% { transform: rotate(0deg); }
  50% { transform: rotate(90deg); }
}
.walk-rotate-box .btn-cta { margin-top: 14px; width: 100%; }

/* ===== v25: ペルソナ(人格)+📸現場の一コマ ===== */
.persona-speech {
  background: var(--amber-pale); border: 1px solid var(--edge); border-radius: 12px;
  padding: 10px 14px; margin: 2px 0 12px;
  font: 600 13.5px/1.65 var(--sans); color: var(--amber);
  display: flex; align-items: center; gap: 9px;
}
.persona-speech svg { flex: 0 0 auto; }
.walk-hud-right { display: flex; gap: 8px; pointer-events: auto; flex: 0 0 auto; }
.walk-hud-top .walk-info { min-width: 0; flex: 1 1 auto; } /* 縮むのは情報札の側 */
@media (max-width: 400px) { .walk-hud-top { flex-wrap: wrap; } .walk-hud-right { margin-left: auto; } .walk-hud-top .walk-info { flex: 1 1 100%; order: 2; } } /* 狭い幅はボタン行→情報札の2段 */
.walk-cam { font-size: 17px; padding: 12px 14px; }

/* ===== 診療報酬KB統合(v33): 会計詳細・学習モード ===== */
.rcpt-head { display: flex; align-items: flex-start; gap: 8px; flex-wrap: wrap; }
.rcpt-head-t { flex: 1 1 auto; min-width: 0; }
.rcpt-tools { margin-left: auto; display: flex; gap: 4px; flex: 0 0 auto; }
.sim-tag { font: 600 9px/1 var(--sans); color: var(--ink-3); border: 1px solid var(--line); border-radius: 3px; padding: 1px 3px; font-style: normal; margin-left: 3px; }
.rcpt-detail { margin-top: 8px; border-top: 1px dashed var(--line); padding-top: 7px; }
.kb-ev { padding: 7px 0; border-bottom: 1px dotted var(--line); font: 600 11px/1.5 var(--sans); color: var(--ink); }
.kb-reject { padding: 6px 8px; border-radius: 8px; background: var(--bg-deep); border-left: 3px solid var(--ink-3); margin: 6px 0; font: 600 11px/1.5 var(--sans); color: var(--ink); }
/* 理由・施設基準導線・警告は行動につながる本文。AA(4.5:1)を割らない(保留#6の先例=v46 PM裁定) */
.kb-cond { font: 500 10.5px/1.55 var(--sans); color: var(--ink-2); margin-top: 2px; }
/* 註釈(項目のconditions説明・施設基準のgameNote)。v46 designer裁定「一次資料の引用より強くしない」は
   --ink-3(10px)でコントラスト3.19:1=AA未達だったため、v55(保留#34)で --ink-2(6.87:1)に更新。
   引用(.kb-quote)も --ink-3(3.19:1=AA未達)だったため v57(保留#37)で --ink-2 に上げた。註釈と引用の階層は色ではなく字下げと「」で保ち、
   左罫線は補助(v57で罫線を--ink-3にして名実ともに階層を担わせた。v55 designer承認・v57で引用側にも適用) */
.kb-cond.is-note { font-size: 10px; color: var(--ink-2); }
.kb-quote { font: 500 10px/1.6 var(--sans); color: var(--ink-2); margin-top: 3px; border-left: 2px solid var(--ink-3); padding-left: 6px; } /* 一次資料の引用。--ink-3は10pxで3.19:1=AA未達のため--ink-2(6.87:1)へ(v57 保留#37) */
.kb-trace { font: 500 9px/1.4 var(--en); color: var(--ink-3); background: var(--bg); border-radius: 6px; padding: 6px; overflow-x: auto; max-height: 180px; }
.kijun-row { align-items: flex-start; }
.kijun-row b { word-break: keep-all; }
/* 否定的確認の一文が載る(#35)。--ink-3(3.19:1)はAA未達=--ink-2へ(v46 PM裁定「行動につながる本文はAAを割らない」の適用・v56) */
.kijun-kb { font: 500 10px/1.55 var(--sans); color: var(--ink-2); display: block; margin-top: 6px; }
.kijun-kb b { color: var(--ink-2); }
.kijun-badge.alt { color: var(--blue-deep); background: transparent; border-color: var(--blue); }
.kijun-badge.off { color: var(--ink-2); background: transparent; border-color: var(--line); } /* 「未(足りないもの)」は行動につながる本文=AA(v56) */
.kijun-badge.wrap { white-space: normal; text-align: left; border-radius: 12px; display: inline-block; max-width: 100%; }
.spec-row { padding: 6px 2px; border-bottom: 1px dotted var(--line); font: 600 12px/1.5 var(--sans); color: var(--ink); }
.spec-row small { display: block; font-weight: 500; color: var(--ink-3); }

/* ===== 診療科部門(v35): 法人タブ 索引+1件展開 ===== */
.site-row {
  display: flex; align-items: center; gap: 8px;
  /* バッジ等が収まらない狭幅では部門名を主役に保ち、残りを次行の右へ落とす
     (v49 designer実測: 390pxで名前が1文字に潰れていた。先例=.kijun-rowの折返し) */
  flex-wrap: wrap; row-gap: 4px; justify-content: flex-end;
  width: 100%; text-align: left;
  border: 1px solid var(--line); background: var(--card);
  border-radius: 12px; padding: 10px 12px; margin: 6px 0;
  font: 700 13px/1.5 var(--sans); color: var(--ink);
  min-height: 44px;
}
.site-row.on { border-color: rgba(62, 124, 166, 0.45); background: var(--blue-pale); }
.site-name { flex: 1 1 auto; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.site-badge {
  flex: 0 0 auto; font: 700 10px/1 var(--sans); color: var(--blue-deep);
  background: var(--blue-pale); border: 1px solid rgba(62, 124, 166, 0.25);
  border-radius: 999px; padding: 4px 8px; white-space: nowrap;
}
.site-row.on .site-badge { background: var(--card); }
.kb-ev.total { display: flex; justify-content: space-between; border-bottom: 2px solid var(--ink-3); font-weight: 800; }
.kijun-flash { outline: 2px solid var(--blue-deep); outline-offset: 2px; }
.site-warn { flex: 0 0 auto; font-size: 12px; }
.site-stat { margin-left: auto; font: 700 11px/1.4 var(--en); color: var(--ink-3); white-space: nowrap; }
.site-caret { flex: 0 0 auto; color: var(--ink-3); font-size: 10px; }
.site-detail { border-left: 3px solid rgba(62, 124, 166, 0.25); margin: 2px 0 12px; padding: 4px 0 4px 10px; }

/* 部門カード: 主役レバー(排他選択)。kb-rejectの逆向き=選択中を左ボーダーで示す */
.dept-lever { margin: 10px 0; }
.dept-lever .ctrl-head { display: block; margin-bottom: 6px; }
.choice-row {
  display: flex; align-items: flex-start; gap: 8px;
  width: 100%; text-align: left;
  border: 1px solid var(--line); background: var(--card);
  border-left: 3px solid var(--line);
  border-radius: 8px; padding: 9px 10px; margin: 5px 0;
  font: 500 11px/1.55 var(--sans); color: var(--ink-2);
  min-height: 44px;
}
.choice-row b { flex: 0 0 auto; font: 800 12px/1.4 var(--sans); color: var(--ink); }
.choice-row.on { border-left-color: var(--blue); background: var(--blue-pale); color: var(--ink); }
.choice-row.on b { color: var(--blue-deep); }
.choice-row.has-cap { flex-wrap: wrap; row-gap: 2px; } /* 本院精神科の3択: 目安は行を折り返して末尾に置き、3行とも同じ x に揃える(v82 便AF-3 designer照合) */
.choice-row.has-cap span { flex: 1 1 0; min-width: 0; } /* 説明は見出しの横に留める(折り返すのは目安だけ) */
.choice-row.has-cap .dt-cap { flex: 0 0 100%; }
.spec-open { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 8px; margin-top: 5px; }
.spec-open small { flex: 1 1 100%; font: 500 10px/1.5 var(--sans); color: var(--ink-3); }
.spec-open .mini-btn { flex: 0 0 auto; }

/* ===== 🔀 経営の分岐点(v70): 開始の扉と同じ器(.tut-box.gate-box)。新色なし・既存トークンのみ ===== */
.dec-head { display: flex; align-items: center; gap: 10px; margin-bottom: 8px; flex-wrap: wrap; }
.dec-face svg, .dec-emoji { flex: 0 0 auto; width: 40px; height: 40px; border-radius: 50%; background: var(--bg-deep); display: inline-flex; align-items: center; justify-content: center; font-size: 22px; }
.dec-whobox { flex: 1 1 auto; min-width: 0; display: flex; flex-direction: column; }
.dec-whobox small { font: 600 10.5px/1.4 var(--sans); color: var(--ink-3); }
.dec-whobox b { font: 800 14px/1.4 var(--sans); color: var(--ink); }
.dec-head .tut-step { order: 3; flex: 1 1 100%; max-width: none; text-align: left; white-space: normal; line-height: 1.5; margin-top: 4px; padding-left: 50px; letter-spacing: 0; font-family: var(--sans); } /* 題より分類が幅を取らない(designer D)。分類名は和文 */
.dec-say { font: 600 13px/1.8 var(--sans); color: var(--ink); margin: 0 0 6px; }
.dec-bg { font: 500 11.5px/1.7 var(--sans); color: var(--ink-2); margin: 0 0 6px; }
.dec-facts { display: flex; flex-wrap: wrap; gap: 6px; margin: 4px 0 8px; }
.dec-ask { font: 600 12px/1.6 var(--sans); color: var(--ink-2); margin: 0 0 6px; padding: 6px 10px; border-left: 4px solid var(--amber); background: var(--amber-pale); border-radius: 0 8px 8px 0; } /* v93: --amber は「いま決める場所」だけ(.td-row.now と ここ) */
.dec-ask b { color: var(--blue-deep); }
.dec-choices { display: flex; flex-direction: column; }
.dec-choice { flex-direction: column; gap: 2px; }
.dec-choice small { font: 500 10.5px/1.5 var(--sans); color: var(--ink-2); }
.dec-choice.blocked { border-style: dashed; background: var(--bg); } /* 押せないことは色の後退で示す。理由の本文はAAを割らない(designer B) */
.dec-choice.blocked b { color: var(--ink-2); }
.dec-block { color: var(--red); font-style: normal; }
.dec-preview { margin-top: 10px; padding: 8px 0 0; border-top: 1.5px solid var(--line); } /* 塗りの器に載せると数字がAAを割る(designer C)。罫で区切る */
.dec-plabel { display: block; font: 700 10px/1.4 var(--sans); color: var(--ink-2); letter-spacing: 0.06em; margin: 2px 0 4px; }
.dec-line { padding: 3px 0; font-size: 11.5px; flex-wrap: wrap; }
.dec-sub { flex: 1 1 100%; display: block; text-align: right; font: 500 10.5px/1.5 var(--sans); color: var(--ink-2); }
.dec-line b .dec-sub { font-weight: 500; }
/* 選択肢を押すと器が伸びて確定が枠外へ出る(375×667実測)。確定は常に見えている(designer A) */
.dec-box .tut-btns { position: sticky; bottom: 0; z-index: 1; margin: 10px -18px -14px; padding: 10px 18px 14px; background: var(--card); box-shadow: 0 -8px 12px -8px rgba(34,51,61,0.18); }
.dec-line b.pos { color: var(--green-deep); }
.dec-line b.neg { color: var(--red); }
.dec-line.later span::before { content: '⏳ '; }
.dec-none, .dec-hint { font: 500 11px/1.6 var(--sans); color: var(--ink-3); margin: 6px 0 0; }
.dec-why { font: 500 10.5px/1.6 var(--sans); color: var(--ink-2); margin: 6px 0 0; }
.dec-reflect { margin-top: 10px; padding-left: 10px; border-left: 3px solid var(--blue); }
.dec-reflect p { font: 500 12px/1.8 var(--sans); color: var(--ink-2); margin: 0 0 4px; }
.dec-log { display: flex; flex-wrap: wrap; align-items: flex-start; justify-content: space-between; gap: 6px 8px; padding: 8px 0; border-bottom: 1px dashed var(--line); font: 500 12px/1.6 var(--sans); color: var(--ink-2); }
.dec-log > div { flex: 1 1 100%; min-width: 0; }
.dec-log small { color: var(--ink-2); font-size: 10.5px; }
.dec-log .mini-btn { flex: 0 0 auto; margin-left: auto; } /* 題を折らず次行の右へ(designer N・.kijun-row の先例) */
.dec-rewind { flex-direction: column; }
.dec-rewind .op-btn { width: 100%; }

/* ---------- v93 便AM-9: カード単位の畳み(経営タブ)。開閉は保存しない ---------- */
.fold-h { margin: 0; font: inherit; } /* v95 保留#50: 見出し構造を保つ(畳んだ札の h2 は fold-head を包む) */
.fold-head { width: 100%; min-height: 44px; display: flex; align-items: center; gap: 8px; background: none; border: 0; padding: 0; text-align: left; font: inherit; color: inherit; }
.fold-head b { font: 800 14.5px/1.5 var(--sans); color: var(--blue-deep); }
.fold-head small { flex: 1 1 auto; font: 500 11px/1.5 var(--sans); color: var(--ink-3); }
.fold-head i { font-style: normal; color: var(--ink-3); margin-left: auto; transition: transform 0.15s ease; } /* 副題が無い札でも ▸ は右端(designer A) */
.fold.open .fold-head i { transform: rotate(90deg); }
.fold-body[hidden] { display: none; }
.fold .fold-body > .card-title, .fold .fold-body > .card-head > .card-title { display: none; } /* 題は fold-head が持つ */
.fold .fold-body > .card-head { justify-content: flex-end; }
@media (prefers-reduced-motion: reduce) { .fold-head i { transition: none; } } /* 基底の .fold-head i より後ろに置く(同じ詳細度なので順序で決まる・qa v93) */

/* ---------- v94 便AN-1: 線画アイコン(app/ui/icons.js)。絵文字の代わり ---------- */
.ic { width: 1.15em; height: 1.15em; display: inline-block; vertical-align: -0.22em; margin-right: 0.28em; flex: 0 0 auto; }
.ic:last-child { margin-right: 0; }
.ic.fill g { fill: currentColor; }
.tab-btn .ic { display: block; width: 22px; height: 22px; margin: 0 auto 3px; }
.icon-btn .ic, .speed-btn .ic, .mini-btn .ic, .fix-chip .ic { margin-right: 0.2em; }
.card-title .ic, .fold-head b .ic { width: 1.1em; height: 1.1em; color: var(--blue-deep); }
.td-num .ic { width: 20px; height: 20px; margin: 0; }

/* ---------- v94 便AN-1: 数字は等幅(桁が揃う) ---------- */
.shop-count, .pnl-row b, .jihi-stat b, .kpi b, .rs-item b, .lg-rev, .hud-val, .dec-line b, .cer > span, .fold-head small, .num { font-family: var(--en); font-variant-numeric: tabular-nums; }
.cer > b { font-family: var(--sans); }
