/* ── 웨딩홀 1페이지 정리본 (.vd-*) ──
   index.html · worldcup.html · venue.html 공용. 토큰은 base.css 또는 index.html 인라인 :root 에서 옵니다. */

.vd { --vd-pink-soft: var(--pink-soft, #FFF0F4); color: var(--body); min-width: 0; overflow-wrap: anywhere; }
.vd-empty { padding: 40px 16px; text-align: center; color: var(--secondary); font-size: 14px; }
.vd-muted { font-size: 13.5px; color: var(--muted); }

/* 섹션 뼈대 */
.vd-sec { padding: 34px 0; border-top: 1px solid var(--hairline); }
.vd-eyebrow { display: flex; align-items: center; gap: 9px; margin-bottom: 16px; font-size: 19px; font-weight: 800; letter-spacing: -0.02em; line-height: 1.25; color: var(--fg); }
.vd-eyebrow::before { content: ""; width: 4px; height: 19px; border-radius: 2px; background: var(--pink); flex: 0 0 auto; }
.vd-sec-head .vd-eyebrow { margin-bottom: 0; }
.vd-sec-count { font-size: 12.5px; }

/* 헤더 */
.vd-head { display: flex; align-items: flex-start; gap: 12px; padding: 4px 0 18px; }
.vd-head-main { flex: 1; min-width: 0; }
.vd-name { font-size: 22px; font-weight: 800; letter-spacing: -0.02em; line-height: 1.25; color: var(--fg); }
.vd-meta { margin-top: 4px; font-size: 13px; color: var(--secondary); }
.vd-chips { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 10px; }
.vd-share {
  flex: 0 0 auto; display: inline-flex; align-items: center; gap: 5px;
  padding: 8px 10px; font-size: 12.5px; font-weight: 600; color: var(--fg);
  background: var(--canvas); border: 1px solid #DDDDDD; border-radius: var(--r-md); cursor: pointer;
  transition: background .15s, border-color .15s;
}
.vd-share:hover { background: var(--subtle); border-color: var(--muted); }
.vd-share:focus-visible { outline: 2px solid var(--pink); outline-offset: 2px; }

/* 사진 */
.vd-photo { position: relative; margin: 0 0 4px; aspect-ratio: 16 / 10; background: var(--fill); border-radius: var(--r-lg); overflow: hidden; }
.vd-photo img { width: 100%; height: 100%; object-fit: cover; }
.vd-gnav {
  position: absolute; top: 50%; transform: translateY(-50%);
  width: 36px; height: 36px; display: inline-flex; align-items: center; justify-content: center;
  background: rgba(255, 255, 255, .88); color: var(--fg); border: none; border-radius: var(--r-full);
  box-shadow: var(--sh-standard); cursor: pointer; transition: background .15s, transform .15s;
}
.vd-gprev { left: 10px; } .vd-gnext { right: 10px; }
.vd-gnav:hover { background: #fff; }
.vd-gnav:active { transform: translateY(-50%) scale(.94); }
.vd-gcnt {
  position: absolute; right: 12px; bottom: 12px; padding: 4px 9px;
  font-size: 12px; font-weight: 600; color: #fff; background: rgba(0, 0, 0, .55); border-radius: var(--r-full);
}
.vd-gdots { position: absolute; left: 0; right: 0; bottom: 14px; display: flex; justify-content: center; gap: 6px; }
.vd-gdots i { width: 6px; height: 6px; border-radius: 50%; background: rgba(255, 255, 255, .55); cursor: pointer; transition: transform .15s, background .15s; }
.vd-gdots i.on { background: #fff; transform: scale(1.35); }

/* 가격 */
.vd-price-main { display: flex; flex-direction: column; gap: 2px; margin-bottom: 14px; }
.vd-price-lab { font-size: 13px; color: var(--secondary); }
.vd-price-num { font-size: 30px; font-weight: 800; letter-spacing: -0.03em; line-height: 1.15; color: var(--fg); }
.vd-price-num small { font-size: 16px; font-weight: 700; margin-left: 2px; color: var(--secondary); }
.vd-price-rows { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; margin: 0; }
.vd-price-rows > div { padding: 10px 12px; background: var(--subtle); border: 1px solid var(--hairline); border-radius: var(--r-md); }
.vd-price-rows dt { font-size: 11.5px; color: var(--muted); margin-bottom: 3px; }
.vd-price-rows dd { margin: 0; font-size: 14.5px; font-weight: 700; color: var(--fg); }
.vd-perk {
  display: flex; align-items: center; flex-wrap: wrap; gap: 6px 8px; margin-top: 12px;
  padding: 11px 13px; background: var(--vd-pink-soft); border-radius: var(--r-md); color: var(--pink);
}
.vd-perk .icon { color: var(--pink); }
.vd-perk-lab { font-size: 12px; font-weight: 700; }
.vd-perk b { flex: 1 1 100%; font-size: 14px; font-weight: 700; color: var(--fg); }
.vd-note { display: flex; gap: 6px; margin-top: 12px; font-size: 12px; line-height: 1.55; color: var(--muted); }
.vd-note .icon { margin-top: 2px; color: var(--muted); }
.vd-pending {
  display: flex; align-items: center; justify-content: space-between; gap: 10px; flex-wrap: wrap;
  padding: 14px; background: var(--subtle); border: 1px dashed #DDDDDD; border-radius: var(--r-md);
}
.vd-pending-txt { display: inline-flex; align-items: center; gap: 6px; font-size: 14px; font-weight: 600; color: var(--secondary); }
.vd-pending-row { display: flex; align-items: center; gap: 6px; font-size: 13.5px; color: var(--secondary); margin-bottom: 12px; }

/* 육각 지표 */
.vd-hexwrap { display: grid; grid-template-columns: 1fr; gap: 14px; align-items: center; }
.vd-radar { max-width: 380px; margin: 0 auto; width: 100%; }
.vd-hexwrap-empty .vd-radar { opacity: .75; }
.vd-hexwrap-empty + .vd-pending-row { margin-top: 12px; }
.vd-radar svg { width: 100%; height: auto; }
.vd-rg { fill: none; stroke: var(--hairline); stroke-width: 1; }
.vd-rs { stroke: var(--hairline); stroke-width: 1; }
.vd-ravg { fill: rgba(187, 187, 187, .10); stroke: #BBBBBB; stroke-width: 1.2; stroke-dasharray: 3 3; }
.vd-rme { fill: rgba(250, 46, 95, .16); stroke: var(--pink); stroke-width: 1.2; stroke-linejoin: round; }
.vd-rdot { fill: var(--pink); }
.vd-rlb { font-size: 11px; font-weight: 600; fill: var(--body); font-family: inherit; }
.vd-rlb.is-missing { fill: var(--lightest); }
.vd-hexbars { display: flex; flex-direction: column; gap: 8px; }
.vd-hexrow { display: grid; grid-template-columns: 52px 1fr 24px; align-items: center; gap: 10px; font-size: 13px; }
.vd-hexlab { color: var(--body); font-weight: 600; }
.vd-hexbar { display: flex; gap: 4px; }
.vd-hexbar i { position: relative; flex: 1; height: 9px; border-radius: 3px; background: var(--fill); }
.vd-hexbar i.on { background: var(--pink); }
.vd-hexbar i.half { background: linear-gradient(90deg, var(--pink) 0 50%, var(--fill) 50% 100%); }
.vd-hexval { text-align: right; font-weight: 700; color: var(--fg); }
.vd-hexrow.is-missing .vd-hexlab, .vd-hexrow.is-missing .vd-hexval { color: var(--lightest); }
.vd-hexbars-empty .vd-hexbar i { background: var(--subtle); border: 1px dashed var(--hairline); }
.vd-ai { margin-top: 18px; padding: 18px 20px; background: var(--pink-soft, #FFF0F4); border: 1px solid rgba(250, 46, 95, .18); border-radius: var(--r-lg, 12px); word-break: keep-all; }
.vd-ai-head { display: flex; align-items: center; gap: 6px; margin-bottom: 10px; font-size: 13px; font-weight: 800; color: var(--pink); letter-spacing: -0.01em; }
.vd-ai-head .icon { color: var(--pink); fill: currentColor; stroke: none; width: 16px; height: 16px; }
.vd-ai p { margin: 0; font-size: 14.5px; line-height: 1.75; color: var(--fg); }
.vd-ai p + p { margin-top: 10px; }
.vd-ai p b { color: var(--pink); font-weight: 700; }
.vd-hexsay b { color: var(--pink); font-weight: 700; }
.vd-hexsay-sub { display: block; margin-top: 4px; font-size: 12.5px; color: var(--secondary); }
.vd-hexsay-sub b { color: var(--fg); }
.vd-hexlegend { display: flex; flex-wrap: wrap; gap: 6px 14px; margin-top: 12px; font-size: 11.5px; color: var(--muted); }
.vd-hexlegend .lg { display: inline-flex; align-items: center; gap: 5px; }
.vd-hexlegend .lg i { width: 14px; height: 8px; border-radius: 2px; }
.vd-hexlegend .mine i { background: rgba(250, 46, 95, .3); border: 1.5px solid var(--pink); }
.vd-hexlegend .avg i { border: 1.5px dashed #BBBBBB; }

/* 장점 · 단점 */
.vd-pc { display: block; }
.vd-sec-head { display: flex; align-items: baseline; justify-content: space-between; gap: 10px; }
.vd-sec-head .vd-eyebrow { margin-bottom: 0; }
.vd-sec-count { font-size: 12px; font-weight: 600; color: var(--muted); }
.vd-rank { list-style: none; margin: 14px 0 0; padding: 0; display: flex; flex-direction: column; }
.vd-rank li { display: flex; align-items: flex-start; gap: 10px; padding: 11px 0; border-top: 1px solid var(--border-subtle, #F0F0F0); font-size: 14px; line-height: 1.5; color: var(--body); }
.vd-rank li:first-child { border-top: none; padding-top: 4px; }
.vd-rank-no { flex: 0 0 22px; font-size: 13px; font-weight: 800; color: var(--lightest); text-align: center; line-height: 21px; font-variant-numeric: tabular-nums; }
.vd-rank li:nth-child(-n+3) .vd-rank-no { color: var(--fg); }
.vd-rank-txt { flex: 1; }
.vd-pros, .vd-cons { display: flex; flex-direction: column; gap: 8px; }
.vd-pros li, .vd-cons li { display: flex; gap: 8px; font-size: 14px; line-height: 1.5; color: var(--body); }
.vd-pros li .icon, .vd-cons li .icon {
  width: 18px; height: 18px; padding: 3px; margin-top: 2px; border-radius: 50%; stroke-width: 3;
}
.vd-pros li .icon { color: var(--success); background: rgba(0, 200, 150, .12); }
.vd-cons li .icon { color: var(--error); background: rgba(240, 18, 75, .10); }

/* 기본 정보 */
.vd-info-row { display: flex; align-items: center; gap: 8px; font-size: 14px; color: var(--body); margin-bottom: 8px; }
.vd-info-row .icon { color: var(--muted); }
.vd-info-row a { color: var(--fg); font-weight: 600; text-decoration: none; }
.vd-info .vd-chips { margin-top: 12px; }

/* CTA */
.vd-cta { padding: 18px 0 4px; border-top: 1px solid var(--hairline); text-align: center; }
.vd-cta .btn-primary { width: 100%; }
.vd-cta-sub { margin-top: 10px; font-size: 12px; color: var(--muted); }
.vd-compact .vd-sec { padding: 24px 0; }
.vd-compact .vd-name { font-size: 19px; }

/* 단독 페이지 */
.vd-page { max-width: 720px; margin: 0 auto; padding: 12px 16px 48px; }
.vd-page .vd-head { padding-top: 12px; }
.vd-index { max-width: var(--maxw, 1080px); margin: 0 auto; padding: 20px 16px 48px; }
.vd-index h1 { font-size: 22px; font-weight: 800; letter-spacing: -0.02em; color: var(--fg); margin-bottom: 6px; }
.vd-index p { font-size: 14px; color: var(--secondary); margin-bottom: 18px; }
.vd-index-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 12px; }
.vd-index-card { display: block; text-decoration: none; color: inherit; border: 1px solid var(--hairline); border-radius: var(--r-lg); overflow: hidden; background: var(--canvas); transition: transform .15s, box-shadow .15s; }
.vd-index-card:hover { transform: translateY(-2px); box-shadow: var(--sh-standard); }
.vd-index-card img { aspect-ratio: 4 / 3; width: 100%; object-fit: cover; }
.vd-index-card b { display: block; padding: 10px 12px 2px; font-size: 14px; color: var(--fg); }
.vd-index-card span { display: block; padding: 0 12px 12px; font-size: 12px; color: var(--muted); }

/* 바텀시트 */
.vd-sheet { position: fixed; inset: 0; z-index: 300; display: none; }
.vd-sheet-bg { position: absolute; inset: 0; background: rgba(0, 0, 0, .45); opacity: 0; transition: opacity .24s; }
.vd-sheet-box {
  position: absolute; left: 0; right: 0; bottom: 0; max-height: 92%; max-height: 92dvh;   /* dvh 가 마지막: 모바일 주소창을 뺀 실제 보이는 높이 기준 */
  display: flex; flex-direction: column;
  background: var(--canvas); border-radius: 16px 16px 0 0; box-shadow: var(--sh-elevated);
  transform: translateY(100%); transition: transform .26s cubic-bezier(.2, .8, .2, 1);
}
.vd-sheet.is-open .vd-sheet-bg { opacity: 1; }
.vd-sheet.is-open .vd-sheet-box { transform: translateY(0); }
.vd-sheet-top { position: relative; flex: 0 0 auto; height: 28px; }
.vd-grabber { position: absolute; left: 50%; top: 9px; width: 40px; height: 4px; margin-left: -20px; border-radius: 2px; background: #DDDDDD; }
.vd-sheet-x {
  position: absolute; right: 8px; top: 6px; z-index: 2; width: 34px; height: 34px;
  display: inline-flex; align-items: center; justify-content: center;
  background: var(--fill); color: var(--fg); border: none; border-radius: var(--r-full); cursor: pointer;
}
.vd-sheet-x .icon { width: 18px; height: 18px; }
.vd-sheet-x:hover { background: var(--hairline); }
.vd-sheet-body { flex: 1 1 auto; overflow-y: auto; -webkit-overflow-scrolling: touch; padding: 0 18px 24px; }
.vd-sheet-foot {
  flex: 0 0 auto; display: flex; flex-direction: column; gap: 8px;
  padding: 12px 18px calc(12px + env(safe-area-inset-bottom, 0px));
  background: var(--canvas); border-top: 1px solid var(--hairline);
}
.vd-sheet-foot .btn-primary, .vd-sheet-foot .btn-secondary { width: 100%; }

/* 데스크톱 */
@media (min-width: 640px) {
  .vd-hexwrap { grid-template-columns: minmax(340px, 1.35fr) 1fr; gap: 28px; }
  .vd-radar { max-width: 420px; }
  .vd-hexbars { max-width: 320px; gap: 7px; }
  .vd-hexrow { grid-template-columns: 46px 1fr 26px; gap: 8px; font-size: 12px; }
  .vd-hexbar i { height: 7px; }
  .vd-hexval { font-size: 12px; }
  .vd-rank li { font-size: 14.5px; }
  .vd-index-grid { grid-template-columns: repeat(4, 1fr); }
}
@media (min-width: 900px) {
  .vd-name { font-size: 26px; }
  .vd-price-num { font-size: 34px; }
  .vd-sheet-box {
    left: 50%; right: auto; top: 50%; bottom: auto; width: min(720px, calc(100% - 40px)); max-height: 88vh;
    border-radius: var(--r-xl); transform: translate(-50%, -46%); opacity: 0;
    transition: transform .22s cubic-bezier(.2, .8, .2, 1), opacity .22s;
  }
  .vd-sheet.is-open .vd-sheet-box { transform: translate(-50%, -50%); opacity: 1; }
  .vd-grabber { display: none; }
  .vd-sheet-body { padding: 0 28px 28px; }
  .vd-sheet-foot { flex-direction: row; padding: 14px 28px; }
  .vd-sheet-foot .btn-primary { flex: 2; }
  .vd-sheet-foot .btn-secondary { flex: 1; }
}

@media (prefers-reduced-motion: reduce) {
  .vd-sheet-bg, .vd-sheet-box, .vd-gnav, .vd-gdots i, .vd-index-card { transition: none !important; }
}

.vd-print-head { display: none; }

/* ── index.html(인라인 토큰만 있음) 안에서도 정리본이 같은 모양이 되도록 — base.css 의존 부분을 여기서 보강 ── */
.vd .chip, .vd-sheet .chip {
  display: inline-flex; align-items: center; gap: 4px;
  font-size: 12px; font-weight: 600; line-height: 1;
  padding: 6px 9px; border-radius: var(--r-sm, 4px);
  background: var(--fill, #F5F5F5); color: var(--secondary, #666);
}
.vd .chip-pink, .vd-sheet .chip-pink { background: var(--pink-soft, #FFF0F4); color: var(--pink, #FA2E5F); }
.vd .chip-dark, .vd-sheet .chip-dark { background: #2B2B2B; color: #fff; }
.vd .chip-light, .vd-sheet .chip-light { background: #FFF7E6; color: #9A6B00; }
.vd .btn-primary, .vd .btn-secondary, .vd-sheet .btn-primary, .vd-sheet .btn-secondary { flex: 0 0 auto; min-width: 0; }
.vd .btn-sm, .vd-sheet .btn-sm { font-size: 14px; padding: 11px 16px; }
body.is-locked { overflow: hidden; }

.vd-index-noimg { display: block; aspect-ratio: 4 / 3; background: var(--fill, #F5F5F5); border-radius: var(--r-md, 8px); }

/* 후기 한 줄 요약 */
.vd-verdict-txt { display: flex; gap: 10px; align-items: flex-start; margin: 0; padding: 14px 16px; background: var(--pink-soft, #FFF0F4); border-left: 3px solid var(--pink); border-radius: 0 var(--r-md, 8px) var(--r-md, 8px) 0; font-size: 14.5px; line-height: 1.6; color: var(--fg); }
.vd-verdict-txt .icon { width: 18px; height: 18px; flex: 0 0 auto; margin-top: 3px; color: var(--pink); fill: currentColor; stroke: none; }
.vd-verdict-src { display: block; margin-top: 8px; font-size: 11.5px; color: var(--muted); }

/* 공유 버튼 완료 상태 */
.vd-share.is-done { color: var(--success); border-color: var(--success); }
.vd-head-actions { display: flex; gap: 6px; flex: 0 0 auto; }

/* 토스트 — index.html(인라인 토큰만 있음)에서도 보이도록 base.css 와 같은 정의 */
.ui-toast {
  position: fixed; left: 50%; bottom: calc(24px + env(safe-area-inset-bottom, 0px)); z-index: 400;
  transform: translate(-50%, 12px); opacity: 0; pointer-events: none;
  max-width: calc(100% - 32px); padding: 12px 16px;
  background: rgba(34, 34, 34, .94); color: #fff; font-size: 13.5px; font-weight: 600;
  border-radius: var(--r-md, 8px); box-shadow: var(--sh-elevated, 0 4px 16px rgba(0, 0, 0, .12));
  transition: transform .2s, opacity .2s;
}
.ui-toast.is-on { transform: translate(-50%, 0); opacity: 1; }

/* 하객수 칩 */
.vd-guests { display: flex; flex-wrap: wrap; gap: 6px; margin: 12px 0 14px; }
.vd-guest { font-family: inherit; font-size: 13px; font-weight: 600; padding: 8px 12px; border-radius: var(--r-full, 9999px); border: 1px solid var(--hairline); background: var(--canvas); color: var(--secondary); cursor: pointer; transition: border-color .15s, color .15s, background .15s; }
.vd-guest:hover { border-color: var(--muted); color: var(--fg); }
.vd-guest.is-on { border-color: var(--pink); color: var(--pink); background: var(--pink-soft, #FFF0F4); }
.vd-price-warn { font-style: normal; margin-left: 6px; font-size: 11.5px; color: var(--error); }
.vd-tipbtn { display: inline-flex; align-items: center; gap: 6px; margin-top: 12px; padding: 9px 12px; font-family: inherit; font-size: 13px; font-weight: 600; color: var(--secondary); background: var(--canvas); border: 1px dashed var(--lightest); border-radius: var(--r-md, 8px); cursor: pointer; transition: color .15s, border-color .15s; }
.vd-tipbtn:hover { color: var(--fg); border-color: var(--muted); }
.vd-pending + .vd-tipbtn, .vd-perk + .vd-tipbtn { margin-top: 12px; }

/* 결혼 준비 예상 총비용 */
.vd-budget { margin-top: 18px; padding: 16px 16px 14px; background: var(--subtle); border: 1px solid var(--hairline); border-radius: var(--r-lg, 12px); }
.vd-subhead { font-size: 14px; font-weight: 700; color: var(--fg); }
.vd-bg { margin-top: 10px; }
.vd-budget + .vd-tipbtn { margin-top: 14px; }
.vd-bg-row { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; padding: 11px 0; border-bottom: 1px solid var(--hairline); font-size: 14px; color: var(--body); }
.vd-bg-row span small { margin-left: 4px; font-size: 11.5px; color: var(--muted); }
.vd-bg-row > span { min-width: 0; }
.vd-bg-row b { font-weight: 600; color: var(--fg); white-space: nowrap; }
.vd-bg-row.is-venue { font-weight: 700; color: var(--fg); }
.vd-bg-row.is-venue b { color: var(--pink); font-weight: 800; }
.vd-bg-none { color: var(--muted); font-weight: 500; }
.vd-bg-total { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; padding: 14px 0 2px; border-top: 2px solid var(--fg); margin-top: 2px; font-size: 15px; font-weight: 800; color: var(--fg); }
.vd-bg-total b { font-size: 22px; letter-spacing: -0.02em; color: var(--pink); white-space: nowrap; }
.vd-bg-note { margin-top: 12px; font-size: 12px; line-height: 1.55; color: var(--muted); }

/* 가격 제보 시트 */
.pt-sheet { position: fixed; inset: 0; z-index: 320; display: none; }
.pt-bg { position: absolute; inset: 0; background: rgba(0, 0, 0, .45); opacity: 0; transition: opacity .22s; }
.pt-box { position: absolute; left: 0; right: 0; bottom: 0; max-height: 92vh; overflow-y: auto; background: var(--canvas); border-radius: 16px 16px 0 0; padding: 16px 18px calc(20px + env(safe-area-inset-bottom, 0px)); transform: translateY(100%); transition: transform .26s cubic-bezier(.2, .8, .2, 1); }
.pt-sheet.is-open .pt-bg { opacity: 1; }
.pt-sheet.is-open .pt-box { transform: none; }
.pt-top { display: flex; align-items: center; justify-content: space-between; font-size: 17px; }
.pt-x { width: 34px; height: 34px; display: inline-flex; align-items: center; justify-content: center; border: none; background: var(--fill); border-radius: var(--r-full, 9999px); color: var(--fg); cursor: pointer; }
.pt-venue { margin: 8px 0 0; font-size: 14px; font-weight: 700; color: var(--pink); }
.pt-help { margin: 6px 0 14px; font-size: 13px; line-height: 1.5; color: var(--secondary); }
.pt-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.pt-grid label { display: flex; flex-direction: column; gap: 5px; font-size: 12px; font-weight: 600; color: var(--secondary); }
.pt-grid .pt-wide { grid-column: 1 / -1; }
.pt-grid input, .pt-grid select, .pt-grid textarea { font-family: inherit; font-size: 15px; padding: 11px 12px; border: 1px solid var(--hairline); border-radius: var(--r-md, 8px); background: var(--subtle); color: var(--fg); }
.pt-grid input:focus, .pt-grid select:focus, .pt-grid textarea:focus { outline: none; border-color: var(--pink); background: var(--canvas); }
.pt-consent { margin: 12px 0; font-size: 11.5px; line-height: 1.5; color: var(--muted); }
.pt-submit { width: 100%; }
@media (min-width: 900px) {
  .pt-box { left: 50%; right: auto; top: 50%; bottom: auto; width: 520px; max-height: 88vh; border-radius: 16px; padding: 22px 24px; transform: translate(-50%, -46%); opacity: 0; transition: transform .22s, opacity .22s; }
  .pt-sheet.is-open .pt-box { transform: translate(-50%, -50%); opacity: 1; }
}

.vd-tiprow { display: flex; justify-content: flex-end; }
.vd-budget + .vd-tiprow { margin-top: 12px; }
.vd-tiprow .vd-tipbtn { margin-top: 0; }

/* 시트 안에서는 닫기(X) 버튼과 공유·PDF 버튼이 겹치지 않게 */
.vd-sheet-body .vd-head-actions { margin-right: 40px; }

/* 데스크톱 모달 하단 버튼 — 가로 배치 시 두 버튼이 모달 폭 안에서 2:1 로 나뉜다 (뒤쪽 fallback 규칙보다 우선하도록 여기 배치) */
@media (min-width: 900px) {
  .vd-sheet .vd-sheet-foot { flex-direction: row; gap: 10px; }
  .vd-sheet .vd-sheet-foot .btn-primary { flex: 2 1 0; width: auto; min-width: 0; }
  .vd-sheet .vd-sheet-foot .btn-secondary { flex: 1 1 0; width: auto; min-width: 0; }
}

/* 좁은 화면(≤400px) — 가격 3칸 표는 2칸 + 1칸, 예산표 합계는 줄바꿈 허용 */
@media (max-width: 400px) {
  .vd-price-rows { grid-template-columns: 1fr 1fr; }
  .vd-price-rows > div:nth-child(3):last-child { grid-column: 1 / -1; }
  .vd-bg-row, .vd-bg-total { gap: 8px; }
  .vd-bg-total { flex-wrap: wrap; }
  .vd-bg-total b { font-size: 20px; }
  .vd-price-num { font-size: 26px; }
  .vd-budget { padding: 14px 12px 12px; }
}

/* ── 인쇄 스타일은 항상 파일 맨 끝 (화면 규칙보다 뒤에 와야 덮어쓴다) ── */
@media print {
  /* ── 인쇄(PDF) 타이포 시스템 ──
     크기 4단계만 쓴다: 제목 22 / 섹션 14 / 본문 11 / 캡션 9.5 (px)
     줄간격 본문 1.5 · 캡션 1.4 · 숫자·제목 1.2. 간격은 3mm 배수(3·6·9). */
  @page { size: A4; margin: 0; }
  html, body { background: #fff !important; }
  body { -webkit-print-color-adjust: exact; print-color-adjust: exact; color: #222; font-size: 11px; line-height: 1.5; }

  /* 화면 전용 요소 제거 */
  .topbar, .vd-head-actions, .vd-share, .vd-print, .vd-tiprow, .vd-guests, .vd-cta, .vd-gnav, .vd-gdots, .vd-gcnt,
  .ui-toast, .pt-sheet, .mobile-cta-bar, .wcs-modal, .vd-sheet-bg, .vd-sheet-top, .vd-sheet-foot { display: none !important; }
  .vd-sheet, .vd-sheet-box { position: static; display: block; max-height: none; transform: none; box-shadow: none; }
  .vd-sheet-body, .vd-page { overflow: visible; padding: 0; max-width: none; }
  a[href]::after { content: none !important; }

  /* 페이지 — 여백은 블록 패딩으로 (인쇄 대화상자 설정과 무관) */
  .vd-pg { box-sizing: border-box; padding: 12mm 13mm 12mm; break-after: page; page-break-after: always; }
  .vd-pg:last-child { break-after: auto; page-break-after: auto; }
  /* 1쪽: 고정 높이 + 사진이 남는 공간을 채운다 → 어떤 홀이든 한 면이 가득 */
  .vd-pg-1 { height: 296mm; display: flex; flex-direction: column; overflow: hidden; }
  .vd-pg-1 .vd-photo, .vd-pg-1 .vd-gallery { flex: 1 1 auto; height: auto; max-height: none; min-height: 30mm; }
  .vd-pg-1 .vd-sec, .vd-pg-1 .vd-head, .vd-pg-1 .vd-print-head { flex: 0 0 auto; }
  /* 2쪽: 육각형 지표만 — 세로 가운데 정렬로 균형 */
  .vd-pg-2 { height: 296mm; display: flex; flex-direction: column; justify-content: flex-start; }
  .vd-pg-2 .vd-sec { border-top: none; padding-top: 0; margin: 0; }

  /* 머리글 */
  .vd .vd-print-head { display: flex; justify-content: space-between; align-items: baseline; gap: 6mm; padding-bottom: 2mm; margin-bottom: 6mm; border-bottom: 1.5px solid var(--pink); font-size: 9.5px; line-height: 1.4; color: var(--muted); }
  .vd-print-brand { font-weight: 800; color: var(--pink); letter-spacing: -0.01em; }

  /* 홀 이름 블록 */
  .vd-head { display: block; padding: 0 0 6mm; margin: 0; }
  .vd-name { font-size: 22px; font-weight: 800; line-height: 1.2; letter-spacing: -0.02em; margin: 0; }
  .vd-meta { font-size: 11px; line-height: 1.5; color: var(--secondary); margin-top: 1mm; }
  .vd-chips { margin-top: 2mm; gap: 4px; }
  .vd-chips .chip, .vd .chip { font-size: 9.5px; line-height: 1; padding: 4px 7px; border-radius: 3px; }

  /* 사진 */
  .vd-photo, .vd-gallery { width: 100%; height: 34mm; max-height: 34mm; aspect-ratio: auto; overflow: hidden; border-radius: 3mm; margin: 0 0 6mm; }
  .vd-photo img, .vd-gallery img { width: 100%; height: 100%; object-fit: cover; }

  /* 섹션 — 위 여백 6mm, 구분선, 제목 아래 3mm */
  .vd-sec { padding: 6mm 0 0; margin: 0 0 6mm; border-top: 1px solid var(--hairline); break-inside: auto; }
  .vd-pg > .vd-sec:first-child { border-top: none; padding-top: 0; }
  .vd-sec:last-child { margin-bottom: 0; }
  .vd-eyebrow { font-size: 14px; font-weight: 800; line-height: 1.2; letter-spacing: -0.015em; gap: 6px; margin: 0 0 3mm; }
  .vd-eyebrow::before { width: 3px; height: 13px; border-radius: 1.5px; }
  .vd-sec-head { margin-bottom: 3mm; }
  .vd-sec-head .vd-eyebrow { margin-bottom: 0; }
  .vd-sec-count, .vd-subhead { font-size: 11px; line-height: 1.5; }
  .vd-subhead { font-weight: 800; }
  .vd-eyebrow, .vd-subhead, .vd-sec-head { break-after: avoid; page-break-after: avoid; }

  /* 후기 요약 */
  .vd-verdict-txt { font-size: 11px; line-height: 1.5; padding: 3mm 4mm; gap: 2mm; border-left-width: 2px; }
  .vd-verdict-txt .icon { width: 12px; height: 12px; margin-top: 2px; }
  .vd-verdict-src { margin-top: 2mm; font-size: 9.5px; line-height: 1.4; }

  /* 가격 */
  .vd-price-main { margin-bottom: 3mm; gap: 0; }
  .vd-price-lab { font-size: 11px; line-height: 1.5; }
  .vd-price-warn { font-size: 9.5px; }
  .vd-price-num { font-size: 22px; line-height: 1.2; }
  .vd-price-num small { font-size: 11px; margin-left: 1px; }
  .vd-price-rows { gap: 2mm; margin: 0 0 3mm; }
  .vd-price-rows > div { padding: 2mm 3mm; }
  .vd-price-rows dt { font-size: 9.5px; line-height: 1.4; margin-bottom: 1px; }
  .vd-price-rows dd { font-size: 11px; line-height: 1.5; font-weight: 700; }
  .vd-perk { padding: 2.5mm 3mm; margin: 0 0 3mm; gap: 2mm; }
  .vd-perk .icon { width: 12px; height: 12px; }
  .vd-perk-lab { font-size: 9.5px; }
  .vd-perk b { font-size: 11px; line-height: 1.5; }
  .vd-note { margin: 0 0 3mm; font-size: 9.5px; line-height: 1.4; gap: 4px; }
  .vd-note .icon { width: 10px; height: 10px; margin-top: 2px; }

  /* 결혼 준비 예상 총비용 */
  .vd-budget { margin: 0; padding: 3mm 4mm 2.5mm; border-radius: 3mm; break-inside: auto; }
  .vd-bg { margin-top: 1mm; }
  .vd-bg-row { padding: 1.6mm 0; font-size: 11px; line-height: 1.5; gap: 4mm; break-inside: avoid; }
  .vd-bg-row span small { font-size: 9.5px; }
  .vd-bg-total { padding: 2.5mm 0 0; margin-top: 1mm; font-size: 12px; line-height: 1.3; break-inside: avoid; }
  .vd-bg-total b { font-size: 16px; }
  .vd-bg-note { margin-top: 2mm; font-size: 9.5px; line-height: 1.4; }

  /* 2쪽: 후기 요약 + 육각형 지표 — 레이더를 크게 놓아 한 면을 채운다 */
  .vd-pg-3 .vd-verdict-txt { font-size: 11.5px; padding: 3mm 4mm; }
  .vd-pg-3 .vd-sec { padding-top: 5mm; margin-bottom: 5mm; }
  .vd-hexwrap { grid-template-columns: 1fr; gap: 16mm; align-items: center; break-inside: avoid; }
  .vd-radar { max-width: 118mm; margin: 0 auto; }
  .vd-radar svg text { font-size: 12px; font-weight: 700; }
  .vd-pg-2 .vd-eyebrow { margin-bottom: 12mm; }
  .vd-hexbars { max-width: none; display: grid; grid-template-columns: 1fr 1fr; column-gap: 14mm; row-gap: 6mm; margin-top: 2mm; }
  .vd-hexrow { grid-template-columns: 15mm 1fr 10mm; gap: 3mm; font-size: 13px; line-height: 1.5; }
  .vd-hexbar { gap: 1.5mm; }
  .vd-hexbar i { height: 3.6mm; border-radius: 1.8mm; }
  .vd-hexval { font-size: 13px; }
  .vd-ai { margin-top: 14mm; padding: 6mm 7mm; border-radius: 3mm; break-inside: avoid; }
  .vd-ai-head { font-size: 11.5px; margin-bottom: 3mm; }
  .vd-ai-head .icon { width: 12px; height: 12px; }
  .vd-ai p { font-size: 12px; line-height: 1.8; }
  .vd-ai p + p { margin-top: 3mm; }
  .vd-hexsay-sub { font-size: 9.5px; line-height: 1.4; margin-top: 1mm; }
  .vd-hexlegend { margin-top: 5mm; font-size: 9.5px; line-height: 1.4; gap: 1mm 4mm; }

  /* 장점·단점 BEST 10 */
  .vd-rank { margin-top: 0; }
  .vd-rank li { padding: 1.4mm 0; font-size: 11px; line-height: 1.5; gap: 2.5mm; break-inside: avoid; }
  .vd-rank li:first-child { padding-top: 0; }
  .vd-rank-no { flex-basis: 5mm; font-size: 10px; line-height: 16px; color: var(--muted); }
  .vd-rank li:nth-child(-n+3) .vd-rank-no { color: var(--fg); }
  .vd-pros li .icon, .vd-cons li .icon, .vd-rank li .icon { width: 14px; height: 14px; padding: 2px; margin-top: 1px; }

  /* 기본 정보 */
  .vd-info-row { font-size: 11px; line-height: 1.5; gap: 2mm; margin-bottom: 1.5mm; }
  .vd-info-row .icon { width: 12px; height: 12px; }
  .vd-info .vd-chips { margin-top: 2mm; }
}
