/* 2026-09-24(영어 UI 지원 Phase 1): i18n.js가 lang=en일 때 <html>에 잠깐 붙이는 클래스 — 한국어 원문이
   먼저 그려졌다가 영어로 바뀌는 깜빡임(FOUC)을 막기 위해 DOMContentLoaded 치환이 끝날 때까지 body를 숨김. */
html.i18n-pending body{visibility:hidden;}

:root{
  --coral:#FF385C;
  --coral-dark:#D70466;
  --ink:#222222;
  --gray-700:#484848;
  --gray-500:#767676;
  --gray-300:#DDDDDD;
  --gray-100:#F7F7F7;
  --bg:#FFFFFF;
  --radius-lg:16px;
  --radius-md:12px;
  --radius-sm:8px;
  --shadow-card:0 6px 16px rgba(0,0,0,0.12);
  --shadow-panel:-8px 0 30px rgba(0,0,0,0.15);
}
*{box-sizing:border-box;}
html,body{margin:0;padding:0;}
body{
  font-family:-apple-system,BlinkMacSystemFont,"Apple SD Gothic Neo","Malgun Gothic","Segoe UI",Roboto,sans-serif;
  color:var(--ink);
  background:var(--bg);
}
a{color:inherit;text-decoration:none;}
button{font-family:inherit;cursor:pointer;}

header{
  position:sticky;top:0;z-index:50;
  display:flex;align-items:center;justify-content:space-between;
  padding:14px 32px;border-bottom:1px solid var(--gray-300);
  background:var(--bg);
}
.logo{font-weight:800;font-size:22px;color:var(--coral);}
.searchbar{
  position:relative;
  display:flex;align-items:center;gap:8px;border:1px solid var(--gray-300);
  border-radius:999px;padding:6px 6px 6px 18px;box-shadow:0 1px 4px rgba(0,0,0,0.08);
  font-size:13px;color:var(--gray-700);
}
.searchbar input{border:none;outline:none;font-size:13px;width:200px;min-width:0;flex:1;}
.searchbar .go{
  width:32px;height:32px;border-radius:50%;background:var(--coral);color:#fff;
  display:flex;align-items:center;justify-content:center;border:none;font-size:14px;flex:none;
}

/* 2026-08-16: 검색 제안(오타 허용) 드롭다운 */
.search-suggest{
  display:none;position:absolute;top:calc(100% + 8px);left:0;right:0;z-index:70;
  background:#fff;border:1px solid var(--gray-300);border-radius:14px;box-shadow:var(--shadow-card);
  overflow:hidden;max-height:320px;overflow-y:auto;
}
.search-suggest.open{display:block;}
.search-suggest-item{
  display:flex;align-items:center;justify-content:space-between;gap:10px;
  padding:9px 16px;font-size:13px;color:var(--ink);cursor:pointer;
}
.search-suggest-item:hover{background:var(--gray-100);}
.search-suggest-item .country{font-size:12px;color:var(--gray-500);flex:none;}
.search-suggest-empty{padding:12px 16px;font-size:12px;color:var(--gray-500);}

/* 2026-08-16: 도시명·국가명 영문 병기 */
.en-name{color:var(--gray-500);font-weight:400;font-size:0.88em;}

/* 2026-08-16: 여행 지역 목록이 길어질 때 쓰는 "맨 위로" 플로팅 버튼 */
.back-to-top{
  display:none;position:fixed;right:24px;bottom:24px;width:46px;height:46px;border-radius:50%;
  background:var(--ink);color:#fff;border:none;font-size:18px;box-shadow:var(--shadow-card);
  cursor:pointer;z-index:80;align-items:center;justify-content:center;
}
.back-to-top.show{display:flex;}
.back-to-top:hover{background:#000;}
@media (max-width:720px){ .back-to-top{right:16px;bottom:16px;width:42px;height:42px;} }
.admin-link{
  width:36px;height:36px;border-radius:50%;display:flex;align-items:center;justify-content:center;
  color:var(--gray-500);font-size:16px;border:1px solid var(--gray-300);margin-right:8px;flex:none;
}
.admin-link:hover{color:var(--ink);background:var(--gray-100);}
.connect-btn{
  background:var(--ink);color:#fff;border:none;padding:10px 18px;border-radius:999px;
  font-size:14px;font-weight:600;
}

/* 2026-09-10(BE-3a, public/siteNav.js): 전역 메뉴 링크 + "더보기" 드롭다운(⚙·채널관리, OD-BE-6 확정:
   로그인 사용자에게만 노출). #authArea(로그인/닉네임/로그아웃)는 기존 스타일을 그대로 씀 — 건드리지 않음. */
.site-nav-links{display:flex;align-items:center;gap:4px;flex-wrap:wrap;}
.site-nav-link{
  text-decoration:none;color:var(--gray-700);font-size:13px;font-weight:600;padding:8px 12px;
  border-radius:999px;white-space:nowrap;
}
.site-nav-link:hover{background:var(--gray-100);}
.site-nav-link.current{color:var(--coral);background:#FFF3EE;}
.site-nav-more-wrap{position:relative;}
.site-nav-more-btn{
  width:36px;height:36px;border-radius:50%;display:flex;align-items:center;justify-content:center;
  color:var(--gray-500);font-size:16px;border:1px solid var(--gray-300);background:#fff;cursor:pointer;flex:none;
}
.site-nav-more-btn:hover{color:var(--ink);background:var(--gray-100);}
.site-nav-more-menu{
  position:absolute;top:calc(100% + 8px);right:0;z-index:70;min-width:160px;
  background:#fff;border:1px solid var(--gray-300);border-radius:12px;box-shadow:var(--shadow-card);
  overflow:hidden;padding:6px;
}
.site-nav-more-menu a{
  display:block;padding:9px 12px;font-size:13px;color:var(--ink);text-decoration:none;border-radius:8px;
}
.site-nav-more-menu a:hover{background:var(--gray-100);}

/* 2026-09-19(유럽중심 런칭 준비): 사이트 전역 하단 푸터(footer.js가 #siteFooterMount에 주입) — 이용약관/개인정보처리방침/About 상시 노출 */
#siteFooterMount{display:block;}
.site-footer-inner{
  max-width:1100px;margin:0 auto;padding:28px 32px 32px;
  border-top:1px solid var(--gray-300);
  display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px 24px;
}
.site-footer-brand{display:flex;flex-direction:column;gap:4px;min-width:200px;}
.site-footer-logo{font-weight:800;font-size:15px;color:var(--coral);}
.site-footer-tagline{font-size:12px;color:var(--gray-500);}
.site-footer-links{display:flex;flex-wrap:wrap;gap:4px;}
.site-footer-links a{
  text-decoration:none;color:var(--gray-700);font-size:13px;font-weight:600;padding:6px 10px;
  border-radius:999px;white-space:nowrap;
}
.site-footer-links a:hover{background:var(--gray-100);color:var(--ink);}
.site-footer-copy{width:100%;font-size:11.5px;color:#9ca3af;margin-top:4px;}
.connect-btn:hover{background:#000;}

.channel-strip{
  display:flex;gap:10px;padding:14px 32px;overflow-x:auto;border-bottom:1px solid var(--gray-300);
}
.channel-chip{
  flex:none;display:flex;align-items:center;gap:8px;border:1px solid var(--gray-300);
  border-radius:999px;padding:6px 10px 6px 6px;font-size:12px;background:var(--gray-100);
}
.channel-chip img{width:26px;height:26px;border-radius:50%;object-fit:cover;background:#ddd;}
.channel-chip .name{font-weight:600;max-width:120px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.channel-chip .count{color:var(--gray-500);}
.channel-chip .x{border:none;background:none;color:var(--gray-500);font-size:14px;padding:0 2px;}
.channel-chip .refresh{border:none;background:none;color:var(--gray-500);font-size:13px;padding:0 2px;}
.channel-chip.pending{opacity:0.7;}
.channel-chip .status-label{font-size:11px;color:var(--gray-700);white-space:nowrap;}
.channel-chip .eta-label{font-size:10px;color:var(--coral-dark);white-space:nowrap;}

/* 2026-08-26(신규가입 유도 배너): 비로그인 사용자에게만 노출, 닫으면 localStorage로 재노출 안 함(app.js). */
.signup-banner{display:none;align-items:center;justify-content:center;gap:12px;flex-wrap:wrap;background:#fff4e6;border-bottom:1px solid #fed7aa;padding:8px 16px;font-size:13px;color:#7c2d12;}
.signup-banner-cta{border:none;background:var(--coral);color:#fff;border-radius:999px;padding:5px 14px;font-size:12.5px;font-weight:700;cursor:pointer;white-space:nowrap;}
.signup-banner-cta:hover{background:var(--coral-dark);}
.signup-banner-close{border:none;background:transparent;color:#9a3412;font-size:14px;cursor:pointer;padding:0 4px;}

/* 2026-09-19(유럽중심 런칭 준비 ①): 유럽중심 안내 배너 — signup-banner와 달리 로그인 여부와 무관하게
   모든 사용자에게 노출(신규/기존 가입자 포함 전원에게 서비스 범위를 알려야 하는 안내이기 때문). 중립적인
   파란 톤으로 signup-banner(주황, 가입유도)와 시각적으로 구분. */
.region-banner{display:none;align-items:center;justify-content:center;gap:12px;flex-wrap:wrap;background:#eff6ff;border-bottom:1px solid #bfdbfe;padding:8px 16px;font-size:13px;color:#1e3a5f;}
.region-banner-close{border:none;background:transparent;color:#1e3a5f;font-size:14px;cursor:pointer;padding:0 4px;}

/* 2026-09-22: creator.html 발자취 지도 핀 클릭 딥링크로 들어왔을 때만 노출되는 복귀 링크 — signup/region
   배너와 같은 가로 전체폭 톤이지만 안내가 아니라 "돌아가기" 액션이라 코랄로 눈에 띄게. */
.creator-return-banner{display:none;align-items:center;justify-content:center;background:#FFF3EA;border-bottom:1px solid #FFD9CC;padding:8px 16px;font-size:13px;}
.creator-return-banner a{color:var(--coral-dark);font-weight:700;text-decoration:none;}
.creator-return-banner a:hover{text-decoration:underline;}

/* 9-2 지도·리스트 스플릿 뷰(Wanderlog 패턴) + (2026-08-15) 함께 보기/지도만/목록만 3단 토글.
   900px 이상: 기본은 좌우 분할(지도 40%/리스트 60%) + 지도 스티키. 900px 미만: 기본은 목록만(지도는 숨김).
   화면 크기와 무관하게 view-toggle로 세 상태(둘 다/지도만/목록만) 전환 가능 — "지도 크게 보기"를 대체함. */
/* 2026-08-16: 크리에이터 필터가 지도 마커에도 영향을 주는데(applySortAndFilter가 필터링된 목록으로 renderMap도
   호출) 예전엔 grid-toolbar(list-pane 안)에만 있어서 "지도만" 뷰에서는 필터를 열 수 없었음 — 뷰 토글과 같은
   줄(top-toolbar)에 둬서 세 뷰 모두에서 항상 열 수 있게 함. */
.top-toolbar{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:8px;padding:14px 16px 0;}
.top-toolbar .view-toggle{flex:1;min-width:220px;padding:0;}
.top-toolbar .creator-filter{flex:none;}
.view-toggle{display:flex;gap:8px;}
.view-toggle-btn{
  flex:1;padding:9px;border-radius:999px;border:1px solid var(--gray-300);
  background:#fff;font-size:13px;font-weight:600;cursor:pointer;color:var(--gray-700);
}
.view-toggle-btn.active{background:var(--ink);color:#fff;border-color:var(--ink);}
.split-view{display:block;}
/* 명시적으로 지도만/목록만을 고른 경우 — 화면 크기와 무관하게 항상 적용 */
.split-view.show-map .list-pane{display:none;}
.split-view.show-list .map-pane{display:none;}
@media (min-width: 900px){
  .top-toolbar{padding:14px 32px 0;}
  .split-view{display:flex;align-items:flex-start;}
  .map-pane{flex:0 0 40%;max-width:40%;position:sticky;top:66px;align-self:flex-start;}
  .map-pane .hero-wrap{padding:20px 20px 20px 32px;}
  .map-pane #map{height:calc(100vh - 110px);}
  .list-pane{flex:1 1 60%;min-width:0;}
  /* "지도만"/"목록만"을 고르면 남은 패널이 40%/60%에 묶이지 않고 전체 폭을 차지하도록 덮어씀
     (안 그러면 숨긴 패널 자리가 그냥 빈 공간으로 남음) */
  .split-view.show-map .map-pane{flex:1 1 100%;max-width:100%;}
  .split-view.show-list .list-pane{flex:1 1 100%;}
}
@media (max-width: 899px){
  /* 모바일 기본값: 목록만(지도는 "함께 보기"·"지도만"을 골랐을 때만 나타남) */
  .map-pane{display:none;}
  .split-view.show-map .map-pane,
  .split-view.show-both .map-pane{display:block;}
}

.hero-wrap{padding:20px 32px 0;}
.hero-title{font-size:15px;color:var(--gray-500);margin:4px 0 14px;}
.hero-title b{color:var(--ink);}
#map{
  height:380px;border-radius:var(--radius-lg);border:1px solid var(--gray-300);
  box-shadow:var(--shadow-card);transition:height 0.2s ease;
}
/* 카드↔핀 양방향 하이라이트(클릭 기준) */
.city-card.highlighted{outline:3px solid var(--coral);outline-offset:2px;border-radius:var(--radius-md);}
.marker-selected .marker-pin{background:var(--coral-dark);transform:scale(1.15);z-index:1000;}
.marker-pin{
  background:var(--coral);color:#fff;border-radius:20px;padding:5px 10px;
  font-size:12px;font-weight:700;box-shadow:0 2px 6px rgba(0,0,0,0.3);
  border:2px solid #fff;white-space:nowrap;
}
/* 2026-08-16: 영문 병기(.en-name)는 기본이 회색 텍스트라 코랄 배경(핀)·회색 텍스트(클러스터) 맥락에 맞게 재정의 */
.marker-pin .en-name{color:rgba(255,255,255,0.85);font-size:0.85em;}
.cluster-names .en-name{color:var(--gray-500);}
.leaflet-fit-all-btn{
  background:#fff;border:2px solid rgba(0,0,0,0.2);border-radius:6px;
  padding:6px 10px;font-size:12px;font-weight:700;color:var(--ink);cursor:pointer;
  box-shadow:0 1px 4px rgba(0,0,0,0.2);
}
.leaflet-fit-all-btn:hover{background:var(--gray-100);}

.section-label{padding:28px 32px 4px;font-size:20px;font-weight:700;}
.section-sub{padding:0 32px 16px;font-size:14px;color:var(--gray-500);}
/* 2026-09-15(Joseph 실사용 발견 — "지도보기"로 건 필터는 클러스터 카드와 매칭이 안 돼 해제 버튼이 카드에
   안 뜨는 경우가 있었음): 섹션 제목 안에 항상 보이는 "✕ 필터 해제" 버튼을 별도로 둠(.section-label은
   다른 섹션에서도 공유하는 클래스라 여기서만 flex로 만들려고 #clusterSection으로 범위를 좁힘). */
#clusterSection .section-label{display:flex;align-items:center;justify-content:space-between;gap:10px;}
.cluster-filter-clear-btn{font-size:12px;font-weight:600;color:var(--coral-dark);background:#FFF1F3;border:1px solid var(--coral);border-radius:999px;padding:4px 12px;cursor:pointer;}
.cluster-filter-clear-btn:hover{background:var(--coral);color:#fff;}
.cluster-row-wrap{position:relative;}
.cluster-row{display:flex;gap:12px;padding:0 32px 8px;overflow-x:auto;scroll-behavior:smooth;}
.cluster-nav-btn{
  position:absolute;top:44%;transform:translateY(-50%);z-index:2;
  width:32px;height:32px;border-radius:50%;border:1px solid var(--gray-300);
  background:#fff;box-shadow:var(--shadow-card);color:var(--ink);
  font-size:18px;line-height:1;cursor:pointer;display:flex;align-items:center;justify-content:center;
}
.cluster-nav-btn:hover{border-color:var(--coral);color:var(--coral);}
.cluster-nav-btn:disabled{opacity:0;pointer-events:none;}
.cluster-nav-prev{left:6px;}
.cluster-nav-next{right:6px;}
.cluster-card{
  position:relative;flex:none;min-width:200px;max-width:240px;border:1px solid var(--gray-300);border-radius:var(--radius-lg);
  padding:14px 16px;cursor:pointer;background:#fff;box-shadow:var(--shadow-card);
}
.cluster-card:hover{border-color:var(--coral);}
.cluster-card .cluster-count{font-size:12px;font-weight:700;color:var(--coral);margin-bottom:4px;}
.cluster-card .cluster-title{font-size:12px;font-weight:700;color:var(--coral);margin-bottom:4px;}
.cluster-card .cluster-names{font-size:13px;font-weight:600;line-height:1.4;margin-bottom:6px;}
.cluster-card .cluster-videos{font-size:11px;color:var(--gray-500);}
/* 2026-09-15(Joseph 요청 — "각 섹션에 선택 해제 버튼"): 지금 필터와 정확히 일치하는 카드를 coral 배경으로
   강조하고, 그 카드에서만 우측 상단 ✕ 버튼이 보이게 함(다른 카드에선 숨김 — renderClusterActiveStates가
   .active 클래스를 토글). 버튼 클릭은 카드 클릭(재선택)으로 안 번지게 onclick에서 stopPropagation. */
.cluster-card.active{border-color:var(--coral);background:#FFF7F8;}
.cluster-clear-btn{
  display:none;position:absolute;top:8px;right:8px;width:20px;height:20px;border-radius:50%;
  border:none;background:var(--coral);color:#fff;font-size:11px;line-height:1;cursor:pointer;
  align-items:center;justify-content:center;
}
.cluster-card.active .cluster-clear-btn{display:flex;}
.cluster-clear-btn:hover{background:var(--coral-dark);}
.grid{
  display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));
  gap:24px;padding:0 32px 40px;
}
.empty-state{
  margin:0 32px 40px;padding:30px;border:1px dashed var(--gray-300);border-radius:var(--radius-lg);
  color:var(--gray-500);font-size:14px;text-align:center;line-height:1.7;
}
.city-card{cursor:pointer;position:relative;}
.city-card .photo{
  position:relative;width:100%;aspect-ratio:1/1;border-radius:var(--radius-md);
  overflow:hidden;background:var(--gray-100);
}
.city-card .photo img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .3s;}
.city-card:hover .photo img{transform:scale(1.04);}
.badge-count{
  position:absolute;bottom:10px;left:10px;background:rgba(0,0,0,0.65);color:#fff;
  font-size:11px;padding:4px 8px;border-radius:999px;font-weight:600;
}
/* 2026-08-16: 전담 영상 없이 다른 영상에서 언급만 된 도시(3-14 other_cities 보너스 도시) 구분 배지 */
.badge-count.badge-mention{background:rgba(124,58,237,0.85);}
/* 2026-09-16(사용자 요청): 영상 수와 별개로 Tripmoi 자체 리서치가 있는 도시를 표시하는 배지.
   영상 배지(하단좌측)와 겹치지 않게 우상단에 배치, 톤은 badge-mention과 동일한 보라 계열로 통일. */
.badge-tripmoi{
  position:absolute;top:10px;right:10px;background:rgba(124,58,237,0.85);color:#fff;
  font-size:11px;padding:4px 8px;border-radius:999px;font-weight:600;
}
.city-card .meta{display:flex;justify-content:space-between;margin-top:10px;font-size:15px;}
.city-card .meta b{font-weight:600;}
.city-card .sub{color:var(--gray-500);font-size:13px;margin-top:2px;}

.overlay{
  position:fixed;inset:0;background:rgba(0,0,0,0.4);z-index:2000;
  opacity:0;pointer-events:none;transition:opacity .25s;
}
.overlay.open{opacity:1;pointer-events:auto;}
.panel{
  position:fixed;top:0;right:0;height:100%;width:460px;max-width:92vw;
  background:#fff;z-index:2001;box-shadow:var(--shadow-panel);
  transform:translateX(100%);transition:transform .3s ease, width .25s ease;
  display:flex;flex-direction:column;
}
.panel.open{transform:translateX(0);}
.panel.wide{width:960px;}
.panel-scroll{overflow-y:auto;flex:1;}
.panel-close{
  position:absolute;top:14px;left:14px;z-index:5;width:34px;height:34px;border-radius:50%;
  background:#fff;border:none;box-shadow:0 1px 6px rgba(0,0,0,0.3);font-size:16px;
}
.panel-expand{
  position:absolute;top:14px;left:56px;z-index:5;width:34px;height:34px;border-radius:50%;
  background:#fff;border:none;box-shadow:0 1px 6px rgba(0,0,0,0.3);font-size:14px;
}
/* 2026-09-08(P3-a): 공유 버튼 — panel-close/panel-expand와 같은 톤, 세 번째 자리(left:98px)에 나란히 배치 */
.panel-share{
  position:absolute;top:14px;left:98px;z-index:5;width:34px;height:34px;border-radius:50%;
  background:#fff;border:none;box-shadow:0 1px 6px rgba(0,0,0,0.3);font-size:14px;cursor:pointer;
}
/* 2026-08-24(사용자 요청): 도시 상세 패널 전용 "맨 위로" — 전역 .back-to-top과 톤은 같지만 패널(position:fixed)
   기준으로 앵커되도록 absolute로 두고 z-index는 패널 안 다른 버튼들과 같은 5로 맞춤. */
.panel-back-to-top{
  display:none;position:absolute;right:16px;bottom:16px;z-index:5;width:42px;height:42px;border-radius:50%;
  background:var(--ink);color:#fff;border:none;font-size:16px;box-shadow:0 2px 8px rgba(0,0,0,0.3);
  cursor:pointer;align-items:center;justify-content:center;
}
.panel-back-to-top.show{display:flex;}
.panel-back-to-top:hover{background:#000;}
.panel-hero{position:relative;height:220px;background:var(--gray-100);}
.panel-hero img{width:100%;height:100%;object-fit:cover;}
.panel-body{padding:16px 20px 0;}
.panel-body h2{font-size:22px;margin:0 0 2px;}
.panel-body .loc{color:var(--gray-500);font-size:14px;margin-bottom:10px;}
/* Phase 2f(2026-08-22): 도시 상세 헤더의 체크인/저장 버튼 */
.panel-title-row{display:flex;align-items:flex-start;justify-content:space-between;gap:10px;flex-wrap:wrap;}
.panel-title-row h2{flex:1;min-width:0;}
.city-actions{display:flex;gap:6px;flex-shrink:0;margin-top:2px;}
.city-action-btn{background:#fff;border:1px solid #d1d5db;border-radius:999px;padding:5px 12px;font-size:12.5px;cursor:pointer;white-space:nowrap;}
.city-action-btn:hover{border-color:#ff385c;}
.city-action-btn.active{background:#FFF1F3;border-color:#ff385c;color:var(--coral-dark,#e11d48);font-weight:600;}
.stat-row{display:flex;gap:16px;padding:12px 0;border-top:1px solid var(--gray-300);border-bottom:1px solid var(--gray-300);margin-bottom:14px;font-size:13px;}
.stat-row .stat b{display:block;font-size:16px;}
.stat-row .stat{color:var(--gray-500);}

.tabs{display:flex;gap:4px;overflow-x:auto;padding:0 20px;border-bottom:1px solid var(--gray-300);}
.tab-btn{
  background:none;border:none;padding:10px 12px;font-size:13px;font-weight:600;color:var(--gray-500);
  border-bottom:2px solid transparent;white-space:nowrap;
}
.tab-btn.active{color:var(--ink);border-bottom:2px solid var(--ink);}
.tab-panels{padding:16px 20px 20px;font-size:14px;line-height:1.65;color:var(--gray-700);}
.tab-panel{display:none;}
.tab-panel.active{display:block;}
.tab-panel h4{font-size:14px;margin:14px 0 6px;color:var(--ink);}
.tab-panel h4:first-child{margin-top:0;}
.route-step{display:flex;gap:10px;margin-bottom:10px;}
.route-step .day{
  flex:none;width:28px;height:28px;border-radius:50%;background:var(--coral);color:#fff;
  font-size:11px;font-weight:700;display:flex;align-items:center;justify-content:center;
}
.pc-cols{display:flex;gap:14px;}
.pc-col{flex:1;}
.pc-col.pros h4{color:#0F9D58;}
.pc-col.cons h4{color:var(--coral-dark);}
.pc-col li{margin-bottom:6px;}
.stay-card{border:1px solid var(--gray-300);border-radius:var(--radius-sm);padding:10px 12px;margin-bottom:10px;}
.stay-top{display:flex;align-items:center;gap:8px;flex-wrap:wrap;cursor:pointer;}
.stay-card .stay-name{font-weight:700;font-size:14px;}
.stay-card .area{font-weight:600;font-size:13px;color:var(--gray-500);}
.stay-card .price{margin-left:auto;color:var(--gray-500);font-size:12px;}
.stay-detail{display:none;}
.stay-card.expanded .stay-detail{display:block;}

.route-spots{display:flex;flex-wrap:wrap;gap:6px;margin-top:6px;}
.spot-chip{background:var(--gray-100);border:1px solid var(--gray-300);border-radius:999px;padding:3px 10px;font-size:12px;color:var(--gray-700);}

/* 2026-08-15: 카테고리별 상세보기 — 압축 리스트(제목만) + 클릭 시 펼쳐지는 상세(설명/팁/출처영상) */
.category-group{margin-bottom:14px;}
.category-group:last-child{margin-bottom:0;}
.category-header{display:flex;align-items:center;gap:6px;font-size:12px;font-weight:700;color:var(--gray-500);margin-bottom:6px;}
.category-count{background:var(--gray-100);border-radius:999px;padding:1px 7px;font-size:10px;color:var(--gray-500);}
.expand-arrow{display:inline-block;font-size:10px;color:var(--gray-500);transition:transform .15s;}
.highlight-card.expanded .expand-arrow,.stay-card.expanded .expand-arrow{transform:rotate(90deg);}
.highlight-detail{display:none;margin-top:6px;}
.highlight-card.expanded .highlight-detail{display:block;}
.source-thumb-link{display:flex;align-items:center;gap:8px;margin-top:8px;text-decoration:none;color:var(--ink);}
.source-thumb{width:64px;height:36px;object-fit:cover;border-radius:6px;flex-shrink:0;}
.source-thumb-link span{font-size:12px;color:var(--coral);}

.highlight-list{display:flex;flex-direction:column;gap:10px;}
.highlight-card{border:1px solid var(--gray-300);border-radius:var(--radius-sm);padding:10px 12px;}
.highlight-top{display:flex;align-items:center;gap:8px;cursor:pointer;}
.highlight-top b{font-size:14px;}
.cat-badge{background:var(--gray-100);border-radius:999px;padding:2px 8px;font-size:11px;color:var(--gray-500);}
.highlight-desc{font-size:13px;color:var(--gray-700);}
.highlight-tip{font-size:12px;color:var(--gray-500);margin-top:4px;}
.source-link,.highlight-source{display:inline-block;margin-top:6px;font-size:12px;color:var(--coral);}

.vibe-tags{display:flex;flex-wrap:wrap;gap:6px;margin:6px 0 10px;}
.vibe-tag{background:var(--gray-100);border-radius:999px;padding:3px 10px;font-size:12px;color:var(--gray-700);}
.vibe-tag.budget{background:#FFF1F3;color:var(--coral-dark);font-weight:600;}

/* 2026-09-15: 도시 패널 내 "함께 묶어 가기 좋은 지역" — 홈 화면 cluster-card와 톤을 맞추되(coral 강조),
   패널 폭이 좁아 가로 스크롤 대신 칩을 줄바꿈(flex-wrap)해서 전부 한눈에 보이게 함. */
.nearby-region-block{margin-top:12px;padding-top:12px;border-top:1px solid var(--gray-300);}
.nearby-region-title{font-size:13px;font-weight:700;color:var(--ink);margin-bottom:2px;}
/* 2026-09-15(Joseph 요청 — "옆에 지도보기 추가"): 타이틀과 "지도보기" 버튼을 한 줄에 양끝 정렬. */
.nearby-region-title-row{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:2px;}
.nearby-region-title-row .nearby-region-title{margin-bottom:0;}
.nearby-region-map-btn{flex:none;background:var(--gray-100);border:1px solid var(--gray-300);border-radius:999px;padding:3px 10px;font-size:11px;font-weight:600;color:var(--gray-700);cursor:pointer;}
.nearby-region-map-btn:hover{border-color:var(--coral);color:var(--coral-dark);}
.nearby-region-sub{font-size:11px;color:var(--gray-500);margin-bottom:8px;}
.nearby-region-chips{display:flex;flex-wrap:wrap;gap:6px;}
.nearby-city-chip{display:flex;align-items:center;gap:5px;background:var(--gray-100);border:1px solid var(--gray-300);border-radius:999px;padding:4px 10px;font-size:12px;color:var(--gray-700);cursor:pointer;}
.nearby-city-chip:hover{border-color:var(--coral);color:var(--coral-dark);}
.nearby-city-dist{font-size:10px;color:var(--gray-500);}
.video-sort-row{display:flex;align-items:center;gap:8px;font-size:12px;color:var(--gray-500);margin-bottom:12px;}
.video-sort-row select{border:1px solid var(--gray-300);border-radius:6px;padding:3px 6px;font-size:12px;}
.video-row{display:flex;gap:10px;margin-bottom:12px;}
.video-row img{width:96px;height:56px;object-fit:cover;border-radius:8px;flex:none;}
.video-row .vt{font-size:13px;font-weight:600;margin-bottom:3px;}
.video-row .vt-content{font-size:11px;color:var(--coral-dark);margin-bottom:3px;}
.video-row .vm{font-size:12px;color:var(--gray-500);}
/* 2026-08-16: 다도시 영상이 이 도시의 "영상" 탭에도 뜰 때(city.videoIds엔 없지만 항목별 city 태깅으로 연결된 경우)
   일반 영상과 구분되도록 다는 배지 — 0영상 도시의 badge-mention과 같은 보라 계열로 톤을 맞춤. */
.video-cross-badge{display:inline-block;font-size:10px;font-weight:700;color:#7c3aed;background:#F3E8FE;border-radius:999px;padding:2px 8px;margin-right:6px;vertical-align:middle;}

.freshness-note{font-size:12px;color:var(--gray-500);background:var(--gray-100);border-radius:8px;padding:6px 10px;margin-bottom:10px;display:inline-block;}
.muted{color:var(--gray-500);}

/* 3-17 3단계(2026-08-17, 사용자 요청): 역사/가볼 곳/루트 탭을 "누가 만든 정보인지" 기준 4축 구조로 재편.
   1.전체써머리(축별 커버리지 칩) → 2.Tripmoi 리서치 → 3.여행 크리에이터 → 4.개별여행자(수퍼여행자) →
   5.체험투어 상품 공급자 순서 고정. 축마다 다른 강조색을 써서 "이건 누가 만든 정보인지" 한눈에 구분되게 함
   (3-15가 AI요약탭 vs 후기탭을 톤으로 구분한 것과 같은 원칙). 내용 없는 축은 지우지 않고 옅게 "없음" 표시.*/
.axis-summary{margin-bottom:14px;padding:10px 14px;background:var(--gray-100);border-radius:10px;}
.axis-summary-title{font-size:12px;font-weight:700;color:var(--gray-700);margin-bottom:6px;}
.axis-summary-hint{font-weight:400;color:var(--gray-500);}
.axis-summary-chips{display:flex;flex-wrap:wrap;gap:6px;}
/* 2026-08-17 사용자 요청: 칩을 눌러서 해당 축 섹션으로 이동 — <span>에서 <button>으로 바꾼 만큼 기본 버튼
   외곽선/폰트를 초기화하고 포인터 커서를 추가함(색상은 기존 .has/.empty 규칙 그대로 재사용). */
.axis-chip{font:inherit;font-size:11px;font-weight:700;border-radius:999px;padding:3px 10px;border:1px solid transparent;cursor:pointer;}
.axis-chip.empty{color:var(--gray-500);background:#fff;border-color:var(--gray-300);opacity:.6;}
.axis-chip--tripmoi.has{color:#7c3aed;background:#F3E8FE;}
.axis-chip--creator.has{color:var(--coral-dark);background:#FFE9F0;}
.axis-chip--traveler.has{color:#0d9488;background:#CCFBF1;}
.axis-chip--experience.has{color:#2563eb;background:#DBEAFE;}

.axis-section{margin-top:14px;padding:14px 16px;border-radius:10px;border:1px solid var(--gray-300);}
.axis-section-head{display:flex;align-items:center;gap:6px;font-size:13px;font-weight:700;margin-bottom:10px;}
.axis-emoji{font-size:13px;}
.axis-empty-note{font-size:12px;color:var(--gray-500);}
/* 2026-08-26(구현플랜 P2-a): 신뢰배지 — 축 헤드 바로 아래, 본문보다 눈에 덜 띄게(담백한 톤). */
.axis-trust-badge{font-size:11px;color:var(--gray-500);margin:-4px 0 10px;}
/* 2026-09-10(MH-1b): 신뢰배지 안의 "이 채널의 여행 페이지" 발견 링크 — 배지 톤 유지하되 클릭 가능함을 살짝 표시 */
.axis-trust-creator-link{color:var(--coral-dark);text-decoration:none;font-weight:600;}
.axis-trust-creator-link:hover{text-decoration:underline;}
.axis-section--empty{opacity:.55;}
.axis-section--tripmoi{background:#FAF5FF;border-color:#E9D5FF;}
.axis-section--tripmoi .axis-section-head{color:#6b21a8;}
.axis-section--creator{background:#FFF5F8;border-color:#FBCFE0;}
.axis-section--creator .axis-section-head{color:var(--coral-dark);}
.axis-section--traveler{background:#F0FDFA;border-color:#99F6E4;}
.axis-section--traveler .axis-section-head{color:#0f766e;}
.axis-section--experience{background:#EFF6FF;border-color:#BFDBFE;}
.axis-section--experience .axis-section-head{color:#1d4ed8;}

/* 2026-08-24: 콘텐츠 좋아요("도움돼요") 버튼 — 축 섹션 본문 아래, review-card의 도움됐어요 버튼과 톤을
   맞추되(같은 필박스 느낌) 축 색상 구분은 필요 없어 단색 하나로 통일. */
.helpful-btn{margin-top:10px;font:inherit;font-size:11px;font-weight:700;border-radius:999px;padding:4px 12px;border:1px solid var(--gray-300);background:#fff;color:var(--gray-700);cursor:pointer;}
.helpful-btn.active{background:#FFF0D6;border-color:#F5B94A;color:#92600A;}

/* 2026-08-17 사용자 요청("누구의 정보인지 필터 가능해야 한다"): 개별여행자·체험투어 축 카드 목록 위에
   붙는 간단한 작성자/공급자 select 필터 — 옵션이 2개 이상일 때만 노출(axis HTML 생성부 참고) */
.axis-person-filter{display:flex;align-items:center;gap:8px;margin-bottom:10px;font-size:12px;color:var(--gray-600);}
.axis-person-filter select{font-size:12px;padding:4px 8px;border:1px solid var(--gray-300);border-radius:6px;background:#fff;}

/* 2026-08-17 사용자 요청("루트 하루 단위로"): 업로드 문서 3-1 스키마(City→Day→theme+Stop[])에 맞춰
   Day 단위로 그룹핑 — 각 Day 블록 사이 여백을 주고, 헤더에 "Day N — 테마"를 굵게 표시 */
.tripmoi-day-block{margin-bottom:18px;}
.tripmoi-day-block:last-child{margin-bottom:0;}
.tripmoi-day-header{font-size:14px;font-weight:800;color:#6b21a8;margin-bottom:10px;padding-bottom:6px;border-bottom:1px solid #E9D5FF;}
/* 2026-08-17 사용자 요청("여행 크리에이터 참조해"): 정거장별 개별 번호/더보기를 없애고 크리에이터 루트처럼
   Day 전체를 한 덩어리(요약문+장소칩)로 보여줌. 더보기는 Day 단위 하나만 있고, 그 안에서 정거장 전체 내용이
   순서대로 펼쳐짐(.tripmoi-day-detail). 💡 팁 목록은 크리에이터에 없는 Tripmoi만의 추가 정보로 항상 노출. */
.tripmoi-day-desc{font-size:13px;line-height:1.6;color:var(--gray-700);margin-bottom:8px;}
/* 2026-08-17 후속 요청: Day 요약에 소요시간/거리/이동시간/이동방법 + 지도링크 노출(day.meta) */
.tripmoi-day-meta{display:flex;flex-wrap:wrap;gap:6px 14px;align-items:center;font-size:12px;color:var(--gray-600);margin-bottom:8px;padding:8px 10px;background:#FAF5FF;border-radius:8px;}
.tripmoi-day-meta-item{display:inline-flex;align-items:center;gap:4px;}
.tripmoi-day-meta-icon{font-size:12px;}
/* 2026-09-17: 일부 구간 대중교통 포함 Day에 "이 숫자는 도보 기준" 경고 표시 */
.tripmoi-day-meta-warning{font-size:11.5px;color:#92400e;background:#fffbeb;border:1px solid #fde68a;border-radius:8px;padding:6px 10px;margin-bottom:8px;line-height:1.5;}
/* 2026-09-17 후속: Day 전체가 아니라 실제 대중교통 구간(leg) 하나씩만 실시간 확인 버튼 노출 */
.tripmoi-leg-transit-list{display:flex;flex-wrap:wrap;gap:6px;margin-top:6px;}
.tripmoi-leg-transit-btn{background:#fff;color:#2563eb;border:1px solid #2563eb;border-radius:8px;padding:4px 10px;font-size:11.5px;font-weight:600;cursor:pointer;white-space:nowrap;}
.tripmoi-leg-transit-btn:hover{background:#eff6ff;}
/* 2026-08-25(#322): 도시 루트 탭(Tripmoi축)에도 "나만의 일정"과 같은 실시간 확인 버튼 적용 */
.tripmoi-day-meta-actions{margin-bottom:8px;display:flex;flex-wrap:wrap;gap:6px;}
.tripmoi-live-check-btn{background:#fff;color:#dc2626;border:1px solid #dc2626;border-radius:8px;padding:5px 12px;font-size:12px;font-weight:600;cursor:pointer;white-space:nowrap;}
.tripmoi-live-check-btn:hover{background:#fef2f2;}
/* 2026-08-17 재요청("전체 루트가 나와야 하는데 개별장소 맵만 있고 이동 경로가 없다"): 구글맵 다중경유지
   directions는 신뢰할 수 없어 제거했지만(위 참고), "전체 경로를 한눈에" 요구는 유효 — 앱 안에 Leaflet+OSM
   미니맵을 직접 그려서 번호 핀(1,2,3)+방문순서 점선을 보여줌(JS의 initTripmoiDayMaps 참고) */
.tripmoi-day-map{height:180px;border-radius:8px;overflow:hidden;border:1px solid #E9D5FF;background:#F3E8FE;}
.tripmoi-day-map-note{font-size:11px;color:var(--gray-500);margin-bottom:8px;}
/* 2026-08-18(사용자 요청): 마우스 휠 줌 + "원위치" 버튼 — 버튼을 지도 우상단에 겹쳐 띄움(Leaflet 기본 줌
   컨트롤은 좌상단이라 겹치지 않음). z-index는 Leaflet 컨트롤 레이어(보통 1000)보다 높게 둬서 항상 클릭 가능. */
.tripmoi-day-map-wrap{position:relative;margin-bottom:6px;}
.tripmoi-map-reset-btn{
  position:absolute;top:8px;right:8px;z-index:1000;
  background:#fff;border:1px solid var(--gray-300);border-radius:6px;padding:4px 9px;
  font-size:11px;font-weight:700;color:#7c3aed;cursor:pointer;box-shadow:0 1px 4px rgba(0,0,0,.18);
}
.tripmoi-map-reset-btn:hover{background:#F3E8FE;}
/* 2026-08-25(#328): itinerary.js의 "지도 크게 보기"와 같은 패턴 — .tripmoi-map-expand-btn 자체는
   이미 963행에 정의돼 있어(원위치 버튼 왼쪽에 나란히) 재사용, 여기서는 확장 시 높이만 키움. */
.tripmoi-day-map-wrap.expanded .tripmoi-day-map{height:420px;}
.tripmoi-goto-places-btn{
  display:inline-block;margin-top:4px;border:1px solid #E9D5FF;background:#fff;border-radius:999px;
  padding:6px 14px;font-size:12px;font-weight:700;color:#7c3aed;cursor:pointer;
}
.tripmoi-goto-places-btn:hover{background:#F3E8FE;}
.tripmoi-goto-route-btn{
  display:block;width:100%;margin-bottom:12px;border:1px solid #E9D5FF;background:#fff;border-radius:10px;
  padding:10px 14px;font-size:13px;font-weight:700;color:#7c3aed;cursor:pointer;text-align:center;
}
.tripmoi-goto-route-btn:hover{background:#F3E8FE;}
.tripmoi-map-pin-badge{width:22px;height:22px;border-radius:50%;background:#7c3aed;color:#fff;font-size:11px;font-weight:800;display:flex;align-items:center;justify-content:center;box-shadow:0 1px 4px rgba(0,0,0,.3);}
.tripmoi-expand-btn{border:none;background:none;color:#7c3aed;font-size:11px;font-weight:700;padding:0;cursor:pointer;text-decoration:underline;margin-bottom:8px;display:block;}
.tripmoi-tips-block{display:flex;gap:8px;margin-top:10px;padding-top:10px;border-top:1px solid #E9D5FF;}
.tripmoi-tips-label{flex:none;font-size:13px;}
.tripmoi-tips-list{list-style:none;padding:0;margin:0;font-size:12px;line-height:1.7;color:#6b21a8;}
.tripmoi-tips-list li{margin-bottom:2px;}
.tripmoi-day-detail{margin-top:10px;}
.tripmoi-stop-full{padding:8px 0;border-top:1px solid #E9D5FF;}
.tripmoi-stop-full:first-child{border-top:none;padding-top:0;}
.tripmoi-stop-name{font-size:13px;font-weight:700;margin-bottom:6px;}
/* 2026-08-17 재요청("맵에서 어디가 어딘지, 순서를 모르겠다"): 정거장 이름 옆에 개별 핀 링크 추가 */
.tripmoi-stop-pin{font-size:11px;font-weight:600;color:#7c3aed;text-decoration:none;margin-left:4px;}
.tripmoi-stop-pin:hover{text-decoration:underline;}
/* 2026-08-17 후속 요청: 정거장 상세를 반드시 봐야 하는 것/해야 하는 것/자세한 설명으로 구조화 */
.tripmoi-stop-sub{margin-bottom:8px;}
.tripmoi-stop-sub-label{font-size:11px;font-weight:700;color:#6b21a8;margin-bottom:3px;}
.tripmoi-stop-sub-list{list-style:none;padding:0;margin:0;font-size:12px;line-height:1.6;color:var(--gray-700);}
.tripmoi-stop-sub-list li{padding-left:12px;position:relative;}
.tripmoi-stop-sub-list li::before{content:'·';position:absolute;left:0;color:#a78bfa;}
.tripmoi-stop-narration{font-size:13px;line-height:1.6;color:var(--gray-700);margin-bottom:4px;}
.tripmoi-stop-transport{font-size:12px;color:var(--gray-500);}
/* 장소 칩을 눌러서 해당 정거장으로 이동+펼치기(2026-08-17 사용자 요청) — 기존 spot-chip 톤은 유지하고 클릭 가능함만 표시 */
.spot-chip--clickable{cursor:pointer;}
.spot-chip--clickable:hover{background:#F3E8FE;border-color:#E9D5FF;color:#6b21a8;}
.tripmoi-place{padding:8px 0;border-top:1px solid #E9D5FF;}
.tripmoi-place:first-of-type{border-top:none;padding-top:0;}
.tripmoi-place-name{font-size:13px;font-weight:700;display:flex;align-items:center;gap:6px;}
.tripmoi-place-cat{font-size:10px;font-weight:600;color:#6b21a8;background:#F3E8FE;border-radius:999px;padding:1px 8px;}
.tripmoi-place-summary{font-size:12px;color:var(--gray-700);margin-top:3px;line-height:1.5;}

/* 2026-08-24: "가볼 곳" 탭 카테고리 멀티선택 필터 — 크리에이터축 category-header/Tripmoi축 tripmoi-place-cat과
   같은 보라 톤(#6b21a8/#F3E8FE)을 active 상태에 재사용해 "이 색 = 카테고리"라는 시각적 일관성을 유지 */
.place-category-filter{display:flex;flex-wrap:wrap;gap:6px;padding:10px 20px;border-bottom:1px solid var(--gray-300);}
.category-chip{
  border:1px solid var(--gray-300);border-radius:999px;padding:5px 12px;font-size:12px;color:var(--gray-600);
  background:#fff;cursor:pointer;transition:all .12s;
}
.category-chip:hover{border-color:#C4B5FD;color:#6b21a8;}
.category-chip.active{background:#6b21a8;border-color:#6b21a8;color:#fff;font-weight:600;}
.category-chip-clear{border:none;background:none;color:var(--coral-dark);text-decoration:underline;}
.category-chip-clear:hover{color:var(--coral-dark);border:none;}

.qa-box{border-top:1px solid var(--gray-300);padding:14px 20px 18px;background:var(--gray-100);}
.qa-box .qa-title{font-size:13px;font-weight:700;margin-bottom:8px;}
.qa-log{max-height:170px;overflow-y:auto;margin-bottom:8px;}
.qa-msg{margin-bottom:10px;font-size:13px;line-height:1.5;}
.qa-msg.user{text-align:right;}
.qa-msg.user span{background:var(--ink);color:#fff;padding:8px 12px;border-radius:14px 14px 2px 14px;display:inline-block;max-width:85%;text-align:left;}
.qa-msg.bot span{background:#fff;border:1px solid var(--gray-300);padding:8px 12px;border-radius:14px 14px 14px 2px;display:inline-block;max-width:90%;}
.qa-input-row{display:flex;gap:8px;}
.qa-input-row input{
  flex:1;border:1px solid var(--gray-300);border-radius:999px;padding:9px 14px;font-size:13px;
}
.qa-input-row button{
  background:var(--coral);color:#fff;border:none;border-radius:999px;padding:0 16px;font-size:13px;font-weight:600;
}
.qa-hint{font-size:11px;color:var(--gray-500);margin-top:6px;}
.qa-history-btn{
  display:inline-flex;align-items:center;gap:4px;border:1px solid var(--gray-300);background:#fff;
  border-radius:999px;padding:5px 12px;font-size:12px;color:var(--gray-700);margin-bottom:10px;
}
.qa-history-btn:hover{border-color:var(--coral);color:var(--coral-dark);}
.qa-history-panel{max-height:240px;overflow-y:auto;margin-bottom:10px;display:flex;flex-direction:column;gap:8px;}
.qa-history-empty{font-size:12px;color:var(--gray-500);padding:8px 4px;}
.qa-history-item{background:#fff;border:1px solid var(--gray-300);border-radius:var(--radius-sm);padding:10px 12px;}
.qa-history-q{font-size:12px;font-weight:700;margin-bottom:4px;display:flex;align-items:center;gap:6px;flex-wrap:wrap;}
.qa-history-count{font-weight:400;font-size:10px;color:var(--coral-dark);background:#FFF0F3;border-radius:999px;padding:2px 8px;}
.qa-history-a{font-size:12px;color:var(--gray-700);line-height:1.5;margin-bottom:6px;}
.qa-history-time{font-size:10px;color:var(--gray-500);}
.qa-cached-note{font-size:11px;color:var(--gray-500);margin-bottom:4px;}

/* 3-15 사용자 경험 공유(여행자 후기) — AI 요약 탭과 톤을 다르게: 부드러운 크림색 배경, 손글씨 느낌의 카드 */
.review-form{background:#FFFBF2;border:1px solid #F0E4C8;border-radius:var(--radius-md);padding:14px;margin-bottom:16px;}
.review-form-title{font-size:13px;font-weight:700;margin-bottom:10px;}
.review-form-row{display:flex;gap:8px;margin-bottom:8px;}
.review-form-row input{flex:1;}
.review-form input,.review-form select,.review-form textarea{
  width:100%;border:1px solid var(--gray-300);border-radius:var(--radius-sm);padding:8px 10px;font-size:13px;
  margin-bottom:8px;font-family:inherit;box-sizing:border-box;
}
.review-form textarea{min-height:64px;resize:vertical;}
.review-form button{
  background:var(--ink);color:#fff;border:none;border-radius:999px;padding:8px 16px;font-size:13px;font-weight:600;
}
/* 2026-09-22(#720, 파워블로거 유입): 블로그 글 붙여넣기 토글+박스 — 본문 폼과 시각적으로 구분되게 살짝 옅은 톤.
   2026-09-22(#720 Fable 5 감사 L-1): 위 .review-form button(specificity 0,1,1)이 뒤에 와서 이 규칙들을
   덮어썼던 문제 — .review-form 접두사로 명시도를 맞춰 제대로 적용되게 함. */
.review-form .blog-import-toggle{margin-bottom:8px;}
.review-form .blog-import-toggle-btn{
  background:none;border:1px dashed var(--gray-300);border-radius:999px;padding:5px 12px;font-size:12px;
  color:var(--gray-600);cursor:pointer;width:auto;
}
.review-form .blog-import-box{background:#F6F6F2;border:1px solid var(--gray-300);border-radius:var(--radius-sm);padding:10px;margin-bottom:10px;}
.review-form .blog-import-box textarea{min-height:90px;}
.review-form .blog-import-box button{
  background:var(--ink);color:#fff;border:none;border-radius:999px;padding:6px 14px;font-size:12px;font-weight:600;
  cursor:pointer;width:auto;
}
.review-form .blog-import-box button:disabled{opacity:0.6;cursor:default;}
.review-list{display:flex;flex-direction:column;gap:10px;}
.review-card{border:1px solid #F0E4C8;background:#FFFDF8;border-radius:var(--radius-sm);padding:10px 12px;}
.review-top{display:flex;align-items:center;gap:6px;flex-wrap:wrap;margin-bottom:6px;}
.review-author{font-weight:700;font-size:13px;}
.review-cat{background:#F0E4C8;border-radius:999px;padding:2px 8px;font-size:11px;color:var(--gray-700);}
.review-visited{font-size:11px;color:var(--gray-500);}
.review-body{font-size:13px;color:var(--gray-700);line-height:1.5;white-space:pre-wrap;margin-bottom:8px;}
.review-actions{display:flex;gap:8px;}
.review-actions button{
  border:1px solid var(--gray-300);background:#fff;border-radius:999px;padding:4px 10px;font-size:11px;color:var(--gray-700);
}
.review-actions button:hover{border-color:var(--coral);color:var(--coral-dark);}
.review-report-btn:hover{border-color:#d33;color:#d33;}
.review-actions button.active{background:#FFF1F3;border-color:var(--coral);color:var(--coral-dark);font-weight:600;} /* Phase 2f: 저장됨 상태 */

/* Phase 1(#841~842, 2026-09-28): 커뮤니티 후기 사진 — 작성폼 첨부 UI + 카드 썸네일 그리드 */
.review-photo-attach{margin:8px 0;}
.review-photo-attach-label{display:inline-flex;align-items:center;gap:6px;font-size:12px;color:var(--gray-700);cursor:pointer;}
.review-photo-attach-label input[type="file"]{font-size:11px;max-width:200px;}
.review-photo-preview{display:flex;flex-wrap:wrap;gap:6px;margin-top:6px;}
.review-photo-preview-item{position:relative;width:56px;height:56px;border-radius:6px;overflow:hidden;border:1px solid var(--gray-300);}
.review-photo-preview-item img{width:100%;height:100%;object-fit:cover;display:block;}
.review-photo-preview-item button{position:absolute;top:0;right:0;background:rgba(0,0,0,.55);color:#fff;border:none;width:16px;height:16px;line-height:16px;font-size:10px;cursor:pointer;border-radius:0 0 0 4px;}
.review-photo-grid{display:flex;flex-wrap:wrap;gap:6px;margin:6px 0;}
.review-photo-thumb{position:relative;width:72px;height:72px;border-radius:6px;overflow:hidden;border:1px solid var(--gray-300);}
.review-photo-thumb img{width:100%;height:100%;object-fit:cover;display:block;}
.review-photo-report-btn{position:absolute;top:2px;right:2px;background:rgba(255,255,255,.85);border:none;border-radius:999px;width:18px;height:18px;font-size:10px;line-height:18px;cursor:pointer;}
.review-photo-report-btn:hover{background:#fff;}

/* 3-15 커뮤니티 확장(2026-08-15): 댓글 + 도시 스레드 — 기존 후기 톤(크림색 계열)을 그대로 이어감 */
.community-section-title{font-size:15px;font-weight:700;margin:20px 0 10px;padding-top:10px;border-top:1px solid var(--gray-300);}
.review-list + .community-section-title,
.thread-section-title{border-top:1px solid var(--gray-300);}
.comments-block{margin-top:8px;}
.comments-block.open{border-top:1px dashed #F0E4C8;padding-top:8px;}
.comments-list{display:flex;flex-direction:column;gap:6px;margin-bottom:8px;}
.comment-item{font-size:12px;background:#fff;border:1px solid #F0E4C8;border-radius:var(--radius-sm);padding:6px 10px;display:flex;align-items:center;gap:6px;}
.comment-item .comment-author{font-weight:700;flex:none;}
.comment-item .comment-body{color:var(--gray-700);flex:1;}
.comment-report-btn{border:none;background:none;color:var(--gray-500);font-size:11px;cursor:pointer;flex:none;padding:0 2px;}
.comment-report-btn:hover{color:#d33;}
.comment-empty{font-size:12px;margin:4px 0;}
.comment-form{display:flex;gap:6px;align-items:center;}
.comment-form input{
  border:1px solid var(--gray-300);border-radius:var(--radius-sm);padding:6px 8px;font-size:12px;font-family:inherit;flex:1;
}
.comment-form button{
  background:var(--ink);color:#fff;border:none;border-radius:999px;padding:6px 12px;font-size:12px;font-weight:600;flex:none;
}

/* Phase 2b (2026-08-22): 작성 폼에서 자유입력 author 대신 로그인 닉네임을 보여주거나, 비로그인 시 로그인 유도 문구 */
.write-as-nick{font-size:12px;color:var(--gray-700);white-space:nowrap;}
.write-as-nick.login-needed{color:var(--gray-500);}
.write-as-nick.login-needed a{color:var(--coral-dark);font-weight:700;text-decoration:none;}
.write-as-nick.login-needed a:hover{text-decoration:underline;}
.thread-list{display:flex;flex-direction:column;gap:10px;}
.thread-card{border:1px solid #F0E4C8;background:#FFFDF8;border-radius:var(--radius-sm);padding:10px 12px;}
.thread-card.expired{opacity:0.55;}
.thread-top{display:flex;align-items:center;gap:8px;margin-bottom:6px;flex-wrap:wrap;}
.thread-title{font-weight:700;font-size:13px;}
.thread-author{font-size:11px;color:var(--gray-500);margin-left:auto;}
.thread-body{font-size:13px;color:var(--gray-700);line-height:1.5;white-space:pre-wrap;margin-bottom:8px;}
.thread-expired-badge{font-size:10px;font-weight:700;border-radius:999px;padding:2px 8px;background:var(--gray-300);color:var(--gray-700);}
.thread-trip-date{font-size:11px;color:var(--gray-500);margin-bottom:6px;}
.thread-date-label{font-size:11px;color:var(--gray-500);margin:4px 0 3px;}

/* 경쟁사 분석(2026-08-15) 반영: 동행 사기 안내, 중복 스레드 안내, 전체 커뮤니티 링크 */
.safety-notice{background:#FFF8F5;border:1px solid #FFE1D6;border-radius:10px;padding:10px 12px;font-size:12px;color:var(--coral-dark);margin-bottom:10px;line-height:1.6;}
.similar-thread-hint{font-size:11px;color:var(--gray-500);margin:2px 0 8px;line-height:1.6;}
.similar-thread-chip{display:inline-block;background:var(--gray-100);border-radius:999px;padding:2px 8px;margin:2px 2px 0 0;}
.community-feed-link{display:inline-block;font-size:12px;font-weight:700;color:var(--coral-dark);text-decoration:none;margin-bottom:10px;}
.community-feed-link:hover{text-decoration:underline;}

/* 2026-08-24(사용자 요청): 커뮤니티 탭 상단 퀵네비 — 여행자 후기/같이 갈 사람·정보 구함/질문하기로 바로 이동.
   .axis-chip과 톤을 맞추되(같은 필박스 느낌) 축 색상 구분은 필요 없어 단색 하나로 통일. */
.community-quicknav{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:12px;}
.community-quicknav button{font:inherit;font-size:12px;font-weight:700;color:var(--coral-dark);background:#FFE9F0;border:1px solid transparent;border-radius:999px;padding:5px 12px;cursor:pointer;}
.community-quicknav button:hover{background:#FFD6E4;}

/* 3-16 체험/투어(2026-08-15, 로컬 프로토타입) */
.experience-list{display:flex;flex-direction:column;gap:10px;}
.experience-card{border:1px solid #F0E4C8;background:#FFFDF8;border-radius:var(--radius-sm);padding:10px 12px;}
.experience-top{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:6px;}
.experience-top b{font-size:13px;}
.provider-badge{font-size:10px;font-weight:700;border-radius:999px;padding:2px 8px;background:var(--gray-100);color:var(--gray-700);}
.provider-badge.affiliate{background:#E6F0FF;color:#2A5FD6;}
.provider-badge.agency{background:#FFE8D6;color:var(--coral-dark);}
.provider-badge.individual{background:#E8F7EA;color:#2A8C4A;}
.experience-meta{display:flex;flex-wrap:wrap;gap:6px;font-size:11px;color:var(--gray-500);margin-bottom:8px;align-items:center;}
.experience-book-link{display:inline-block;margin-top:6px;font-size:12px;font-weight:700;color:var(--coral-dark);text-decoration:none;}
.experience-book-link:hover{text-decoration:underline;}
.bookable-badge{font-size:10px;font-weight:700;border-radius:999px;padding:2px 8px;background:#E8F7EA;color:#2A8C4A;cursor:pointer;}
/* 2026-08-15 파이프라인 재설계: 여러 영상이 같은 장소/숙소를 언급했을 때(corroboration_count) 신뢰 신호로 노출 */
.corroboration-badge{font-size:10px;font-weight:700;border-radius:999px;padding:2px 8px;background:#EAF2FF;color:#2B6CB0;}

.modal-overlay{position:fixed;inset:0;background:rgba(0,0,0,0.5);z-index:2100;display:none;align-items:center;justify-content:center;}
.modal-overlay.open{display:flex;}
.modal{background:#fff;border-radius:var(--radius-lg);padding:26px;width:380px;max-width:90vw;}
.modal h3{margin:0 0 6px;font-size:18px;}
.modal p{font-size:13px;color:var(--gray-500);margin:0 0 16px;}
.modal input{width:100%;border:1px solid var(--gray-300);border-radius:var(--radius-sm);padding:10px 12px;font-size:14px;margin-bottom:14px;}
.modal .row{display:flex;gap:10px;}
.modal button{flex:1;border:none;border-radius:999px;padding:11px;font-size:14px;font-weight:600;}
.modal .cancel{background:var(--gray-100);color:var(--ink);}
.modal .submit{background:var(--coral);color:#fff;}
.modal .submit:disabled{opacity:0.6;cursor:default;}
.modal .status{font-size:12px;color:var(--gray-500);margin-top:12px;min-height:16px;}
.max-videos-label{display:block;font-size:12px;font-weight:600;color:var(--gray-700);margin:-6px 0 6px;}
.max-videos-hint{font-size:11px;color:var(--gray-500);margin:-8px 0 14px;line-height:1.5;}

/* spinner */
.spinner{
  width:16px;height:16px;border-radius:50%;flex:none;
  border:2px solid var(--gray-300);border-top-color:var(--coral);
  animation:spin .7s linear infinite;
}
.spinner.lg{width:28px;height:28px;border-width:3px;}
@keyframes spin{to{transform:rotate(360deg);}}
.center-loading{
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  gap:10px;padding:40px 20px;color:var(--gray-500);font-size:13px;
}

/* progress bar */
.progress-bar{
  width:100%;height:5px;border-radius:999px;background:var(--gray-300);overflow:hidden;margin-top:4px;
}
.progress-bar .fill{
  height:100%;background:var(--coral);border-radius:999px;transition:width .3s ease;
}
.channel-chip .progress-bar{width:70px;}

/* channel chip pending state */
.channel-chip.pending{opacity:1;background:#fff;border-color:var(--coral);}
.channel-chip .chip-main{display:flex;flex-direction:column;gap:2px;}
.channel-chip .chip-top{display:flex;align-items:center;gap:6px;}

/* 채널 관리 페이지(channels.html) — 세로 리스트 + 검색 */
.cm-summary{padding:20px 32px 4px;font-size:14px;color:var(--gray-500);}
.cm-summary b{color:var(--ink);}
.cm-list{display:flex;flex-direction:column;gap:10px;padding:16px 32px 40px;}
.cm-row{
  display:flex;align-items:center;gap:14px;border:1px solid var(--gray-300);border-radius:var(--radius-md);
  padding:12px 16px;background:#fff;
}
.cm-row.pending{border-color:var(--coral);}
.cm-thumb{width:48px;height:48px;border-radius:50%;object-fit:cover;background:var(--gray-100);flex:none;}
.cm-main{flex:1;min-width:0;display:flex;flex-direction:column;gap:4px;}
.cm-top{display:flex;align-items:center;gap:8px;}
.cm-name{font-weight:700;font-size:15px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.cm-added{font-size:11px;color:var(--gray-500);white-space:nowrap;}
.cm-count{font-size:12px;color:var(--gray-500);}
.cm-actions{display:flex;flex-direction:column;gap:6px;flex:none;}
.cm-actions button{
  border:1px solid var(--gray-300);border-radius:var(--radius-sm);background:#fff;
  font-size:12px;padding:6px 12px;color:var(--gray-700);white-space:nowrap;
}
.cm-actions button:hover:not(:disabled){background:var(--gray-100);}
.cm-actions button:disabled{opacity:0.5;cursor:default;}
.cm-actions .x:hover:not(:disabled){color:var(--coral-dark);border-color:var(--coral);}
@media (max-width: 720px){
  .cm-row{flex-wrap:wrap;}
  .cm-actions{flex-direction:row;}
}

/* toast */
.toast-container{
  position:fixed;bottom:20px;left:50%;transform:translateX(-50%);z-index:2200;
  display:flex;flex-direction:column;gap:8px;align-items:center;
  width:calc(100% - 32px);max-width:420px;
}
.toast{
  background:var(--ink);color:#fff;font-size:13px;padding:10px 18px;border-radius:16px;
  box-shadow:0 4px 14px rgba(0,0,0,0.25);opacity:0;transform:translateY(8px);
  transition:opacity .2s ease, transform .2s ease;
  white-space:normal;word-break:break-word;max-width:100%;text-align:center;
}
.toast.show{opacity:1;transform:translateY(0);}
.toast.error{background:var(--coral-dark);}

/* qa suggestions */
.qa-suggest{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:10px;}
.qa-suggest button{
  border:1px solid var(--gray-300);background:#fff;border-radius:999px;padding:6px 12px;
  font-size:12px;color:var(--gray-700);
}
.qa-suggest button:hover{border-color:var(--coral);color:var(--coral-dark);}

/* grid toolbar */
.grid-toolbar{
  display:flex;align-items:center;justify-content:space-between;padding:0 32px 12px;font-size:13px;color:var(--gray-500);
}
.grid-toolbar select{
  border:1px solid var(--gray-300);border-radius:var(--radius-sm);padding:6px 10px;font-size:12px;color:var(--ink);background:#fff;
}
.toolbar-selects{display:flex;align-items:center;gap:8px;}

/* 크리에이터 멀티선택 필터(검색 가능) */
.creator-filter{position:relative;}
.creator-filter-btn{
  border:1px solid var(--gray-300);border-radius:var(--radius-sm);padding:6px 10px;font-size:12px;color:var(--ink);
  background:#fff;max-width:220px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;display:inline-flex;align-items:center;gap:4px;
}
.creator-filter.active .creator-filter-btn{border-color:var(--coral);color:var(--coral-dark);}
.creator-filter-btn .caret{font-size:10px;color:var(--gray-500);}
/* 2026-09-16(Joseph 실사용 발견 — "필터가 화면안에 있는 경우도 있고 아닌경우도 있어"): 이 패널은
   #creatorFilter(top-toolbar 안, flex:none로 항상 툴바 맨 오른쪽에 붙음) 기준 absolute인데 left:0으로
   앵커돼 있었음 — 버튼이 화면 오른쪽 끝에 붙어 있으니 거기서 오른쪽으로 280px 더 펼쳐지면 뷰포트 밖으로
   잘림(창 너비·다른 툴바 요소 길이에 따라 버튼의 실제 x좌표가 바뀌어 "어떤 땐 보이고 어떤 땐 잘림"으로
   나타남). right:0으로 바꿔 버튼 오른쪽 끝 기준 왼쪽으로 펼치게 하고, 좁은 화면에서도 잘리지 않게
   max-width로 뷰포트 폭을 클램프. */
.creator-filter-panel{
  display:none;position:absolute;top:calc(100% + 6px);right:0;z-index:60;
  width:280px;max-width:calc(100vw - 32px);background:#fff;border:1px solid var(--gray-300);border-radius:var(--radius-sm);
  box-shadow:var(--shadow-card);padding:10px;
}
.creator-filter-panel.open{display:block;}
.creator-filter-search{
  width:100%;border:1px solid var(--gray-300);border-radius:var(--radius-sm);padding:6px 8px;font-size:12px;margin-bottom:8px;
}
.creator-filter-actions{display:flex;gap:8px;margin-bottom:8px;}
.creator-filter-actions button{
  border:none;background:none;color:var(--coral-dark);font-size:11px;padding:0;text-decoration:underline;
}
.creator-filter-list{max-height:220px;overflow-y:auto;display:flex;flex-direction:column;gap:2px;}
.creator-filter-item{
  display:flex;align-items:center;gap:8px;font-size:12px;color:var(--ink);padding:5px 4px;border-radius:6px;cursor:pointer;
}
.creator-filter-item:hover{background:var(--gray-100);}
.creator-filter-item input{flex:none;}
.creator-filter-item span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.creator-filter-empty{font-size:12px;color:var(--gray-500);padding:8px 4px;}

/* 3-17 4단계(2026-08-17, 사용자 요청): "영상" 탭 전용 사용자그룹(4축)+개별 계정 필터. 크리에이터 멀티선택
   필터(.creator-filter*)와 같은 버튼+드롭다운 패턴을 재사용하되, 위에 4축 그룹 탭을 추가로 얹은 구조. */
.video-filter{position:relative;margin:8px 0 14px;}
.video-filter .filter-btn{
  border:1px solid var(--gray-300);border-radius:var(--radius-sm);padding:6px 10px;font-size:12px;color:var(--ink);
  background:#fff;max-width:260px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;display:inline-flex;align-items:center;gap:4px;cursor:pointer;
}
.video-filter.active .filter-btn{border-color:var(--coral);color:var(--coral-dark);}
.video-filter .filter-btn .caret{font-size:10px;color:var(--gray-500);}
.video-filter-panel{
  display:none;position:absolute;top:calc(100% + 6px);left:0;z-index:60;
  width:280px;background:#fff;border:1px solid var(--gray-300);border-radius:var(--radius-sm);
  box-shadow:var(--shadow-card);padding:10px;
}
.video-filter-panel.open{display:block;}
.axis-tab-row{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:8px;}
.axis-tab-btn{border:1px solid var(--gray-300);background:#fff;border-radius:999px;padding:4px 10px;font-size:11px;font-weight:600;color:var(--gray-700);cursor:pointer;}
.axis-tab-btn.active{border-color:#7c3aed;color:#7c3aed;background:#F3E8FE;}
.axis-tab-btn--empty{opacity:.5;}
.video-filter-account-list{max-height:200px;overflow-y:auto;display:flex;flex-direction:column;gap:2px;}
.filter-clear-btn{
  margin-top:8px;border:none;background:none;color:var(--coral-dark);font-size:11px;padding:0;text-decoration:underline;cursor:pointer;
}
/* 3-17 14단계(2026-08-18, "필터 초기화 버튼이 상단으로 이동하고 사라지지 않게"): 패널 맨 위에 항상
   떠 있는 버전 — 아래쪽 margin으로 다음 요소와 간격을 두고, display:block으로 한 줄 전체를 차지함 */
.filter-clear-btn--top{
  display:block;margin-top:0;margin-bottom:8px;
}
.video-results-list{margin-top:4px;}
.searchbar .clear{border:none;background:none;color:var(--gray-500);font-size:14px;padding:0 4px;flex:none;}

/* 3-17 13단계(2026-08-17, "멀티 선택 및 채널서치도 추가해줘"): 루트 탭 크리에이터 축 채널 필터 —
   영상 탭 필터(.video-filter*)와 같은 버튼+드롭다운+검색+체크박스 패턴을 재사용. */
.creator-route-filter{position:relative;margin-bottom:10px;}
.creator-route-filter .filter-btn{
  border:1px solid var(--gray-300);border-radius:var(--radius-sm);padding:6px 10px;font-size:12px;color:var(--ink);
  background:#fff;max-width:260px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;display:inline-flex;align-items:center;gap:4px;cursor:pointer;
}
.creator-route-filter.active .filter-btn{border-color:#7c3aed;color:#7c3aed;}
.creator-route-filter .filter-btn .caret{font-size:10px;color:var(--gray-500);}
.creator-route-filter-panel{
  display:none;position:absolute;top:calc(100% + 6px);left:0;z-index:60;
  width:260px;background:#fff;border:1px solid var(--gray-300);border-radius:var(--radius-sm);
  box-shadow:var(--shadow-card);padding:10px;
}
.creator-route-filter-panel.open{display:block;}
.creator-route-channel-block{margin-bottom:14px;padding-bottom:12px;border-bottom:1px dashed var(--gray-200);}
.creator-route-channel-block:last-child{border-bottom:none;margin-bottom:0;padding-bottom:0;}
.creator-route-channel-label{font-size:12px;font-weight:700;color:#7c3aed;margin-bottom:6px;}

/* responsive */
@media (max-width: 720px){
  header{flex-wrap:wrap;gap:10px;padding:12px 16px;}
  .searchbar{order:3;width:100%;}
  .hero-wrap, .channel-strip, .section-label, .section-sub, .grid, .empty-state, .grid-toolbar{
    padding-left:16px;padding-right:16px;
  }
  .panel{width:100%;max-width:100%;}
  #map{height:280px;}
  .pc-cols{flex-direction:column;gap:18px;}
  .stat-row{flex-wrap:wrap;gap:12px 20px;}
}

/* ===== Phase 2a 회원 인증 (docs/phase2-auth-design.md) ===== */
#authArea{display:inline-flex;align-items:center;gap:8px;}
.auth-btn{background:#ff385c;color:#fff;border:none;border-radius:999px;padding:9px 16px;font-size:13.5px;font-weight:700;cursor:pointer;}
.auth-btn:hover{background:#e11d48;}
.auth-btn-ghost{background:#fff;color:var(--ink,#222);border:1px solid var(--gray-300,#d1d5db);font-weight:600;}
.auth-btn-ghost:hover{background:#f3f4f6;}
.auth-nick{font-size:13.5px;font-weight:700;color:var(--ink,#222);white-space:nowrap;}
.auth-modal{background:#fff;border-radius:16px;width:min(380px,calc(100vw - 40px));padding:22px;box-shadow:0 20px 50px rgba(0,0,0,.25);}
.auth-modal-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:14px;}
.auth-modal-head strong{font-size:18px;}
.auth-close{background:none;border:none;font-size:15px;cursor:pointer;color:#6b7280;}
.auth-field{margin-bottom:12px;}
.auth-field label{display:block;font-size:12.5px;font-weight:600;color:#374151;margin-bottom:5px;}
.auth-hint{font-weight:400;color:#9ca3af;}
.auth-field input{width:100%;box-sizing:border-box;padding:10px 12px;border:1px solid #d1d5db;border-radius:10px;font-size:14px;}
.auth-field input:focus{outline:none;border-color:#ff385c;}
/* 2026-08-25(#330-1): 리포트 모달의 유형 select/내용 textarea도 auth-field를 재사용 — 새 모달 클래스를
   따로 만들지 않고 기존 auth-modal 스타일을 그대로 입힘. */
.auth-field select,.auth-field textarea{width:100%;box-sizing:border-box;padding:10px 12px;border:1px solid #d1d5db;border-radius:10px;font-size:14px;font-family:inherit;resize:vertical;}
.auth-field select:focus,.auth-field textarea:focus{outline:none;border-color:#ff385c;}
/* 2026-08-25(#330-1b): 도시 상세 패널(.panel, z-index 2001)이 열려있을 때 이 모달들(코렉트미 제보창,
   로그인창)이 그 뒤에 가려지는 걸 막기 위해 .modal-overlay(2100)와 같은 값을 씀 — 얼마 전 케어미 패널이
   같은 이유(z-index가 패널보다 낮음)로 안 보이던 버그(#330 changelog 참고)를 겪은 뒤라, authModalOverlay도
   원래 1500(패널보다 낮음)이던 걸 여기서 함께 바로잡음 — 코렉트미가 비로그인 시 이 로그인창을 띄우므로. */
#reportModalOverlay,#authModalOverlay,#claimModalOverlay,#claimHelpModalOverlay,#myCheckinPhotosOverlay{position:fixed;inset:0;background:rgba(0,0,0,.45);z-index:2100;display:flex;align-items:center;justify-content:center;}
.claim-help-link{font-size:11.5px;color:#6b7280;text-decoration:underline;margin-left:6px;white-space:nowrap;}
.claim-help-link:hover{color:var(--coral-dark);}
/* 가이드미(#guideme-btn, 우하단, 구 케어미)와 겹치지 않게 반대쪽(좌하단)에 배치, 색은 구분되게 인디고 계열로. */
#correctme-btn{position:fixed;left:20px;bottom:20px;z-index:2050;background:#4f46e5;color:#fff;border:none;border-radius:999px;padding:12px 18px;font-size:15px;font-weight:700;cursor:pointer;box-shadow:0 4px 14px rgba(0,0,0,.25);}
#correctme-btn:hover{background:#4338ca;}
/* 2026-09-19(유럽중심 런칭 준비 ② 대안2): 상시 BETA 배지 — 진입 유도 카드는 평생 1회만 뜨고 지나가지만,
   이 배지는 버튼에 항상 붙어있어서 언제든 "이 서비스는 베타"라는 걸 알 수 있음. */
.correctme-beta-badge{display:inline-block;margin-left:6px;background:rgba(255,255,255,.28);color:#fff;font-size:10px;font-weight:800;letter-spacing:.03em;border-radius:999px;padding:2px 7px;vertical-align:middle;}
/* 2026-09-19(유럽중심 런칭 준비 ②): 코렉트미 진입 유도 카드 — 3초 자동소멸되는 기본 toast와 달리
   버튼(즉시 신고 모달 오픈)이 있어 사용자가 직접 닫거나 클릭할 때까지 남아있어야 함. 항상 떠 있는
   #correctme-btn 바로 위에 붙여 "이 버튼이 이거다"를 시각적으로 연결. */
.correctme-nudge{position:fixed;left:20px;bottom:78px;z-index:2050;background:#fff;color:#1f2937;
  border:1px solid #e5e7eb;border-radius:14px;padding:12px 14px;box-shadow:0 8px 24px rgba(0,0,0,.18);
  max-width:260px;font-size:13px;line-height:1.5;opacity:0;transform:translateY(8px);
  transition:opacity .2s ease, transform .2s ease;}
.correctme-nudge.show{opacity:1;transform:translateY(0);}
.correctme-nudge-close{position:absolute;top:4px;right:6px;border:none;background:transparent;color:#9ca3af;font-size:13px;cursor:pointer;padding:2px 4px;}
.correctme-nudge-cta{display:block;margin-top:8px;border:none;background:#4f46e5;color:#fff;border-radius:999px;padding:6px 12px;font-size:12.5px;font-weight:700;cursor:pointer;}
.correctme-nudge-cta:hover{background:#4338ca;}
.auth-error{color:#dc2626;font-size:12.5px;min-height:16px;margin-bottom:8px;}
/* 2026-08-26(비밀번호 재설정): 로그인 모드에서만 보이는 링크 — auth-switch보다 위, 비밀번호 필드 바로 아래. */
.auth-forgot-link{text-align:right;font-size:12px;margin:-4px 0 10px;}
.auth-forgot-link a{color:#6b7280;text-decoration:none;}
.auth-forgot-link a:hover{text-decoration:underline;}
/* 2026-08-25(완전공개 준비): 가입 시 약관/개인정보처리방침 고지 — 필수 체크박스 대신 문구+링크 방식 */
.auth-consent{font-size:11.5px;color:#9ca3af;text-align:center;margin-bottom:10px;line-height:1.5;}
.auth-consent a{color:#6b7280;text-decoration:underline;}
.auth-submit{width:100%;padding:11px;font-size:14.5px;}
.auth-switch{text-align:center;font-size:12.5px;color:#6b7280;margin-top:12px;}
.auth-switch a{color:#ff385c;font-weight:600;text-decoration:none;}

/* ===== 가이드미(GuideMe, 구 케어미/CareMe) — Knowledge Care 프로토타입 (master-plan 3-19, ADR-0002,
   2026-08-25 리네임: 원어민 어감 재검토 결과 "care me"는 영어 문법이 성립하지 않는 조어라 "guide me"로 교체,
   기능/API/클래스 구조는 그대로) ===== */
/* 2026-08-25(#330 버그수정): z-index가 도시 상세 패널(.panel, 2001)보다 낮아서(원래 1200) 패널이 열려있는
   동안(=루트 탭이 보이는 동안) "가이드미로 주변 보기"를 눌러도 patch.hidden=false는 실행되지만 패널이 .panel
   뒤에 가려져 아무 반응이 없는 것처럼 보였음(Joseph 피드백 "케어미 클릭안되는데"로 발견) — 패널이 닫혀있을
   때만 쓰던 기능이라 지금까지 드러나지 않다가, #328/#329에서 루트 탭 안에서 호출하게 되며 100% 재현됨.
   .modal-overlay(2100)보다는 낮게, .panel(2001)보다는 확실히 높게 잡음. */
#guideme-btn{position:fixed;right:20px;bottom:20px;z-index:2050;background:#ff385c;color:#fff;border:none;border-radius:999px;padding:12px 18px;font-size:15px;font-weight:700;cursor:pointer;box-shadow:0 4px 14px rgba(0,0,0,.25);}
#guideme-btn:hover{background:#e11d48;}
#guideme-panel{position:fixed;right:20px;bottom:74px;z-index:2050;width:min(360px,calc(100vw - 40px));max-height:min(70vh,560px);overflow-y:auto;background:#fff;border:1px solid #e5e7eb;border-radius:14px;box-shadow:0 10px 30px rgba(0,0,0,.2);padding:14px;}
.guideme-head{display:flex;align-items:center;gap:8px;margin-bottom:10px;}
.guideme-head strong{font-size:15px;}
.guideme-proto{font-size:11px;color:#6b7280;background:#f3f4f6;border-radius:6px;padding:2px 6px;}
.guideme-close{margin-left:auto;background:none;border:none;font-size:14px;cursor:pointer;color:#6b7280;}
.guideme-controls{display:flex;flex-wrap:wrap;gap:6px;align-items:center;margin-bottom:8px;font-size:13px;}
.guideme-controls select{margin-left:4px;padding:3px 6px;border:1px solid #d1d5db;border-radius:6px;}
.guideme-controls button{background:#111827;color:#fff;border:none;border-radius:8px;padding:6px 10px;font-size:12.5px;cursor:pointer;}
.guideme-controls button:hover{background:#374151;}
.guideme-status{font-size:12.5px;color:#6b7280;margin-bottom:8px;line-height:1.5;}
.guideme-item{border:1px solid #e5e7eb;border-radius:10px;padding:10px 12px;margin-bottom:8px;cursor:pointer;}
.guideme-item:hover{border-color:#ff385c;}
.guideme-item-head{display:flex;align-items:center;gap:6px;}
.guideme-item-name{font-weight:700;font-size:14px;}
.guideme-item-cat{font-size:11px;color:#0369a1;background:#e0f2fe;border-radius:6px;padding:1px 6px;}
.guideme-item-dist{margin-left:auto;font-size:12px;color:#6b7280;font-weight:600;}
.guideme-item-summary{font-size:12.5px;color:#374151;margin-top:4px;line-height:1.5;}
.guideme-item-detail{font-size:12.5px;color:#374151;margin-top:6px;border-top:1px dashed #e5e7eb;padding-top:6px;line-height:1.6;}
.guideme-item-detail p{margin:4px 0;}
.guideme-item-city{color:#6b7280;}

/* 2026-09-21(§3-20 Phase 2): 체크인 버튼(다녀왔어요/없어졌어요/좋아요) */
.guideme-item-checkin{display:flex;gap:6px;margin-top:6px;}
.checkin-btn{display:inline-flex;align-items:center;gap:4px;font-size:11px;padding:3px 8px;border-radius:999px;border:1px solid #e5e7eb;background:#f9fafb;color:#374151;cursor:pointer;}
.checkin-btn:hover{background:#f3f4f6;}
.checkin-btn:disabled{opacity:.6;cursor:default;}
.checkin-btn-active{background:#ec489915;border-color:#ec4899;color:#ec4899;}
.checkin-count{font-size:10px;color:#9ca3af;font-variant-numeric:tabular-nums;}
.checkin-btn-active .checkin-count{color:#ec4899;}

/* 2026-09-21(§3-21 Phase A): 체크인 인증사진 추가 버튼 — 신뢰도를 위해 다녀왔어요/없어졌어요에만 노출 */
.checkin-btn-wrap{display:inline-flex;align-items:center;gap:3px;}
.checkin-photo-btn{display:inline-flex;align-items:center;justify-content:center;width:22px;height:22px;border-radius:999px;border:1px dashed #d1d5db;background:#fff;color:#6b7280;font-size:11px;cursor:pointer;}
.checkin-photo-btn:hover{border-color:#ec4899;color:#ec4899;}
.checkin-photo-status{font-size:10px;color:#9ca3af;white-space:nowrap;}
.checkin-verified-badge{font-size:10px;font-weight:700;color:#1e7a34;background:#e6f4ea;border-radius:999px;padding:2px 7px;white-space:nowrap;}

/* ===== /profile.html 기본형 (Phase 2f, master-plan 3-15) ===== */
.profile-root{max-width:1120px;margin:0 auto;padding:24px 20px 60px;}

/* 2026-09-18(Joseph 요청 "사이드 메뉴 만들어줘"): 섹션이 6개까지 늘어나 왼쪽 고정 내비 추가.
   모바일(≤760px)에서는 세로 고정 내비 대신 상단에 가로 스크롤 칩 목록으로 전환. */
.profile-layout{display:flex;align-items:flex-start;gap:32px;}
.profile-sidenav{position:sticky;top:76px;flex-shrink:0;width:180px;display:flex;flex-direction:column;gap:2px;}
.profile-sidenav a{padding:8px 12px;border-radius:8px;font-size:13px;color:var(--gray-600);text-decoration:none;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.profile-sidenav a:hover{background:var(--gray-50);}
.profile-sidenav a.active{background:#FAF5FF;color:var(--coral);font-weight:700;}
.profile-main{flex:1;min-width:0;}
.profile-section{scroll-margin-top:76px;}
@media (max-width:760px){
  .profile-layout{flex-direction:column;gap:0;}
  .profile-sidenav{position:static;width:100%;flex-direction:row;overflow-x:auto;gap:6px;padding-bottom:10px;margin-bottom:8px;border-bottom:1px solid #e5e7eb;}
  .profile-sidenav a{flex-shrink:0;background:var(--gray-50);}
  .profile-sidenav a.active{background:#FAF5FF;}
}
.profile-empty{padding:60px 20px;text-align:center;color:#6b7280;}
.profile-header{border-bottom:1px solid #e5e7eb;padding-bottom:16px;margin-bottom:24px;}
.profile-header h2{margin:0 0 8px;font-size:24px;}
.profile-meta{display:flex;flex-wrap:wrap;align-items:center;gap:10px;font-size:13px;color:#6b7280;}
.profile-joined{color:#6b7280;}
.profile-owner-note{color:var(--coral-dark,#e11d48);font-weight:600;}
.profile-power-badge{display:inline-block;font-size:12px;font-weight:700;background:#FFE8D6;color:var(--coral-dark,#e11d48);border-radius:999px;padding:2px 10px;vertical-align:middle;margin-left:4px;}
.profile-follow-counts{color:#6b7280;} /* Phase 2h(2026-08-23) */
/* 2026-09-22(#721, 파워 여행자 "여행 이력 카드" A안): profile-power-badge(뱃지)와는 별개 — 헤더 아래
   섹션 목록 위에 요약 통계 카드로 얹는다. */
.profile-power-card{background:linear-gradient(135deg,#FFF3EA,#FFE8D6);border-radius:14px;padding:16px 20px;margin-bottom:24px;}
.profile-power-card-title{font-weight:700;font-size:14px;color:var(--coral-dark,#e11d48);margin-bottom:12px;}
.profile-power-card-stats{display:flex;flex-wrap:wrap;gap:20px;}
.profile-power-stat{display:flex;flex-direction:column;align-items:flex-start;}
.profile-power-stat strong{font-size:20px;line-height:1.2;color:#1f2937;}
.profile-power-stat span{font-size:12px;color:#6b7280;margin-top:2px;}
.profile-power-card-since{margin-top:12px;font-size:12px;color:#6b7280;}
/* 2026-09-22(파워 여행자 발견 페이지 노출범위 설정): 카드 안 얇은 구분선+체크박스 한 줄 — 새 섹션을 따로
   안 만들고 카드 맨 아래에 자연스럽게 붙임(본인만 보이는 항목이라 굳이 눈에 띄게 할 필요 없음). */
.profile-power-visibility-toggle{display:flex;align-items:center;gap:6px;margin-top:14px;padding-top:12px;border-top:1px solid rgba(0,0,0,.06);font-size:12px;color:#6b7280;cursor:pointer;}
.profile-power-visibility-toggle input{cursor:pointer;}
.feed-list{display:flex;flex-direction:column;gap:10px;}
.feed-city-link{display:inline-block;font-size:12px;color:var(--gray-500);text-decoration:none;}
.feed-city-link:hover{text-decoration:underline;}
.feed-load-more{display:block;margin:16px auto 0;}
.profile-section{margin-bottom:32px;}
.profile-section-title{font-size:16px;font-weight:700;margin-bottom:12px;}

/* 2026-09-18(내 사용량 섹션): plan_limits 기반 kind가 몇 개든 늘어나도 깨지지 않는 표 레이아웃 */
.usage-reset-note{font-size:12px;margin:0 0 10px;}
.usage-table{width:100%;border-collapse:collapse;font-size:13px;}
.usage-table th{text-align:left;font-size:11.5px;color:var(--gray-500);font-weight:600;padding:0 8px 8px 0;border-bottom:1px solid #e5e7eb;}
.usage-table td{padding:10px 8px 10px 0;border-bottom:1px solid #f3f4f6;vertical-align:middle;}
.usage-table tr:last-child td{border-bottom:none;}
.usage-bar-track{width:100%;max-width:160px;height:6px;background:#f3f4f6;border-radius:4px;overflow:hidden;margin-bottom:4px;}
.usage-bar-fill{height:100%;background:#7c3aed;border-radius:4px;}
.usage-bar-fill.full{background:#dc2626;}
.usage-count{font-size:11.5px;color:var(--gray-500);}
.usage-remaining-zero{color:#dc2626;font-weight:600;}
.usage-row-full td:first-child{font-weight:600;}
.usage-upgrade-hint{margin-top:10px;font-size:12px;}

/* 2026-09-18(등급 안내/업그레이드 문의): 결제(Stripe) 미구현 상태라 실제 결제는 없고, 문의 접수만 — 위
   .usage-table을 재사용하되(plan-compare-table) 현재 등급 행 강조 + 문의 폼 스타일만 추가. */
.plan-row-current{background:#faf5ff;}
.plan-current-badge{display:inline-block;font-size:10.5px;font-weight:700;color:#7c3aed;background:#f3e8ff;border-radius:999px;padding:2px 8px;margin-left:6px;vertical-align:middle;}
.plan-inquiry-pending{font-size:13px;background:#f3e8ff;border-radius:8px;padding:10px 12px;margin-top:6px;}
#planInquiryForm textarea{width:100%;resize:vertical;font:inherit;padding:8px 10px;border:1px solid #d1d5db;border-radius:8px;}
#planInquiryForm select{width:100%;padding:8px 10px;border:1px solid #d1d5db;border-radius:8px;font:inherit;}

/* 2026-09-18(기능별 한도 비교표, Joseph 질문 "등급에 따라 사용가능한 것이 무엇인지" 반영): 위 plan-compare-table과
   같은 .usage-table 톤을 쓰되, 내 등급 열 강조 + "이용불가" 셀만 톤다운 처리. */
.plan-limits-table th.plan-col-current,.plan-limits-table td.plan-col-current{background:#faf5ff;}
.plan-limit-unavailable{color:#9ca3af;}

.checkin-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:12px;}
.checkin-card{border:1px solid #e5e7eb;border-radius:12px;overflow:hidden;background:#fff;transition:box-shadow .15s;}
.checkin-card:hover{box-shadow:0 4px 14px rgba(0,0,0,.1);}
.checkin-card-link{display:block;text-decoration:none;color:inherit;}
.checkin-card img{width:100%;height:100px;object-fit:cover;display:block;}
.checkin-card-noimg{width:100%;height:100px;display:flex;align-items:center;justify-content:center;font-size:28px;background:#f3f4f6;}
.checkin-card-body{padding:10px 12px;}
.checkin-card-name{font-weight:700;font-size:14px;}
.checkin-card-country{font-size:12px;color:#6b7280;margin-top:2px;}
.checkin-card-date{font-size:11.5px;color:#9ca3af;margin-top:6px;}

.saved-list{display:flex;flex-direction:column;gap:8px;}
.saved-item-card{display:flex;align-items:flex-start;gap:10px;border:1px solid #e5e7eb;border-radius:10px;padding:10px 12px;background:#fff;transition:box-shadow .15s;}
.saved-item-card:hover{box-shadow:0 4px 14px rgba(0,0,0,.1);}
.saved-item-link{flex:1;min-width:0;display:flex;align-items:flex-start;gap:10px;text-decoration:none;color:inherit;}
.saved-item-icon{font-size:18px;line-height:1.4;}
.saved-item-body{flex:1;min-width:0;}
.saved-item-top{display:flex;align-items:center;gap:8px;font-size:11.5px;}
.saved-item-type{color:#0369a1;background:#e0f2fe;border-radius:6px;padding:1px 6px;font-weight:600;}
.saved-item-city{color:#6b7280;}
.saved-item-title{font-size:14px;font-weight:600;margin-top:4px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.saved-item-date{font-size:11.5px;color:#9ca3af;margin-top:4px;}

/* #330-4(2026-08-25) 코렉트미 "내가 보낸 리포트" — saved-item-card와 같은 카드 관례 재사용 */
.report-list{display:flex;flex-direction:column;gap:8px;}
.report-card{border:1px solid #e5e7eb;border-radius:10px;padding:10px 12px;background:#fff;}
.report-card-top{display:flex;align-items:center;gap:8px;font-size:11.5px;}
.report-card-type{color:#0369a1;background:#e0f2fe;border-radius:6px;padding:1px 6px;font-weight:600;}
.report-card-status{border-radius:6px;padding:1px 6px;font-weight:600;color:#6b7280;background:#f3f4f6;}
.report-card-status.status-resolved{color:#15803d;background:#dcfce7;}
.report-card-status.status-in_progress{color:#a16207;background:#fef3c7;}
.report-card-status.status-rejected,.report-card-status.status-duplicate{color:#9ca3af;background:#f3f4f6;}
.report-card-title{font-size:14px;font-weight:600;margin-top:6px;}
.report-card-date{font-size:11.5px;color:#9ca3af;margin-top:4px;}
.report-card-resolution{margin-top:8px;font-size:12.5px;color:#166534;background:#f0fdf4;border-radius:8px;padding:8px 10px;line-height:1.5;}
.report-card-resolution.status-rejected{color:#6b7280;background:#f3f4f6;}
.report-card-resolution.status-reviewing{color:#374151;background:#f3f4f6;}

.item-owner-actions{display:flex;flex-direction:column;gap:4px;align-items:flex-end;padding:10px 12px 10px 0;}
.item-owner-actions select{font-size:11.5px;padding:2px 4px;border:1px solid #d1d5db;border-radius:6px;}
.item-owner-actions button{font-size:11px;background:none;border:1px solid #d1d5db;border-radius:6px;padding:2px 6px;cursor:pointer;color:#6b7280;white-space:nowrap;}
.item-owner-actions button:hover{border-color:#ff385c;color:#ff385c;}

/* #298(2026-08-25) 나만의 여행일정 빌더 — profile-root(위쪽)와 같은 레이아웃 관례를 그대로 재사용 */
.itinerary-root{max-width:920px;margin:0 auto;padding:24px 20px 60px;}
.itinerary-empty{max-width:920px;margin:60px auto;text-align:center;color:#6b7280;}
.itinerary-list-header{margin-bottom:20px;}
.itinerary-list-header h2{margin:0 0 6px;font-size:24px;}

.itinerary-create-panel{border:1px solid #e5e7eb;border-radius:12px;padding:16px 18px;margin-bottom:28px;background:#FAF5FF;}
.itinerary-create-panel h3{margin:0 0 12px;font-size:16px;}
.itinerary-form-row{display:flex;align-items:center;gap:10px;margin-bottom:10px;flex-wrap:wrap;}
.itinerary-form-row label{font-size:13px;font-weight:600;color:var(--gray-700);min-width:96px;}
.itinerary-form-row select,.itinerary-form-row input[type="text"],.itinerary-form-row input[type="number"],.itinerary-form-row textarea{
  border:1px solid var(--gray-300);border-radius:8px;padding:7px 10px;font-size:13px;flex:1;min-width:160px;font-family:inherit;resize:vertical;
}
.itinerary-city-search{position:relative;flex:1;min-width:160px;}
.itinerary-city-search input[type="text"]{width:100%;}
.itinerary-source-options{display:flex;flex-direction:column;gap:6px;font-size:13px;}
.itinerary-source-options label{min-width:0;font-weight:400;display:flex;align-items:center;gap:6px;}

/* 2026-09-17(Joseph 리뷰 요청 반영 — 개선 1/2/6): 루트 없음 경고 + 자유조합 안내 문구 */
.itinerary-route-warning{font-size:12.5px;color:#b91c1c;background:#fef2f2;border:1px solid #fecaca;border-radius:8px;padding:8px 10px;margin:-2px 0 10px;}
.itinerary-freebuild-hint{margin:-2px 0 10px;}

/* 2026-09-17(개선 5): 목록 정렬/도시 필터 컨트롤 */
.itinerary-list-controls{display:flex;gap:8px;margin-bottom:10px;}
.itinerary-list-controls select{border:1px solid var(--gray-300);border-radius:8px;padding:6px 10px;font-size:12.5px;font-family:inherit;}

/* 2026-08-25(#316): 직접입력 폼 보완 — 주소/지도찾기/카테고리 필수 표시/매칭실패 경고 */
.itinerary-custom-place-hint{font-size:11.5px;color:#6b7280;margin:-4px 0 10px;line-height:1.5;}
.itinerary-optional-tag{font-weight:400;color:#9ca3af;font-size:11px;}
.itinerary-required-tag{font-weight:600;color:#ff385c;font-size:11px;}
.itinerary-category-hint{width:100%;font-size:11px;color:#8a8a8a;margin-top:4px;line-height:1.5;}
.itinerary-custom-place-warning{margin-top:10px;padding:10px 12px;border:1px solid #fcd34d;background:#fffbeb;border-radius:8px;font-size:12.5px;color:#92400e;line-height:1.6;}
.itinerary-custom-place-warning .itinerary-mini-btn{margin-top:8px;background:#fff;}

/* 2026-08-25(#318): 이동거리/이동시간 자동계산 + 일정 최적화 버튼 */
.itinerary-day-stats{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:8px;padding:10px 12px;background:#f9fafb;border:1px solid #e5e7eb;border-radius:10px;margin:10px 0 4px;}
.itinerary-day-stats-items{display:flex;gap:14px;flex-wrap:wrap;font-size:13px;color:#374151;}
.itinerary-day-stats-actions{display:flex;gap:8px;flex-wrap:wrap;}
.itinerary-optimize-btn{background:#7c3aed;color:#fff;border:none;border-radius:8px;padding:6px 12px;font-size:12.5px;font-weight:600;cursor:pointer;white-space:nowrap;}
.itinerary-optimize-btn:hover{background:#6d28d9;}
.itinerary-live-check-btn{background:#fff;color:#dc2626;border:1px solid #dc2626;border-radius:8px;padding:6px 12px;font-size:12.5px;font-weight:600;cursor:pointer;white-space:nowrap;}
.itinerary-live-check-btn:hover{background:#fef2f2;}
.itinerary-accurate-btn{background:#fff;color:#6b7280;border:1px dashed #9ca3af;border-radius:8px;padding:6px 12px;font-size:12.5px;font-weight:600;cursor:pointer;white-space:nowrap;}
.itinerary-accurate-btn:hover{background:#f3f4f6;}
.itinerary-day-stats-note{font-size:11px;color:#9ca3af;margin:0 0 10px;line-height:1.5;}

.itinerary-list{display:flex;flex-direction:column;gap:10px;}
.itinerary-card{display:flex;align-items:stretch;border:1px solid #e5e7eb;border-radius:12px;overflow:hidden;background:#fff;transition:box-shadow .15s;position:relative;}
.itinerary-card:hover{box-shadow:0 4px 14px rgba(0,0,0,.1);}
.itinerary-card-link{flex:1;min-width:0;display:flex;align-items:stretch;text-decoration:none;color:inherit;}
/* 2026-09-17(개선 4): 목록 카드 빠른 삭제 버튼 — 카드 링크 바깥 형제 요소라 클릭해도 상세 페이지로 안 넘어감 */
.itinerary-card-delete{position:absolute;top:8px;right:8px;width:28px;height:28px;border:none;border-radius:8px;background:rgba(255,255,255,.9);cursor:pointer;font-size:14px;line-height:1;box-shadow:0 1px 4px rgba(0,0,0,.15);}
.itinerary-card-delete:hover{background:#fef2f2;}
.itinerary-card-link img{width:96px;height:96px;object-fit:cover;display:block;flex-shrink:0;}
.itinerary-card-noimg{width:96px;height:96px;display:flex;align-items:center;justify-content:center;font-size:28px;background:#f3f4f6;flex-shrink:0;}
.itinerary-card-body{padding:12px 14px;}
.itinerary-card-title{font-weight:700;font-size:14.5px;}
.itinerary-card-meta{font-size:12.5px;color:#6b7280;margin-top:4px;}
.itinerary-card-date{font-size:11.5px;color:#9ca3af;margin-top:6px;}

.itinerary-detail-header{margin-bottom:16px;}
.itinerary-back-link{font-size:13px;color:#6b7280;display:inline-block;margin-bottom:10px;}
.itinerary-back-link:hover{color:#6b21a8;}
.itinerary-detail-title-row{display:flex;align-items:center;gap:10px;}
.itinerary-detail-title-row h2{margin:0;font-size:22px;}
.itinerary-title-input{flex:1;font-size:20px;font-weight:700;border:1px solid transparent;border-radius:8px;padding:6px 8px;background:transparent;}
.itinerary-title-input:hover,.itinerary-title-input:focus{border-color:var(--gray-300);background:#fff;outline:none;}
.itinerary-delete-btn{background:none;border:1px solid #e5e7eb;border-radius:8px;padding:6px 12px;font-size:12.5px;color:#9ca3af;white-space:nowrap;}
.itinerary-delete-btn:hover{border-color:#ff385c;color:#ff385c;}
.itinerary-detail-meta{font-size:13px;color:#6b7280;margin-top:4px;}
.itinerary-share-row{display:flex;align-items:center;gap:8px;margin-top:10px;flex-wrap:wrap;}
.itinerary-share-row label{font-size:12.5px;font-weight:600;color:var(--gray-700);}
.itinerary-share-row select{border:1px solid var(--gray-300);border-radius:8px;padding:5px 8px;font-size:12.5px;}

/* 2026-09-12(P4, 게스트 체험 모드) — 임시 저장 안내 배너/재개 배너/직접입력 비활성 안내 */
.itinerary-guest-banner{background:#FEF3C7;border:1px solid #FDE68A;border-radius:10px;padding:10px 12px;font-size:12.5px;color:#92400E;line-height:1.6;}
.itinerary-guest-resume-banner{background:#EFF6FF;border:1px solid #BFDBFE;border-radius:10px;padding:10px 12px;margin-bottom:16px;font-size:13px;color:#1e40af;}
.itinerary-guest-resume-banner a{color:#1d4ed8;font-weight:600;}
.itinerary-guest-custom-note{font-size:12px;padding:10px 2px 2px;}
.itinerary-empty-note{margin-top:18px;padding:14px 16px;border:1px dashed var(--gray-300);border-radius:10px;font-size:13px;color:#6b7280;display:flex;align-items:center;gap:10px;flex-wrap:wrap;}

.itinerary-day-tabs{display:flex;gap:6px;overflow-x:auto;padding:12px 0;border-bottom:1px solid var(--gray-300);margin-bottom:14px;}
.itinerary-day-tab{flex-shrink:0;background:#fff;border:1px solid var(--gray-300);border-radius:999px;padding:6px 14px;font-size:13px;color:var(--gray-700);}
.itinerary-day-tab:hover{border-color:#C4B5FD;color:#6b21a8;}
.itinerary-day-tab.active{background:#6b21a8;border-color:#6b21a8;color:#fff;font-weight:600;}

.itinerary-day-map-wrap{position:relative;margin-bottom:16px;}

.itinerary-stops-list{display:flex;flex-direction:column;gap:10px;margin-bottom:20px;}
.itinerary-stop-row{display:flex;align-items:flex-start;gap:10px;border:1px solid #e5e7eb;border-radius:10px;padding:12px 14px;background:#fff;}
.itinerary-stop-num{flex-shrink:0;width:24px;height:24px;border-radius:50%;background:#6b21a8;color:#fff;font-size:12px;font-weight:700;display:flex;align-items:center;justify-content:center;}
.itinerary-stop-body{flex:1;min-width:0;}
.itinerary-stop-name{font-weight:700;font-size:14px;display:flex;align-items:center;gap:6px;flex-wrap:wrap;}
.itinerary-stop-desc{font-size:12.5px;color:#6b7280;margin-top:4px;}
.itinerary-axis-badge{font-size:10.5px;background:var(--gray-100);color:var(--gray-500);border-radius:999px;padding:2px 8px;}
.itinerary-stop-note-row{display:flex;gap:6px;margin-top:8px;}
.itinerary-stop-note-input{flex:1;border:1px solid var(--gray-300);border-radius:6px;padding:5px 8px;font-size:12.5px;}
.itinerary-stop-note-readonly{font-size:12.5px;color:#6b7280;margin-top:6px;background:#FAF5FF;border-radius:6px;padding:6px 8px;}
.itinerary-stop-actions{display:flex;flex-direction:column;gap:4px;flex-shrink:0;}
.itinerary-mini-btn{background:#fff;border:1px solid #d1d5db;border-radius:6px;padding:3px 8px;font-size:11.5px;color:#6b7280;white-space:nowrap;}
.itinerary-mini-btn:hover:not(:disabled){border-color:#6b21a8;color:#6b21a8;}
.itinerary-mini-btn:disabled{opacity:.35;cursor:default;}
.itinerary-mini-btn-danger:hover{border-color:#ff385c;color:#ff385c;}
.itinerary-missing-loc-btn{color:#b45309;border-color:#fcd34d;background:#fffbeb;margin-left:4px;}
.itinerary-missing-loc-btn:hover{border-color:#b45309;color:#92400e;}
.itinerary-missing-loc-note{font-size:11px;color:#b45309;margin-left:6px;}

.itinerary-add-stop-panel{border:1px dashed var(--gray-300);border-radius:12px;padding:14px 16px;}
.itinerary-add-stop-tabs{display:flex;gap:8px;margin-bottom:10px;flex-wrap:wrap;}
.itinerary-add-tab{background:#fff;border:1px solid var(--gray-300);border-radius:999px;padding:5px 12px;font-size:12.5px;color:var(--gray-700);}
.itinerary-add-tab.active{background:#6b21a8;border-color:#6b21a8;color:#fff;font-weight:600;}

/* 2026-09-15(#535/#536): 파일 업로드(무료)/텍스트 붙여넣기(유료) 방식 선택 서브탭 — 상위 탭과 같은 톤이되
   더 작게 구분되도록 살짝 축소. */
.itinerary-import-subtabs{display:flex;gap:6px;margin:2px 0 10px;}
.itinerary-import-subtabs .itinerary-add-tab{font-size:12px;padding:4px 10px;}
#itineraryImportFile{font-size:12.5px;}
#importTemplateStatus,#importTextStatus{margin-top:4px;}
.itinerary-place-results{display:flex;flex-direction:column;gap:6px;margin-top:8px;max-height:260px;overflow-y:auto;}
.itinerary-place-result-row{display:flex;align-items:center;justify-content:space-between;gap:8px;border:1px solid #e5e7eb;border-radius:8px;padding:8px 10px;font-size:12.5px;}

.tripmoi-day-map-pin{background:#6b21a8;color:#fff;border-radius:50%;width:22px;height:22px;display:flex;align-items:center;justify-content:center;font-size:11px;font-weight:700;border:2px solid #fff;box-shadow:0 1px 4px rgba(0,0,0,.3);}

/* 2026-08-25: "지도 크게 보기" 토글 — 원위치 버튼 왼쪽에 나란히, expanded면 지도 높이만 CSS로 키움
   (Leaflet 인스턴스는 그대로 두고 invalidateSize만 호출, itinerary.js 참고). */
.tripmoi-map-expand-btn{
  position:absolute;top:8px;right:96px;z-index:1000;
  background:#fff;border:1px solid var(--gray-300);border-radius:6px;padding:4px 9px;
  font-size:11px;font-weight:700;color:#7c3aed;cursor:pointer;box-shadow:0 1px 4px rgba(0,0,0,.18);
}
.tripmoi-map-expand-btn:hover{background:#F3E8FE;}
.itinerary-day-map-wrap.expanded .tripmoi-day-map{height:420px;}

/* 핀 클릭 팝업(2026-08-25) — 이름/카테고리/설명 요약 + 구글맵·케어미 링크. */
.itinerary-map-popup{font-size:12.5px;max-width:220px;}
.itinerary-map-popup-title{font-weight:700;font-size:13px;margin-bottom:4px;}
.itinerary-map-popup p{margin:6px 0 0;color:var(--gray-700);line-height:1.4;}
.itinerary-map-popup-links{display:flex;flex-wrap:wrap;gap:10px;margin-top:8px;align-items:center;}
.itinerary-map-popup-links a{color:#7c3aed;font-weight:600;}
.itinerary-popup-guideme-btn{border:none;background:none;color:#7c3aed;font-weight:600;font-size:12.5px;padding:0;cursor:pointer;text-decoration:underline;}

/* 장소 상세 팝업(2026-08-25, #325/#326) — 방문장소 카드·미니맵 핀 팝업의 "더보기"가 공유하는 모달. */
#stopDetailOverlay{position:fixed;inset:0;background:rgba(0,0,0,.45);z-index:1500;display:flex;align-items:center;justify-content:center;padding:20px;}
.stop-detail-modal{background:#fff;border-radius:16px;width:min(440px,100%);max-height:80vh;overflow-y:auto;padding:20px;box-shadow:0 20px 50px rgba(0,0,0,.25);}
.stop-detail-head{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:8px;}
.stop-detail-head strong{font-size:17px;}
.stop-detail-modal p{margin:10px 0 0;color:var(--gray-700);line-height:1.6;font-size:13.5px;}
.stop-detail-links{display:flex;flex-wrap:wrap;gap:14px;margin-top:14px;align-items:center;}
.stop-detail-links a{color:#7c3aed;font-weight:600;font-size:13px;}

/* Day 선택형 N일 베스트루트(2026-09-17) — #stopDetailOverlay와 같은 모달 톤을 그대로 재사용, 오버레이는
   #dayPickerOverlay라는 별도 id로(같은 화면에서 두 모달이 동시에 뜰 일은 없지만 id 충돌 방지). */
#dayPickerOverlay{position:fixed;inset:0;background:rgba(0,0,0,.45);z-index:1500;display:flex;align-items:center;justify-content:center;padding:20px;}
.itinerary-daypicker-modal{width:min(480px,100%);}
.itinerary-daypicker-list{display:flex;flex-direction:column;gap:6px;margin-top:12px;max-height:320px;overflow-y:auto;}
.itinerary-daypicker-item{display:flex;align-items:flex-start;gap:10px;padding:10px 12px;border:1px solid var(--gray-200);border-radius:10px;cursor:pointer;font-size:13.5px;line-height:1.5;}
.itinerary-daypicker-item:hover{background:var(--gray-50);}
.itinerary-daypicker-item input{margin-top:3px;flex-shrink:0;}
.itinerary-duration-hint{font-size:12px;margin:-4px 0 10px;}
.itinerary-daypicker-ai-divider{text-align:center;color:var(--gray-400);font-size:12px;margin:14px 0 6px;position:relative;}
.itinerary-daypicker-ai-box{background:var(--gray-50);border-radius:10px;padding:12px;text-align:center;}
.itinerary-daypicker-ai-box p{margin:0 0 8px;font-size:12.5px;}
.itinerary-ai-quota-hint{font-weight:600;color:#7c3aed;}

/* 가이드미 인라인 팝업(2026-08-25, #327, 구 케어미) — app.js의 #guideme-panel과 같은 시각 언어를 모달로 재사용. */
#itineraryGuideMeOverlay{position:fixed;inset:0;background:rgba(0,0,0,.45);z-index:1500;display:flex;align-items:center;justify-content:center;padding:20px;}
.guideme-modal{background:#fff;border-radius:16px;width:min(400px,100%);max-height:80vh;overflow-y:auto;padding:16px;box-shadow:0 20px 50px rgba(0,0,0,.25);}

/* 2026-09-11(용어/사용법 안내 — help-terms.js): 공용 도움말 ⓘ 아이콘 + 팝오버. help-terms.js가 이 두
   클래스를 참조 — 새 페이지에서 재사용할 때도 CSS는 이 파일 하나만 보면 됨. */
.help-ico{display:inline-flex;align-items:center;justify-content:center;width:16px;height:16px;border-radius:50%;
  border:1px solid var(--gray-300);background:#fff;color:var(--gray-500);font-size:11px;font-weight:700;
  line-height:1;cursor:pointer;vertical-align:middle;margin-left:4px;padding:0;}
.help-ico:hover{background:var(--gray-100);color:var(--ink);}
.help-popover{position:absolute;z-index:2000;max-width:280px;background:#fff;border:1px solid var(--gray-300);
  border-radius:var(--radius-sm);box-shadow:0 8px 24px rgba(0,0,0,.16);padding:10px 12px;font-size:12.5px;
  line-height:1.5;color:var(--ink);display:none;}
.help-popover.open{display:block;}
.help-popover a{color:var(--coral-dark);font-weight:700;font-size:11.5px;display:inline-block;margin-top:6px;}