🎯 g5se 실시간 스포츠 토너먼트 브래킷 생성기 - 대진표 자동 생성 & 경기 결과 입력

g5se가 설치된 디렉터리(루트에 `index.php`·`app/`이 있는 곳)에서 작업을 시작합니다. (g5se 설치는 https://github.com/gnuboard/g5se 참고)

**목표**: 토너먼트 대회 목록 페이지를 만들고, modern shell을 적용하여 사이트 전체와 시각 일관성을 확보합니다.

**작업 내용**:

1. `app/modules/tournament/` 폴더 생성
2. `app/modules/tournament/index.php` 파일 생성 (대회 목록 페이지 진입점)
3. Modern shell 골격 적용:
   - `_common.php` 인클루드 (`./` 상대경로 사용)
   - `G5_THEME_PATH.'/modern/_head.inc.php'` require
   - `./head.sub.php` include
   - `<div class="m-shell">` + `_nav.inc.php` + `<main class="m-container">` + `_footer.inc.php` + `</div>`
   - `./tail.sub.php` include
4. 페이지 제목 "🏆 토너먼트 대회 목록" 표시
5. 임시 메시지: "대회 목록이 여기에 표시됩니다." (실제 DB 연동은 다음 단계)
6. 디자인 토큰 사용:
   - 배경: `var(--m-surface)`
   - 텍스트: `var(--m-text)`
   - 그림자: `var(--m-shadow)`
7. 상단에 "새 대회 만들기" 버튼 추가 (링크는 `/tournament/create`로, 아직 구현 안 됨)
   - 버튼 스타일: `background: #3b82f6; color: white; padding: 12px 24px; border-radius: var(--m-radius-lg); font-weight: 600;`
   - 로그인한 회원만 보이도록 조건부 렌더링 (`$is_member` 체크)

**주의사항**:
- 폴더 기반 자동 라우팅이므로 `app/router.php`에 라우트 등록 불필요
- `_common.php`/`head.sub.php`/`tail.sub.php`는 `app/` 루트에 있으므로 `./` 상대경로로 인클루드
- `G5_THEME_PATH`는 `_common.php` 인클루드 시점에 정의됨
- 진입 가드 `define('_GNUBOARD_', true);`는 루트 `index.php`가 이미 처리하므로 페이지에서 재정의 금지

**예상 결과**: `/tournament` 접속 시 modern shell이 적용된 페이지가 표시되고, 상단 네비게이션/다크모드 토글/Pretendard 폰트가 자동으로 적용됩니다. 로그인한 회원은 "새 대회 만들기" 버튼이 보입니다.

**목표**: SQLite 데이터베이스를 생성하고, 대회·참가자·매치 테이블 스키마를 자동 초기화합니다.

**작업 내용**:

1. `app/modules/tournament/index.php` 상단(로직 영역)에 DB 연결 코드 추가:
   ```php
   // SQLite 파일 경로
   $db_dir = G5_DATA_PATH.'/modules';
   @mkdir($db_dir, 0707, true); // 디렉터리 없으면 생성
   $db_path = $db_dir.'/tournament.sqlite';
   
   // PDO 연결
   try {
       $pdo = new PDO('sqlite:'.$db_path);
       $pdo->setAttribute(PDO::ATTR_ERRMODE, PDO::ERRMODE_EXCEPTION);
   } catch (PDOException $e) {
       die('DB 연결 실패: '.$e->getMessage());
   }
   
   // 테이블 자동 생성 (첫 접근 시)
   $pdo->exec("
       CREATE TABLE IF NOT EXISTS tournaments (
           id INTEGER PRIMARY KEY AUTOINCREMENT,
           title TEXT NOT NULL,
           sport TEXT NOT NULL,
           format TEXT NOT NULL,
           status TEXT DEFAULT 'ongoing',
           slug TEXT UNIQUE NOT NULL,
           created_by INTEGER,
           created_at TEXT DEFAULT CURRENT_TIMESTAMP
       )
   ");
   
   $pdo->exec("
       CREATE TABLE IF NOT EXISTS participants (
           id INTEGER PRIMARY KEY AUTOINCREMENT,
           tournament_id INTEGER NOT NULL,
           name TEXT NOT NULL,
           seed INTEGER,
           FOREIGN KEY (tournament_id) REFERENCES tournaments(id) ON DELETE CASCADE
       )
   ");
   
   $pdo->exec("
       CREATE TABLE IF NOT EXISTS matches (
           id INTEGER PRIMARY KEY AUTOINCREMENT,
           tournament_id INTEGER NOT NULL,
           round INTEGER NOT NULL,
           bracket TEXT DEFAULT 'winner',
           position INTEGER NOT NULL,
           player1_id INTEGER,
           player2_id INTEGER,
           score1 INTEGER,
           score2 INTEGER,
           winner_id INTEGER,
           next_match_id INTEGER,
           played_at TEXT,
           FOREIGN KEY (tournament_id) REFERENCES tournaments(id) ON DELETE CASCADE,
           FOREIGN KEY (player1_id) REFERENCES participants(id),
           FOREIGN KEY (player2_id) REFERENCES participants(id),
           FOREIGN KEY (winner_id) REFERENCES participants(id)
       )
   ");
   ```

2. 대회 목록 조회 쿼리 추가:
   ```php
   $stmt = $pdo->query("SELECT * FROM tournaments ORDER BY created_at DESC");
   $tournaments = $stmt->fetchAll(PDO::FETCH_ASSOC);
   ```

3. HTML 본문에서 대회 목록 렌더링:
   - 대회가 없을 경우: "아직 생성된 대회가 없습니다. 첫 대회를 만들어보세요!" 메시지
   - 대회가 있을 경우: 각 대회를 카드 형태로 표시
     - 카드 내용: 대회명, 종목, 상태(진행 중/완료), 생성 날짜
     - 카드 스타일: `background: var(--m-surface); padding: 20px; border-radius: var(--m-radius-lg); box-shadow: var(--m-shadow); margin-bottom: 16px;`
     - "대진표 보기" 버튼: `/tournament/view/{slug}` 링크 (다음 단계에서 구현)

4. 상태 배지 스타일:
   - 진행 중: `background: #3b82f6; color: white; padding: 4px 12px; border-radius: 12px; font-size: 12px;`
   - 완료: `background: #10b981; color: white;`

**주의사항**:
- `G5_DATA_PATH`는 `_common.php`에서 정의된 g5se 데이터 디렉터리 상수
- `@mkdir()`의 `@`는 이미 디렉터리가 있을 때 경고를 무시
- SQLite 파일은 웹 루트 밖에 위치하므로 직접 접근 불가 (보안)
- 쿼리 결과는 `htmlspecialchars()`로 이스케이프하여 XSS 방지

**예상 결과**: 페이지 새로고침 시 DB가 자동 생성되고, 대회 목록이 표시됩니다. 초기에는 "아직 생성된 대회가 없습니다" 메시지가 보입니다.

**목표**: 대회 생성 폼 페이지를 만들고, 참가자 명단 입력·토너먼트 형식 선택 기능을 구현합니다.

**작업 내용**:

1. `app/modules/tournament/create/index.php` 파일 생성 (폴더 자동 라우팅으로 `/tournament/create` URL 매핑)
2. Modern shell 골격 적용 (이전 단계와 동일)
3. 로그인 체크:
   ```php
   if (!$is_member) {
       alert('로그인이 필요합니다.');
       goto_url(G5_BBS_URL.'/login.php?url='.urlencode('/tournament/create'));
   }
   ```

4. 대회 생성 폼 구현:
   - 대회명 입력란 (`<input type="text" name="title" required>`)
   - 종목 입력란 (`<input type="text" name="sport" placeholder="예: 축구, 리그 오브 레전드" required>`)
   - 토너먼트 형식 선택 (`<select name="format">`)
     - 옵션: `single` (싱글 엘리미네이션), `double` (더블 엘리미네이션)
   - 참가자 명단 입력 (`<textarea name="participants" rows="10" placeholder="한 줄에 한 명씩 입력하세요" required>`)
   - 제출 버튼: "대회 생성하기" (`background: #10b981; color: white; padding: 12px 32px; border: none; border-radius: var(--m-radius-lg); font-weight: 600; cursor: pointer;`)

5. 폼 제출 처리 (POST 요청 시):
   ```php
   if ($_SERVER['REQUEST_METHOD'] === 'POST') {
       $title = trim($_POST['title']);
       $sport = trim($_POST['sport']);
       $format = $_POST['format'];
       $participants_raw = trim($_POST['participants']);
       
       // 참가자 명단 파싱 (줄바꿈으로 분리)
       $participants = array_filter(array_map('trim', explode("\n", $participants_raw)));
       
       if (count($participants) < 2) {
           alert('참가자는 최소 2명 이상이어야 합니다.');
           goto_url('/tournament/create');
       }
       
       // 고유 slug 생성 (랜덤 8자리 영숫자)
       $slug = bin2hex(random_bytes(4));
       
       // 트랜잭션 시작
       $pdo->beginTransaction();
       
       try {
           // tournaments 테이블에 삽입
           $stmt = $pdo->prepare("INSERT INTO tournaments (title, sport, format, slug, created_by) VALUES (?, ?, ?, ?, ?)");
           $stmt->execute([$title, $sport, $format, $slug, $member['mb_no']]);
           $tournament_id = $pdo->lastInsertId();
           
           // participants 테이블에 삽입 (시드 순서는 입력 순서)
           $stmt = $pdo->prepare("INSERT INTO participants (tournament_id, name, seed) VALUES (?, ?, ?)");
           foreach ($participants as $idx => $name) {
               $stmt->execute([$tournament_id, $name, $idx + 1]);
           }
           
           $pdo->commit();
           
           // 대진표 페이지로 리다이렉트
           goto_url('/tournament/view/'.$slug);
       } catch (Exception $e) {
           $pdo->rollBack();
           alert('대회 생성 실패: '.$e->getMessage());
           goto_url('/tournament/create');
       }
   }
   ```

6. 폼 스타일:
   - 입력란: `width: 100%; padding: 12px; border: 1px solid #ddd; border-radius: var(--m-radius-lg); background: var(--m-surface); color: var(--m-text);`
   - 라벨: `display: block; margin-bottom: 8px; font-weight: 600; color: var(--m-text);`
   - 폼 컨테이너: `max-width: 600px; margin: 0 auto;`

**주의사항**:
- `goto_url()`과 `alert()`는 g5se의 헬퍼 함수 (`_common.php`에서 로드)
- `$member['mb_no']`는 로그인한 회원 번호
- `random_bytes(4)`로 8자리 hex slug 생성 (충돌 확률 극히 낮음)
- 트랜잭션으로 대회·참가자 삽입을 원자적으로 처리

**예상 결과**: `/tournament/create` 접속 시 폼이 표시되고, 제출 시 DB에 대회·참가자가 저장된 후 대진표 페이지로 리다이렉트됩니다.

**목표**: 싱글 엘리미네이션 브래킷 자동 생성 알고리즘을 구현하고, 초기 매치 데이터를 DB에 저장합니다.

**작업 내용**:

1. `app/modules/tournament/create/index.php`의 대회 생성 로직 수정 (참가자 삽입 후):
   ```php
   // 싱글 엘리미네이션 브래킷 생성 (더블은 다음 단계에서 확장)
   if ($format === 'single') {
       // 참가자 수
       $n = count($participants);
       
       // 총 라운드 수 계산 (2^k >= n인 최소 k)
       $total_rounds = (int)ceil(log($n, 2));
       
       // 첫 라운드 매치 수 (부전승 제외한 실제 경기 수)
       $first_round_matches = (int)pow(2, $total_rounds - 1);
       $byes = $first_round_matches * 2 - $n; // 부전승 수
       
       // 참가자 ID 배열 가져오기
       $stmt = $pdo->prepare("SELECT id FROM participants WHERE tournament_id = ? ORDER BY seed");
       $stmt->execute([$tournament_id]);
       $participant_ids = $stmt->fetchAll(PDO::FETCH_COLUMN);
       
       // 부전승 배정: 상위 시드에게 우선 배정 (player2_id = NULL)
       $matches_data = [];
       $match_position = 0;
       
       for ($i = 0; $i < $first_round_matches; $i++) {
           $p1_idx = $i * 2;
           $p2_idx = $i * 2 + 1;
           
           $p1_id = $participant_ids[$p1_idx] ?? null;
           $p2_id = ($p2_idx < $n) ? $participant_ids[$p2_idx] : null;
           
           // 부전승 처리: p2가 없으면 p1이 자동 승리
           if ($p2_id === null && $p1_id !== null) {
               $winner_id = $p1_id;
               $score1 = null;
               $score2 = null;
           } else {
               $winner_id = null;
               $score1 = null;
               $score2 = null;
           }
           
           $matches_data[] = [
               'round' => $total_rounds,
               'position' => $match_position++,
               'player1_id' => $p1_id,
               'player2_id' => $p2_id,
               'winner_id' => $winner_id,
               'score1' => $score1,
               'score2' => $score2,
           ];
       }
       
       // 상위 라운드 매치 생성 (빈 슬롯)
       for ($round = $total_rounds - 1; $round >= 1; $round--) {
           $round_matches = (int)pow(2, $round - 1);
           for ($i = 0; $i < $round_matches; $i++) {
               $matches_data[] = [
                   'round' => $round,
                   'position' => $i,
                   'player1_id' => null,
                   'player2_id' => null,
                   'winner_id' => null,
                   'score1' => null,
                   'score2' => null,
               ];
           }
       }
       
       // matches 테이블에 삽입
       $stmt = $pdo->prepare("INSERT INTO matches (tournament_id, round, bracket, position, player1_id, player2_id, winner_id, score1, score2) VALUES (?, ?, 'winner', ?, ?, ?, ?, ?, ?)");
       foreach ($matches_data as $match) {
           $stmt->execute([
               $tournament_id,
               $match['round'],
               $match['position'],
               $match['player1_id'],
               $match['player2_id'],
               $match['winner_id'],
               $match['score1'],
               $match['score2'],
           ]);
       }
       
       // next_match_id 연결 (하위 라운드 승자가 진출할 상위 라운드 매치)
       // 예: 1라운드 매치 0, 1 → 2라운드 매치 0으로 진출
       for ($round = $total_rounds; $round >= 2; $round--) {
           $current_matches = $pdo->query("SELECT id FROM matches WHERE tournament_id = {$tournament_id} AND round = {$round} ORDER BY position")->fetchAll(PDO::FETCH_COLUMN);
           $next_matches = $pdo->query("SELECT id FROM matches WHERE tournament_id = {$tournament_id} AND round = ".($round - 1)." ORDER BY position")->fetchAll(PDO::FETCH_COLUMN);
           
           foreach ($current_matches as $idx => $match_id) {
               $next_match_id = $next_matches[(int)floor($idx / 2)] ?? null;
               if ($next_match_id) {
                   $pdo->exec("UPDATE matches SET next_match_id = {$next_match_id} WHERE id = {$match_id}");
               }
           }
       }
   }
   ```

2. 부전승 자동 진출 처리:
   - `winner_id`가 이미 설정된 매치(부전승)는 다음 라운드로 즉시 진출
   - 진출 로직은 별도 함수로 분리 (다음 단계에서 재사용)

**주의사항**:
- 라운드 번호는 역순 (결승=1, 준결승=2, ...)
- `position`은 같은 라운드 내 매치 순서 (0부터 시작)
- 부전승은 `player2_id = NULL`로 표현
- `next_match_id` 연결은 트리 구조의 부모-자식 관계를 나타냄

**예상 결과**: 대회 생성 시 모든 라운드의 매치가 자동으로 생성되고, 부전승 참가자는 다음 라운드에 자동 배정됩니다.

**목표**: 대진표 조회 페이지를 만들고, SVG 기반 브래킷 트리를 렌더링합니다.

**작업 내용**:

1. `app/modules/tournament/view/[slug]/index.php` 파일 생성 (동적 segment)
2. Modern shell 골격 적용
3. `$_GET['slug']`로 대회 조회:
   ```php
   $slug = $_GET['slug'] ?? '';
   $stmt = $pdo->prepare("SELECT * FROM tournaments WHERE slug = ?");
   $stmt->execute([$slug]);
   $tournament = $stmt->fetch(PDO::FETCH_ASSOC);
   
   if (!$tournament) {
       alert('존재하지 않는 대회입니다.');
       goto_url('/tournament');
   }
   
   $tournament_id = $tournament['id'];
   ```

4. 매치·참가자 데이터 조회:
   ```php
   // 매치 데이터 (라운드별 정렬)
   $stmt = $pdo->prepare("SELECT * FROM matches WHERE tournament_id = ? ORDER BY round DESC, position");
   $stmt->execute([$tournament_id]);
   $matches = $stmt->fetchAll(PDO::FETCH_ASSOC);
   
   // 참가자 ID → 이름 매핑
   $stmt = $pdo->prepare("SELECT id, name FROM participants WHERE tournament_id = ?");
   $stmt->execute([$tournament_id]);
   $participants = [];
   foreach ($stmt->fetchAll(PDO::FETCH_ASSOC) as $p) {
       $participants[$p['id']] = $p['name'];
   }
   ```

5. SVG 브래킷 렌더링 함수 작성:
   ```php
   function renderBracket($matches, $participants) {
       $rounds = [];
       foreach ($matches as $m) {
           $rounds[$m['round']][] = $m;
       }
       ksort($rounds); // 라운드 번호 오름차순 정렬 (결승부터)
       
       $svg_width = count($rounds) * 250;
       $svg_height = max(array_map('count', $rounds)) * 120;
       
       $svg = '<svg width="'.$svg_width.'" height="'.$svg_height.'" style="overflow: visible;">';
       
       $x = 50;
       foreach ($rounds as $round => $round_matches) {
           $y = 50;
           foreach ($round_matches as $match) {
               $p1_name = $match['player1_id'] ? htmlspecialchars($participants[$match['player1_id']]) : 'TBD';
               $p2_name = $match['player2_id'] ? htmlspecialchars($participants[$match['player2_id']]) : 'Bye';
               
               $p1_score = $match['score1'] !== null ? $match['score1'] : '-';
               $p2_score = $match['score2'] !== null ? $match['score2'] : '-';
               
               $winner_id = $match['winner_id'];
               $p1_class = ($winner_id && $winner_id == $match['player1_id']) ? 'winner' : '';
               $p2_class = ($winner_id && $winner_id == $match['player2_id']) ? 'winner' : '';
               
               // 매치 카드 (foreignObject로 HTML 삽입)
               $svg .= '<foreignObject x="'.$x.'" y="'.$y.'" width="200" height="100">';
               $svg .= '<div xmlns="http://www.w3.org/1999/xhtml" style="background: var(--m-surface); border: 2px solid #ddd; border-radius: 8px; padding: 8px; box-shadow: var(--m-shadow);">';
               $svg .= '<div style="display: flex; justify-content: space-between; margin-bottom: 4px; '.($p1_class ? 'font-weight: bold; color: #10b981;' : '').'">';
               $svg .= '<span>'.$p1_name.'</span><span>'.$p1_score.'</span>';
               $svg .= '</div>';
               $svg .= '<div style="display: flex; justify-content: space-between; '.($p2_class ? 'font-weight: bold; color: #10b981;' : '').'">';
               $svg .= '<span>'.$p2_name.'</span><span>'.$p2_score.'</span>';
               $svg .= '</div>';
               $svg .= '</div>';
               $svg .= '</foreignObject>';
               
               $y += 120;
           }
           $x += 250;
       }
       
       $svg .= '</svg>';
       return $svg;
   }
   ```

6. HTML 본문에 대진표 출력:
   ```php
   <div style="overflow-x: auto; padding: 20px;">
       <?php echo renderBracket($matches, $participants); ?>
   </div>
   ```

7. 관리자 전용 "결과 입력" UI (다음 단계에서 구현):
   - 로그인한 회원이 대회 생성자일 경우 각 매치 카드에 "결과 입력" 버튼 추가

**주의사항**:
- SVG `foreignObject`로 HTML을 삽입하여 스타일 적용 가능
- 모바일에서 가로 스크롤 가능하도록 `overflow-x: auto`
- 승자는 굵은 글씨 + 초록색으로 하이라이트
- 부전승(Bye)은 회색으로 표시

**예상 결과**: `/tournament/view/{slug}` 접속 시 대진표가 SVG로 렌더링되고, 매치 카드가 라운드별로 배치됩니다.

**목표**: 경기 결과 입력 기능을 구현하고, AJAX로 비동기 업데이트합니다.

**작업 내용**:

1. `app/modules/tournament/view/[slug]/index.php`에 AJAX 엔드포인트 추가 (페이지 상단):
   ```php
   // AJAX 요청 처리
   if ($_SERVER['REQUEST_METHOD'] === 'POST' && isset($_POST['action']) && $_POST['action'] === 'update_match') {
       header('Content-Type: application/json');
       
       // 권한 체크
       if (!$is_member || $tournament['created_by'] != $member['mb_no']) {
           echo json_encode(['success' => false, 'message' => '권한이 없습니다.']);
           exit;
       }
       
       $match_id = (int)$_POST['match_id'];
       $score1 = (int)$_POST['score1'];
       $score2 = (int)$_POST['score2'];
       
       // 매치 조회
       $stmt = $pdo->prepare("SELECT * FROM matches WHERE id = ? AND tournament_id = ?");
       $stmt->execute([$match_id, $tournament_id]);
       $match = $stmt->fetch(PDO::FETCH_ASSOC);
       
       if (!$match || !$match['player1_id'] || !$match['player2_id']) {
           echo json_encode(['success' => false, 'message' => '유효하지 않은 매치입니다.']);
           exit;
       }
       
       // 승자 판정
       $winner_id = ($score1 > $score2) ? $match['player1_id'] : $match['player2_id'];
       
       // 매치 업데이트
       $stmt = $pdo->prepare("UPDATE matches SET score1 = ?, score2 = ?, winner_id = ?, played_at = CURRENT_TIMESTAMP WHERE id = ?");
       $stmt->execute([$score1, $score2, $winner_id, $match_id]);
       
       // 다음 라운드 진출자 배정
       if ($match['next_match_id']) {
           $stmt = $pdo->prepare("SELECT * FROM matches WHERE id = ?");
           $stmt->execute([$match['next_match_id']]);
           $next_match = $stmt->fetch(PDO::FETCH_ASSOC);
           
           // 현재 매치가 다음 매치의 왼쪽 자식이면 player1_id에, 오른쪽이면 player2_id에 배정
           // position으로 판단: 짝수면 왼쪽, 홀수면 오른쪽
           if ($match['position'] % 2 === 0) {
               $pdo->prepare("UPDATE matches SET player1_id = ? WHERE id = ?")->execute([$winner_id, $match['next_match_id']]);
           } else {
               $pdo->prepare("UPDATE matches SET player2_id = ? WHERE id = ?")->execute([$winner_id, $match['next_match_id']]);
           }
       }
       
       echo json_encode(['success' => true, 'winner_id' => $winner_id]);
       exit;
   }
   ```

2. 매치 카드에 "결과 입력" 버튼 추가 (권한 있는 경우만):
   ```php
   // renderBracket 함수 내 매치 카드에 추가
   if ($is_member && $tournament['created_by'] == $member['mb_no'] && !$match['winner_id'] && $match['player1_id'] && $match['player2_id']) {
       $svg .= '<button onclick="openMatchModal('.$match['id'].')" style="width: 100%; margin-top: 8px; padding: 6px; background: #3b82f6; color: white; border: none; border-radius: 4px; cursor: pointer; font-size: 12px;">결과 입력</button>';
   }
   ```

3. 결과 입력 모달 HTML 추가 (페이지 하단):
   ```html
   <div id="matchModal" style="display: none; position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0,0,0,0.5); z-index: 1000; justify-content: center; align-items: center;">
       <div style="background: var(--m-surface); padding: 32px; border-radius: var(--m-radius-lg); box-shadow: var(--m-shadow); max-width: 400px; width: 90%;">
           <h3 style="margin-top: 0; color: var(--m-text);">경기 결과 입력</h3>
           <form id="matchForm">
               <input type="hidden" id="matchId" name="match_id">
               <div style="margin-bottom: 16px;">
                   <label style="display: block; margin-bottom: 8px; color: var(--m-text);">참가자 1 점수</label>
                   <input type="number" id="score1" name="score1" min="0" required style="width: 100%; padding: 12px; border: 1px solid #ddd; border-radius: 8px; background: var(--m-surface); color: var(--m-text);">
               </div>
               <div style="margin-bottom: 16px;">
                   <label style="display: block; margin-bottom: 8px; color: var(--m-text);">참가자 2 점수</label>
                   <input type="number" id="score2" name="score2" min="0" required style="width: 100%; padding: 12px; border: 1px solid #ddd; border-radius: 8px; background: var(--m-surface); color: var(--m-text);">
               </div>
               <div style="display: flex; gap: 12px;">
                   <button type="submit" style="flex: 1; padding: 12px; background: #10b981; color: white; border: none; border-radius: 8px; font-weight: 600; cursor: pointer;">제출</button>
                   <button type="button" onclick="closeMatchModal()" style="flex: 1; padding: 12px; background: #6b7280; color: white; border: none; border-radius: 8px; font-weight: 600; cursor: pointer;">취소</button>
               </div>
           </form>
       </div>
   </div>
   ```

4. JavaScript 추가 (페이지 하단):
   ```javascript
   <script>
   function openMatchModal(matchId) {
       document.getElementById('matchId').value = matchId;
       document.getElementById('matchModal').style.display = 'flex';
   }
   
   function closeMatchModal() {
       document.getElementById('matchModal').style.display = 'none';
       document.getElementById('matchForm').reset();
   }
   
   document.getElementById('matchForm').addEventListener('submit', async (e) => {
       e.preventDefault();
       
       const formData = new FormData(e.target);
       formData.append('action', 'update_match');
       
       const response = await fetch(window.location.href, {
           method: 'POST',
           body: formData
       });
       
       const result = await response.json();
       
       if (result.success) {
           alert('결과가 저장되었습니다.');
           location.reload(); // 페이지 새로고침 (다음 단계에서 부분 업데이트로 개선)
       } else {
           alert('오류: ' + result.message);
       }
       
       closeMatchModal();
   });
   </script>
   ```

**주의사항**:
- AJAX 엔드포인트는 같은 페이지에서 POST 요청으로 처리
- 권한 체크: 대회 생성자만 결과 입력 가능
- 승자 판정은 단순 점수 비교 (동점 처리는 보너스)
- 다음 라운드 진출자는 `position % 2`로 왼쪽/오른쪽 구분

**예상 결과**: 관리자가 "결과 입력" 버튼 클릭 시 모달이 열리고, 점수 입력 후 제출하면 DB 업데이트 및 페이지 새로고침으로 대진표 갱신됩니다.

**목표**: 결과 입력 후 페이지 새로고침 없이 대진표를 실시간 업데이트하고, 승자 애니메이션을 추가합니다.

**작업 내용**:

1. AJAX 응답에 업데이트된 매치 정보 포함:
   ```php
   // AJAX 엔드포인트 수정 (이전 단계 코드에 추가)
   // 업데이트된 매치와 다음 매치 정보 반환
   $stmt = $pdo->prepare("SELECT * FROM matches WHERE id = ?");
   $stmt->execute([$match_id]);
   $updated_match = $stmt->fetch(PDO::FETCH_ASSOC);
   
   $next_match_data = null;
   if ($match['next_match_id']) {
       $stmt->execute([$match['next_match_id']]);
       $next_match_data = $stmt->fetch(PDO::FETCH_ASSOC);
   }
   
   echo json_encode([
       'success' => true,
       'updated_match' => $updated_match,
       'next_match' => $next_match_data,
       'participants' => $participants
   ]);
   ```

2. JavaScript에서 DOM 업데이트 로직 추가:
   ```javascript
   // matchForm submit 이벤트 핸들러 수정
   if (result.success) {
       const { updated_match, next_match, participants } = result;
       
       // 현재 매치 카드 업데이트
       updateMatchCard(updated_match, participants);
       
       // 다음 매치 카드 업데이트 (진출자 표시)
       if (next_match) {
           updateMatchCard(next_match, participants);
       }
       
       // 승자 애니메이션
       animateWinner(updated_match.id, updated_match.winner_id);
       
       closeMatchModal();
   }
   
   function updateMatchCard(match, participants) {
       const card = document.querySelector(`[data-match-id="${match.id}"]`);
       if (!card) return;
       
       const p1Name = match.player1_id ? participants[match.player1_id] : 'TBD';
       const p2Name = match.player2_id ? participants[match.player2_id] : 'Bye';
       const p1Score = match.score1 !== null ? match.score1 : '-';
       const p2Score = match.score2 !== null ? match.score2 : '-';
       
       const p1Winner = match.winner_id && match.winner_id == match.player1_id;
       const p2Winner = match.winner_id && match.winner_id == match.player2_id;
       
       card.innerHTML = `
           <div style="display: flex; justify-content: space-between; margin-bottom: 4px; ${p1Winner ? 'font-weight: bold; color: #10b981;' : ''}">
               <span>${p1Name}</span><span>${p1Score}</span>
           </div>
           <div style="display: flex; justify-content: space-between; ${p2Winner ? 'font-weight: bold; color: #10b981;' : ''}">
               <span>${p2Name}</span><span>${p2Score}</span>
           </div>
       `;
   }
   
   function animateWinner(matchId, winnerId) {
       const card = document.querySelector(`[data-match-id="${matchId}"]`);
       if (!card) return;
       
       card.style.transition = 'transform 0.3s ease, box-shadow 0.3s ease';
       card.style.transform = 'scale(1.05)';
       card.style.boxShadow = '0 8px 24px rgba(16, 185, 129, 0.3)';
       
       setTimeout(() => {
           card.style.transform = 'scale(1)';
           card.style.boxShadow = '';
       }, 500);
   }
   ```

3. SVG 렌더링 시 `data-match-id` 속성 추가:
   ```php
   // renderBracket 함수 내 foreignObject에 추가
   $svg .= '<foreignObject x="'.$x.'" y="'.$y.'" width="200" height="100">';
   $svg .= '<div xmlns="http://www.w3.org/1999/xhtml" data-match-id="'.$match['id'].'" style="...">';
   ```

4. 참가자 데이터를 JavaScript로 전달:
   ```php
   // 페이지 하단 script 태그 전에 추가
   <script>
   const participantsData = <?php echo json_encode($participants); ?>;
   </script>
   ```

**주의사항**:
- `data-match-id` 속성으로 DOM 요소를 식별
- 애니메이션은 CSS `transform`과 `box-shadow` 사용
- JavaScript 객체로 참가자 데이터를 전달하여 클라이언트에서 재사용

**예상 결과**: 결과 입력 후 페이지 새로고침 없이 매치 카드가 업데이트되고, 승자 카드가 확대·강조 애니메이션으로 표시됩니다.

**목표**: 더블 엘리미네이션(패자부활전) 브래킷 생성 로직을 추가하고, 승자/패자 브래킷을 동시 렌더링합니다.

**작업 내용**:

1. `app/modules/tournament/create/index.php`의 브래킷 생성 로직 확장:
   ```php
   // 더블 엘리미네이션 브래킷 생성
   if ($format === 'double') {
       // 싱글 엘리미네이션과 동일하게 승자 브래킷 생성
       // ... (이전 단계 코드 재사용)
       
       // 패자 브래킷 생성
       // 패자 브래킷은 승자 브래킷의 각 라운드 패자가 진출
       // 패자 브래킷 라운드 수 = (승자 브래킷 라운드 수 - 1) * 2
       $loser_rounds = ($total_rounds - 1) * 2;
       
       // 패자 브래킷 1라운드: 승자 브래킷 1라운드 패자들이 경기
       $loser_match_position = 0;
       for ($i = 0; $i < $first_round_matches / 2; $i++) {
           $matches_data[] = [
               'round' => $loser_rounds,
               'bracket' => 'loser',
               'position' => $loser_match_position++,
               'player1_id' => null, // 승자 브래킷 1라운드 패자가 채움
               'player2_id' => null,
               'winner_id' => null,
               'score1' => null,
               'score2' => null,
           ];
       }
       
       // 패자 브래킷 상위 라운드 생성 (빈 슬롯)
       for ($round = $loser_rounds - 1; $round >= 1; $round--) {
           $round_matches = (int)pow(2, (int)floor($round / 2));
           for ($i = 0; $i < $round_matches; $i++) {
               $matches_data[] = [
                   'round' => $round,
                   'bracket' => 'loser',
                   'position' => $i,
                   'player1_id' => null,
                   'player2_id' => null,
                   'winner_id' => null,
                   'score1' => null,
                   'score2' => null,
               ];
           }
       }
       
       // 승자 브래킷 패자가 패자 브래킷으로 떨어지는 연결 설정
       // (복잡한 로직이므로 간소화: 매치 업데이트 시 동적 처리)
   }
   ```

2. 결과 입력 시 패자를 패자 브래킷으로 이동:
   ```php
   // AJAX 엔드포인트 수정 (매치 업데이트 후)
   if ($tournament['format'] === 'double' && $match['bracket'] === 'winner') {
       // 패자 ID
       $loser_id = ($winner_id == $match['player1_id']) ? $match['player2_id'] : $match['player1_id'];
       
       // 패자 브래킷의 해당 라운드 첫 빈 슬롯에 배정
       $loser_round = ($match['round'] - 1) * 2; // 승자 브래킷 라운드에 대응하는 패자 브래킷 라운드
       $stmt = $pdo->prepare("SELECT * FROM matches WHERE tournament_id = ? AND bracket = 'loser' AND round = ? AND (player1_id IS NULL OR player2_id IS NULL) ORDER BY position LIMIT 1");
       $stmt->execute([$tournament_id, $loser_round]);
       $loser_match = $stmt->fetch(PDO::FETCH_ASSOC);
       
       if ($loser_match) {
           if ($loser_match['player1_id'] === null) {
               $pdo->prepare("UPDATE matches SET player1_id = ? WHERE id = ?")->execute([$loser_id, $loser_match['id']]);
           } else {
               $pdo->prepare("UPDATE matches SET player2_id = ? WHERE id = ?")->execute([$loser_id, $loser_match['id']]);
           }
       }
   }
   ```

3. SVG 렌더링에서 패자 브래킷 추가:
   ```php
   // renderBracket 함수 수정
   function renderBracket($matches, $participants, $format) {
       $winner_matches = array_filter($matches, fn($m) => $m['bracket'] === 'winner');
       $loser_matches = array_filter($matches, fn($m) => $m['bracket'] === 'loser');
       
       $svg = '';
       
       // 승자 브래킷 렌더링
       $svg .= '<text x="10" y="30" style="font-size: 20px; font-weight: bold; fill: var(--m-text);">승자 브래킷</text>';
       $svg .= renderBracketTree($winner_matches, $participants, 0, 50);
       
       // 더블 엘리미네이션인 경우 패자 브래킷 추가
       if ($format === 'double' && count($loser_matches) > 0) {
           $svg .= '<text x="10" y="'.($svg_height / 2 + 30).'" style="font-size: 20px; font-weight: bold; fill: var(--m-text);">패자 브래킷</text>';
           $svg .= renderBracketTree($loser_matches, $participants, 0, $svg_height / 2 + 50);
       }
       
       return '<svg width="'.$svg_width.'" height="'.$svg_height.'" style="overflow: visible;">'.$svg.'</svg>';
   }
   
   function renderBracketTree($matches, $participants, $offset_x, $offset_y) {
       // 기존 렌더링 로직 재사용 (offset_x, offset_y로 위치 조정)
       // ...
   }
   ```

**주의사항**:
- 패자 브래킷은 승자 브래킷 아래에 별도 레이어로 렌더링
- 패자 브래킷 라운드 수는 승자 브래킷의 2배 - 1
- 승자 브래킷 패자가 패자 브래킷으로 이동하는 로직은 복잡하므로 간소화 (실무에서는 더 정교한 매핑 필요)

**예상 결과**: 더블 엘리미네이션 대회 생성 시 승자/패자 브래킷이 모두 생성되고, 승자 브래킷 패자가 패자 브래킷으로 자동 이동합니다.

**목표**: 대회 삭제 기능과 완료 상태 자동 감지를 추가하고, 대회 목록 페이지를 개선합니다.

**작업 내용**:

1. 대회 삭제 기능 추가 (`app/modules/tournament/view/[slug]/index.php`):
   ```php
   // 페이지 상단에 삭제 처리 로직 추가
   if ($_SERVER['REQUEST_METHOD'] === 'POST' && isset($_POST['action']) && $_POST['action'] === 'delete_tournament') {
       if (!$is_member || $tournament['created_by'] != $member['mb_no']) {
           alert('권한이 없습니다.');
           goto_url('/tournament');
       }
       
       // CASCADE로 참가자·매치 자동 삭제
       $stmt = $pdo->prepare("DELETE FROM tournaments WHERE id = ?");
       $stmt->execute([$tournament_id]);
       
       alert('대회가 삭제되었습니다.');
       goto_url('/tournament');
   }
   ```

2. 삭제 버튼 추가 (관리자 전용):
   ```php
   // HTML 본문 상단에 추가
   <?php if ($is_member && $tournament['created_by'] == $member['mb_no']): ?>
       <form method="post" onsubmit="return confirm('정말 삭제하시겠습니까?');" style="margin-bottom: 20px;">
           <input type="hidden" name="action" value="delete_tournament">
           <button type="submit" style="padding: 8px 16px; background: #ef4444; color: white; border: none; border-radius: var(--m-radius-lg); cursor: pointer;">대회 삭제</button>
       </form>
   <?php endif; ?>
   ```

3. 대회 완료 상태 자동 감지:
   ```php
   // 결과 입력 후 대회 완료 여부 체크
   // 결승전(round = 1) 승자가 결정되면 대회 완료
   $stmt = $pdo->prepare("SELECT * FROM matches WHERE tournament_id = ? AND round = 1 AND bracket = 'winner'");
   $stmt->execute([$tournament_id]);
   $final_match = $stmt->fetch(PDO::FETCH_ASSOC);
   
   if ($final_match && $final_match['winner_id']) {
       $pdo->prepare("UPDATE tournaments SET status = 'completed' WHERE id = ?")->execute([$tournament_id]);
   }
   ```

4. 대회 목록 페이지 개선 (`app/modules/tournament/index.php`):
   ```php
   // 필터링 UI 추가
   $filter = $_GET['filter'] ?? 'all'; // 'all', 'ongoing', 'completed'
   
   $query = "SELECT * FROM tournaments";
   if ($filter === 'ongoing') {
       $query .= " WHERE status = 'ongoing'";
   } elseif ($filter === 'completed') {
       $query .= " WHERE status = 'completed'";
   }
   $query .= " ORDER BY created_at DESC";
   
   $tournaments = $pdo->query($query)->fetchAll(PDO::FETCH_ASSOC);
   ```

5. 필터 버튼 추가:
   ```html
   <div style="margin-bottom: 20px; display: flex; gap: 12px;">
       <a href="/tournament?filter=all" style="padding: 8px 16px; background: <?php echo $filter === 'all' ? '#3b82f6' : '#6b7280'; ?>; color: white; border-radius: var(--m-radius-lg); text-decoration: none;">전체</a>
       <a href="/tournament?filter=ongoing" style="padding: 8px 16px; background: <?php echo $filter === 'ongoing' ? '#3b82f6' : '#6b7280'; ?>; color: white; border-radius: var(--m-radius-lg); text-decoration: none;">진행 중</a>
       <a href="/tournament?filter=completed" style="padding: 8px 16px; background: <?php echo $filter === 'completed' ? '#3b82f6' : '#6b7280'; ?>; color: white; border-radius: var(--m-radius-lg); text-decoration: none;">완료</a>
   </div>
   ```

6. 대회 카드에 우승자 표시 (완료된 대회):
   ```php
   if ($tournament['status'] === 'completed') {
       // 결승전 승자 조회
       $stmt = $pdo->prepare("SELECT winner_id FROM matches WHERE tournament_id = ? AND round = 1 AND bracket = 'winner'");
       $stmt->execute([$tournament['id']]);
       $winner_id = $stmt->fetchColumn();
       
       if ($winner_id) {
           $stmt = $pdo->prepare("SELECT name FROM participants WHERE id = ?");
           $stmt->execute([$winner_id]);
           $winner_name = $stmt->fetchColumn();
           
           echo '<div style="margin-top: 12px; padding: 8px; background: #fef3c7; border-left: 4px solid #f59e0b; border-radius: 4px; color: #92400e;">🏆 우승자: <strong>'.htmlspecialchars($winner_name).'</strong></div>';
       }
   }
   ```

**주의사항**:
- SQLite의 `ON DELETE CASCADE`로 대회 삭제 시 관련 데이터 자동 삭제
- JavaScript `confirm()`으로 삭제 확인 다이얼로그
- 대회 완료 여부는 결승전 승자 존재 여부로 판단

**예상 결과**: 관리자가 대회를 삭제할 수 있고, 결승전 종료 시 대회가 자동으로 완료 상태로 변경됩니다. 목록 페이지에서 필터링 및 우승자 표시가 정상 작동합니다.

**목표**: 모바일 최적화, 접근성 개선, 최종 UX 폴리싱을 수행합니다.

**작업 내용**:

1. 모바일 반응형 스타일 추가:
   ```css
   <style>
   /* 대진표 가로 스크롤 힌트 */
   .bracket-container {
       overflow-x: auto;
       padding: 20px;
       position: relative;
   }
   
   .bracket-container::after {
       content: '← 좌우로 스크롤 →';
       position: absolute;
       top: 10px;
       right: 10px;
       background: rgba(59, 130, 246, 0.9);
       color: white;
       padding: 4px 12px;
       border-radius: 12px;
       font-size: 12px;
       pointer-events: none;
       opacity: 0;
       animation: fadeInOut 3s ease-in-out;
   }
   
   @keyframes fadeInOut {
       0%, 100% { opacity: 0; }
       50% { opacity: 1; }
   }
   
   /* 매치 카드 터치 영역 확보 */
   @media (max-width: 768px) {
       foreignObject {
           width: 180px !important;
       }
       
       .match-card {
           min-height: 44px; /* iOS 터치 가이드라인 */
       }
       
       .m-container {
           padding: 16px 12px !important;
       }
   }
   </style>
   ```

2. 키보드 네비게이션 지원:
   ```html
   <!-- 결과 입력 버튼에 tabindex 추가 -->
   <button onclick="openMatchModal(...)" tabindex="0" aria-label="경기 결과 입력">결과 입력</button>
   
   <!-- 모달 닫기 ESC 키 지원 -->
   <script>
   document.addEventListener('keydown', (e) => {
       if (e.key === 'Escape' && document.getElementById('matchModal').style.display === 'flex') {
           closeMatchModal();
       }
   });
   </script>
   ```

3. 로딩 인디케이터 추가:
   ```javascript
   // AJAX 요청 시 로딩 표시
   function showLoading() {
       const loader = document.createElement('div');
       loader.id = 'loader';
       loader.style.cssText = 'position: fixed; top: 50%; left: 50%; transform: translate(-50%, -50%); background: rgba(0,0,0,0.8); color: white; padding: 20px 40px; border-radius: 12px; z-index: 9999; font-weight: 600;';
       loader.textContent = '처리 중...';
       document.body.appendChild(loader);
   }
   
   function hideLoading() {
       const loader = document.getElementById('loader');
       if (loader) loader.remove();
   }
   
   // matchForm submit에 적용
   document.getElementById('matchForm').addEventListener('submit', async (e) => {
       e.preventDefault();
       showLoading();
       
       // ... (기존 AJAX 코드)
       
       hideLoading();
   });
   ```

4. 에러 핸들링 개선:
   ```javascript
   // AJAX 요청 실패 시 사용자 친화적 메시지
   try {
       const response = await fetch(window.location.href, {
           method: 'POST',
           body: formData
       });
       
       if (!response.ok) {
           throw new Error('서버 응답 오류 ('+response.status+')');
       }
       
       const result = await response.json();
       // ...
   } catch (error) {
       alert('오류가 발생했습니다: ' + error.message + '\n잠시 후 다시 시도해주세요.');
       console.error('AJAX error:', error);
   }
   ```

5. SEO 메타 태그 추가 (modern shell이 처리하지만 페이지별 커스터마이징):
   ```php
   // _head.inc.php 인클루드 전에 추가
   add_stylesheet('<style>/* 페이지별 스타일 */</style>', 0);
   $g5['title'] = $tournament['title'].' - 토너먼트 대진표';
   ```

6. 대진표 인쇄 스타일:
   ```css
   @media print {
       .m-nav, .m-footer, button, form {
           display: none !important;
       }
       
       .bracket-container {
           overflow: visible !important;
       }
       
       svg {
           max-width: 100% !important;
           height: auto !important;
       }
   }
   ```

7. 완료 축하 메시지:
   ```php
   // 대회 완료 시 confetti 효과 (선택)
   <?php if ($tournament['status'] === 'completed'): ?>
       <div style="text-align: center; padding: 32px; background: linear-gradient(135deg, #667eea 0%, #764ba2 100%); color: white; border-radius: var(--m-radius-lg); margin-bottom: 20px;">
           <h2 style="margin: 0; font-size: 32px;">🎉 대회 완료!</h2>
           <p style="margin-top: 8px; font-size: 18px;">모든 경기가 종료되었습니다.</p>
       </div>
   <?php endif; ?>
   ```

**주의사항**:
- 모바일에서 가로 스크롤 힌트는 3초간 표시 후 사라짐
- 키보드 네비게이션은 웹 접근성 필수 (WCAG 2.1 준수)
- 로딩 인디케이터는 0.5초 이상 걸리는 작업에만 표시 권장
- 인쇄 시 네비게이션·버튼 숨김 처리

**예상 결과**: 모바일에서 부드러운 스크롤과 터치 인터랙션, 키보드 사용자도 모든 기능 접근 가능, 에러 발생 시 명확한 안내 메시지 표시. 대회 완료 시 축하 메시지로 성취감 부여.