/* =========================================================
   AI審査システム 共通スタイル
   方針: Bootstrap標準ベース。審査員スマホ操作の視認性・誤操作防止を最優先。
   ========================================================= */

:root {
  --score-btn-size: 56px;
}

/* ---- 採点対象の固定ヘッダ（採点画面上部に常時表示）---- */
.team-banner {
  position: sticky;
  top: 0;
  z-index: 1020;
  background: #0d6efd;
  color: #fff;
  padding: .75rem 1rem;
  box-shadow: 0 2px 6px rgba(0, 0, 0, .15);
}
.team-banner .order-badge {
  font-size: .85rem;
  opacity: .9;
}
.team-banner .team-name {
  font-size: 1.25rem;
  font-weight: 700;
  line-height: 1.3;
}
.team-banner .theme-name {
  font-size: 1rem;
  opacity: .95;
}

/* ---- 点数ボタン（0〜5）。大きく・押しやすく・選択状態を明確に ---- */
.score-buttons {
  display: flex;
  flex-wrap: wrap;
  gap: .5rem;
}
.score-buttons .score-btn {
  width: var(--score-btn-size);
  height: var(--score-btn-size);
  font-size: 1.4rem;
  font-weight: 700;
  border: 2px solid #adb5bd;
  border-radius: 12px;
  background: #fff;
  color: #495057;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  user-select: none;
  transition: all .1s ease;
}
.score-buttons .score-btn:active {
  transform: scale(.95);
}
.score-buttons .score-btn.selected {
  background: #0d6efd;
  border-color: #0d6efd;
  color: #fff;
  box-shadow: 0 0 0 3px rgba(13, 110, 253, .25);
}

/* 未入力の採点項目を強調（提出前チェック用） */
.score-item.unfilled {
  border-left: 4px solid #ffc107;
}
.score-item {
  border-left: 4px solid transparent;
}

/* ---- コメントテンプレート選択（iPad前提: 大きくタップしやすく）---- */
.comment-tpl-check {
  padding: .35rem .5rem .35rem 2.2rem;
  margin-bottom: .35rem;
  border: 1px solid #dee2e6;
  border-radius: 10px;
  background: #fff;
}
.comment-tpl-check .form-check-input {
  width: 1.5rem;
  height: 1.5rem;
  margin-left: -1.7rem;
  margin-top: .1rem;
  cursor: pointer;
}
.comment-tpl-check .form-check-label {
  cursor: pointer;
  font-size: 1.05rem;
  padding-left: .35rem;
}
.comment-tpl-check:has(.form-check-input:checked) {
  background: #e7f1ff;
  border-color: #0d6efd;
}

/* ---- 進捗バッジ ---- */
.status-not_started { color: #6c757d; }
.status-draft       { color: #fd7e14; }
.status-submitted   { color: #198754; }
.status-locked      { color: #0d6efd; }

/* ---- viewer 結果発表（会場投影。文字大きく情報少なく）---- */
.result-stage {
  text-align: center;
  padding: 2rem 1rem;
}
.result-stage .rank {
  font-size: 2.5rem;
  font-weight: 800;
}
.result-stage .winner-team {
  font-size: 3rem;
  font-weight: 800;
}
.result-stage .winner-theme {
  font-size: 1.5rem;
  color: #495057;
}

/* ---- 結果発表スライドショー（会場投影・疑似PowerPoint）---- */
.ss-stage {
  position: fixed;
  inset: 0;
  background: radial-gradient(circle at 50% 30%, #1b3b6f 0%, #0d1b2a 70%);
  color: #fff;
  z-index: 2000;
  overflow: hidden;
}
.ss-slide {
  position: absolute;
  inset: 0;
  display: none;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  padding: 3vh 4vw 7vh;
}
.ss-slide.active { display: flex; animation: ss-fade .4s ease; }
@keyframes ss-fade { from { opacity: 0; transform: translateY(16px); } to { opacity: 1; transform: none; } }

.ss-event-title { font-size: clamp(1.3rem, 2.6vw, 2.3rem); opacity: .9; margin-bottom: .6rem; }
.ss-big-title   { font-size: clamp(2.8rem, 7vw, 6rem); font-weight: 800; line-height: 1.1; }
.ss-sub         { font-size: clamp(1.2rem, 2.4vw, 2rem); opacity: .85; margin-top: 1rem; }

.ss-rank        { font-size: clamp(3.2rem, 9vw, 7.5rem); font-weight: 800; letter-spacing: .05em; line-height: 1.05; }
.ss-rank-1 { color: #ffd700; text-shadow: 0 0 28px rgba(255,215,0,.55); }
.ss-rank-2 { color: #d0d6dd; }
.ss-rank-3 { color: #e29a5c; }
.ss-team        { font-size: clamp(2.4rem, 6.5vw, 5.4rem); font-weight: 800; margin-top: .5rem; }
.ss-theme       { font-size: clamp(1.4rem, 3.2vw, 2.4rem); opacity: .92; margin-top: .6rem; }
.ss-score       { font-size: clamp(1.7rem, 3.8vw, 2.8rem); margin-top: .9rem; }
.ss-score small { opacity: .7; font-size: .6em; }

.ss-comment {
  max-width: 84rem;
  margin: 1.8rem auto 0;
  font-size: clamp(1.4rem, 2.6vw, 2.3rem);
  line-height: 1.75;
}
.ss-points {
  list-style: none;
  padding: 0;
  margin: 1.1rem auto 0;
  max-width: 70rem;
  text-align: left;
}
.ss-points li {
  font-size: clamp(1.25rem, 2.3vw, 2rem);
  padding: .35rem 0 .35rem 2.3rem;
  position: relative;
  line-height: 1.45;
}
.ss-points li::before { content: "✓"; position: absolute; left: 0; color: #6ee7a8; font-weight: 700; }
.ss-col-title { font-size: clamp(1.4rem, 2.6vw, 2.1rem); font-weight: 700; margin-bottom: .3rem; }

/* ナビ・操作 */
.ss-nav {
  position: fixed;
  bottom: 2.5vh;
  left: 0; right: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 1.2rem;
  z-index: 2100;
}
.ss-nav .btn { border-radius: 999px; }
.ss-counter { color: rgba(255,255,255,.85); font-size: 1.1rem; min-width: 5rem; text-align: center; }
.ss-top-bar {
  position: fixed;
  top: 1.5vh; right: 1.5vw;
  z-index: 2100;
  display: flex; gap: .5rem;
}
.ss-hint {
  position: fixed; bottom: .6vh; left: 0; right: 0;
  text-align: center; color: rgba(255,255,255,.4); font-size: .85rem; z-index: 2100;
}

/* ---- スマホ向け微調整 ---- */
@media (max-width: 576px) {
  :root { --score-btn-size: 52px; }
  .team-banner .team-name { font-size: 1.1rem; }
}
