@charset "utf-8";
/* ============================================================
   CATCHFLAW MVP LAYER — 실데이터 바인딩 화면 전용 스타일
   tokens.css 변수만 사용한다 (UI-STANDARDS.md 참조)
   ============================================================ */

/* ---------- 시맨틱 뱃지 (용어·색 표준 통일: 위험/주의/양호) ---------- */
#main .hotel-list .list .item .thumb .badge .badge-item.badge-danger,
#detail .information .info-top .badge .badge-item.badge-danger,
#search .list .cont .badge .badge-item.badge-danger{background:var(--danger);}
#main .hotel-list .list .item .thumb .badge .badge-item.badge-warning,
#detail .information .info-top .badge .badge-item.badge-warning,
#search .list .cont .badge .badge-item.badge-warning{background:var(--warning);}
#main .hotel-list .list .item .thumb .badge .badge-item.badge-safe,
#detail .information .info-top .badge .badge-item.badge-safe,
#search .list .cont .badge .badge-item.badge-safe{background:var(--safe);color:#fff;border:1px solid rgb(255 255 255 / 20%);}
.badge .badge-item.badge-collect{background:#fff;color:var(--ink-3);border:1px solid var(--line-strong);}
.badge .badge-item{white-space:nowrap;}
#search .list .cont .grade .txt{white-space:nowrap;}

/* ---------- 메인: 지원 범위 안내 ---------- */
#main .search-box .scope-note{margin:14px 2px 0;line-height:18px;font-size:var(--fs-caption);font-weight:var(--fw-medium);color:rgb(255 255 255 / 75%);}
#main .search-box .scope-note b{color:#fff;font-weight:var(--fw-bold);}

/* ---------- 메인: 검색 자동완성 ---------- */
/* 히어로 섹션을 지도 섹션 위로 쌓고, search-box 클리핑 해제 → 드롭다운이 지도에 안 가림 */
#main .sec-1{position:relative;z-index:30;}
#main .search-box{overflow:visible;}
#main .search-box .input{position:relative;}
#main .search-box .ac-box{position:absolute;z-index:50;top:calc(100% + 6px);left:0;right:0;max-height:56vh;overflow-y:auto;border-radius:14px;background:#fff;box-shadow:0 12px 32px rgb(0 0 0 / 22%);}
#main .search-box .ac-box .ac-item{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:13px 16px;font-size:14.5px;color:var(--ink);}
#main .search-box .ac-box .ac-item + .ac-item{border-top:1px solid var(--line);}
#main .search-box .ac-box .ac-item:active{background:var(--primary-soft);}
#main .search-box .ac-box .ac-name{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-weight:var(--fw-bold);}
#main .search-box .ac-box .ac-p{flex:0 0 auto;font-size:12px;font-weight:var(--fw-bold);color:var(--primary);}
#main .search-box .ac-box .ac-p.dim{color:var(--ink-3);}
#main .search-box .ac-box .ac-none{padding:14px 16px;font-size:13.5px;color:var(--ink-2);}

/* ---------- 검색: 필터 바 ---------- */
#search .filters{padding:14px var(--page-x) 4px;display:flex;flex-direction:column;gap:8px;}
#search .filters .f-row{display:flex;align-items:center;gap:6px;overflow-x:auto;scrollbar-width:none;}
#search .filters .f-row::-webkit-scrollbar{display:none;}
#search .filters .f-label{flex:0 0 auto;margin-right:2px;font-size:12.5px;font-weight:var(--fw-bold);color:var(--ink-3);}
#search .filters .f-chip{flex:0 0 auto;display:flex;align-items:center;height:32px;padding:0 12px;border-radius:32px;background:var(--surface);font-size:13px;font-weight:var(--fw-medium);color:var(--ink-2);white-space:nowrap;}
#search .filters .f-chip.on{background:var(--ink);color:#fff;font-weight:var(--fw-bold);}

/* ---------- 지도 (검색·메인 공용) ---------- */
.map-wrap{position:relative;margin:10px var(--page-x) 0;border-radius:var(--radius-img);overflow:hidden;border:1px solid var(--line);}
#search .map-wrap{margin:10px var(--page-x) 0;}
#main .map-wrap{margin:0;}
.map-wrap #map{width:100%;height:300px;}
.map-wrap .map-legend{position:absolute;z-index:1000;right:8px;top:8px;display:flex;gap:8px;padding:6px 10px;border-radius:8px;background:rgb(255 255 255 / 92%);box-shadow:0 1px 4px rgb(0 0 0 / 15%);}
.map-wrap .map-legend .lg{display:flex;align-items:center;gap:4px;font-size:11px;font-weight:600;color:var(--ink-2);}
.map-wrap .map-legend .lg:before{content:'';width:8px;height:8px;border-radius:8px;}
.map-wrap .map-legend .lg.safe:before{background:var(--safe);}
.map-wrap .map-legend .lg.warning:before{background:var(--warning);}
.map-wrap .map-legend .lg.danger:before{background:var(--danger);}
.map-wrap .map-legend .lg.none:before{background:#9CA3AF;}
#main .home-map{padding:48px 20px 8px;overflow:hidden;}
#main .home-map .map-more{margin:var(--sp-3) 0 0;}
#main .home-map .map-more a{display:flex;align-items:center;justify-content:center;gap:6px;height:48px;border-radius:var(--radius-btn);background:var(--surface);font-size:14px;font-weight:var(--fw-medium);color:var(--ink-2);}
.map-pop{min-width:170px;font-family:inherit;}
.map-pop b{display:block;margin:0 0 4px;font-size:14px;line-height:1.35;}
.map-pop .pop-meta{margin:0 0 6px;font-size:12px;color:var(--ink-2);}
.map-pop .pop-p{display:inline-block;padding:2px 8px;border-radius:6px;font-size:11.5px;font-weight:700;color:#fff;}
.map-pop .pop-link{display:block;margin:8px 0 0;font-size:12.5px;font-weight:700;color:var(--primary);}
.leaflet-popup-content{margin:12px 14px;}
.leaflet-popup-content-wrapper{border-radius:12px;}

/* ---------- 검색: 미지원 도시 안내 ---------- */
#search .notice{padding:0 var(--page-x);}
#search .notice-card{margin:20px 0 4px;padding:var(--sp-8) var(--sp-5);border-radius:var(--radius-card);background:var(--surface);text-align:center;}
#search .notice-emoji{font-size:34px;line-height:1;}
#search .notice-tit{margin:var(--sp-3) 0 var(--sp-2);line-height:1.35;font-size:var(--fs-h3);font-weight:var(--fw-display);color:var(--ink);}
#search .notice-txt{line-height:var(--lh-body);font-size:var(--fs-body);color:var(--ink-2);}
#search .notice-btn{display:inline-flex;align-items:center;justify-content:center;margin-top:var(--sp-4);padding:0 var(--sp-5);height:44px;border-radius:var(--radius-btn);background:var(--primary);font-size:var(--fs-body);font-weight:var(--fw-bold);color:#fff;}
#search .list li.sub-head{padding:24px 0 0;border:0;line-height:1.4;font-size:var(--fs-body);font-weight:var(--fw-bold);color:var(--ink-2);}

/* ---------- 검색 리스트 정돈 (가로 넘침 방지 · 부족하면 줄바꿈으로 높이 확보) ---------- */
#search .list li .item{align-items:flex-start;}
#search .list li .thumb{background:var(--surface);}
#search .list .cont{min-width:0;}                    /* flex 자식 넘침 방지 핵심 */
#search .list .cont .info .name{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden;word-break:break-word;line-height:1.35;}
#search .list .cont .info .meta{flex-wrap:wrap;row-gap:2px;}
#search .list .cont .info .meta span.price{color:var(--ink-2);}
#search .list .cont .info .meta span.price b{color:var(--ink);font-weight:var(--fw-bold);}
#search .list .cont .bottom{flex-wrap:wrap;gap:6px 8px;}   /* 한 줄에 안 들어가면 배지가 다음 줄로 */
#search .list .cont .grade{flex-shrink:0;}
#search .list .cont .badge{display:flex;flex-wrap:wrap;gap:4px;justify-content:flex-end;}
#search .list .cont .badge .badge-item{white-space:nowrap;}
/* 카테고리 정렬 시 카드에 표시되는 해당 카테고리 등급 줄 */
#search .list .cont .cat-row{display:flex;align-items:center;gap:6px;margin:10px 0 0;padding:8px 10px;border-radius:10px;background:var(--surface);}
#search .list .cont .cat-row .ci{font-size:14px;}
#search .list .cont .cat-row .cn{font-size:13px;font-weight:var(--fw-bold);color:var(--ink);}
#search .list .cont .cat-row .cbadge{margin-left:auto;font-size:12.5px;font-weight:var(--fw-bold);font-variant-numeric:tabular-nums;}
#search .list .cont .cat-row.is-safe{background:var(--safe-soft);}
#search .list .cont .cat-row.is-safe .cbadge{color:var(--safe-text);}
#search .list .cont .cat-row.is-warning{background:var(--warning-soft);}
#search .list .cont .cat-row.is-warning .cbadge{color:var(--warning-text);}
#search .list .cont .cat-row.is-danger{background:var(--danger-soft);}
#search .list .cont .cat-row.is-danger .cbadge{color:var(--danger-text);}
/* 정렬 드롭다운 구분 라벨 */
#search .list-head .lh-sort-box .lh-sort-sep{padding:8px 12px 4px;margin-top:4px;border-top:1px solid var(--line);font-size:11.5px;font-weight:var(--fw-bold);color:var(--ink-3);}

/* ---------- 상세: 실망확률 근거·게이지 ---------- */
#detail .disappear .basis{margin:18px 0 0;text-align:center;line-height:1.5;font-size:var(--fs-micro);font-weight:var(--fw-medium);color:var(--ink-3);}
#detail .information .info-bottom .btn-audit .txt .count{color:var(--primary);opacity:.75;}

/* ---------- 상세: 리스크 상세 분석 — 축 라벨 (아코디언 본문) ----------
   좌 116px = stat-info 106px + gap 10px · 우 50px = stat-count 40px + gap 10px */
#detail .analysis .risk-acc-body .stat-axis{display:flex;align-items:center;justify-content:space-between;margin:10px 50px 0 116px;}
#detail .analysis .risk-acc-body .stat-axis .ax{display:flex;flex-direction:column;align-items:center;gap:1px;line-height:13px;font-size:11px;font-weight:var(--fw-display);}
#detail .analysis .risk-acc-body .stat-axis .ax:after{content:'▼';font-size:8px;line-height:8px;}
#detail .analysis .risk-acc-body .stat-axis .ax.safe{color:var(--safe);transform:translateX(-50%);}
#detail .analysis .risk-acc-body .stat-axis .ax.avg{color:#B0B4BB;}
#detail .analysis .risk-acc-body .stat-axis .ax.danger{color:var(--danger);transform:translateX(50%);}

/* ---------- 상세: 리스크 상세 분석 — 소분류 게이지 행 (아코디언 본문) ----------
   구조: .risk-acc-body > .stat-list > li.stat-row.is-{band}
         행 = .stat-info(106px) + gap 10 + .stat-track(flex:1) + gap 10 + .stat-count(40px) */
#detail .analysis .risk-acc-body .stat-list{display:flex;flex-direction:column;}
#detail .analysis .risk-acc-body .stat-row{display:flex;align-items:center;gap:10px;padding:13px 0;}
#detail .analysis .risk-acc-body .stat-row + .stat-row{border-top:1px dashed var(--line);}
#detail .analysis .risk-acc-body .stat-info{flex:0 0 106px;min-width:0;}
#detail .analysis .risk-acc-body .stat-info .factor{line-height:18px;font-size:14px;font-weight:var(--fw-bold);color:var(--ink);}
#detail .analysis .risk-acc-body .stat-info .keywords{margin:3px 0 0;line-height:15px;font-size:11.5px;font-weight:var(--fw-medium);color:var(--ink-3);}
#detail .analysis .risk-acc-body .stat-track{flex:1;position:relative;height:12px;border-radius:12px;background:#EEEFF3;}
#detail .analysis .risk-acc-body .stat-fill{position:absolute;top:0;left:0;bottom:0;min-width:20px;border-radius:12px;}
#detail .analysis .risk-acc-body .stat-fill .bubble{position:absolute;top:50%;right:0;transform:translate(40%,-50%);display:flex;align-items:center;justify-content:center;min-width:32px;height:32px;padding:0 4px;border-radius:32px;background:#fff;border:2px solid;box-shadow:0 1px 4px rgb(0 0 0 / 12%);font-size:11.5px;font-weight:var(--fw-display);font-style:normal;font-variant-numeric:tabular-nums;letter-spacing:-0.03em;}
#detail .analysis .risk-acc-body .stat-count{flex:0 0 40px;text-align:right;font-size:var(--fs-caption);font-weight:var(--fw-bold);font-variant-numeric:tabular-nums;padding:0;}
#detail .analysis .risk-acc-body .stat-count.has-reviews{color:var(--primary);text-decoration:underline;text-underline-offset:2px;cursor:pointer;}
#detail .analysis .risk-acc-body .stat-count.zero{color:var(--ink-3);opacity:.6;}
#detail .analysis .risk-acc-body .stat-row.is-danger .stat-fill{background:linear-gradient(90deg,#FF9D9D 0%,var(--danger) 100%);}
#detail .analysis .risk-acc-body .stat-row.is-danger .bubble{border-color:var(--danger);color:var(--danger-text);}
#detail .analysis .risk-acc-body .stat-row.is-warning .stat-fill{background:linear-gradient(90deg,#FFD9A0 0%,var(--warning) 100%);}
#detail .analysis .risk-acc-body .stat-row.is-warning .bubble{border-color:var(--warning);color:var(--warning-text);}
#detail .analysis .risk-acc-body .stat-row.is-safe .stat-fill{background:linear-gradient(90deg,#A9CFF2 0%,var(--safe) 100%);}
#detail .analysis .risk-acc-body .stat-row.is-safe .bubble{border-color:var(--safe);color:var(--safe-text);}

/* ---------- 상세: 아코디언 본문 — 인용 리뷰 / 전체보기 (구 .cat-group 재스코프) ---------- */
#detail .analysis .risk-acc-body .review{margin:var(--sp-3) -4px 0;overflow:hidden;}
#detail .analysis .risk-acc-body .review .list li{width:270px;}
#detail .analysis .risk-acc-body .no-quote{margin:var(--sp-3) 0 var(--sp-2);padding:var(--sp-3);border-radius:12px;background:var(--safe-soft);text-align:center;line-height:1.5;font-size:var(--fs-caption);font-weight:var(--fw-medium);color:var(--safe-text);}
#detail .analysis .risk-acc-body .more{margin:var(--sp-3) 0 var(--sp-2);}
#detail .analysis .risk-acc-body .more-btn{display:flex;align-items:center;justify-content:center;gap:8px;width:100%;height:48px;border-radius:var(--radius-btn);background:var(--surface);font-size:14px;font-weight:var(--fw-medium);color:var(--ink-2);}
#detail .analysis .risk-acc-body .more-btn strong{font-weight:var(--fw-bold);}
#detail .analysis .risk-acc-body .more-btn:after{content:'';width:4px;height:8px;background:url("../img/link_arrow_g.svg") no-repeat center / contain;}

/* ---------- 리뷰 바텀시트 ---------- */
.review-sheet{position:fixed;z-index:300;inset:0;}
.review-sheet .sheet-dim{position:absolute;inset:0;background:rgb(0 0 0 / 60%);opacity:0;transition:opacity .3s;}
.review-sheet .sheet-panel{position:absolute;bottom:0;left:50%;transform:translate(-50%,100%);width:var(--width);max-width:100%;max-height:82dvh;display:flex;flex-direction:column;border-radius:var(--radius-card) var(--radius-card) 0 0;background:#fff;transition:transform .3s;}
.review-sheet.is-open .sheet-dim{opacity:1;}
.review-sheet.is-open .sheet-panel{transform:translate(-50%,0);}
.review-sheet .sheet-head{position:relative;flex:0 0 auto;padding:10px var(--page-x) var(--sp-3);border-bottom:1px solid var(--line);}
.review-sheet .sheet-grab{margin:0 auto 14px;width:40px;height:4px;border-radius:4px;background:var(--line-strong);}
.review-sheet .sheet-title{display:flex;align-items:center;gap:2px;line-height:1.35;font-size:var(--fs-h3);font-weight:var(--fw-display);color:var(--ink);}
.review-sheet .sheet-title .tit{padding:0 2px;}
.review-sheet .sheet-title .cnt{color:var(--primary);}
.review-sheet .sheet-nav{display:flex;align-items:center;justify-content:center;width:28px;height:28px;border-radius:28px;background:var(--surface);font-size:16px;font-weight:700;color:var(--ink-2);line-height:1;}
.review-sheet .sheet-nav:active{background:var(--primary-soft);color:var(--primary);}
.review-sheet .sheet-close{position:absolute;top:22px;right:14px;display:flex;align-items:center;justify-content:center;width:32px;height:32px;font-size:16px;color:var(--ink-2);}
.review-sheet .sheet-chips{margin:var(--sp-3) 0 0;display:flex;gap:6px;overflow-x:auto;padding-bottom:2px;-webkit-overflow-scrolling:touch;scrollbar-width:none;}
.review-sheet .sheet-chips::-webkit-scrollbar{display:none;}
.review-sheet .sheet-chip{flex:0 0 auto;display:flex;align-items:center;height:32px;padding:0 12px;border-radius:32px;background:var(--primary-soft);font-size:13px;font-weight:var(--fw-medium);color:var(--ink-2);white-space:nowrap;}
.review-sheet .sheet-chip.on{background:var(--ink);color:#fff;font-weight:var(--fw-bold);}
.review-sheet .sheet-sort{margin:8px 0 0;font-size:var(--fs-micro);font-weight:var(--fw-medium);color:var(--ink-3);}
.review-sheet .sheet-list{flex:1;overflow-y:auto;padding:var(--sp-4) var(--page-x) calc(var(--sp-8) + env(safe-area-inset-bottom));display:flex;flex-direction:column;gap:var(--sp-3);}
.review-sheet .sheet-list .item{padding:20px;border-radius:var(--radius-card);border:1px solid var(--line);background:#fff;}
.review-sheet .sheet-list .item .item-top{display:flex;align-items:center;justify-content:space-between;margin:0 0 6px;}
.review-sheet .sheet-list .item .item-top .name{line-height:19px;font-size:15px;font-weight:var(--fw-bold);color:var(--ink);}
.review-sheet .sheet-list .item .item-top .status-item{display:flex;align-items:center;justify-content:center;padding:0 9px;height:26px;border-radius:8px;font-size:13px;font-weight:var(--fw-bold);}
.review-sheet .sheet-list .item .item-top .status-item.danger{background:var(--danger-soft);color:var(--danger-text);}
.review-sheet .sheet-list .item .item-top .status-item.warning{background:var(--warning-soft);color:var(--warning-text);}
.review-sheet .sheet-list .item .item-info{display:flex;gap:8px;align-items:center;margin:0 0 8px;}
.review-sheet .sheet-list .item .item-info .star{position:relative;width:82px;height:auto;aspect-ratio:68/12;background:url("../img/star_bg.svg") no-repeat left center / auto 100%;}
.review-sheet .sheet-list .item .item-info .star i{position:absolute;top:0;left:0;bottom:0;background:url("../img/star_fill.svg") no-repeat left center / auto 100%;}
.review-sheet .sheet-list .item .item-info .web{display:flex;align-items:center;gap:4px;font-size:12px;font-weight:500;color:var(--ink-3);}
.review-sheet .sheet-list .item .item-bottom .text{line-height:24px;font-size:15px;color:var(--ink);}
.review-sheet .sheet-list .item .item-bottom .text span{color:var(--primary);font-weight:var(--fw-bold);}
.review-sheet .sheet-list .item .item-bottom .date{margin:6px 0 0;line-height:14px;font-size:13px;font-weight:var(--fw-medium);color:var(--ink-3);}
.review-sheet .sheet-list .item .item-bottom .text.clamp{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden;}
.review-sheet .sheet-list .item .item-foot{margin:12px 0 0;padding:12px 0 0;border-top:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;}
.review-sheet .sheet-list .item .item-foot .orig-link{display:flex;align-items:center;gap:4px;font-size:13px;font-weight:var(--fw-medium);color:var(--ink-3);text-decoration:underline;text-underline-offset:2px;}
.review-sheet .sheet-list .item .item-foot .expand-btn{display:flex;align-items:center;gap:6px;font-size:13.5px;font-weight:var(--fw-medium);color:var(--ink-2);}
.review-sheet .sheet-list .item .item-foot .expand-btn i{font-style:normal;font-size:11px;transition:transform .3s;display:inline-block;}
.review-sheet .sheet-list .item .item-foot .expand-btn.is-open i{transform:rotate(180deg);}
.review-sheet .sheet-list .item .full{margin:12px 0 0;padding:14px;border-radius:12px;background:var(--surface);display:flex;flex-direction:column;gap:12px;}
.review-sheet .sheet-list .item .full[hidden]{display:none;}
.review-sheet .sheet-list .item .full .full-tit{display:inline-flex;align-items:center;height:24px;padding:0 8px;border-radius:8px;background:#fff;font-size:12px;font-weight:var(--fw-bold);color:var(--ink-2);align-self:flex-start;}
.review-sheet .sheet-list .item .full .full-txt{margin-top:-6px;line-height:1.6;font-size:14px;font-weight:var(--fw-medium);color:var(--ink-2);word-break:break-word;}
.review-sheet .sheet-empty{padding:var(--sp-8) 0;text-align:center;font-size:var(--fs-body);color:var(--ink-3);}

#detail .analysis .stat-legend{display:flex;flex-wrap:wrap;align-items:center;gap:5px 12px;margin:2px 0 0;padding:12px 2px 0;border-top:1px solid var(--line);}
#detail .analysis .stat-legend .lg{display:flex;align-items:center;gap:5px;font-size:11.5px;font-weight:600;color:var(--ink-2);}
#detail .analysis .stat-legend .lg:before{content:'';width:8px;height:8px;border-radius:8px;}
#detail .analysis .stat-legend .lg.is-danger:before{background:var(--danger);}
#detail .analysis .stat-legend .lg.is-warning:before{background:var(--warning);}
#detail .analysis .stat-legend .lg.is-safe:before{background:var(--safe);}
#detail .analysis .stat-legend .note{width:100%;line-height:15px;font-size:11.5px;font-weight:var(--fw-medium);color:var(--ink-3);}

/* ---------- 상세: 가격 메타 ---------- */
#detail .information .info-cont .meta span.price b{font-weight:var(--fw-bold);color:var(--primary);}

/* ---------- 상세: 위치(지도) ---------- */
#detail .location .map{border-radius:var(--radius-img);overflow:hidden;border:1px solid var(--line);}
#detail .location .map iframe{display:block;width:100%;height:auto;aspect-ratio:32/22;border:0;}
#detail .location .map-link{display:flex;align-items:center;justify-content:center;gap:6px;margin:var(--sp-3) 0 0;height:48px;border-radius:var(--radius-btn);background:var(--surface);font-size:14px;font-weight:var(--fw-medium);color:var(--ink-2);}

/* ---------- 카드: 2줄 영역 정렬 + 가격 줄바꿈 ---------- */
#main .hotel-list .list .item .info .eng,
#detail .hotel .list .item .info .eng{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%;}
#main .hotel-list .list .item .info .text,
#detail .hotel .list .item .info .text{min-height:21px;}
#main .hotel-list .list .item .info .price-line,
#detail .hotel .list .item .info .price-line{margin:2px 0 0;line-height:20px;font-size:14px;font-weight:var(--fw-medium);color:var(--ink-3);min-height:20px;}
#main .hotel-list .list .item .info .price-line b,
#detail .hotel .list .item .info .price-line b{font-weight:var(--fw-bold);color:var(--ink);}

/* ---------- 추천 카드 배지: 시맨틱 색 통일 (원본 구색 오버라이드) ---------- */
#detail .hotel .list .item .thumb .badge .badge-item{white-space:nowrap;padding:5px 9px;border-radius:8px;line-height:16px;font-size:13px;font-weight:700;}
#detail .hotel .list .item .thumb .badge .badge-item.badge-danger{background:var(--danger);}
#detail .hotel .list .item .thumb .badge .badge-item.badge-warning{background:var(--warning);color:#fff;}
#detail .hotel .list .item .thumb .badge .badge-item.badge-safe{background:var(--safe);color:#fff;border:1px solid rgb(255 255 255 / 20%);}
#main .hotel-list .list .item .thumb .badge .badge-item.badge-warning{color:#fff;}

/* ---------- 상세: 리뷰 상태 칩 (심각/주의 표준 용어) ---------- */
#detail .analysis .review .list .item .item-top .status .status-item.danger{background:var(--danger-soft);color:var(--danger-text);}
#detail .analysis .review .list .item .item-top .status .status-item.warning{background:var(--warning-soft);color:var(--warning-text);}
#detail .analysis .review .list .item .item-info .web{display:flex;align-items:center;gap:4px;font-size:12px;font-weight:500;color:var(--ink-3);}

/* ============================================================
   추가 컴포넌트 (2차 피드백) — 모달 · 공유시트 · 필터시트 · 지역칩 · 소팅
   ============================================================ */

/* ---------- 공통 모달 (종료확인 · 피드백) ---------- */
.cf-modal{position:fixed;z-index:400;inset:0;display:none;}
.cf-modal.is-open{display:block;}
.cf-modal .cf-modal-dim{position:absolute;inset:0;background:rgb(0 0 0 / 60%);}
.cf-modal .cf-modal-card{position:absolute;left:50%;bottom:0;transform:translateX(-50%);width:var(--width);max-width:100%;padding:28px 22px calc(24px + env(safe-area-inset-bottom));border-radius:20px 20px 0 0;background:#fff;text-align:center;animation:cf-slide-up .28s ease;}
@keyframes cf-slide-up{from{transform:translate(-50%,100%);}to{transform:translate(-50%,0);}}
.cf-modal .cf-modal-emoji{font-size:34px;line-height:1;}
.cf-modal .cf-modal-tit{margin:12px 0 8px;line-height:1.35;font-size:var(--fs-h3);font-weight:var(--fw-display);color:var(--ink);}
.cf-modal .cf-modal-txt{line-height:var(--lh-body);font-size:var(--fs-body);color:var(--ink-2);}
.cf-modal .cf-modal-btns{display:flex;gap:8px;margin:22px 0 0;}
.cf-modal .cf-btn{flex:1;display:flex;align-items:center;justify-content:center;height:52px;border-radius:var(--radius-btn);font-size:var(--fs-body);font-weight:var(--fw-bold);}
.cf-modal .cf-btn-primary{background:var(--primary);color:#fff;}
.cf-modal .cf-btn-ghost{background:var(--surface);color:var(--ink-2);}

/* ---------- 이탈 전 피드백 모달 (디자인 표준 정렬) ---------- */
#cf-feedback-modal .cf-modal-card{text-align:left;padding:22px 20px calc(20px + env(safe-area-inset-bottom));}
#cf-feedback-modal .fb-head{display:flex;align-items:center;gap:8px;}
#cf-feedback-modal .fb-emoji{font-size:26px;line-height:1;}
#cf-feedback-modal .fb-tit{flex:1;line-height:1.35;font-size:var(--fs-h3);font-weight:var(--fw-display);color:var(--ink);}
#cf-feedback-modal .fb-close{flex:0 0 auto;display:flex;align-items:center;justify-content:center;width:32px;height:32px;font-size:17px;color:var(--ink-3);}
#cf-feedback-modal .fb-txt{margin:8px 0 16px;line-height:1.55;font-size:var(--fs-body);color:var(--ink-2);}
#cf-feedback-modal textarea,
#cf-feedback-modal input[type=tel]{width:100%;padding:14px;border:1.5px solid var(--line-strong);border-radius:var(--radius-btn);font-size:var(--fs-body);line-height:1.5;font-family:inherit;color:var(--ink);background:#fff;}
#cf-feedback-modal textarea{height:88px;resize:none;}
#cf-feedback-modal input[type=tel]{margin:8px 0 0;}
#cf-feedback-modal textarea:focus,
#cf-feedback-modal input[type=tel]:focus{border-color:var(--primary);}
#cf-feedback-modal .fb-phone-note{margin:8px 2px 0;font-size:var(--fs-micro);color:var(--ink-3);}
#cf-feedback-modal .cf-modal-btns{flex-direction:column;gap:8px;margin-top:18px;}
#cf-feedback-modal .cf-modal-btns .cf-btn{flex:0 0 auto;width:100%;height:52px;}   /* column 배치에서 flex:1 높이붕괴 방지 */
#cf-feedback-modal .fb-skip{flex:0 0 auto;background:transparent;color:var(--ink-3);height:46px;font-size:var(--fs-body);font-weight:var(--fw-medium);}
#cf-feedback-modal .fb-done{padding:28px 0;text-align:center;}
#cf-feedback-modal .fb-done .big{font-size:40px;line-height:1;}
#cf-feedback-modal .fb-done .msg{margin:12px 0 0;font-size:var(--fs-body-lg);font-weight:var(--fw-bold);color:var(--ink);}

/* ---------- 공유 시트 (navigator.share 폴백) ---------- */
#cf-share-sheet .cf-modal-card{padding:20px 20px calc(20px + env(safe-area-inset-bottom));}
#cf-share-sheet .sh-tit{margin:0 0 16px;font-size:var(--fs-h3);font-weight:var(--fw-display);color:var(--ink);text-align:center;}
#cf-share-sheet .sh-list{display:flex;flex-direction:column;gap:8px;}
#cf-share-sheet .sh-item{display:flex;align-items:center;gap:12px;width:100%;padding:14px 16px;border-radius:12px;background:var(--surface);font-size:15px;font-weight:var(--fw-medium);color:var(--ink);}
#cf-share-sheet .sh-item .sh-ico{width:24px;height:24px;flex:0 0 auto;}
#cf-share-sheet .sh-item.kakao{background:#FEE500;}

/* ---------- 메인: CTA 강조 버튼 ---------- */
#main .home-map .map-more a{background:var(--primary);color:#fff;font-weight:var(--fw-bold);box-shadow:0 6px 16px rgb(141 91 253 / 28%);}

/* ---------- 메인: 인기 지역 자동완성 헤더 ---------- */
#main .search-box .ac-box .ac-section{padding:10px 16px 4px;font-size:12px;font-weight:var(--fw-bold);color:var(--ink-3);}
#main .search-box .ac-box .ac-area{display:flex;align-items:center;gap:8px;padding:12px 16px;font-size:14.5px;color:var(--ink);}
#main .search-box .ac-box .ac-area + .ac-area{border-top:1px solid var(--line);}
#main .search-box .ac-box .ac-area:active{background:var(--primary-soft);}
#main .search-box .ac-box .ac-area .ac-emoji{font-size:16px;}
#main .search-box .ac-box .ac-area .ac-sub{margin-left:auto;font-size:12px;color:var(--ink-3);}

/* ---------- 검색: 도시/지역 필터 행 ---------- */
#search .filters .f-chip.disabled{opacity:.4;pointer-events:none;position:relative;}
#search .filters .f-chip.city-on{background:var(--primary);color:#fff;font-weight:var(--fw-bold);}
#search .filters .f-more{flex:0 0 auto;display:flex;align-items:center;gap:4px;height:32px;padding:0 12px;border-radius:32px;background:var(--primary-soft);font-size:13px;font-weight:var(--fw-bold);color:var(--primary);white-space:nowrap;}
#search .filters .f-more.active{background:var(--primary);color:#fff;}

/* ---------- 검색: 리스트 헤더(정렬 + 개수) ---------- */
#search .list-head{display:flex;align-items:center;justify-content:space-between;padding:6px var(--page-x) 0;}
#search .list-head .lh-sort{position:relative;}
#search .list-head .lh-sort-btn{display:flex;align-items:center;gap:6px;height:32px;font-size:13.5px;font-weight:var(--fw-medium);color:var(--ink-2);}
#search .list-head .lh-sort-btn:after{content:'';width:9px;height:5px;background:url("../img/dropdown.svg") no-repeat center / contain;}
#search .list-head .lh-sort.open .lh-sort-btn:after{transform:rotate(180deg);}
#search .list-head .lh-sort-box{position:absolute;z-index:30;top:calc(100% + 4px);right:0;min-width:168px;max-height:60vh;overflow-y:auto;padding:6px;border-radius:12px;background:#fff;box-shadow:0 8px 24px rgb(0 0 0 / 16%);display:none;}
#search .list-head .lh-sort.open .lh-sort-box{display:block;}
#search .list-head .lh-sort-box button{display:block;width:100%;text-align:left;padding:10px 12px;border-radius:8px;font-size:13.5px;color:var(--ink-2);white-space:nowrap;}
#search .list-head .lh-sort-box button.on{background:var(--primary-soft);color:var(--primary);font-weight:var(--fw-bold);}


/* ---------- 검색: 지도 영역 안내 ---------- */
#search .map-hint{padding:8px var(--page-x) 0;font-size:12px;color:var(--ink-3);}
#search .map-hint b{color:var(--primary);font-weight:var(--fw-bold);}

/* ---------- 카테고리 위험 필터 시트 ---------- */
#cf-catfilter .cf-modal-card{text-align:left;padding:20px 20px calc(20px + env(safe-area-inset-bottom));}
#cf-catfilter .cft-tit{font-size:var(--fs-h3);font-weight:var(--fw-display);color:var(--ink);}
#cf-catfilter .cft-txt{margin:6px 0 16px;line-height:1.5;font-size:var(--fs-caption);color:var(--ink-2);}
#cf-catfilter .cft-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px;}
#cf-catfilter .cft-chip{display:flex;align-items:center;gap:6px;padding:13px 12px;border-radius:12px;border:1.5px solid var(--line-strong);background:#fff;font-size:14px;font-weight:var(--fw-medium);color:var(--ink);}
#cf-catfilter .cft-chip .cft-ico{font-size:16px;}
#cf-catfilter .cft-chip.on{border-color:var(--danger);background:var(--danger-soft);color:var(--danger-text);font-weight:var(--fw-bold);}
#cf-catfilter .cf-modal-btns{margin-top:18px;}

/* ---------- 토스트 ---------- */
.cf-toast{position:fixed;z-index:500;left:50%;bottom:80px;transform:translate(-50%,10px);padding:12px 20px;border-radius:24px;background:rgb(25 27 31 / 92%);color:#fff;font-size:14px;font-weight:var(--fw-medium);opacity:0;transition:opacity .3s, transform .3s;pointer-events:none;white-space:nowrap;}
.cf-toast.show{opacity:1;transform:translate(-50%,0);}

/* ============================================================
   AI 맞춤 추천 (recommend.js) — 플로팅 버튼 + 3스텝 마법사
   기존 .cf-modal / .cft-chip / .cf-btn 재사용, 진행 점만 신규
   ============================================================ */

/* ---------- 플로팅 "AI 추천받기" pill (메인, 항상 표시) ---------- */
#float .float a.btn-airec{width:auto;height:48px;padding:0 20px;border-radius:48px;
  display:inline-flex;align-items:center;gap:6px;pointer-events:all;
  background:linear-gradient(90deg, var(--primary) 0%, var(--primary-deep) 100%);
  color:#fff;font-size:var(--fs-body);font-weight:var(--fw-bold);box-shadow:0 6px 18px rgb(141 91 253 / 40%);}
#float .float a.btn-airec span{color:#fff;}

/* ---------- 마법사 시트 ---------- */
#cf-rec-wizard .rec-card{padding:10px 20px calc(22px + env(safe-area-inset-bottom));text-align:left;max-height:88dvh;display:flex;flex-direction:column;}
#cf-rec-wizard .rec-head{display:flex;align-items:center;justify-content:space-between;padding:6px 0 10px;}
#cf-rec-wizard .rec-dots{display:flex;gap:7px;}
#cf-rec-wizard .rec-dots .dot{width:8px;height:8px;border-radius:8px;background:var(--line-strong);transition:background .2s, width .2s;cursor:pointer;}
#cf-rec-wizard .rec-dots .dot.done{background:var(--primary-soft);}
#cf-rec-wizard .rec-dots .dot.on{width:22px;background:var(--primary);}
#cf-rec-wizard .rec-close{display:flex;align-items:center;justify-content:center;width:32px;height:32px;font-size:17px;color:var(--ink-3);}
#cf-rec-wizard .rec-body{overflow-y:auto;}
#cf-rec-wizard .rec-tit{line-height:1.35;font-size:var(--fs-h3);font-weight:var(--fw-display);color:var(--ink);}
#cf-rec-wizard .rec-sub{margin:8px 0 16px;line-height:1.5;font-size:var(--fs-caption);color:var(--ink-2);}

/* Step1: 우선순위 칩 (2열, cft-chip 계열) */
#cf-rec-wizard .rec-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:16px;}
#cf-rec-wizard .rec-chip{position:relative;display:flex;flex-direction:column;gap:3px;padding:14px 12px;border-radius:12px;border:1.5px solid var(--line-strong);background:#fff;text-align:left;}
#cf-rec-wizard .rec-chip.on{border-color:var(--primary);background:var(--primary-soft);}
#cf-rec-wizard .rec-chip .rec-chip-label{font-size:14px;font-weight:var(--fw-bold);color:var(--ink);line-height:1.3;}
#cf-rec-wizard .rec-chip.on .rec-chip-label{color:var(--primary);}
#cf-rec-wizard .rec-chip .rec-chip-kw{font-size:11.5px;font-weight:var(--fw-medium);color:var(--ink-3);}
#cf-rec-wizard .rec-chip .rec-rank{position:absolute;top:8px;right:8px;display:flex;align-items:center;justify-content:center;width:20px;height:20px;border-radius:20px;background:var(--primary);color:#fff;font-size:12px;font-weight:var(--fw-display);}

/* Step2/3: 세로 옵션 리스트 */
#cf-rec-wizard .rec-list{display:flex;flex-direction:column;gap:8px;margin-top:16px;}
#cf-rec-wizard .rec-opt{display:flex;flex-direction:column;gap:2px;padding:15px 16px;border-radius:14px;border:1.5px solid var(--line-strong);background:#fff;text-align:left;}
#cf-rec-wizard .rec-opt.on{border-color:var(--primary);background:var(--primary-soft);}
#cf-rec-wizard .rec-opt .rec-opt-label{font-size:15px;font-weight:var(--fw-bold);color:var(--ink);}
#cf-rec-wizard .rec-opt.on .rec-opt-label{color:var(--primary);}
#cf-rec-wizard .rec-opt .rec-opt-desc{font-size:12px;font-weight:var(--fw-medium);color:var(--ink-3);}
#cf-rec-wizard .rec-btns{margin-top:18px;}
#cf-rec-wizard .rec-btns .cf-btn{flex:0 0 auto;width:100%;height:52px;}
#cf-rec-wizard .rec-btns .cf-btn[disabled]{opacity:.4;pointer-events:none;}

/* ---------- 검색 rec 모드 헤더 ---------- */
#search .rec-header{margin:14px var(--page-x) 0;padding:18px 18px 16px;border-radius:var(--radius-card);background:var(--primary-soft);}
#search .rec-header .rh-tit{font-size:var(--fs-h3);font-weight:var(--fw-display);color:var(--ink);}
#search .rec-header .rh-sub{margin:6px 0 12px;font-size:var(--fs-caption);color:var(--ink-2);}
#search .rec-header .rh-chips{display:flex;flex-wrap:wrap;gap:6px;}
#search .rec-header .rh-chip{display:inline-flex;align-items:center;height:30px;padding:0 11px;border-radius:30px;background:#fff;font-size:12.5px;font-weight:var(--fw-bold);color:var(--ink-2);}
#search .rec-header .rh-chip .rh-rank{color:var(--primary);margin-right:3px;}
#search .rec-header .rh-reset{margin:14px 0 0;display:inline-flex;align-items:center;gap:4px;font-size:13px;font-weight:var(--fw-bold);color:var(--primary);text-decoration:underline;text-underline-offset:2px;}

/* rec 리스트: 순위 메달/숫자 + 이유 문장 */
#search .list .cont .rec-rankline{display:flex;align-items:center;gap:6px;margin:0 0 4px;}
#search .list .cont .rec-medal{font-size:16px;line-height:1;}
#search .list .cont .rec-num{display:flex;align-items:center;justify-content:center;min-width:22px;height:22px;padding:0 5px;border-radius:22px;background:var(--surface);font-size:12.5px;font-weight:var(--fw-display);color:var(--ink-2);}
#search .list .cont .rec-reason{margin:8px 0 0;padding:9px 11px;border-radius:10px;background:var(--primary-soft);line-height:1.45;font-size:12.5px;font-weight:var(--fw-medium);color:var(--ink);}
#search .list .cont .rec-reason b{color:var(--primary);font-weight:var(--fw-bold);}

/* rec 지도 순위 마커 (divIcon) */
.rec-marker{display:flex;align-items:center;justify-content:center;border-radius:50%;background:var(--primary);color:#fff;font-weight:800;border:2px solid #fff;box-shadow:0 1px 4px rgb(0 0 0 / 25%);font-variant-numeric:tabular-nums;}
.rec-marker.big{width:32px;height:32px;font-size:14px;}
.rec-marker.small{width:26px;height:26px;font-size:12px;}

/* ── AI 추천 처리 화면 (마법사 완료 시) ── */
#cf-rec-wizard .rec-loading{padding:48px 20px 44px;text-align:center;display:flex;flex-direction:column;align-items:center;gap:16px;}
#cf-rec-wizard .rec-loading-spin{width:46px;height:46px;border-radius:50%;border:3px solid var(--primary-soft);border-top-color:var(--primary);animation:cf-rec-spin .8s linear infinite;}
@keyframes cf-rec-spin{to{transform:rotate(360deg);}}
#cf-rec-wizard .rec-loading-tit{font-size:var(--fs-h3);font-weight:var(--fw-display);color:var(--ink);line-height:1.4;}
#cf-rec-wizard .rec-loading-sub{font-size:15px;color:var(--ink-2);line-height:1.55;max-width:20em;}

/* ── 토스트 개선 (글씨 키우고 여백 넉넉히, 여러 줄 허용) ── */
.cf-toast{padding:14px 22px;font-size:15px;line-height:1.45;white-space:normal;max-width:min(84vw,340px);text-align:center;box-shadow:0 6px 24px rgb(25 27 31 / 28%);}

/* ── 한국인 리뷰 현황 카드 (상세, 레이더 위) ── */
.kr-card{padding:18px 18px 16px;}
.kr-card .kr-head{display:flex;justify-content:space-between;align-items:baseline;gap:8px;margin-bottom:12px;}
.kr-card .kr-tit{font-size:var(--fs-body-lg);font-weight:var(--fw-bold);color:var(--ink);}
.kr-card .kr-count{font-size:var(--fs-caption);color:var(--ink-2);}
.kr-card .kr-count b{color:var(--primary);font-weight:var(--fw-bold);}
.kr-card .kr-gauge{height:8px;border-radius:99px;background:var(--primary-soft);overflow:hidden;margin-bottom:14px;}
.kr-card .kr-gauge span{display:block;height:100%;border-radius:99px;background:var(--primary);}
.kr-card .kr-rows{display:flex;flex-direction:column;gap:10px;}
.kr-card .kr-row{display:flex;justify-content:space-between;align-items:center;font-size:var(--fs-body);}
.kr-card .kr-row-label{color:var(--ink-2);}
.kr-card .kr-row-vals{display:flex;align-items:baseline;gap:10px;}
.kr-card .kr-ko{color:var(--primary);font-weight:var(--fw-bold);}   /* §2-b 상시 강조 */
.kr-card .kr-ko.emph{font-size:calc(var(--fs-body) + 1px);}         /* 차이 클 때 +1px */
.kr-card .kr-tot{color:var(--ink-3);font-size:var(--fs-caption);}
.kr-card .kr-insight{margin-top:14px;padding:10px 12px;border-radius:12px;background:var(--primary-soft);font-size:var(--fs-caption);color:var(--primary-deep);line-height:1.5;}
.kr-card .kr-insight b{font-weight:var(--fw-bold);}

/* ══════════════ 검색 자동완성 (§7 — 홈 #hero-q + search.html #q 공용) ══════════════ */
/* 홈은 기존 #main .search-box .ac-box 규칙 유지 + 아래 공용/확장 규칙 병행 */
.ac-box .ac-main{display:flex;flex-direction:column;gap:2px;min-width:0;flex:1;}
.ac-box .ac-krn{font-size:var(--fs-micro);color:var(--ink-3);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.ac-box .ac-item.is-sel{background:var(--primary-soft);}
.ac-box .ac-miss{padding:14px 16px;font-size:var(--fs-caption);color:var(--ink-2);line-height:1.5;cursor:pointer;}
.ac-box .ac-miss .ac-miss-q{font-weight:var(--fw-bold);color:var(--ink);}
.ac-box .ac-miss b{color:var(--primary);font-weight:var(--fw-bold);text-decoration:underline;text-underline-offset:2px;}
.ac-box .ac-miss:active{background:var(--primary-soft);}
/* search.html: #title .search 내부 드롭다운 (홈 규칙 밖) */
#title .search .ac-box{position:absolute;z-index:120;top:calc(100% + 8px);left:0;right:0;max-height:60vh;overflow-y:auto;border-radius:14px;background:#fff;box-shadow:0 12px 32px rgb(0 0 0 / 22%);}
#title .search .ac-box .ac-section{padding:10px 16px 4px;font-size:12px;font-weight:var(--fw-bold);color:var(--ink-3);}
#title .search .ac-box .ac-item{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:12px 16px;font-size:14.5px;color:var(--ink);}
#title .search .ac-box .ac-item + .ac-item{border-top:1px solid var(--line);}
#title .search .ac-box .ac-item:active,#title .search .ac-box .ac-item.is-sel{background:var(--primary-soft);}
#title .search .ac-box .ac-name{flex:0 1 auto;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-weight:var(--fw-bold);}
#title .search .ac-box .ac-p{flex:0 0 auto;font-size:12px;font-weight:var(--fw-bold);}
#title .search .ac-box .ac-p.dim{color:var(--ink-3);}
#title .search .ac-box .ac-area{display:flex;align-items:center;gap:8px;padding:12px 16px;font-size:14.5px;color:var(--ink);}
#title .search .ac-box .ac-area + .ac-area{border-top:1px solid var(--line);}
#title .search .ac-box .ac-area .ac-sub{margin-left:auto;font-size:12px;color:var(--ink-3);}
#title .search .ac-box .ac-none{padding:14px 16px;font-size:13.5px;color:var(--ink-2);}

/* ── 한국인 카드 추가 (§2) ── */
.kr-card .kr-rank{margin:-4px 0 12px;font-size:var(--fs-caption);font-weight:var(--fw-bold);color:var(--primary-deep);}
.kr-card .kr-serious{margin-top:8px;padding:10px 12px;border-radius:12px;background:var(--surface);font-size:var(--fs-caption);color:var(--ink-2);line-height:1.5;}
.kr-card .kr-serious b{color:var(--danger-text);font-weight:var(--fw-bold);}
.kr-card .kr-only-btn{margin-top:14px;width:100%;height:46px;border-radius:var(--radius-btn);border:1.5px solid var(--primary);background:#fff;font-size:var(--fs-body);font-weight:var(--fw-bold);color:var(--primary);}
.kr-card .kr-only-btn.is-on{background:var(--primary);color:#fff;}

/* ── 리뷰 언어 칩 (§5-a) ── */
.q-lang{display:inline-flex;align-items:center;height:18px;padding:0 6px;border-radius:var(--radius-chip);border:1px solid var(--line-strong);font-size:var(--fs-micro);font-weight:var(--fw-medium);color:var(--ink-3);}
#detail .analysis .review .list .item .item-info{display:flex;align-items:center;gap:6px;flex-wrap:wrap;}

/* ── 레이더 카테고리 칩 (§3-b) ── */
#detail .risk .radar-cats{display:grid;grid-template-columns:repeat(2,1fr);gap:8px;margin-top:18px;}
#detail .risk .radar-cat{display:flex;align-items:center;gap:6px;padding:10px 12px;border-radius:12px;border:1.5px solid var(--line-strong);background:#fff;font-size:var(--fs-caption);font-weight:var(--fw-bold);color:var(--ink);text-align:left;}
#detail .risk .radar-cat .rc-name{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
#detail .risk .radar-cat .rc-score{font-variant-numeric:tabular-nums;}
#detail .risk .radar-cat.is-danger{border-color:var(--danger);color:var(--danger-text);}
#detail .risk .radar-cat.is-warning{border-color:var(--warning);color:var(--warning-text);}
#detail .risk .radar-cat.is-safe{border-color:var(--safe);color:var(--safe-text);}

/* ── 신호등 점 (§4-b) ── */
.risk-dot{flex:0 0 auto;display:inline-block;width:10px;height:10px;border-radius:50%;background:var(--ink-3);}
.risk-dot.is-danger{background:var(--danger);}
.risk-dot.is-warning{background:var(--warning);}
.risk-dot.is-safe{background:var(--safe);}
.sub-dot{flex:0 0 auto;display:inline-block;width:6px;height:6px;border-radius:50%;margin-right:5px;vertical-align:middle;background:var(--ink-3);}
.sub-dot.is-danger{background:var(--danger);}
.sub-dot.is-warning{background:var(--warning);}
.sub-dot.is-safe{background:var(--safe);}

/* ── 한국인 필터 칩 (§5-c) ── */
#detail .analysis .risk-filter{margin:-20px 0 20px;}
#detail .analysis .risk-filter-chip{display:inline-flex;align-items:center;height:36px;padding:0 16px;border-radius:36px;border:1.5px solid var(--primary);background:#fff;font-size:var(--fs-caption);font-weight:var(--fw-bold);color:var(--primary);}
#detail .analysis .risk-filter-chip.is-on{background:var(--primary);color:#fff;}

/* ── 리스크 아코디언 + sticky 스택 탭 (§4-c) ── */
/* 상세엔 고정 앱헤더가 없으므로 top = index*44px. 부모/아이템 overflow:hidden이 sticky를 깨므로 해제 */
#detail .analysis{overflow:visible;}
#detail .analysis .risk-acc{position:relative;}
#detail .analysis .risk-acc-item{border:1px solid var(--line-strong);border-radius:var(--radius-card);background:#fff;margin-bottom:12px;}
/* 각 헤더가 스크롤 시 상단에 차곡차곡 쌓이도록 순서별 top·z-index (44px 간격) */
#detail .analysis .risk-acc-item:nth-child(1) > .risk-acc-head{top:0;z-index:16;}
#detail .analysis .risk-acc-item:nth-child(2) > .risk-acc-head{top:44px;z-index:15;}
#detail .analysis .risk-acc-item:nth-child(3) > .risk-acc-head{top:88px;z-index:14;}
#detail .analysis .risk-acc-item:nth-child(4) > .risk-acc-head{top:132px;z-index:13;}
#detail .analysis .risk-acc-item:nth-child(5) > .risk-acc-head{top:176px;z-index:12;}
#detail .analysis .risk-acc-item:nth-child(6) > .risk-acc-head{top:220px;z-index:11;}
#detail .analysis .risk-acc-head{position:sticky;display:flex;align-items:center;gap:8px;width:100%;height:44px;padding:0 14px;background:#fff;border-radius:var(--radius-card) var(--radius-card) 0 0;border-bottom:1px solid transparent;text-align:left;}
#detail .analysis .risk-acc-item:not(.is-open) > .risk-acc-head{border-radius:var(--radius-card);}
#detail .analysis .risk-acc-item.is-open > .risk-acc-head{border-bottom-color:var(--line);}
#detail .analysis .risk-acc-head .cat-name{flex:1 1 auto;min-width:0;font-size:var(--fs-body-lg);font-weight:var(--fw-display);color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
#detail .analysis .risk-acc-head .cat-score{flex:0 0 auto;text-align:right;font-size:var(--fs-caption);font-weight:var(--fw-bold);white-space:nowrap;font-variant-numeric:tabular-nums;}
#detail .analysis .risk-acc-head .cat-score.is-danger{color:var(--danger-text);}
#detail .analysis .risk-acc-head .cat-score.is-warning{color:var(--warning-text);}
#detail .analysis .risk-acc-head .cat-score.is-safe{color:var(--safe-text);}
#detail .analysis .risk-acc-head .cat-score .pctl{font-weight:var(--fw-medium);color:var(--ink-3);}
#detail .analysis .risk-acc-head .risk-arrow{flex:0 0 auto;width:8px;height:8px;margin-left:2px;border-right:2px solid var(--ink-3);border-bottom:2px solid var(--ink-3);transform:rotate(45deg) translateY(-2px);transition:transform .2s;}
#detail .analysis .risk-acc-item.is-open > .risk-acc-head .risk-arrow{transform:rotate(-135deg) translateY(-2px);}
#detail .analysis .risk-acc-body{display:none;padding:4px 14px 14px;border-radius:0 0 var(--radius-card) var(--radius-card);}
#detail .analysis .risk-acc-item.is-open > .risk-acc-body{display:block;}
#detail .analysis .risk-acc-body .review-empty{margin:var(--sp-3) 0 var(--sp-2);padding:var(--sp-3);border-radius:12px;background:var(--surface);text-align:center;font-size:var(--fs-caption);font-weight:var(--fw-medium);color:var(--ink-3);}
/* 360px 미만 초소형: 헤더에서 백분위 생략 (이름 잘림 방지 최후 안전장치) */
@media (max-width:359px){
    #detail .analysis .risk-acc-head .cat-score .pctl{display:none;}
}

/* ── 상세 히어로 사진 갤러리 (Swiper) ── */
.visual .hotel-gallery{position:relative;width:100%;height:100%;}
.visual .hotel-gallery .swiper-slide img{width:100%;height:100%;object-fit:cover;display:block;}
.visual .hotel-gallery .swiper-pagination{bottom:12px;}
.visual .hotel-gallery .swiper-pagination-bullet{background:#fff;opacity:.55;width:7px;height:7px;}
.visual .hotel-gallery .swiper-pagination-bullet-active{opacity:1;width:18px;border-radius:4px;}
.visual .hotel-gallery .gallery-count{position:absolute;right:12px;top:12px;z-index:2;padding:4px 10px;border-radius:99px;background:rgb(25 27 31 / 55%);color:#fff;font-size:var(--fs-micro);font-weight:var(--fw-medium);}
