:root {
  --color-primary: #1a6fb0;
  --color-primary-dark: #0f4d80;
  --color-danger: #c0392b;
  --color-bg: #f5f7fa;
  --color-border: #d9e1e8;
  --color-text: #2b333a;
  /* 上部メニュー(ヘッダー)専用の配色。ビーチボール競技(追いかける緑と白のボール)を
     イメージした緑にしている。ボタンや見出しなど他の場所の青系(--color-primary)は
     そのまま。 */
  --color-header-bg: #1f6b38;
}

* { box-sizing: border-box; }

body {
  margin: 0;
  font-family: "Yu Gothic", "Hiragino Sans", "Meiryo", sans-serif;
  background: var(--color-bg);
  color: var(--color-text);
  line-height: 1.6;
}

.app-header {
  background: var(--color-header-bg);
  color: #fff;
  padding: 12px 24px;
  display: flex;
  /* 画面幅が狭くて全項目が収まらない場合は、隠れて操作できなくなるより
     折り返して複数行になったほうがよいため、通常のflex-wrapに戻している。 */
  flex-wrap: wrap;
  align-items: center;
  gap: 20px;
  /* 常に画面上部に固定し、ページをスクロールしてもメニューが隠れないようにする */
  position: sticky;
  top: 0;
  z-index: 90;
  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.15);
}
.app-header__brand { flex: 0 0 auto; display: flex; flex-direction: column; line-height: 1.3; }
.app-header__brand a { color: #fff; font-weight: bold; font-size: 1.1em; text-decoration: none; white-space: nowrap; }
/* 選択中の大会名。ログイン名は表示しない方針のため、代わりに「今どの大会を
   操作しているか」をここで常に示す。大会が未選択の場合は「大会名未設定」と出す。 */
.app-header__taikai { font-size: 0.75em; color: #d9f2e1; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 260px; }
.app-header__nav {
  display: flex;
  gap: 14px;
  flex-wrap: wrap;
  align-items: center;
}
.app-header__nav a { color: #eaf7ee; text-decoration: none; font-size: 0.95em; white-space: nowrap; }
.app-header__nav a:hover { text-decoration: underline; }
.app-header__right { flex: 0 0 auto; display: flex; align-items: center; gap: 14px; flex-wrap: wrap; }
.app-header__copyright { font-size: 0.75em; color: #d9f2e1; white-space: nowrap; }

/* 上部メニューの「大会準備」「大会運営」モード切り替え(プルダウン)。
   今どちらのモードか一目で分かるよう、モードごとに色を変えて目立たせている
   (準備=青系、運営=大会当日の「今まさに使う」オレンジ系)。 */
.nav-mode-select { flex: 0 0 auto; display: flex; align-items: center; gap: 6px; }
.nav-mode-select__label { font-size: 0.8em; color: #d9f2e1; white-space: nowrap; }
.nav-mode-select__dropdown {
  font-size: 0.95em;
  font-weight: bold;
  padding: 5px 10px;
  border-radius: 5px;
  border: 2px solid transparent;
  cursor: pointer;
  appearance: auto;
}
.nav-mode-select--prep .nav-mode-select__dropdown { background: #eaf5ff; color: var(--color-primary-dark); border-color: #bcdcf5; }
.nav-mode-select--ops .nav-mode-select__dropdown { background: #fff1de; color: #a04e00; border-color: #ffb454; }
.nav-mode-select--settings .nav-mode-select__dropdown { background: #eef0f2; color: #3b4550; border-color: #c9d0d6; }

/* スマホなど狭い画面用のメニュー開閉ボタン(ハンバーガー)。
   広い画面では非表示にし、通常どおりメニュー項目を横並び(折り返しあり)で表示する。
   狭い画面(下のメディアクエリ)になったときだけボタンを表示し、メニュー項目は
   ボタンを押すまで隠す。 */
.app-header__toggle {
  display: none;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 4px;
  background: none;
  border: 1px solid rgba(255, 255, 255, 0.6);
  border-radius: 5px;
  padding: 6px 10px;
  cursor: pointer;
  color: #fff;
  order: 3;
  margin-left: auto;
}
.app-header__toggle-bar { display: block; width: 20px; height: 2px; background: #fff; }
.app-header__toggle-label { font-size: 0.7em; margin-top: 1px; }

@media (max-width: 700px) {
  .app-header__toggle { display: flex; }
  .app-header__nav {
    /* 開くまでは非表示にし、開いたらヘッダー幅いっぱいに縦積みで表示する */
    display: none;
    order: 4;
    flex-basis: 100%;
    flex-direction: column;
    align-items: flex-start;
    gap: 2px;
    margin-top: 4px;
    border-top: 1px solid rgba(255, 255, 255, 0.25);
    padding-top: 8px;
  }
  .app-header__nav.is-open { display: flex; }
  .app-header__nav a { padding: 6px 2px; width: 100%; }
  .app-header__right { order: 5; }

  /* トーナメント表(図式ブラケット)・試合進行表(コート×試合順)は、PHP側で列幅を
     px直書きで組んでいる(枠・連結線の位置合わせのため)ので、CSS側だけで列幅を
     詰めるのは難しい。そのためzoom(layoutごと縮小するCSSプロパティ。transformと違い
     縮小後のサイズで折り返し・スクロール範囲が再計算されるため、見た目どおりの
     スクロール量で済む)で全体を縮小し、一度に見える範囲を広げる。それでも見づらい場合は、
     このzoomの倍率を超えてピンチズームで自由に拡大縮小できる(viewportでズームを禁止していない)。 */
  #score-matrix .matrix-wrap .smatrix,
  .bracket-wrap {
    zoom: 0.72;
  }

  /* リーグ表(クロス表)はCSS Gridの列幅指定(grid-template-columns)だけで組んでおり、
     PHP側はセルの行・列の「位置」(grid-column/grid-row)だけを指定しているため、
     zoomに頼らずCSS側で直接、列幅・行の高さ・文字サイズをスマホ向けに詰められる
     横方向は「チーム名列1本 + 対戦相手1チームにつき4本(試合番号/得点/－/得点)
     + 成績欄12本(勝敗・得失セット・得失点・順位 各3本)」の細い列で構成されている
     (3チームの組で25本)。この細い列1本あたりの横幅を34px→15px、チーム名列を
     150px→68pxに詰める(3チームの組で約966px→約428px)。 */
  .lstand-wrap .lstand {
    grid-template-columns: 68px repeat(calc(var(--lstand-cols) - 1), 15px);
    grid-auto-rows: 16px;
    font-size: 0.6em;
  }
  .lstand-wrap .lstand__cell {
    padding: 0;
    letter-spacing: -0.03em;
  }
  .lstand-wrap .lstand__name {
    padding: 1px 3px;
  }
}

.app-main { max-width: 1100px; margin: 0 auto; padding: 24px; }

/* ログイン・初回セットアップ画面(ヘッダー無しの単独ページ) */
.login-page { min-height: 100vh; display: flex; align-items: center; justify-content: center; padding: 24px; }
.login-card { background: #fff; border: 1px solid var(--color-border); border-radius: 8px; padding: 28px 32px; max-width: 380px; width: 100%; box-shadow: 0 2px 10px rgba(0,0,0,0.06); }
.login-card h1 { font-size: 1.3em; border: none; padding: 0; margin: 0 0 18px; text-align: center; }
.login-card .form-row { margin-bottom: 14px; }
.login-card .btn--primary { width: 100%; text-align: center; margin: 8px 0 0; }
/* 組み合わせ盤面など、多数のブロックを俯瞰したい画面で横幅いっぱいに使う */
.app-main--wide { max-width: none; }
/* ops_tabs.phpのiframeに埋め込まれる画面(?embed=1)。ヘッダー・フッター分の余白が無いので詰める */
.app-main--embed { padding: 12px 16px; }
/* board-toolbar--sticky・matrix-topscrollの「top: 78px」は、外側のヘッダー(position: sticky,
   高さ約78px)の下に張り付けるための値。embed画面にはそのヘッダーが無いため、
   ここだけ0に詰めて上部の余白を無くす。 */
.app-main--embed .board-toolbar--sticky,
.app-main--embed .matrix-topscroll,
.app-main--embed .rassign thead th { top: 0; }
/* 公開閲覧ページ(public_footer.php)用。管理画面はフッター無し */
.app-footer { text-align: center; padding: 20px; color: #8a97a3; font-size: 0.85em; }

/* --- 大会運営タブ画面(ops_tabs.php) ------------------------------- */
.ops-tabs__bar { display: flex; flex-wrap: wrap; gap: 4px; border-bottom: 2px solid var(--color-border); margin-bottom: 0; }
.ops-tabs__btn { padding: 6px 14px; border: 1px solid var(--color-border); border-bottom: none; border-radius: 6px 6px 0 0;
  background: #eef2f4; color: inherit; font-family: inherit; font-size: 0.95em; font-weight: normal; cursor: pointer; margin-bottom: -2px; }
.ops-tabs__btn:hover { background: #f7faf7; }
.ops-tabs__btn.is-active { background: #fff; border-color: var(--color-border); border-bottom: 2px solid #fff; color: var(--color-primary); font-weight: bold; }
.ops-tabs__panels { border: 1px solid var(--color-border); border-top: none; background: #fff; }
.ops-tabs__panel { display: none; }
/* スマホ(狭い画面)だけで使う部品: ヘッダーの「メニュー」の中のタブ一覧と、いま開いているタブ名の行(広い画面では出さない) */
.app-header__navtabs { display: none; }
.ops-tabs__current { display: none; }
@media (max-width: 700px) {
  /* タブの並びは隠し、「メニュー」の中に「大会選択」と一緒に縦に並べる */
  .ops-tabs__bar { display: none; }
  .app-header__navtabs { display: flex; flex-direction: column; width: 100%; gap: 2px; margin-top: 4px; padding-top: 6px;
    border-top: 1px dashed rgba(255, 255, 255, 0.3); }
  .app-header__navtab { text-align: left; background: none; border: 0; border-radius: 4px; color: #eaf7ee; font: inherit;
    font-size: 0.95em; padding: 8px 6px; cursor: pointer; width: 100%; }
  .app-header__navtab.is-active { background: rgba(255, 255, 255, 0.18); color: #fff; font-weight: bold; }
  .app-header__navtab.is-active::before { content: '▶ '; }
  /* いま開いているタブ名(押すと「メニュー」が開く) */
  .ops-tabs__current { display: flex; align-items: center; justify-content: space-between; gap: 8px; width: 100%;
    padding: 8px 12px; background: #fff; border: 1px solid var(--color-border); border-bottom: 2px solid var(--color-primary);
    font: inherit; color: var(--color-primary); font-weight: bold; cursor: pointer; text-align: left; }
  .ops-tabs__current-hint { font-size: 0.8em; font-weight: normal; color: #6b767e; white-space: nowrap; }
}
.ops-tabs__panel.is-active { display: block; }
.ops-tabs__panel--pad { padding: 16px; }
.ops-tabs__panel--pad > .form { border: none; padding: 0; }

/* 大会情報編集の上部ボタン列(更新する / インポート・エクスポート / 大会の削除) */
.taikai-toolbar { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; margin-bottom: 14px; }
.taikai-toolbar .btn { margin: 0; }
.modal__panel--export { width: 560px; max-width: 94vw; }
.modal__panel--export .modal__body p { margin: 0 0 10px; line-height: 1.7; }
.modal__notes { margin: 0 0 4px; padding-left: 1.3em; line-height: 1.7; font-size: 0.95em; }
.menu-btn { position: relative; }
.menu-btn > summary { list-style: none; }
.menu-btn > summary::-webkit-details-marker { display: none; }
.menu-btn__list {
  position: absolute; top: calc(100% + 4px); left: 0; z-index: 95; min-width: 100%;
  display: flex; flex-direction: column; background: #fff; border: 1px solid var(--color-border);
  border-radius: 4px; box-shadow: 0 4px 12px rgba(0,0,0,0.12);
}
.menu-btn__list a { padding: 8px 14px; color: var(--color-text); text-decoration: none; white-space: nowrap; font-size: 0.9em; }
.menu-btn__list a:hover { background: #f4fafd; }
/* メニュー内のグループ見出し(関連する項目を見出しの下にまとめる。見出しの下の項目は字下げする) */
.menu-btn__group { padding: 8px 14px 3px; font-size: 0.75em; font-weight: bold; color: var(--color-muted, #6b7782); border-top: 1px solid var(--color-border); margin-top: 4px; white-space: nowrap; }
.menu-btn__group:first-child { border-top: 0; margin-top: 0; }
.menu-btn__list a.menu-btn__sub { padding-left: 26px; }
.menu-btn__item--note { color: var(--color-primary) !important; }
.menu-btn__item--danger { color: var(--color-danger) !important; border-top: 1px solid var(--color-border); }

/* --- 大会情報編集: 種目一覧の表形式編集(taikai_edit.php) ------------------- */
.class-grid__actions { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; margin-bottom: 10px; }
.class-grid__actions .btn { margin: 0; }
.class-grid__count { color: #b26a00; font-size: 0.9em; }
.class-grid th { white-space: nowrap; }
.class-grid td { padding: 4px 6px; vertical-align: middle; }
.class-grid select, .class-grid input[type=number] {
  font: inherit; font-size: 0.95em; padding: 4px 6px; border: 1px solid var(--color-border); border-radius: 3px; background: #fff;
}
.class-grid input[type=number] { width: 64px; text-align: right; }
.class-grid td.is-changed { background: #fff6d6; }
.class-grid select.is-dup { border-color: var(--color-danger); background: #fdecea; }
.class-grid__row--error td { background: #fdecea; }
.class-grid__error { display: block; color: var(--color-danger); font-size: 0.85em; margin-top: 2px; white-space: normal; }
.class-grid__detail { font-size: 0.85em; color: #6b767e; white-space: nowrap; }
.class-grid__check { text-align: center; }
/* 高さはops_tabs.phpのJSがウィンドウ下端までぴったりに合わせる(ここは初期値) */
.ops-tabs__frame { display: block; width: 100%; height: 480px; border: none; }
.app-main--full { padding: 8px 12px 0; }
/* タブ画面(大会準備・大会運営・各種設定): ページ全体はスクロールさせない。上のメニュー(緑の帯のモード切替)とタブは常に動かず、
   スクロールするのはタブの中身(iframe)だけ */
html:has(body.body--full), body.body--full { overflow: hidden; height: 100%; }
/* 一覧に戻ったときに編集した行の位置がわかるよう、アンカー先の行を一時的にハイライトする */
.table tbody tr:target { background: #fff6d6; }
.app-footer__copyright { margin-top: 4px; font-size: 0.85em; color: #aab3bb; }

h1 { font-size: 1.6em; border-bottom: 3px solid var(--color-primary); padding-bottom: 6px; }
h2 { font-size: 1.3em; margin-top: 2em; color: var(--color-primary-dark); }
h3 { font-size: 1.1em; margin-top: 1.4em; }
/* ヘッダーを固定表示にしたため、id付き見出しへのジャンプ時にヘッダーへ隠れないよう余白を確保する */
h2[id], h3[id] { scroll-margin-top: 90px; }
h4 { font-size: 1em; margin-top: 1em; color: #4a5762; }

.table { border-collapse: collapse; width: 100%; margin: 10px 0 20px; background: #fff; }
.table th, .table td { border: 1px solid var(--color-border); padding: 8px 10px; text-align: left; font-size: 0.92em; }
.table th { background: #eef3f7; }
.table tbody tr:nth-child(even) { background: #fafcfe; }

/* 列数が多く、スマホ幅に収めようとすると潰れて読みにくくなる表を、
   幅を保ったまま横スクロールで見せるためのラッパー(例: 大会情報編集画面の種目一覧)。
   .table--wide を付けた表はスマホ幅に縮めず、はみ出した分を .table-scroll 側で横スクロールする。 */
.table-scroll { overflow-x: auto; margin-bottom: 20px; }
.table-scroll > .table { margin-bottom: 0; }
.table--wide { width: auto; min-width: 720px; }

.table--score .score-input { width: 46px; text-align: center; }

.form { background: #f3f7fa; padding: 20px; border: 1px solid var(--color-border); border-radius: 6px; max-width: 560px; }
.form--wide { max-width: 760px; }
.form-row { margin-bottom: 14px; display: flex; flex-direction: column; gap: 4px; }
.form-row--checkbox { flex-direction: row; align-items: center; }
/* 項目名(ラベル)と入力欄を見分けやすくする: ラベルは小さめ・青みのある色の見出し、入力欄は白地に濃いめの枠線
   (入力欄の外側の面は薄い青灰色にして、白い入力欄が浮いて見えるようにする) */
.form-row label { font-weight: bold; font-size: 0.85em; color: #3a5a78; letter-spacing: .02em; }
.form-row input[type=text], .form-row input[type=date], .form-row input[type=number], .form-row input[type=email], .form-row input[type=tel], .form-row input[type=password], .form-row select, .form-row input[type=file], .form-row textarea {
  padding: 8px 10px; border: 1px solid #8ea4b8; border-radius: 4px; font-size: 1em; background: #fff; color: var(--color-text);
  box-shadow: inset 0 1px 2px rgba(0,0,0,0.06);
}
.form-row input:focus, .form-row select:focus, .form-row textarea:focus {
  outline: none; border-color: var(--color-primary); box-shadow: 0 0 0 3px rgba(26,111,176,0.2);
}
.form-row input[readonly] { background: #e9eef2; color: #55626d; }
/* タブ画面(大会情報など)の中の入力面も、同じ薄い青灰色にする */
.ops-tabs__panel--pad { background: #f3f7fa; }
.form-row textarea { width: 100%; font-family: "Meiryo", "Hiragino Kaku Gothic ProN", sans-serif; line-height: 1.5; resize: vertical; }
.required { color: var(--color-danger); font-size: 0.8em; }
.form-help { margin: 2px 0 14px; font-size: 0.82em; color: #6b767e; max-width: 560px; }

/* 大会結果のWeb掲示画面: 公開URL・外部転送先URLのQRコード表示 */
.qr-box {
  display: flex; flex-direction: column; align-items: flex-start; gap: 8px;
  margin: 10px 0 14px; padding: 10px; border: 1px solid var(--color-border); border-radius: 6px;
  background: #fff; width: fit-content;
}
.qr-box__image svg { display: block; width: 160px; height: 160px; }

/* 2項目を横並びにする(年度と開催年月日、会場とコート数、など)。狭い画面では縦に積む。 */
.form-row-pair { display: flex; gap: 16px; }
.form-row-pair > .form-row { flex: 1 1 0; min-width: 0; }
@media (max-width: 700px) {
  .form-row-pair { flex-direction: column; gap: 0; }
}

/* 一覧画面の絞り込みバー(年度・協会など) */
.filter-bar {
  display: flex; align-items: center; gap: 8px; flex-wrap: wrap;
  background: #fff; border: 1px solid var(--color-border); border-radius: 6px;
  padding: 10px 14px; margin-bottom: 16px;
}
.filter-bar label { font-weight: bold; font-size: 0.86em; }
.filter-bar select { padding: 6px 8px; border: 1px solid var(--color-border); border-radius: 4px; font-size: 0.92em; }
.filter-bar .btn { margin: 0; }
.filter-bar__spacer { margin-left: auto; }

.btn {
  display: inline-block;
  padding: 7px 14px;
  border-radius: 4px;
  border: 1px solid var(--color-border);
  background: #fff;
  color: var(--color-text);
  text-decoration: none;
  font-size: 0.9em;
  cursor: pointer;
  margin: 2px 4px 2px 0;
}
.btn:hover { background: #eef3f7; }
.btn--primary { background: var(--color-primary); border-color: var(--color-primary); color: #fff; }
.btn--primary:hover { background: var(--color-primary-dark); }
.btn--danger { background: #fff; border-color: var(--color-danger); color: var(--color-danger); }
.btn--danger:hover { background: #fdecea; }
.btn--sm { padding: 4px 10px; font-size: 0.85em; }

.flash { padding: 10px 16px; border-radius: 4px; margin-bottom: 16px; }
.flash--success { background: #e5f6ea; color: #1e7e34; border: 1px solid #b7e4c7; }
.select-prompt { margin: 0 0 14px; padding: 12px 16px; background: #fff8e0; border: 1px solid #f0dd8c; border-left: 5px solid #e0a800; border-radius: 6px; font-size: 1.05em; color: #5c4a0a; }
.select-prompt strong { font-size: 1.1em; }
.select-prompt__sub { display: block; margin-top: 4px; font-size: 0.82em; color: #7a6a2a; }
.flash--error { background: #fdecea; color: #b02a1e; border: 1px solid #f3c1bb; }

.notice { background: #fff8e1; border: 1px solid #ffe08a; padding: 10px 14px; border-radius: 4px; font-size: 0.9em; }
.notice--error { background: #fdecea; border-color: #f3c1bb; color: #b02a1e; }
.notice--error ul { margin: 6px 0 0; padding-left: 1.4em; }
.notice--warn { background: #fff1d6; border-color: #f0c060; color: #8a5a00; font-weight: bold; }
.muted { color: #8a97a3; }

/* 試合進行表: 保存によって新たに対戦相手が確定した試合があるときの案内ダイアログ
   (「組み合わせが確定しました。記録表を出力しますか?」#ready-modal)。
   得点入力ダイアログを閉じた直後に割り込む形で開き、見落として記録表の出力を
   忘れることがないようにしている(.modalの基本スタイルを流用)。 */
.modal__panel--ready { width: 420px; }
.modal__panel--ready .modal__body p { margin: 0 0 14px; line-height: 1.6; }

.badge { display: inline-block; padding: 2px 8px; border-radius: 10px; background: #eee; font-size: 0.8em; }
.badge--done { background: #d6f0da; color: #1e7e34; }
.badge--progress { background: #fff1c7; color: #8a6d00; }
/* 参加チーム申込みの状態(申込み一覧・詳細) */
.status-badge--pending { background: #fff1c7; color: #8a6d00; }
.status-badge--approved { background: #d6f0da; color: #1e7e34; }
.status-badge--rejected { background: #eee; color: #777; }
.lstand-solo { margin: 6px 0 14px; padding: 8px 14px; font-size: 1.3em; font-weight: bold; color: #2b333a; background: #fff; border: 1px solid #c9d3cc; border-radius: 4px; width: fit-content; }
.status-badge--exchange { background: #e3eefb; color: #1a5a96; }
.is-withdrawn { color: #9aa5ad; }
.is-withdrawn .badge { color: #b02a1e; background: #fdecea; }

.bracket-tree, .bracket-tree ul { list-style: none; }
.bracket-tree { padding-left: 0; }
.bracket-tree ul { padding-left: 24px; border-left: 1px dashed #b8c4cd; margin-left: 6px; }
.bracket-node { display: inline-block; padding: 4px 10px; margin: 3px 0; background: #fff; border: 1px solid var(--color-border); border-radius: 4px; }
.bracket-node--leaf { background: #f5f9fc; }
.result-highlight { font-size: 1.1em; margin-top: 10px; }

/* =====================================================================
   組み合わせ手動編集(旧beMakeMatchFormの「リーグ組合せ作成」タブ 相当)
   ===================================================================== */

/* 旧ピッカーページ(team_slot_picker.php / court_slot_picker.php)用。
   現在は盤面からリンクしていないが、直接開いた場合のために残している。 */
.board-cell {
  display: block;
  padding: 6px 10px;
  border-radius: 4px;
  text-decoration: none;
  color: var(--color-text);
}
.board-cell--team { background: #fdeaea; border: 1px solid #f0c4c4; }
.board-cell--court { background: #e3f4fb; border: 1px solid #b9e2f2; }
.row--taken { color: #b0b8bf; }
.court-grid-wrap { overflow-x: auto; }
.table--court-grid { min-width: 600px; }
.table--court-grid th, .table--court-grid td { text-align: center; padding: 4px 6px; font-size: 0.85em; }
.court-cell--free { background: #fbfdfe; }
.court-cell--taken { background: #f0f2f4; }
.court-cell form { margin: 0; }

/* --- ツールバー / メッセージ ----------------------------------------- */
.board-toolbar { display: flex; align-items: center; gap: 14px; margin: 10px 0 14px; flex-wrap: wrap; }
/* 「クラスへ移動」を含むツールバーをヘッダー下に固定表示し、盤面を下へスクロールしても
   ジャンプリンクが隠れないようにする(ヘッダーがposition: sticky, 高さ約60pxのため、
   その下に張り付く高さに合わせている)。背景色を敷いて、下の盤面が透けないようにする。 */
.board-toolbar--sticky {
  position: sticky;
  top: 78px;
  z-index: 80;
  background: var(--color-bg);
  padding: 8px 10px;
  border-radius: 6px;
}
.board-msg { font-size: 0.9em; min-height: 1.2em; }
/* 試合進行表: 自動更新(間隔の選択と最終更新時刻) */
.auto-refresh { font-size: 0.85em; color: #5b6770; display: inline-flex; align-items: center; gap: 6px; }
.auto-refresh select { font: inherit; padding: 2px 4px; border: 1px solid var(--color-border); border-radius: 4px; background: #fff; }
.auto-refresh__at { color: #1e7e34; }
.board-export { font-size: 0.85em; color: #6b767e; display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }
.board-toggle { font-size: 0.85em; color: #6b767e; }

/* --- 試合進行表の対戦表(コート×試合順) ---------------------------------- */
/* 旧Delphi版の対戦表と同じ並び。マス内はクラス名(桃)+チーム2行。
   チーム名部分をクリックすると得点入力ダイアログが開く。 */
.smatrix { border-collapse: collapse; background: #fff; }
.smatrix th, .smatrix td { border: 1px solid #9fb3bf; padding: 0; vertical-align: top; }
.smatrix thead th,
.smatrix__corner,
.smatrix__rowhead {
  background: #dcf0d6;
  font-size: 0.85em;
  font-weight: normal;
  padding: 4px 8px;
  white-space: nowrap;
  text-align: center;
}
.smatrix__rowhead { min-width: 66px; }
/* 表の縦方向はページ全体のスクロールに任せ、横方向だけこの枠の中でスクロールさせる。
   以前は縦も表専用の枠の中でスクロールさせていたが、ページ自体の縦スクロールバーと
   表の枠の縦スクロールバーが並んで2本出てしまい使いづらいとの指摘のため、
   縦スクロールバーはページ側の1本だけになるようにした。
   「○試合目」の列はposition: stickyで左端に固定し、横にスクロールしても
   どの試合順か分かるようにする(この枠自体は横方向だけのスクロール枠のため、
   左端固定はCSSのposition: stickyで問題なく効く)。
   コート名の見出し行(thead)は、この枠が横スクロール用のposition: sticky基準に
   なってしまい、CSSだけでは上端固定(縦)が効かない(主要ブラウザ共通の制約。
   横スクロール枠は縦方向も同じ基準に巻き込まれてしまうため)。そのため見出し行は
   下のJS(#matrix-topscroll直後のscript)で複製し、画面上端付近に固定表示している。 */
#score-matrix > .matrix-wrap {
  overflow-x: auto;
  border: 1px solid #9fb3bf;
}
/* 横スクロールバーは表の上(.matrix-topscroll、ヘッダー下に固定)の1本だけにし、
   表の下端の横スクロールバーは隠す(2本あると見た目が悪いため。トラックパッドや
   Shift+ホイールでの横移動はそのまま使える)。Chrome・Edgeは横だけ高さ0にし、
   Firefoxは横方向のはみ出しを隠す(上のスクロールバーからは動かせる)。 */
#score-matrix > .matrix-wrap::-webkit-scrollbar { height: 0; }
#score-matrix > .matrix-wrap::-webkit-scrollbar-track { background: #f1f4f6; }
#score-matrix > .matrix-wrap::-webkit-scrollbar-thumb { background: #b9c6cf; border-radius: 6px; border: 3px solid #f1f4f6; }
@supports (-moz-appearance: none) {
  #score-matrix > .matrix-wrap { overflow-x: hidden; }
}
/* ヘッダー(position: sticky, 高さ約78px)の下に張り付け、ページを縦スクロールしても
   横スクロールバーが見える位置に残るようにする。 */
.matrix-topscroll {
  position: sticky;
  top: 78px;
  z-index: 85;
  overflow-x: auto;
  overflow-y: hidden;
  height: 16px;
  margin: 0 0 2px;
  background: var(--color-bg);
}
.matrix-topscroll > div { height: 1px; }
#score-matrix .smatrix thead th {
  box-shadow: inset 0 -1px 0 #9fb3bf;
}
#score-matrix .smatrix__rowhead {
  position: sticky;
  left: 0;
  z-index: 1;
  box-shadow: inset -1px 0 0 #9fb3bf;
}
#score-matrix .smatrix thead .smatrix__corner {
  position: sticky;
  left: 0;
  z-index: 3;
}
/* 見出し行(コート名)の固定表示用コピー。表の上端が画面の外へ出たら、JSがこれを
   複製して中身を入れ、ヘッダー・表の上の横スクロールバーのすぐ下に固定表示する
   (score_entry_index.phpのスクリプト参照)。横スクロールとも連動する。 */
.matrix-headclone {
  position: fixed;
  z-index: 86;
  overflow: hidden;
  border: 1px solid #9fb3bf;
  border-top: none;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.12);
  display: none;
}
.matrix-headclone.is-visible { display: block; }
.matrix-headclone table { border-collapse: collapse; }
.smatrix__free { background: #fafbfc; min-width: 150px; }
.smatrix__cell { min-width: 150px; }
.smatrix__cell--done { background: #eef1f3; }
/* ダブルチェック運用の進み具合 */
.smatrix__cell--entered  { background: #fff7e0; }
.smatrix__cell--mismatch { background: #fdeaea; box-shadow: inset 0 0 0 2px #c0392b; }
.smatch__badge {
  display: inline-block;
  margin-left: 4px;
  padding: 0 4px;
  border-radius: 3px;
  background: rgba(255, 255, 255, 0.75);
  font-size: 0.92em;
  color: #3a464f;
}
.smatrix__cell--mismatch .smatch__badge { background: #c0392b; color: #fff; }

/* マスごとの「記録表」印刷リンク(対戦が決まった試合だけ出す) */
.smatch__print {
  float: right;
  margin-left: 4px;
  padding: 0 4px;
  border-radius: 3px;
  background: rgba(255, 255, 255, 0.8);
  border: 1px solid rgba(0, 0, 0, 0.12);
  color: #2b6ca3;
  text-decoration: none;
  font-size: 0.92em;
}
.smatch__print:hover { background: #fff; text-decoration: underline; }

.smatch { display: flex; flex-direction: column; }
.smatch__head {
  background: #eef1f3;
  border-bottom: 1px solid #d5dde2;
  font-size: 0.72em;
  color: #3a464f;
  padding: 2px 5px;
  text-align: center;
  white-space: nowrap;
}
/* クラス名で色分け(男子=水色/女子=ピンク/その他=グレー)。
   決勝トーナメント(--deep)は同系のより濃い色にして、予選リーグと区別する。 */
.smatch__head--men   { background: #dcecfa; border-bottom-color: #b9d4ea; }
.smatch__head--women { background: #fbe3ef; border-bottom-color: #eac3d7; }
.smatch__head--other { background: #eef1f3; border-bottom-color: #d5dde2; }
.smatch__head--men.smatch__head--deep   { background: #9ec8ea; border-bottom-color: #7fb2da; }
.smatch__head--women.smatch__head--deep { background: #f0aecd; border-bottom-color: #dd92b6; }
.smatch__head--other.smatch__head--deep { background: #c2ccd3; border-bottom-color: #a8b5bd; }
.smatch__teams {
  display: block;
  width: 100%;
  border: 0;
  padding: 0;
  background: none;
  font: inherit;
  color: inherit;
  text-align: left;
  cursor: pointer;
}
.smatch__teams:hover { background: #fffbe6; }
.smatch__teams--pending { cursor: default; opacity: 0.65; }
.smatch__team {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  gap: 6px;
  padding: 3px 6px;
  font-size: 0.86em;
  border-bottom: 1px solid #e3e9ed;
}
.smatch__team:last-child { border-bottom: 0; }
.smatch__team--win { color: #c0392b; font-weight: bold; }
.smatch__team--lose { color: #a9b4bc; }
.smatch__name { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.smatch__sets { font-variant-numeric: tabular-nums; }

/* --- 得点入力ダイアログ(旧beScoreDlg相当) ------------------------------ */
.score-dlg__class { margin: 0 0 2px; font-weight: bold; font-style: italic; text-align: center; }
.score-dlg__where { margin: 0 0 12px; text-align: center; color: #6b767e; font-size: 0.9em; }
.score-dlg__grid { width: 100%; border-collapse: collapse; }
.score-dlg__grid th, .score-dlg__grid td { padding: 4px; text-align: center; }
.score-dlg__team { width: 40%; font-size: 0.95em; word-break: break-all; }
.score-dlg__vs { width: 20%; color: #6b767e; font-weight: normal; }
.score-dlg__label { color: #6b767e; font-weight: normal; font-size: 0.85em; }
.score-dlg__input {
  width: 100%;
  max-width: 90px;
  padding: 6px;
  font-size: 1.1em;
  text-align: right;
  /* 日本語IMEが有効なままだと得点が全角で入ってしまうため、半角数字入力に固定する
     (ime-modeは非標準だがWindows版の一部ブラウザで有効。併せてinputmode/type=numberも指定) */
  ime-mode: disabled;
}
.score-dlg__count {
  display: block;
  max-width: 90px;
  margin: 0 auto;
  padding: 6px;
  background: #1f3864;
  color: #fff;
  font-size: 1.1em;
  text-align: right;
  border-radius: 3px;
}
/* 得点入力ダイアログは説明書きを出さず、横幅を狭くする */
.modal__panel--score { width: 340px; }
.score-dlg__note { margin: 12px 0 0; font-size: 0.82em; color: #6b767e; }
.score-dlg__note--alert { color: #c0392b; }
.score-dlg__actions { margin-top: 14px; display: flex; gap: 10px; justify-content: center; }
.score-dlg__role { margin: 0 0 10px; text-align: center; font-size: 0.85em; color: #6b767e; }
.score-dlg__alert { color: #c0392b; font-weight: bold; }

/* --- 不一致時の照合表 -------------------------------------------------- */
.score-cmp { width: 100%; border-collapse: collapse; margin: 0 0 10px; }
.score-cmp th, .score-cmp td {
  border: 1px solid var(--color-border);
  padding: 4px 8px;
  text-align: center;
  font-size: 0.9em;
}
.score-cmp thead th { background: #eef1f3; font-weight: normal; color: #6b767e; }
.score-cmp__row--diff td { background: #fdeaea; color: #c0392b; font-weight: bold; }
.score-cmp__legend { margin: 0 0 10px; font-size: 0.8em; color: #6b767e; text-align: center; }

/* --- 端末の役割(ダブルチェック運用) ----------------------------------- */
/* チェックボックス+説明文のフォーム行 */
.form-check { display: flex; align-items: flex-start; gap: 6px; font-weight: normal; line-height: 1.6; }
.form-check input { margin-top: 4px; }

.device-role {
  border: 1px solid var(--color-border);
  border-radius: 6px;
  background: #fbfcfd;
  padding: 10px 12px;
  margin: 0 0 14px;
}
.device-role__form { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.device-role__label { font-size: 0.9em; color: #6b767e; }
.device-role__current { padding: 2px 10px; border-radius: 3px; }
.device-role__current--primary { background: #dcecfa; color: #1d4e75; }
.device-role__current--check   { background: #fff0d6; color: #8a5a10; }
/* この端末の役割のプルダウン(色は従来の「入力用/チェック用」の表示と同じ。未選択は赤い枠) */
.device-role__select { font: inherit; font-weight: bold; padding: 3px 8px; border-radius: 4px; border: 1px solid var(--color-border); cursor: pointer; }
.device-role__select--primary { background: #dcecfa; color: #1d4e75; border-color: #9cc3e6; }
.device-role__select--check   { background: #fff0d6; color: #8a5a10; border-color: #e6c88f; }
.device-role__select--unset   { background: #fff; color: #444; border-color: var(--color-danger); }
.device-role__help { margin: 8px 0 0; font-size: 0.82em; color: #6b767e; line-height: 1.7; }
.device-role__warn { color: #c0392b; }

.slot-chip--entered   { background: #fff7e0; border: 1px solid #e4cf95; }
.slot-chip--mismatch  { background: #fdeaea; border: 1px solid #c0392b; }
.slot-chip--confirmed { background: #eef1f3; border: 1px solid #b9c6cf; }
.board-msg--ok { color: #2f8f4e; }
.board-msg--error { color: #c0392b; font-weight: bold; }

/* --- クラスごとのレーン(行=クラス、列=ブロック) ---------------------- */
/* 旧Delphi版のグリッドと同じ並び。ブロックが多ければレーン内を横スクロール、
   クラスが多ければページを縦スクロールする。 */
.class-lane {
  margin: 0 0 28px;
  /* ヘッダーを固定表示にしたため、#class-N へのジャンプ時にヘッダーへ隠れないよう余白を確保する */
  scroll-margin-top: 90px;
}
.class-lane__head {
  display: flex; align-items: baseline; gap: 12px; flex-wrap: wrap;
  padding: 6px 8px;
  /* 上下を線で囲み、見出し行のボタンがどのクラスのものかを分かりやすくする(上のクラスと取り違えないように) */
  border-top: 2px solid var(--color-primary);
  border-bottom: 2px solid var(--color-primary);
  background: #e4eef8;
  margin-bottom: 8px;
}
.class-lane__title { margin: 0; font-size: 1.05em; }
.class-lane__meta { font-size: 0.82em; color: #6b767e; }
.class-lane__head .btn { margin-left: auto; white-space: nowrap; }
.class-lane__regen { display: flex; align-items: center; gap: 8px; margin-left: auto; }
.class-lane__regen .btn { margin-left: 0; }
.class-lane__order { font-size: 0.85em; padding: 4px 6px; border: 1px solid var(--color-border); border-radius: 4px; }

/* --- 組み合わせ作成・作り直しダイアログ ------------------------------- */
.gen-fieldset { border: 1px solid var(--color-border); border-radius: 6px; padding: 10px 14px 14px; margin: 0 0 14px; }
.gen-fieldset legend { padding: 0 6px; font-weight: bold; font-size: 0.9em; color: #445; }
.gen-radio { display: flex; align-items: flex-start; gap: 6px; margin: 8px 0; cursor: pointer; }
.gen-suboptions { margin: 0 0 8px 24px; padding-left: 10px; border-left: 2px solid var(--color-border); }
.gen-suboptions .gen-radio { margin: 6px 0; font-size: 0.95em; }
.gen-area-help { margin: 4px 0 0; }
.modal__actions { display: flex; gap: 10px; margin-top: 14px; }

/* トーナメント画面(tournament.php)。クラス見出しのスタイルはclass-lane__headを共用する */
.tournament-lane .tournament-body { overflow: visible; }

/* まだ組み合わせが作成されていないクラス */
.class-lane__empty {
  border: 1px dashed var(--color-border);
  border-radius: 6px;
  padding: 18px 16px;
  background: #fff;
  max-width: 420px;
}
.class-lane__empty p { margin: 0 0 12px; color: #5b6770; }

.class-lane__scroll {
  display: flex;
  gap: 14px;
  overflow-x: auto;
  overflow-y: hidden;
  padding-bottom: 10px;
  align-items: flex-start;
  /* スクロールできることが分かるよう、端を少し余らせる */
  scroll-padding-left: 8px;
}
.class-lane__scroll .league-block { flex: 0 0 330px; }
/* 表だけで表示するブロック(6チーム以上など)は、枠の幅を表に合わせて広げる。1マスは「A-12」と得点が1行ずつ収まる幅にする */
.class-lane__scroll .league-block--table { flex: 0 0 auto; }
.league-block--table .cross-table { width: auto; }
.league-block--table .cross-table__colhead { width: auto; min-width: 58px; }
.league-block--table .cross-table__cell { min-width: 58px; }
.league-block--table .cell__slot, .league-block--table .cell__score { white-space: nowrap; }

/* クラスへのジャンプリンク */
.class-jump { font-size: 0.85em; color: #6b767e; display: flex; gap: 10px; flex-wrap: wrap; align-items: baseline; }
.class-jump a { color: var(--color-primary); }
/* スマホなど狭い画面では、クラス数が多いとリンクの折り返しがかさばり押しづらいため、
   プルダウン(.class-jump-select)に切り替える。広い画面では従来どおりリンク一覧を表示する。 */
.class-jump-select { display: none; font-size: 0.85em; color: #6b767e; align-items: center; gap: 8px; }
.class-jump-select select { padding: 6px 8px; border: 1px solid var(--color-border); border-radius: 4px; font-size: 0.95em; }
@media (max-width: 700px) {
  .class-jump { display: none; }
  .class-jump-select { display: flex; }
}
/* 画面幅によらず常にプルダウンで表示する場合(リーグ表・トーナメント表の管理画面) */
.class-jump-select--pulldown { display: flex; }

/* トーナメント画面: 本文(各クラスのブラケット)。「クラスへ移動」は組み合わせ作成・リーグ表と
   同じく上部のboard-toolbar(横並び・sticky)にそろえている(以前は左の縦ナビだったが、
   他の画面と操作感をそろえるため2026年9月に戻した)。 */
.tournament-content {
  /* ブラケットは1回戦(左)→優勝(右)の左詰め表示。非常に横幅が広い画面でだけ
     上限を掛け、優勝欄が画面の右端いっぱいまで離れて間延びしないようにする
     (以前はvw基準の計算式で常に上限を掛けていたが、ウィンドウ幅を狭めたときに
     実際の残り幅より上限が先に小さくなり、無駄な空白や早すぎる横スクロールの
     原因になっていた)。通常〜狭い画面では上限を掛けず、残り幅いっぱいまで使う。 */
  max-width: 1600px;
}

.league-block {
  border: 1px solid var(--color-border);
  border-radius: 6px;
  padding: 8px 10px 10px;
  background: #fff;
}
.league-block__title { margin: 0 0 6px; font-size: 1em; }

/* --- リーグ図形(旧DrawZukei: △ □ 五角形) --------------------------- */
.figure { display: block; width: 100%; height: auto; }
.figure__outline { fill: none; stroke: #dfe6ea; stroke-width: 1; }
.figure__edge { stroke: #9dc9e2; stroke-width: 2; }
.figure__edge--diag { stroke-dasharray: 4 3; }
.figure__edge--done { stroke: #c3ccd2; }
.figure__vertex { fill: #b9c4cc; }

/* 図形内のクリック可能な要素(SVG内なのでbutton要素は使えずgで代用) */
.figure__slot, .figure__team { cursor: pointer; }
.figure__slot rect { fill: #e3f4fb; stroke: #b9e2f2; }
.figure__slot text { font-size: 13px; fill: var(--color-text); font-variant-numeric: tabular-nums; }
.figure__slot:hover rect { fill: #cdecfa; stroke: var(--color-primary); }
.figure__slot--empty rect { fill: #f4fafd; }
.figure__slot--empty text { fill: #9aa7b0; }
.figure__slot--done rect { fill: #eef2f5; stroke: #d3dbe0; }

.figure__team rect { fill: #fdeaea; stroke: #f0c4c4; }
.figure__team text { font-size: 13px; fill: var(--color-text); }
.figure__team-area { font-size: 10px; fill: #8b969e; }
.figure__team:hover rect { fill: #fbd9d9; stroke: var(--color-primary); }
.figure__team--empty rect { fill: #fbf3f3; }
.figure__team--empty text { fill: #9aa7b0; font-style: italic; }
.figure__seq { fill: #8b969e; }

.figure__slot:focus, .figure__team:focus { outline: none; }
.figure__slot:focus rect, .figure__team:focus rect { stroke: var(--color-primary); stroke-width: 2; }

.league-block__table { margin-top: 6px; }
.league-block__table > summary { cursor: pointer; font-size: 0.85em; color: #5b6770; }
.league-block__table > summary + table { margin-top: 6px; }

.cross-table { border-collapse: collapse; width: 100%; font-size: 0.85em; }
.cross-table th, .cross-table td {
  border: 1px solid var(--color-border);
  padding: 0;
  text-align: center;
}
.cross-table__corner { background: #f2f5f7; font-weight: normal; font-size: 0.9em; padding: 3px 4px; }
.cross-table__colhead { background: #f2f5f7; width: 46px; padding: 3px 0; }
.cross-table__rowhead {
  background: #fff;
  font-weight: normal;
  text-align: left;
  white-space: nowrap;
  padding: 0;
}
.cross-table__seq {
  display: inline-block;
  width: 18px;
  text-align: center;
  color: #7a868f;
  vertical-align: middle;
}
.cross-table__self { background: #55636d; }
.cross-table__none { background: #f4f6f7; color: #c2ccd3; }
.cross-table__cell { padding: 0; }

/* クリック可能なセル */
.cell {
  display: block;
  width: 100%;
  border: 0;
  background: none;
  font: inherit;
  color: inherit;
  cursor: pointer;
  padding: 4px 5px;
  text-align: center;
  line-height: 1.25;
}
.cell:hover { outline: 2px solid var(--color-primary); outline-offset: -2px; }
.cell:focus-visible { outline: 2px solid var(--color-primary); outline-offset: -2px; }

/* チーム名セル(原典の赤いセル) */
.cell--team {
  background: #fdeaea;
  text-align: left;
  width: calc(100% - 18px);
  display: inline-block;
  vertical-align: middle;
  max-width: 170px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.cell--team:hover { background: #fbd9d9; }

/* コート/試合順セル(原典の水色セル) */
.cell--court { background: #e3f4fb; }
.cell--court:hover { background: #cdecfa; }
.cell--empty { color: #9aa7b0; }
.cell--team.cell--empty { background: #fbf3f3; font-style: italic; }
.cell--court.cell--empty { background: #f4fafd; }
.cell--done { background: #eef2f5; }
.cell__slot { display: block; font-variant-numeric: tabular-nums; }
.cell__score { display: block; font-size: 0.85em; color: #5b6770; }

/* --- リーグ表(成績クロス表・読み取り専用) ------------------------------ */
/* 旧システムのExcel「リーグ表」と同じレイアウトを、1チームあたり縦4行×横4列の
   マス目としてCSS Gridで組む。rowspan/colspanの絡む結合セルが多いため、
   ネイティブtableではなくgrid-column/grid-rowの指定で位置決めする
   (TournamentBoardRendererのブラケット表現と同じ考え方)。 */
.lstand-wrap { overflow-x: auto; margin-bottom: 22px; }
.lstand {
  display: grid;
  grid-template-columns: 130px repeat(calc(var(--lstand-cols) - 1), 26px);
  grid-auto-rows: 20px;
  width: max-content;
  border-top: 1px solid #8a97a0;
  border-left: 1px solid #8a97a0;
  font-size: 0.78em;
}
.lstand__cell {
  border-right: 1px solid #8a97a0;
  border-bottom: 1px solid #8a97a0;
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
  background: #fff;
  padding: 0 2px;
  overflow: hidden;
}
.lstand__corner { background: #f2f5f7; }
.lstand__teamhead, .lstand__stathead {
  background: #cdeecd; /* 旧Excel様式のFFD2FFD2に近い緑 */
  font-weight: bold;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.lstand__name {
  background: #eaf7ea; /* 旧Excel様式の見出し緑(FFD2FFD2)に近い色 */
  justify-content: flex-start;
  text-align: left;
  padding: 1px 6px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
/* ふりがな・チーム名・所在の3行は、1チームぶんのまとまりに見えるよう内側の
   横罫線を消す(チーム間の区切りは4行目の下罫線として残る)。 */
.lstand__name--kana,
.lstand__name--main,
.lstand__name--area {
  border-bottom: none;
}
.lstand__name--kana { font-size: 0.72em; color: #7a868f; }
.lstand__name--main { font-weight: bold; }
.lstand__name--area { font-size: 0.72em; color: #7a868f; }

.lstand__self { background: #ffffff; color: #b9c4cc; font-size: 1.3em; }
.lstand__none { background: #f4f6f7; color: #c2ccd3; font-size: 1.1em; }
.lstand__mark { line-height: 1; }

.lstand__code { font-size: 0.85em; color: #5b6770; }
.lstand__num { font-variant-numeric: tabular-nums; }
.lstand__num--set { font-size: 0.92em; color: #445; }
.lstand__dash { color: #9aa7b0; }
.lstand__dash--set { font-size: 0.85em; }
.lstand__mark--wl { font-weight: bold; }
.lstand__mark--wl.is-win { color: #c0392b; }
.lstand__mark--wl.is-lose { color: #2f6fa8; }
.lstand__mark--wl.is-draw { color: #8a5a00; }

.lstand__diff { font-weight: bold; }
.lstand__rank { font-weight: bold; background: #fbf6e6; }

/* ツールチップ用の透明オーバーレイ。.lstand__cellの既定背景(白)・罫線を
   引き継ぐと、下に敷いた対戦マスの内容(試合番号・得点等)を覆い隠して
   見えなくしてしまうため、背景・罫線とも無しにする。 */
.lstand__tip { pointer-events: none; background: none; border: none; }
.lstand__tip-inner { position: absolute; inset: 0; pointer-events: auto; }

/* --- ワイルドカード: 抽選入力パネル・候補一覧(league_standings.php) ------- */
.lstand-lottery, .lstand-wildcard {
  max-width: 640px;
  margin: 0 0 22px;
  padding: 12px 14px;
  border: 1px solid var(--color-border);
  border-radius: 6px;
  background: #fff;
}
.lstand-wildcard__title { margin: 0 0 8px; font-size: 0.98em; }
.lstand-lottery__table, .lstand-wildcard__table {
  width: 100%;
  border-collapse: collapse;
  font-size: 0.9em;
  margin-top: 8px;
}
.lstand-lottery__table th, .lstand-lottery__table td,
.lstand-wildcard__table th, .lstand-wildcard__table td {
  border: 1px solid var(--color-border);
  padding: 4px 8px;
  text-align: center;
}
.lstand-lottery__table th, .lstand-wildcard__table th { background: #f2f5f7; }
.lstand-lottery__input { width: 4em; text-align: center; }
.lstand-wildcard__table tr.is-advance { background: #eaf7ea; }
.lstand-wildcard__table tr.is-out { color: #9aa7b0; }
.lstand-wildcard__table tr.is-pending { background: #fff1d6; }

/* --- 大会全体のコート別試合順一覧 ------------------------------------ */
.matrix-panel { margin: 10px 0 18px; border: 1px solid var(--color-border); border-radius: 6px; background: #fff; }
.matrix-panel > summary { cursor: pointer; padding: 8px 12px; font-weight: bold; }
.matrix-panel > div { padding: 0 12px 12px; }

/* カテゴリ単位で折りたためる汎用パネル(競技種別の管理画面など) */
.collapse-panel { margin: 10px 0 18px; border: 1px solid var(--color-border); border-radius: 6px; background: #fff; }
.collapse-panel > summary { cursor: pointer; padding: 8px 12px; font-weight: bold; font-size: 1.05em; }
.collapse-panel > summary:hover { background: #f4fafd; }
.collapse-panel > .table { margin: 0; border-top: 1px solid var(--color-border); }
.matrix-wrap { overflow-x: auto; }

.court-matrix { border-collapse: collapse; font-size: 0.78em; }
.court-matrix th, .court-matrix td { border: 1px solid var(--color-border); padding: 2px 4px; text-align: center; }
.court-matrix thead th { background: #f2f5f7; white-space: nowrap; }
.court-matrix__corner, .court-matrix__rowhead { background: #f2f5f7; width: 52px; }
.court-matrix__free { background: #fff; min-width: 90px; }
/* 全クラスを一度に表示するため、割当済みセルはクラスを問わず同じ扱いにする */
.court-matrix__taken { background: #e3f4fb; color: var(--color-text); max-width: 150px; }
.court-matrix__block { display: block; font-weight: bold; font-size: 0.92em; }
.court-matrix__teams {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  max-width: 150px;
}

/* --- モーダル(ピッカー) --------------------------------------------- */
body.is-modal-open { overflow: hidden; }
.modal {
  position: fixed; top: 0; right: 0; bottom: 0; left: 0;
  z-index: 100; display: flex; align-items: center; justify-content: center;
}
.modal[hidden] { display: none; }
.modal__backdrop {
  position: absolute; top: 0; right: 0; bottom: 0; left: 0;
  background: rgba(20, 28, 34, 0.45);
}
.modal__panel {
  position: relative;
  background: #fff;
  border-radius: 8px;
  box-shadow: 0 10px 40px rgba(0, 0, 0, 0.3);
  max-width: 95vw;
  max-height: 90vh;
  display: flex;
  flex-direction: column;
}
.modal__head {
  display: flex; align-items: center; justify-content: space-between;
  padding: 10px 14px; border-bottom: 1px solid var(--color-border);
}
.modal__title { margin: 0; font-size: 1.05em; }
.modal__close { border: 0; background: none; font-size: 1.6em; line-height: 1; cursor: pointer; color: #6b767e; }
.modal__body { padding: 12px 14px 16px; overflow: auto; }

.picker__lead { margin: 0 0 10px; }
.picker__note-line { margin: -4px 0 10px; color: #5a6b77; font-size: 0.88em; }
.picker__foot { margin: 12px 0 0; }

/* チーム選択リスト */
.picker__list { display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: 6px; }
.picker__item {
  display: flex; align-items: center; justify-content: space-between; gap: 8px;
  padding: 7px 10px; border: 1px solid var(--color-border); border-radius: 4px;
  background: #fff; font: inherit; text-align: left; cursor: pointer;
}
.picker__item:hover:not([disabled]) { background: #eef6fb; border-color: #9ec7e0; }
.picker__item.is-current { background: #fff8d8; border-color: #e3d18a; }
.picker__item.is-swap { background: #f6f9ec; }
.picker__item.is-disabled, .picker__item[disabled] { opacity: 0.5; cursor: not-allowed; }
.picker__item--clear { font-style: italic; color: #6b767e; }
.picker__item--withdraw { grid-column: 1 / -1; justify-content: center; color: #b02a1e; border-color: #f0c3bd; }
.picker__item--withdraw:hover:not([disabled]) { background: #fdecea; border-color: #e79890; }
.picker__main { display: flex; flex-direction: column; min-width: 0; overflow: hidden; }
.picker__name { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.picker__area { font-size: 0.75em; color: #8b969e; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.picker__block { font-size: 0.68em; color: #a9b3ba; font-weight: normal; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.picker__note { font-size: 0.78em; color: #6b767e; white-space: nowrap; }

/* 審判選択ピッカー: 他クラスのチームをまとめた折りたたみ */
.picker__other { margin-top: 12px; border-top: 1px solid var(--color-border); padding-top: 10px; }
.picker__other-summary {
  cursor: pointer; font-size: 0.9em; color: var(--color-primary); font-weight: bold;
  outline: none;
}
.picker__other-class { margin: 10px 0 4px; font-size: 0.82em; color: #5a6b77; font-weight: bold; }
.picker__other-class:first-of-type { margin-top: 8px; }

/* コート×試合順グリッド(旧beCourtSelDlg / ScjCtrl 相当) */
.court-matrix--picker td { padding: 0; }
.court-matrix__pickcell { padding: 0; }
.slot {
  display: block; width: 100%; min-width: 74px; min-height: 30px;
  border: 0; background: none; font: inherit; font-size: 0.9em;
  cursor: pointer; padding: 4px 6px;
}
.slot:hover { outline: 2px solid #2e6da4; outline-offset: -2px; }
.slot--free    { background: #fff; }
.slot--current { background: #ffe14d; font-weight: bold; }
.slot--t1busy  { background: #a8c8ee; }
.slot--t2busy  { background: #bfe6a8; }
.slot--taken   { background: #d8dee2; color: #7e888f; }

.slot-legend { list-style: none; padding: 0; margin: 0 0 10px; display: flex; flex-wrap: wrap; gap: 6px 16px; font-size: 0.82em; }
.slot-legend li { display: flex; align-items: center; gap: 5px; }
.slot-chip { display: inline-block; width: 14px; height: 14px; border: 1px solid var(--color-border); border-radius: 2px; }

.btn--sub { background: #f2f5f7; color: var(--color-text); border: 1px solid var(--color-border); }

/* =====================================================================
   トーナメント画面(tournament.php)の図式ブラケット
   ===================================================================== */

/* 列(ラウンド)を横に並べる。DOM順が「1回戦→決勝→優勝」のままなので、通常の
   flex-direction: row(既定)で、そのまま1回戦(左)→決勝→優勝(頂点/右)の
   左→右に勝ち上がる向きで表示する。横スクロールで多ラウンドにも対応する。
   上側の余白(padding-top)は見た目のためだけでなく、各クラスの一番上の対戦カード
   (.tchip)がはみ出さないために必要な最小値でもある。.tchipは対戦カードの枠の
   中央(bottom:50%)を基準に線の上へ浮かせて表示するため、一番上の枠(2回戦の
   最初の対戦=高さ80pxの枠)ではセット3つぶんの得点グリッド+コートチップの高さ
   (約65px)が中央から上にはみ出す。overflow-x:autoを指定すると
   (CSSの仕様上)overflow-yも自動的にautoになりクリップされてしまうため、
   はみ出す分より余裕を持った上余白を確保しておく(以前は6pxしかなく、
   一番上の対戦カードの得点1行目が見切れていた)。 */
.bracket-wrap { display: flex; align-items: flex-start; overflow-x: auto; padding: 34px 4px 14px; }
.bracket-col {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  flex: 0 0 auto;
}

/* 各「枠」。高さはPHP側で計算した値をインラインstyleで与える(2つの子ノードの中間に
   親ノードが来るよう、2^(round数)で均等割りする仕掛け)。 */
.bracket-slot {
  position: relative;
  display: flex;
  align-items: center;
  width: 150px;
  flex: 0 0 auto;
}
.bracket-col--champion { flex: 0 0 auto; }
.bracket-slot--champion { width: 100%; justify-content: center; }

/* 2回戦以降の対戦カードの列は、チーム名を表示せずコート/試合順チップ+セット得点グリッド
   だけなので、1回戦の入口(.tentry)よりずっと狭くしてよい。
   チップ(.tchip)は線に重ねず、線の少し上に右詰めで浮かせて表示する。 */
.bracket-slot--match { width: 72px; }

/* 列と列の間の接続線。奇数/偶数(2k, 2k+1)のペアがそれぞれ上下からL字に伸び、
   ちょうど親ノードの高さ(--conn-h ぶん)で合流する。
   左→右フローのため、線は各枠の「右側」(=次の合流点がある側)に伸ばす。
   既定(1回戦の入口=.tentryなど、不透明な枠を持つもの)では、線は枠の外
   (列と列の間のギャップ)だけに留め、枠の中まで線が入り込まないようにする。 */
.bracket-slot--upper:not(.bracket-slot--final)::after,
.bracket-slot--lower:not(.bracket-slot--final)::after {
  content: "";
  position: absolute;
  left: 100%;
  /* 不戦(bye)の枠では次のラウンドの列を飛び越すため、線の長さを可変にする */
  width: var(--conn-w, 20px);
  height: var(--conn-h, 0px);
  border-right: 2px solid #9dc9e2;
  pointer-events: none;
}
.bracket-slot--upper:not(.bracket-slot--final)::after { top: 50%; border-top: 2px solid #9dc9e2; }
.bracket-slot--lower:not(.bracket-slot--final)::after { bottom: 50%; border-bottom: 2px solid #9dc9e2; }
/* 2回戦以降の対戦カード(.bracket-slot--match)は枠自体が透明(チップが線の上に浮くだけ)
   なので、線を枠自身の幅ぶんも延長し、ギャップの線と継ぎ目なく1本につなげてよい。 */
.bracket-slot--match.bracket-slot--upper:not(.bracket-slot--final)::after,
.bracket-slot--match.bracket-slot--lower:not(.bracket-slot--final)::after {
  left: 0;
  width: calc(var(--conn-w, 20px) + 100%);
}
/* 決勝(列に1枠のみ)は優勝カードへ、まっすぐ1本の線でつなぐ */
.bracket-slot--final::after {
  content: "";
  position: absolute;
  left: 100%;
  top: 50%;
  width: 20px;
  border-top: 2px solid #e0b84d;
  pointer-events: none;
}
.bracket-slot--match.bracket-slot--final::after {
  left: 0;
  width: calc(20px + 100%);
}
/* 勝ち上がって次の合流点に進んだ側の接続線は赤くする(旧Delphi版の勝ち上がり線と同じ考え方)。
   縦線(次の合流点に合流する部分)も含めて線全体が赤になる。 */
.bracket-slot--won:not(.bracket-slot--final)::after { border-color: #d9362e; }
.bracket-slot--final.bracket-slot--won::after { border-color: #d9362e; }
/* その対戦の勝者が決まった時点で、次の合流点へ向かう「横線」だけを先に赤くする。
   縦線は次の対戦にも勝った時点(上の--won)で赤くなるため、
   「どこまで勝ち上がったか」と「次の対戦でどちらが勝ったか」が線だけで読み取れる
   (旧システムのトーナメント表と同じ描き方)。 */
.bracket-slot--adv.bracket-slot--upper:not(.bracket-slot--final)::after { border-top-color: #d9362e; }
.bracket-slot--adv.bracket-slot--lower:not(.bracket-slot--final)::after { border-bottom-color: #d9362e; }

/* 1回戦の枠(予選順位 または 参加チームの入口)。
   チーム名と「A組1位」(枠のラベル)を1行に並べ、枠全体を右詰め(接続線が伸びる側)にそろえる。 */
.tentry {
  display: flex;
  align-items: baseline;
  justify-content: flex-end;
  gap: 5px;
  width: 100%;
  overflow: hidden;
  border: 1px solid #f0c4c4;
  background: #fdeaea;
  border-radius: 4px;
  padding: 3px 8px;
  font: inherit;
  text-align: right;
  cursor: pointer;
}
button.tentry:hover { background: #fbd9d9; border-color: var(--color-primary); }
.tentry--empty { color: #9aa7b0; }
.tentry--fixed { cursor: default; background: #fff; border-color: var(--color-border); }
.tentry--wildcard { background: #fff8e1; border-color: #f0c060; }
.tentry--wildcard .tentry__label { color: #8a5a00; }
.tentry__label { flex: 0 0 auto; font-size: 0.8em; color: #8b969e; }
.tentry__area { flex: 0 0 auto; font-size: 0.8em; color: #8b969e; }
/* 「所在を表示」チェックボックスOFF時は、1回戦枠・チーム選択ピッカーの所在表示をまとめて隠す
   (長いチーム名が省略されすぎる場合に、所在を非表示にして名前の表示幅を確保できるようにする)。
   bodyにクラスを付けているのは、チーム選択ピッカー(#picker-modal)が#tournament-rootの
   兄弟要素で、共通の祖先がbodyしか無いため。 */
body.hide-area .tentry__area, body.hide-area .picker__area { display: none; }
.tentry__name { flex: 1 1 auto; min-width: 0; font-size: 0.88em; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.tentry__name--pending { color: #9aa7b0; font-style: italic; }

/* 2回戦以降の対戦カード(.bracket-slot--matchの中身)。枠(border)は持たず、
   勝ち上がり線(.bracket-slot--matchの::after、枠の中まで伸ばしている)の少し上に、
   コート/試合順チップを左詰め(=枠の外側寄り、1回戦側)で浮かせる。チップの下は線が透けて見える。
   枠の左端(前の合流点の縦線が来る位置)にチップが重なってしまうため、線1本分ほど右にずらす。 */
.tchip {
  position: absolute;
  left: 4px;
  bottom: 50%;
  margin-bottom: 2px;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 2px;
  pointer-events: none; /* クリック判定は.tchip__slot自身が受ける */
}
/* セット別の得点グリッド(旧Delphi版と同じ、丸数字を挟んで両チームの得点を並べる形式)。
   チーム1の得点(上段)・セット番号(中段、①②③)・チーム2の得点(下段)の3行×セット数分。
   一番右には、太字・区切り線付きで「奪ったセット数」の合計列を追加している。 */
.tscore {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}
.tscore__row { display: flex; gap: 2px; }
.tscore__cell {
  min-width: 1.3em;
  text-align: center;
  font-size: 0.68em;
  line-height: 1.25;
  font-variant-numeric: tabular-nums;
  color: #445;
}
.tscore__row--set .tscore__cell { font-size: 0.6em; color: #9aa7b0; }
.tscore__cell--count {
  margin-left: 2px;
  padding-left: 4px;
  border-left: 1px solid var(--color-border);
  font-weight: bold;
  color: var(--color-text);
}
.tchip__slot {
  pointer-events: auto;
  display: block;
  min-width: 2.6em;
  border: 0;
  border-radius: 3px;
  background: #e3f4fb;
  color: var(--color-text);
  font: inherit;
  font-size: 0.78em;
  padding: 1px 3px;
  cursor: pointer;
  text-align: left;
  white-space: nowrap;
}
.tchip__slot:hover { background: #cdecfa; }
.tchip__slot--empty { background: transparent; color: #9aa7b0; }
.tchip__slot--pending { background: transparent; color: #c7ced3; cursor: default; padding: 1px 3px; }

/* 優勝カード(頂点。3位決定戦の「3位」にも使う)。以前は枠が大きく目立ちすぎたため、控えめな見た目に縮小している。 */
.tchampion {
  width: 100%;
  text-align: center;
  padding: 6px 8px;
  border: 1px dashed #d9c48f;
  border-radius: 4px;
  background: #fffdf6;
}
.tchampion--decided { border-style: solid; background: #fdf8e8; }
.tchampion__label { font-size: 0.7em; color: #a1873f; letter-spacing: 0.1em; }
.tchampion__name { margin-top: 2px; font-size: 0.9em; font-weight: bold; color: #8a6d1f; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

/* 3位決定戦(本体の下に、同じ形式の小さなトーナメント表として並べる) */
.third-place { margin-top: 18px; }
.third-place__title { margin: 0 0 6px; font-size: 0.95em; color: #6b767e; }

/* =====================================================================
   審判割画面(referee_assign.php)
   ===================================================================== */

.rassign th, .rassign td { white-space: nowrap; }
/* タイトル行(見出し)を縦スクロールしても隠れないように固定する。
   通常表示はヘッダー(position: sticky, 高さ約78px)の下に、embed表示(ops_tabs.phpのタブ)は
   ヘッダーが無いのでtop:0に張り付ける(下の.app-main--embed側の上書きを参照)。 */
.rassign thead th { position: sticky; top: calc(78px + var(--rassign-tb, 0px)); z-index: 10; }
.app-main--embed .rassign thead th { top: var(--rassign-tb, 0px); }
/* 審判割のツールバー: 固定表示し、表の見出し行をすぐ下に続ける */
.rassign-toolbar { margin: 0; padding-top: 10px; padding-bottom: 10px; z-index: 85; }
#rassign-counts { margin-top: 14px; }
.rassign__ref {
  display: inline-block;
  min-width: 90px;
  border: 1px solid var(--color-border);
  border-radius: 4px;
  background: #f7f9fa;
  color: inherit;
  font: inherit;
  padding: 3px 8px;
  cursor: pointer;
  text-align: left;
}
.rassign__ref:hover { background: #eef3f7; border-color: var(--color-primary); }
/* 対戦チームと重なっている(自分自身の対戦、または同じ試合順に別の対戦がある)審判は赤字で強調する */
.rassign__ref--conflict {
  background: #fdecea;
  border-color: var(--color-danger);
  color: var(--color-danger);
  font-weight: bold;
}
.rassign__row--conflict { background: #fff8f8; }
/* コート・試合順そのものが重複している行(審判の重なりとは別の、データ不整合の警告) */
.rassign__row--dup { background: #fff5e6; }
.rassign__dup-badge {
  display: inline-block;
  margin-left: 4px;
  padding: 0 5px;
  font-size: 0.75em;
  font-weight: bold;
  color: #8a5a00;
  background: #ffe1a8;
  border-radius: 3px;
}
/* 説明文中でのサンプル表示用(クリックはできない) */
.rassign__ref--sample {
  display: inline-block;
  padding: 1px 6px;
  border-radius: 3px;
  cursor: default;
}
/* 種別欄: 決勝トーナメントと予選リーグ(ブロック)を色で見分けられるようにする */
.rassign__type-badge {
  display: inline-block;
  padding: 2px 8px;
  border-radius: 10px;
  font-size: 0.8em;
  font-weight: bold;
}
.rassign__type-badge--league { background: #e3f0fb; color: #1b5e8a; }
.rassign__type-badge--tournament { background: #f0e6fb; color: #6a3fa0; }
/* 対戦チーム未確定の決勝トーナメント試合: 確定後に採用予定のルールを説明文で表示する(選択不可) */
.rassign__ref-placeholder { color: #5a6b77; font-style: italic; font-size: 0.9em; }
/* 対戦チーム未確定の試合の「自動で決まるルール」の説明。クリックすると例外の審判を指定できる */
.rassign__ref--rule { border-style: dashed; background: #fff; color: #5a6b77; font-style: italic; font-size: 1em; }
.rassign__ref-hint { margin-left: 8px; padding: 0 6px; border-radius: 8px; background: #e8f1f8; color: var(--color-primary); font-style: normal; font-size: 0.85em; }

/* 審判割: コート単位の見やすさ。コートが変わるところにコート名の帯(見出し行)を挟み、
   各行の左端と「コート」「試合順」のセルを、コートごとの色(1〜6を繰り返す)で縁取る */
.rassign__court-head td {
  padding: 6px 12px; font-weight: bold; font-size: 1.05em; color: #fff; border-top: 3px solid #fff;
}
.rassign__court-count { margin-left: 10px; font-size: 0.8em; font-weight: normal; opacity: 0.9; }
.rassign__row > td:first-child { border-left: 8px solid var(--rc, #9aa7b0); background: var(--rc-tint, #f1f3f5); font-weight: bold; }
.rassign__row > td:nth-child(2) { background: var(--rc-tint, #f1f3f5); }
.rassign__c0 { --rc: #7d8a93; --rc-tint: #f1f3f5; }
.rassign__c1 { --rc: #1a6fb0; --rc-tint: #e8f2fa; }
.rassign__c2 { --rc: #2e8b57; --rc-tint: #e7f5ec; }
.rassign__c3 { --rc: #d9822b; --rc-tint: #fdf0e1; }
.rassign__c4 { --rc: #7b4fb3; --rc-tint: #f1eaf9; }
.rassign__c5 { --rc: #1f9ea8; --rc-tint: #e4f5f6; }
.rassign__c6 { --rc: #c2506b; --rc-tint: #fae9ed; }
.rassign__court-head.rassign__c0 td, .rassign__court-head.rassign__c1 td, .rassign__court-head.rassign__c2 td,
.rassign__court-head.rassign__c3 td, .rassign__court-head.rassign__c4 td, .rassign__court-head.rassign__c5 td,
.rassign__court-head.rassign__c6 td { background: var(--rc); }

/* 審判割一括作成ダイアログ: 対象コートの選択(全コート一括 / コートを選択) */
.court-mode { display: flex; flex-direction: column; gap: 4px; margin-bottom: 6px; }
.court-check-list {
  display: flex;
  flex-wrap: wrap;
  gap: 4px 16px;
  margin: 4px 0 10px;
  padding: 8px 10px;
  background: #f7f9fa;
  border: 1px solid var(--color-border);
  border-radius: 4px;
}
.court-check-list[hidden] { display: none; }
.court-check-list__item { font-weight: normal; }

/* 種目の一括登録: カテゴリごとのグループ枠 */
.bulk-category-group { border: 1px solid #dde3ea; border-radius: 6px; margin: 0 0 12px; padding: 8px 12px 12px; }
.bulk-category-group legend { padding: 0 6px; font-weight: bold; }
.bulk-category-group .court-check-list { margin-top: 4px; }

/* 審判ピッカー: 「審判団」と任意の文字での指定 */
.picker__free { grid-column: 1 / -1; margin: 4px 0 6px; padding: 8px 10px; border: 1px dashed #b9c6cf; border-radius: 6px; background: #f8fafb; }
.picker__free.is-current { border-color: var(--color-primary); background: #eef5fb; }
.picker__free-label { display: block; margin: 0 0 4px; font-size: 0.85em; font-weight: bold; color: #3a5a78; }
.picker__free-row { display: flex; gap: 8px; align-items: center; }
.picker__free-input { flex: 1 1 auto; min-width: 0; padding: 7px 9px; border: 1px solid #8ea4b8; border-radius: 4px; font-size: 1em; background: #fff; }
.picker__free-input:focus { outline: none; border-color: var(--color-primary); box-shadow: 0 0 0 3px rgba(26,111,176,0.2); }

/* 審判回数(審判割の画面上部のチームごとの一覧と、審判ピッカー内の表示) */
.rcount { margin: 0 0 12px; background: #fff; border: 1px solid var(--color-border); border-radius: 6px; }
.rcount > summary { cursor: pointer; padding: 8px 12px; font-weight: bold; font-size: 0.92em; color: #3a5a78; }
.rcount__sum { margin-left: 10px; font-weight: normal; font-size: 0.9em; color: #5a6b77; }
.rcount__class { padding: 4px 12px 8px; }
.rcount__class-name { font-size: 0.82em; font-weight: bold; color: #5a6b77; margin-bottom: 4px; }
.rcount__chips { display: flex; flex-wrap: wrap; gap: 6px; }
.rcount__chip { display: inline-flex; align-items: center; gap: 6px; padding: 3px 4px 3px 10px; border: 1px solid #c9d6e0; border-radius: 14px; background: #f5f9fc; font-size: 0.88em; }
.rcount__chip b { padding: 0 8px; border-radius: 10px; background: #dbe9f5; color: #1a5a96; font-weight: bold; }
.rcount__chip--zero { border-color: #e6c36a; background: #fff6dc; }
.rcount__chip--zero b { background: #f6d77a; color: #7a5a00; }
.rassign__count { display: inline-block; margin-left: 6px; padding: 0 6px; border-radius: 9px; background: #dbe9f5; color: #1a5a96; font-size: 0.8em; font-weight: bold; }
.rassign__count--max { background: #fde2c2; color: #9a5600; }

/* 目立たせたいプルダウンメニュー(審判割の「出力メニュー」など): 青い太枠・淡い青地・太字で、通常のボタンより存在感を出す */
.menu-btn__summary--emph {
  border: 2px solid var(--color-primary); background: #e8f2fa; color: var(--color-primary-dark);
  font-weight: bold; font-size: 1em; padding: 7px 16px; box-shadow: 0 1px 3px rgba(26,111,176,0.25);
}
.menu-btn__summary--emph:hover { background: #d6e8f6; }
.menu-btn[open] > .menu-btn__summary--emph { background: var(--color-primary); color: #fff; }

/* 「?」マークを押すと説明がポップアップする(出力・印刷など。説明書きを画面に常時出さないための部品) */
.help-wrap { position: relative; display: inline-flex; align-items: center; }
.help-mark {
  width: 20px; height: 20px; padding: 0; border-radius: 50%; border: 1px solid #8ea4b8; background: #fff; color: #1a6fb0;
  font-size: 12px; font-weight: bold; line-height: 1; cursor: pointer;
}
.help-mark:hover, .help-mark[aria-expanded="true"] { background: #1a6fb0; border-color: #1a6fb0; color: #fff; }
.help-pop {
  position: absolute; left: 0; top: calc(100% + 6px); z-index: 90; width: 420px; max-width: 80vw; padding: 10px 14px;
  background: #fff; border: 1px solid #b9c6cf; border-radius: 6px; box-shadow: 0 4px 14px rgba(0,0,0,0.18);
  font-size: 13px; font-weight: normal; color: #44515b; line-height: 1.7; letter-spacing: 0;
}
.help-pop[hidden] { display: none; }
.help-pop p { margin: 0 0 6px; }
.help-pop ul { margin: 0; padding-left: 1.3em; }

/* --- 試合順・審判割作成ダイアログ(組み合わせ作成画面) ---------------------- */
.modal__panel--sched { width: 620px; }
.sched-class { padding: 6px 0; border-bottom: 1px dashed var(--color-border); }
.sched-class:last-child { border-bottom: 0; }
.sched-class__name { margin: 0; }
.sched-class__blocks { display: flex; flex-wrap: wrap; gap: 2px 18px; margin: 2px 0 0 22px; }
.sched-class__blocks .form-check { margin: 0; }
.sched-meta { font-size: 0.82em; color: #6b767e; }
/* 試合順・審判割作成の結果など、複数行のメッセージを改行どおりに表示する */
.flash { white-space: pre-line; }
.sched-refcount { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 16px; margin: 6px 0 0; font-size: 0.95em; }
.sched-refcount .form-check { margin: 0; }

/* 設定画面の、ラジオボタン・チェックボックスを横に並べる行 */
.inline-choice { display: flex; flex-wrap: wrap; gap: 4px 22px; align-items: center; }
.inline-choice .form-check { margin: 0; }

/* 試合順・審判割作成: コートの選択欄で、試合が組まれているコートを色と試合数で示す */
.court-check-list__item { padding: 2px 8px; border: 1px solid transparent; border-radius: 4px; }
.court-check-list__item.has-games { background: #fff4dc; border-color: #f0d9a0; }
.court-check-list__item.will-clear { background: #fde8e6; border-color: #eaa9a3; }
.court-badge { margin-left: 4px; padding: 0 6px; border-radius: 9px; background: #e8eef2; color: #5a6b77; font-size: 0.78em; white-space: nowrap; }
.has-games .court-badge { background: #f5c46a; color: #5c4300; }
.will-clear .court-badge { background: #d9534f; color: #fff; }

/* トーナメント画面: 決勝トーナメントの下に出す「交流トーナメント」(決勝進出以外のチーム)の見出し */
.exchange-title { margin: 26px 0 6px; padding: 4px 10px; font-size: 1.02em; color: #1f4e79; background: #eaf3fb; border-left: 5px solid #2e75b6; }
.exchange-title span { margin-left: 10px; font-size: 0.82em; font-weight: normal; color: #5a6b77; }

/* 個人ポイント戦(individual.php) */
.ip-tabs { display: flex; flex-wrap: wrap; gap: 4px; border-bottom: 2px solid var(--color-primary); margin: 6px 0 16px; }
.ip-tabs__tab { padding: 8px 18px; border: 1px solid var(--color-border); border-bottom: none; border-radius: 6px 6px 0 0; background: #eef3f7; color: #3a5a78; text-decoration: none; font-weight: bold; }
.ip-tabs__tab.is-active { background: var(--color-primary); border-color: var(--color-primary); color: #fff; }
.ip-summary { margin: 4px 0 14px; padding: 10px 14px; background: #f3f8fc; border-left: 4px solid #2e75b6; line-height: 1.7; max-width: 820px; }
.ip-warn { color: #b02a1e; font-weight: bold; }
.ip-app { margin: 0 0 8px; border: 1px solid var(--color-border); border-radius: 4px; padding: 4px 10px 8px; }
.ip-app legend { font-weight: bold; padding: 0 6px; }
.ip-pick { display: inline-block; margin: 2px 14px 2px 0; white-space: nowrap; }
.ip-pick.is-imported { color: #8a97a3; }
.ip-teams { display: flex; flex-wrap: wrap; gap: 8px; margin: 6px 0 10px; }
.ip-team { border: 1px solid var(--color-border); border-radius: 4px; padding: 6px 10px; background: #fff; min-width: 200px; flex: 1 1 200px; max-width: 320px; }
.ip-team__name { font-weight: bold; color: #1f4e79; }
.ip-team__members { font-size: 0.9em; line-height: 1.5; }
.ip-sched th, .ip-sched td { text-align: center; }
.ip-sched__no { width: 3.5em; font-weight: bold; background: #eef3f7; }
.ip-game { font-size: 1.05em; font-weight: bold; }
.ip-vs { font-weight: normal; color: #8a97a3; font-size: 0.85em; }
.ip-ref { font-size: 0.85em; color: #5a6b77; }
.ip-cycle { margin-bottom: 22px; page-break-inside: avoid; }
.ip-cycle-nav .btn { margin-right: 4px; }
.ip-score td { vertical-align: middle; }
.ip-score .ip-side { min-width: 150px; font-size: 0.9em; }
.ip-score .score-input { width: 64px; text-align: center; font-size: 1.1em; }
.ip-score tr.ip-done { background: #f1f8ee; }
.ip-rank__no { font-weight: bold; text-align: center; }
.ip-rank td:not(:nth-child(2)):not(:nth-child(3)) { text-align: center; }

@media print {
  .app-header, .no-print, .flash { display: none !important; }
}
.ip-rank td:nth-child(2), .ip-rank td:nth-child(3) { white-space: nowrap; }