  /* ===== away-from-home 헤더 변형 — 숨기지 않고 컴팩트화 + 로고 중앙 정렬 (홈버튼). 부제는 숨김.
     로고 클릭(onclick="goHome()") 으로 홈 복귀 — 사용자가 진행 중 화면에서도 한 번에 홈으로 빠져나갈 수 있음.
     주의: <header> 는 body > .container > header 구조라 직계 자식(>) 셀렉터 사용 불가. */
  body.away-from-home header {
    justify-content: center;
    min-height: calc(env(safe-area-inset-top, 0px) + 48px);
    padding: calc(env(safe-area-inset-top, 0px) + 4px) 16px 4px;
    gap: 0;
    /* 위저드·실시간·OCR도 홈과 동일한 공통 배경 변수 사용. */
    background: var(--app-bg);
    transform: none !important;
    transition: none;
  }
  body.away-from-home { background:var(--app-bg); }
  /* ★ 헤더 로고 줄맞춤 근본픽스 — 로고(h1)를 back/벨(.global-back-chevron·.notif-bell)과 '동일한 absolute + 동일한 env 식'으로 고정.
     기존엔 로고=in-flow(header padding-top=env+4 기준 정렬) / back·벨=absolute(top=50%+env/2). env(safe-area-inset-top)가
     iOS·Capacitor 웹뷰에서 두 계산에 서로 다르게(간헐적으로 0) 해석될 때 로고와 back·벨이 다른 줄로 벌어졌다(간헐적 2줄 버그의 root cause).
     로고도 같은 식으로 pin 하면 env가 0이든 노치값이든 셋이 함께 움직여 항상 한 줄. (브라우저 실측 검증: padding 불일치에도 gap 0) */
  body.away-from-home header h1 {
    position: absolute;
    left: 50%;
    top: calc(50% + env(safe-area-inset-top, 0px) / 2);
    transform: translate(-50%, -50%);
    margin: 0;
  }
  body.away-from-home header .subtitle { display: none; }
  body.away-from-home header h1 .brand-letters { font-size: 28px; }
  body.away-from-home header h1 .brand-mark { width: 24px; height: 24px; }
  body.away-from-home header h1 .brand-wordmark { height: 30px; }
  body.away-from-home { padding-top: calc(env(safe-area-inset-top, 0px) + 56px); }
  @media (max-width: 600px) {
    body.away-from-home header { min-height: calc(env(safe-area-inset-top, 0px) + 44px); padding: calc(env(safe-area-inset-top, 0px) + 4px) 12px 4px; }
    body.away-from-home header h1 .brand-letters { font-size: 24px; }
    body.away-from-home header h1 .brand-mark { width: 22px; height: 22px; }
    body.away-from-home header h1 .brand-wordmark { height: 26px; }
    body.away-from-home { padding-top: calc(env(safe-area-inset-top, 0px) + 50px); }
  }

  /* ===== 글로벌 좌상단 뒤로가기 꺽쇠 — header 안에 위치. position: absolute + top:50%/translateY(-50%)
     로 header 의 vertical center 와 픽셀 단위로 일치. (header 자체가 position: fixed 라 absolute 의 컨테이너) */
  .global-back-chevron {
    display: none;
    position: absolute;
    top: calc(50% + env(safe-area-inset-top, 0px) / 2);
    left: 4px;
    transform: translateY(calc(-50% + var(--gr-chevron-nudge)));   /* 세로 오프셋 공유(--gr-chevron-nudge). -50% 는 고정헤더 중앙정렬용. */
    width: 44px;
    height: 44px;
    padding: 0;
    background: transparent;
    border: none;
    color: #1c5734;
    font-size: 38px;
    line-height: 1;
    font-weight: 400;
    cursor: pointer;
    z-index: 100;
    -webkit-tap-highlight-color: transparent;
    user-select: none;
    align-items: center;
    justify-content: center;
  }
  body.away-from-home .global-back-chevron { display: flex; }
  .global-back-chevron:active { opacity: 0.4; transform: translateY(calc(-50% + var(--gr-chevron-nudge))) scale(0.85); }

  /* 알림 벨 — header 우측 (뒤로가기 꺽쇠와 동일한 absolute 정렬). */
  .notif-bell {
    /* 헤더 안에 포함 — 로고와 함께 숨김/등장. 기본은 아이콘만(원 없음). */
    position: absolute; top: calc(50% + env(safe-area-inset-top, 0px) / 2); right: 6px; transform: translateY(-50%);
    width: 48px; height: 48px; padding: 0 !important; display: none; align-items: center; justify-content: center;
    background: transparent; border: 1px solid transparent; border-radius: 50%;
    color: #1c5734; cursor: pointer; z-index: 100;
    transition: background .2s ease, border-color .2s ease, box-shadow .2s ease;
    -webkit-tap-highlight-color: transparent;
  }
  .notif-bell:active { transform: translateY(-50%) scale(0.9); }
  /* 스크롤 업(글라스 헤더)일 때만 원형 글라스 배경 */
  header.header-glass .notif-bell {
    background: rgba(255,255,255,0.32);
    -webkit-backdrop-filter: blur(12px) saturate(150%); backdrop-filter: blur(12px) saturate(150%);
    border-color: rgba(255,255,255,0.5);
    box-shadow: 0 3px 10px rgba(20,83,45,0.08);
  }
  /* 종 아이콘 — 헤더 로고와 균형을 맞춘 24px. */
  .notif-bell svg { width: 21px !important; height: 21px !important; display: block; }
  .notif-bell .notif-badge {
    position: absolute; top: 3px; right: 3px; min-width: 16px; height: 16px; padding: 0 4px;
    border-radius: 999px; background: #ef4444; color: #fff; font-size: 10px; font-weight: 800;
    display: flex; align-items: center; justify-content: center; line-height: 1; box-sizing: border-box;
  }
  /* 게임 진행(away-from-home) 중엔 라운드 코드 chip 과 겹치지 않게 숨김 */
  body.away-from-home .notif-bell { display: none !important; }
  /* ⋯ 메뉴로 통합 — 기존 헤더 지구본/OCR톱니/베뉴바 톱니 숨김(중복·위치충돌 방지). */
  #roundStatusChip, #ocrHeaderGearBtn, .sc-vb-gear { display: none !important; }
  /* ⋯ 버튼 — JS(updateScMoreBtn)가 sc-more-show 클래스를 붙일 때만 노출(위저드/스펙테이트 제외). */
  body.away-from-home #scMoreBtn.sc-more-show { display: flex !important; }
  /* 친구에게 라이브 공유 아이콘 — ⋯(#scMoreBtn, right:6px·width:48px) 왼쪽에 겹치지 않게 배치. */
  body.away-from-home #scShareBtn.sc-more-show { display: flex !important; }
  #scShareBtn { right: 54px; }
  /* ⋯ 드롭다운 */
  /* 기록(관전) 모드는 #spectatePage(z-index:9000) 위 오버레이 — 메뉴/백드롭이 그 위로 떠야 클릭 가능. */
  .sc-more-backdrop { position: fixed; inset: 0; z-index: 9698; }
  .sc-more-menu { position: fixed; top: calc(env(safe-area-inset-top, 0px) + 52px); right: 10px; z-index: 9699;
    min-width: 210px; max-width: 84vw; max-height: 70vh; overflow-y: auto; background: #fff;
    border: 1px solid var(--gray-200, #e5e7eb); border-radius: 14px; box-shadow: 0 12px 30px rgba(0,0,0,.16);
    padding: 6px; display: flex; flex-direction: column; gap: 2px; }
  .scm-row { display: flex; align-items: center; gap: 9px; width: 100%; padding: 12px; border: 0; background: none;
    font-family: inherit; font-size: 14px; font-weight: 700; color: var(--gray-800, #1f2937); border-radius: 10px;
    cursor: pointer; text-align: left; -webkit-tap-highlight-color: transparent; }
  .scm-row:active { background: var(--gray-100, #f1f3f2); }
  .scm-row.scm-danger { color: #dc2626; font-weight: 700; }
  .scm-row img { width: 22px; height: 22px; border-radius: 50%; object-fit: cover; }
  .scm-row .pack-icon { width: 20px; height: 20px; }
  .scm-code { margin-left: auto; font-weight: 800; color: var(--green-700, #15803d); letter-spacing: .5px; }
  .scm-divider { height: 1px; background: var(--gray-100, #eef1f0); margin: 3px 8px; }
  .scm-live-label { flex: 1; }
  .scm-switch { margin-left: auto; flex: 0 0 auto; pointer-events: none; transform: scale(.82); transform-origin: right center; }
  .scm-live-hint { padding: 2px 12px 10px; color: var(--gray-500, #6b7280); font-size: 11.5px; line-height: 1.4; }
  .scm-toggle { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 9px 12px; font-size: 14px; font-weight: 700; color: var(--gray-800, #1f2937); }
  .scm-record-mode { display: grid; gap: 6px; padding: 7px 6px 8px; }
  .scm-record-title { padding: 0 4px 2px; font-size: 12px; font-weight: 800; color: var(--gray-500, #6b7280); }
  .scm-record-option { display: grid; grid-template-columns: 24px minmax(0, 1fr); align-items: center; gap: 9px;
    width: 100%; min-height: 54px; padding: 9px 10px; border: 1px solid var(--gray-200, #e5e7eb);
    border-radius: 12px; background: #fff; color: var(--gray-900, #111827); font-family: inherit;
    text-align: left; cursor: pointer; -webkit-tap-highlight-color: transparent; }
  .scm-record-option:active { transform: scale(.99); }
  .scm-record-option.active { border-color: rgba(21,128,61,.28); background: var(--green-50, #eef7f0); }
  .scm-record-check { display: grid; place-items: center; width: 22px; height: 22px; box-sizing: border-box;
    border: 1px solid var(--gray-300, #d1d5db); border-radius: 50%; color: transparent; font-size: 12px; font-weight: 900; }
  .scm-record-option.active .scm-record-check { border-color: var(--green-700, #15803d);
    background: var(--green-700, #15803d); color: #fff; }
  .scm-record-copy { display: grid; gap: 2px; min-width: 0; }
  .scm-record-copy strong { font-size: 14px; line-height: 1.25; font-weight: 800; color: var(--gray-900, #111827); }
  .scm-record-copy small { font-size: 11px; line-height: 1.35; font-weight: 600; color: var(--gray-500, #6b7280); }
  .scm-empty { padding: 12px; font-size: 13px; color: var(--gray-400, #9ca3af); text-align: center; }
  /* 스펙테이트 헤더 ⋯ 버튼 (기록/관전 화면) */
  /* 로고(.sp-home-btn: top:2px, 높이 34px)와 세로중앙 일치 — 같은 top·같은 높이(패딩6+아이콘22=34). */
  .sp-more-btn { position: absolute; right: 12px; top: 2px; z-index: 3;
    background: none; border: 0; padding: 6px; display: inline-flex; align-items: center; justify-content: center;
    color: var(--gray-700, #374151); cursor: pointer; -webkit-tap-highlight-color: transparent; }
  .sp-more-btn .pack-icon { width: 22px; height: 22px; }
  /* 우측 컨트롤 한 컨테이너(.sp-head-right) — LIVE·💬·⋯를 한 그룹에 담아 로고와 줄맞춘 채 세로중앙 정렬.
     그룹 내부에선 절대배치 해제(flow) → gap 으로 간격, DOM 순서(공유·⋯·LIVE·💬)대로 배치, 💬 최우측. */
  .sp-head-right { margin-left: auto; display: flex; align-items: center; gap: 8px; }
  .sp-head-right .sp-more-btn { position: static; top: auto; right: auto; }
  .sp-head-right .history-page-count { margin: 0; }
  #spNetCodeChip { display: none !important; }   /* ⋯ 로 통합 — 원 지구본칩 숨김(값은 유지) */
  /* OCR 톱니 → '⋯' 메뉴(#scMoreBtn)로 통합. 항상 숨김(게임 설정은 ⋯ 메뉴 안 '게임 설정' 행). */
  #ocrHeaderGearBtn { display:none !important; }
  /* 프로필 탭 — 종 대신 같은 자리·크기의 설정 톱니. 그 외 탭에선 톱니 숨김. */
  #profileGearBtn { display: none; }
  body.tab-profile:not(.away-from-home) #notifBell { display: none !important; }
  body.tab-profile:not(.away-from-home) #profileGearBtn { display: flex !important; }
  /* 알림 섹션 구분 제목 (태그 / 좋아요·댓글) */
  .notif-sec-title { font-size: 13px; font-weight: 800; color: var(--green-900, #14532d); margin: 4px 2px 6px; }
  /* 알림/태그 행 */
  .tag-row { -webkit-appearance: none; appearance: none; width: 100%; text-align: left; font-family: inherit; background: none; border: none; border-bottom: 1px solid rgba(0,0,0,0.06); cursor: pointer; -webkit-tap-highlight-color: transparent; display: flex; align-items: center; gap: 11px; padding: 12px 0; }
  .tag-row:last-child { border-bottom: none; }
  /* 좋아요/댓글 알림 행 */
  .nt-row { display: flex; align-items: center; gap: 11px; padding: 12px 0; border-bottom: 1px solid rgba(0,0,0,0.06); cursor: pointer; -webkit-tap-highlight-color: transparent; }
  .nt-row:last-child { border-bottom: none; }
  .nt-row:active { background: rgba(0,0,0,0.03); }
  .nt-ico { width: 38px; height: 38px; border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size: 17px; flex-shrink: 0; }
  .nt-ico.like { background: #fee2e2; color: #ef4444; }
  .nt-ico.cmt { background: #dcfce7; }
  .nt-ico.follow { background: var(--green-50,#eef7f0); color: var(--green-700,#15803d); font-weight: 800; }
  .tag-av { width: 38px; height: 38px; border-radius: 50%; background: var(--green-700); color: #fff; display: flex; align-items: center; justify-content: center; font-size: 15px; font-weight: 800; flex-shrink: 0; }
  .tag-body { flex: 1; min-width: 0; }
  .tag-body .tag-msg { font-size: 13px; color: var(--gray-800); line-height: 1.4; }
  .tag-body .tag-msg b { font-weight: 800; color: var(--green-900); }
  .tag-body .tag-sub { font-size: 11.5px; color: var(--gray-400); margin-top: 2px; }
  /* 태그 피커 행 우측 '태그 +' 버튼 — 이것만 태그 발송(왼쪽 아바타·이름은 프로필 이동). */
  .tag-add-btn { -webkit-appearance:none; appearance:none; font-family:inherit; background:none; border:none; font-size:12.5px; font-weight:800; color:var(--green-700,#15803d); flex-shrink:0; padding:7px 9px; margin:-4px -4px -4px 0; border-radius:9px; cursor:pointer; -webkit-tap-highlight-color:transparent; }
  .tag-add-btn:active { background:rgba(20,83,45,0.09); }
  .tag-actions { display: flex; gap: 6px; flex-shrink: 0; }
  .tag-btn { padding: 7px 12px; border-radius: 999px; font-size: 12.5px; font-weight: 800; font-family: inherit; cursor: pointer; border: none; -webkit-tap-highlight-color: transparent; }
  .tag-btn.accept { background: #124837; color: #fff; }
  .tag-btn.decline { background: var(--gray-100, #f1efe8); color: var(--gray-600); }
  .tag-btn:active { transform: scale(0.96); }
  /* 실시간 라운드 초대 — 앱 사용 중 즉시 표시되는 간결한 확인 모달. */
  .round-invite-modal { max-width:390px; padding:24px 20px 18px; text-align:left; }
  .round-invite-kicker { display:inline-flex; align-items:center; gap:6px; margin-bottom:12px; color:var(--green-700); font-size:11px; font-weight:900; letter-spacing:.2px; }
  .round-invite-title { margin:0; color:var(--gray-900); font-size:19px; font-weight:900; line-height:1.45; }
  .round-invite-meta { margin:8px 0 0; color:var(--gray-500); font-size:12.5px; font-weight:650; line-height:1.5; }
  .round-invite-actions { display:grid; grid-template-columns:minmax(94px,.7fr) 1.3fr; gap:9px; margin-top:20px; }
  .round-invite-actions button { min-height:48px; border-radius:13px; font-family:inherit; font-size:14px; font-weight:850; cursor:pointer; }
  .round-invite-later { border:1px solid var(--app-surface-border); background:var(--app-surface); color:var(--gray-600); }
  .round-invite-accept { border:1px solid var(--green-800,#166534); background:var(--green-800,#166534); color:#fff; box-shadow:0 4px 12px rgba(20,83,45,.2); }
  .round-invite-actions button:active { transform:scale(.98); }

  /* 기존 per-card 하단 회색 이전 버튼들 — 모두 숨김 (글로벌 chevron 으로 대체). */
  #gameCard.wizard-active #wizardBackBtn,
  #pickerBackWrap,
  .ocr-exit-wrap,
  .step2-back-wrap { display: none !important; }
  /* ===== gameCard: wizard 모드 / 모달 모드 / 숨김 ===== */
  /* 모달 모드가 아니고 wizard도 아닌 평상시: gameCard 전체 숨김 (설정변경 모달 trigger로만 열림) */
  #gameCard:not(.wizard-active):not(.modal-open) { display: none; }
  /* 모달 모드: 콘텐츠 사이즈에 맞는 centered 팝업 + 뒤에 dim backdrop.
     !important 로 wizard-active 잔여 좌표를 모두 덮어쓰기. */
  #gameCard.modal-open {
    position: fixed !important;
    top: 50% !important;
    left: 50% !important;
    right: auto !important;
    bottom: auto !important;
    transform: translate(-50%, -50%) !important;
    width: calc(100vw - 32px) !important;
    max-width: 480px !important;
    height: auto !important;
    max-height: 85vh !important;
    overflow-y: auto !important;
    z-index: 1001 !important;
    margin: 0 !important;
    background: #ffffff !important;
    box-shadow: 0 20px 60px rgba(0,0,0,0.25) !important;
    border-radius: 16px !important;
    padding: 48px 20px 76px !important;
    display: block !important;
  }
  /* 모달 모드 backdrop — body 의 ::before 로 두어 modal 의 stacking context 와 분리.
     이렇게 안 하면 gameCard ::before 가 gameCard 안의 content 위에 덮여 모달 자체가 흐리게 보임. */
  #gameCard.modal-open::before { content: none; }
  body.gc-modal-open::before {
    content: '';
    position: fixed;
    top: 0; left: 0; right: 0; bottom: 0;
    background: rgba(0,0,0,0.5);
    z-index: 1000;
    backdrop-filter: blur(2px);
    -webkit-backdrop-filter: blur(2px);
    pointer-events: auto;
  }
  /* 모달 닫기(X) 버튼, 모달 제목, 완료 버튼 — 모달 모드에서만 표시 */
  .gc-modal-close, .gc-modal-title, .gc-modal-footer { display: none; }
  #gameCard.modal-open .gc-modal-close { display: flex; }
  #gameCard.modal-open .gc-modal-title { display: block; }
  #gameCard.modal-open .gc-modal-footer { display: flex; }
  /* 게임 모드 변경 스위처 — 설정 모달에서만 노출 */
  .gc-mode-switch { display: none; }
  #gameCard.modal-open .gc-mode-switch { display: block; margin: 4px 0 18px; }
  .gc-mode-switch-label { font-size: 12px; font-weight: 700; color: var(--gray-500); margin: 0 0 8px; }
  .gc-mode-btns { display: flex; gap: 6px; }
  .gc-mode-btn { flex: 1; min-width: 0; display: flex; flex-direction: column; align-items: center; gap: 3px; padding: 9px 4px; border: 1.5px solid var(--gray-200); border-radius: 12px; background: white; font-family: inherit; font-size: 11px; font-weight: 700; color: var(--gray-700); cursor: pointer; -webkit-tap-highlight-color: transparent; }
  .gc-mode-btn .greener-glyph,
  .gc-mode-btn .pack-icon { width:18px; height:18px; flex:0 0 18px; }
  .gc-mode-btn.active { border-color: var(--green-600, #2e8b57); background: var(--green-50, #eef7f0); color: var(--green-900); }
  .gc-mode-btn:active { transform: scale(0.96); }
  /* wizard 모드 또는 모달 모드 둘 다 아닐 때 (이론상 발생X) 외에는 gc-h2(기본 헤더)는 wizard 모드에서만 표시 */
  #gameCard.modal-open .gc-h2 { display: none; }
  /* 모달 모드에서 모든 panel 표시, 단 Step1(골프장/날짜)·Step2(플레이어명)는 헤더 inline 편집과 중복이므로 숨김 */
  #gameCard.modal-open .wizard-panel { display: block; }
  /* 모달 모드(설정변경) — options(step 1) 외 모든 패널 숨김 (팀 picker, 핸디캡 등 신규 step 자동 적용) */
  #gameCard.modal-open .wizard-panel:not([data-step="1"]) { display: none !important; }
  /* 모달 모드 — 헤더 "게임 옵션을 선택해주세요" h1 숨김 (사용자 요청 — chip 클릭 시 자명한 맥락) */
  #gameCard.modal-open .wizard-panel[data-step="1"] > h1.picker-h1 { display: none; }
  /* 모달 내부 폰트/간격 축소 — 오장처럼 옵션 많을 때 X 버튼 가려지지 않도록.
     wizard-sub-h 제목은 약간 더 크게 (배판 트리거/보너스 점수/타수당 금액 가독성). */
  #gameCard.modal-open .wizard-panel { margin-bottom: 8px; }
  #gameCard.modal-open .wizard-panel-title { font-size: 12px; margin: 2px 0 6px; }
  #gameCard.modal-open .wizard-panel-title.wizard-sub-h { font-size: 15px; margin: 12px 0 8px; }
  #gameCard.modal-open .wizard-panel-title .wizard-panel-meta {
    font-size: 10.5px;
    font-weight: 500;
    color: var(--gray-500);
    margin-left: 4px;
  }
  #gameCard.modal-open .game-type-section { margin-top: 8px !important; }
  #gameCard.modal-open .row { margin-bottom: 6px; }
  #gameCard.modal-open .bet-btn { padding: 5px 6px; font-size: 11px; }
  #gameCard.modal-open .hint { font-size: 10.5px !important; margin-top: 3px !important; line-height: 1.3 !important; }
  /* rule-toggle — 폰트/패딩 더 축소하여 '다음 홀 배판' 잘림 없이 한 줄 표시 */
  #gameCard.modal-open .rule-toggle {
    padding: 4px 6px;
    font-size: 10px;
    line-height: 1.2;
    min-height: 0;
    gap: 4px;
  }
  #gameCard.modal-open .rule-toggle input[type="checkbox"] {
    width: 13px;
    height: 13px;
    flex-shrink: 0;
  }
  /* 텍스트 잘림(...) 없이 모두 표시. 필요 시 자연 줄바꿈 허용 */
  #gameCard.modal-open .rule-toggle span,
  #gameCard.modal-open .rule-toggle label {
    overflow: visible;
    text-overflow: clip;
    white-space: normal;
    word-break: keep-all;
  }
  #gameCard.modal-open .rule-toggle .rule-amt,
  #gameCard.modal-open .rule-toggle .rule-meta {
    font-size: 9px;
  }
  #gameCard.modal-open .rule-toggle.compact-compound > label.sub-row { font-size: 9.5px; padding-left: 16px; }
  #gameCard.modal-open .rule-toggle.compact-compound > .rule-desc { font-size: 9px; padding-left: 18px; }
  #gameCard.modal-open .rule-group-label { font-size: 11px; margin: 6px 0 4px; }
  #gameCard.modal-open #extraRulesSection { margin-top: 4px; }
  #gameCard.modal-open .gt-btn { padding: 8px 6px; font-size: 11px; }
  #gameCard.modal-open .gt-emoji { font-size: 18px; }
  #gameCard.modal-open .gt-label { font-size: 12px; }
  #gameCard.modal-open .gt-sub { font-size: 10px; }
  /* 모달 닫기(X) 버튼 — viewport 우상단에 고정 (fixed로 스크롤과 무관) */
  /* gameCard.modal-open 안쪽에 sticky/absolute 위치 — 모달 box 기준 */
  .gc-modal-close {
    position: absolute;
    top: 10px;
    right: 12px;
    width: 36px;
    height: 36px;
    background: white;
    border: 1px solid var(--gray-300);
    font-size: 20px;
    line-height: 1;
    color: var(--gray-700);
    cursor: pointer;
    border-radius: 50%;
    padding: 0;
    transition: all 0.15s;
    z-index: 2;
    align-items: center;
    justify-content: center;
    box-shadow: 0 2px 6px rgba(0,0,0,0.08);
  }
  .gc-modal-close:hover {
    background: var(--gray-100);
    color: var(--gray-900);
    border-color: var(--gray-400);
  }
  .gc-modal-title {
    position: absolute;
    top: 16px;
    left: 20px;
    margin: 0;
    font-size: 16px;
    color: var(--green-900);
    z-index: 2;
    pointer-events: none;
  }
  /* 하단 '완료' 버튼 영역 — 모달 안 footer (sticky bottom) */
  .gc-modal-footer {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    margin: 0;
    padding: 10px 20px;
    background: white;
    border-top: 1px solid var(--gray-200);
    justify-content: flex-end;
    gap: 8px;
    z-index: 2;
    border-radius: 0 0 16px 16px;
  }
  .gc-modal-footer .gc-modal-done {
    min-width: 120px;
    padding: 10px 18px;
    font-size: 14px;
    font-weight: 700;
  }
  /* body 스크롤 잠금 — 모달 열렸을 때 */
  body.gc-modal-open { overflow: hidden; }
  @media (max-width: 600px) {
    #gameCard.modal-open {
      padding: 44px 14px 68px !important;
      max-height: 88vh !important;
      width: calc(100vw - 24px) !important;
    }
    .gc-modal-title { font-size: 14px; top: 14px; left: 16px; }
    .gc-modal-close { width: 32px; height: 32px; font-size: 18px; top: 8px; right: 10px; }
    .gc-modal-footer { padding: 8px 14px; border-radius: 0 0 16px 16px; }
    .gc-modal-footer .gc-modal-done { min-width: 100px; padding: 9px 14px; font-size: 13px; }
  }
  /* 게임타입별 panel 숨김 — body class로 활성 게임만 표시 (gameCard 완료 모드에서도 적용) */
  body.mode-ojang .wizard-panel[data-gametype="ppopgi"] { display: none !important; }
  body.mode-ppopgi .wizard-panel[data-gametype="ojang"] { display: none !important; }
  /* Step 3 안의 game-type sub-section 표시/숨김 */
  body.mode-ojang .section-ppopgi,
  body.mode-ojang .section-skins,
  body.mode-ojang .section-teamupdown { display: none !important; }
  body.mode-ppopgi .section-ojang,
  body.mode-ppopgi .section-skins,
  body.mode-ppopgi .section-teamupdown { display: none !important; }
  body.mode-skins  .section-ojang,
  body.mode-skins  .section-ppopgi,
  body.mode-skins  .section-teamupdown { display: none !important; }
  /* dev: teamupdown 모드 — 다른 게임 옵션 섹션 모두 숨김 (section-teamupdown 만 노출 — 추후 추가) */
  body.mode-teamupdown .section-ojang,
  body.mode-teamupdown .section-ppopgi,
  body.mode-teamupdown .section-skins { display: none !important; }
  /* 점수기록 모드 — 룰/베팅 옵션 없음. 게임별 옵션 섹션 전부 제거(예전엔 일부만 숨겼던 잔재 정리). */
  body.mode-record .section-ojang,
  body.mode-record .section-ppopgi,
  body.mode-record .section-skins,
  body.mode-record .section-teamupdown { display: none !important; }
  body.mode-record .wizard-panel[data-gametype] { display: none !important; }
  /* 게임 선택 토글 (Step 3 상단) — 2-up 카드형 */
  .game-type-toggle {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 8px;
    margin-bottom: 4px;
  }
  .gt-btn {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 2px;
    padding: 12px 8px;
    background: white;
    color: var(--gray-900);
    border: 2px solid var(--gray-200);
    border-radius: 10px;
    cursor: pointer;
    transition: all 0.15s;
    min-height: 80px;
  }
  /* ⓘ 룰 보기 — gt-btn 우상단에 absolute 배치 */
  .gt-btn .gt-info {
    position: absolute;
    top: 6px;
    right: 6px;
    width: 22px;
    height: 22px;
    font-size: 13px;
    z-index: 2;
  }
  .gt-btn:hover { border-color: var(--green-500); background: var(--green-50); }
  .gt-btn.active {
    border-color: var(--green-700);
    background: var(--green-50);
    box-shadow: 0 0 0 3px rgba(34,197,94,0.15);
  }
  .gt-btn .gt-emoji { font-size: 24px; line-height: 1; margin-bottom: 2px; }
  .gt-btn .gt-label { font-size: 14px; font-weight: 700; color: var(--green-900); }
  .gt-btn .gt-sub { font-size: 11px; color: var(--gray-500); }
  .gt-btn.active .gt-sub { color: var(--green-700); font-weight: 600; }
  @media (max-width: 600px) {
    .gt-btn { padding: 10px 6px; min-height: 70px; }
    .gt-btn .gt-emoji { font-size: 20px; }
    .gt-btn .gt-label { font-size: 13px; }
    .gt-btn .gt-sub { font-size: 10px; }
  }
  /* 뽑기 룰 요약 박스 */
  .ppopgi-rule-summary {
    background: #faf5ff;
    border: 1px solid #e9d5ff;
    border-radius: 10px;
    padding: 10px 12px;
    margin: 6px 0;
    font-size: 12.5px;
    color: var(--gray-700);
    line-height: 1.55;
  }
  .ppopgi-rule-summary-title {
    font-weight: 700;
    color: #6b21a8;
    margin-bottom: 6px;
    font-size: 13px;
  }
  .ppopgi-rule-summary ul { margin: 0; padding-left: 18px; }
  .ppopgi-rule-summary li { margin-bottom: 3px; }
  /* 스틱 도트 — 빨강/파랑 */
  .dot-r, .dot-b {
    display: inline-block;
    width: 11px;
    height: 11px;
    border-radius: 50%;
    vertical-align: -1px;
    margin: 0 1px;
  }
  .dot-r { background: #dc2626; box-shadow: inset 0 -2px 3px rgba(0,0,0,0.2); }
  .dot-b { background: #2563eb; box-shadow: inset 0 -2px 3px rgba(0,0,0,0.2); }
  /* ===== 뽑기/스킨스 모드: 오장 전용 UI 일괄 숨김 ===== */
  /* score-shape-overlay(버디/파/보기 mark)는 뽑기·스킨스에서도 유용해서 유지 */
  /* 뽑기는 니어 마킹 지원 (par3 홀) — .near-btn 숨김 제외. */
  body.mode-ppopgi .eagle-type-btn,
  body.mode-ppopgi .score-delta,
  body.mode-ppopgi .scoring-mode-switch,
  body.mode-ppopgi #holeMuteLabel,
  body.mode-skins .near-btn,
  body.mode-skins .eagle-type-btn,
  body.mode-skins .scoring-mode-switch,
  body.mode-skins #holeMuteLabel,
  /* 실시간 정산 row 의 점당 금액 chip 은 모든 모드에서 숨김 (옵션 화면/설정 모달에 정보 있음) */
  #betDisplay {
    display: none !important;
  }
  /* 땅·skip·마킹 토글 UI 전체 비노출 (사용자 요청). 데이터는 유지하되 버튼만 hide. */
  .ttang-btn,
  .skip-btn,
  #editModeBtn {
    display: none !important;
  }
  /* 스킨스는 score-delta 유지 (홀별 +스킨/−베팅 표시용) */
  /* 채점 모드 토글 자리에 뽑기 모드 표시만 */
  body.mode-ppopgi #scorecardCard h2::after {
    content: ' 🎲 뽑기';
    font-size: 13px;
    color: #7c3aed;
    background: #f3e8ff;
    padding: 2px 8px;
    border-radius: 6px;
    margin-left: 8px;
    vertical-align: 2px;
    font-weight: 700;
  }
  body.mode-skins #scorecardCard h2::after {
    content: ' 🥇 스킨스';
    font-size: 13px;
    color: #b45309;
    background: #fef3c7;
    padding: 2px 8px;
    border-radius: 6px;
    margin-left: 8px;
    vertical-align: 2px;
    font-weight: 700;
  }
  /* 뽑기 모드 — 결과 셀에 들어가는 버튼/표시 */
  .ppopgi-draw-btn {
    background: linear-gradient(135deg, #a855f7, #7c3aed);
    color: white;
    border: none;
    padding: 6px 12px;
    border-radius: 8px;
    font-size: 12px;
    font-weight: 700;
    cursor: pointer;
    box-shadow: 0 2px 6px rgba(124,58,237,0.3);
    white-space: nowrap;
  }
  .ppopgi-draw-btn:hover { transform: translateY(-1px); box-shadow: 0 3px 8px rgba(124,58,237,0.4); }
  .ppopgi-draw-btn:disabled { opacity: 0.5; cursor: not-allowed; box-shadow: none; }
  .ppopgi-redo-btn {
    background: white;
    color: #7c3aed;
    border: 1px solid #c4b5fd;
    padding: 3px 8px;
    border-radius: 6px;
    font-size: 10.5px;
    cursor: pointer;
    margin-top: 3px;
  }
  .ppopgi-redo-btn:hover { background: #faf5ff; }
  /* 홀 결과: 이긴 두 명 이름만 표시 */
  .ppopgi-result-box { font-size: 11.5px; line-height: 1.35; text-align: center; }
  .ppopgi-win-names { display: flex; flex-direction: column; gap: 1px; align-items: center; justify-content: center; }
  .ppopgi-win-names .pwin-name {
    font-size: 12px;
    font-weight: 700;
    color: #166534;
    line-height: 1.2;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 100%;
  }
  @media (max-width: 600px) {
    .ppopgi-win-names .pwin-name { font-size: 11px; }
  }
  .ppopgi-team-row { display: flex; align-items: center; gap: 4px; justify-content: center; }
  .ppopgi-team-row.win { font-weight: 700; color: #166534; }
  .ppopgi-team-row.lose { color: var(--gray-500); }
  .ppopgi-tie-text { color: #b45309; font-weight: 700; font-size: 11.5px; }
  .ppopgi-stake-chip {
    display: inline-block;
    background: #fef3c7;
    color: #92400e;
    padding: 1px 6px;
    border-radius: 4px;
    font-size: 10.5px;
    font-weight: 700;
    margin-top: 2px;
  }
  /* 뽑기 — 점수 셀 우상단에 작은 badge. 이긴 팀 ✓, 조커는 J */
  .stick-badge {
    position: absolute;
    top: 0px;
    right: 0px;
    min-width: 13px;
    height: 13px;
    padding: 0 2px;
    border-radius: 4px;
    border: 1.5px solid white;
    z-index: 2;
    font-size: 9px;
    font-weight: 900;
    text-align: center;
    line-height: 11px;
    color: white;
    box-shadow: 0 1px 2px rgba(0,0,0,0.25);
  }
  .stick-badge.winner {
    /* 뽑기 승자 트로피 — 스킨스와 동일 위치(좌측, 세로 중앙) */
    background: transparent;
    border-color: transparent;
    box-shadow: none;
    color: inherit;
    font-size: 12px;
    /* 기본 stick-badge 의 top:0 right:0 을 override — score-shape 침투 없이 score 왼쪽에 위치 */
    top: 50%;
    right: auto;
    left: 8px;
    transform: translateY(-50%);
    min-width: 0;
    height: auto;
    padding: 0;
    border: none;
    line-height: 1;
  }
  .stick-badge.joker {
    background: linear-gradient(135deg, #fbbf24, #f59e0b);
    color: #78350f;
    right: 14px; /* winner와 겹치지 않게 살짝 왼쪽 */
  }
  /* winner만 있을 때는 joker가 안 보이므로 default right:0 OK; 둘 다 있을 때만 겹침 회피 */
  td.score-cell { position: relative; }
  /* 뽑기 수동 입력 modal */
  .ppopgi-manual-modal { max-width: 380px; }
  /* 라이브 게임 종류 선택 모달 — 오장/뽑기/스킨스 3-up */
  .live-game-type-modal { max-width: 440px; }
  .live-game-type-buttons {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    gap: 10px;
  }
  .live-game-type-btn {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 4px;
    padding: 18px 10px;
    border: 1.5px solid var(--gray-300);
    background: white;
    border-radius: 12px;
    cursor: pointer;
    transition: all 0.15s;
  }
  .live-game-type-btn:hover {
    border-color: var(--green-500);
    background: var(--green-50);
    transform: translateY(-1px);
    box-shadow: 0 3px 8px rgba(0,0,0,0.08);
  }
  .live-game-type-btn .lgt-emoji { font-size: 36px; line-height: 1; margin-bottom: 4px; }
  .live-game-type-btn .lgt-label { font-size: 16px; font-weight: 800; color: var(--green-900); }
  .live-game-type-btn .lgt-sub { font-size: 11.5px; color: var(--gray-600); text-align: center; line-height: 1.3; }
  @media (max-width: 420px) {
    .live-game-type-btn { padding: 14px 8px; }
    .live-game-type-btn .lgt-emoji { font-size: 30px; }
    .live-game-type-btn .lgt-label { font-size: 14.5px; }
    .live-game-type-btn .lgt-sub { font-size: 11px; }
  }
  /* 뽑기 자동/카드/동시터치/수동 선택 모달 — 4행 1열 세로 stack + 그룹 라벨 */
  .ppopgi-mode-choice-modal { max-width: 420px; }
  /* Draft 복구 모달 — Live/OCR 진입 시 노출 */
  .draft-restore-modal { max-width: 440px; }
  .draft-restore-modal h3 {
    font-size: 17px; font-weight: 800; color: var(--green-900);
    margin: 0 0 4px; letter-spacing: -0.3px;
  }
  .draft-restore-actions button {
    padding: 10px 12px; font-size: 14px; font-weight: 700; min-height: 42px;
  }
  @media (max-width: 480px) {
    .draft-restore-modal { max-width: calc(100vw - 16px); }
    .draft-restore-actions button { padding: 9px 8px; font-size: 13px; min-height: 40px; }
  }
  .ppopgi-mode-choice-buttons {
    display: flex;
    flex-direction: column;
    gap: 0;                  /* 개별 element들 margin으로 간격 제어 */
  }
  /* 같은 그룹(자매) 버튼끼리는 더 가깝게 — '앱에서 뽑기' + '동시터치 추첨'.
     상단 border 제거 + 둥근 모서리 펴서 한 덩어리처럼 */
  .ppopgi-mode-choice-btn + .ppopgi-mode-choice-btn {
    margin-top: -1.5px;
    border-top-left-radius: 0;
    border-top-right-radius: 0;
  }
  .ppopgi-mode-choice-btn:has(+ .ppopgi-mode-choice-btn) {
    border-bottom-left-radius: 0;
    border-bottom-right-radius: 0;
  }
  /* 섹션 라벨 — '앱 내 게임' 같은 그룹 헤더 */
  .ppopgi-mode-group-label {
    font-size: 11.5px;
    font-weight: 700;
    color: var(--gray-500);
    text-transform: none;
    margin: 14px 4px 6px;     /* 위로 14px 여백, 아래로 6px (그룹 헤더와 첫 버튼은 가깝게) */
    padding-bottom: 2px;
    border-bottom: 1px dashed var(--gray-200);
  }
  .ppopgi-mode-group-divider {
    height: 1px;
    background: var(--gray-200);
    margin: 10px 4px;
  }
  /* 4개 버튼 동일 높이 강제 (sub 길이 차이로 변동 방지) */
  .ppopgi-mode-choice-btn {
    display: grid;
    grid-template-columns: 40px 1fr;
    grid-template-areas:
      "emoji label"
      "emoji sub";
    align-items: center;
    column-gap: 12px;
    row-gap: 2px;
    padding: 12px 14px;
    min-height: 64px;
    border: 1.5px solid var(--gray-300);
    background: white;
    border-radius: 10px;
    cursor: pointer;
    transition: all 0.15s;
    text-align: left;
  }
  .ppopgi-mode-choice-btn:hover {
    border-color: var(--green-500);
    background: var(--green-50);
    transform: translateY(-1px);
    box-shadow: 0 3px 8px rgba(0,0,0,0.06);
  }
  .ppopgi-mode-choice-btn .pmc-emoji {
    grid-area: emoji;
    font-size: 28px;
    line-height: 1;
    text-align: center;
    align-self: center;
  }
  .ppopgi-mode-choice-btn .pmc-label {
    grid-area: label;
    font-size: 17px;
    font-weight: 800;
    color: var(--green-900);
    align-self: end;
    line-height: 1.2;
  }
  .ppopgi-mode-choice-btn .pmc-sub {
    grid-area: sub;
    font-size: 12.5px;
    color: var(--gray-600);
    line-height: 1.25;
    align-self: start;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }
  @media (max-width: 480px) {
    .ppopgi-mode-choice-modal { max-width: calc(100vw - 16px); }
    .ppopgi-mode-choice-btn { padding: 10px 12px; column-gap: 10px; grid-template-columns: 34px 1fr; }
    .ppopgi-mode-choice-btn .pmc-emoji { font-size: 24px; }
    .ppopgi-mode-choice-btn .pmc-label { font-size: 16px; }
    .ppopgi-mode-choice-btn .pmc-sub { font-size: 11.5px; }
  }

  /* 자동뽑기 슬롯머신 애니메이션 모달 */
  .ppopgi-auto-draw-modal {
    max-width: 380px;
    width: calc(100vw - 32px);
    text-align: center;
    padding: 28px 22px;
  }
  .ppopgi-auto-draw-modal h3 {
    font-size: 18px;
    color: var(--green-900);
    margin-bottom: 4px;
  }
  .auto-draw-slots {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr 1fr;
    gap: 10px;
    margin: 22px 0 18px;
  }
  .auto-draw-slot {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 6px;
  }
  .ads-name {
    font-size: 12px;
    font-weight: 700;
    color: var(--gray-800);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 100%;
  }
  .ads-reel {
    width: 100%;
    aspect-ratio: 1 / 1.3;
    border: 2px solid var(--gray-300);
    border-radius: 10px;
    background: #f8fafc;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    position: relative;
  }
  .ads-card {
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 28px;
    font-weight: 900;
    background: white;
    color: var(--gray-400);
    transition: none;
  }
  .ads-card.color-R { background: #ef4444; color: white; }
  .ads-card.color-B { background: #3b82f6; color: white; }
  .ads-card.color-J { background: linear-gradient(135deg, #f59e0b, #facc15); color: white; }
  /* spinning 중에는 살짝 떨림 효과 */
  .auto-draw-slot:not(.locked) .ads-card {
    animation: adsSpinShake 0.16s linear infinite;
  }
  @keyframes adsSpinShake {
    0%, 100% { transform: translateY(0); }
    50%      { transform: translateY(-3px); }
  }
  /* lock 시 한 번 튕기는 효과 */
  .auto-draw-slot.locked .ads-card {
    animation: adsLockPop 0.32s ease-out;
  }
  @keyframes adsLockPop {
    0%   { transform: scale(1.25); }
    60%  { transform: scale(0.92); }
    100% { transform: scale(1); }
  }
  .auto-draw-slot.locked .ads-reel { border-color: var(--green-600); }
  /* 플레이어별 타수 표시 — locked 후 노출. 카드 아래. */
  .ads-strokes {
    font-size: 13px;
    font-weight: 700;
    color: var(--gray-700);
    min-height: 16px;
    opacity: 0;
    transition: opacity 0.2s;
  }
  .auto-draw-slot.locked .ads-strokes { opacity: 1; }
  /* 이긴팀 — 노란 글로우 + 살짝 확대 (수동추첨과 동일 톤) */
  .auto-draw-slot.winner {
    transform: scale(1.04);
    z-index: 3;
  }
  .auto-draw-slot.winner .ads-reel {
    box-shadow: 0 0 0 3px #facc15, 0 4px 14px rgba(250, 204, 21, 0.55);
    border-color: #facc15;
  }
  .auto-draw-slot.winner .ads-name,
  .auto-draw-slot.winner .ads-strokes { color: #b45309; }
  /* 진팀 — 흐리게 + 채도 낮춤 */
  .auto-draw-slot.loser {
    opacity: 0.42;
    filter: saturate(0.45) brightness(0.95);
    transform: scale(0.98);
  }
  /* 동타 — 4명 모두 페이드 */
  .auto-draw-slot.tied {
    opacity: 0.5;
    filter: saturate(0.5);
  }
  .auto-draw-status {
    font-size: 14px;
    font-weight: 600;
    color: var(--gray-700);
    min-height: 22px;
  }
  .auto-draw-status.done { color: var(--green-700); }
  /* 추첨 완료 후 확인 버튼 */
  .auto-draw-confirm {
    width: 100%;
    margin-top: 16px;
    padding: clamp(8px, 2.2vw, 12px) clamp(14px, 4.5vw, 22px);
    border-radius: 14px;
    background: #1c5734;
    border: 1.5px solid #1c5734;
    color: white;
    font-size: clamp(16px, 4.8vw, 20px);
    font-weight: 800;
    letter-spacing: -0.3px;
    cursor: pointer;
    transition: all 0.15s;
    animation: adsConfirmFadeIn 0.3s ease-out;
  }
  .auto-draw-confirm:hover,
  .auto-draw-confirm:active {
    background: #163f24;
    border-color: #163f24;
  }
  @keyframes adsConfirmFadeIn {
    from { opacity: 0; transform: translateY(8px); }
    to   { opacity: 1; transform: translateY(0); }
  }
  /* 동시터치 추첨 모달 — 멀티터치 4분할 */
  .ppopgi-sim-touch-modal { max-width: 460px; }
  .ppopgi-sim-status {
    text-align: center;
    font-size: 13.5px;
    font-weight: 700;
    color: var(--green-900);
    margin: 8px 0 12px;
    min-height: 22px;
  }
  .ppopgi-sim-status.countdown {
    font-size: 36px;
    color: var(--green-700);
    animation: simCountdownPulse 0.6s ease-out;
  }
  @keyframes simCountdownPulse {
    0% { transform: scale(0.7); opacity: 0; }
    50% { transform: scale(1.1); opacity: 1; }
    100% { transform: scale(1); opacity: 1; }
  }
  .ppopgi-sim-status.warn { color: #b45309; }
  .ppopgi-sim-status.tied-status {
    font-size: 17px;
    color: #92400e;
    background: #fef3c7;
    border: 1.5px solid #f59e0b;
    border-radius: 10px;
    padding: 8px 12px;
  }
  .ppopgi-sim-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-template-rows: 1fr 1fr;
    gap: 8px;
    height: 320px;
    touch-action: none;
    user-select: none;
    -webkit-user-select: none;
  }
  .ppopgi-sim-zone {
    background: linear-gradient(135deg, #f1f5f9, #e2e8f0);
    border: 2px dashed var(--gray-400);
    border-radius: 12px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 10px;
    gap: 6px;
    transition: background 0.2s, border-color 0.2s, transform 0.1s;
    position: relative;
    overflow: hidden;
  }
  .ppopgi-sim-zone.pressed {
    background: linear-gradient(135deg, #dcfce7, #86efac);
    border-color: var(--green-700);
    border-style: solid;
    transform: scale(0.98);
  }
  .ppopgi-sim-zone.revealed.color-R { background: linear-gradient(135deg, #fecaca, #f87171); border-color: #dc2626; border-style: solid; }
  .ppopgi-sim-zone.revealed.color-B { background: linear-gradient(135deg, #bfdbfe, #60a5fa); border-color: #2563eb; border-style: solid; }
  .ppopgi-sim-zone.revealed.color-J { background: linear-gradient(135deg, #fde68a, #fbbf24); border-color: #b45309; border-style: solid; }
  .ppopgi-sim-zone.auto-fallback { background: linear-gradient(135deg, #ede9fe, #c4b5fd); border-color: #7c3aed; border-style: solid; }
  .ppopgi-sim-zone .psz-name { font-size: 18px; font-weight: 800; color: var(--green-900); }
  .ppopgi-sim-zone .psz-state { font-size: 12px; color: var(--gray-700); }
  /* 점수만 표시할 때 — 크게 */
  .ppopgi-sim-zone .psz-state.psz-state-big {
    font-size: 28px;
    font-weight: 900;
    color: var(--green-900);
    line-height: 1.0;
  }
  .ppopgi-sim-zone .psz-color {
    font-size: 15px;
    font-weight: 700;
    line-height: 1.2;
    text-align: center;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 100%;
  }
  @media (max-width: 420px) {
    .ppopgi-sim-zone .psz-color { font-size: 13px; }
  }
  .ppopgi-sim-zone .psz-trophy {
    position: absolute;
    top: 6px;
    right: 8px;
    font-size: 24px;
    filter: drop-shadow(0 1px 2px rgba(0,0,0,0.25));
    z-index: 2;
  }
  /* 이긴팀 — 강한 글로우 + 살짝 확대 + 굵은 보더 */
  .ppopgi-sim-zone.winner {
    box-shadow: 0 0 0 3px #facc15, 0 4px 14px rgba(250, 204, 21, 0.55);
    transform: scale(1.03);
    z-index: 3;
  }
  /* 진팀 — 흐리게 + 채도 낮춤 */
  .ppopgi-sim-zone.loser {
    opacity: 0.42;
    filter: saturate(0.45) brightness(0.95);
    transform: scale(0.98);
  }
  /* 동타 — 4명 모두 페이드 (무승부 알림은 상단 status 영역에) */
  .ppopgi-sim-zone.tied {
    opacity: 0.5;
    filter: saturate(0.5);
  }
  .ppopgi-sim-actions {
    display: flex;
    gap: 8px;
    justify-content: flex-end;
    margin-top: 12px;
  }
  @media (max-width: 420px) {
    .ppopgi-sim-grid { height: 280px; gap: 6px; }
    .ppopgi-sim-zone .psz-name { font-size: 16px; }
    .ppopgi-sim-zone .psz-state { font-size: 11px; }
    .ppopgi-sim-zone .psz-state.psz-state-big { font-size: 24px; }
    .ppopgi-sim-zone .psz-color { font-size: 24px; }
    .ppopgi-sim-status { font-size: 12.5px; }
    .ppopgi-sim-status.countdown { font-size: 30px; }
  }

  /* 카드 뒤집기 뽑기 모달 */
  .ppopgi-card-modal { max-width: 440px; }
  .ppopgi-card-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 8px;
  }
  .ppopgi-card-turn-label {
    font-size: 14px;
    font-weight: 700;
    color: var(--green-900);
  }
  /* 동타 — 무승부 라벨 강조 */
  .ppopgi-card-turn-label.tied-label {
    font-size: 16px;
    color: #92400e;
    background: #fef3c7;
    border: 1.5px solid #f59e0b;
    border-radius: 8px;
    padding: 6px 10px;
    text-align: center;
  }
  .ppopgi-card-stock {
    font-size: 11px;
    color: var(--gray-600);
    margin: 4px 0 12px;
    text-align: center;
  }
  .ppopgi-card-row {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 8px;
    margin-bottom: 14px;
    transition: opacity 0.2s, filter 0.2s;
  }
  /* 동타 — 위쪽 뽑기카드 영역도 페이드 (무승부 라벨 강조) */
  .ppopgi-card-row.tied-faded {
    opacity: 0.5;
    filter: saturate(0.5);
  }
  .ppopgi-card {
    position: relative;
    aspect-ratio: 2 / 3;
    perspective: 700px;
    cursor: pointer;
    user-select: none;
  }
  .ppopgi-card-inner {
    position: absolute;
    inset: 0;
    transform-style: preserve-3d;
    transition: transform 0.55s cubic-bezier(0.4, 0.2, 0.2, 1);
  }
  .ppopgi-card.flipped .ppopgi-card-inner { transform: rotateY(180deg); }
  .ppopgi-card-face {
    position: absolute;
    inset: 0;
    backface-visibility: hidden;
    -webkit-backface-visibility: hidden;
    border-radius: 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 26px;
    font-weight: 900;
    color: white;
    box-shadow: 0 2px 6px rgba(0,0,0,0.15);
  }
  .ppopgi-card-back {
    background: linear-gradient(135deg, var(--green-700), var(--green-900));
    color: white;
  }
  .ppopgi-card-back::after {
    content: '🎲';
    font-size: 28px;
  }
  .ppopgi-card-front {
    transform: rotateY(180deg);
    font-size: 14px;
    line-height: 1.1;
    text-align: center;
  }
  .ppopgi-card-front.color-R { background: linear-gradient(135deg, #dc2626, #991b1b); }
  .ppopgi-card-front.color-B { background: linear-gradient(135deg, #2563eb, #1d4ed8); }
  .ppopgi-card-front.color-J { background: linear-gradient(135deg, #f59e0b, #b45309); color: white; }
  .ppopgi-card.locked { cursor: default; opacity: 0.85; }
  .ppopgi-card:not(.flipped):not(.locked):hover .ppopgi-card-inner {
    transform: translateY(-3px);
  }
  /* 뽑기 결과: 이미 뽑은 카드 위에 "P1" 같은 작은 뱃지 */
  .ppopgi-card-owner {
    position: absolute;
    top: -8px;
    right: -6px;
    background: var(--green-900);
    color: white;
    font-size: 10px;
    font-weight: 700;
    padding: 2px 6px;
    border-radius: 10px;
    z-index: 2;
    box-shadow: 0 1px 3px rgba(0,0,0,0.2);
  }
  .ppopgi-card-leftover-badge {
    position: absolute;
    top: -8px;
    left: -6px;
    background: var(--gray-500);
    color: white;
    font-size: 9.5px;
    font-weight: 700;
    padding: 2px 6px;
    border-radius: 10px;
    z-index: 2;
  }
  .ppopgi-card-results {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 6px;
    margin: 8px 0 12px;
  }
  .ppopgi-card-slot {
    background: var(--gray-50);
    border: 1px dashed var(--gray-300);
    border-radius: 6px;
    padding: 6px 4px;
    text-align: center;
    font-size: 11px;
    color: var(--gray-700);
    line-height: 1.3;
  }
  .ppopgi-card-slot.filled {
    border-style: solid;
    border-color: var(--green-500);
    background: white;
    font-weight: 700;
    color: var(--green-900);
  }
  .ppopgi-card-slot.current {
    border-color: var(--green-700);
    background: var(--green-50);
    color: var(--green-900);
    font-weight: 700;
    animation: pulse-current 1.2s ease-in-out infinite;
  }
  @keyframes pulse-current {
    0%, 100% { box-shadow: 0 0 0 0 rgba(22, 163, 74, 0.4); }
    50% { box-shadow: 0 0 0 6px rgba(22, 163, 74, 0); }
  }
  .ppopgi-card-slot .pcs-name { display: block; font-size: 12px; }
  .ppopgi-card-slot .pcs-color { display: block; margin-top: 2px; font-size: 14px; }
  .ppopgi-card-slot .pcs-joker-team {
    margin-left: 2px;
    font-size: 10px;
    color: var(--gray-600);
    font-weight: 600;
  }
  .ppopgi-card-slot .pcs-delta {
    display: block;
    margin-top: 1px;
    font-size: 11px;
    font-weight: 700;
    color: var(--gray-600);
  }
  .ppopgi-card-slot .pcs-trophy {
    position: absolute;
    top: -10px;
    right: -6px;
    font-size: 16px;
    z-index: 2;
    filter: drop-shadow(0 1px 2px rgba(0,0,0,0.2));
  }
  /* 이긴팀 — 노란 글로우 + 굵은 보더 */
  .ppopgi-card-slot.winner {
    background: linear-gradient(135deg, #fef9c3, #fde68a);
    border-color: #f59e0b;
    border-style: solid;
    box-shadow: 0 0 0 2px #facc15, 0 2px 8px rgba(250, 204, 21, 0.45);
    color: #78350f;
    z-index: 2;
  }
  .ppopgi-card-slot.winner .pcs-name,
  .ppopgi-card-slot.winner .pcs-delta { color: #78350f; }
  /* 진팀 — 흐리게 + 채도 낮춤 */
  .ppopgi-card-slot.loser {
    opacity: 0.42;
    filter: saturate(0.45) brightness(0.96);
  }
  /* 동타 — 4명 모두 페이드 (무승부 알림은 상단 turn label 에) */
  .ppopgi-card-slot.tied {
    opacity: 0.5;
    filter: saturate(0.5) brightness(0.97);
  }
  .ppopgi-card-slot { position: relative; }
  .ppopgi-card-slot[onclick] { cursor: pointer; }
  .ppopgi-card-slot[onclick]:not(.filled):hover {
    border-color: var(--green-700);
    background: var(--green-100);
  }
  .ppopgi-card-actions {
    display: flex;
    gap: 8px;
    justify-content: flex-end;
    margin-top: 10px;
  }
  @media (max-width: 420px) {
    .ppopgi-card-row { gap: 6px; }
    .ppopgi-card-face { font-size: 22px; }
    .ppopgi-card-back::after { font-size: 24px; }
  }
  .ppopgi-manual-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    padding: 8px 4px;
    border-bottom: 1px solid var(--gray-200);
  }
  .ppopgi-manual-row:last-child { border-bottom: none; }
  .ppopgi-manual-name { font-weight: 700; font-size: 13px; flex: 1; }
  .ppopgi-stick-picker { display: flex; gap: 4px; flex-wrap: wrap; }
  .ppopgi-stick-btn {
    width: 32px; height: 32px;
    border-radius: 8px;
    border: 2px solid var(--gray-300);
    background: white;
    cursor: pointer;
    font-size: 11px;
    font-weight: 800;
    color: var(--gray-700);
    display: flex; align-items: center; justify-content: center;
  }
  .ppopgi-stick-btn.R { background: #fee2e2; border-color: #fca5a5; color: #b91c1c; }
  .ppopgi-stick-btn.R.selected { background: #dc2626; color: white; border-color: #991b1b; }
  .ppopgi-stick-btn.B { background: #dbeafe; border-color: #93c5fd; color: #1e40af; }
  .ppopgi-stick-btn.B.selected { background: #2563eb; color: white; border-color: #1e3a8a; }
  .ppopgi-stick-btn.J { background: #fef3c7; border-color: #fcd34d; color: #92400e; }
  .ppopgi-stick-btn.J.selected { background: #f59e0b; color: white; border-color: #b45309; }
  .ppopgi-stick-btn.disabled { opacity: 0.3; cursor: not-allowed; }
  .ppopgi-manual-stock {
    background: var(--gray-50);
    padding: 8px 12px;
    border-radius: 8px;
    margin-top: 8px;
    font-size: 12px;
    color: var(--gray-700);
  }
  /* extraRulesSection은 step 3에 속해야 함 (JS에서 동적으로 step 3 panel로 이동) */
  .wizard-nav {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-top: 16px;
    padding-top: 14px;
    border-top: 1px solid var(--gray-200);
  }
  .wizard-nav button { min-width: 96px; padding: 10px 14px; font-size: 14px; }
  /* 캡처 전용 헤더 배너 (공유 이미지 상단의 골프장·날짜 + 참가자 명단) — 평소엔 숨김 */
  .capture-banner { display: none; }
  .card.capturing .capture-banner { display: block; }
  .capture-banner {
    margin: 0 0 12px;
    padding: 2px 6px;          /* 가장자리 여백 — 베뉴 아이콘/썸네일이 카드 모서리에 붙어 잘리는 것 방지. */
    background: transparent;   /* 라이브 화면과 동일 — 흰 배경 위 공통 베뉴 헤더 그대로. (초록 박스 제거) */
    border: none;
    border-radius: 0;
  }
  .capture-banner .cap-venue {
    /* 내부는 _buildUnifiedVenueHeader 마크업(라이브와 동일) — 컨테이너 오버라이드 없이 빌더 스타일 그대로. */
    margin: 0;
  }
  /* 공유 캡처 — 베뉴 아이콘 잘림 → 제거(요청), 코스명 꼬리(y) 잘림 방지. */
  .card.capturing .uvh-location-icon { display: none; }
  .card.capturing .uvh-course-copy small { overflow: visible; }
  .capture-banner .cap-players {
    display: flex;
    flex-wrap: wrap;
    gap: 6px 16px;
    font-size: 14px;
    color: var(--gray-700);
    font-weight: 600;
    line-height: 1.5;
    margin-top: 2px;
  }
  /* 캡처 모드 — 상세 스코어카드 전부 펼침 + 토글 버튼/액션 숨김. */
  #scorecardCard.capturing .sc-section-toggle-btn,
  #scorecardCard.capturing .sc-bottom-actions { display: none !important; }
  #scorecardCard.capturing thead { display: table-header-group !important; }
  #scorecardCard.capturing tbody tr.sc-row-front,
  #scorecardCard.capturing tbody tr.sc-row-back,
  #scorecardCard.capturing tbody tr.summary-front,
  #scorecardCard.capturing tbody tr.summary-back,
  #scorecardCard.capturing tbody tr.summary-grand { display: table-row !important; }
  /* 캡처 모드 — '최소 송금' 섹션 숨김. 정산 금액(player-result)만 노출. */
  #settlementCard.capturing #settlement .settle-section-title,
  #settlementCard.capturing #settlement .settlement-row,
  #settlementCard.capturing #settlement .empty-state { display: none !important; }
  #settlementCard.capturing #settlement { margin: 0 !important; padding: 0 !important; }
  /* ⚠️ 사용자가 "실시간 정산 접기" 했으면 inline style.display='none' 이 설정됨.
     캡처 모드에선 강제 표시 (정산 결과 = 공유 이미지의 핵심 컨텐츠). !important 로 inline 덮어씀.
     record/teamupdown 모드는 정산 자체가 없으므로 :not() 으로 제외 → 그 모드들의 display:none 우선. */
  body:not(.mode-record):not(.mode-teamupdown):not(.has-gsb) #settlementCard.capturing #playerResults {
    display: grid !important;
  }
  /* 캡처 모드 — 니어 마킹 안 된 빈 near 버튼 숨김 (마킹된 active 버튼만 노출).
     공유 이미지에서 의미 없는 빈 N 칸이 par 3 마다 보이는 노이즈 제거. */
  #settlementCard.capturing .near-btn:not(.active) { display: none !important; }
  /* 캡처 모드 — 누적정산 chip / bet chip 숨김. */
  #settlementCard.capturing .cum-progress-chip,
  #settlementCard.capturing .bet-chip-btn { display: none !important; }
  /* 캡처 모드 — OCR 결과 안내 헤더 숨김. */
  #scorecardCard.capturing .section-view-header { display: none !important; }
  /* 캡처 모드 — 전체/전반/후반 상단 탭 숨김 (OCR 모드에서만 노출되는 탭). */
  #scorecardCard.capturing .section-tabs-top { display: none !important; }
  /* 캡처 모드 — 실제 베뉴바(기어·날짜입력·편집칸)와 스코어카드 헤더(제목+전/후반 토글) 숨김.
     → 공유 이미지엔 깔끔한 capture-banner(베뉴·코스·날짜)만 노출. */
  #scorecardCard.capturing #scVenueBar,
  #scorecardCard.capturing #scCardHead,
  #scorecardCard.capturing #scSavedHeader { display: none !important; }
  /* 캡처 모드 — sc-toggle-row 안의 베뉴바/토글/전후반 nav 는 숨기되, 진행 status bar(#gameStatusBar)는 유지.
     (status bar = 공유 이미지에 포함돼야 하는 진행/순위 요약. 행 전체를 display:none 하면 status bar 도 사라짐.) */
  #settlementCard.capturing .sc-toggle-row > :not(#gameStatusBar) { display: none !important; }
  #settlementCard.capturing .sc-toggle-row { display: block !important; padding: 0 !important; margin: 0 !important; border: 0 !important; }
  /* 캡처 모드 — 실시간 정산 헤더 행 (실시간 정산 접기 텍스트 + bet chip) 숨김. */
  #settlementCard.capturing .settle-header-row { display: none !important; }
  /* 캡처 모드 — '최소 송금 알기' 토글 + 그 wrap 통째로 숨김. */
  #settlementCard.capturing .min-transfer-toggle,
  #settlementCard.capturing .min-transfer-wrap { display: none !important; }
  /* 캡처 모드 — 헤더 룰 변경 chip 숨김 (스코어카드 헤더 우측 상단). */
  #scorecardCard.capturing .header-rule-chip { display: none !important; }
  /* 캡처 모드 — banner 위에 약간 여백 + 아래쪽 간격도 정돈. */
  #scorecardCard.capturing { padding-top: 30px !important; padding-bottom: 4px !important; }
  #scorecardCard.capturing .capture-banner { margin-top: 8px; margin-bottom: 0; }
  /* 캡처 전용 "실시간 정산" 제목 — Grand total ↔ players-grid 사이. 평소엔 숨김.
     ⚠️ #settlementCard h2 (specificity 0,1,0,1) 가 .capture-only-title (0,0,1,0) 를 이기므로
     selector 강화 + !important 둘 다 적용 — 캡처 시에만 보이도록 강제. */
  #settlementCard h2.capture-only-title { display: none !important; }
  body:not(.has-gsb) #settlementCard.capturing h2.capture-only-title {
    display: block !important;
    margin: 24px 0 12px;
    font-size: 18px;
    font-weight: 800;
    color: var(--green-900);
    letter-spacing: -0.3px;
  }
  .capture-banner .cap-players b {
    color: var(--green-900);
    font-weight: 800;
    margin-left: 2px;
  }
  .capture-banner .cap-players span {
    white-space: nowrap;
  }
  /* OCR T합계 불일치 경고 — 해당 섹션 점수 셀 노란 점 표시 */
  td.score-cell-warning { background: #fef9c3 !important; position: relative; }
  /* 점수기록 모드 — 빠진셀 노란 음영 제거(정산 없으니 불필요). 모든 점수칸 흰색. */
  body.mode-record table.scorecard td.score-cell,
  body.mode-record table.scorecard td.score-cell-warning { background: white !important; }
  td.score-cell-warning::before {
    content: '';
    position: absolute;
    top: 3px;
    right: 3px;
    width: 6px;
    height: 6px;
    background: #f59e0b;
    border-radius: 50%;
    box-shadow: 0 0 0 1px white;
  }
  .score-eagle { color: #7c3aed; }
  .score-birdie { color: var(--red); font-weight: 700; }
  .score-par { color: var(--gray-700); }
  .score-bogey { color: var(--gray-500); }
  .score-double { color: var(--gray-400); }
  /* Results */
  .players-grid {
    display: grid;
    /* 항상 4×1 세로 스택 (사용자 요청) */
    grid-template-columns: 1fr;
    gap: 10px;
  }
  .player-result {
    background: white;
    border: 2px solid var(--gray-200);
    border-radius: 12px;
    padding: 10px 14px;
    transition: all 0.2s;
    min-width: 0;
    /* 한 줄 가로 정렬 — 좌측 이름(타수), 우측 금액. */
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
  }
  /* 컬러 다이어트 — winning/losing 모두 중성 회색 border 로 통일. winning 만 옅은 그린 배경. */
  .player-result.winning { border-color: var(--gray-200); background: var(--green-50); }
  .player-result.losing { border-color: var(--gray-200); background: var(--gray-100); }
  .player-result.inactive {
    border-color: var(--gray-200);
    background: var(--gray-50);
    opacity: 0.7;
  }
  .player-result.inactive .name { color: var(--gray-500); }
  .player-result .name {
    font-size: 15px;
    font-weight: 600;
    color: var(--gray-800);
    margin: 0;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    flex: 1 1 auto;
    min-width: 0;
    text-align: left;
  }
  .player-result .amount {
    font-size: 18px;
    font-weight: 800;
    letter-spacing: -0.5px;
    white-space: nowrap;
    flex: 0 0 auto;
  }
  .player-result.winning .amount { color: var(--green-700); }
  .player-result.losing .amount { color: var(--red); }
  @media (max-width: 600px) {
    .player-result { padding: 8px 12px; }
    .player-result .name { font-size: 13.5px; }
    .player-result .amount { font-size: 16px; }
    .player-result .stroke-count { font-size: 11.5px; }
    .player-result .stroke-count.partial { font-size: 11px; }
  }
  @media (max-width: 400px) {
    .player-result .amount { font-size: 15px; letter-spacing: -0.8px; }
  }
  .settlement {
    margin-top: 16px;
    padding: 14px 16px;
    background: var(--gold-light);
    border-radius: 10px;
    font-size: 14px;
    line-height: 1.7;
    color: var(--gray-900);
  }
  /* 최소 송금 row — 실시간 정산 (.player-result) 와 같은 박스 들여쓰기 스타일로 통일.
     칩/loser 카드와 동일한 회색 fill (gray-100) 적용. */
  .settlement-row {
    display: flex;
    align-items: center;
    gap: 8px;
    background: var(--gray-100);
    border: 2px solid var(--gray-200);
    border-radius: 12px;
    padding: 10px 14px;
    font-size: 15px;
  }
  .settlement-row + .settlement-row { margin-top: 10px; }
  /* 정산 섹션 타이틀 ('최소 송금' 등) — 라이브/사진 공용 기본 스타일. */
  .settle-section-title {
    font-size: 14px;
    font-weight: 800;
    color: var(--gray-900, #111827);
    margin: 0 0 8px;
  }
  /* 최소 송금 — h2(실시간 정산) 와 동일한 헤더 스타일. 컨테이너 박스 X. 시작 위치는 카드 padding 기준. */
  .min-transfer-wrap { display: block; }
  .min-transfer-toggle {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 6px;
    width: 100%;
    padding: 0;
    background: transparent;
    border: none;
    cursor: pointer;
    text-align: left;
    transition: opacity 0.15s;
    font-family: inherit;
    margin: 16px 0 16px;
  }
  .min-transfer-toggle:active { opacity: 0.6; }
  .min-transfer-toggle .min-transfer-label {
    font-size: 15px;
    font-weight: 800;
    color: #000;
    letter-spacing: -0.3px;
  }
  /* chevron — 상단바 ‹ 와 동일 모양/사이즈. 접힘 시 ▿ (아래), 펼침 시 ▵ (위). */
  .min-transfer-toggle::after {
    content: '‹';
    font-size: 28px;
    line-height: 1;
    color: #1c5734;
    font-weight: 400;
    transform: rotate(-90deg);
    transition: transform 0.15s;
    margin-top: -2px;
  }
  .min-transfer-wrap.open .min-transfer-toggle::after {
    transform: rotate(90deg);
  }
  .min-transfer-body { display: none; }
  .min-transfer-wrap.open .min-transfer-body { display: block; }
  .settlement-row .arrow { color: var(--gray-500); font-weight: 700; }
  .settlement-row .from { font-weight: 700; color: var(--red); }
  .settlement-row .to { font-weight: 700; color: var(--green-700); }
  .settlement-row .amt { margin-left: auto; font-weight: 800; color: var(--gray-900); }
  @media (max-width: 600px) {
    .settlement-row { padding: 8px 12px; font-size: 13.5px; }
  }
  .empty-state { color: var(--gray-500); font-size: 14px; text-align: center; padding: 20px; }
  .actions { display: flex; gap: 10px; margin-top: 12px; flex-wrap: wrap; }
  button {
    padding: 10px 18px;
    border-radius: 8px;
    border: none;
    font-size: 14px;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.15s;
  }
  button.primary { background: var(--green-700); color: white; }
  button.primary:hover { background: var(--green-900); }
  button.secondary { background: var(--gray-100); color: var(--gray-700); }
  button.secondary:hover { background: var(--gray-200); }
  /* 위험 동작(전체 초기화) — 보조 톤 유지하되 빨간 보더로 구분 */
  button.secondary.danger-btn {
    border-color: #fecaca;
    color: #b91c1c;
  }
  button.secondary.danger-btn:hover {
    background: #fee2e2;
    border-color: #fca5a5;
    color: #991b1b;
  }
  .hint { font-size: 12px; color: var(--gray-500); margin-top: 8px; }
  .bet-display {
    display: inline-block;
    padding: 4px 10px;
    background: var(--gold-light);
    color: #92400e;
    border-radius: 20px;
    font-size: 13px;
    font-weight: 600;
    margin-left: 8px;
  }
  /* OCR section */
  .badge-beta {
    display: inline-block;
    padding: 2px 8px;
    background: var(--blue-light);
    color: var(--blue);
    border-radius: 20px;
    font-size: 11px;
    font-weight: 600;
    margin-left: 8px;
    vertical-align: middle;
  }
  /* OCR 카드 — 위저드/entry 카드와 동일한 스타일 (투명 배경, 동일 패딩·시작점) */
  .ocr-card-wizard {
    background: transparent !important;
    box-shadow: none !important;
    border: none !important;
    padding: 8px 4px 16px !important;
    margin: 0 0 20px !important;
  }
  @media (max-width: 600px) {
    .ocr-card-wizard { padding: 4px 0 12px !important; }
  }
  /* AI 분석 토글 칩 — 클릭 시 설명 펼침. 시각은 기존 badge-beta 와 비슷한 톤. */
  .ai-analyze-toggle {
    display: inline-flex;
    align-items: center;
    padding: 4px 12px;
    background: var(--blue-light, #e0f2fe);
    color: var(--blue, #1e40af);
    border: 1px solid transparent;
    border-radius: 20px;
    font-size: 13px;
    font-weight: 700;
    margin-left: 8px;
    vertical-align: middle;
    cursor: pointer;
    transition: all 0.15s;
    line-height: 1.2;
    white-space: nowrap;
  }
  .ai-analyze-toggle:hover,
  .ai-analyze-toggle[aria-expanded="true"] {
    background: var(--blue, #1e40af);
    color: white;
  }
  @media (max-width: 600px) {
    .ai-analyze-toggle { font-size: 12px; padding: 3px 10px; margin-left: 6px; }
  }
  /* OCR 타이틀 안의 inline 버튼 들 — picker-h1(36/28px) 안에서 너무 크지 않게 */
  .ocr-title { display: block; }
  /* photo-done 상태 — 업로드 완료 후 진입 UI(타이틀/예시칩/액션 버튼들) 모두 숨김. */
  #ocrCard.ocr-uploaded .ocr-title,
  #ocrCard.ocr-uploaded .ocr-actions { display: none !important; }
  /* '인식 결과 확인' 버튼 — 항상 숨김. 데이터/모달은 유지되어 나중에 다른 트리거로 재호출 가능. */
  .ocr-result-open-btn { display: none !important; }
  /* 인식 결과 모달 — 사진 + 파싱 결과 + AI JSON 통합. 넓고 스크롤. */
  .ocr-result-modal {
    max-width: 720px;
    width: calc(100vw - 32px);
    max-height: 85vh;
    overflow-y: auto;
  }
  /* OCR 인식 실패 모달 — 사진 미리보기 + 안내 메시지 + 확인 버튼 */
  .ocr-error-modal {
    max-width: 480px;
    width: calc(100vw - 32px);
    max-height: 85vh;
    overflow-y: auto;
    text-align: center;
  }
  .ocr-error-modal h3 {
    font-size: 18px;
    margin-bottom: 12px;
    color: var(--red, #dc2626);
  }
  .ocr-error-message {
    font-size: 14px;
    line-height: 1.55;
    color: var(--gray-800);
    margin: 0 0 14px;
  }
  .ocr-error-photos {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    justify-content: center;
    margin-bottom: 16px;
  }
  .ocr-error-photos img {
    max-width: 100%;
    max-height: 240px;
    border-radius: 8px;
    border: 1px solid var(--gray-200);
    object-fit: contain;
  }
  .ocr-error-actions {
    display: flex;
    justify-content: center;
  }
  .ocr-error-actions .primary {
    width: 100%;
    padding: 12px;
    font-size: 15px;
    font-weight: 700;
  }
  .ocr-result-modal h3 { font-size: 18px; margin-bottom: 12px; color: var(--green-900); }
  .ocr-section { margin-top: 14px; }
  .ocr-section:first-of-type { margin-top: 0; }
  .ocr-section-label {
    font-size: 13px;
    font-weight: 800;
    color: var(--gray-900);
    margin-bottom: 8px;
    letter-spacing: -0.3px;
  }
  /* photo-wizard-mode — 사진 OCR 후 옵션 위저드 단독 화면. ocr/스코어카드/정산/이전 모두 숨김. */
  body.photo-wizard-mode #ocrCard,
  body.photo-wizard-mode #scorecardCard,
  body.photo-wizard-mode #settlementCard,
  body.photo-wizard-mode .step2-back-wrap { display: none !important; }
  /* 종료 후(사진) 흐름 — 라이브 전용 도우미인 '샘플 점수 채우기' 버튼 숨김 (이미 데모 진행 옵션이 있음). */
  body.entry-photo .sample-fill-btn { display: none !important; }
  /* 사진 업로드 단계에선 venue bar 숨김. 단, OCR 결과(photo-done)에선 노출 — 골프장·날짜 입력해야 저장 가능. */
  body.entry-photo:not(.photo-done-stage) #scVenueBar { display: none !important; }
  /* 스코어카드 하단으로 이동된 게임설정/마킹 row — 상단 row 와 동일 grid 유지하면서 위쪽 간격 확보 */
  .sc-footer-row { margin-top: 16px; margin-bottom: 4px; }
  /* OCR 완료 문구는 상단 로고 행의 설정 버튼으로 대체. legacy DOM은 JS 호환용으로만 유지. */
  .sc-legacy-title-controls,
  .section-view-header { display:none !important; }
  .section-view-line { display:flex; align-items:center; justify-content:flex-start; gap:8px; min-height:28px; }
  .section-view-title { font-size:14px; line-height:1.35; font-weight:800; color:var(--gray-900); }
  .section-view-status { flex:none; display:inline-flex; align-items:center; gap:3px; font-size:11px; font-weight:750; color:var(--green-800,#166534); white-space:nowrap; }
  .section-view-status-check { font-size:11px; line-height:1; }
  /* 사진 OCR 모드 — ocrCard 는 빈 컨테이너로 남아 vertical offset 유발. 완전 숨김. */
  body.photo-done-stage #ocrCard { display: none !important; }
  /* 사진 OCR 모드 + 라이브(manual) 모드 — scorecardCard 를 흰 박스 → 투명 컨테이너로 (위저드/엔트리 카드와 동일 톤). 윗 패딩 축소.
     아래 margin 제거 — '결과를 확인해주세요' 와 settlementCard 사이 간격 최소화. */
  body.photo-done-stage #scorecardCard,
  #scorecardCard.live-mode-title {
    background: transparent !important;
    box-shadow: none !important;
    border: none !important;
    padding: 0 4px 16px !important;
    margin: 0 !important;
  }
  @media (max-width: 600px) {
    body.photo-done-stage #scorecardCard,
    #scorecardCard.live-mode-title {
      padding: 0 0 12px !important;
    }
  }
  /* 누적 정산 진행 chip — settlementCard h2 옆. 몇 홀까지 정산됐는지 안내. */
  .cum-progress-chip {
    font-size: 11.5px;
    font-weight: 600;
    color: var(--gray-700);
    background: var(--gray-100);
    border-radius: 8px;
    padding: 2px 8px;
    letter-spacing: 0;
  }
  /* 라이브·OCR 공용 — settlementCard compact 톤(투명 배경, h2 wizard-sub-h 폰트). */
  #settlementCard {
    background: transparent !important;
    box-shadow: none !important;
    border: none !important;
    padding: 0 4px 16px !important;
    margin: 0 0 20px !important;
  }
  #settlementCard h2 {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 15px;
    font-weight: 800;
    color: #000;
    letter-spacing: -0.3px;
    margin: 0 0 10px;
  }
  #settlementCard h2 .bet-display {
    font-size: 12px;
    font-weight: 600;
    color: var(--gray-700);
    letter-spacing: 0;
  }
  /* 데모(샘플로 체험) OCR — 저장/피드 발행 UI 숨김. 게임뷰(save-round/share)와 기록 편집기(sp-stack-*) 모두. */
  body.ocr-demo .save-round-btn,
  body.ocr-demo #saveRoundBtn,
  body.ocr-demo .round-photo-sec,
  body.ocr-demo .share-btn,
  body.ocr-demo .share-scope-row,
  body.ocr-demo .sp-stack-save,
  body.ocr-demo .sp-stack-share { display: none !important; }
  /* 라운딩 저장하기 버튼 — 정산 카드 하단, 카톡공유 위. 메인 그린 톤, 풀폭. 최소송금 섹션과 충분한 간격. */
  .save-round-btn {
    width: 100%;
    padding: 14px;
    background: #1c5734;
    border: 1.5px solid #1c5734;
    color: white;
    border-radius: 12px;
    font-size: 16px;
    font-weight: 700;
    letter-spacing: -0.3px;
    cursor: pointer;
    transition: all 0.15s;
    margin-top: 32px;
  }
  .save-round-btn:hover, .save-round-btn:active {
    background: #163f24;
    border-color: #163f24;
  }
  /* 라운드 저장 위 사진 추가 섹션 — 게시물 작성 화면과 동일한 그리드(.cmp-photo-*) 재사용 */
  .round-photo-sec { margin-top: 20px; }
  .round-photo-title { font-size: 14px; font-weight: 800; color: var(--gray-900,#111827); margin: 0 2px 10px; }
  .round-photo-title span { font-size: 12px; font-weight: 600; color: var(--gray-400,#9ca3af); margin-left: 6px; }
  /* 점당 금액 chip — '업로드 예시' chip 과 동일 톤. 클릭 시 점당 금액 모달 오픈. */
  .bet-chip-btn {
    display: inline-flex;
    align-items: center;
    padding: 5px 12px;
    background: var(--gray-100);
    border: 1.5px solid var(--gray-300);
    color: var(--gray-600);
    border-radius: 10px;
    font-size: 12px;
    font-weight: 600;
    margin-left: 10px;
    vertical-align: middle;
    cursor: pointer;
    transition: all 0.15s;
    line-height: 1.2;
    white-space: nowrap;
    letter-spacing: -0.3px;
    opacity: 0.85;
    font-family: inherit;
  }
  .bet-chip-btn:hover, .bet-chip-btn:active {
    background: var(--gray-200);
    border-color: var(--gray-400);
    color: var(--gray-800);
    opacity: 1;
  }
  @media (max-width: 600px) {
    .bet-chip-btn { font-size: 11px; padding: 4px 10px; margin-left: 6px; border-radius: 9px; }
  }
  /* OCR 모드 — 누적정산 chip 숨김 (사진은 18홀 완료 상태라 의미 없음). */
  body.photo-done-stage .cum-progress-chip { display: none !important; }
  /* 최소 송금 섹션 타이틀 (JS 가 동적으로 삽입) — 라이브·OCR 공용. */
  #settlement .settle-section-title {
    font-size: 14px;
    font-weight: 800;
    color: var(--gray-900, #111827);
    letter-spacing: 0;
    margin: 4px 0 10px;
  }
  /* 정산 박스 하이라이트(골드) 제거. 잔잔한 톤. 라이브·OCR 공용. */
  /* margin-top: 플레이어 결과 ↔ 최소송금 토글 간격. 충분히 띄움. */
  #settlement {
    background: transparent !important;
    padding: 0 !important;
    margin-top: 20px !important;
  }
  /* photo-done 모드 — settlementCard 의 좌우 padding 을 위저드 카드와 동일(4px)로 맞춤 →
     실시간 정산/최소 송금 토글 시작 위치가 위저드2 '타수당 금액' 과 동일한 20px (16+4) 에 정렬. */
  body.photo-done-stage #settlementCard {
    padding-left: 4px !important;
    padding-right: 4px !important;
  }
  /* 실시간 정산 헤더 행 — 좌: toggle, 우: bet chip (우측정렬). settlementCard padding 만으로 정렬.
     scorecard-wrap 바로 아래에 위치하므로 위쪽 margin 으로 간격 확보 (스코어카드 열렸을 때 답답함 방지). */
  .settle-header-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    margin: 24px 0 16px;
  }
  /* 스코어카드 열린 상태에선 위 간격 더 넓게 (총합 행 바로 아래라 시각적 여유 필요). */
  body.details-shown .settle-header-row { margin-top: 32px; }
  .settle-toggle {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 6px;
    padding: 0;
    background: transparent;
    border: none;
    cursor: pointer;
    text-align: left;
    font-family: inherit;
    transition: opacity 0.15s;
    flex: 0 0 auto;
  }
  .settle-toggle:active { opacity: 0.6; }
  .settle-toggle .settle-label {
    font-size: 15px;
    font-weight: 800;
    color: #000;
    letter-spacing: -0.3px;
  }
  .settle-toggle::after {
    content: '‹';
    font-size: 28px;
    line-height: 1;
    color: #1c5734;
    font-weight: 400;
    transform: rotate(90deg);
    transition: transform 0.15s;
    margin-top: -2px;
  }
  /* 접힘 상태: chevron 아래 방향 (-90deg). open 일 땐 위 방향 (90deg). */
  .settle-header-row:not(.open) .settle-toggle::after { transform: rotate(-90deg); }
  /* bet chip 우측정렬 — 자동 우측으로 밀림 (space-between 으로 이미 처리됨). */
  .settle-header-row .bet-chip-btn { margin-left: auto; }
  /* 접힘 상태에서 토글버튼 ↔ 실시간 정산 간격 좁힘. */
  body.photo-done-stage:not(.details-shown) #scorecardCard .sc-section-toggle-btn {
    margin: 4px 0 0;
  }
  body.photo-done-stage:not(.details-shown) #scorecardCard {
    padding-bottom: 0 !important;
  }
  @media (max-width: 600px) {
    body.photo-done-stage:not(.details-shown) #scorecardCard {
      padding: 0 !important;
    }
  }
  /* 사진 OCR 모드 — 전/후반 탭 노출(전체/전반/후반). 표 필터는 view-* (setSectionView) 로 동작. */
  /* (구) display:none !important 로 영구 숨김했던 것 해제 — 사용자 요청으로 토글 복원. */
  /* 사진 OCR 모드 — thead(플레이어명+HDCP) 와 summary-grand(통합 18홀) 는 상세 토글 안에서만 노출. */
  /* 스코어카드 테이블 — body.details-shown 일 때만 thead/summary-grand 노출. 라이브/OCR 공용. */
  body:not(.details-shown) #settlementCard thead { display: none; }
  body:not(.details-shown) #scorecardBody tr.summary-grand { display: none; }

  /* 상세 스코어카드 토글 — 위저드2 '타수당 금액' (wizard-sub-h) 와 동일한 폰트 (15px / 800 / 검정).
     chevron 은 상단바 ‹ 와 비슷한 크기/굵기 — 텍스트 바로 옆에 붙임. */
  .sc-section-toggle-btn { display: none; }
  #settlementCard .sc-section-toggle-btn {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 6px;
    width: 100%;
    padding: 0;
    background: transparent;
    color: #000;
    border: none;
    border-radius: 0;
    font-size: 15px;
    font-weight: 800;
    font-family: inherit;
    letter-spacing: -0.3px;
    text-align: left;
    cursor: pointer;
    transition: opacity 0.15s;
    white-space: nowrap;
    margin: 8px 0 22px;
  }
  #settlementCard .sc-section-toggle-btn::after {
    content: '‹';
    font-size: 28px;
    line-height: 1;
    color: #1c5734;
    font-weight: 400;
    transform: rotate(-90deg);
    transition: transform 0.15s;
    margin-top: -2px;
  }
  #settlementCard .sc-section-toggle-btn.active::after {
    transform: rotate(90deg);
  }
  #settlementCard .sc-section-toggle-btn:active { opacity: 0.6; }
  /* sc-toggle-row — settlementCard 안으로 이동됨. 실시간 정산/최소송금과 동일 부모 → padding 추가 불필요. */
  #settlementCard .sc-toggle-row {
    display:flex;
    flex-direction:column;
    align-items:stretch;
    gap:0;
    margin:0 0 8px;
  }
  #settlementCard .sc-toggle-row .sc-section-toggle-btn {
    margin: 0;
    width: auto;
    flex: 0 0 auto;
  }
  /* 베뉴/날짜 바 — 토글 자리에서 항상 표시 (라이브·OCR 공용). 업로드 단계만 위 규칙으로 숨김. */
  #settlementCard .sc-toggle-row #scVenueBar { width:100%; display:flex; flex-direction:column; align-items:stretch; justify-content:center; margin:0; min-width:0; gap:3px; }
  #settlementCard .sc-toggle-row #scHalfCourseNav { width:100%; align-self:stretch; }
  /* 베뉴 자동완성 드롭다운 — 좁은 입력칸에 갇히지 않게 중앙 확장. */
  #scVenueBar .sc-vb-venue .sp-venue-suggest, #scVenueSuggest { left: 50%; right: auto; transform: translateX(-50%); min-width: 62vw; max-width: 88vw; }
  /* 룰변경/마킹 chip — 점당 5,000원 (.bet-chip-btn) 과 동일 스타일. */
  #settlementCard .sc-toggle-chip {
    display: inline-flex;
    align-items: center;
    padding: 5px 12px;
    background: var(--gray-100);
    border: 1.5px solid var(--gray-300);
    color: var(--gray-600);
    border-radius: 10px;
    font-size: 12px;
    font-weight: 600;
    line-height: 1.2;
    letter-spacing: -0.3px;
    cursor: pointer;
    transition: all 0.15s;
    white-space: nowrap;
    opacity: 0.85;
    font-family: inherit;
  }
  #settlementCard .sc-toggle-chip:hover,
  #settlementCard .sc-toggle-chip:active {
    background: var(--gray-200);
    opacity: 1;
  }
  #settlementCard .sc-toggle-chip#editModeBtn.active {
    background: #1c5734;
    border-color: #1c5734;
    color: white;
    opacity: 1;
  }
  @media (max-width: 600px) {
    #settlementCard .sc-toggle-chip {
      font-size: 11px;
      padding: 4px 10px;
      border-radius: 9px;
    }
  }
  /* 첫 chip (룰변경) 만 margin-left: auto 로 우측 정렬 시작점 — toggle 과 분리. */
  #settlementCard .sc-toggle-row #scGameDisplay { margin-left: auto; }
  /* 전/후반 view 토글 — sc-toggle-row 우측에 배치. 2개 버튼 segmented control 스타일. */
  #settlementCard .sc-view-toggle {
    margin-left: auto;
    display: inline-flex;
    background: var(--gray-100);
    border: 1.5px solid var(--gray-300);
    border-radius: 10px;
    padding: 2px;
    gap: 0;
  }
  #settlementCard .sc-view-btn {
    padding: 4px 10px;
    background: transparent;
    border: none;
    color: var(--gray-600);
    font-size: 12px;
    font-weight: 700;
    cursor: pointer;
    border-radius: 7px;
    transition: all 0.15s;
    font-family: inherit;
    line-height: 1.2;
    min-width: 44px;
  }
  #settlementCard .sc-view-btn.active {
    background: #1c5734;
    color: white;
  }
  @media (max-width: 600px) {
    #settlementCard .sc-view-btn { font-size: 11px; padding: 3px 9px; min-width: 40px; }
  }
