/* UIV2 pick — 이 파일은 해당 화면 카드(W) 한 명만 고친다. 모든 규칙은 .ui-v2 아래에만 */
/* W2(D-1023-24): 12 장소 · 12b 보는 사람 · 12c 형식 고르기 — home-steps.js 가 html.ui-v2 일 때 그리는 .pk 마크업만 꾸민다 */
html.ui-v2 .pk{background:var(--surface);border-radius:var(--r-lg);box-shadow:var(--shadow-2);padding:24px;color:var(--text-1);font:400 15px/22.5px Pretendard,system-ui,sans-serif;text-align:left}
html.ui-v2 .pk button{font-family:inherit;cursor:pointer}
html.ui-v2 .pk button:disabled{cursor:not-allowed;opacity:.45}
html.ui-v2 .pk :focus-visible{outline:2px solid var(--accent);outline-offset:2px}
html.ui-v2 .pk-sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* 5단계 표시: 장소 · 보는 사람 · 형식 · 대본 · 영상 */
html.ui-v2 .pk-steps{display:flex;flex-wrap:wrap;align-items:center;gap:8px;list-style:none;margin:0 0 20px;padding:0;font-size:13px;line-height:19.5px;color:var(--text-2)}
html.ui-v2 .pk-steps li{display:flex;align-items:center;gap:6px;margin:0}
html.ui-v2 .pk-steps .pk-line{width:16px;height:1px;background:var(--border)}
html.ui-v2 .pk-dot{display:inline-grid;place-items:center;width:20px;height:20px;border-radius:50%;background:var(--surface-2);border:1px solid var(--border);font-size:13px;line-height:1;font-weight:500;color:var(--text-2)}
html.ui-v2 .pk-steps .is-now{color:var(--accent);font-weight:700}
html.ui-v2 .pk-steps .is-now .pk-dot{background:var(--surface);border:2px solid var(--accent);color:var(--accent)}
html.ui-v2 .pk-steps .is-done .pk-dot{background:var(--accent);border-color:var(--accent);color:var(--on-accent)}

html.ui-v2 .pk-title{font-size:22px;line-height:31px;font-weight:700;margin:0;color:var(--text-1)}
html.ui-v2 .pk-title:focus{outline:0}
html.ui-v2 .pk-todo{margin:4px 0 20px;font-size:15px;line-height:22.5px;color:var(--text-2)}

/* 칩 줄 + 검색 */
html.ui-v2 .pk-filter{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;margin-bottom:8px}
html.ui-v2 .pk-chips{display:flex;flex-wrap:wrap;gap:8px}
html.ui-v2 .pk .v2-chip{font-size:15px;line-height:22.5px}
html.ui-v2 .pk-check{font-weight:700}
html.ui-v2 .pk-search{position:relative;flex:0 1 240px;min-width:200px;margin:0}
html.ui-v2 .pk-search input{width:100%;box-sizing:border-box;height:40px;padding:0 44px 0 14px;border:1px solid var(--border-strong);border-radius:var(--r-sm);background:var(--surface);color:var(--text-1);font:500 15px/22.5px Pretendard,system-ui,sans-serif}
html.ui-v2 .pk-search input::placeholder{color:var(--text-3);font-weight:400}
html.ui-v2 .pk-search-go{position:absolute;right:4px;top:4px;width:32px;height:32px;display:grid;place-items:center;border:0;border-radius:var(--r-sm);background:transparent;color:var(--text-2)}
html.ui-v2 .pk-status{margin:0 0 8px;min-height:19.5px;font-size:13px;line-height:19.5px;color:var(--text-2)}
html.ui-v2 .pk-note{margin:0 0 12px;padding:10px 14px;border-radius:var(--r-sm);background:var(--surface-2);font-size:13px;line-height:19.5px;color:var(--text-2)}
html.ui-v2 .pk-warn{margin:4px 0 0;font-size:13px;line-height:19.5px;color:var(--warning);font-weight:500}

/* 줄 목록: 2열, 고른 줄은 강조 바탕 + 강조 테두리 + 채운 라디오 */
html.ui-v2 .pk-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
html.ui-v2 .pk-row{display:flex;align-items:center;gap:12px;width:100%;min-height:72px;padding:12px 16px 12px 12px;border:1px solid var(--border);border-radius:var(--r-md);background:var(--surface);color:var(--text-1);text-align:left}
html.ui-v2 .pk-row:hover{border-color:var(--border-strong)}
html.ui-v2 .pk-row[aria-pressed="true"]{background:var(--accent-soft);border:2px solid var(--accent);padding:11px 15px 11px 11px}
html.ui-v2 .pk-thumb{flex:0 0 64px;width:64px;height:48px;border-radius:var(--r-sm);background:var(--photo);overflow:hidden;display:grid;place-items:center}
html.ui-v2 .pk-thumb img{width:100%;height:100%;object-fit:cover}
html.ui-v2 .pk-thumb.is-text{background:var(--accent-soft);color:var(--accent);font-size:13px;line-height:16px;font-weight:700;padding:4px;box-sizing:border-box;text-align:center;word-break:keep-all}
html.ui-v2 .pk-thumb.is-text span{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
html.ui-v2 .pk-row-body{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
html.ui-v2 .pk-row-body strong{font-size:17px;line-height:25.5px;font-weight:500;overflow-wrap:anywhere}
html.ui-v2 .pk-row[aria-pressed="true"] .pk-row-body strong{font-weight:700}
html.ui-v2 .pk-row-body small{font-size:13px;line-height:19.5px;color:var(--text-2)}
html.ui-v2 .pk-radio{flex:0 0 20px;width:20px;height:20px;box-sizing:border-box;border-radius:50%;border:2px solid var(--border-strong);background:var(--surface)}
html.ui-v2 .pk-row[aria-pressed="true"] .pk-radio{border-color:var(--accent);box-shadow:inset 0 0 0 3px var(--surface),inset 0 0 0 10px var(--accent)}
html.ui-v2 .pk-rec{display:inline-block;margin-left:6px;padding:0 8px;border-radius:var(--r-pill);background:var(--surface-2);color:var(--text-2);font-size:13px;line-height:19.5px;font-weight:700;vertical-align:2px}
html.ui-v2 .pk-kinds{margin-bottom:12px}

/* 12c 형식: 줄 아래 근거 접힘 */
html.ui-v2 .pk-format{display:flex;flex-direction:column;gap:4px}
html.ui-v2 .pk-more{font-size:13px;line-height:19.5px;color:var(--text-2)}
html.ui-v2 .pk-more summary{cursor:pointer;color:var(--accent);font-weight:700;padding:4px 0}
html.ui-v2 .pk-evidence{margin-top:16px}
html.ui-v2 .pk-evidence article{display:flex;flex-direction:column;gap:2px;padding:8px 0;border-top:1px solid var(--border)}
html.ui-v2 .pk-morewrap{margin:12px 0 0}
html.ui-v2 .pk-btn-text{height:48px;padding:0 16px;border:0;border-radius:var(--r-sm);background:transparent;color:var(--text-2);font:700 15px/22.5px Pretendard,system-ui,sans-serif}
html.ui-v2 .pk-btn-text:hover{background:var(--surface-2)}

/* 4단계 더 설정 */
html.ui-v2 .pk-settings{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px 16px}
html.ui-v2 .pk-settings label{display:flex;flex-direction:column;gap:4px;font-size:13px;line-height:19.5px;color:var(--text-2)}
html.ui-v2 .pk-settings .pk-wide{grid-column:1/-1}
html.ui-v2 .pk-settings select,html.ui-v2 .pk-settings textarea{box-sizing:border-box;width:100%;min-height:40px;padding:8px 12px;border:1px solid var(--border-strong);border-radius:var(--r-sm);background:var(--surface);color:var(--text-1);font:500 15px/22.5px Pretendard,system-ui,sans-serif}
html.ui-v2 .pk-settings textarea{min-height:88px;resize:vertical}

/* 아래 줄: 고른 것 · 이전 · 주 버튼 1개 */
html.ui-v2 .pk-foot{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;margin-top:24px;padding-top:20px;border-top:1px solid var(--border)}
html.ui-v2 .pk-picked{display:flex;flex-wrap:wrap;gap:4px 16px;margin:0;min-width:0}
html.ui-v2 .pk-picked small{font-size:13px;line-height:19.5px;color:var(--text-2)}
html.ui-v2 .pk-picked b{font-size:15px;line-height:22.5px;font-weight:500;color:var(--text-1)}
html.ui-v2 .pk-actions{display:flex;align-items:center;gap:8px;margin-left:auto;flex-wrap:wrap}

@media (max-width:767px){
  html.ui-v2 .pk{padding:16px}
  html.ui-v2 .pk-list,html.ui-v2 .pk-settings{grid-template-columns:1fr}
  html.ui-v2 .pk-search{flex:1 1 100%}
  html.ui-v2 .pk-actions{width:100%}
  html.ui-v2 .pk-actions .v2-btn-primary{flex:1}
}

/* 홈 바탕 규칙 덮기: .hs-host section 테두리 상자 · 눌린 요소 갈색 외곽선(brand-v3)·안쪽 그림자(home-v3) */
html.ui-v2 .pk .pk-body{padding:0;border:0;border-radius:0;background:none}
html.ui-v2 .pk [aria-pressed="true"]{outline:0;box-shadow:none}
html.ui-v2 .pk-credit{margin:12px 0 0;font-size:13px;line-height:19.5px;color:var(--text-2)}
/* FMTPURPOSE: 형식 줄의 '무엇을 알리나' 한 줄 + 예, 고른 형식의 '알릴 것' 칩(여럿) */
html.ui-v2 .pk-purpose{display:block;word-break:keep-all}
html.ui-v2 .pk-purpose b{font-weight:500;color:var(--text-1)}
html.ui-v2 .pk-ex{display:block;color:var(--text-3)}
html.ui-v2 .pk-aims{margin:16px 0 0;padding:16px;border-radius:var(--r-md);background:var(--surface-2)}
html.ui-v2 .pk-aims-t{margin:0 0 8px;font-size:15px;line-height:22.5px;font-weight:500;color:var(--text-1)}
html.ui-v2 .pk-aims-t small{font-size:13px;line-height:19.5px;font-weight:400;color:var(--text-2)}
