/* ============================================================
   styles_ourScore.css — ourScore アプリ固有スタイル
   読み込み順: Bootstrap CSS → styles_common.css → このファイル
   ============================================================ */

/* ページ背景を白に設定（styles_common.css のデフォルトはグレー） */
body { background: var(--rl-surface); }

/* ページ全体の縦 flex レイアウト */
.page-wrapper {
    display: flex;
    flex-direction: column;
    min-height: calc(100vh - 24px);
}
@media (max-width: 575px) {
    .page-wrapper { min-height: calc(100vh - 40px); }
}

/* ============================================================
   トップページ — ヒーローセクション
   ============================================================ */
.os-hero {
    background: #0E1116;
    color: #fff;
    padding: 48px 24px 52px;
    text-align: center;
    position: relative;
    overflow: hidden;
    /* container-xl に合わせて幅を制限 */
    margin: 0 12px;
    border-radius: 12px;
}
@media (min-width: 1200px) {
    .os-hero { max-width: 860px; margin: 0 auto; border-radius: 16px; }
}
.os-hero::before {
    content: '';
    position: absolute;
    inset: 0;
    background:
        radial-gradient(ellipse 60% 50% at 50% 0%, rgba(255,106,43,.18) 0%, transparent 70%),
        radial-gradient(ellipse 40% 30% at 20% 100%, rgba(45,168,255,.12) 0%, transparent 60%);
    pointer-events: none;
}
.os-hero-badge {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    background: rgba(255,106,43,.15);
    border: 1px solid rgba(255,106,43,.4);
    color: #FF6A2B;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: .08em;
    padding: 4px 12px;
    border-radius: 20px;
    margin-bottom: 20px;
}
.os-hero-dot {
    width: 6px; height: 6px;
    background: #36D399;
    border-radius: 50%;
    animation: osPulse 1.8s ease-in-out infinite;
}
@keyframes osPulse {
    0%,100% { opacity:1; transform:scale(1); }
    50%      { opacity:.5; transform:scale(.8); }
}
.os-hero-title {
    font-family: 'Bebas Neue', 'Arial Black', sans-serif;
    font-size: clamp(52px, 12vw, 88px);
    letter-spacing: .06em;
    line-height: 1;
    margin-bottom: 12px;
    background: linear-gradient(135deg, #fff 30%, #FF6A2B 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}
.os-hero-subtitle {
    font-size: 15px;
    color: rgba(255,255,255,.65);
    max-width: 480px;
    margin: 0 auto 32px;
    line-height: 1.7;
}
.os-btn-create {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    background: #FF6A2B;
    color: #fff;
    font-size: 16px;
    font-weight: 700;
    padding: 14px 36px;
    border-radius: 8px;
    border: none;
    cursor: pointer;
    transition: background .15s, transform .1s;
    box-shadow: 0 4px 20px rgba(255,106,43,.35);
}
.os-btn-create:hover { background: #e8581c; transform: translateY(-1px); }
.os-btn-create i { font-size: 20px; }
.os-hero-note {
    margin-top: 16px;
    font-size: 12px;
    color: rgba(255,255,255,.4);
}

/* ============================================================
   トップページ — 最近の試合
   ============================================================ */
.os-section-title {
    font-size: 17px;
    font-weight: 700;
    color: var(--rl-text);
    margin-bottom: 4px;
    display: flex;
    align-items: center;
    gap: 8px;
}
.os-section-title i { color: var(--rl-primary); font-size: 18px; }
.os-section-sub { font-size: 12px; color: var(--rl-text-sub); margin-bottom: 20px; }

.os-game-card {
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 14px 16px;
    border: 1px solid var(--rl-border);
    border-radius: var(--rl-radius);
    background: var(--rl-surface);
    margin-bottom: 10px;
    cursor: pointer;
    transition: border-color .15s, box-shadow .15s, background .15s;
    text-decoration: none;
    color: inherit;
}
.os-game-card:hover {
    border-color: var(--rl-primary);
    box-shadow: var(--rl-shadow);
    background: var(--rl-primary-light);
}
.os-game-card-icon {
    flex-shrink: 0;
    width: 42px; height: 42px;
    background: #0E1116;
    border-radius: 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #FF6A2B;
    font-size: 20px;
}
.os-game-card-body { flex: 1; min-width: 0; }
.os-game-card-name {
    font-size: 15px;
    font-weight: 700;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    line-height: 1.3;
}
.os-game-card-meta {
    font-size: 12px;
    color: var(--rl-text-sub);
    margin-top: 3px;
    display: flex;
    align-items: center;
    gap: 6px;
    flex-wrap: wrap;
}
.os-btn-remove {
    flex-shrink: 0;
    width: 28px; height: 28px;
    border-radius: 50%;
    border: 1px solid var(--rl-border);
    background: transparent;
    color: var(--rl-text-sub);
    font-size: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: background .12s, color .12s, border-color .12s;
}
.os-btn-remove:hover { background: #fee2e2; color: #dc2626; border-color: #fca5a5; }

.os-empty-state {
    text-align: center;
    padding: 48px 24px;
    color: var(--rl-text-sub);
    border: 1px dashed var(--rl-border);
    border-radius: var(--rl-radius);
}
.os-empty-state i { font-size: 40px; opacity: .3; margin-bottom: 12px; display: block; }
.os-empty-state p { font-size: 14px; margin: 0; }

/* ============================================================
   参加（join）ビュー
   ============================================================ */
.os-join-card {
    max-width: 420px;
    border: 1px solid var(--rl-border);
    border-radius: var(--rl-radius);
    overflow: hidden;
    box-shadow: var(--rl-shadow);
}
.os-join-header {
    background: #0E1116;
    color: #fff;
    padding: 20px 24px;
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: 14px;
    font-weight: 700;
}
.os-join-header i { color: #FF6A2B; font-size: 20px; }
.os-join-gameid { font-size: 12px; color: rgba(255,255,255,.6); word-break: break-all; }
.os-join-body { padding: 24px; background: var(--rl-surface); }

/* ============================================================
   記録メイン（game）ビュー — ダークテーマ
   ============================================================ */
.os-dark-view {
    background: #0E1116;
    color: #fff;
    min-height: calc(100vh - 60px);
}

/* ============================================================
   記録メイン（gameScreen）スタイル
   ============================================================ */
.gs-wrap { background:#0E1116; color:#fff; min-height:calc(100vh - 60px); padding-bottom:24px; }

/* スコアボード */
.gs-board { display:grid; grid-template-columns:1fr auto 1fr; gap:8px; padding:16px 12px 8px; align-items:center; }
.gs-side { text-align:center; }
.gs-team-name { font-size:13px; color:rgba(255,255,255,.6); margin-bottom:4px; }
.gs-score { font-family:'Bebas Neue',sans-serif; font-size:clamp(52px,12vw,80px); line-height:1; color:#fff; }
.gs-fouls { font-size:11px; color:rgba(255,255,255,.4); margin-top:4px; }
.gs-timeouts { display:flex; gap:4px; justify-content:center; flex-wrap:wrap; margin-top:6px; }
.gs-to-box { font-size:10px; padding:2px 6px; border:1px solid rgba(255,255,255,.25); border-radius:4px; color:rgba(255,255,255,.5); }
.gs-to-box.gs-to-used { background:#FF6A2B; color:#fff; border-color:#FF6A2B; }

/* センターカラム */
.gs-center { text-align:center; }
.gs-period-row { display:flex; align-items:center; gap:8px; justify-content:center; }
.gs-btn-period { background:rgba(255,255,255,.1); border:none; color:#fff; width:28px; height:28px; border-radius:6px; font-size:12px; cursor:pointer; }
.gs-period { font-size:16px; font-weight:700; min-width:40px; }
.gs-timer { font-family:'Bebas Neue',sans-serif; font-size:48px; letter-spacing:.04em; margin:4px 0; color:#2DA8FF; }
.gs-clock-btns { display:flex; gap:8px; justify-content:center; }
.gs-btn-clock { background:rgba(255,255,255,.12); border:1px solid rgba(255,255,255,.2); color:#fff; padding:4px 14px; border-radius:6px; font-size:13px; cursor:pointer; }
.gs-btn-clock:hover { background:rgba(255,255,255,.2); }

/* チーム切替 */
.gs-toggle-row { display:flex; gap:0; margin:8px 12px; border-radius:8px; overflow:hidden; border:1px solid rgba(255,255,255,.15); }
.gs-team-toggle { flex:1; background:transparent; border:none; color:rgba(255,255,255,.5); padding:8px; font-size:14px; font-weight:700; cursor:pointer; }
.gs-team-toggle.active { background:#FF6A2B; color:#fff; }

/* 名簿グリッド */
.gs-roster { display:grid; grid-template-columns:repeat(auto-fill, minmax(88px,1fr)); gap:8px; padding:8px 12px; }
.gs-pchip { background:rgba(255,255,255,.08); border:1px solid rgba(255,255,255,.12); border-radius:8px; padding:10px 6px; text-align:center; cursor:pointer; transition:all .12s; }
.gs-pchip:hover { background:rgba(255,255,255,.15); }
.gs-pchip-sel { background:#FF6A2B !important; border-color:#FF6A2B; }
.gs-pchip-out { opacity:.4; }
.gs-pchip-no { display:block; font-size:20px; font-weight:700; }
.gs-pchip-name { display:block; font-size:10px; color:rgba(255,255,255,.6); margin-top:2px; }
.gs-pchip-stats { display:block; font-size:10px; color:rgba(255,255,255,.4); margin-top:2px; }

/* アクションパネル */
.gs-actions { padding:8px 12px; }
.gs-selected { font-size:13px; color:rgba(255,255,255,.5); margin-bottom:8px; text-align:center; }
.gs-action-row { display:grid; grid-template-columns:repeat(4,1fr); gap:8px; }
.gs-act { border:none; border-radius:8px; padding:14px 4px; font-size:15px; font-weight:700; cursor:pointer; transition:opacity .12s; }
.gs-act:disabled { opacity:.3; cursor:not-allowed; }
.gs-act-2pt  { background:#2DA8FF; color:#fff; }
.gs-act-3pt  { background:#36D399; color:#111; }
.gs-act-ft   { background:#6EE7B7; color:#111; }
.gs-act-foul { background:#FF6A2B; color:#fff; }

/* プレイバイプレイ */
.gs-log-section { padding:8px 12px; margin-top:8px; }
.gs-log-title { font-size:12px; color:rgba(255,255,255,.4); font-weight:700; letter-spacing:.08em; margin-bottom:8px; }
.gs-log { max-height:200px; overflow-y:auto; }
.gs-ev { display:flex; gap:8px; align-items:baseline; font-size:12px; padding:4px 0; border-bottom:1px solid rgba(255,255,255,.06); }
.gs-ev-time { color:rgba(255,255,255,.3); flex-shrink:0; }
.gs-ev-actor { color:#2DA8FF; flex-shrink:0; }
.gs-ev-desc { color:rgba(255,255,255,.7); }
.gs-ev-empty { color:rgba(255,255,255,.3); font-size:12px; text-align:center; padding:16px; }

/* ファウルモーダル */
.gs-ovl { position:fixed; inset:0; background:rgba(0,0,0,.7); z-index:2000; display:flex; align-items:center; justify-content:center; }
.gs-modal { background:#1a1e27; border:1px solid rgba(255,255,255,.15); border-radius:12px; padding:24px; min-width:260px; }
.gs-modal-title { font-size:16px; font-weight:700; text-align:center; margin-bottom:16px; }
.gs-ftype-grid { display:grid; grid-template-columns:1fr 1fr; gap:8px; margin-bottom:12px; }
.gs-ftype { background:rgba(255,255,255,.1); border:1px solid rgba(255,255,255,.2); color:#fff; border-radius:8px; padding:12px; font-size:20px; font-weight:700; cursor:pointer; display:flex; flex-direction:column; align-items:center; gap:4px; }
.gs-ftype span { font-size:11px; font-weight:400; color:rgba(255,255,255,.6); }
.gs-ftype:hover { background:rgba(255,255,255,.2); }
.gs-ftype-red { border-color:rgba(255,80,80,.5); color:#ff9090; }
.gs-modal-close { width:100%; background:transparent; border:1px solid rgba(255,255,255,.2); color:rgba(255,255,255,.6); border-radius:8px; padding:8px; cursor:pointer; }

/* フッター */
.gs-footer-row { display:flex; gap:12px; justify-content:center; padding:12px; }
.gs-btn-link { background:transparent; border:none; color:rgba(255,255,255,.4); font-size:13px; cursor:pointer; }
.gs-btn-link:hover { color:rgba(255,255,255,.8); }

/* 公式様式ラッパー（iframe廃止・直接レンダリング） */
.os-sheet-wrap { padding: 4px; }

/* ============================================================
   公式様式ビュー CSS（ourScore_official_sheet.html から移植）
   ============================================================ */
:root {
  --brand: #2196F3; --brand-ink: #1565C0; --brand-soft: #E3F2FD;
  --paper: #fcfbf6; --ink: #1b1a16; --red: #c0271f;
  --grid: #c3bcaa; --grid2: #7d7766; --grid-strong: #3c382f;
  --shade: #efeadd; --muted: #6f6857;
}
.num { font-family: "Bebas Neue", sans-serif; letter-spacing: .02em; }
.sheet-toolbar {
  max-width: 1180px; margin: 8px auto 10px;
  display: flex; align-items: center; gap: 8px; flex-wrap: wrap;
}
.toolbar-left { flex: 1; min-width: 200px; }
.toolbar-right { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.mode-btn.active { background: var(--brand) !important; color: #fff !important; border-color: var(--brand) !important; }
.legend { max-width: 1180px; margin: 0 auto 10px; color: var(--muted); font-size: 11.5px; display: flex; gap: 16px; flex-wrap: wrap; }
.legend b.r { color: var(--red); } .legend b.k { color: var(--ink); }
.sheet { max-width: 1180px; margin: 0 auto; background: var(--paper); box-shadow: 0 18px 50px rgba(0,0,0,.45); border-radius: 4px; overflow: hidden; }
.sheethead { background: var(--brand); color: #fff; padding: 9px 16px; display: flex; align-items: center; gap: 10px; }
.sheethead .t { font-family: "Bebas Neue"; font-size: 20px; letter-spacing: .05em; }
.sheethead .t i { color: #bff0f4; font-style: normal; }
.sheethead .meta { margin-left: auto; font-size: 11.5px; opacity: .9; }
.body { padding: 12px 8px; }
.hd { display: grid; grid-template-columns: repeat(4,1fr); gap: 8px; border: 1.5px solid var(--ink); padding: 9px 11px; margin-bottom: 12px; }
.hd .f { font-size: 12px; display: flex; gap: 6px; align-items: baseline; }
.hd .f span { color: var(--muted); font-weight: 700; white-space: nowrap; }
.hd .f b { border-bottom: 1px dotted var(--grid2); flex: 1; font-weight: 600; min-width: 0; }
@media(max-width:760px) { .hd { grid-template-columns: 1fr 1fr; } }
/* .hd-sub は廃止。開始時間・区分は .hd グリッドに統合済み */
/* cols: デフォルトは flex 縦並び（PC・スマホ・自動≥992px / 自動≤575px） */
.cols { display: flex; flex-direction: column; gap: 14px; }
.cols .team { margin-bottom: 0; }
/* タブレットモードのみ A|B 横並び */
.sheet.mode-tablet .cols { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }

/* ===== sheet-layout レイアウト ===== */

/* -- PC モード: 2列グリッド（左=チーム表/サイン、右=ランスコア/集計） -- */
.sheet.mode-pc .sheet-layout {
  display: grid;
  grid-template-columns: minmax(420px,1fr) auto;
  gap: 14px;
}
.sheet.mode-pc .cols          { grid-column: 1; grid-row: 1; }
.sheet.mode-pc .lad-pc-wrap   { grid-column: 2; grid-row: 1; }
.sheet.mode-pc .sl-foot-signs { grid-column: 1; grid-row: 2; }
.sheet.mode-pc .sl-foot-sum   { grid-column: 2; grid-row: 2; }
/* PC: ランニングスコアが列高さいっぱいに伸びる（rows 1〜40 で使い切り） */
.sheet.mode-pc .lad-pc-wrap table.lad { height: 100%; }
/* PC: 合計得点テーブルが列高さいっぱいに伸びる（A/B行で案分） */
.sheet.mode-pc .sl-foot-sum table.sum { height: 100%; }

/* -- タブレットモード: flex 縦並び（cols=A|B横並び → ランスコア → 集計 → サイン） -- */
.sheet.mode-tablet .sheet-layout { display: flex; flex-direction: column; gap: 14px; }
.sheet.mode-tablet .sl-foot-sum   { order: 10; }
.sheet.mode-tablet .sl-foot-signs { order: 11; }

/* -- スマホモード: flex 縦並び（cols=縦 → lad-phone → 集計 → サイン） -- */
.sheet.mode-phone .sheet-layout { display: flex; flex-direction: column; gap: 14px; }
.sheet.mode-phone .sl-foot-sum   { order: 10; }
.sheet.mode-phone .sl-foot-signs { order: 11; }

/* -- 自動モード 3段階（Bootstrap 5 標準ブレークポイント） -- */
/* screen and を付けて印刷時に干渉しないようにする */
/* ≥992px: PC レイアウト */
@media screen and (min-width:992px) {
  .sheet:not(.mode-pc):not(.mode-tablet):not(.mode-phone) .sheet-layout {
    display: grid;
    grid-template-columns: minmax(420px,1fr) auto;
    gap: 14px;
  }
  .sheet:not(.mode-pc):not(.mode-tablet):not(.mode-phone) .cols          { grid-column: 1; grid-row: 1; }
  .sheet:not(.mode-pc):not(.mode-tablet):not(.mode-phone) .lad-pc-wrap   { grid-column: 2; grid-row: 1; }
  .sheet:not(.mode-pc):not(.mode-tablet):not(.mode-phone) .sl-foot-signs { grid-column: 1; grid-row: 2; }
  .sheet:not(.mode-pc):not(.mode-tablet):not(.mode-phone) .sl-foot-sum   { grid-column: 2; grid-row: 2; }
  .sheet:not(.mode-pc):not(.mode-tablet):not(.mode-phone) .lad-pc-wrap table.lad { height: 100%; }
  .sheet:not(.mode-pc):not(.mode-tablet):not(.mode-phone) .sl-foot-sum table.sum { height: 100%; }
}
/* 576〜991px: タブレットレイアウト */
@media screen and (min-width:576px) and (max-width:991px) {
  .sheet:not(.mode-pc):not(.mode-tablet):not(.mode-phone) .sheet-layout {
    display: flex;
    flex-direction: column;
    gap: 14px;
  }
  .sheet:not(.mode-pc):not(.mode-tablet):not(.mode-phone) .cols { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
  .sheet:not(.mode-pc):not(.mode-tablet):not(.mode-phone) .sl-foot-sum   { order: 10; }
  .sheet:not(.mode-pc):not(.mode-tablet):not(.mode-phone) .sl-foot-signs { order: 11; }
}
/* ≤575px: スマホレイアウト（flex column デフォルト + lad-phone-wrap 切替は下の @media(max-width:575px) で対応） */

/* -- 印刷: PC レイアウト相当（横向きA4、1ページ） -- */
@page { size: A4 landscape; margin: 8mm; }
@media print {
  /* モードクラスに関わらず PC グリッドレイアウトを強制 */
  .sheet-layout {
    display: grid !important;
    grid-template-columns: minmax(420px,1fr) auto !important;
    gap: 10px !important;
  }
  .cols          { grid-column: 1; grid-row: 1; display: flex !important; flex-direction: column !important; }
  .lad-pc-wrap   { grid-column: 2 !important; grid-row: 1 !important; display: flex !important; flex-direction: column !important; }
  .sl-foot-signs { grid-column: 1; grid-row: 2; }
  .sl-foot-sum   { grid-column: 2 !important; grid-row: 2 !important; }
  /* スマホ用ランニングスコアを非表示 */
  .lad-phone-wrap { display: none !important; }
  /* ナビ・ボタン類を非表示 */
  .sheet-toolbar, header, footer { display: none !important; }
}
.team { border: 1.5px solid var(--ink); margin-bottom: 12px; }
.thead { display: flex; align-items: center; gap: 8px; padding: 6px 10px; background: var(--shade); border-bottom: 1.5px solid var(--ink); flex-wrap: wrap; }
.thead .tag { font-family: "Bebas Neue"; font-size: 16px; padding: 1px 8px; border-radius: 4px; }
.thead .tn { font-weight: 900; font-size: 15px; }
.thead .ext { margin-left: auto; display: flex; flex-direction: row; gap: 14px; font-size: 10.5px; color: var(--muted); font-weight: 700; align-items: flex-start; flex-wrap: wrap; }
.boxset { display: inline-flex; gap: 2px; vertical-align: middle; }
.bx { width: 17px; height: 17px; border: 1px solid var(--grid2); background: #fff; display: flex; align-items: center; justify-content: center; font-size: 10px; font-weight: 800; font-family: "Bebas Neue"; }
.bx.x { color: var(--red); } .bx.x::after { content: "✕"; }
.bx.dbl { background: repeating-linear-gradient(0deg,#fff,#fff 6px,var(--grid2) 6px,var(--grid2) 7px); }
/* チームファウル / タイムアウト グリッド（カテゴリラベル左寄せ） */
.tf-grid { display: flex; flex-direction: column; gap: 2px; }
.tf-row  { display: flex; gap: 4px; align-items: center; }
.tf-cat  { font-size: 8px; font-weight: 800; color: var(--muted); min-width: 18px; white-space: nowrap; }
.tf-q    { display: inline-flex; align-items: center; gap: 1px; }
.tf-ql   { font-size: 8px; font-weight: 800; color: var(--muted); min-width: 14px; }
.tf-q .bx { width: 14px; height: 14px; font-size: 8px; }
/* タイムアウト グループ表示（前半/後半/OT） */
.to-grp { display: inline-flex; align-items: center; gap: 1px; }
.to-gl  { font-size: 8px; font-weight: 800; color: var(--muted); min-width: 14px; }
table.pl { width: 100%; border-collapse: collapse; font-size: 11.5px; }
table.pl th, table.pl td { border: 1px solid var(--grid); padding: 2px 5px; text-align: center; height: 24px; }
table.pl th { background: var(--shade); font-size: 9.5px; color: var(--muted); font-weight: 800; letter-spacing: .02em; white-space: nowrap; }
table.pl .no { font-family: "Bebas Neue"; font-size: 15px; width: 36px; white-space: nowrap; }
table.pl .nm { text-align: left; font-weight: 600; min-width: 36px; }
.flin { width: 30px; }
.start { display: inline-flex; align-items: center; justify-content: center; position: relative; width: 26px; height: 26px; font-size: 10px; color: var(--ink); font-weight: 900; }
.start::after { content: "○"; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); color: var(--red); font-size: 24px; line-height: 1; pointer-events: none; }
/* ファウル列: 5枠×21px + 4gap×2px = 113px、td padding 10px → 123px で固定 */
.fc-col { width: 123px; }
.fouls { display: flex; gap: 2px; justify-content: center; }
.fc { width: 21px; height: 21px; border: 1px solid var(--grid2); background: #fff; display: flex; align-items: center; justify-content: center; font-size: 11px; font-weight: 800; }
.fc.P { color: var(--ink); } .fc.T, .fc.U, .fc.D, .fc.C, .fc.B { color: var(--red); }
.fc.C, .fc.B { font-size: 9.5px; }
.fc.un { background: #fff; position: relative; }
.fc.un.game-end-line::after { content: ""; position: absolute; left: 3px; right: 3px; top: 50%; height: 2px; background: var(--ink); }
.fc.q-end-border { border-right: 2.5px solid var(--grid-strong) !important; }
/* Q2ハーフタイム区切り（第2Q終了後に使用済み枠と未使用枠の間に太線） */
.fc.q2-end-border { border-right: 2.5px solid var(--ink) !important; }
.fc.q2-half-before { border-left: 2.5px solid var(--ink) !important; }
.ptot { font-family: "Bebas Neue"; font-size: 16px; width: 36px; }
.lad-pc-wrap { display: flex; flex-direction: column; }
.lad-pc-wrap .runbox { flex: 1; display: flex; flex-direction: column; }
.lad-pc-wrap .ladwrap { flex: 1; overflow-y: auto; overflow-x: hidden; }
.runbox { border: 1.5px solid var(--ink); }
.runhd { background: var(--shade); border-bottom: 1.5px solid var(--ink); padding: 5px 8px; font-size: 11px; font-weight: 800; text-align: center; letter-spacing: .05em; }
.ladwrap { overflow: auto; }
table.lad { border-collapse: collapse; }
table.lad td { border: 1px solid var(--grid); height: 21px; text-align: center; font-family: "Bebas Neue"; font-size: 12.5px; padding: 0; position: relative; }
table.lad td.sc { width: 26px; color: var(--muted); }
table.lad td.vv { width: 38px; color: var(--ink); }
td.blk { width: 6px; border-top: 0; border-bottom: 0; background: var(--shade); }
.qr { color: var(--red); } .qk { color: var(--ink); }
.vv .n { position: relative; z-index: 1; }
.vv.slash .n::after { content: ""; position: absolute; left: -6px; right: -6px; top: 45%; height: 1.4px; background: currentColor; transform: rotate(-22deg); }
.vv.ft .n::before { content: "●"; position: absolute; left: 50%; top: 50%; transform: translate(-50%,-50%); font-size: 7px; z-index: -1; }
.vv.pend .n { outline: 1.5px solid currentColor; border-radius: 50%; padding: 0 2px; }
/* Q終了: per-team 太線（currentColor 不使用 — td.sc の color:var(--muted) 上書き回避） */
table.lad td.qr.pend { border-bottom: 2.4px solid var(--red); }
table.lad td.qk.pend { border-bottom: 2.4px solid var(--ink); }
/* Q終了○: circle outline を明示色で上書き（td.vv color:var(--ink) 上書き回避） */
table.lad td.vv.qr.pend .n { outline-color: var(--red); }
table.lad td.vv.qk.pend .n { outline-color: var(--ink); }
/* ゲーム終了: 2本線 */
table.lad td.qr.pend.game-end { border-bottom: 6px double var(--red); }
table.lad td.qk.pend.game-end { border-bottom: 6px double var(--ink); }
td.sc.three .n { outline: 1.4px solid currentColor; border-radius: 50%; padding: 0 3px; }
table.lad td.sc.qr.three .n { outline-color: var(--red); }
table.lad td.sc.qk.three .n { outline-color: var(--ink); }
.vv.gameend .n::after { content: ""; position: absolute; left: -5px; right: -5px; top: 50%; height: 1.2px; background: var(--ink); transform: rotate(20deg); }
.lad-phone-wrap { display: none; }
table.lad-phone { width: 100%; border-collapse: collapse; font-size: 11.5px; }
table.lad-phone th { background: var(--shade); font-size: 9.5px; color: var(--muted); font-weight: 800; letter-spacing: .02em; border: 1px solid var(--grid); padding: 3px 4px; text-align: center; }
table.lad-phone td { border: 1px solid var(--grid); height: 18px; text-align: center; font-family: "Bebas Neue"; font-size: 11.5px; padding: 0 2px; position: relative; }
table.lad-phone .q-col { width: 20px; font-weight: 800; }
table.lad-phone .seq-col { width: 32px; color: var(--muted); }
table.lad-phone td.sc { color: var(--muted); }
/* table.lad-phone tr.qend td — 旧実装のデッドコード。現在は td.pend で制御 */
/* ランニングスコア ヘッダー（2行構成: スコア範囲 + A/Bサブラベル）
   Q期間ラベルは表示しない — Q境界は実際の得点で決まるため */
table.lad th.lhd-rng, table.lad th.lhd-ab { border: 1px solid var(--grid); background: var(--shade); color: var(--muted); }
table.lad th.lhd-ab { text-align: center; font-size: 9px; padding: 2px 0; font-weight: 800; }
/* スマホ縦型ランニングスコア（PC/タブレットと同一セルデザイン・160行縦並び） */
table.lad.lad-v { width: 100%; }
table.lad.lad-v td.sc { width: 22%; }
table.lad.lad-v td.vv { width: 28%; }
@media screen and (max-width:575px) {
  .sheet:not(.mode-pc):not(.mode-tablet) .lad-pc-wrap { display: none; }
  .sheet:not(.mode-pc):not(.mode-tablet) .lad-phone-wrap { display: block; }
}
.sheet.mode-pc .lad-pc-wrap  { display: flex !important; flex-direction: column; }
.sheet.mode-pc .lad-phone-wrap { display: none !important; }
.sheet.mode-tablet .lad-pc-wrap  { display: flex !important; flex-direction: column; }
.sheet.mode-tablet .lad-phone-wrap { display: none !important; }
.sheet.mode-phone .lad-pc-wrap  { display: none !important; }
.sheet.mode-phone .lad-phone-wrap { display: block !important; }
@media screen and (max-width:991px) { .sheet:not(.mode-pc) .lad-pc-wrap table.lad { width: 100%; } }
.sheet.mode-tablet .lad-pc-wrap table.lad { width: 100% !important; }
/* .foot ラッパーは廃止。sl-foot-signs / sl-foot-sum が sheet-layout の直接子として配置される */
table.sum { width: 100%; border-collapse: collapse; font-size: 12px; text-align: center; }
table.sum th, table.sum td { border: 1px solid var(--grid); padding: 6px; }
table.sum th { background: var(--shade); font-size: 10.5px; color: var(--muted); font-weight: 800; }
table.sum .tn { text-align: left; font-weight: 800; }
table.sum .fin { font-family: "Bebas Neue"; font-size: 18px; }
.sum-tag { font-family: "Bebas Neue"; font-size: 13px; padding: 0 5px; border-radius: 3px; display: inline-block; vertical-align: middle; }
.winrow { color: var(--red); font-weight: 900; }
.signs { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; border: 1.5px solid var(--ink); padding: 10px; }
.sg { font-size: 10.5px; } .sg span { color: var(--muted); font-weight: 700; display: block; margin-bottom: 13px; }
.sg .ln { border-bottom: 1px solid var(--ink); }
.roster-panel { max-width: 1180px; margin: 0 auto 10px; border: 1.5px solid var(--grid); border-radius: 6px; overflow: hidden; }
.rp-header { background: var(--shade); padding: 8px 14px; cursor: pointer; display: flex; justify-content: space-between; align-items: center; font-size: 12px; font-weight: 700; color: var(--muted); user-select: none; }
.rp-body { padding: 12px 14px; display: flex; gap: 16px; flex-wrap: wrap; }
.rp-team { flex: 1; min-width: 200px; }
.rp-team-title { font-size: 11px; font-weight: 800; color: var(--muted); margin-bottom: 6px; letter-spacing: .06em; text-transform: uppercase; }
.rp-row { display: flex; align-items: center; gap: 6px; margin-bottom: 4px; }
.rp-no { font-family: "Bebas Neue"; font-size: 16px; width: 26px; }
.rp-name { border: 1px solid var(--grid2); padding: 3px 7px; font-family: inherit; font-size: 12px; border-radius: 4px; width: 110px; }
.rp-del { border: none; background: none; color: var(--muted); cursor: pointer; font-size: 14px; padding: 0 4px; }
.rp-del:hover { color: var(--red); }
.rp-add { display: flex; gap: 6px; margin-top: 8px; align-items: center; }
.rp-add input { border: 1px solid var(--grid2); padding: 4px 8px; font-family: inherit; font-size: 12px; border-radius: 4px; width: 64px; }
.rp-add button { padding: 4px 12px; font-size: 12px; font-weight: 700; border: 1.5px solid var(--brand); color: var(--brand); background: none; border-radius: 4px; cursor: pointer; }
.rp-add button:hover { background: var(--brand-soft); }
.rp-notice { font-size: 11px; color: var(--muted); padding: 6px 14px; background: var(--brand-soft); border-bottom: 1px solid var(--grid); }
.rp-notice a { color: var(--brand); }
.rp-header.locked { cursor: not-allowed; opacity: .5; pointer-events: none; }
.input-status { max-width: 1180px; margin: 8px auto 6px; display: flex; align-items: center; gap: 10px; flex-wrap: wrap; padding: 8px 12px; background: var(--shade); border: 1.5px solid var(--grid); border-radius: 6px; font-size: 12.5px; }
.input-status .is-label { color: var(--muted); font-weight: 700; }
.input-status .is-val { font-family: "Bebas Neue"; font-size: 17px; }
.input-status .is-spacer { flex: 1; }
.disp-btn.active { background: var(--brand-ink) !important; color: #fff !important; border-color: var(--brand-ink) !important; }
.entry-ovl { position: fixed; inset: 0; background: rgba(0,0,0,.55); display: none; align-items: center; justify-content: center; z-index: 1500; padding: 16px; }
.entry-ovl.show { display: flex; }
.entry-modal { background: #fff; border-radius: 14px; padding: 20px 22px; max-width: 480px; width: 100%; box-shadow: 0 24px 60px rgba(0,0,0,.4); }
.em-team-header { display: flex; align-items: center; gap: 10px; margin-bottom: 12px; }
.em-team-header h3 { margin: 0; font-size: 14px; font-weight: 800; color: var(--ink); }
.em-team-badge { font-family: "Bebas Neue"; font-size: 22px; padding: 1px 10px; border-radius: 4px; color: #fff; line-height: 1.4; }
.em-team-badge.team-A { background: var(--red); }
.em-team-badge.team-B { background: var(--ink); }
.em-error { background: #fff5f5; border: 1px solid var(--red); color: var(--red); border-radius: 6px; padding: 8px 10px; font-size: 12px; font-weight: 600; margin-bottom: 10px; }
.em-roster { display: flex; flex-wrap: wrap; gap: 7px; margin-bottom: 14px; max-height: 160px; overflow-y: auto; }
.mr-chip { border: 1.5px solid var(--grid); background: #fff; border-radius: 8px; padding: 6px 10px; cursor: pointer; text-align: left; min-width: 58px; font-family: inherit; transition: .1s; }
.mr-chip:hover { border-color: var(--brand); }
.mr-chip.sel { border-color: var(--brand); background: var(--brand-soft); }
.mr-no { font-family: "Bebas Neue"; font-size: 18px; display: block; line-height: 1; }
.mr-nm { font-size: 10px; color: var(--muted); display: block; max-width: 56px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.em-acts { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 8px; margin-bottom: 12px; }
.em-act { padding: 12px 6px; font-family: inherit; font-weight: 800; font-size: 15px; border-radius: 8px; cursor: pointer; border: 2px solid var(--grid); background: #fff; transition: .12s; }
.em-act:disabled { opacity: .32; cursor: not-allowed; }
.em-act.a2p:not(:disabled) { border-color: #36B37E; color: #36B37E; }
.em-act.a3p:not(:disabled) { border-color: var(--brand); color: var(--brand); }
.em-act.aft:not(:disabled) { border-color: var(--muted); }
.em-qend { border-color: var(--red) !important; color: var(--red); }
.em-footer { display: flex; justify-content: flex-end; gap: 8px; margin-top: 16px; }
.pend-team-row { display: flex; align-items: center; gap: 10px; margin-bottom: 12px; flex-wrap: wrap; }
.pend-team-name { font-weight: 800; font-size: 13px; flex: 1; }
.pend-score-inp { font-family: "Bebas Neue"; font-size: 22px; width: 72px; text-align: center; border: 2px solid var(--grid); border-radius: 6px; padding: 4px 8px; }
.pend-score-inp:focus { border-color: var(--brand); outline: none; }
.pend-ladder-val { font-size: 10.5px; color: var(--muted); white-space: nowrap; }
.pend-mismatch { background: #fffbf0; border: 1px solid #f59f00; color: #6e4e00; border-radius: 6px; padding: 8px 10px; font-size: 12px; font-weight: 600; margin-bottom: 10px; }
.to-inp { font-family: "Bebas Neue"; font-size: 36px; width: 100px; text-align: center; border: 2px solid var(--grid); border-radius: 8px; padding: 6px; }
.to-inp:focus { border-color: var(--brand); outline: none; }
.fl-btn { width: 26px; height: 26px; background: none; border: none; cursor: pointer; padding: 0; display: flex; align-items: center; justify-content: center; }
.fl-btn:hover { opacity: .7; }
.fl-btn.fl-played { font-size: 12px; font-weight: 800; color: var(--ink); }
.foul-type-grid { display: grid; gap: 8px; margin-bottom: 12px; }
.foul-type-btn { padding: 10px 6px; font-family: inherit; font-weight: 800; font-size: 16px; border-radius: 8px; cursor: pointer; border: 2px solid var(--grid); background: #fff; transition: .12s; }
.foul-type-btn:hover { border-color: var(--brand); }
.foul-type-btn.sel { border-color: var(--brand); background: var(--brand-soft); color: var(--brand-ink); }
.foul-type-btn.f-red { color: var(--red); }
.foul-type-btn.f-red.sel { border-color: var(--red); background: #fff5f5; }
.foul-mode-tabs { display: flex; gap: 8px; margin-bottom: 12px; }
.foul-mode-tab { flex: 1; padding: 8px; font-size: 12px; font-weight: 700; border: 1.5px solid var(--grid); border-radius: 6px; background: #fff; cursor: pointer; text-align: center; }
.foul-mode-tab.active { border-color: var(--brand); background: var(--brand-soft); color: var(--brand-ink); }
.foul-count-row { display: flex; align-items: center; gap: 12px; margin-bottom: 14px; }
.foul-count-val { font-family: "Bebas Neue"; font-size: 32px; min-width: 36px; text-align: center; }
.foul-count-btn { width: 34px; height: 34px; border: 1.5px solid var(--grid); border-radius: 6px; background: #fff; font-size: 20px; font-weight: 700; cursor: pointer; display: flex; align-items: center; justify-content: center; }
.foul-count-btn:hover { border-color: var(--brand); }
/* ファウル入力モーダル — FT ボタン */
.foul-ft-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 6px; }
.foul-ft-btn { padding: 8px 4px; border: 1px solid var(--border, #ddd); border-radius: 4px; font-size: 12px; font-family: inherit; background: #f0f0f0; color: #999; cursor: not-allowed; transition: .12s; }
.foul-ft-btn:not(:disabled) { cursor: pointer; background: #fff; color: #222; }
.foul-ft-btn.ft-highlight:not(:disabled) { border-color: var(--brand); color: var(--brand); font-weight: 700; }
.foul-ft-btn.ft-selected { background: var(--brand); color: #fff !important; border-color: var(--brand); font-weight: 700; }
/* ファウル枠 — 退場マーカー */
.fc.gd { color: var(--red); font-weight: 800; font-size: 9px; }
.fc.dash { color: #ccc; }
.sheet.disp-simple table.lad td.sc, .sheet.disp-simple table.lad td.vv { font-size: 9px; width: auto; min-width: 28px; }
.sheet.disp-simple table.lad-phone td.sc, .sheet.disp-simple table.lad-phone td.vv { font-size: 9px; }
@media print {
  .sheet { box-shadow: none; }
  #header, .page-header, .sheet-toolbar, .legend, .input-status, .roster-panel, .anno,
  #ad-container-top-1, #ad-container-footer-1,
  #ad-container-sheet-top, #ad-container-sheet-footer,
  .site-footer { display: none !important; }
  /* sheet-layout の print ルールは上部の @media print ブロックで定義済み */
  .lad-pc-wrap  { display: flex !important; flex-direction: column; height: auto !important; }
  .lad-pc-wrap .runbox { flex: none !important; height: auto !important; }
  .lad-pc-wrap .ladwrap { overflow: visible !important; height: auto !important; flex: none !important; }
  .lad-phone-wrap { display: none !important; }
}

/* セットアップ */
.setup-section { border:1px solid var(--rl-border); border-radius:var(--rl-radius); overflow:hidden; }
.setup-section-header { background:var(--rl-primary-light); padding:10px 16px; font-weight:700; font-size:14px; color:var(--rl-primary-dark); display:flex; align-items:center; gap:8px; }
.setup-section-body { padding:16px; }

/* チームカラーボタン */
.ss-color-btn {
    display: flex; align-items: center; gap: 8px;
    padding: 6px 12px; border-radius: var(--rl-radius);
    border: 2px solid var(--rl-border); background: var(--rl-surface);
    cursor: pointer; font-size: 13px; transition: border-color .15s, box-shadow .15s;
    opacity: .6;
}
.ss-color-btn:disabled { cursor: not-allowed; }
.ss-color-btn:not(:disabled):hover { opacity: .85; }
.ss-color-btn.ss-color-selected { border-color: var(--rl-primary); box-shadow: 0 0 0 2px rgba(37,99,235,.2); opacity: 1; }
.ss-color-swatch { width: 18px; height: 18px; border-radius: 4px; flex-shrink: 0; }
.ss-color-check { color: var(--rl-primary); font-size: 14px; display: none; }
.ss-color-btn.ss-color-selected .ss-color-check { display: inline-block; }