/* GolfTrace v2 — 모바일 390px 우선. 색/폰트/버튼/여백은 v2 팔레트로 통일하고,
   플레이 화면의 구성 클래스는 reference v34의 화면 구조를 그대로 따른다(legacy CSS 아님).
   타이포: 사용자에게 보이는 텍스트 최소 15px(본문 16px) — 예외는 개발 전용 디버그(.quickDebug)뿐. */
:root{
  --bg:#f3f5f0;--panel:#fff;--line:#dfe4d9;--text:#181d17;--sub:#68715f;
  --green:#15803d;--greenDeep:#14532d;--mint:#e8f3ea;--red:#dc2626;--sand:#ead7a4;
  --shadow:0 8px 24px rgba(20,30,18,.08)
}
*{box-sizing:border-box}
html,body{margin:0}
body{background:#e9ece5;color:var(--text);font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","Apple SD Gothic Neo",sans-serif;font-size:16px;line-height:1.45}
button,input,textarea{font:inherit;color:inherit}
button{cursor:pointer;background:none;border:0;padding:0}
#app{position:relative;max-width:430px;margin:0 auto;min-height:100vh;background:var(--bg);overflow-x:hidden}
.screen{min-height:100vh;display:flex;flex-direction:column}
.body{flex:1;padding:14px 14px 112px}
.label{font-size:15px;font-weight:800;color:var(--sub);margin:16px 2px 8px}
.sub{display:block;font-size:15px;color:var(--sub);font-weight:600;line-height:1.4}
.emptyNote{font-size:15px;color:var(--sub);font-weight:600}
.warnTag{display:block;margin-top:5px;font-size:15px;font-weight:800;color:var(--red)}
.okTag{display:block;margin-top:5px;font-size:15px;font-weight:800;color:var(--green)}

/* ---- 상단 바 / 검색·코스 선택 ---- */
.topbar{position:sticky;top:0;z-index:20;display:flex;align-items:center;gap:8px;padding:10px 14px;background:var(--bg);border-bottom:1px solid var(--line)}
.brand{font-size:20px;font-weight:800;color:var(--greenDeep);letter-spacing:-.3px;flex:1}
.menuBtn{width:48px;height:48px;font-size:20px;border-radius:12px;flex-shrink:0}
.backBtn{width:48px;height:48px;font-size:23px;border-radius:12px;color:var(--greenDeep);flex-shrink:0}
.pageTitle{margin:8px 2px 12px;font-size:23px;font-weight:800;letter-spacing:-.4px}
.searchInput{width:100%;min-height:52px;padding:12px 14px;border:1.5px solid var(--line);border-radius:13px;background:var(--panel);font-size:16px;outline:none}
.searchInput:focus{border-color:var(--green)}
.clubRow,.courseRow{display:block;width:100%;text-align:left;background:var(--panel);border:1.5px solid var(--line);border-radius:14px;padding:15px;margin-bottom:9px;min-height:52px}
.clubRow b{font-size:16px}
.clubRow.on,.courseRow.on{border-color:var(--green);box-shadow:0 0 0 1.5px var(--green) inset}
.courseRow{font-size:16px;font-weight:800;display:flex;align-items:center;justify-content:space-between}
.courseRow .sub9{font-size:15px;font-weight:700;color:var(--sub)}
.readyCard{background:var(--panel);border:1.5px solid var(--line);border-radius:14px;padding:15px;margin-top:14px}
.readyCard b{font-size:16px}
.cta{position:fixed;left:50%;transform:translateX(-50%);bottom:0;width:100%;max-width:430px;z-index:30;
  padding:10px 14px calc(12px + env(safe-area-inset-bottom));background:linear-gradient(transparent,var(--bg) 35%)}
.ctaBtn{width:100%;min-height:52px;border-radius:14px;background:var(--green);color:#fff;font-size:17px;font-weight:800;box-shadow:0 8px 20px rgba(21,128,61,.22)}
.ctaBtn:disabled{background:#b9c2b2;box-shadow:none}
/* 홀 완료 결과 화면 전용 — '다음 홀' 위에 보조 액션(라운드 상세 결과)을 세로로 쌓는다. 다른 화면(course-select/
   round-result)은 버튼이 항상 1개뿐이라 이 규칙이 필요 없다 — 공통 .cta는 건드리지 않고 이 화면에만 추가한다. */
.holeResultCta{display:flex;flex-direction:column;gap:8px}
/* 홀 완료 결과의 '다음 홀' 위 보조 액션(예: 라운드 상세 결과) — 주 버튼과 같은 폭·모서리, 시각적으로만 보조 */
.ctaBtnSecondary{width:100%;min-height:48px;border-radius:14px;background:var(--panel);color:var(--green);border:1.5px solid var(--green);font-size:16px;font-weight:800}
.linkBtn{display:block;margin:14px auto 0;min-height:48px;padding:0 16px;border:1px solid var(--line);border-radius:11px;background:var(--panel);font-size:15px;font-weight:700;color:var(--sub)}

/* ---- 플레이 화면 v2 헤더 ---- */
.playHead{position:sticky;top:0;z-index:40;background:var(--panel);border-bottom:1px solid var(--line);padding:9px 12px 8px}
.phRow1{display:flex;align-items:center;gap:9px}
.phRow1 b{font-size:22px;font-weight:800}
.phRow1 span{font-size:18px;font-weight:800}
.phStroke{color:var(--green)}
.editHoleBtn{min-height:48px;padding:0 13px;border:1px solid var(--line);border-radius:10px;font-size:15px;font-weight:800;color:var(--greenDeep);background:var(--panel)}
.phRow1 .menuBtn{margin-left:auto;width:48px;height:48px}
.phRow2{margin-top:1px;font-size:15px;font-weight:700;color:var(--sub)}
/* 홀 현황: 현재 9홀만 — 390px에서 스크롤 없이 9칸 고정(grid). 홀 번호 15px·결과 16px·현재 홀 = ● */
.phStrip{display:grid;grid-template-columns:repeat(9,minmax(0,1fr));gap:4px;margin-top:8px;padding-bottom:1px}
.phCell{min-width:0;min-height:52px;padding:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;border:1px solid var(--line);border-radius:9px;background:var(--panel);color:var(--sub)} /* 버튼: 완료=수정/현재=유지/미진행=스코어카드 */
.phCell.editing{outline:3px solid #a05c00;outline-offset:-2px}
.editingBar{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:8px;padding:9px 12px;border:1px solid #a05c00;border-radius:11px;background:#fff7ea;color:#a05c00}
.editingBar b{font-size:16px;font-weight:900}
.editingBar{flex-wrap:wrap}
.editingBar button{min-height:44px;padding:0 12px;border:1px solid #a05c00;border-radius:10px;background:#a05c00;color:#fff;font-size:15px;font-weight:900}
.editingBar #editingCancel{background:#fff;color:#a05c00} /* 수정 취소 = 보조(저장 없이 원복) */
.scorecardModal{position:fixed;inset:0;display:none;align-items:center;justify-content:center;background:rgba(17,24,17,.45);z-index:80;padding:16px}
.scorecardModal.open{display:flex}
.scorecardBox{width:min(420px,100%);max-height:86vh;overflow-y:auto;background:#fff;border-radius:16px;padding:14px;box-shadow:0 12px 32px rgba(0,0,0,.25)}
.scHead{display:flex;align-items:center;justify-content:space-between;margin-bottom:8px}
.scHead b{font-size:18px;font-weight:900}
.scHead button{min-height:44px;padding:0 14px;border:1px solid var(--line);border-radius:10px;background:var(--panel);font-size:15px;font-weight:900}
/* 숫자가 열 단위로 정렬된 실제 스코어카드 table(round-summary.js 값 그대로 표시 — 재계산 없음).
   전반/후반 각각 하나의 table(1~9·10~18 tbody + 구간 완료 시에만 OUT/IN tfoot), 18홀 완료 시에만
   그 아래 별도 TOTAL table. OUT·IN·TOTAL을 별도 카드로 만들지 않는다 — 전부 같은 5열 table 구조. */
.srOnly{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.scScoreTable{width:100%;table-layout:fixed;border-collapse:collapse;margin-top:16px;font-size:15px}
.scScoreTable:first-of-type{margin-top:0}
.scScoreCaption{caption-side:top;text-align:left;font-size:15px;font-weight:900;color:var(--sub);padding:0 2px 8px}
/* 전반·후반·TOTAL 세 table이 같은 colgroup(scColHole~scColToggle)을 써서 같은 열 중심선을 공유한다 —
   nth-child 폭 지정은 미완료 행처럼 셀 개수가 다른 행이 섞이면 어긋날 수 있어 쓰지 않는다. */
.scColHole{width:18%}
.scColPar{width:20%}
.scColScore{width:22%}
.scColDiff{width:22%}
.scColToggle{width:48px}
.scScoreTable th,.scScoreTable td{box-sizing:border-box;padding:9px 4px;text-align:center;vertical-align:middle;white-space:nowrap;min-height:44px;border-bottom:1px solid var(--line);font-size:15px}
.scScoreTable thead th{color:var(--sub);font-weight:800;background:#f4f6f1}
.scScoreRow{cursor:pointer}
.scScoreRow:active{background:var(--mint)}
.scScoreRowIncomplete th,.scScoreRowIncomplete td{color:var(--sub);font-weight:700}
.scScoreToggle{min-width:44px;min-height:44px;padding:0;display:inline-flex;align-items:center;justify-content:center;font-size:15px;font-weight:900;color:var(--sub);border-radius:8px}
.scScoreToggle:focus-visible{outline:2px solid var(--green);outline-offset:-2px}
.scScoreDetail td{text-align:left;white-space:normal;padding:2px 6px 12px;font-size:15px;color:var(--sub);font-weight:700;background:#fafbf8}
.scScoreSubtotal th,.scScoreSubtotal td{font-weight:900;background:#f7faf6}
.scSummaryMeta td{text-align:left;white-space:normal;font-size:15px;color:var(--sub);font-weight:700;padding:2px 4px 10px;background:#f7faf6}
.scScoreTotalTable{margin-top:16px}
.scScoreTotalTable .scScoreSubtotal th,.scScoreTotalTable .scScoreSubtotal td{background:var(--mint);color:var(--greenDeep);border-color:var(--green)}
.scScoreTotalTable .scSummaryMeta td{background:var(--mint);color:var(--greenDeep)}
.scNote{margin-top:9px;font-size:15px;color:var(--sub);font-weight:750}
.scFrontReportRow td{padding:2px 4px 10px;background:#f7faf6}
.scFrontReportRow .linkBtn{margin:6px auto 0;min-height:40px}
.phCell small{font-size:15px;font-weight:800;line-height:1}
.phCell b{font-size:16px;font-weight:900;line-height:1;white-space:nowrap}
.phCell.cur{background:var(--green);border-color:var(--green);color:#fff}
.phCell.done{background:var(--mint);color:var(--green)}

/* ================= 이하 플레이 화면 — reference v34 구조 클래스 (팔레트만 v2) ================= */
.playScreen .puttWrap{display:none}
.playScreen .shotWrap{padding-bottom:128px} /* 고정 CTA 아래 콘텐츠(핀·경사 행)를 스크롤로 노출 */
.playScreen.putting .shotWrap{display:none}
.playScreen.putting .puttWrap{display:block}

.mapSec{padding:12px 12px 0}
.mapCard{background:var(--panel);border:1px solid var(--line);border-radius:20px;overflow:hidden;box-shadow:var(--shadow)}
.mapHead{display:flex;align-items:center;justify-content:space-between;padding:11px 12px 8px}
.mapHead b{display:block}.mapHead small{color:var(--sub);font-size:15px}
.rotBtns{display:flex;align-items:center;gap:6px}
.rotBtns button{width:44px;height:44px;padding:0;margin:0;border:1px solid var(--line);border-radius:11px;background:var(--panel);font-size:19px;line-height:1;display:flex;align-items:center;justify-content:center;box-sizing:border-box}
/* 잠정구(Phase 1.5) 탭 — mapHead와 mapBody 사이 별도 행(오버레이 아님)이라 확대/회전 버튼·오른쪽
   앵커 메뉴 패널과 구조적으로 절대 겹치지 않는다. 원구 활성 = 기존 경로색(빨강) 그대로 유지 —
   초록으로 바꾸지 않는다. 잠정구 활성 = 주황(주 경로 스타일 #shotMapSvg.provisionalActive와 동일 색). */
.provTabs{display:flex;align-items:center;gap:6px;padding:0 12px 8px}
.provTabBtn{flex:1;min-width:0;min-height:40px;border:1px solid var(--line);border-radius:10px;background:#f6f9f4;color:var(--sub);font-size:15px;font-weight:850}
.provTabBtn.on{color:#fff}
.provTabBtn#provTabOriginal.on{background:var(--red);border-color:var(--red)}
.provTabBtn#provTabProvisional.on{background:#f97316;border-color:#f97316}
.provTabMore{flex:0 0 auto;min-width:36px;min-height:40px;padding:0 8px;border:1px solid var(--line);border-radius:10px;background:var(--panel);color:var(--sub);font-size:18px;font-weight:900;line-height:1}
/* 잠정구(Phase 2) — DECIDING 확정 전 벌타 미리보기(탭 행과 겹치지 않는 별도 줄) · 손상 데이터
   fail-closed 안내(editingBar와 같은 경고 톤 재사용, 새 색상 추가하지 않음). */
.provPenaltyPreview{margin:0 12px 8px;font-size:15px;font-weight:800;color:#c2410c}
.provLockedBar{margin-top:8px;padding:9px 12px;border:1px solid #a05c00;border-radius:11px;background:#fff7ea;color:#a05c00;font-size:15px;font-weight:800}
.mapBody{height:420px;position:relative;background:#d2e5c0;overflow:hidden;touch-action:none}
/* 확대 전이 없음 — 전이 중에는 getScreenCTM이 중간 행렬을 돌려줘 그 사이의 터치가 다른 좌표로 저장된다.
   2타 전환 시 최종 확대 상태를 즉시 적용한다(입력을 시간으로 막지 않는다). */
#rotator{position:absolute;inset:0;transform-origin:50% 50%}
#floatingAim{position:absolute;left:0;top:0;width:100%;height:100%;pointer-events:none;z-index:19;overflow:visible} /* 손가락 가림 보정용 플로팅 조준점 overlay — 표시 필수 스타일은 floating-aim.js가 inline으로도 지정(CSS 캐시 무관), 여기는 보조 */
.mapBody svg,#puttBoard svg{width:100%;height:100%;display:block}
/* 퀵버튼 4개는 항상 표시(접기 없음) — 빈 영역은 지도 조작 통과, 폭은 라벨(현재칠거리 등)
   줄바꿈·값 잘림 없는 최소 폭(≤116px)으로 4개 동일 */
.quickStack{position:absolute;left:8px;top:12px;z-index:10;display:flex;flex-direction:column;gap:7px;width:104px;pointer-events:none}
.quickStack>*{pointer-events:auto}
.quickWrap{position:relative}
.startAdjustMark{display:block;margin-top:2px;font-size:15px;font-weight:800;color:#a05c00} /* 타수 흐름 '시작점 보정' 표시 */
/* 잠정구(Phase 1.5) — 타수 흐름 카드에서 문제 샷·잠정구 branch 샷을 구분. 기존 .strokeMain.on/.review
   강조와 동시에 적용돼도 겹치지 않게 border만 사용한다. .provTag는 카드 안 "원구"/"결과 미확정"
   보조 표시 — startAdjustMark와 같은 톤(주황갈색 = 이 화면의 "보조 안내" 색). */
.strokeMain.provisionalShot{border-color:#f97316;color:#c2410c}
.provTag{display:block;margin-top:2px;font-size:15px;font-weight:800;color:#a05c00}
/* 지도 — 지금 보고 있는 샷이 잠정구 branch일 때만 적용되는 클래스(#shotMapSvg.provisionalActive).
   원구 경로(클래스 없음)의 기존 스타일은 전혀 바뀌지 않는다. CSS 클래스가 SVG 프리젠테이션
   속성(stroke=...)보다 우선하므로 인라인 값을 그대로 덮어쓸 수 있다 — 최종 점선 디자인은 Phase 3. */
#shotMapSvg.provisionalActive #curvePath{stroke:#f97316;stroke-dasharray:10 7}
#shotMapSvg.provisionalActive #arrowEnd,#shotMapSvg.provisionalActive #curveHandle{stroke:#f97316}
#shotMapSvg.provisionalActive #arrowHead{fill:#f97316}
.quickBtn{width:104px;min-height:60px;border:1px solid #adb5ad;background:rgba(255,255,255,.97);border-radius:13px;padding:8px 9px;text-align:left;box-shadow:0 4px 12px rgba(0,0,0,.07);touch-action:none;user-select:none}
.quickBtn span{display:block;font-size:15px;color:var(--sub);font-weight:850;line-height:1.25;white-space:nowrap}
.quickBtn strong{display:block;font-size:17px;margin-top:2px;line-height:1.25;white-space:nowrap}
.quickDebug{width:180px;background:rgba(17,24,17,.85);color:#d9f2dc;border-radius:9px;padding:6px 8px;font-size:12px;font-weight:700;line-height:1.35;word-break:break-all} /* 개발 전용 스와이프 디버그(기본 숨김) */
/* 오른쪽 세로 패널 — 지도 오른쪽 상단 정렬, 지도 높이 안 최대, 한 번에 하나만 열림.
   currentRemain/nextRemain 전용(Phase 3-B) — 5m 숫자 바둑판만 렌더한다(클럽/도착위치/시작 라이는
   .quickAnchorPopup으로 이동했다 — 이 패널에는 더 이상 목록을 렌더하지 않는다). */
.pickerPanel{position:absolute;top:12px;right:8px;width:min(226px,calc(100% - 126px));max-height:calc(100% - 24px);display:none;background:rgba(255,255,255,.97);border:1px solid #adb5ad;border-radius:14px;box-shadow:0 6px 16px rgba(0,0,0,.14);overflow-y:auto;overflow-x:hidden;touch-action:pan-y;-webkit-overflow-scrolling:touch;overscroll-behavior-y:contain;z-index:11;padding:6px}
.pickerPanel.open{display:block}
/* 거리 입력 컨트롤(현재칠거리·다음칠거리) — 2열. 왼쪽 = 5m 세로 휠(자유 스크롤 + 스냅 + 관성을
   네이티브 scroll-snap으로 얻는다), 오른쪽 = 그 5m 구간 안의 일의 자리 5개.
   폭: 지도 우측 1/3을 넘지 않는다(320px 지도 → 105.6px). 오른쪽 열은 최소 터치 타겟 44px로
   고정하고 휠이 남은 폭을 가져간다 — 이 순서라 어떤 폭에서도 44px가 먼저 보장된다. */
/* 높이는 지도 안에서 쓸 수 있는 만큼 전부 쓴다(상하 12px씩 = .quickStack과 같은 여백).
   고정 220px이던 이전 판보다 휠에 보이는 항목 수가 늘고 일의 자리 버튼도 그만큼 커진다. */
.pickerPanel.distCtl{width:min(106px,33%);height:calc(100% - 24px);box-sizing:border-box;padding:3px;overflow:hidden}
.distRow{display:flex;gap:4px;align-items:stretch;height:100%}
.distWheel{flex:1;min-width:0;height:100%;box-sizing:border-box;overflow-y:auto;overflow-x:hidden;
  scroll-snap-type:y mandatory;touch-action:pan-y;overscroll-behavior-y:contain;-webkit-overflow-scrolling:touch;
  scrollbar-width:none}
.distWheel::-webkit-scrollbar{display:none}
/* (휠 높이 − 항목 높이) / 2 — 첫·마지막 항목도 가운데 줄에 올 수 있게 위아래를 비워 둔다.
   높이가 가변이 되면서 고정 88px 대신 백분율로 따라가게 했다. 이 값이 정확해야 스크롤 위치
   ↔ 항목 인덱스가 scrollTop = index × 44로 유지된다(패딩이 상쇄되는 구조 — JS 계산 불변). */
.distWheelPad{height:calc(50% - 22px)}
.distWheelItem{height:44px;display:flex;align-items:center;justify-content:center;scroll-snap-align:center;
  font-size:15px;font-weight:900;color:var(--sub);touch-action:pan-y;cursor:pointer}
.distWheelItem.on{color:var(--green);font-size:17px}
.distWheelItem.pressed{background:#eef3ec;border-radius:9px}
/* 5칸이 컨트롤 높이를 균등 분할한다(각 = 높이/5) — 최소 터치 타겟 44px는 하한으로 유지 */
.distOnes{display:flex;flex-direction:column;flex:0 0 44px;width:44px;height:100%}
.distOnesBtn{flex:1;min-height:44px;min-width:44px;border:1px solid var(--line);border-radius:11px;background:var(--panel);
  font-size:16px;font-weight:900;padding:0;touch-action:pan-y}
.distOnesBtn.on{background:var(--green);color:#fff;border-color:var(--green)}
.distOnesBtn.pressed{background:#e6efe4}
/* anchor popup — 클럽/도착위치/시작 라이(Phase 3-B). document.body 최상위 fixed 레이어 하나
   (#quickAnchorLayer, gesture-picker.js가 1회만 생성) 안에 팝업 1개를 두고 위치만 JS로 계산한다.
   .mapBody(overflow:hidden)·#v2Overlays(매 rerender마다 재생성) 어느 쪽에도 속하지 않는다. */
/* z-index 42 — 지도 내부 요소(.quickStack 10 · .pickerPanel 11)와 상단 sticky 헤더(.playHead 40)
   보다는 위, 하단 고정 액션 바(.bottom 45)보다는 아래. 메뉴가 지도 아래쪽까지 내려와도 "다음 타"
   버튼이 항상 그 위에 그려진다(실기기 확정: 메뉴 항목이 메인 버튼 위로 올라오면 안 되고, 버튼
   아래로 깔리면 된다). 헤더와 같은 40을 쓰면 순서가 DOM 위치에 의존하므로 일부러 42로 띄운다. */
#quickAnchorLayer{position:fixed;inset:0;pointer-events:none;z-index:42}
/* 폭은 메뉴 자신의 가장 긴 항목(qapAuto/qapItem, width:100%)에 맞춰 max-content로 자연 결정된다 —
   세 메뉴(클럽/도착 위치/시작 라이)에 공통 고정 px 폭을 강제하지 않는다. JS(positionAnchorPopup)가
   지도 내부 폭·viewport를 넘지 않도록 max-width만 별도로 clamp한다. */
.quickAnchorPopup{position:fixed;pointer-events:auto;box-sizing:border-box;width:max-content;background:rgba(255,255,255,.98);border:1px solid #adb5ad;border-radius:14px;box-shadow:0 8px 20px rgba(0,0,0,.18);overflow-y:auto;overflow-x:hidden;touch-action:pan-y;-webkit-overflow-scrolling:touch;overscroll-behavior-y:contain;padding:6px}
.quickAnchorPopup[hidden]{display:none}
.qapAuto{display:block;box-sizing:border-box;width:100%;min-height:44px;margin-bottom:6px;border:1px solid var(--line);border-radius:11px;background:var(--panel);font-size:15px;font-weight:850;text-align:left;padding:0 12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.qapAuto.on{background:var(--green);color:#fff;border-color:var(--green)}
.qapList{display:flex;flex-direction:column;gap:6px}
.qapItem{min-height:44px;box-sizing:border-box;width:100%;border:1px solid var(--line);border-radius:11px;background:var(--panel);font-size:16px;font-weight:850;text-align:left;padding:0 12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.qapItem.on{background:var(--green);color:#fff;border-color:var(--green)}
.qapAuto:focus-visible,.qapItem:focus-visible,.quickBtn:focus-visible{outline:3px solid #2563eb;outline-offset:2px}
.quickSrcTag{display:inline-block;margin-left:6px;font-size:15px;font-weight:800;color:var(--sub)}
/* 퀵 버튼 5개(클럽/현재칠거리/도착위치/시작 라이/다음칠거리) 중 현재 열린 메뉴에 해당하는 버튼
   자체를 강조 — 메뉴 내부 항목 표시(.qapItem.on 등)와는 별개다. wraps[key].wrap(.quickWrap)에
   openKey 일치 여부로 토글되는 기존 'open' 클래스를 그대로 재사용(setWrapOpenClasses). */
.quickWrap.open .quickBtn{background:var(--green);border-color:var(--green)}
.quickWrap.open .quickBtn span,.quickWrap.open .quickBtn strong,.quickWrap.open .quickBtn .quickSrcTag{color:#fff}
/* 거리 요약 — 지도 하단 2×2(오버레이 금지). 라벨 15px·값 17px */
.mapSummary{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:4px 12px;padding:9px 12px;border-top:1px solid var(--line);background:var(--panel)}
.mapSummary>div{min-width:0;display:flex;align-items:baseline;justify-content:space-between;gap:6px}
.mapSummary span{font-size:15px;color:var(--sub);font-weight:850;white-space:nowrap}
.mapSummary b{font-size:17px;color:var(--green);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mapSummary>div:last-child{grid-column:1/-1} /* 도착 위치("페어웨이 · 자동")는 전체 폭 — 잘림 금지 */
/* 핀 위치·경사 선택 — 한 줄 2열, 각 영역 전체가 버튼 */
.selRow{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;padding:8px 10px;background:var(--panel)}
.selBtn{display:flex;align-items:center;gap:8px;min-height:52px;border:1px solid var(--line);background:#f6f9f4;border-radius:12px;padding:8px 12px;text-align:left;touch-action:none;user-select:none}
.selBtn span{font-size:15px;color:var(--sub);font-weight:850;white-space:nowrap}
.selBtn b{flex:1;min-width:0;font-size:16px;text-align:right;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pinGrid{display:none;grid-template-columns:repeat(3,1fr);gap:6px;padding:0 10px 10px;background:var(--panel)}
.pinGrid.open{display:grid}
.pinCell{min-height:48px;border:1px solid var(--line);border-radius:10px;background:#f8faf7;font-size:15px;font-weight:850;padding:0}
.pinCell.on{background:var(--green);color:#fff;border-color:var(--green)}
/* 경사 메뉴 — 3줄 고정: [평지(전체 폭)] / [발끝 오르막][발끝 내리막] / [왼발 오르막][왼발 내리막].
   완료 버튼 없음, 선택 항목만 ✓, 재탭해도 해제 안 됨 */
.slopeMenu{display:none;padding:0 10px 10px;background:var(--panel)}
.slopeMenu.open{display:block}
.slopeGrid{display:grid;grid-template-columns:1fr 1fr;gap:8px;padding:2px}
.slopeItem{min-height:52px;padding:0 10px;border:1px solid var(--line);border-radius:12px;background:#f8faf7;font-size:15px;font-weight:850}
.slopeItem.full{grid-column:1/-1}
.slopeItem.on{background:var(--green);color:#fff;border-color:var(--green)}
/* 줌 버튼(Phase 커밋 B) — 배지 좌우 −/+. 배지 자체는 여전히 조작 기능이 없는 텍스트 전용 표시
   (카드·테두리·배경 없음, 배경 위에서도 읽히도록 옅은 text-shadow만 사용). 버튼은 히트 영역
   48×48을 확보하되(투명, 지도 나머지 영역 터치는 그대로 통과) 시각적으로는 그 안의 작은 원
   (.mapZoomBtnDot)만 보이게 해 지도를 가리는 면적을 최소화한다. */
.mapZoomGroup{position:absolute;left:9px;bottom:9px;z-index:18;display:flex;align-items:center;gap:2px}
.mapZoomBadge{font-size:12px;font-weight:800;color:var(--greenDeep);text-shadow:0 1px 2px rgba(255,255,255,.9),0 0 3px rgba(255,255,255,.75);pointer-events:none;min-width:34px;text-align:center}
.mapZoomBtn{width:48px;height:48px;padding:0;margin:0;background:transparent;border:0;display:flex;align-items:center;justify-content:center;box-sizing:border-box}
.mapZoomBtnDot{display:flex;align-items:center;justify-content:center;width:26px;height:26px;border-radius:50%;background:var(--panel);border:1px solid var(--line);font-size:15px;font-weight:900;line-height:1;color:var(--greenDeep);box-shadow:0 1px 3px rgba(0,0,0,.18)}

.shotNav{position:sticky;top:150px;z-index:34;margin:10px 0 0;padding:0 10px 8px;background:rgba(243,245,240,.97);backdrop-filter:blur(8px);border-bottom:1px solid var(--line)}
/* 타수 레일: 모든 항목(타수·벌타·＋/퍼팅)이 .strokeEntry 래퍼 하나로 같은 정렬 규칙을 쓴다.
   stretch로 높이를 맞추고, 테두리는 항상 2px로 두어 선택 전후 크기가 변하지 않게 한다. */
.shots{display:flex;gap:9px;overflow:auto;scrollbar-width:none;align-items:stretch;padding-top:10px}
.shots::-webkit-scrollbar{display:none}
.strokeEntry{position:relative;flex:0 0 auto;padding-top:6px;display:flex;box-sizing:border-box}
.shots .strokeEntry{width:100px}
.shots .strokeEntry .shot{width:100px;min-width:100px;height:auto}
.shot{flex:0 0 100px;min-height:64px;border:2px solid var(--line);background:var(--panel);border-radius:13px;padding:9px 8px;text-align:center;box-sizing:border-box;display:flex;flex-direction:column;align-items:center;justify-content:center}
.shot b{display:block;font-size:16px}.shot span{display:block;font-size:15px;color:var(--sub);margin-top:3px;line-height:1.3}
.shot.on{border-color:var(--green);background:#f1f8f3}
.shot.add{font-size:22px;font-weight:900;color:var(--green);min-width:84px}
.shot.penaltyShot{min-width:80px;background:#fff1ef;color:var(--red);border-color:#efc5c0}
.shot.review .shotReviewMark{color:#a05c00}.shotReviewMark{display:inline;margin-left:3px;font-size:15px}
.strokeDeleteX{position:absolute;right:-12px;top:-6px;z-index:4;width:44px;min-width:44px;height:44px;padding:0;border:1px solid #e5b7b2;border-radius:50%;background:#fff7f6;color:var(--red);font-size:19px;line-height:42px;font-weight:950;box-shadow:0 2px 6px rgba(0,0,0,.12)}

.content{padding:12px 12px 128px}
.card{background:var(--panel);border:1px solid var(--line);border-radius:16px;padding:12px;margin-bottom:10px}
.cardHead{display:flex;align-items:center;justify-content:space-between;margin-bottom:9px}
.cardHead h3{margin:0;font-size:17px}.tag{font-size:15px;font-weight:900;border-radius:999px;padding:5px 10px;background:#edf0ed;color:var(--sub)}
.railLbl{font-weight:900;margin-bottom:8px}
.rail{display:flex;gap:8px;overflow:auto;scrollbar-width:none;padding-bottom:2px}
#curveRail{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));overflow:visible;gap:6px}
#curveRail .visualChoice{min-width:0;flex:none;padding:7px 2px;font-size:15px;line-height:1.2;word-break:keep-all}
#curveRail .visual{height:34px;font-size:24px}
#startRail{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));overflow:visible}
#startRail .visualChoice{min-width:0;flex:none}
#combinedShape{margin-top:10px;background:#f4f8f5;border:1px solid var(--line);border-radius:13px;padding:12px;font-weight:900;color:var(--green)}
.issueGrid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
.issueChip{border:1px solid var(--line);background:var(--panel);border-radius:12px;padding:11px 7px;font-size:15px;font-weight:850;line-height:1.3;min-height:48px}
.issueChip.on{background:var(--mint);border:2px solid var(--green);color:var(--green)}
.visualChoice{flex:0 0 92px;border:1px solid var(--line);background:var(--panel);border-radius:12px;padding:8px 5px;text-align:center;font-size:15px;font-weight:850;min-height:48px}
.visualChoice.on{background:var(--mint);border:2px solid var(--green);color:var(--greenDeep)}
.visual{height:32px;display:flex;align-items:center;justify-content:center;font-size:24px}
.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.chip{min-height:48px;border:1px solid var(--line);background:var(--panel);border-radius:11px;padding:8px 5px;font-size:15px;font-weight:850}
.chip.on{background:var(--mint);border:2px solid var(--green);color:var(--green)}
textarea{width:100%;min-height:86px;border:1px solid var(--line);border-radius:14px;padding:12px;resize:vertical;background:var(--panel)}
.penGrid{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}
.pen{border:1px solid var(--line);background:var(--panel);border-radius:12px;padding:11px 4px;font-size:15px;font-weight:850;min-height:48px}
.pen.on{background:#fff0ee;border:2px solid var(--red);color:var(--red)}
.pen.onReview{background:#fff4df;border:2px solid #d7a94b;color:#8a5a00}
/* 잠정구(Phase 1.5) 진행 중 멀리건·잠정구 버튼 — 숨기지 않고 비활성만(레이아웃 이동 없음) */
.pen:disabled{opacity:.42;pointer-events:none}
#penGridRow{grid-template-columns:repeat(3,1fr)} /* 초기화·+1·+2 세 칸 — 멀리건은 아래 별도 2열 행으로 옮김 */
/* 잠정구(Phase 2) 버튼 한 줄 — 멀리건·잠정구·구제 처리 3칸. .penGrid(4열) 자체는 건드리지 않고
   전용 클래스만 새로 둔다(다른 3개 .penGrid 행은 그대로 4열 유지). */
.penGrid3{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.reliefLine{font-size:15px;color:var(--sub);font-weight:700;text-align:right;margin-bottom:8px}
.startPointStatusBadge{margin-left:8px;font-size:15px;font-weight:800;color:var(--sub);background:var(--panel);border:1px solid var(--line);border-radius:8px;padding:2px 8px;vertical-align:middle}
.predictableNote{font-size:15px;color:var(--sub);font-weight:700;margin-bottom:8px;line-height:1.4}
.puttTransitionCard{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:12px;align-items:center;margin-bottom:12px;padding:14px;background:var(--panel);border:1px solid var(--line);border-radius:17px;box-shadow:0 5px 16px rgba(0,0,0,.05)}
.puttTransitionText b{display:block;font-size:16px;color:var(--green)}
.puttTransitionText span{display:block;margin-top:4px;font-size:15px;line-height:1.4;color:var(--sub);font-weight:750}
.modeSwitch{min-width:112px;height:48px;border:0;background:var(--green);color:#fff;border-radius:13px;padding:0 14px;font-size:15px;font-weight:950;white-space:nowrap}
.modeSwitch.secondary{background:var(--panel);color:var(--green);border:1px solid var(--green)}
.bottom{position:fixed;left:50%;transform:translateX(-50%);bottom:0;width:min(430px,100%);padding:10px 12px calc(10px + env(safe-area-inset-bottom));background:linear-gradient(transparent,rgba(243,245,240,.96) 25%,rgba(243,245,240,1));z-index:45}
.next{width:100%;height:54px;border:0;border-radius:16px;background:var(--green);color:#fff;font-size:17px;font-weight:950;box-shadow:0 10px 24px rgba(21,128,61,.25)}
.next:disabled{background:#aeb6ad;box-shadow:none;cursor:default;color:#fff}
/* 하단 [이전 타](보조) + 메인(주) — 이전 타가 없으면 메인 버튼이 전체 폭 */
.bottom.withPrev{display:flex;gap:8px;align-items:stretch}
.bottom.withPrev .next{flex:1;width:auto}
.prevStroke{flex:0 0 33%;height:54px;border:1px solid var(--line);border-radius:16px;background:var(--panel);color:var(--ink);font-size:16px;font-weight:900}
.toast{position:fixed;left:50%;transform:translateX(-50%);bottom:86px;background:#111;color:#fff;padding:11px 16px;border-radius:999px;font-size:15px;font-weight:900;opacity:0;transition:.2s;z-index:100;pointer-events:none}
.toast.show{opacity:1}

/* ---- 퍼팅 (reference 구조) ---- */
.puttHeader{padding:12px}
.puttBoardBox{background:var(--panel);border:1px solid var(--line);border-radius:18px;overflow:hidden;box-shadow:var(--shadow)}
.puttMapShell{position:relative;overflow:hidden;background:#bfd8aa}
#puttBoard{height:340px;background:#e9eee7;touch-action:none}
.puttTools{display:flex;justify-content:flex-end;gap:6px;padding:9px 12px;border-top:1px solid var(--line);background:#f8faf7}
.puttTools button{height:48px;min-width:112px;padding:0 16px;border:1px solid var(--line);background:var(--panel);border-radius:11px;font-size:15px;font-weight:900;color:var(--green)}
.puttTools .pinTool.on{background:var(--green);color:#fff;border-color:var(--green)}
.puttTools .cancelPin{display:none;color:var(--red);border-color:#ebc7c3;min-width:124px}
.puttTools .cancelPin.show{display:block}
.pinEditOverlay{display:none;position:absolute;inset:0;z-index:12;background:rgba(18,36,22,.12);pointer-events:none}
.pinEditOverlay.open{display:flex;align-items:flex-start;justify-content:center;padding-top:14px}
.pinEditOverlay span{background:#111;color:#fff;border-radius:999px;padding:9px 13px;font-size:15px;font-weight:900}
/* Phase 4-B: 필수 위치 구제 preview — pinEditOverlay/puttTools와 같은 패턴(안내 배너 + 확정·취소 버튼) */
.reliefPlaceOverlay{display:none;position:absolute;inset:0;z-index:12;background:rgba(18,36,22,.12);pointer-events:none}
.reliefPlaceOverlay.open{display:flex;align-items:flex-start;justify-content:center;padding-top:14px}
.reliefPlaceOverlay span{background:#111;color:#fff;border-radius:999px;padding:9px 13px;font-size:15px;font-weight:900;text-align:center}
.reliefPlaceTools{display:flex;align-items:center;gap:8px;padding:9px 12px;border-top:1px solid var(--line);background:#f8faf7}
.reliefPlaceTools span{flex:1;min-width:0;font-size:15px;font-weight:800;color:var(--sub);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.reliefPlaceTools button{height:44px;min-width:88px;padding:0 14px;border:1px solid var(--line);background:var(--panel);border-radius:11px;font-size:15px;font-weight:900}
.reliefPlaceTools #reliefPlaceConfirm{background:var(--green);color:#fff;border-color:var(--green)}
.reliefPlaceTools #reliefPlaceCancel{color:var(--red);border-color:#ebc7c3}
.pinOldMarker{opacity:.45}
.puttLocked{opacity:.28}
.mapFirstGuide{position:absolute;left:50%;top:12px;transform:translateX(-50%);z-index:9;max-width:calc(100% - 28px);padding:8px 12px;border-radius:999px;background:rgba(17,21,17,.76);color:#fff;font-size:15px;font-weight:850;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;pointer-events:none;transition:.15s}
.mapFirstGuide.hidden{opacity:0;visibility:hidden}
.puttStrokeDock{position:sticky;top:150px;z-index:34;margin:0 -12px 10px;padding:0 10px 8px;background:rgba(243,245,240,.97);backdrop-filter:blur(8px);border-bottom:1px solid var(--line)}
.strokeNav{display:flex;gap:7px;overflow-x:auto;scrollbar-width:none;padding:9px 2px 0;align-items:flex-start}
.strokeNav::-webkit-scrollbar{display:none}
.strokeNav .strokeEntry .strokeMain{min-width:78px;height:48px;padding:0 14px;border:1px solid var(--line);background:var(--panel);border-radius:11px;font-size:15px;font-weight:900;white-space:nowrap}
.strokeNav .strokeEntry .strokeMain.shotDone{background:#f1f3ef;color:#657065}
.strokeNav .strokeEntry .strokeMain.puttActive{background:var(--green);color:#fff;border-color:var(--green)}
.strokeNav .penaltyStroke,.strokeNav .strokeEntry .strokeMain.penaltyStroke{height:48px;padding:0 13px;border:1px solid #efc5c0;border-radius:11px;background:#fff1ef;color:var(--red);font-size:15px;font-weight:900;white-space:nowrap;flex:0 0 auto}
.strokeNav .concedeStroke{flex:0 0 auto;height:48px;padding:0 13px;background:#fff4df;color:#8a5a00;border:1px solid #e9cc8d;border-radius:11px;font-size:15px;font-weight:900}
.strokeQuickAdd{flex:0 0 auto;height:48px;min-width:112px;border:1.5px dashed var(--green);background:#f3f9f4;color:var(--green);border-radius:11px;padding:0 13px;font-size:15px;font-weight:950;white-space:nowrap}
.puttPlusBtn{min-width:56px;font-size:20px}
.puttFinishMenu{margin:8px 10px 2px;padding:12px;background:var(--panel);border:1.5px solid var(--line);border-radius:14px;box-shadow:0 10px 26px rgba(20,30,18,.16)}
.puttFinishMenu b{display:block;font-size:16px;margin-bottom:9px}
.puttFinishMenu .pfBtns{display:grid;grid-template-columns:repeat(5,1fr);gap:6px}
.puttFinishMenu .pfBtns button{min-height:48px;border:1px solid var(--line);border-radius:11px;background:var(--panel);font-size:15px;font-weight:800}
.puttFinishMenu .pfBtns button:disabled{opacity:.35}
.puttFinishMenu .pfNote{display:block;margin-top:8px;font-size:15px;color:var(--sub);font-weight:700;line-height:1.4}
.puttSelected{filter:drop-shadow(0 3px 5px rgba(0,0,0,.18))}
.puttInactive{opacity:.28}
.puttEnd{fill:#fff;stroke:var(--red);stroke-width:4;cursor:grab}
.puttEnd.sel{fill:#fff7f5;stroke-width:6}
.puttCurveHandleDiamond{fill:#fff;stroke:var(--red);stroke-width:3;cursor:grab}
.puttPathHit{fill:none;stroke:transparent;stroke-width:24;cursor:pointer}
.puttDetailsStack{display:flex;flex-direction:column;gap:10px}
.puttDetailCard{background:var(--panel);border:1px solid var(--line);border-radius:16px;padding:12px}
.puttDetailCard.active{border:2px solid var(--green);background:#fbfdfb}
.puttDetailCard.quick{background:#f8faf7;border-style:dashed}
.puttDetailHead{display:flex;align-items:flex-start;justify-content:space-between;gap:10px;margin-bottom:8px}
.puttDetailHead h3{margin:0;font-size:17px}
.puttDetailHead .puttSummary{display:block;margin-top:4px;font-size:15px;color:var(--sub);font-weight:750;line-height:1.4}
.puttQuickSummary{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-top:8px;padding:11px;border:1px dashed #b8c9ba;border-radius:12px;background:var(--panel);color:var(--sub);font-size:15px;font-weight:850}
.puttQuickSummary b{color:var(--green)}
.puttEmptyGuide{margin-bottom:10px;padding:12px;border:1px dashed #bdc8bd;border-radius:14px;background:#f8faf7;color:var(--sub);font-size:15px;font-weight:850;line-height:1.45}
.puttResultGrid{display:grid;grid-template-columns:1fr 1fr;gap:7px}
.puttResultBlock{min-width:0;border:1px solid var(--line);border-radius:12px;padding:9px;background:#fafbf9}
.puttFieldLabel{display:block;margin-bottom:6px;font-size:15px;font-weight:900}
.compactChoice{display:grid;grid-template-columns:repeat(3,1fr);gap:4px}
.compactChoice button{border:1px solid var(--line);background:var(--panel);border-radius:10px;padding:8px 2px;font-size:15px;font-weight:850;min-height:48px}
.compactChoice button.on{background:var(--green);color:#fff;border-color:var(--green)}
.puttRemainCompact{margin-top:8px;border-top:1px solid var(--line);padding-top:8px}
.puttRemainHead{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:6px;font-size:15px;font-weight:900}
.puttRemainHead span:last-child{color:var(--sub);font-size:15px;font-weight:700}
.puttRemainRail{display:flex;gap:6px;overflow-x:auto;scrollbar-width:none;padding:1px 1px 4px;scroll-snap-type:x proximity}
.puttRemainRail::-webkit-scrollbar{display:none}
.puttRemainRail button{flex:0 0 auto;min-width:66px;height:48px;border:1px solid var(--line);background:var(--panel);border-radius:10px;padding:0 9px;font-size:15px;font-weight:900;scroll-snap-align:center}
.puttRemainRail button.holed{min-width:72px;color:var(--green);border-color:#9cc5aa;background:#f1f8f3}
.puttRemainRail button.on{background:var(--green);color:#fff;border-color:var(--green)}
.concedeBox{background:#f4f8f5;border:1px solid var(--line);border-radius:15px;padding:12px;margin-bottom:12px}
.concedeBox .row{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:9px}
.concedeBox button{border:1px solid var(--line);border-radius:12px;background:var(--panel);padding:12px 8px;font-size:15px;font-weight:900;min-height:48px}
.concedeBox button:first-child{background:var(--green);color:#fff;border-color:var(--green)}
.smallNote{font-size:15px;color:var(--sub);line-height:1.45}
.iconCompactGrid{display:grid;grid-template-columns:repeat(2,1fr);gap:8px}
.iconCompact{min-height:48px;border:1px solid var(--line);background:var(--panel);border-radius:11px;padding:10px;text-align:center;font-size:15px;font-weight:850}
.iconCompact.on{background:var(--mint);border:2px solid var(--green);color:var(--green)}

/* ---- 결과 화면 ---- */
.resultCard{background:var(--panel);border:1px solid var(--line);border-radius:15px;padding:18px;text-align:center}
.resultCard .big{display:block;font-size:32px;font-weight:800;color:var(--greenDeep)}
.resultCard span{display:block;margin-top:6px;font-size:15px;font-weight:700;color:var(--sub);line-height:1.4}
.resultList{margin:0;padding:0 2px;list-style:none}
.resultList li{padding:12px 2px;border-bottom:1px solid #e6eae1;font-size:15px;font-weight:700;line-height:1.4}
.resultList .sub{margin-top:2px;font-weight:600}
.resultList li.unadoptedRow b{color:#c2410c} /* 잠정구 · 미채택 — 총타수(위 큰 숫자)와 무관한 정보성 항목임을 색으로 구분(provPenaltyPreview와 같은 톤) */

/* ---- 결정 모달 / 드로어 / 오버레이 ---- */
.resultModal{position:fixed;inset:0;z-index:140;background:rgba(0,0,0,.48);display:none;align-items:center;justify-content:center;padding:20px}
.resultModal.open{display:flex}
.resultCardBox{width:min(100%,390px);background:var(--panel);border-radius:22px;padding:20px;box-shadow:0 18px 50px rgba(0,0,0,.28)}
.resultCardBox h2{margin:0;color:var(--green);font-size:21px}
.decisionBody{margin-top:12px;font-size:15px;color:var(--sub);line-height:1.6;white-space:pre-line}
.decisionActions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin-top:18px}
.decisionActions.three{grid-template-columns:1fr}
/* 라벨에 줄바꿈(예: "로컬룰 드롭\n2벌타 · 다음 4타")이 있으면 그대로 두 줄로 보여준다 */
.decisionActions button{min-height:48px;border:1px solid var(--line);border-radius:13px;background:var(--panel);font-size:15px;font-weight:900;padding:10px;white-space:pre-line;line-height:1.35}
.decisionActions button.primary{background:var(--green);color:#fff;border-color:var(--green)}
.decisionActions button.danger{background:#fff7f6;color:var(--red);border-color:#ebc7c3}

.drawerWrap{position:fixed;inset:0;z-index:120}
.drawerWrap .dim{position:absolute;inset:0;background:rgba(20,25,18,.38)}
.drawer{position:absolute;right:0;top:0;bottom:0;width:310px;max-width:88vw;background:var(--panel);padding:14px;box-shadow:-8px 0 24px rgba(0,0,0,.16);overflow-y:auto}
.dHead{display:flex;align-items:center;justify-content:space-between}
.dHead b{font-size:18px}
.dClose{width:48px;height:48px;font-size:17px}
.drawer h3{margin:16px 0 7px;font-size:17px;color:var(--sub)}
.dNote{font-size:15px;color:var(--sub);line-height:1.45;margin:4px 0}
.teeChoiceGrid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:6px}
.dTee{min-height:44px;padding:0 2px;border:1.5px solid var(--line);border-radius:11px;background:var(--panel);font-size:15px;font-weight:800;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.dTee.on{background:var(--green);border-color:var(--green);color:#fff}
.dBag{display:grid;grid-template-columns:repeat(3,1fr);gap:6px}
.dClub{min-height:48px;border:1px solid var(--line);border-radius:10px;background:var(--panel);font-size:15px;font-weight:700}
.dClub.on{background:var(--mint);border:1.5px solid var(--green);color:var(--greenDeep)}
.dClub:disabled{opacity:.7}
.dSubHead{margin:2px 0 7px;font-size:15px;font-weight:800;color:var(--sub)}
.distProfileGrid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px}
.dProfile{min-height:44px;padding:0 4px;border:1.5px solid var(--line);border-radius:11px;background:var(--panel);font-size:15px;font-weight:800}
.dProfile.on{background:var(--green);border-color:var(--green);color:#fff}
.dDist{display:flex;flex-direction:column;gap:6px;margin-top:10px}
.dDistRow{display:flex;align-items:center;gap:8px}
.dDistRow span{flex:0 0 70px;font-size:15px;font-weight:800}
.dDistRow input{flex:1;min-height:48px;padding:8px 10px;border:1px solid var(--line);border-radius:10px;background:var(--panel);font-size:15px}
.dAccount{border:1px solid var(--line);border-radius:12px;padding:12px;background:#fafbf8}
.dAccount .dEmail{display:block;font-size:16px;word-break:break-all}
.dAccount input{width:100%;min-height:48px;padding:10px 12px;border:1.5px solid var(--line);border-radius:11px;background:var(--panel);font-size:15px}
.dAccBtns{display:flex;gap:7px;margin-top:8px}
.dBtnSm{flex:1;min-height:48px;border:1px solid var(--line);border-radius:10px;background:var(--panel);font-size:15px;font-weight:800}
.dBtnSm.pri{background:var(--green);border-color:var(--green);color:#fff}
.dFooter{margin-top:22px;padding-top:14px;border-top:1px solid var(--line)}
.dReselect{width:100%;min-height:48px;border:1.5px solid #c9b98f;background:#fdf8ec;color:#7a5b12;border-radius:12px;font-size:15px;font-weight:800}

.ovl{position:fixed;inset:0;z-index:130;background:rgba(20,25,18,.42);display:flex;align-items:center;justify-content:center;padding:18px}
.ovlCard{width:100%;max-width:340px;max-height:82vh;overflow-y:auto;background:var(--panel);border-radius:16px;padding:18px}
.ovlCard b{font-size:16px}
.ovlCard input{width:100%;margin-top:6px;padding:12px;font-size:17px;border:1.5px solid var(--line);border-radius:11px}
.ovlBtns{display:flex;gap:8px;margin-top:14px}
.ovlBtns button{flex:1;min-height:48px;border:1px solid var(--line);border-radius:11px;font-size:15px;font-weight:800;background:var(--panel)}
.ovlBtns .pri{background:var(--green);border-color:var(--green);color:#fff}
.heLbl{font-size:15px;font-weight:800;color:var(--sub);margin:12px 0 6px}
.heRow{display:flex;gap:6px;flex-wrap:wrap}
.hePar,.heTee{min-height:48px;padding:0 14px;border:1px solid var(--line);border-radius:10px;background:var(--panel);font-size:15px;font-weight:800}
.hePar.on,.heTee.on{background:var(--green);border-color:var(--green);color:#fff}

/* 배경 사진이 깔린 홀 — 지형 도형은 판정에만 쓰고 화면에서는 감춘다(사진이 지형을 보여준다).
   visibility가 아니라 fill/stroke를 투명하게 하는 이유: isPointInFill은 렌더 여부와 무관하지만
   display:none이면 요소가 레이아웃에서 빠져 일부 브라우저에서 판정이 흔들릴 수 있다. */
#holeTerrain.terrainInvisible > *{fill:transparent!important;stroke:transparent!important}
/* 배경 사진이 깔린 홀은 지도 바탕도 사진 원본의 배경색(#131313)으로 맞춘다.
   투명화 때 지운 색이 그대로라, 사진 가장자리와 화면 여백의 경계가 보이지 않는다.
   회전하면 world 사각형 밖이 드러나므로 mapBody 자체에 줘야 한다 — 안 그러면 모서리에
   기본 연두(#d2e5c0)가 삼각형으로 비친다. 배경 없는 홀·가상 코스는 기존 색 그대로. */
.mapBody.photoBg{background:#131313}