/* ⛳ 골프장 정보 탭 (2026-10-09) — golf.css·local.css 토큰 위에 얹는다 */
.cg-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; margin-top: 16px; }
.cg-pick { display: flex; gap: 14px; padding: 12px; text-decoration: none; color: var(--text); transition: transform .15s, border-color .15s; }
.cg-pick:hover { transform: translateY(-2px); border-color: var(--accent); }
.cg-pick-img { flex-shrink: 0; width: 110px; height: 110px; border-radius: 14px; overflow: hidden; background: #1f3b26; }
.cg-pick-img img { width: 100%; height: 100%; object-fit: cover; display: block; }
.cg-pick-body { display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.cg-pick-body b { font-size: 1.08rem; }
.cg-pick-body small { color: var(--muted); }
.cg-tags { display: flex; flex-wrap: wrap; gap: 4px; }
.cg-tags span { font-size: .74rem; font-weight: 700; background: var(--accent-soft); color: var(--accent); border-radius: 999px; padding: 2px 8px; }

.cg-back { margin: 0 0 10px; font-size: .9rem; }
.cg-back a { color: var(--accent); font-weight: 700; text-decoration: none; }
.cg-hero > img { object-position: center; opacity: .55; }
.cg-ctrl { margin-top: 14px; }
.cg-dot { display: inline-block; width: 10px; height: 10px; border-radius: 50%; margin-right: 6px; border: 1px solid #0003; vertical-align: -1px; }
.cg-tiles { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.cg-tel { font-size: 1.15rem !important; padding-top: 6px; }

.cg-brief h3 { margin: 0 0 8px; font-size: .98rem; }
.cg-brief h3 small { color: var(--muted); font-weight: 500; font-size: .78rem; margin-left: 4px; }
.cg-brief ul, .cg-ul { margin: 0; padding-left: 18px; font-size: .9rem; line-height: 1.6; }
.cg-brief li + li, .cg-ul li + li { margin-top: 4px; }
.cg-brief .card + .card { margin-top: 0; }
.cg-chips { display: flex; flex-wrap: wrap; gap: 6px; margin: 0; }
.cg-chip { font: inherit; font-size: .76rem; font-weight: 700; border: 1px solid var(--line); background: var(--bg); color: var(--text); border-radius: 999px; padding: 2px 9px; }
button.cg-chip { cursor: pointer; }
.cg-chip.w { background: var(--accent-soft); color: var(--accent); border-color: transparent; }
.cg-chip.o { background: var(--bad-soft); color: var(--bad); border-color: transparent; }

.cg-sc { overflow-x: auto; margin-bottom: 10px; border: 1px solid var(--line); border-radius: 14px; background: var(--surface); }
.cg-sc table { border-collapse: collapse; width: 100%; min-width: 560px; font-size: .86rem; text-align: center; font-variant-numeric: tabular-nums; }
.cg-sc th, .cg-sc td { padding: 6px 4px; border-bottom: 1px solid var(--line); }
.cg-sc tr:last-child th, .cg-sc tr:last-child td { border-bottom: 0; }
.cg-sc thead th { background: var(--accent-soft); color: var(--accent); }
.cg-sc tbody th { text-align: left; padding-left: 10px; color: var(--muted); font-weight: 700; white-space: nowrap; }
.cg-sc tr.nm td { color: var(--muted); font-size: .74rem; }
.cg-sc td.p3 { color: var(--turf); font-weight: 800; }
.cg-sc td.p5 { color: var(--warn); font-weight: 800; }
.cg-sc td.hard { color: var(--bad); font-weight: 800; }

.cg-holes { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
.cg-hole { display: grid; grid-template-columns: 150px minmax(0, 1fr); gap: 14px; padding: 12px; scroll-margin-top: 120px; transition: box-shadow .3s; }
.cg-hole.flash { box-shadow: 0 0 0 3px var(--accent); }
.card + .card.cg-hole { margin-top: 0; }
.cg-map { border: 0; padding: 0; border-radius: 12px; overflow: hidden; background: #1f3b26; cursor: zoom-in; align-self: start; }
.cg-map img { display: block; width: 100%; }
.cg-map.tall img { height: 204px; object-fit: contain; }
.cg-map.wide { aspect-ratio: 702 / 392; }
.cg-map.wide img { height: 100%; object-fit: cover; }
.cg-hb { min-width: 0; }
.cg-hb header { display: flex; align-items: center; gap: 10px; }
.cg-hb header > div { flex: 1; min-width: 0; }
.cg-hb header b { display: block; font-size: .98rem; }
.cg-hb header small { color: var(--muted); font-size: .78rem; }
.cg-no { flex-shrink: 0; width: 34px; height: 34px; border-radius: 10px; display: grid; place-items: center; font-weight: 800; background: var(--turf-soft); color: var(--turf); }
.cg-len { font-size: 1.35rem; font-weight: 800; letter-spacing: -.02em; white-space: nowrap; }
.cg-len small { font-size: .74rem; color: var(--muted); margin-left: 1px; }
.cg-tees { display: flex; flex-wrap: wrap; gap: 4px 10px; margin: 6px 0; font-size: .78rem; color: var(--muted); font-variant-numeric: tabular-nums; }
.cg-tees .cg-dot { width: 8px; height: 8px; margin-right: 3px; }
.cg-hb .cg-chips { margin: 4px 0 6px; }
.cg-play, .cg-watch { font-size: .88rem; line-height: 1.55; border-radius: 10px; padding: 7px 10px; margin-top: 6px; }
.cg-play { background: var(--turf-soft); }
.cg-play b { color: var(--turf); margin-right: 4px; }
.cg-watch { background: var(--warn-soft); }
.cg-watch b { color: var(--warn); margin-right: 4px; }
.cg-dl { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 3px 10px; margin: 8px 0 0; font-size: .82rem; }
.cg-dl dt { color: var(--muted); font-weight: 700; }
.cg-dl dd { margin: 0; }
.cg-hb details { margin-top: 8px; font-size: .82rem; }
.cg-hb details summary { cursor: pointer; color: var(--accent); font-weight: 700; }
.cg-hb details ul { margin: 6px 0 0; padding-left: 18px; line-height: 1.55; }
.cg-big { display: block; width: 100%; border-radius: 12px; background: #1f3b26; }

@media (max-width: 900px) {
  .cg-holes { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 640px) {
  .cg-list { grid-template-columns: minmax(0, 1fr); }
  .cg-tiles { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .cg-hole { grid-template-columns: minmax(0, 1fr); }
  .cg-map.tall img { height: 260px; }
  .cg-pick-img { width: 84px; height: 84px; }
}
/* 가로형 홀맵(포천힐스)은 카드 위에 크게 */
.cg-hole.wide { grid-template-columns: minmax(0, 1fr); }
.cg-map.wide, .cg-pick-img.wide { background: #fff; }
/* 그림을 불러오지 못했을 때(사이트판 = 골프장 서버 주소) */
.cg-map.noimg, .cg-pick-img.noimg { display: grid; place-items: center; min-height: 120px; color: #fff; font-size: .8rem; font-weight: 700; }
.cg-map.noimg::after { content: "홀맵 — 눌러서 원본 보기"; }
.cg-pick-img.noimg::after { content: "⛳"; font-size: 2rem; }
.cg-pick-img.wide img { object-fit: contain; }