:root{
  --bg:#090b0f; --sf:#101420; --sf2:#171d2e; --sf3:#1e2538;
  --bd:#22293d; --bd2:#2a3350;
  --ac:#00d4ff; --ac2:#ff4c6a; --ac3:#ffd700; --ac4:#b066ff;
  --gn:#00e676; --rd:#ff4c6a;
  --tx:#e8eaf0; --tx2:#7a8499; --tx3:#3e4a66;
  --r:10px; --fh:'Bebas Neue','Impact',sans-serif; --fb:'Noto Sans JP',sans-serif;

  /* ── SCALE TOKENS (Phase D-1: 定義のみ。既存の生値参照はまだ不変＝挙動neutral。
        置換は D-2 で判定③にかけながら段階適用) ── */
  --fs-1:10px; --fs-2:12px; --fs-3:14px; --fs-4:16px; --fs-5:20px; --fs-6:28px;   /* 9-32px の19段を6段へ。11/12→--fs-2 が主力(468回) */
  --r-xs:4px; --r-sm:7px; --r-lg:14px; --r-pill:999px;                            /* --r:10px が中(=既存)。6/7px の膿は --r-sm へ */
  --sp-1:4px; --sp-tight:6px; --sp-2:8px; --sp-3:12px; --sp-4:16px; --sp-5:20px; --sp-6:28px; /* 4pxグリッド。6pxは密チップ用の公認例外 */

  /* 固定アクションバー #re-abar が占有する高さ。.sb の下余白と toast の退避先はこの1値を参照
     （旧: 88px と 96px が別々に散在＝隠れた依存。ここに単一ソース化） */
  --abar-h:88px;

  /* チーム名縁取り色（既定＝ダーク：白の縁取り）。data-theme=light で黒縁へ上書き。
     ぼかし(0 0 Npx)は「ぼんやり」の原因になるため、クッキリした0ぼかしの実線縁取りにする。 */
  --tname-o:rgba(255,255,255,.95);
  /* 8方向1pxの実線アウトライン（グロー無し＝任意のチーム色を背景からクッキリ分離） */
  --tname-outline:
    -1px -1px 0 var(--tname-o), 1px -1px 0 var(--tname-o),
    -1px  1px 0 var(--tname-o), 1px  1px 0 var(--tname-o),
     0  -1px 0 var(--tname-o),  0  1px 0 var(--tname-o),
    -1px  0  0 var(--tname-o),  1px  0  0 var(--tname-o);
}
/* チーム色スウォッチ(□)のフチ色。中間グレーで、白チーム/黒チームどちらの塗りでも四角が見える。 */
:root{ --sw-edge:rgba(140,140,140,.6); }
/* チーム名ユーティリティ：任意のチーム色を背景からクッキリ分離して可読化（実線縁取り） */
.tname,
.roster-team-name,   /* ロースターのチーム名（色付き） */
.podium-name{ text-shadow: var(--tname-outline); }

/* ── LIGHT THEME（端末ごとの表示設定。data-theme="light" で有効化）──
   色の大半は上の変数駆動なので、ここでサーフェス/テキスト/枠とアクセントを差し替えるだけで
   ライト化できる。アクセント色は白背景で可読になるよう暗めに寄せる（ボタン上の #000 文字は据え置きで可）。 */
:root[data-theme="light"]{
  --bg:#eef1f6; --sf:#ffffff; --sf2:#f2f5fa; --sf3:#e6ebf3;
  --bd:#d3dae6; --bd2:#bcc6d8;
  --ac:#0089b3; --ac2:#e6394f; --ac3:#b8860b; --ac4:#8844cc;
  --gn:#00a854; --rd:#d32f4a;
  --tx:#1a1f2b; --tx2:#5a6478; --tx3:#9aa4b8;
}
/* チーム名の縁取り色（任意のチーム色でも背景とクッキリ分離＝可読に）。
   ダーク=白の実線縁（明るいチーム色でも黒系でも分離）／ライト=黒の実線縁（白系チーム色対策）。 */
:root[data-theme="light"]{ --tname-o:rgba(0,0,0,.82); }
/* グリッド背景：暗線に反転（ライトでは薄いグレー格子） */
:root[data-theme="light"] .grid-bg{
  background:
    repeating-linear-gradient(0deg,transparent,transparent 44px,rgba(20,30,50,.04) 44px,rgba(20,30,50,.04) 45px),
    repeating-linear-gradient(90deg,transparent,transparent 44px,rgba(20,30,50,.04) 44px,rgba(20,30,50,.04) 45px);
}
/* TOP画面の暗いラジアルグロー→ライト用の淡いグロー */
:root[data-theme="light"] #top-screen{ background:radial-gradient(ellipse at 50% -10%,#d8e6ff 0%,transparent 60%); }
/* ロゴのネオングロー抑制（白背景では滲むため弱める） */
:root[data-theme="light"] .logo{ text-shadow:0 1px 2px rgba(0,0,0,.12); }
/* スコアボード：白オーバーレイのカード地を、ライトでは暗オーバーレイへ反転（白地で消えないよう） */
:root[data-theme="light"] .sb-card.tone-panel{ background:rgba(20,30,50,.05); border-color:rgba(20,30,50,.12); }
:root[data-theme="light"] .sb-card.tone-dim{ background:rgba(20,30,50,.035); border-color:rgba(20,30,50,.1); }
:root[data-theme="light"] #sb-updated{ color:rgba(0,0,0,.35)!important; }

*{box-sizing:border-box;margin:0;padding:0;-webkit-tap-highlight-color:transparent;}
body{background:var(--bg);color:var(--tx);font-family:var(--fb);min-height:100dvh;overflow-x:hidden;}

/* ── GRID BG ── */
.grid-bg{
  position:fixed;inset:0;pointer-events:none;z-index:0;
  background:
    repeating-linear-gradient(0deg,transparent,transparent 44px,rgba(0,212,255,.025) 44px,rgba(0,212,255,.025) 45px),
    repeating-linear-gradient(90deg,transparent,transparent 44px,rgba(0,212,255,.025) 44px,rgba(0,212,255,.025) 45px);
}

/* ── TOP ── */
#top-screen{
  min-height:100dvh;display:flex;flex-direction:column;align-items:center;
  justify-content:center;padding:28px;position:relative;z-index:1;
  background:radial-gradient(ellipse at 50% -10%,#0d2248 0%,transparent 65%);
}
.logo{font-family:var(--fh);font-size:clamp(40px,12vw,72px);letter-spacing:7px;color:var(--ac);
  text-shadow:0 0 40px rgba(0,212,255,.45),0 0 80px rgba(0,212,255,.2);line-height:1;text-align:center;}
.logo-sub{font-size:10px;letter-spacing:5px;color:var(--tx2);text-align:center;margin-top:5px;margin-bottom:44px;}

/* ID入力エリア */
.id-entry-box{width:100%;max-width:360px;background:var(--sf);border:1px solid var(--bd);border-radius:var(--r);padding:20px;display:flex;flex-direction:column;gap:12px;}
.id-entry-label{font-size:11px;letter-spacing:2px;color:var(--tx2);font-weight:700;}
.id-row{display:flex;gap:8px;}
.id-input{flex:1;background:var(--sf2);border:1px solid var(--bd);border-radius:7px;padding:11px 14px;
  color:var(--ac);font-size:18px;font-family:monospace;letter-spacing:4px;outline:none;text-transform:uppercase;}
.id-input:focus{border-color:var(--ac);}
.id-input::placeholder{color:var(--tx3);letter-spacing:2px;font-size:14px;}
.id-go{background:var(--ac);border:none;border-radius:7px;padding:11px 18px;color:#000;font-size:18px;font-weight:800;cursor:pointer;}
.id-go:active{background:#009ab8;}
.id-hint{font-size:11px;color:var(--tx2);}

/* ロール選択 */
#role-screen{
  min-height:100dvh;display:none;flex-direction:column;align-items:center;
  justify-content:center;padding:24px;position:relative;z-index:1;
}
.role-header{text-align:center;margin-bottom:32px;}
.role-header-id{font-family:monospace;font-size:22px;letter-spacing:4px;color:var(--ac);}
.role-header-sub{font-size:12px;color:var(--tx2);margin-top:4px;}
.role-cards{display:flex;flex-direction:column;gap:11px;width:100%;max-width:340px;}
.rc-card{background:var(--sf);border:1px solid var(--bd);border-radius:var(--r);padding:17px 20px;
  cursor:pointer;display:flex;align-items:center;gap:14px;transition:border-color .18s,transform .12s;position:relative;overflow:hidden;}
.rc-card::after{content:'';position:absolute;inset:0;opacity:0;transition:opacity .18s;}
.rc-card:active{transform:scale(.97);}
.rc-card.pl{border-left:3px solid var(--gn);}
.rc-card.pl::after{background:radial-gradient(ellipse at left,rgba(0,230,118,.1),transparent 70%);}
.rc-card.re{border-left:3px solid var(--ac);}
.rc-card.re::after{background:radial-gradient(ellipse at left,rgba(0,212,255,.1),transparent 70%);}
.rc-card.ad{border-left:3px solid var(--ac3);}
.rc-card.ad::after{background:radial-gradient(ellipse at left,rgba(255,215,0,.1),transparent 70%);}
.rc-card:active::after{opacity:1;}
.rc-icon{font-size:28px;flex-shrink:0;}
.rc-name{font-size:16px;font-weight:700;}
.rc-desc{font-size:11px;color:var(--tx2);margin-top:2px;}
.rc-card.pl .rc-name{color:var(--gn);}
.rc-card.re .rc-name{color:var(--ac);}
.rc-card.ad .rc-name{color:var(--ac3);}
.rc-pin-badge{font-size:10px;padding:2px 7px;border-radius:10px;border:1px solid currentColor;font-weight:700;flex-shrink:0;}
.rc-card.re .rc-pin-badge{color:var(--ac);}
.rc-card.ad .rc-pin-badge{color:var(--ac3);}
.back-top{margin-top:20px;background:none;border:1px solid var(--bd);color:var(--tx2);padding:8px 18px;border-radius:6px;cursor:pointer;font-size:13px;}

/* ── SCREEN ── */
.screen{display:none;min-height:100dvh;flex-direction:column;position:relative;z-index:1;}
.screen.active{display:flex;}
.sh{background:var(--sf);border-bottom:1px solid var(--bd);padding:10px 14px;display:flex;align-items:center;gap:10px;flex-shrink:0;position:sticky;top:0;z-index:100;}
.bk{background:none;border:1px solid var(--bd);color:var(--tx2);padding:5px 10px;border-radius:6px;cursor:pointer;font-size:12px;flex-shrink:0;}
.bk:active{background:var(--bd);}
.sh-title{font-family:var(--fh);letter-spacing:2px;font-size:17px;flex:1;}
.sh-badge{font-size:10px;padding:2px 8px;border-radius:20px;font-weight:700;}
.pl-sc .sh-badge{background:rgba(0,230,118,.12);color:var(--gn);}
.re-sc .sh-badge{background:rgba(0,212,255,.12);color:var(--ac);}
.ad-sc .sh-badge{background:rgba(255,215,0,.12);color:var(--ac3);}
.sb{flex:1;overflow-y:auto;padding:13px;display:flex;flex-direction:column;gap:13px;padding-bottom:80px;}

/* 順位表 / フラッグの切り替えタブ。見出しを兼ねる */
.re-stab{background:none;border:1px solid transparent;border-radius:7px;cursor:pointer;
  font-family:inherit;font-size:11px;font-weight:700;letter-spacing:1px;
  color:var(--tx3);padding:6px 10px;min-height:32px;}
.re-stab.on{color:var(--tx);background:var(--sf2);border-color:var(--bd2);}
@media (hover:hover){ .re-stab:hover{color:var(--tx2);} }

/* ── Recorder 対戦表：バウト単位のグルーピング ──────────────
   同じ要素がモバイルRecorderとPC②進行の両方で使われる（wsMountLive が
   re-view-list を物理的に移設する）。JSに分岐を増やすと片方だけ壊れるので、
   幅の違いはコンテナクエリで吸収する。ビューポート幅ではなく要素自身の幅で
   切り替わるため、どこにマウントされても正しく効く。 */
#match-list-wrap{container-type:inline-size;}

/* バウトの枠。1バウト＝1かたまりであることが分かるよう、枠と左端の帯で囲う。
   以前は枠が細くて隣のバウトとの境目が読めなかった。 */
.re-bout{border:2px solid var(--bd2);border-left:5px solid var(--ac);border-radius:10px;
  margin-bottom:14px;background:var(--sf2);overflow:hidden;
  box-shadow:0 1px 0 rgba(0,0,0,.35);}
/* 完了バウトは全体を落とすが、右側の結果だけは落とさない（下の .re-bout-score 参照） */
.re-bout.done{background:var(--sf);border-color:var(--bd);border-left-color:var(--bd2);opacity:.62;}
.re-bout.closed{opacity:.45;}

.re-bout-h{display:flex;align-items:center;gap:9px;padding:12px 11px;cursor:pointer;}
.re-caret{flex-shrink:0;color:var(--tx3);font-size:12px;width:12px;}
.re-bout-main{flex:1;min-width:0;}
.re-bout-title{font-size:13px;font-weight:700;color:var(--tx2);letter-spacing:1px;}
.re-bout-count{font-size:10px;color:var(--tx3);margin-left:6px;letter-spacing:0;font-weight:400;}
.re-bout-teams{font-size:15px;font-weight:700;margin-top:2px;}
.re-vs{color:var(--tx3);font-size:12px;}
.re-bout-right{flex-shrink:0;text-align:right;}
.re-bout-state{font-size:11px;font-weight:700;color:var(--ac);}
.re-bout-state.ok{color:var(--tx3);font-weight:400;}
/* 1ゲーム＝1マス。畳んだままでも「何戦やって誰が取ったか」が分かる */
.re-pips{display:flex;gap:3px;justify-content:flex-end;margin-bottom:3px;}
.re-pip{width:11px;height:11px;border-radius:2px;border:1.5px solid var(--bd2);
  background:transparent;display:inline-block;}
.re-pip.draw{background:var(--tx3);border-color:var(--tx3);}
/* 完了バウトは枠ごと薄くしているので、結果はその分を打ち消して明確に出す */
.re-bout-score{font-size:14px;font-weight:800;margin-top:2px;line-height:1;}
.re-bout.done .re-bout-score{opacity:1.6;}
.re-dash{color:var(--tx3);margin:0 4px;font-weight:400;}
.re-draws{font-size:10px;color:var(--tx3);margin-left:5px;font-weight:400;}

/* 完了したバウトは1行に圧縮する。畳んでも見出しが2段あると、30バウト規模では
   それだけで画面2枚分を占め、次に記録する試合が遠いままになる。 */
.re-bout.done .re-bout-h{padding:8px 11px;}
.re-bout.done .re-bout-main{display:flex;align-items:baseline;gap:8px;min-width:0;}
.re-bout.done .re-bout-title{flex-shrink:0;}
.re-bout.done .re-bout-teams{font-size:12px;font-weight:600;margin-top:0;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.re-bout.done .re-vs{font-size:11px;}

.re-games{display:flex;flex-direction:column;}
/* 1戦＝1タップ対象。指で押す前提なので高さを確保する（旧UIの副次ボタンは
   31x29 しかなく、破壊的な削除がその2px隣にあった）。 */
.re-game{display:flex;flex-direction:column;border-top:1px solid var(--bd);}
/* 上段＝詳細画面への入口。下段＝インライン記録。当たり判定を視覚的に分ける。 */
.re-game-top{display:flex;align-items:center;gap:8px;padding:11px;cursor:pointer;min-height:52px;}
.re-game.done{color:var(--tx2);}
.re-game.undef{background:rgba(255,215,0,.05);}
.re-game-main{flex:1;min-width:0;}
.re-game-nth{font-size:13px;font-weight:700;}
.re-game.done .re-game-nth{font-weight:600;color:var(--tx2);}
.re-game-teams{font-size:14px;font-weight:700;margin-top:2px;}
.re-game-sub{font-size:11px;color:var(--tx3);margin-top:2px;}
.re-game-res{font-size:11px;color:var(--tx);margin-top:3px;}

/* 対戦表の上に出るイベント名の見出し。インラインで書くと、上部バーに同じ名前が
   出ている画面（運営画面）から CSS で消せない（インラインが勝つ）。 */
.re-ev-banner-name{display:flex;align-items:center;gap:8px;}

/* ── 順位表シート ─────────────────────────────────────
   順位表は一覧の先頭にあったが、対戦表を下へ送ると見えなくなり、見るたびに
   スクロール位置を失っていた。「上へ戻る」では位置が戻らないので、その場に
   重ねて出す。開いて閉じればスクロールは1pxも動かない。
   :hover を @media で囲うのは、囲まないとスマホの1タップ目がホバーに吸われ、
   click が2回目まで来ないことがあるため。 */
.re-stand-fab{position:fixed;right:14px;bottom:14px;z-index:60;
  display:inline-flex;align-items:center;gap:6px;max-width:60vw;
  padding:10px 14px;border-radius:22px;cursor:pointer;font-family:inherit;
  font-size:12px;font-weight:700;color:var(--tx);
  background:var(--sf);border:1px solid var(--ac);
  box-shadow:0 4px 14px rgba(0,0,0,.45);}
.re-stand-fab .lead{color:var(--tx2);font-weight:600;overflow:hidden;
  text-overflow:ellipsis;white-space:nowrap;}
.re-stand-fab:active{transform:scale(.97);}
@media (hover:hover){ .re-stand-fab:hover{background:var(--sf2);} }
/* 固定ボタンの下に何かが隠れないよう、一覧の器ごと下端を空ける。
   #match-list-wrap だけに余白を付けていたら、その外側にある
   「＋試合を追加」「🏁イベントを完了する」が隠れた。45試合の一覧で最下部まで送ると
   完了ボタンの右側が押せなくなる。器（re-view-list）に付ければ最後の要素まで守れる。
   スクロールできる余地を作るのが目的なので、ボタン高さ＋余裕をとる。 */
#re-view-list{padding-bottom:84px;}

.re-stand-sheet{position:fixed;inset:0;z-index:61;display:none;
  background:rgba(0,0,0,.55);align-items:flex-end;justify-content:center;}
.re-stand-sheet.on{display:flex;}
.re-stand-panel{width:100%;max-width:640px;max-height:82vh;overflow:auto;
  background:var(--sf);border:1px solid var(--bd);border-radius:14px 14px 0 0;
  padding:14px 14px 20px;}
.re-stand-head{display:flex;align-items:center;gap:8px;margin-bottom:8px;}
.re-stand-head .t{font-size:13px;font-weight:800;}
.re-stand-close{margin-left:auto;background:none;border:none;color:var(--tx2);
  font-size:20px;line-height:1;cursor:pointer;padding:2px 6px;font-family:inherit;}
/* 広い画面では下から出すより中央のほうが視線移動が小さい */
@media (min-width:700px){
  .re-stand-sheet{align-items:center;}
  .re-stand-panel{border-radius:14px;max-height:78vh;}
}

/* 検索結果の1行＝1アクション（追加）。行に他の操作が無いので、行全体を押せるようにする。
   右端の小さなボタンを狙う必要がなくなる（指だと外しやすく、10人続けて足すと効いてくる）。
   「＋ 追加」の印は残す。的ではなく目印で、消すと押せることが分からなくなる。
   :hover を @media で囲むのは、囲まないとスマホの1タップ目がホバー扱いで吸われ、
   click が2回目まで来ないことがあるため（実際に「一度押しただけでは入れない」が出た）。 */
.pick-row{display:flex;align-items:center;gap:8px;width:100%;text-align:left;
  padding:9px 10px;margin-bottom:4px;background:var(--sf2);border:1px solid transparent;
  border-radius:8px;color:var(--tx);font-family:inherit;font-size:12px;cursor:pointer;}
.pick-row:active{transform:scale(.99);}
@media (hover:hover){ .pick-row:hover{border-color:var(--ac);background:var(--sf);} }
/* 登録済みは不活性。押すと外れる形にすると、誤タップがそのまま破壊的操作になる */
.pick-row.is-in{opacity:.5;cursor:default;}
.pick-row.is-in:active{transform:none;}
@media (hover:hover){ .pick-row.is-in:hover{border-color:transparent;background:var(--sf2);} }
.pick-row-main{flex:1;min-width:0;}
.pick-row-name{font-size:12px;font-weight:600;}
.pick-row-sub{font-size:10px;color:var(--tx2);}
.pick-row-act{flex:none;font-size:11px;font-weight:700;color:var(--ac);white-space:nowrap;}
.pick-row.is-in .pick-row-act{color:var(--gn);}

/* ③結果でその試合の編成を開いたときの中身。上の行と地続きに見えないよう
   内側に一段落とす（記録用のインライン操作と同じ余白に揃える）。 */
.re-game-roster{padding:0 11px 11px;border-top:1px dashed var(--bd);margin-top:-1px;padding-top:9px;}

/* インライン記録。指で押す前提なので高さ38px以上を確保し、横は等分に伸ばす。
   PC②進行では1戦あたり384pxまで狭まるので、折り返せるようにしておく。 */
.re-game-ops{display:flex;flex-wrap:wrap;align-items:center;gap:6px;
  padding:0 11px 11px;}
.re-op{flex:1 1 auto;min-height:38px;padding:8px 10px;border-radius:7px;cursor:pointer;
  font-family:inherit;font-size:12px;font-weight:700;
  background:var(--sf);border:1px solid var(--bd2);color:var(--tx);}
/* チーム色は枠と左の色玉だけ。文字までチーム色にすると暗い/薄いチームで読めない */
.re-op.win{display:flex;align-items:center;justify-content:center;gap:6px;}
.re-op-dot{width:10px;height:10px;border-radius:2px;flex-shrink:0;display:inline-block;}
.re-op.draw{flex:0 1 auto;}
.re-op.foul{border-color:var(--ac3);}
.re-op.more{flex:0 0 auto;min-width:44px;color:var(--tx2);}
.re-op.ghost{flex:0 0 auto;background:none;border-color:var(--bd);color:var(--tx3);}
.re-op:active{background:var(--bd);}
@media (hover:hover){ .re-op:hover{background:var(--sf2);} }
/* 取りやめ。赤い●に×で、記録用のボタンと明確に区別する */
.re-op-cancel{flex:0 0 auto;width:38px;height:38px;border-radius:50%;cursor:pointer;
  background:var(--rd,#ff3b3b);border:none;color:#fff;font-size:15px;font-weight:800;
  font-family:inherit;line-height:1;display:flex;align-items:center;justify-content:center;}
.re-op-cancel:active{filter:brightness(.85);}
.re-op-lab{flex:0 0 auto;font-size:11px;color:var(--tx2);font-weight:700;}
.re-flag-sel{flex:1 1 140px;min-height:38px;padding:8px;border-radius:7px;
  background:var(--sf);border:1px solid var(--ac);color:var(--tx);
  font-family:inherit;font-size:12px;}

.re-add{width:100%;padding:11px;background:none;border:none;border-top:1px dashed var(--bd);
  color:var(--ac);font-size:12px;font-weight:700;cursor:pointer;font-family:inherit;}
.re-add:active{background:var(--bd);}
@media (hover:hover){ .re-add:hover{background:var(--sf);} }

/* 広いとき（PC②進行）は1バウトの各戦を横に並べる。縦積みのまま引き伸ばすと
   1155px を持て余す。 */
@container (min-width:700px){
  .re-games{flex-direction:row;flex-wrap:wrap;}
  .re-game{flex:1 1 220px;border-top:1px solid var(--bd);border-left:1px solid var(--bd);}
  .re-game:first-child{border-left:none;}
}

/* Recorder：担当イベントの選択ボタン。
   ホバー演出を JS の onmouseover で当てていたが、スマホでは1回目のタップが
   ホバー扱いで吸われ click が2回目まで来ないことがある（「一度押しただけでは
   入れない」の原因）。CSS に寄せたうえで @media (hover:hover) で囲い、
   タッチ端末はホバー状態に入らないようにする。押した手応えは :active で出す。 */
.re-ev-pick{width:100%;padding:14px 16px;margin-bottom:8px;background:var(--sf2);
  border:2px solid var(--bd);border-radius:10px;color:var(--tx);
  text-align:left;cursor:pointer;font-family:inherit;}
.re-ev-pick:active{border-color:var(--ac);background:var(--bd);}
@media (hover:hover){ .re-ev-pick:hover{border-color:var(--ac);} }

/* ── SETUP ── */
#setup-screen{
  min-height:100dvh;display:none;flex-direction:column;align-items:center;justify-content:center;
  padding:24px;position:relative;z-index:1;
  background:radial-gradient(ellipse at 50% 0%,#1a1030 0%,transparent 60%);
}
.setup-box{background:var(--sf);border:1px solid var(--ac4);border-radius:var(--r);padding:24px;max-width:360px;width:100%;display:flex;flex-direction:column;gap:16px;}
.setup-title{font-family:var(--fh);font-size:28px;letter-spacing:3px;color:var(--ac4);text-align:center;}
.setup-desc{font-size:12px;color:var(--tx2);text-align:center;line-height:1.6;}
.setup-field{display:flex;flex-direction:column;gap:6px;}
.setup-label{font-size:11px;letter-spacing:2px;color:var(--tx2);font-weight:700;}
.setup-input{background:var(--sf2);border:1px solid var(--bd);border-radius:7px;padding:11px 13px;color:var(--tx);font-size:16px;outline:none;width:100%;font-family:monospace;letter-spacing:3px;}
.setup-input:focus{border-color:var(--ac4);}
.setup-btn{width:100%;padding:13px;background:var(--ac4);border:none;border-radius:8px;color:#fff;font-size:15px;font-weight:700;cursor:pointer;}
.setup-btn:active{background:#8844cc;}

/* PINモーダル一式（#pin-modal / .pin-box / .numpad 等）は削除した。
   「ログインIDのadmin権限のみで入室（PIN廃止）」(js/01-core.js gateToPcAdmin) の後、
   対応する <div id="pin-modal"> がHTMLから既に無く、js/・index.html のどこからも
   参照されていない完全な死んだCSSだった。 */

/* ── PC ADMIN: 共通モーダル ──
   単独オーバーレイモーダル共通。以前は13個中10個がこの見た目を個別にインライン複製し、
   背景の濃さ(.78/.85)・余白(20px/16px)・z-index(450〜700)がばらけていた。
   z-indexが割れていたのは意味があってのことではない ── 呼び出し元を全件確認したが、
   このアプリのモーダルは互いに重ねて開かれることが無い（1つ開く前に必ず前のものを
   閉じている）。なので段は1つで足りる。将来、確認ダイアログ等を既に開いている
   モーダルの上に出す必要が出たら --z-modal-top を使う（今は未使用）。
   表示/非表示はこれまでどおり各画面のJSが el.style.display='flex'/'none' で切り替える
   （インラインstyleはCSSクラスより優先されるので、ここでは既定値=非表示だけを持つ）。
   qr-modal は別方式（.open クラス切替）で既に重複が無いので対象外。 */
:root{ --z-modal:600; --z-modal-top:700; }
.modal{
  position:fixed;inset:0;background:rgba(0,0,0,.78);z-index:var(--z-modal);
  display:none;align-items:center;justify-content:center;padding:20px;
}

/* ── CARD ── */
.card{background:var(--sf);border:1px solid var(--bd);border-radius:var(--r);overflow:hidden;}
.ch{padding:9px 13px;font-size:11px;font-weight:700;letter-spacing:2px;color:var(--tx2);border-bottom:1px solid var(--bd);display:flex;align-items:center;justify-content:space-between;}
.cb{padding:13px;}

/* ── STOPWATCH ── */
.sw-time{font-family:var(--fh);font-size:clamp(58px,19vw,90px);letter-spacing:4px;line-height:1;text-align:center;padding:16px 0 6px;transition:color .3s;}
.sw-time.warn{color:var(--ac3);}
.sw-time.danger{color:var(--rd);animation:swp .44s ease infinite alternate;}
@keyframes swp{from{opacity:1}to{opacity:.35}}
.sw-prog{height:5px;background:var(--bd);margin:0 13px 9px;border-radius:3px;overflow:hidden;}
.sw-bar{height:100%;border-radius:3px;transition:width .95s linear,background .3s;}
.sw-bar.ok{background:var(--ac);}
.sw-bar.warn{background:var(--ac3);}
.sw-bar.danger{background:var(--rd);}
.sw-cues{display:flex;flex-wrap:wrap;gap:5px;padding:0 13px 9px;}
.cue{font-size:10px;padding:2px 7px;border-radius:12px;background:var(--sf2);border:1px solid var(--bd);color:var(--tx3);}
.cue.done{background:rgba(0,230,118,.07);border-color:var(--gn);color:var(--gn);}
.sw-btns{display:flex;gap:8px;padding:0 13px 13px;}
.swb{flex:1;padding:13px;border:none;border-radius:8px;font-size:14px;font-weight:700;cursor:pointer;transition:all .12s;}
.swb:active{transform:scale(.96);}
.swb.st{background:var(--gn);color:#000;}
.swb.pa{background:var(--ac3);color:#000;}
.swb.rs{background:var(--sf2);color:var(--tx);border:1px solid var(--bd);}
.sw-dur{background:var(--sf2);border:1px solid var(--bd);color:var(--tx);padding:4px 7px;border-radius:5px;font-size:12px;}

/* ── MATCH ── */
.match-item{background:var(--sf2);border:1px solid var(--bd);border-radius:8px;padding:11px 13px;
  cursor:pointer;display:flex;align-items:center;justify-content:space-between;transition:border-color .15s;margin-bottom:7px;}
.match-item:last-child{margin-bottom:0;}
.match-item.sel{border-color:var(--ac);background:rgba(0,212,255,.05);}
.match-item.done{opacity:.42;cursor:default;}
.match-round{font-size:10px;color:var(--tx2);letter-spacing:1px;}
.match-teams{font-size:15px;font-weight:700;margin-top:2px;}
.match-ok{font-size:11px;color:var(--gn);margin-top:3px;}

/* ── RESULT ── */
.sec-lbl{font-size:10px;letter-spacing:2px;color:var(--tx2);font-weight:700;margin-bottom:6px;}
.team-pick{display:grid;grid-template-columns:1fr 1fr;gap:9px;}
.t-btn{padding:16px 8px;border-radius:8px;border:2px solid var(--bd);background:var(--sf2);color:var(--tx);
  font-size:14px;font-weight:700;cursor:pointer;text-align:center;transition:all .14s;}
.t-btn:active{transform:scale(.97);}
.t-btn.wt1{border-color:var(--ac);background:rgba(0,212,255,.22);color:var(--ac);font-weight:800;box-shadow:0 0 0 2px var(--ac) inset,0 0 14px rgba(0,212,255,.45);}
.t-btn.wt2{border-color:var(--ac2);background:rgba(255,76,106,.22);color:var(--ac2);font-weight:800;box-shadow:0 0 0 2px var(--ac2) inset,0 0 14px rgba(255,76,106,.45);}
.pnum-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:5px;}
.pnum{border-radius:7px;border:1px solid var(--bd);background:var(--sf2);color:var(--tx);
  padding:6px 4px 5px;cursor:pointer;display:flex;align-items:center;justify-content:center;
  flex-direction:column;gap:2px;transition:all .11s;min-height:52px;}
.pnum:active{transform:scale(.93);}
.pnum.sel{border-color:var(--ac3);background:rgba(255,215,0,.11);}
.pnum.nf{color:var(--tx2);}
.pnum-bib{font-size:11px;font-weight:700;line-height:1;opacity:.7;}
.pnum-nick{font-size:13px;font-weight:700;color:var(--tx);overflow:hidden;max-width:100%;text-align:center;
  white-space:nowrap;text-overflow:ellipsis;padding:0 3px;line-height:1.2;}
.pnum.sel .pnum-bib{opacity:1;color:var(--ac3);}
.pnum.sel .pnum-nick{color:var(--ac3);}
.pnum.nf .pnum-nick{color:var(--tx2);font-size:16px;}
/* ── FLAG LIST VIEW ── */
.flag-list-item{display:flex;align-items:center;gap:10px;padding:10px 0;border-bottom:1px solid var(--bd);}
.flag-list-item:last-child{border-bottom:none;}
.flag-rank{font-family:var(--fh);font-size:22px;width:28px;text-align:center;color:var(--tx3);flex-shrink:0;}
.flag-rank.g1{color:var(--ac3);}
.flag-rank.g2{color:#c0c0c0;}
.flag-rank.g3{color:#cd7f32;}
.flag-info{flex:1;}
.flag-name{font-size:14px;font-weight:700;}
.flag-detail{font-size:11px;color:var(--tx2);margin-top:2px;}
.flag-count{font-family:var(--fh);font-size:26px;color:var(--ac3);}
/* ── CLOSING ── */
.closing-podium{display:flex;align-items:flex-end;justify-content:center;gap:8px;padding:16px 0;}
.podium-col{display:flex;flex-direction:column;align-items:center;gap:6px;}
.podium-block{border-radius:6px 6px 0 0;display:flex;align-items:center;justify-content:center;font-family:var(--fh);font-size:28px;color:#000;}
.podium-rank{font-size:10px;letter-spacing:2px;color:var(--tx2);font-weight:700;}
.podium-name{font-size:14px;font-weight:700;text-align:center;max-width:80px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.podium-pts{font-size:11px;color:var(--tx2);}
.closing-section{background:var(--sf);border:1px solid var(--bd);border-radius:var(--r);overflow:hidden;margin-bottom:12px;}
.closing-section-head{padding:10px 14px;border-bottom:1px solid var(--bd);font-size:11px;font-weight:700;letter-spacing:2px;color:var(--tx2);display:flex;align-items:center;justify-content:space-between;}
.ig-card{background:#000;border-radius:12px;padding:20px;display:flex;flex-direction:column;gap:12px;max-width:400px;margin:0 auto;font-family:'Bebas Neue','Impact',sans-serif;}
.ig-title{font-size:28px;letter-spacing:4px;color:var(--ac);text-align:center;}
.ig-event{font-size:13px;color:var(--tx2);text-align:center;letter-spacing:2px;margin-top:-6px;}
.ig-podium{display:flex;justify-content:center;align-items:flex-end;gap:10px;padding:10px 0;}
.ig-p-col{display:flex;flex-direction:column;align-items:center;gap:4px;}
.ig-p-block{border-radius:4px 4px 0 0;display:flex;align-items:center;justify-content:center;font-size:24px;}
.ig-p-name{font-size:14px;font-weight:700;text-align:center;max-width:90px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.ig-p-pts{font-size:10px;color:#888;font-family:sans-serif;}
.ig-flags{border-top:1px solid #333;padding-top:10px;}
.ig-flags-title{font-size:12px;letter-spacing:3px;color:var(--ac3);margin-bottom:6px;}
.ig-flag-row{display:flex;justify-content:space-between;align-items:center;padding:3px 0;font-family:sans-serif;font-size:12px;}
.ig-footer{font-size:10px;color:#444;text-align:center;letter-spacing:2px;border-top:1px solid #222;padding-top:8px;}
.ts-toggle{display:flex;align-items:center;gap:10px;padding:12px 14px;}
.ts-toggle-label{flex:1;font-size:13px;}
.ts-toggle-sub{font-size:11px;color:var(--tx2);margin-top:2px;}
.toggle-sw{position:relative;width:44px;height:24px;flex-shrink:0;}
.toggle-sw input{opacity:0;width:0;height:0;}
.toggle-sw .slider{position:absolute;cursor:pointer;inset:0;background:var(--bd);border-radius:24px;transition:.3s;}
.toggle-sw .slider::before{content:'';position:absolute;width:18px;height:18px;left:3px;bottom:3px;background:#fff;border-radius:50%;transition:.3s;}
.toggle-sw input:checked+.slider{background:var(--ac);}
.toggle-sw input:checked+.slider::before{transform:translateX(20px);}
.sort-tabs{display:flex;gap:5px;margin-bottom:10px;}
.sort-tab{font-size:11px;padding:5px 11px;border-radius:12px;border:1px solid var(--bd);
  background:var(--sf2);color:var(--tx2);cursor:pointer;transition:all .15s;}
.sort-tab.active{background:var(--ac3);color:#000;border-color:var(--ac3);}
.sub-btn{width:100%;padding:14px;background:var(--ac);border:none;border-radius:8px;color:#000;
  font-size:15px;font-weight:700;cursor:pointer;transition:all .12s;letter-spacing:1px;}
.sub-btn:active{transform:scale(.98);}
.sub-btn:disabled{background:var(--bd);color:var(--tx3);cursor:not-allowed;}

/* ── PLAYER PROFILE ── */
.pid-secret{font-family:var(--fh);font-size:36px;letter-spacing:6px;color:var(--ac);text-shadow:0 0 18px rgba(0,212,255,.35);}
.stat-row{display:flex;justify-content:space-between;align-items:center;padding:8px 0;border-bottom:1px solid var(--bd);font-size:13px;}
.stat-row:last-child{border-bottom:none;}
.sl{color:var(--tx2);}
.sv{font-weight:700;}
.ti{background:var(--sf2);border:1px solid var(--bd);border-radius:7px;padding:10px 12px;color:var(--tx);font-size:14px;outline:none;width:100%;}
.ti:focus{border-color:var(--ac);}
.er{display:flex;gap:8px;}
.ib{border:none;border-radius:7px;padding:10px 15px;font-size:17px;cursor:pointer;font-weight:700;flex-shrink:0;}
.ib.cy{background:var(--ac);color:#000;}
.ib.gn{background:var(--gn);color:#000;}

/* ── ADMIN ── */
.tabs{display:flex;background:var(--sf);border-radius:var(--r);padding:4px;gap:3px;}
.tab-btn{flex:1;padding:8px 3px;border-radius:6px;border:none;background:transparent;color:var(--tx2);font-size:11px;font-weight:700;cursor:pointer;transition:all .18s;}
.tab-btn.active{background:var(--sf2);color:var(--tx);}
.ptable{width:100%;border-collapse:collapse;font-size:12px;}
.ptable th{padding:6px 7px;border-bottom:1px solid var(--bd);color:var(--tx2);font-weight:700;letter-spacing:1px;text-align:left;}
.ptable td{padding:8px 7px;border-bottom:1px solid var(--bd);}
.ptable tr:last-child td{border-bottom:none;}
.sec-code{font-family:monospace;font-size:13px;color:var(--ac);letter-spacing:2px;}
.csv-drop{border:2px dashed var(--bd);border-radius:var(--r);padding:20px;text-align:center;color:var(--tx2);font-size:12px;cursor:pointer;transition:all .2s;}
.csv-drop:hover{border-color:var(--ac);color:var(--ac);}
.role-tag{font-size:10px;padding:2px 6px;border-radius:10px;border:1px solid currentColor;font-weight:700;margin-left:3px;}
.role-tag.re{color:var(--ac);}
.role-tag.ad{color:var(--ac3);}

/* ── RATING ── */
.r-item{background:var(--sf);border:1px solid var(--bd);border-radius:8px;padding:11px 13px;display:flex;align-items:center;gap:11px;margin-bottom:7px;}
.r-item:last-child{margin-bottom:0;}
.rn{font-family:var(--fh);font-size:24px;width:30px;text-align:center;color:var(--tx3);flex-shrink:0;}
.rn.g1{color:var(--ac3);}
.rn.g2{color:#c0c0c0;}
.rn.g3{color:#cd7f32;}
.r-info{flex:1;}
.r-name{font-size:14px;font-weight:700;}
.r-detail{font-size:10px;color:var(--tx2);margin-top:2px;}
.r-score{text-align:right;}
.r-mu{font-family:var(--fh);font-size:22px;color:var(--ac);}
.r-bar-bg{height:3px;background:var(--bd);border-radius:2px;margin-top:4px;width:65px;}
.r-bar-fg{height:100%;background:var(--ac);border-radius:2px;}

/* ── QR MODAL ── */
#qr-modal{position:fixed;inset:0;background:rgba(0,0,0,.85);z-index:400;display:none;align-items:center;justify-content:center;padding:20px;}
#qr-modal.open{display:flex;}
.qr-box{background:var(--sf);border:1px solid var(--bd);border-radius:14px;padding:22px;max-width:310px;width:100%;display:flex;flex-direction:column;align-items:center;gap:12px;}
.qr-title{font-family:var(--fh);font-size:20px;letter-spacing:2px;color:var(--ac);}
#qr-wrap{background:#fff;padding:10px;border-radius:8px;}
.qr-info{text-align:center;font-size:12px;color:var(--tx2);}
.qr-info strong{color:var(--tx);display:block;font-size:15px;margin-bottom:3px;}
.url-disp{background:var(--sf2);border:1px solid var(--bd);border-radius:6px;padding:7px 9px;font-size:10px;color:var(--tx2);word-break:break-all;font-family:monospace;width:100%;}
.qr-close{width:100%;padding:10px;background:none;border:1px solid var(--bd);border-radius:7px;color:var(--tx);font-size:13px;cursor:pointer;}

/* ── SETUP COMPLETE ── */
#setup-done-screen{
  min-height:100dvh;display:none;flex-direction:column;align-items:center;justify-content:center;
  padding:28px;position:relative;z-index:1;
  background:radial-gradient(ellipse at 50% 0%,#0a2a1a 0%,transparent 60%);
}
.done-box{background:var(--sf);border:1px solid var(--gn);border-radius:var(--r);padding:28px 22px;max-width:360px;width:100%;display:flex;flex-direction:column;align-items:center;gap:18px;}
.done-icon{font-size:48px;}
.done-title{font-family:var(--fh);font-size:26px;letter-spacing:3px;color:var(--gn);text-align:center;}
.done-desc{font-size:12px;color:var(--tx2);text-align:center;line-height:1.7;}
.done-id-label{font-size:10px;letter-spacing:3px;color:var(--tx2);font-weight:700;}
.done-id{font-family:monospace;font-size:36px;letter-spacing:8px;color:var(--ac);
  text-shadow:0 0 20px rgba(0,212,255,.4);background:var(--sf2);border:1px solid var(--bd);
  border-radius:8px;padding:14px 20px;text-align:center;width:100%;cursor:pointer;user-select:all;}
.done-id:active{background:var(--bd);}
.done-qr-wrap{background:#fff;padding:10px;border-radius:8px;}
.done-warn{font-size:11px;color:var(--ac3);text-align:center;line-height:1.6;
  background:rgba(255,215,0,.07);border:1px solid rgba(255,215,0,.2);border-radius:6px;padding:10px 12px;width:100%;}
.done-go{width:100%;padding:14px;background:var(--gn);border:none;border-radius:8px;
  color:#000;font-size:15px;font-weight:700;cursor:pointer;}
.done-go:active{background:#00b854;}

/* ── UTILS ── */
.divider{height:1px;background:var(--bd);margin:6px 0;}
/* ── ROSTER PANEL ── */
.roster-panel{background:var(--sf);border:2px solid var(--bd);border-radius:10px;padding:10px;display:flex;flex-direction:column;gap:6px;}
.roster-panel.t1{border-color:rgba(0,212,255,.4);}
.roster-panel.t2{border-color:rgba(255,76,106,.4);}
.roster-team-name{font-family:var(--fh);font-size:16px;letter-spacing:1px;margin-bottom:4px;}
.roster-member{display:flex;align-items:center;gap:6px;padding:5px 7px;background:var(--sf2);border-radius:6px;border:1px solid var(--bd);}
.roster-bib{font-family:var(--fh);font-size:20px;color:var(--ac3);width:26px;text-align:center;flex-shrink:0;}
.roster-nick{font-size:12px;font-weight:600;flex:1;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;}
.roster-swap-btn{font-size:12px;padding:8px 10px;min-width:38px;min-height:34px;background:none;border:1px solid var(--bd);color:var(--tx2);border-radius:6px;cursor:pointer;flex-shrink:0;white-space:nowrap;line-height:1;}
.roster-swap-btn:active{background:var(--bd);}
.roster-add-btn{width:100%;padding:6px;background:none;border:1px dashed var(--bd);color:var(--tx2);border-radius:6px;cursor:pointer;font-size:11px;margin-top:2px;}
.roster-add-btn:active{border-color:var(--ac);color:var(--ac);}
/* ── MATCH HEADER ── */
.match-header-card{background:var(--sf);border-bottom:1px solid var(--bd);padding:14px 14px 10px;flex-shrink:0;}
.match-cur-label{font-size:10px;letter-spacing:2px;color:var(--tx2);font-weight:700;margin-bottom:4px;}
.match-cur-teams{display:flex;align-items:center;gap:8px;flex-wrap:wrap;}
.match-team-block{display:flex;align-items:center;gap:6px;}
.team-color-sq{width:14px;height:14px;border-radius:3px;flex-shrink:0;box-shadow:0 0 0 1px var(--sw-edge);}
.match-team-name{font-family:var(--fh);font-size:clamp(28px,8vw,44px);letter-spacing:2px;line-height:1;text-shadow:var(--tname-outline);}
.match-vs{font-size:16px;color:var(--tx3);font-weight:700;}
.match-round-tag{font-size:14px;padding:4px 12px;border-radius:12px;background:rgba(0,212,255,.12);color:var(--ac);border:1px solid rgba(0,212,255,.3);font-weight:700;letter-spacing:2px;display:inline-block;margin-bottom:4px;}
.next-match-row{display:flex;align-items:center;gap:6px;margin-top:8px;padding-top:7px;border-top:1px solid var(--bd);}
/* ════════════════════════════════
   PC ADMIN MODE
   ════════════════════════════════ */
body.pc-mode{display:flex;min-height:100vh;overflow:hidden;background:var(--bg);}
body.pc-mode #pc-sidebar{
  width:210px;flex-shrink:0;background:var(--sf);border-right:1px solid var(--bd);
  display:flex;flex-direction:column;height:100vh;position:sticky;top:0;overflow-y:auto;
}
body.pc-mode #pc-main{flex:1;overflow-y:auto;height:100vh;display:flex;flex-direction:column;}

/* ハンバーガーはデスクトップ幅では要らない（サイドバーが常時見えている）。
   狭い画面のときだけ @media 側で display:flex にする。 */
#pc-hamburger{
  display:none;flex-shrink:0;width:32px;height:32px;align-items:center;justify-content:center;
  background:var(--sf2);border:1px solid var(--bd);border-radius:7px;color:var(--tx);
  font-size:16px;cursor:pointer;
}
#pc-sb-backdrop{display:none;}

/* SIDEBAR */
.pc-sb-logo{padding:18px 14px 12px;border-bottom:1px solid var(--bd);}
.pc-sb-title{font-family:var(--fh);font-size:20px;letter-spacing:4px;color:var(--ac);
  text-shadow:0 0 16px rgba(0,212,255,.3);}
.pc-sb-sub{font-size:9px;letter-spacing:3px;color:var(--tx2);margin-top:2px;}
.pc-sb-badge{font-size:9px;background:rgba(176,102,255,.15);border:1px solid rgba(176,102,255,.4);
  color:var(--ac4);padding:2px 7px;border-radius:10px;margin-top:5px;display:inline-block;}
/* 版数（js/00-version.js）。PC間で食い違っていたら、そのPCが古い */
.pc-sb-ver{font-size:9px;color:var(--tx3);margin-top:6px;cursor:pointer;line-height:1.4;word-break:break-all;}
.pc-sb-ver:hover{color:var(--tx2);}
.pc-sb-sec{padding:10px 10px 3px;font-size:9px;letter-spacing:3px;color:var(--tx3);font-weight:700;}
.pc-nav-btn{display:flex;align-items:center;gap:8px;padding:9px 12px;border-radius:7px;cursor:pointer;
  color:var(--tx2);transition:all .15s;border:none;background:none;width:100%;text-align:left;font-size:12px;margin:1px 4px;width:calc(100% - 8px);}
.pc-nav-btn:hover{background:var(--sf2);color:var(--tx);}
.pc-nav-btn.active{background:rgba(0,212,255,.1);color:var(--ac);border:1px solid rgba(0,212,255,.2);}
.pc-nav-icon{width:18px;text-align:center;}
.pc-nav-badge{margin-left:auto;background:var(--ac2);color:#fff;font-size:9px;
  padding:1px 5px;border-radius:8px;font-weight:700;}
.pc-sb-footer{margin-top:auto;padding:10px;border-top:1px solid var(--bd);}
.pc-live-chip{padding:6px 10px;background:rgba(0,230,118,.08);border:1px solid rgba(0,230,118,.2);
  border-radius:7px;margin-bottom:8px;}
.pc-live-lbl{font-size:9px;letter-spacing:2px;color:var(--gn);}
.pc-live-name{font-size:11px;font-weight:700;margin-top:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}

/* TOPBAR */
#pc-topbar{height:50px;background:var(--sf);border-bottom:1px solid var(--bd);
  display:flex;align-items:center;padding:0 18px;gap:10px;flex-shrink:0;
  position:sticky;top:0;z-index:100;}
.pc-tb-title{font-size:14px;font-weight:700;flex:1;}
.pc-tb-btn{padding:6px 12px;border-radius:7px;border:1px solid var(--bd);
  background:var(--sf2);color:var(--tx);cursor:pointer;font-size:11px;transition:all .15s;}
.pc-tb-btn:hover{border-color:var(--ac);color:var(--ac);}

/* PC PANES */
#pc-content{padding:18px;flex:1;}
.pc-pane{display:none;}
.pc-pane.active{display:block;}
.pc-grid2{display:grid;grid-template-columns:1fr 1fr;gap:14px;}
.pc-grid3{display:grid;grid-template-columns:1fr 1fr 1fr;gap:14px;}
.pc-grid4{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;}
.pc-stat-card{background:var(--sf2);border:1px solid var(--bd);border-radius:8px;padding:12px 16px;}
.pc-stat-val{font-family:var(--fh);font-size:28px;letter-spacing:2px;color:var(--ac);}
.pc-stat-lbl{font-size:9px;letter-spacing:2px;color:var(--tx2);margin-top:2px;}
.pc-monitor-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:12px;}
.pc-monitor-card{background:var(--sf);border:1px solid var(--bd);border-radius:var(--r);
  padding:14px;transition:border-color .2s;}
.pc-monitor-card.live{border-color:rgba(0,230,118,.4);box-shadow:0 0 18px rgba(0,230,118,.05);}
.pc-table{width:100%;border-collapse:collapse;}
.pc-table th{padding:7px 12px;text-align:left;font-size:10px;letter-spacing:2px;
  color:var(--tx2);border-bottom:1px solid var(--bd);font-weight:700;white-space:nowrap;}
.pc-table td{padding:8px 12px;border-bottom:1px solid rgba(255,255,255,.04);font-size:12px;vertical-align:middle;}
.pc-table tr:hover td{background:rgba(255,255,255,.02);}
.pc-filter-bar{display:flex;gap:8px;flex-wrap:wrap;padding:10px 14px;border-bottom:1px solid var(--bd);align-items:center;}
.pc-fi{background:var(--sf2);border:1px solid var(--bd);border-radius:7px;
  padding:6px 10px;color:var(--tx);font-size:12px;outline:none;}
.pc-fi:focus{border-color:var(--ac);}
.pc-drag-row{display:flex;align-items:center;gap:10px;padding:8px 14px;
  border-bottom:1px solid var(--bd);transition:background .1s;}
.pc-drag-row:hover{background:var(--sf2);}
.pc-drag-handle{color:var(--tx3);cursor:grab;font-size:16px;flex-shrink:0;}
.pc-drag-handle:active{cursor:grabbing;}
.pc-drag-row.sortable-ghost{background:rgba(0,212,255,.08);border:1px dashed var(--ac);}

/* ── チーム編成タブ：プール ⇄ チームのドラッグ ──
   掴めるものと落とせる場所が見て分かることが要件。分からないと、
   そもそもドラッグできると気づいてもらえない。 */
.dft-chip{display:inline-flex;align-items:center;gap:4px;max-width:100%;
  padding:2px 7px;margin:2px;border-radius:11px;font-size:12px;line-height:1.5;
  border:1px solid var(--bd);background:var(--sf2);color:var(--tx);
  cursor:grab;user-select:none;white-space:nowrap;}
.dft-chip:active{cursor:grabbing;}
.dft-chip:hover{border-color:var(--ac);}
.dft-chip.pinned{font-weight:700;}
/* タップで運ぶとき（触る画面や、ドラッグが苦手なとき）の「持っている」状態 */
.dft-chip.carrying{outline:2px solid var(--ac);outline-offset:1px;
  box-shadow:0 0 10px rgba(0,212,255,.45);}
.dft-chip .dft-x{color:var(--tx3);cursor:pointer;font-size:11px;padding:0 1px;}
.dft-chip .dft-x:hover{color:#e66;}
/* 落とせる場所。運んでいる最中は全部を薄く光らせ、上に来たものだけ強く光らせる */
.dft-drop{transition:background .12s,border-color .12s,box-shadow .12s;}
.dft-drop.dft-armed{border-color:var(--ac)!important;}
.dft-drop.dft-over{border-color:var(--ac)!important;background:rgba(0,212,255,.12)!important;
  box-shadow:0 0 12px rgba(0,212,255,.3);}
.dft-pool{min-height:52px;max-height:190px;overflow-y:auto;
  border:1px dashed var(--bd);border-radius:8px;padding:5px;}
/* ゼッケン番号。狭いので数字だけが見えればよい（スピナーは場所を食うので消す） */
.dft-bib{flex:0 0 auto;width:30px;padding:1px 2px;font-size:11px;text-align:center;
  background:var(--sf2);border:1px solid var(--bd);border-radius:4px;color:var(--tx2);
  font-family:monospace;cursor:text;}
.dft-bib::-webkit-outer-spin-button,.dft-bib::-webkit-inner-spin-button{-webkit-appearance:none;margin:0;}
.dft-bib{-moz-appearance:textfield;appearance:textfield;}
.dft-bib:focus{border-color:var(--ac);color:var(--tx);outline:none;}
.dft-bib-set{color:var(--tx);border-color:var(--ac);font-weight:700;}   /* 人が指定した番号 */
.dft-bib-dup{border-color:#e66;color:#e66;font-weight:700;}             /* チーム内で重複 */

/* ── STANDINGS ── */
.standings-wrap{overflow-x:auto;}
.standings-table{width:100%;border-collapse:collapse;font-size:12px;white-space:nowrap;}
.standings-table th{padding:6px 8px;border-bottom:2px solid var(--bd);color:var(--tx2);font-weight:700;letter-spacing:1px;text-align:center;}
.standings-table th:first-child{text-align:left;}
.standings-table td{padding:7px 8px;border-bottom:1px solid var(--bd);text-align:center;}
.standings-table td:first-child{text-align:left;font-weight:700;}
.standings-table tr:last-child td{border-bottom:none;}
.standings-table .rank{color:var(--tx2);font-size:11px;width:20px;}
.standings-table .pts{color:var(--ac3);font-weight:700;font-size:14px;}
.standings-table .buch{color:var(--ac);font-size:11px;}
.result-extra-btns{display:flex;gap:7px;flex-wrap:nowrap;}
.draw-btn{flex:2;padding:12px 8px;border-radius:8px;border:2px solid var(--bd);background:var(--sf2);
  color:var(--tx2);font-size:13px;font-weight:700;cursor:pointer;transition:all .15s;}
.draw-btn.sel{border-color:var(--ac3);background:rgba(255,215,0,.22);color:var(--ac3);}
.draw-btn:active{transform:scale(.97);}
.foul-btn{flex:1;padding:8px 3px;border-radius:8px;border:2px solid var(--bd);background:var(--sf2);
  color:var(--tx2);font-size:10px;font-weight:700;cursor:pointer;transition:all .15s;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.foul-btn.sel{border-color:var(--rd);background:rgba(255,76,106,.22);color:var(--rd);}
.foul-btn:active{transform:scale(.97);}
.score-mode-tabs{display:flex;gap:5px;flex-wrap:wrap;}
.smt{font-size:11px;padding:5px 10px;border-radius:12px;border:1px solid var(--bd);
  background:var(--sf2);color:var(--tx2);cursor:pointer;transition:all .15s;}
.smt.active{background:var(--ac);color:#000;border-color:var(--ac);}
.next-label{font-size:10px;letter-spacing:1px;color:var(--tx3);font-weight:700;flex-shrink:0;}
.next-teams{font-size:13px;color:var(--tx2);display:flex;align-items:center;gap:5px;}
/* ── SKILL BADGE ── */
.skill-sel{display:flex;gap:5px;flex-wrap:wrap;margin-top:4px;}
.skill-btn{font-size:11px;padding:6px 13px;border-radius:12px;border:2px solid var(--bd);background:var(--sf2);color:var(--tx3);cursor:pointer;transition:all .15s;font-weight:500;}
.skill-btn:active{transform:scale(.95);}
.skill-btn.beg{border-color:rgba(100,181,246,.4);color:rgba(100,181,246,.6);}
.skill-btn.avg{border-color:rgba(255,215,0,.4);color:rgba(255,215,0,.6);}
.skill-btn.exp{border-color:rgba(255,112,67,.4);color:rgba(255,112,67,.6);}
.skill-btn.sel-beg{background:#64b5f6;border-color:#64b5f6;color:#000;font-weight:700;box-shadow:0 0 10px rgba(100,181,246,.5);}
.skill-btn.sel-avg{background:var(--ac3);border-color:var(--ac3);color:#000;font-weight:700;box-shadow:0 0 10px rgba(255,215,0,.5);}
.skill-btn.sel-exp{background:#ff7043;border-color:#ff7043;color:#fff;font-weight:700;box-shadow:0 0 10px rgba(255,112,67,.5);}
.chip{font-size:10px;padding:2px 7px;border-radius:12px;border:1px solid currentColor;font-weight:700;}
.chip.cy{color:var(--ac);}
.chip.gn{color:var(--gn);}
.chip.gd{color:var(--ac3);}
.chip.rd{color:var(--rd);}
#toast{position:fixed;bottom:16px;left:50%;transform:translateX(-50%) translateY(80px);background:var(--sf2);border:1px solid var(--bd);border-radius:20px;padding:8px 16px;font-size:13px;z-index:9999;transition:transform .28s;pointer-events:none;white-space:nowrap;}
#toast.show{transform:translateX(-50%) translateY(0);}
.vi{position:fixed;top:62px;right:13px;background:rgba(0,212,255,.92);color:#000;padding:5px 10px;border-radius:20px;font-size:12px;font-weight:700;z-index:200;opacity:0;transition:opacity .28s;pointer-events:none;}
.vi.show{opacity:1;}
select.ti{appearance:none;}

/* イベント運営ワークスペース フェーズナビ */
.ws-ph{font-size:13px;font-weight:700;padding:9px 18px;background:var(--sf2);border:1px solid var(--bd);color:var(--tx2);border-radius:8px;cursor:pointer;transition:all .12s;}
.ws-ph:hover{border-color:var(--tx2);}
.ws-ph.active{background:var(--ac);border-color:var(--ac);color:#000;}

/* ── 固定アクションバー（記録画面） ── */
#re-view-match .sb{padding-bottom:var(--abar-h);}        /* バーに隠れないよう余白（--abar-h に結合） */
body.abar-on #toast{bottom:calc(var(--abar-h) + var(--sp-2));}  /* toastをバーの上へ退避（88+8=96px を維持） */
#re-abar{box-shadow:0 -4px 16px rgba(0,0,0,.35);}
/* アクションバー左に移設したストップウォッチをコンパクト化（本来の大型カード用サイズを上書き） */
#re-abar .sw-time{font-size:22px;letter-spacing:1px;padding:0;line-height:1;min-width:52px;text-align:center;font-variant-numeric:tabular-nums;}
#re-abar .swb{flex:0 0 auto;padding:9px 10px;font-size:12px;border-radius:8px;}

/* ── ②進行にマウントされた一覧では、上部バー(ws-ctxbar)の📺🚩👥と重複する
      #re-ev-btns を隠す（単体RECORDERでは従来どおり表示） ── */
#ws-live-mount #re-ev-btns{display:none!important;}

/* ════════════════════════════════════════════════════════════
   SCOREBOARD (Phase D-2: 手組みで繰り返されていた構造をクラス化)
   方針: 行/カードのコンテナ構造だけをクラスへ。${col} 等のdata由来の色は
   inline のまま残す（判定①）。値は現状維持＝挙動neutral。内側spanの多彩な
   clamp階調の正規化は値変更になるため D-3(scoreboard再設計)へ送る。
   ════════════════════════════════════════════════════════════ */
/* カード外殻: 5枚が「角丸12＋トーン別の地色/枠」でほぼ同型だった */
.sb-card{border-radius:12px;}
.sb-card.pad-a{padding:16px 20px;}
.sb-card.pad-b{padding:14px 16px;}
.sb-card.pad-c{padding:14px 20px;}
.sb-card.tone-panel{background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.08);}
.sb-card.tone-dim{background:rgba(255,255,255,.03);border:1px solid rgba(255,255,255,.08);}
.sb-card.tone-live{background:rgba(0,212,255,.06);border:1px solid rgba(0,212,255,.3);}
.sb-card.tone-flag{background:rgba(255,215,0,.04);border:1px solid rgba(255,215,0,.2);}
/* .map() でN回出力されていた行/セル＝繰り返し定数 */
.sb-st-row{display:flex;align-items:center;gap:10px;padding:6px 0;
  border-bottom:1px solid rgba(255,255,255,.06);font-size:clamp(13px,2vw,22px);}
.sb-st-row.tie{border-bottom-color:rgba(255,200,0,.15);}   /* 同点グループ内は枠色を金へ（旧: 三項inline） */
.sb-tie-group{background:rgba(255,200,0,.04);border:1px solid rgba(255,200,0,.25);
  border-radius:8px;margin:4px 0;padding:4px 8px;}
.sb-getter{text-align:center;}
/* サイズはここで決める。js 側にインラインで書くと、プロジェクタ用の指定が効かない */
.sb-getter-medal{font-size:clamp(16px,3vw,32px);line-height:1.1;}
/* 黄色の太字は読みにくいという声が続いた。大きさと🚩で意味を出し、色は地のまま */
.sb-getter-cnt{font-size:clamp(12px,1.8vw,20px);font-weight:700;color:var(--tx);}
.sb-getter-nick{font-size:clamp(10px,1.2vw,14px);color:var(--tx2);}
.sb-result-row{display:flex;align-items:center;gap:10px;padding:7px 0;
  border-bottom:1px solid rgba(255,255,255,.06);font-size:clamp(12px,1.7vw,20px);}
/* ライブ試合タイマー（Phase D-3: 観客画面に残り時間を毎秒表示。記録係の閾値≤30warn/≤10dangerに一致） */
.sb-timer{font-family:var(--fh);font-size:clamp(30px,7vw,68px);letter-spacing:3px;line-height:1;
  margin-top:10px;color:var(--ac);font-variant-numeric:tabular-nums;transition:color .3s;}
.sb-timer .sb-timer-lbl{display:block;font-family:var(--fb);font-size:clamp(8px,1vw,12px);
  letter-spacing:3px;color:var(--tx2);margin-bottom:2px;}
.sb-timer.warn{color:var(--ac3);}
.sb-timer.danger{color:var(--rd);animation:swp .44s ease infinite alternate;}
.sb-timer.end{color:var(--rd);}
/* 3層ヒエラルキー（Phase D-3-b）: HERO(進行中)を主役化・環境情報を降格 */
.sb-hero{background:linear-gradient(135deg,rgba(0,212,255,.14),rgba(0,212,255,.03));
  border:1px solid rgba(0,212,255,.45);border-radius:14px;padding:20px 24px;
  box-shadow:0 0 30px rgba(0,212,255,.08) inset;}
.sb-hero-label{font-size:clamp(10px,1.3vw,15px);letter-spacing:4px;color:var(--ac);
  font-weight:700;margin-bottom:10px;}
.sb-ambient{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:12px;}
.sb-tier3{opacity:.6;transition:opacity .2s;}   /* 環境情報＝焦点でない低コントラスト帯 */
.sb-tier3:hover{opacity:1;}

/* ── HERO 横並び（PC前提）: 左=NOW PLAYING / 右=UP NEXT（次の試合＋次以降の組合せ3件） ── */
.sb-hero-row{display:flex;gap:28px;align-items:stretch;}
.sb-hero-now{flex:1 1 56%;min-width:0;}
.sb-hero-upnext{flex:1 1 44%;min-width:0;display:flex;flex-direction:column;
  border-left:1px solid rgba(255,255,255,.12);padding-left:24px;}
:root[data-theme="light"] .sb-hero-upnext{border-left-color:rgba(20,30,50,.14);}
.sb-up-item{display:flex;align-items:baseline;flex-wrap:wrap;gap:2px 4px;padding:6px 0;
  border-bottom:1px dashed rgba(255,255,255,.07);}
.sb-up-item:last-child{border-bottom:none;}
:root[data-theme="light"] .sb-up-item{border-bottom-color:rgba(20,30,50,.1);}
.sb-up-tag{font-size:clamp(9px,1vw,13px);letter-spacing:1px;margin-right:6px;white-space:nowrap;font-weight:700;}
/* ── STANDINGS リーグ横並び（最大3列想定） ── */
.sb-standings-cols{display:flex;gap:20px;align-items:flex-start;}
.sb-standings-col{flex:1 1 0;min-width:0;}
/* スマホ版は別設計。PC優先のため 860px 未満では縦積みへ退避（暫定） */
@media(max-width:860px){
  .sb-hero-row{flex-direction:column;gap:14px;}
  .sb-hero-upnext{border-left:none;padding-left:0;border-top:1px solid rgba(255,255,255,.12);padding-top:12px;}
  .sb-standings-cols{flex-direction:column;gap:12px;}
}

/* ── バウト単位の行（結果 / 予定）──────────────────────────
   記録画面と同じ束ね方（buildBoutGroups / boutSummary）。ゲームを1行ずつ
   並べると 5チーム総当たり×3ゲームで30行になり、会場の画面では読めない。 */
.sb-bout-row{padding:7px 8px;border-bottom:1px solid var(--bd);}
.sb-bout-main{display:flex;align-items:center;gap:10px;}
.sb-bout-row.is-next{background:rgba(0,230,118,.10);border:1px solid var(--gn);border-radius:8px;}
.sb-bout-row.is-done{opacity:.62;}
.sb-pips{display:inline-flex;gap:3px;flex:0 0 auto;}
.sb-pip{width:9px;height:9px;border-radius:2px;border:1px solid var(--bd2);background:transparent;display:inline-block;}
.sb-pip.draw{background:var(--tx3);border-color:var(--tx3);}
.sb-bout-score{font-family:var(--fh);font-size:clamp(13px,1.7vw,20px);min-width:52px;text-align:right;
  white-space:nowrap;font-variant-numeric:tabular-nums;}
.sb-dash{color:var(--tx3);margin:0 2px;}
.sb-drw{color:var(--tx3);font-size:.7em;margin-left:4px;}
/* 取得者は2段目に回して折り返す。1行に押し込むと名前が「…」で消える
   （1バウト3ゲームなら3人出る。誰が取ったか分からないなら出す意味がない）。 */
.sb-bout-flags{display:flex;flex-wrap:wrap;gap:4px 10px;margin-top:3px;padding-left:2px;}
.sb-flag-chip{color:var(--ac3);font-size:clamp(9px,1.1vw,13px);white-space:nowrap;}

/* ── 順位表の数値。**太字の黄色をやめる**（読みにくいという声が続いた）。
   数字は地の色で大きく、単位を小さく添える。色で意味を出すのは順位と勝敗だけ。 */
.sb-st-pts,.sb-st-buch,.sb-st-flag{white-space:nowrap;text-align:right;
  font-variant-numeric:tabular-nums;font-weight:400;}
.sb-st-pts{color:var(--tx);font-size:clamp(12px,1.6vw,19px);min-width:72px;}
.sb-st-buch{color:var(--tx2);font-size:clamp(11px,1.4vw,17px);min-width:74px;}
.sb-st-flag{color:var(--tx2);font-size:clamp(11px,1.3vw,17px);min-width:48px;}
.sb-st-pts small,.sb-st-buch small{font-size:.62em;color:var(--tx3);margin-right:5px;letter-spacing:0;font-weight:400;}

/* ── 対戦成績マトリックス（N×N）─────────────────────────
   順位表だけだと「どこに負けたのか」が分からない。会場でいちばん聞かれるところ。 */
/* 順位表と対戦成績を横に並べる。縦に積むと 1080px に入らない */
.sb-st-wrap{display:flex;gap:16px;align-items:flex-start;}
.sb-st-list{flex:1 1 58%;min-width:0;}
.sb-st-mx{flex:1 1 42%;min-width:0;}
.sb-st-mx-h{color:var(--tx2);letter-spacing:2px;font-size:clamp(9px,1.1vw,14px);margin-bottom:4px;}
@media(max-width:860px){ .sb-st-wrap{flex-direction:column;gap:10px;} }
.sb-mx{border-collapse:collapse;width:100%;font-variant-numeric:tabular-nums;}
.sb-mx th,.sb-mx td{border:1px solid var(--bd);padding:4px 6px;text-align:center;
  font-size:clamp(10px,1.2vw,15px);white-space:nowrap;}
.sb-mx thead th{color:var(--tx2);font-weight:400;}
.sb-mx th.rowh{text-align:left;color:var(--tx);font-weight:700;}
.sb-mx td.self{background:var(--sf3);color:var(--tx3);}
.sb-mx td.none{color:var(--tx3);}
.sb-mx td.win{color:var(--gn);font-weight:700;}
.sb-mx td.lose{color:var(--rd);}
.sb-mx td.even{color:var(--tx2);}
.sb-mx-sw{display:inline-block;width:9px;height:9px;border-radius:2px;margin-right:4px;
  vertical-align:-1px;box-shadow:0 0 0 1px var(--sw-edge);}

/* ── 「試合中」の見出し ── */
.sb-now-head{font-size:clamp(11px,1.3vw,17px);color:var(--tx2);margin-bottom:5px;
  display:flex;align-items:baseline;gap:10px;flex-wrap:wrap;}
.sb-now-game{color:var(--tx);font-weight:700;font-variant-numeric:tabular-nums;}
.sb-now-game small{color:var(--tx3);font-weight:400;}

/* ── 巡回：順位表シートにフラッグ上位を同居させる ── */
.sb-rotate-stand{display:flex;flex-direction:column;gap:1.4vh;}
.sb-rs-main{flex:1;min-height:0;overflow:auto;scrollbar-width:none;}
.sb-rs-main::-webkit-scrollbar{display:none;}
.sb-rs-flags{flex:0 0 auto;border-top:1px solid var(--bd);padding-top:1vh;}
.sb-rs-h{color:var(--ac3);letter-spacing:2px;margin-bottom:.6vh;}

/* ════════════════════════════════════════════════════════════
   会場のプロジェクタ（1920×1080 前提）
   ────────────────────────────────────────────────────────────
   スマホと同じ版で「clamp の上限」だけを頼りにしていたので、1920 では
   ・文字が上限で止まって小さい（4vw=77px 相当が要るのに 48px で頭打ち）
   ・中身が上 1/3 に固まり、下 2/3 が黒いまま
   ・フラッグ上位が opacity:.6 の「環境情報」帯にいて、遠くから読めない
   という状態だった。**遠くから読む画面**なので、近くで見る画面とは別に組む。

   単位は vh 基準。プロジェクタは横は必ず埋まるが、縦が足りないと切れる。
   ここで決めるのは「高さの配り方」と「最低限の文字の大きさ」だけで、
   色やカードの形は共通のものをそのまま使う。
   ════════════════════════════════════════════════════════════ */
@media (min-width:1400px){
  #scoreboard-screen{
    height:100dvh; padding:1.6vh 1.6vw; gap:1.2vh; overflow:hidden;
  }
  /* 見出し。名前を大きく、日付は添える程度 */
  #sb-event-name{ font-size:3.6vh !important; letter-spacing:.5vw; line-height:1.1; }
  #sb-event-date{ font-size:1.5vh !important; letter-spacing:.25vw; }

  /* HERO は伸ばさない。**主役は順位表**なので、上下は必要なだけに抑える。
     「次の対戦」が3件入ると勝手に伸びるので上限を切る。 */
  .sb-hero{ padding:1.4vh 1.8vw; border-radius:1.2vh; flex:0 0 auto; max-height:24vh; overflow:hidden; }
  .sb-hero-label{ font-size:1.7vh; letter-spacing:.35vw; margin-bottom:1vh; }
  .sb-hero-row{ gap:2vw; }
  #sb-now-playing .tname{ font-size:5.2vh !important; line-height:1.1; }
  .sb-up-item{ padding:.9vh 0; gap:.4vh .6vw; }

  /* 「次の対戦」は番号で示す。「次の次の次」は読み下すのに時間がかかる */
  .sb-up-no{
    display:inline-flex;align-items:center;justify-content:center;
    width:3.1vh;height:3.1vh;border-radius:50%;flex:0 0 auto;
    background:rgba(255,149,0,.16);border:1px solid var(--ac3,#ff9500);
    color:var(--ac3,#ff9500);font-weight:800;font-size:1.7vh;margin-right:.6vw;
  }
  .sb-up-item.is-next .sb-up-no{ background:var(--ac3,#ff9500); color:#000; }

  /* 順位表を主役に。残った高さを全部使う */
  .sb-card.pad-a{ padding:1.4vh 1.6vw; }
  .sb-card.pad-c{ padding:1.2vh 1.4vw; }
  #scoreboard-screen > .sb-card.tone-panel{ flex:1 1 auto; min-height:0; display:flex; flex-direction:column; }
  /* はみ出しても切らない。切ると下位のチームが「無いこと」になる。
     プロジェクタで人はスクロールしないので、入り切らない大会は巡回モードを使う。 */
  #sb-standings{ flex:1; min-height:0; overflow:auto; scrollbar-width:none; }
  #sb-standings::-webkit-scrollbar{ display:none; }
  .sb-st-row{ font-size:3vh !important; padding:.9vh 0; gap:.8vw; }

  /* 下段。フラッグ上位は**暗くしない**（遠くから読む画面で opacity:.6 は消える） */
  .sb-ambient{ flex:0 0 24vh; grid-template-columns:1fr 1.3fr; gap:1vw; min-height:0; }
  .sb-ambient > .sb-card{ min-height:0; display:flex; flex-direction:column; }
  .sb-tier3{ opacity:1; }
  #sb-flags{ gap:1.4vw !important; flex:1; align-items:center; }
  .sb-getter-medal{ font-size:4.4vh; }
  .sb-getter-cnt{ font-size:3.2vh; }
  .sb-getter-nick{ font-size:2.1vh; color:var(--tx); }
  #sb-results{ flex:1; max-height:none !important; overflow:auto; scrollbar-width:none; }
  #sb-results::-webkit-scrollbar{ display:none; }
  .sb-result-row{ font-size:2.1vh !important; padding:.55vh 0; gap:.7vw; }

  /* 帯の見出し（📊 STANDINGS / 🚩 FLAG GETTERS / 📋 RESULTS） */
  #scoreboard-screen .sb-card > div:first-child{ font-size:1.7vh; letter-spacing:.3vw; margin-bottom:.9vh; }

  /* バウト行・マトリックス・数値（プロジェクタ用の大きさ） */
  .sb-bout-row{ padding:.8vh .8vw; }
  .sb-bout-main{ gap:1vw; }
  .sb-pip{ width:1.5vh;height:1.5vh; }
  .sb-bout-score{ font-size:2.6vh;min-width:7vh; }
  .sb-flag-chip{ font-size:1.7vh; }
  .sb-bout-flags{ gap:.4vh 1.2vw;margin-top:.5vh; }
  .sb-st-pts{ font-size:2.6vh;min-width:11vh; }
  .sb-st-buch{ font-size:2.2vh;min-width:11vh; }
  .sb-st-flag{ font-size:2.2vh;min-width:7vh; }
  .sb-mx th,.sb-mx td{ font-size:2vh;padding:.55vh .7vw; }
  .sb-st-wrap{ gap:1.4vw;height:100%; }
  .sb-st-list,.sb-st-mx{ min-height:0;overflow:auto;scrollbar-width:none; }
  .sb-st-list::-webkit-scrollbar,.sb-st-mx::-webkit-scrollbar{ display:none; }
  .sb-st-mx-h{ font-size:1.7vh;margin-bottom:.7vh; }
  .sb-mx-sw{ width:1.4vh;height:1.4vh; }
  .sb-now-head{ font-size:2.2vh;margin-bottom:.8vh; }
  .sb-rs-h{ font-size:2.2vh; }
  .sb-rotate-body .sb-bout-row{ padding:1.2vh 1vw; }
  .sb-rotate-body .sb-bout-main{ gap:1.2vw; }
  .sb-rotate-body .sb-bout-score{ font-size:4vh;min-width:10vh; }
  .sb-rotate-body .sb-pip{ width:2.2vh;height:2.2vh; }
  .sb-rotate-body .sb-flag-chip{ font-size:2.2vh; }
  .sb-rotate-body .sb-mx th,.sb-rotate-body .sb-mx td{ font-size:2.6vh; }

  /* 巡回モードは1シートだけを全画面で見せる。**同じ高さに1/3の情報量**なので、
     通常表示と同じ大きさでは場所が余る。遠くから読めるところまで上げる。 */
  #sb-rotate-overlay{ padding:2vh 2.5vw 1.5vh; }
  #sb-rotate-title{ font-size:4vh !important; letter-spacing:.5vw; margin-bottom:2vh; }
  .sb-rotate-body .sb-st-row{ font-size:5vh !important; padding:1.5vh 0; gap:1.2vw; }
  .sb-rotate-body .sb-result-row{ font-size:3vh !important; padding:.9vh 0; }
  .sb-rotate-body .sb-getter-medal{ font-size:9vh; }
  .sb-rotate-body .sb-getter-cnt{ font-size:6vh; }
  .sb-rotate-body .sb-getter-nick{ font-size:3.4vh; color:var(--tx); }
  .sb-rotate-body #sb-flags{ gap:3vw !important; }
  /* 今後の対戦予定シート。会場から読む前提の大きさに上げる */
  .sb-rotate-body .sb-up-lbl{ font-size:2.6vh;min-width:11vh; }
  .sb-rotate-body .sb-up-teams{ font-size:4vh;gap:1vw; }
  .sb-rotate-body .sb-up-vs{ font-size:2.4vh; }
  .sb-rotate-body .sb-up-st{ font-size:2.6vh;min-width:6vh; }
}

/* ── 自動巡回オーバーレイ（大きめ表示・スクロール可能） ── */
#scoreboard-screen.sb-rotating{ overflow:hidden; }  /* 背面のスクロールを止める */
.sb-rotate-body{ scrollbar-width:none; }
.sb-rotate-body::-webkit-scrollbar{ display:none; }
.sb-rotate-flags{ display:flex;flex-wrap:wrap;gap:24px;align-content:flex-start; }
/* 行の中身。大きさをここで持つ（js にインラインで書くとプロジェクタ用の指定が効かない） */
.sb-up-lbl{ color:var(--tx2);font-size:clamp(10px,1.3vw,16px);min-width:70px; }
.sb-up-teams{ flex:1;min-width:0;font-size:clamp(13px,1.8vw,22px);display:inline-flex;align-items:center;gap:8px; }
.sb-up-vs{ color:var(--tx3);font-size:clamp(10px,1.2vw,15px); }
.sb-up-st{ text-align:right;white-space:nowrap;min-width:44px;color:var(--ac);font-size:clamp(10px,1.3vw,15px); }
.sb-up-st.done{ color:var(--tx3); }
.sb-up-st.next{ color:var(--gn);font-weight:800; }

/* ── SURFACE TILE (Phase D-2b: 全画面で16回反復していた表層トリプレットの共通化)
      background:var(--sf2)＋1px枠＋角丸8 の「地色タイル」。padding/color/cursor 等は
      各所固有のため inline に残す（判定①）。値は現状維持＝挙動neutral ── */
.tile{background:var(--sf2);border:1px solid var(--bd);border-radius:8px;}

/* ── LEGACY IMPORT MODAL (converter統合・案A) ── */
.lg-fmt-on{ background:var(--ac3,#ff9500)!important;color:#000!important;border-color:var(--ac3,#ff9500)!important; }
.lg-err{ background:rgba(255,80,80,.12);border:1px solid #d0504f;border-radius:8px;color:#ff9a9a;font-size:12px;padding:9px 11px;line-height:1.6;margin:8px 0; }
.lg-sec{ margin-top:12px; }
.lg-sec-h{ font-size:12px;font-weight:800;color:var(--tx2);margin-bottom:6px;display:flex;align-items:center;gap:8px; }
.lg-stats{ display:grid;grid-template-columns:repeat(6,1fr);gap:6px; }
.lg-stat{ background:var(--sf2);border:1px solid var(--bd);border-radius:8px;padding:8px 4px;text-align:center; }
.lg-stat-n{ font-size:18px;font-weight:800;color:var(--tx);line-height:1.1; }
.lg-stat-l{ font-size:10px;color:var(--tx3);margin-top:2px; }
.lg-note{ font-size:11px;color:var(--tx2);margin-top:8px;line-height:1.6; }
.lg-scroll{ max-height:200px;overflow:auto;border:1px solid var(--bd);border-radius:8px;padding:4px 8px;background:var(--sf2); }
.lg-sub-row{ display:flex;align-items:center;gap:10px;padding:6px 2px;border-bottom:1px solid var(--bd);font-size:12px; }
.lg-sub-row:last-child{ border-bottom:none; }
.lg-sub-seq{ font-size:11px;color:var(--tx3);min-width:52px; }
.lg-badge{ font-size:10px;font-weight:700;padding:2px 8px;border-radius:20px;background:var(--sf2);border:1px solid var(--bd);color:var(--tx3); }
.lg-badge-done{ background:rgba(0,230,118,.15);border-color:var(--gn);color:var(--gn); }
.lg-pv-l{ font-size:10px;color:var(--tx3);margin:6px 0 3px; }
.lg-pre{ background:var(--bg,#0e0f13);border:1px solid var(--bd);border-radius:8px;color:var(--tx2);font-family:monospace;font-size:11px;padding:8px;margin:0;white-space:pre;overflow-x:auto;max-height:160px; }
.lg-apply{ width:100%;margin-top:14px;padding:11px;background:var(--ac4,#b066ff);border:none;border-radius:8px;color:#000;font-weight:800;font-size:13px;cursor:pointer; }
@media(max-width:560px){ .lg-stats{ grid-template-columns:repeat(3,1fr); } }

/* ════════════════════════════════════════════════════════════
   スコア表のライトテーマ
   ────────────────────────────────────────────────────────────
   ダークで作った意匠をそのまま白地に置いていたので読めなかった。
   ・見出しに 30px のネオングロー → 白地では文字がにじむだけ
   ・HERO の地が rgba(0,212,255,.14) → 白の上ではほぼ透明＝枠が消える
   ・チーム色（黄・薄緑）を地の色のまま文字に使う → 白地に黄文字
   色そのものは変えず、**白地で沈むところだけ**を足す。
   ════════════════════════════════════════════════════════════ */
:root[data-theme="light"] #sb-event-name{ text-shadow:none !important; color:var(--ac) !important; }
:root[data-theme="light"] #sb-rotate-title{ text-shadow:none !important; }
:root[data-theme="light"] .sb-hero{
  background:linear-gradient(135deg,rgba(0,137,179,.10),rgba(0,137,179,.02));
  border-color:rgba(0,137,179,.35); box-shadow:none;
}
:root[data-theme="light"] .sb-card.tone-flag{ background:rgba(184,134,11,.07); border-color:rgba(184,134,11,.35); }
:root[data-theme="light"] .sb-card.tone-live{ background:rgba(0,137,179,.07); border-color:rgba(0,137,179,.35); }
:root[data-theme="light"] .sb-st-row{ border-bottom-color:rgba(20,30,50,.12); }
:root[data-theme="light"] .sb-bout-row{ border-bottom-color:rgba(20,30,50,.12); }
:root[data-theme="light"] .sb-result-row{ border-bottom-color:rgba(20,30,50,.12); }
:root[data-theme="light"] .sb-tie-group{ background:rgba(184,134,11,.08); border-color:rgba(184,134,11,.45); }
:root[data-theme="light"] .sb-up-item{ border-bottom-color:rgba(20,30,50,.12); }
:root[data-theme="light"] .sb-mx td.self{ background:rgba(20,30,50,.06); }
/* チーム色をそのまま文字に使っているところ。白地で沈む色（黄・薄緑）があるので、
   縁取りで地から離す。teamTag は既に --tname-o を使っているが、HERO の
   「試合中」だけは色をそのまま当てていた。 */
:root[data-theme="light"] #sb-now-playing .tname{
  -webkit-text-stroke:.6px var(--tname-o);
  paint-order:stroke fill;
}

/* ════════════════════════════════
   PC ADMIN: 狭い画面（レスポンシブ対応）
   ════════════════════════════════
   **このファイル唯一の @media。必ずファイル末尾に置く。**
   同じセレクタ（#pc-sidebar / .pc-grid2 等）が上のほうで @media 無しで
   定義されているため、この一式を先に書くと詳細度が同じで後勝ちのCSSに
   負けて無効化される（実際に踏んだ）。ここから先に新しい @media を足すときも
   この位置を保つこと。
   210px固定幅のサイドバーのままだと、390px幅の端末では本文が180pxしか
   残らず、表もボタンも実用にならない（実測で確認した）。サイドバーを
   オフキャンバス化し、グリッドは1カラムに落とす。 */
@media (max-width:860px){
  body.pc-mode #pc-sidebar{
    position:fixed;top:0;left:0;z-index:550;
    transform:translateX(-100%);transition:transform .2s ease;
    box-shadow:2px 0 24px rgba(0,0,0,.4);
  }
  body.pc-mode #pc-sidebar.pc-sb-open{transform:translateX(0);}
  #pc-hamburger{display:flex;}
  /* モーダル(--z-modal:600)より下・topbar(z-index:100)より上に置き、
     ナビは覆うがモーダルの邪魔はしない。 */
  #pc-sb-backdrop{
    display:block;position:fixed;inset:0;background:rgba(0,0,0,.5);z-index:540;
    opacity:0;pointer-events:none;transition:opacity .2s ease;
  }
  #pc-sb-backdrop.show{opacity:1;pointer-events:auto;}
  .pc-grid2,.pc-grid3,.pc-grid4{grid-template-columns:1fr;}
}