/*
 * 常時表示の進捗監視盤（TD1655）。
 *
 * 【iPadを変えないための約束】
 *   この file の指定は、すべて `:root.is-board` の下に置く。
 *   `is-board` は board.js が `?board=1` のときだけ付ける。
 *   付かない端末（iPad・ふつうに開いたPC）では、1つも効かない。
 *   scripts/check-ui.mjs が、この約束を機械で確かめる。
 *
 * 【色と寸法】
 *   生の色・生のpxを書かない。ortho-tokens.css のトークンだけを使う。
 *   寸法の根拠は 一覧UI_実装仕様 §3（実測値）。
 */

/* 一覧の上の「19件」は、監視盤では上部バーの件数と重複する */
:root.is-board .patients__total { display: none; }

:root.is-board .board-list {
  display: block;
}

/* ---------- 患者行（60px・1段組み） ---------- */
:root.is-board .board-row {
  display: grid;
  grid-template-columns:
    var(--board-band) var(--board-id) var(--board-nm) var(--board-dr)
    minmax(0, 1fr) var(--board-np) var(--board-rail) var(--board-due) var(--board-more);
  align-items: center;
  gap: 0 var(--board-gap);
  width: 100%;
  height: var(--board-row-h);
  padding: 0 var(--board-pad) 0 0;
  border: none;
  border-bottom: 1px solid var(--pc-line);
  background: var(--pc-surface);
  font-family: inherit;
  text-align: left;
  cursor: pointer;
}
:root.is-board .board-row:hover { background: var(--pc-accent-soft); }
:root.is-board .board-row:focus-visible {
  outline: var(--board-focus) solid var(--pc-accent);
  outline-offset: calc(-1 * var(--board-focus));
}

/* 期限の切迫度で、行そのものを塗る（立った距離から拾うため） */
:root.is-board .board-row--warn  { background: var(--pc-card-warn-bg); }
:root.is-board .board-row--alert { background: var(--pc-card-alert-bg); }

/* 左の帯。色だけに頼らず、行の端でも状態が分かるようにする */
:root.is-board .board-row__band { height: 100%; background: var(--pc-rail-todo); }
:root.is-board .board-row--warn  .board-row__band { background: var(--pc-rail-warn); }
:root.is-board .board-row--alert .board-row__band { background: var(--pc-rail-alert); }

:root.is-board .board-row__id {
  font-size: var(--board-fs-id);
  font-weight: 700;
  line-height: 1;
  color: var(--pc-ink);
  font-variant-numeric: tabular-nums;
}
:root.is-board .board-row__dr {
  font-size: var(--board-fs-kind);
  color: var(--pc-ink-muted);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
/* 1行のなかで一番大きい文字。上から流して読む欄 */
:root.is-board .board-row__next {
  font-size: var(--board-fs-next);
  font-weight: 700;
  line-height: 1.2;
  color: var(--pc-ink);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
:root.is-board .board-row__np {
  font-size: var(--board-fs-np);
  color: var(--pc-ink-muted);
  text-align: center;
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}

/* ---------- 進捗レール（見るだけ。押せない） ----------
   混在表示では、隣の行と工程の数も意味も違う。
   列としてそろえると「3列目は同じ意味」と誤読されるため、
   行ごとに等分し、外枠だけをそろえる（実装仕様 §1）。 */
:root.is-board .board-row__rail {
  display: grid;
  grid-template-columns: repeat(var(--cells, 7), minmax(0, 1fr));
  gap: 0 var(--board-cell-gap);
  align-items: center;
  padding: var(--board-cell-gap);
  border-radius: var(--board-radius);
  background: var(--pc-rail-frame);
}
:root.is-board .board-cell {
  display: flex;
  align-items: center;
  justify-content: center;
  height: var(--board-cell-h);
  border-radius: var(--board-cell-radius);
  border: 1px solid var(--pc-rail-todo);
  background: var(--pc-surface);
  color: var(--pc-ink-muted);
  font-size: var(--board-fs-cell);
  font-weight: 700;
  line-height: 1;
}
:root.is-board .board-cell--done  { background: var(--pc-rail-done);  border-color: var(--pc-rail-done);  color: var(--pc-on-fill); }
/* 「いま」は塗りつぶさない。遠目では緑の塗りと見分けが付かないため
   （2026-10-01 先生の指摘）。白地＋太い青の輪で、形として区別する。 */
:root.is-board .board-cell--now {
  background: var(--pc-surface);
  border: var(--board-ring) solid var(--pc-accent);
  color: var(--pc-accent);
}
:root.is-board .board-cell--warn  { background: var(--pc-rail-warn);  border-color: var(--pc-rail-warn);  color: var(--pc-on-fill); }
:root.is-board .board-cell--alert { background: var(--pc-rail-alert); border-color: var(--pc-rail-alert); color: var(--pc-on-fill); }

/* ---------- 期限 ---------- */
:root.is-board .board-row__due {
  font-size: var(--board-fs-due);
  font-weight: 700;
  text-align: right;
  white-space: nowrap;
  font-variant-numeric: tabular-nums;
  color: var(--pc-ink);
}
:root.is-board .board-row--todo .board-row__due {
  font-weight: 500;
  color: var(--pc-ink-muted);
}
:root.is-board .board-row--warn .board-row__due,
:root.is-board .board-row--alert .board-row__due {
  color: var(--pc-on-fill);
  border-radius: var(--board-pill);
  padding: var(--board-pill-y) var(--board-pill-x);
  font-size: var(--board-fs-kind);
}
:root.is-board .board-row--warn  .board-row__due { background: var(--pc-warn-fill); }
:root.is-board .board-row--alert .board-row__due { background: var(--pc-rail-alert); }

/* 押せることの目印。ボタンではない（行ぜんぶが当たり判定） */
:root.is-board .board-row__more {
  text-align: center;
  color: var(--pc-ink-muted);
  font-size: var(--board-fs-due);
}

/* ==========================================================================
 * 詳細パネル（実装仕様 §6）
 * 画面の下から重ねる。一覧は押し上げず、見える人数だけが減る。
 * ========================================================================== */
/* 2026-10-01 先生の指摘：詳細の枠が背景に紛れて分かりづらい。
   原因は2つあった。
     (1) --pc-accent-strong という存在しないトークンを使っていて、
         上の線の指定ごと無効になり、線が1本も出ていなかった
     (2) パネルの下地（薄い青）と「選んだ工程」の下地が同じ色だった
   パネルは白にして上に濃い線と影を置き、「紙が1枚せり上がった」形にする。 */
:root.is-board .board-panel {
  /* 症例タブは一覧の作りが違い、パネルの置き場所を持てない。
     画面の下へ固定して、どのタブでも同じ位置に出す。 */
  position: fixed;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 5;
  background: var(--pc-surface);
  border-top: var(--board-edge) solid var(--pc-bar-strong);
  box-shadow: var(--board-lift);
  padding: var(--board-gap-md) var(--board-panel-pad) var(--board-panel-pad);
}
/* 見出しは濃紺の帯にする。パネルの上端を線だけで示すと、
   離れた距離では境目が分からない（2026-10-01 先生の指摘）。 */
:root.is-board .board-panel__head {
  display: flex;
  align-items: center;
  gap: var(--board-gap-md);
  margin: calc(-1 * var(--board-gap-md)) calc(-1 * var(--board-panel-pad)) 0;
  padding: var(--board-gap-md) var(--board-panel-pad);
  background: var(--pc-bar-strong);
  font-size: var(--board-fs-btn);
  color: var(--pc-on-fill);
}
:root.is-board .board-panel__id {
  font-size: var(--board-fs-next);
  font-weight: 700;
  font-variant-numeric: tabular-nums;
}
/* 編集（担当医の変更・中断・削除）。濃紺の帯の上なので、白い枠にする */
:root.is-board .board-panel__editslot { margin-left: auto; }
:root.is-board .board-panel__editslot .btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
  height: var(--board-btn-h);
  min-height: var(--board-btn-h);
  padding: 0 var(--board-pad);
  border: var(--board-bd) solid var(--pc-on-fill);
  border-radius: var(--board-radius-lg);
  background: none;
  font-size: var(--board-fs-btn);
  font-weight: 700;
  line-height: 1;
  color: var(--pc-on-fill);
}
:root.is-board .board-panel__editslot .btn .icon { color: var(--pc-on-fill); }

:root.is-board .board-panel__close {
  height: var(--board-btn-h);
  padding: 0 var(--board-pad);
  border: var(--board-bd) solid var(--pc-on-fill);
  border-radius: var(--board-radius-lg);
  background: none;
  font-family: inherit;
  font-size: var(--board-fs-btn);
  font-weight: 700;
  color: var(--pc-on-fill);
  cursor: pointer;
}
:root.is-board .board-panel__hint {
  margin: var(--board-gap-sm) 0;
  font-size: var(--board-fs-step);
  color: var(--pc-ink-muted);
}

/* ---------- 工程ボタン ---------- */
:root.is-board .board-panel__steps {
  display: grid;
  grid-template-columns: repeat(var(--cells, 7), minmax(0, 1fr));
  gap: var(--board-gap-sm);
  margin-bottom: var(--board-gap-md);
}
:root.is-board .board-step {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: var(--board-gap-xs);
  height: var(--board-step-h);
  padding: 0 var(--board-gap-sm);
  border: var(--board-bd) solid var(--pc-rail-todo);
  border-radius: var(--board-radius-lg);
  background: var(--pc-rail-frame);
  font-family: inherit;
  font-size: var(--board-fs-step);
  line-height: 1.15;
  color: var(--pc-ink-muted);
  text-align: center;
  overflow: hidden;
  cursor: pointer;
}
:root.is-board .board-step__name {
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  overflow: hidden;
}
:root.is-board .board-step__mark { font-size: var(--board-fs-mark); font-weight: 700; }
:root.is-board .board-step__sub {
  font-size: var(--board-fs-step);
  color: var(--pc-ink);
  font-variant-numeric: tabular-nums;
}
:root.is-board .board-step--done  { border-color: var(--pc-rail-done); background: var(--pc-done-bg); }
:root.is-board .board-step--done  .board-step__mark { color: var(--pc-rail-done); }
:root.is-board .board-step--alert { border-color: var(--pc-rail-alert); background: var(--pc-card-alert-bg); }
:root.is-board .board-step--alert .board-step__mark { color: var(--pc-rail-alert); }
:root.is-board .board-step--warn  { border-color: var(--pc-rail-warn); background: var(--pc-card-warn-bg); }
:root.is-board .board-step--warn  .board-step__mark { color: var(--pc-warn-fill); }
:root.is-board .board-step--now {
  border: var(--board-ring) solid var(--pc-accent);
  background: var(--pc-surface);
}
:root.is-board .board-step--now   .board-step__mark { color: var(--pc-accent); }
:root.is-board .board-step {
  position: relative;
}
/* 選んでいる工程。3pxの細い枠では分かりづらかったので（2026-10-01 先生の指摘）、
   (1) 枠を4pxに太く (2) 下地を色で塗る (3) 下に太い線を足す、の3つで示す。
   色だけ・枠だけに頼らない。 */
/* 選んでいる工程。枠1つでは分かりづらかったので、4つで示す。
   (1) 濃い青の太い枠 (2) 色のついた下地 (3) まわりの淡い輪
   (4) 少し浮かせる。色だけ・枠だけに頼らない。 */
/* 選んでいる工程は**濃紺で塗りつぶす**。
   枠や淡い下地では、離れた距離から見分けられなかった（2026-10-01）。
   塗りつぶし・白文字・まわりの輪・浮き、の4つで示す。 */
:root.is-board .board-step.is-selected {
  border-color: var(--pc-bar-strong);
  background: var(--pc-bar-strong);
  color: var(--pc-on-fill);
  box-shadow: 0 0 0 var(--board-sel) var(--pc-accent-soft);
  transform: translateY(calc(-1 * var(--board-gap-xs)));
}
:root.is-board .board-step.is-selected .board-step__name,
:root.is-board .board-step.is-selected .board-step__mark,
:root.is-board .board-step.is-selected .board-step__sub {
  color: var(--pc-on-fill);
  font-weight: 700;
}

/* ---------- 選んだ工程への操作 ---------- */
:root.is-board .board-panel__edit {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: var(--board-gap-md);
  margin-bottom: var(--board-gap-md);
  padding: var(--board-gap-md);
  border: var(--board-sel) solid var(--pc-bar-strong);
  border-radius: var(--board-radius-lg);
  background: var(--pc-surface);
}
:root.is-board .board-panel__edit.is-hidden { display: none; }
:root.is-board .board-panel__editlabel { font-size: var(--board-fs-btn); font-weight: 700; }

:root.is-board .board-panel__btns { display: flex; gap: var(--board-gap-md); flex-wrap: wrap; }
:root.is-board .board-panel__done { font-size: var(--board-fs-btn); color: var(--pc-ink-muted); }

:root.is-board .board-btn {
  display: inline-flex;
  align-items: center;
  height: var(--board-btn-h);
  padding: 0 var(--board-panel-pad);
  border: none;
  border-radius: var(--board-radius-lg);
  font-family: inherit;
  font-size: var(--board-fs-btn);
  font-weight: 700;
  cursor: pointer;
}
:root.is-board .board-btn[disabled] { opacity: 0.5; cursor: default; }
:root.is-board .board-btn--rec  { background: var(--pc-accent); color: var(--pc-on-fill); }
:root.is-board .board-btn--sub  { background: var(--pc-surface); border: 1px solid var(--pc-line); color: var(--pc-accent); font-weight: 500; }
:root.is-board .board-btn--undo { background: var(--pc-surface); border: 1px solid var(--pc-rail-alert); color: var(--pc-rail-alert); font-weight: 500; }

/* ---------- 日付の枠。どこを押してもカレンダーが開く ---------- */
:root.is-board .board-datebox {
  display: inline-flex;
  align-items: center;
  gap: var(--board-gap-md);
  height: var(--board-btn-h);
  padding: 0 var(--board-panel-pad);
  border: var(--board-emph) solid var(--pc-accent);
  border-radius: var(--board-radius-lg);
  background: var(--pc-surface);
  color: var(--pc-accent);
  font-family: inherit;
  font-size: var(--board-fs-kind);
  font-weight: 700;
  cursor: pointer;
}
:root.is-board .board-datebox__val { font-size: var(--board-fs-next); font-variant-numeric: tabular-nums; }
:root.is-board .board-datebox__ico { font-size: var(--board-fs-next); }

/* ---------- カレンダー（実装仕様 §6-3） ---------- */
:root.is-board .board-cal {
  position: fixed;
  z-index: 20;
  background: var(--pc-surface);
  border: var(--board-emph) solid var(--pc-accent);
  border-radius: var(--board-radius-xl);
  box-shadow: var(--board-shadow);
  padding: var(--board-panel-pad);
}
:root.is-board .board-cal__head {
  display: flex;
  align-items: center;
  gap: var(--board-gap-md);
  margin-bottom: var(--board-gap-md);
}
:root.is-board .board-cal__nav {
  width: var(--board-cal-nav);
  height: var(--board-cal-day-h);
  border: 1px solid var(--pc-line);
  border-radius: var(--board-radius-lg);
  background: var(--pc-surface);
  font-family: inherit;
  font-size: var(--board-fs-cal-ttl);
  font-weight: 700;
  color: var(--pc-accent);
  cursor: pointer;
}
:root.is-board .board-cal__title {
  flex: 1;
  text-align: center;
  font-size: var(--board-fs-cal-ttl);
  font-weight: 700;
  color: var(--pc-ink);
  font-variant-numeric: tabular-nums;
}
:root.is-board .board-cal__today {
  height: var(--board-cal-day-h);
  padding: 0 var(--board-panel-pad);
  border: var(--board-emph) solid var(--pc-accent);
  border-radius: var(--board-radius-lg);
  background: var(--pc-surface);
  color: var(--pc-accent);
  font-family: inherit;
  font-size: var(--board-fs-btn);
  font-weight: 700;
  cursor: pointer;
}
:root.is-board .board-cal__grid {
  display: grid;
  grid-template-columns: repeat(7, var(--board-cal-day-w));
  gap: var(--board-gap-cal);
}
:root.is-board .board-cal__dow {
  height: var(--board-dow-h);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: var(--board-fs-np);
  font-weight: 700;
  color: var(--pc-ink-muted);
}
:root.is-board .board-cal__dow--sun { color: var(--pc-rail-alert); }
:root.is-board .board-cal__dow--sat { color: var(--pc-accent); }
:root.is-board .board-cal__d {
  height: var(--board-cal-day-h);
  border: 1px solid var(--pc-line);
  border-radius: var(--board-radius-lg);
  background: var(--pc-surface);
  font-family: inherit;
  font-size: var(--board-fs-cal-day);
  font-weight: 700;
  color: var(--pc-ink);
  cursor: pointer;
  font-variant-numeric: tabular-nums;
}
:root.is-board .board-cal__d--out   { color: var(--pc-rail-todo); }
:root.is-board .board-cal__d--today { border: var(--board-emph) solid var(--pc-rail-warn); }
:root.is-board .board-cal__d--sel   { background: var(--pc-accent); border-color: var(--pc-accent); color: var(--pc-on-fill); }
:root.is-board .board-cal__foot {
  margin-top: var(--board-gap-md);
  font-size: var(--board-fs-step);
  color: var(--pc-ink-muted);
  text-align: center;
}

/* サーバーに断られる日（実施日の未来日）は押せなくする */
:root.is-board .board-cal__d--off {
  color: var(--pc-rail-todo);
  background: var(--pc-rail-frame);
  cursor: default;
}

/* ==========================================================================
 * 上のしぼり込み（実装仕様 §8-1）
 * 押せるもの同士がくっついて見えないよう、すき間と形で分ける。
 * ========================================================================== */
:root.is-board .board-bar {
  display: flex;
  align-items: center;
  gap: var(--board-bar-gap);
  padding: var(--board-cell-gap) var(--board-pad);
  border-bottom: 1px solid var(--pc-line);
  background: var(--pc-surface);
}
/* 帯のボタンは、形を1か所で決める。
   別々に書いていたため、高さと文字の中心がそろっていなかった
   （2026-10-01 先生の指摘）。 */
:root.is-board .board-bar__today,
:root.is-board .board-bar__who,
:root.is-board .board-bar__search {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: var(--board-cell-gap);
  box-sizing: border-box;
  height: var(--board-bar-h);
  padding: 0 var(--board-pad);
  margin: 0;
  border: 1px solid var(--pc-line);
  border-radius: var(--board-radius-lg);
  background: var(--pc-surface);
  font-family: inherit;
  font-size: var(--board-fs-btn);
  font-weight: 700;
  line-height: 1;
  color: var(--pc-ink);
  white-space: nowrap;
  cursor: pointer;
}
:root.is-board .board-bar__today.is-on {
  background: var(--pc-accent);
  border-color: var(--pc-bar-strong);
  color: var(--pc-on-fill);
}
:root.is-board .board-bar__badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: var(--board-cal-nav);
  height: var(--board-dow-h);
  padding: 0 var(--board-pill-x);
  border-radius: var(--board-pill);
  background: var(--pc-rail-alert);
  color: var(--pc-on-fill);
  font-variant-numeric: tabular-nums;
}
:root.is-board .board-bar__today.is-on .board-bar__badge {
  background: var(--pc-on-fill);
  color: var(--pc-accent);
}
:root.is-board .board-bar__count {
  margin-left: auto;
  font-size: var(--board-fs-kind);
  color: var(--pc-ink-muted);
  font-variant-numeric: tabular-nums;
}
:root.is-board .board-list__empty {
  padding: var(--board-panel-pad);
  color: var(--pc-ink-muted);
  font-size: var(--board-fs-btn);
}

/* 登録は iPad で行う。**常時表示（TD1655）にだけ**入口を出さない。
   iPad では登録を使うので、is-kiosk の下に置く（実装仕様 §8-1）。 */
:root.is-kiosk .app-nav__item[href="/register"] { display: none; }

/* ---------- 患者IDの検索（押すとテンキーが出る） ---------- */
:root.is-board .board-bar__search { background: var(--pc-rail-frame); font-weight: 500; }
:root.is-board .board-bar__search:active,
:root.is-board .board-bar__who:active,
:root.is-board .board-bar__search.is-on {
  background: var(--pc-accent);
  border-color: var(--pc-bar-strong);
  color: var(--pc-on-fill);
  font-weight: 700;
}
:root.is-board .board-bar__searchlabel { font-variant-numeric: tabular-nums; }
:root.is-board .board-bar__off {
  height: var(--board-bar-h);
  padding: 0 var(--board-pad);
  border: 1px solid var(--pc-rail-alert);
  border-radius: var(--board-radius-lg);
  background: var(--pc-surface);
  font-family: inherit;
  font-size: var(--board-fs-kind);
  color: var(--pc-rail-alert);
  cursor: pointer;
}
:root.is-board .board-search { display: grid; gap: var(--board-bar-gap); }
:root.is-board .board-search__note {
  display: flex;
  align-items: baseline;
  gap: var(--board-cell-gap);
  font-size: var(--board-fs-btn);
  color: var(--pc-ink-muted);
}
:root.is-board .board-search__hit {
  font-size: var(--board-fs-cal-ttl);
  font-weight: 700;
  color: var(--pc-accent);
  font-variant-numeric: tabular-nums;
}

/* 医院名は出さない。勤務先で使うものなので（2026-10-01 先生の指示） */
:root.is-board .ortho-nav__brand-sub { display: none; }

/* パネルが画面の下に固定されるぶん、一覧の最後が隠れないよう余白を置く */
:root.is-board .board-list,
:root.is-board .order-list { padding-bottom: var(--board-panel-space); }
/* カード用の一覧にはカード同士の隙間（12px）が入っている。
   監視盤の行は区切り線で分けるので隙間は要らない。
   残すと実質72px/人になり、1画面あたり2人ぶん損をする（2026-10-01 実測）。 */
:root.is-board .order-list { gap: 0; }

/* 文字を打たせる検索欄は出さない。常時表示にキーボードが無いため
   （患者IDで探すのは、上の帯のテンキーから行う・2026-10-01）。 */
:root.is-board .search-box__input { display: none; }
/* もとの検索欄に付いていた虫めがねの絵。入力欄を隠したので役目が無く、
   押せないのに押せそうに見える（2026-10-01 先生の指摘）。 */
:root.is-board .search-box > .icon { display: none; }
:root.is-board .search-box { border: none; background: none; padding: 0; }

/* 氏名（勤務先の承認後に入る） */
:root.is-board .board-row__nm {
  font-size: var(--board-fs-nm);
  font-weight: 700;
  color: var(--pc-ink);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* 氏名で絞り込んだとき、合わない行を隠す */
:root.is-board .board-row.is-filtered-out { display: none; }

/* 患者を探すダイアログ */
:root.is-board .board-search__h {
  margin: var(--board-bar-gap) 0 var(--board-gap-sm);
  font-size: var(--board-fs-btn);
  color: var(--pc-ink-muted);
}
:root.is-board .board-search__name {
  display: flex;
  align-items: center;
  gap: var(--board-cell-gap);
  height: var(--board-btn-h);
  padding: 0 var(--board-pad);
  border: var(--board-emph) solid var(--pc-line);
  border-radius: var(--board-radius-lg);
  background: var(--pc-surface);
}
:root.is-board .board-search__name:focus-within { border-color: var(--pc-accent); }
:root.is-board .board-search__nameinput {
  flex: 1;
  border: none;
  background: none;
  outline: none;
  font-family: inherit;
  font-size: var(--board-fs-btn);
  color: var(--pc-ink);
}

/* ---------- 縦を空けて人数を稼ぐ（2026-10-01 実測：上部277pxで12人） ----------
   常時表示では縦1行＝患者1人ぶん。見なくてよいものは出さない。 */
/* 「症例一覧」の見出しは、上のタブを見れば分かる */
:root.is-board .page-head { display: none; }
/* 担当のプルダウンは小さなボタンに置き換える（boardSearch.js） */
:root.is-board .assignee-filter { display: none; }
:root.is-board .filter-bar--assignee {
  display: flex;
  align-items: center;
  gap: var(--board-bar-gap);
  padding: 0;
  margin: 0;
}
:root.is-board .board-bar__who { font-weight: 500; }
:root.is-board .board-bar__who.is-on {
  background: var(--pc-accent);
  border-color: var(--pc-bar-strong);
  color: var(--pc-on-fill);
  font-weight: 700;
}

/* 上の帯へ寄せたあとの、空になった入れ物は畳む */
:root.is-board .filter-bar--assignee.is-merged,
:root.is-board .search-box.is-merged { display: none; }

/* 症例タブには上の帯が無い。担当・検索・非表示を1行に並べて縦を節約する
   （2026-10-01：症例タブは上部303pxで12人しか入らなかった）。 */
:root.is-board #search-slot {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: var(--board-bar-gap);
}
:root.is-board .search-box {
  display: flex;
  align-items: center;
  gap: var(--board-bar-gap);
}
/* 「非表示データを含める」「解除」も、隣のボタンと高さと中心をそろえる。
   アプリ共通のボタン（.btn）は高さが違い、1つだけ浮いて見えていた
   （2026-10-01 先生の指摘）。 */
:root.is-board .search-box .btn,
:root.is-board #search-slot > .btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
  height: var(--board-bar-h);
  /* アプリ共通のボタンは min-height: 56px を持っている。
     これを下げないと高さがそろわない（2026-10-01 実測）。 */
  min-height: var(--board-bar-h);
  padding: 0 var(--board-pad);
  margin: 0;
  border-radius: var(--board-radius-lg);
  font-size: var(--board-fs-btn);
  line-height: 1;
  white-space: nowrap;
}
/* 検索欄の下に 16px の余白が付いていて、隣の列と中心がずれていた */
:root.is-board .search-box { margin: 0; }