/* UIV2 home — 이 파일은 해당 화면 카드(W) 한 명만 고친다. 모든 규칙은 .ui-v2 아래에만 */
/* W1 홈 01(시안 v2 01_home.png). 글자 13/15/17/22/32 · 굵기 400/500/700 · 간격 4의 배수 · 색은 ui-v2.css 토큰만 */

/* 공통 틀 — PC 에서는 홈도 W0 틀(왼쪽 메뉴 88 · 상단 바 64)을 쓴다. 폰(768 미만)은 지금 홈 배치(서랍 메뉴) 그대로 */
@media (min-width:768px){
  html.ui-v2 body.v3home .ghead{display:block!important}
  html.ui-v2 body.v3home #view{padding:40px 40px 48px;max-width:1360px;margin:0 auto}
  html.ui-v2 .v2h .v3-sidecol,html.ui-v2 .v2h .v3-mbar{display:none}
  html.ui-v2 .v2h{display:block;min-height:0;background:transparent}
  html.ui-v2 .v2h .v3-main{margin:0;padding:0;display:block}
}
html.ui-v2 body.v3home,html.ui-v2 body.v3home .app,html.ui-v2 body.v3home .body,html.ui-v2 body.v3home #view,html.ui-v2 .v2h{background:var(--bg)}
html.ui-v2 .v2h .v3-main{background:transparent}
html.ui-v2 .v2h .v2h-col{max-width:1280px;width:auto;margin:0 auto;padding:0;display:flex;flex-direction:column;gap:48px;color:var(--text-1)}

html.ui-v2 #v2hDyn{display:flex;flex-direction:column;gap:48px}
html.ui-v2 #v2hDyn:empty{display:none}
/* 1 만들기 띠 */
html.ui-v2 .v2h-band{background:var(--accent-soft);border-radius:24px;padding:48px 24px;display:flex;flex-direction:column;align-items:center;text-align:center}
html.ui-v2 .v2h-band h1{margin:0;font-size:32px;line-height:42px;font-weight:700;color:var(--text-1)}
html.ui-v2 .v2h-band .v2-todo{margin:16px 0 24px;font-size:17px;line-height:25.5px;color:var(--text-2)}
/* 2 시작 방법 칩 */
html.ui-v2 .v2h-chips{display:flex;flex-wrap:wrap;justify-content:center;gap:8px;margin:0 0 20px}
html.ui-v2 .v2h-chips .v2-chip{cursor:pointer;font-family:inherit}
html.ui-v2 .v2h-chips .v2-chip .v2h-ck{display:none}
html.ui-v2 .v2h-chips .v2-chip[aria-pressed="true"]{outline:0;font-weight:700;border-color:var(--accent);background:var(--surface);color:var(--accent)}
html.ui-v2 .v2h-chips .v2-chip[aria-pressed="true"] .v2h-ck{display:inline}
html.ui-v2 .v2h-chips[hidden],html.ui-v2 .v2h-box[hidden],html.ui-v2 .v2h-hint[hidden],html.ui-v2 .v2h-empty[hidden],html.ui-v2 .v2h-steps[hidden]{display:none}
/* 3 만들기 상자 */
html.ui-v2 .v2h-box{width:100%;max-width:1040px;box-sizing:border-box;background:var(--surface);border-radius:var(--r-xl);box-shadow:var(--shadow-1);padding:12px;display:flex;align-items:center;gap:8px;text-align:left}
html.ui-v2 .v2h-slots{flex:1;display:grid;grid-template-columns:repeat(auto-fit,minmax(0,1fr));gap:8px;min-width:0}
html.ui-v2 .v2h-slot{display:flex;flex-direction:column;align-items:flex-start;gap:0;min-width:0;padding:16px 20px;background:var(--surface-2);border:0;border-radius:var(--r-md);text-align:left;cursor:pointer;font-family:inherit;color:var(--text-1)}
html.ui-v2 .v2h-slot:hover{box-shadow:var(--shadow-2)}
html.ui-v2 .v2h-slot-place{flex-direction:row;align-items:center;gap:12px}
html.ui-v2 .v2h-slot-th{flex:none;width:48px;height:48px;border-radius:var(--r-sm);overflow:hidden;background:var(--photo)}
html.ui-v2 .v2h-slot-th img{width:100%;height:100%;object-fit:cover;display:block}
html.ui-v2 .v2h-slot-t{display:flex;flex-direction:column;min-width:0}
html.ui-v2 .v2h-slot-l{font-size:13px;line-height:19.5px;color:var(--text-3)}
html.ui-v2 .v2h-slot b{font-size:17px;line-height:25.5px;font-weight:500;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}
html.ui-v2 .v2h-slot-s{font-size:13px;line-height:19.5px;color:var(--accent)}
html.ui-v2 .v2h-box .v2-btn-primary{flex:none;margin:0 8px}
/* 4 안내 한 줄 */
html.ui-v2 .v2h-hint{display:flex;align-items:center;gap:8px;margin:20px 0 0;font-size:15px;line-height:22.5px;color:var(--text-2)}
html.ui-v2 .v2h-hint svg{flex:none;color:var(--text-2)}
html.ui-v2 .v2h-empty{margin:0;padding:20px 24px;border-radius:var(--r-md);background:var(--surface);font-size:15px;line-height:22.5px;color:var(--text-2)}
html.ui-v2 .v2h-resume{display:flex;align-items:center;gap:16px;padding:20px 24px;border-radius:var(--r-lg);background:var(--surface);box-shadow:var(--shadow-1);color:var(--text-1);text-decoration:none}
html.ui-v2 .v2h-resume span{display:flex;flex:1;min-width:0;flex-direction:column;gap:4px}
html.ui-v2 .v2h-resume b,html.ui-v2 .v2h-resume strong{font-size:15px;line-height:22.5px;font-weight:700}
html.ui-v2 .v2h-resume small{font-size:13px;line-height:19.5px;color:var(--text-2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
html.ui-v2 .v2h-resume strong{color:var(--accent)}
/* 장소부터 = 기존 4단계를 띠 안 흰 상자에 */
html.ui-v2 .v2h-steps{width:100%;max-width:1040px;box-sizing:border-box;text-align:left;background:var(--surface);border-radius:var(--r-xl);box-shadow:var(--shadow-1);padding:24px}

/* 구역 공통 */
html.ui-v2 .v2h-sec{display:flex;flex-direction:column;gap:20px}
html.ui-v2 .v2h-sh{display:flex;align-items:baseline;justify-content:space-between;gap:16px}
html.ui-v2 .v2h-sh h2{margin:0;font-size:22px;line-height:31px;font-weight:700;color:var(--text-1)}
html.ui-v2 .v2h-meta{margin:0;font-size:13px;line-height:19.5px;color:var(--text-3)}
/* 6 오늘 추천 조합 */
html.ui-v2 .v2h-recs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}
html.ui-v2 .v2h-rec{display:flex;gap:16px;padding:16px}
html.ui-v2 .v2h-rec-th{flex:none;width:108px;height:192px}
html.ui-v2 .v2h-rec-b{display:flex;flex-direction:column;align-items:flex-start;gap:4px;min-width:0}
html.ui-v2 .v2h-rec-b h3{margin:4px 0 0;font-size:17px;line-height:25.5px;font-weight:700;color:var(--text-1)}
html.ui-v2 .v2h-rec-f{margin:0;font-size:15px;line-height:22.5px;color:var(--text-2)}
html.ui-v2 .v2h-rec-b .v2-btn-weak{margin-top:auto;height:40px;padding:0 12px}
/* 7 지금 뜨는 형식 */
html.ui-v2 .v2h-tabs{display:flex;flex-wrap:wrap;gap:24px;border:0}
html.ui-v2 .v2h-tabs button{background:none;border:0;border-bottom:2px solid transparent;padding:4px 0 8px;font-family:inherit;font-size:15px;line-height:22.5px;font-weight:400;color:var(--text-2);cursor:pointer}
html.ui-v2 .v2h-tabs button[aria-selected="true"]{border-bottom-color:var(--accent);color:var(--text-1);font-weight:700}
html.ui-v2 .v2h-fmts{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:24px}
html.ui-v2 .v2h-fmt{display:flex;flex-direction:column;align-items:flex-start;gap:4px;min-width:0;padding:0;background:none;border:0;text-align:left;cursor:pointer;font-family:inherit;color:var(--text-1)}
html.ui-v2 .v2h-fmt .v2-thumb916{width:100%;margin-bottom:8px;box-shadow:var(--shadow-1)}
html.ui-v2 .v2h-fmt:hover .v2-thumb916{box-shadow:var(--shadow-2)}
html.ui-v2 .v2h-fmt .v2-thumb916 em{position:absolute;left:12px;right:12px;bottom:12px;z-index:1;font-style:normal;font-size:15px;line-height:22.5px;font-weight:700;color:var(--on-accent);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
html.ui-v2 .v2h-fmt b{font-size:15px;line-height:22.5px;font-weight:700}
html.ui-v2 .v2h-fmt small{font-size:13px;line-height:19.5px;color:var(--text-3)}
html.ui-v2 .v2h-fmt.nr{opacity:.72}
/* 8 우리 지역 관광자료 */
html.ui-v2 .v2h-assets{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:24px}
html.ui-v2 .v2h-asset{display:flex;flex-direction:column;gap:4px;min-width:0}
html.ui-v2 .v2h-asset h3{margin:8px 0 0;font-size:17px;line-height:25.5px;font-weight:700;color:var(--text-1)}
html.ui-v2 .v2h-asset-ph{position:relative;display:block;aspect-ratio:4/3;border-radius:var(--r-md);overflow:hidden;background:var(--photo)}
html.ui-v2 .v2h-asset-ph img{width:100%;height:100%;object-fit:cover;display:block}
html.ui-v2 .v2h-asset-ph.is-text{background:var(--accent-soft);display:flex;align-items:flex-end;padding:20px;box-sizing:border-box}
html.ui-v2 .v2h-asset-ph.is-text b{font-size:22px;line-height:31px;font-weight:700;color:var(--accent);overflow-wrap:anywhere}
html.ui-v2 .v2h-badge{position:absolute;left:12px;top:12px;padding:2px 8px;border-radius:4px;background:var(--surface);color:var(--text-2);font-size:13px;line-height:19.5px;font-weight:500}
/* 9 AI 안내 */
html.ui-v2 .v2h-col > .v2-ai-note{margin:0;align-self:flex-start;background:var(--surface);box-shadow:var(--shadow-1)}

/* 좁은 PC·태블릿 */
@media (max-width:1279px){
  html.ui-v2 .v2h-fmts{grid-template-columns:repeat(3,minmax(0,1fr))}
  html.ui-v2 .v2h-recs{grid-template-columns:1fr}
}
/* 폰(768 미만) — 지금 모바일 배치 유지, 한 줄로 쌓는다 */
@media (max-width:767px){
  html.ui-v2 .v2h .v2h-col{padding:16px;gap:32px}
  html.ui-v2 .v2h-band{padding:32px 16px;border-radius:var(--r-xl)}
  html.ui-v2 .v2h-band h1{font-size:22px;line-height:31px}
  html.ui-v2 .v2h-band .v2-todo{font-size:15px;line-height:22.5px}
  html.ui-v2 .v2h-box{flex-direction:column;align-items:stretch}
  html.ui-v2 .v2h-slots{grid-template-columns:1fr}
  html.ui-v2 .v2h-box .v2-btn-primary{margin:0}
  html.ui-v2 .v2h-steps{padding:16px}
  html.ui-v2 .v2h-fmts{grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
  html.ui-v2 .v2h-assets{grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
  html.ui-v2 .v2h-rec-th{width:88px;height:156px}
}
/* W12: 상자 칸 하나만 바꾸는 창 — 상자 자리에 같은 폭으로 */
html.ui-v2 .v2h-pick{width:100%;max-width:1040px;box-sizing:border-box;text-align:left}
html.ui-v2 .v2h-pick[hidden]{display:none}
/* FMTPURPOSE: 형식이 무엇을 알리는지 한 줄(+예) — 상자 형식 칸 · 지금 뜨는 형식 카드 · 형식 고르기 창 */
html.ui-v2 .v2-purpose{display:block;font-size:13px;line-height:19.5px;color:var(--text-2);overflow-wrap:anywhere;word-break:keep-all}
html.ui-v2 .v2-purpose-ex{display:block;color:var(--text-3)}
html.ui-v2 .v2h-slot .v2-purpose{max-width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
/* UXA1027 A3: 사진 없는 오늘 추천 조합은 회색 빈칸 대신 글자 카드(장소 이름·분야) */
html.ui-v2 .v2h-rec-th.is-text{background:var(--accent-soft);display:flex;flex-direction:column;justify-content:flex-end;gap:4px;padding:16px;box-sizing:border-box}
html.ui-v2 .v2h-rec-th.is-text b{font-size:22px;line-height:31px;font-weight:700;color:var(--accent);overflow-wrap:anywhere}
html.ui-v2 .v2h-rec-th.is-text small{font-size:13px;line-height:18px;color:var(--accent)}
