/*!*************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/next/dist/build/webpack/loaders/css-loader/src/index.js??ruleSet[1].rules[13].oneOf[12].use[2]!./node_modules/next/dist/build/webpack/loaders/postcss-loader/src/index.js??ruleSet[1].rules[13].oneOf[12].use[3]!./app/globals.css ***!
  \*************************************************************************************************************************************************************************************************************************************************************/
:root {
  /* 다크 슬레이트 + 틸 포인트 — 차분하고 신뢰감 있는 금융 테마 */
  --bg: #0f1720;
  --panel: #18222e;
  --panel2: #1f2c3a;
  --line: #2e3d4d;
  --text: #eaf0f6;
  --muted: #93a4b6;
  --accent: #38bdf8;      /* 스카이 — 링크·선택 */
  --accent2: #2dd4a7;     /* 틸 — 주요 액션 */
  --life: #818cf8;
  --nonlife: #fb923c;
}
* { box-sizing: border-box; }
html, body { margin: 0; padding: 0; }
body {
  background: var(--bg);
  color: var(--text);
  font-size: 16px;
  line-height: 1.6;
  font-family: -apple-system, BlinkMacSystemFont, 'Apple SD Gothic Neo', 'Segoe UI', Roboto, sans-serif;
  -webkit-font-smoothing: antialiased;
}
a { color: var(--accent); }

.wrap { max-width: 1280px; margin: 0 auto; padding: 20px; }
.header { display: flex; align-items: baseline; gap: 14px; flex-wrap: wrap; margin-bottom: 6px; }
.logo { font-size: 26px; font-weight: 800; letter-spacing: -0.5px; }
.logo .scan { color: var(--accent); }
a.logo { color: inherit; text-decoration: none; cursor: pointer; }
a.logo:hover { opacity: .85; }
.sub { color: var(--muted); font-size: 13px; }
.stat { color: var(--muted); font-size: 13px; margin: 4px 0 18px; }
.stat b { color: var(--text); }

.toolbar { display: flex; gap: 10px; flex-wrap: wrap; align-items: center; margin-bottom: 14px; }
.search {
  flex: 1 1; min-width: 240px; background: var(--panel); border: 1px solid var(--line);
  color: var(--text); padding: 13px 15px; border-radius: 10px; font-size: 16px; outline: none;
}
.search:focus { border-color: var(--accent); }
select, .btn {
  background: var(--panel); border: 1px solid var(--line); color: var(--text);
  padding: 10px 13px; border-radius: 10px; font-size: 14.5px; cursor: pointer;
}
.btn:hover { border-color: var(--accent); }

.layout { display: grid; grid-template-columns: 230px 1fr; grid-gap: 18px; gap: 18px; }
@media (max-width: 880px) { .layout { grid-template-columns: 1fr; } }

.facets { display: flex; flex-direction: column; gap: 16px; }
.facet h4 { margin: 0 0 8px; font-size: 13px; color: var(--muted); text-transform: uppercase; letter-spacing: 0.5px; }
.facet ul { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 2px; max-height: 240px; overflow: auto; }
.facet li { display: flex; justify-content: space-between; padding: 6px 8px; border-radius: 7px; cursor: pointer; font-size: 13px; }
.facet li:hover { background: var(--panel); }
.facet li.active { background: var(--accent); color: #fff; }
.facet li .c { color: var(--muted); font-size: 12px; }
.facet li.active .c { color: #dbe7ff; }

.cards { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); grid-gap: 12px; gap: 12px; }
.card { background: var(--panel); border: 1px solid var(--line); border-radius: 12px; padding: 14px; display: flex; flex-direction: column; gap: 8px; }
.card:hover { border-color: var(--accent); }
.card .top { display: flex; justify-content: space-between; align-items: flex-start; gap: 8px; }
.badge { font-size: 11px; padding: 3px 8px; border-radius: 999px; font-weight: 700; white-space: nowrap; }
.badge.life { background: rgba(99,102,241,0.2); color: #a5b4fc; }
.badge.nonlife { background: rgba(245,158,11,0.18); color: #fbbf24; }
.badge.disc { background: rgba(248,113,113,0.20); color: #f87171; }
.card.discontinued { opacity: 0.62; border-style: dashed; }
.card.discontinued .name { text-decoration: line-through; }
.card .name { font-size: 15px; font-weight: 700; line-height: 1.35; }
.card .name.clickable { cursor: pointer; }
.card .name.clickable:hover { color: var(--accent); text-decoration: underline; }
table.cmp thead th { position: -webkit-sticky; position: sticky; top: 0; }
.card .co { color: var(--muted); font-size: 13px; }
.tags { display: flex; gap: 6px; flex-wrap: wrap; }
.tag { font-size: 11px; color: var(--muted); background: var(--panel2); padding: 3px 8px; border-radius: 6px; }
.tag.bld { background: rgba(54,211,153,0.18); color: #6ee7b7; font-weight: 700; }
.grade { font-size: 11px; font-weight: 800; padding: 3px 8px; border-radius: 999px; white-space: nowrap; }
.grade.ga { background: rgba(54,211,153,0.22); color: #34d399; }
.grade.gc { background: rgba(245,158,11,0.20); color: #fbbf24; }
.grade.gd { background: rgba(248,113,113,0.20); color: #f87171; }
.grade.gn { background: var(--panel2); color: var(--muted); }
.btn.on { background: var(--accent2); color: #05231a; border-color: var(--accent2); font-weight: 700; }
.metrics { display: flex; gap: 14px; font-size: 12px; color: var(--muted); flex-wrap: wrap; }
.metrics b { color: var(--text); }
.card .actions { margin-top: auto; display: flex; gap: 8px; }
.chk { display: flex; align-items: center; gap: 6px; font-size: 13px; color: var(--muted); cursor: pointer; }

.pager { display: flex; gap: 8px; align-items: center; justify-content: center; margin: 22px 0 6px; }

/* compare tray */
.tray { position: fixed; left: 0; right: 0; bottom: 0; background: var(--panel2); border-top: 1px solid var(--line); padding: 12px 20px; display: flex; gap: 12px; align-items: center; flex-wrap: wrap; z-index: 50; }
.tray .chip { background: var(--panel); border: 1px solid var(--line); padding: 6px 10px; border-radius: 8px; font-size: 12px; display: flex; gap: 8px; align-items: center; }
.tray .chip button { background: none; border: none; color: var(--muted); cursor: pointer; font-size: 14px; }

/* compare modal */
.modal-bg { position: fixed; inset: 0; background: rgba(0,0,0,0.6); z-index: 100; display: flex; align-items: center; justify-content: center; padding: 20px; }
.modal { background: var(--panel); border: 1px solid var(--line); border-radius: 14px; max-width: 1100px; width: 100%; max-height: 85vh; overflow: auto; padding: 18px; }
table.cmp { width: 100%; border-collapse: collapse; font-size: 13px; }
table.cmp th, table.cmp td { border: 1px solid var(--line); padding: 9px 10px; text-align: left; vertical-align: top; }
table.cmp th { background: var(--panel2); color: var(--muted); white-space: nowrap; }
.empty { color: var(--muted); padding: 40px; text-align: center; }

/* 챗봇(/chat) — 키보드가 올라와도 대화가 보이도록 화면 높이에 맞춰 유동 배치 */
.chat-page {
  display: flex; flex-direction: column;
  height: 100dvh;              /* 동적 뷰포트: 키보드 표시 시 자동 축소 */
  max-height: 100dvh;
  overflow: hidden;
}
.chat-page .chat-head,
.chat-page .chat-input { flex: 0 0 auto; }   /* 대화가 길어져도 눌리지 않음 */
.chat-page .chat-box {
  flex: 1 1 auto;              /* 남는 공간만큼만 차지 */
  min-height: 0;               /* flex 자식 스크롤 필수 */
  max-height: none;
}
.chat-box { background: var(--panel); border: 1px solid var(--line); border-radius: 12px; padding: 16px;
  transition: border-color .3s ease, box-shadow .3s ease;
  overflow-y: auto; -webkit-overflow-scrolling: touch; display: flex; flex-direction: column; gap: 12px; }
.msg { display: flex; animation: msgIn .32s cubic-bezier(.22,.9,.3,1) both; }
@keyframes msgIn {
  from { opacity: 0; transform: translateY(8px); }
  to   { opacity: 1; transform: none; }
}
@media (prefers-reduced-motion: reduce) {
  .msg { animation: none; }
}
.msg.user { justify-content: flex-end; }
.msg .bubble { max-width: 86%; padding: 13px 15px; border-radius: 12px; font-size: 15.5px; line-height: 1.68; }
.msg.bot .bubble { background: var(--panel2); border: 1px solid var(--line); }
.msg.user .bubble { background: var(--accent); color: #fff; }
/* 상품 카드는 화면 폭과 무관하게 가로로 넘긴다.
   그리드로 감싸면 마지막 줄에 카드 한 장만 남아 허전하고, 말풍선이 세로로 길어진다. */
.chat-cards {
  display: flex; flex-wrap: nowrap; gap: 8px; margin-top: 10px;
  overflow-x: auto; -webkit-overflow-scrolling: touch;
  scroll-snap-type: x proximity;
  padding-bottom: 8px;
  scrollbar-width: thin;
}
.chat-cards::-webkit-scrollbar { height: 6px; }
.chat-cards::-webkit-scrollbar-thumb { background: var(--line); border-radius: 3px; }
.chat-cards::-webkit-scrollbar-thumb:hover { background: var(--accent); }
.chat-cards .chat-card { flex: 0 0 232px; scroll-snap-align: start; min-width: 0; }
.chat-cards .chat-card .cc-name { word-break: keep-all; overflow-wrap: anywhere; }
.chat-card { background: var(--panel); border: 1px solid var(--line); border-radius: 10px; padding: 10px;
  display: flex; flex-direction: column; gap: 5px; }
.cc-top { display: flex; gap: 5px; flex-wrap: wrap; }
.cc-name { font-size: 14.5px; font-weight: 700; line-height: 1.4; }
.cc-co { font-size: 13px; color: var(--muted); }
.cc-metrics { display: flex; gap: 10px; flex-wrap: wrap; font-size: 12.5px; color: var(--muted); }
.cc-metrics b { color: var(--text); }
/* 모바일에서만 노출되는 스와이프 안내 */
.clickable-card { cursor: pointer; }
.clickable-card:hover { border-color: var(--accent); }
textarea.search { font-family: inherit; resize: vertical; }
.modal .pl-block { margin-bottom: 0; }

/* ── 상세 모달 디자인 ───────────────────────── */
.dm { max-width: 560px; padding: 0; overflow: hidden; display: flex; flex-direction: column; }
.dm-head {
  padding: 16px 18px 14px; border-bottom: 1px solid var(--line);
  background: linear-gradient(180deg, var(--panel2), var(--panel));
  position: relative; flex: 0 0 auto;
}
.dm-close {
  position: absolute; top: 12px; right: 12px; width: 30px; height: 30px; padding: 0;
  border-radius: 50%; font-size: 16px; line-height: 1; color: var(--muted);
  background: var(--panel); border: 1px solid var(--line);
}
.dm-close:hover { color: var(--text); border-color: var(--accent); }
.dm-title { font-size: 17.5px; font-weight: 800; line-height: 1.4; margin: 8px 40px 4px 0; word-break: keep-all; }
.dm-sub { font-size: 13.5px; color: var(--muted); }

/* 핵심 지표 — 회색 대신 또렷한 카드형 */
.dm-stats { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 12px; }
.dm-stat {
  background: var(--panel); border: 1px solid var(--line); border-radius: 9px;
  padding: 6px 10px; min-width: 78px;
}
.dm-stat .k { font-size: 10px; color: var(--muted); letter-spacing: .2px; }
.dm-stat .v { font-size: 14px; font-weight: 800; margin-top: 1px; }
.dm-stat.warn { background: rgba(245,158,11,.12); border-color: rgba(245,158,11,.35); }
.dm-stat.warn .v { color: #fbbf24; font-size: 12px; }

.dm-more {
  width: 100%; margin-top: 8px; padding: 9px 10px;
  background: var(--panel2); border: 1px solid var(--line); border-radius: 9px;
  color: var(--accent); font-size: 13px; font-weight: 700; cursor: pointer;
}
.dm-more:hover { border-color: var(--accent); }
.dm-body { padding: 14px 18px; overflow-y: auto; flex: 1 1 auto; min-height: 0; }
.dm-sec { font-size: 11px; color: var(--muted); font-weight: 700; letter-spacing: .4px;
  margin: 4px 0 8px; text-transform: uppercase; }
.dm-desc { font-size: 13.5px; line-height: 1.65; color: var(--muted); margin-bottom: 14px; }

/* 담보 리스트 — 한 줄 요약형(컴팩트) */
.dm-cov { display: flex; flex-direction: column; gap: 1px; border: 1px solid var(--line);
  border-radius: 10px; overflow: hidden; }
/* 담보 행 — 담보명(위) / 가입금액(아래) 세로 배치로 겹침 방지 */
.dm-cov-row {
  display: flex; flex-direction: column; gap: 3px;
  padding: 10px 12px; background: var(--panel2); font-size: 13.5px;
}
.dm-cov-row:nth-child(odd) { background: color-mix(in srgb, var(--panel2) 60%, var(--panel)); }
.dm-cov-name {
  font-weight: 700; line-height: 1.45;
  word-break: keep-all; overflow-wrap: anywhere;
}
.dm-cov-amt {
  color: var(--accent2); font-weight: 700; font-size: 12.5px; line-height: 1.5;
  white-space: normal;                 /* 긴 설명도 줄바꿈 */
  word-break: keep-all; overflow-wrap: anywhere;
}
/* 가입금액이 아주 길면(실손 등) 3줄까지만 보이고 탭하면 펼침 */
.dm-cov-amt.clip {
  display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden;
}
.dm-cov-row.open .dm-cov-amt.clip { -webkit-line-clamp: unset; }
.dm-cov-row { cursor: pointer; }

/* 담보 상세(지급사유) */
.dm-reason { font-size: 14.5px; line-height: 1.7; }
.dm-cond { display: flex; align-items: flex-start; gap: 6px; font-size: 12.5px;
  color: #fbbf24; margin-top: 4px; }

/* 액션 바 — 하단 고정, 주/보조 위계 */
.dm-actions {
  flex: 0 0 auto; display: grid; grid-template-columns: 1fr 1fr; grid-gap: 8px; gap: 8px;
  padding: 12px 18px 14px; border-top: 1px solid var(--line); background: var(--panel);
}
.dm-btn {
  display: flex; align-items: center; justify-content: center; gap: 6px;
  padding: 12px 10px; border-radius: 10px; font-size: 14.5px; font-weight: 700;
  border: 1px solid var(--line); background: var(--panel2); color: var(--text);
  text-decoration: none; cursor: pointer; white-space: nowrap;
}
.dm-btn:hover { border-color: var(--accent); }
.dm-btn.primary { grid-column: 1 / -1; background: var(--accent2); color: #05231a; border-color: var(--accent2); }
.dm-btn.primary:hover { filter: brightness(1.06); }
.dm-btn.ghost { background: transparent; color: var(--muted); }

@media (max-width: 900px) {
  .modal-bg { padding: 0; align-items: flex-end; }
  .dm { max-width: 100%; max-height: 88dvh; border-radius: 16px 16px 0 0; border-bottom: none; }
  .dm-title { font-size: 15px; }
}
.swipe-hint { display: block; font-size: 11px; color: var(--muted); margin: 6px 0 2px; }
.typing { display: inline-flex; gap: 4px; align-items: center; }
.typing i { width: 5px; height: 5px; border-radius: 50%; background: var(--muted); display: inline-block;
  animation: blink 1.2s infinite ease-in-out; }
.typing i:nth-child(2) { animation-delay: .18s; }
.typing i:nth-child(3) { animation-delay: .36s; }
@keyframes blink { 0%,80%,100% { opacity: .25; transform: translateY(0); } 40% { opacity: 1; transform: translateY(-2px); } }

.engine-tag { font-size: 10px; color: var(--accent2); font-weight: 700; margin-bottom: 6px; letter-spacing: .3px; }

/* 챗봇 답변 안의 표: 가로 스크롤 + 셀 줄바꿈 안정화 */
.msg .bubble .pl-scroll { overflow-x: auto; -webkit-overflow-scrolling: touch; }
.msg .bubble table.cmp { min-width: 520px; }
.msg .bubble table.cmp td, .msg .bubble table.cmp th { word-break: keep-all; overflow-wrap: anywhere; }

/* 모바일: 담보 표를 카드형으로 전환(가로 뭉개짐 방지) */
@media (max-width: 900px) {
  .wrap { padding: 10px 12px; }
  .chat-box { padding: 12px; }

  /* 상단 공간 절약 */
  .chat-page .header { margin-bottom: 2px; gap: 8px; align-items: center; }
  .chat-page .logo { font-size: 19px; }
  .chat-page .sub { display: none; }              /* 부제 숨김 */
  .chat-page .header .btn { padding: 6px 9px; font-size: 12px; }
  .chat-page .pl-links { margin-bottom: 8px !important; gap: 6px; }
  .kw-guide { font-size: 12.5px; padding: 7px 10px; margin: 0 0 7px; }
  .expert-bar { font-size: 12.5px; padding: 7px 11px; margin-bottom: 7px; }
  .ext-note { display: none; }          /* 좁은 화면에선 배지 숨김 */
  .pl-link.ext::after { content: ' ↗'; }
  .chat-page .pl-link { padding: 7px 11px; font-size: 13.5px; }

  /* 담보 카드 압축 */
  .cover-table tr { padding: 7px 9px; margin-bottom: 6px; }
  .cover-table td { padding: 2px 0 !important; font-size: 13.5px; line-height: 1.5; }
  .cover-table td::before { font-size: 10px; margin-bottom: 0; opacity: .75; }
  /* 담보명은 라벨 없이 굵게, 가입금액은 강조 */
  .cover-table td:first-child::before { display: none; }
  .cover-table td:first-child { font-size: 13px; margin-bottom: 2px; }
  .cover-table td:nth-child(2) { color: var(--accent2); font-weight: 700; }
  /* 지급사유는 2줄까지만 보여주고 탭하면 펼침 */
  .cover-table td.clamp {
    display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;
    overflow: hidden; color: var(--muted);
  }
  .cover-table tr.open td.clamp { -webkit-line-clamp: unset; }
  .cover-table tr { cursor: pointer; }
  /* 모바일: 헤더/키워드는 스크롤로 넘기고 대화+입력창을 우선 확보 */
  .chat-page .chat-head { flex: 0 0 auto; }
  .chat-page .chat-input { flex: 0 0 auto; }

  /* 키워드 버튼: 줄바꿈 대신 가로 스크롤(좌우로 넘기기) */
  .pl-links {
    flex-wrap: nowrap;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    scroll-snap-type: x proximity;
    padding-bottom: 6px;
    scrollbar-width: none;              /* Firefox */
  }
  .pl-links::-webkit-scrollbar { display: none; }
  .pl-links > * {
    flex: 0 0 auto;                     /* 버튼 찌그러짐 방지 */
    scroll-snap-align: start;
    white-space: nowrap;
  }
  /* 상단 네비(검색/자료실/상조)도 가로 스크롤 */
  .header > span { overflow-x: auto; max-width: 100%; scrollbar-width: none; }
  .header > span::-webkit-scrollbar { display: none; }
  .header > span > * { flex: 0 0 auto; white-space: nowrap; }
  .msg .bubble { max-width: 100%; font-size: 15px; }
  .msg .bubble table.cmp { min-width: 0; }
  .cover-table { min-width: 0 !important; }
  .cover-table thead { display: none; }
  .cover-table, .cover-table tbody, .cover-table tr, .cover-table td { display: block; width: 100%; }
  .cover-table tr {
    border: 1px solid var(--line); border-radius: 10px; padding: 8px 10px;
    margin-bottom: 8px; background: var(--panel);
  }
  .cover-table td { border: none !important; padding: 3px 0 !important; }
  .cover-table td::before {
    content: attr(data-label); display: block; font-size: 11px; color: var(--muted); margin-bottom: 2px;
  }
  .cover-table td:first-child { font-weight: 700; }

  /* 모바일: 담보 표도 좌우 스와이프 카드로 */
  .cov-swipe { overflow-x: auto; -webkit-overflow-scrolling: touch;
    scroll-snap-type: x mandatory; scrollbar-width: none; }
  .cov-swipe::-webkit-scrollbar { display: none; }
  .cov-swipe .cover-table tbody { display: flex; flex-wrap: nowrap; gap: 8px; }
  .cov-swipe .cover-table tr {
    flex: 0 0 78%; scroll-snap-align: start; margin-bottom: 0;
    display: flex; flex-direction: column;
  }
  .cov-swipe .cover-table { min-width: 0; }

  /* 폴드 펼침·태블릿(600px↑): 한 화면에 여러 장 보이도록 카드 폭 축소 */
  @media (min-width: 600px) {
    .chat-cards .chat-card { flex: 0 0 46%; }   /* 2장 + 살짝 */
    .cov-swipe .cover-table tr { flex: 0 0 46%; }
  }
  @media (min-width: 760px) {
    .chat-cards .chat-card { flex: 0 0 32%; }   /* 3장 */
    .cov-swipe .cover-table tr { flex: 0 0 32%; }
  }

  /* 모바일: 상품 카드를 좌우 스와이프 캐러셀로 */
  .chat-cards {
    display: flex;
    flex-wrap: nowrap;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    scroll-snap-type: x mandatory;   /* 카드 단위로 착 걸리게 */
    gap: 10px;
    padding: 2px 0 10px;
    margin-right: -12px;             /* 다음 카드가 살짝 보이도록 */
    scrollbar-width: none;
  }
  .chat-cards::-webkit-scrollbar { display: none; }
  .chat-cards .chat-card {
    flex: 0 0 78%;                   /* 한 화면에 1장 + 다음 장 살짝 */
    scroll-snap-align: start;
    min-width: 0;
  }
  /* 스와이프 힌트 */
  .chat-cards::after {
    content: '';
    flex: 0 0 12px;
  }
  .chat-card .cc-name { word-break: keep-all; overflow-wrap: anywhere; }
  .swipe-hint { display: block; }
}
button.pl-link { font-family: inherit; cursor: pointer; }
/* 외부 서비스(상조스캔) 이동 버튼 — 내부 키워드와 시각적으로 구분 */
.pl-link.ext, .btn.ext {
  background: rgba(45,212,167,0.10); border-color: rgba(45,212,167,0.40);
  border-style: dashed; color: #5eead4; font-weight: 700; text-decoration: none;
}
.pl-link.ext:hover, .btn.ext:hover { border-color: var(--accent2); background: rgba(45,212,167,0.16); }
.ext-note {
  font-size: 10px; font-weight: 600; opacity: .8; margin-left: 5px;
  padding: 1px 6px; border-radius: 999px; background: rgba(45,212,167,0.16);
}

.co-row { cursor: pointer; }
.co-row:hover { background: var(--panel2); }
.co-link { color: var(--accent); font-weight: 800; }
.co-hero .co-hero-top { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.co-hero .co-name { margin: 0; font-size: 22px; font-weight: 800; letter-spacing: -.4px; }
.co-hero-desc { margin: 8px 0 0; font-size: 14px; line-height: 1.6; color: var(--text); }
.co-hero-desc b { color: var(--accent); }

.scale-badge {
  display: inline-block; margin-left: 6px; padding: 1px 7px; border-radius: 999px;
  font-size: 10px; font-weight: 800; vertical-align: middle;
}
.scale-badge.s-대형 { background: rgba(56,189,248,.20); color: #7dd3fc; }
.scale-badge.s-중형 { background: rgba(129,140,248,.20); color: #a5b4fc; }
.scale-badge.s-소형 { background: var(--panel2); color: var(--muted); }
.scale-badge.s-특화 { background: rgba(45,212,167,.18); color: #5eead4; }
.co-desc { font-size: 11.5px; color: var(--muted); font-weight: 400; margin-top: 3px; line-height: 1.45; white-space: normal; }

/* ── 보험점검 문답 패널 ─────────────────────── */
.pl-link.home {
  background: var(--panel); border-color: var(--line); color: var(--muted); font-weight: 700;
}
.pl-link.home.active {
  background: rgba(56,189,248,.14); border-color: var(--accent); color: #bae6fd;
}

/* 보험점검 — 평소엔 일반 키워드와 동일, 진행 중일 때만 강조 */
.pl-link.ck.active {
  background: rgba(56,189,248,.16);
  border-color: var(--accent);
  color: #bae6fd;
  font-weight: 800;
  box-shadow: 0 0 0 1px rgba(56,189,248,.35) inset;
}

.ck-panel {
  background: var(--panel); border: 1px solid rgba(56,189,248,.35);
  border-radius: 12px; padding: 13px 14px; margin-top: 10px;
}
.ck-progress { display: flex; align-items: center; gap: 4px; margin-bottom: 10px; }
.ck-progress span { flex: 1 1; height: 3px; border-radius: 2px; background: var(--line); }
.ck-progress span.on { background: var(--accent); }
.ck-progress .ck-step {
  flex: 0 0 auto; height: auto; background: none !important;
  font-size: 11px; color: var(--muted); margin-left: 6px;
}
.ck-q { font-size: 15.5px; font-weight: 800; margin-bottom: 4px; }
.ck-hint { font-size: 12.5px; color: var(--muted); margin-bottom: 9px; line-height: 1.5; }
.ck-opts { display: flex; flex-wrap: wrap; gap: 7px; margin-bottom: 9px; }
.ck-opt {
  background: var(--panel2); border: 1px solid var(--line); color: var(--text);
  padding: 9px 13px; border-radius: 999px; font-size: 14px; cursor: pointer; font-family: inherit;
}
.ck-opt:hover { border-color: var(--accent); }
.ck-opt.on { background: var(--accent); color: #06232e; border-color: var(--accent); font-weight: 700; }
.ck-next {
  width: 100%; padding: 11px; border-radius: 10px; font-size: 14.5px; font-weight: 700;
  background: var(--accent2); color: #05231a; border: none; cursor: pointer; font-family: inherit;
}
.ck-cancel {
  width: 100%; margin-top: 7px; padding: 7px; background: none; border: none;
  color: var(--muted); font-size: 12px; cursor: pointer; font-family: inherit;
}
.ck-cancel:hover { color: var(--text); }

/* 하단 고지 문구 — 최소 공간만 차지 */
.disclaimer {
  margin: 5px 0 0 !important;
  font-size: 10.5px;
  opacity: .55;
  text-align: center;
  line-height: 1.3;
}

/* 말풍선 안 문답 */
.q-box { margin-top: 10px; }
.q-hint { font-size: 12.5px; color: var(--muted); margin-bottom: 8px; line-height: 1.5; }
.q-opts { display: flex; flex-wrap: wrap; gap: 7px; }
.q-opt {
  background: var(--panel); border: 1px solid var(--line); color: var(--text);
  padding: 8px 13px; border-radius: 999px; font-size: 13.5px; cursor: pointer; font-family: inherit;
}
.q-opt:hover { border-color: var(--accent); }
.q-opt.on { background: var(--accent); color: #06232e; border-color: var(--accent); font-weight: 700; }
.q-next {
  width: 100%; margin-top: 9px; padding: 10px; border-radius: 10px;
  font-size: 13.5px; font-weight: 700; background: var(--accent2); color: #05231a;
  border: none; cursor: pointer; font-family: inherit;
}

/* 이전 대화 복원 안내 */
.restore-bar {
  display: flex; align-items: center; gap: 8px;
  font-size: 12.5px; color: var(--muted);
  padding: 6px 11px; margin-bottom: 8px; border-radius: 9px;
  background: var(--panel2); border: 1px solid var(--line);
}
.restore-bar button {
  margin-left: auto; background: none; border: 1px solid var(--line);
  color: var(--accent); font-size: 11.5px; font-weight: 700;
  padding: 3px 10px; border-radius: 999px; cursor: pointer; font-family: inherit;
}
.restore-bar button:hover { border-color: var(--accent); }

/* 키워드 줄 래퍼 — 우측 화살표 버튼 배치 */
.kw-wrap {
  position: relative;
  margin-bottom: 14px;
  /* 접기/펴기 — 높이·투명도 함께 부드럽게 */
  max-height: 200px; opacity: 1;
  transition: max-height .28s ease, opacity .2s ease, margin-bottom .28s ease;
}
.kw-wrap.folded {
  max-height: 0; opacity: 0; margin-bottom: 0;
  overflow: hidden; pointer-events: none;
}

/* 메뉴 토글 버튼 */
.kw-toggle { display: inline-flex; align-items: center; gap: 5px; }
.kw-toggle .kw-caret {
  display: inline-block; font-size: 11px; line-height: 1;
  transition: transform .28s ease;
}
.kw-toggle.on .kw-caret { transform: rotate(180deg); }
.kw-toggle.on { border-color: var(--accent); color: var(--accent); }
.kw-arrow {
  position: absolute; top: 50%; transform: translateY(-50%);
  width: 30px; height: 30px; border-radius: 50%;
  background: var(--panel); border: 1px solid var(--line); color: var(--text);
  font-size: 15px; line-height: 1; cursor: pointer; z-index: 3;
  display: flex; align-items: center; justify-content: center;
  box-shadow: 0 2px 10px rgba(0,0,0,.35);
  transition: opacity .2s ease, border-color .2s ease;
}
.kw-arrow:hover { border-color: var(--accent); }
.kw-arrow.left { left: -2px; }
.kw-arrow.right { right: -2px; }
.kw-arrow[hidden] { display: none; }

/* 챗봇 키워드 줄: 화면 크기와 무관하게 항상 한 줄 + 좌우 스와이프 */
.chat-page .pl-links {
  flex-wrap: nowrap;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  scroll-snap-type: x proximity;
  scroll-padding-left: 0;
  padding-bottom: 6px;
  padding-left: 0;
  scrollbar-width: none;
  -ms-overflow-style: none;
  overflow-anchor: none;          /* 스크롤 앵커링으로 위치 밀림 방지 */
  /* 오른쪽 끝을 살짝 페이드시켜 더 있다는 걸 암시 */
  mask-image: linear-gradient(90deg, #000 92%, transparent 100%);
  -webkit-mask-image: linear-gradient(90deg, #000 92%, transparent 100%);
}
.chat-page .pl-links::-webkit-scrollbar { display: none; }
.chat-page .pl-links > * {
  flex: 0 0 auto;
  scroll-snap-align: start;
  white-space: nowrap;
}

/* 전환 확인 다이얼로그 */
.dm.confirm { max-width: 420px; }
.dm.confirm .dm-head { border-bottom: none; padding-bottom: 4px; }
.dm.confirm .dm-title { font-size: 16.5px; line-height: 1.45; }

/* ── 전문가 모드 ───────────────────────────── */
/* 선택된 키워드 */
.pl-link.active {
  background: rgba(56,189,248,.16);
  border-color: var(--accent);
  color: #bae6fd;
  font-weight: 800;
  box-shadow: 0 0 0 1px rgba(56,189,248,.35) inset;
}

/* 모드 표시 바 */
.expert-bar {
  display: flex; align-items: center; gap: 8px;
  font-size: 13.5px; color: #bae6fd; font-weight: 700;
  padding: 7px 12px; margin-bottom: 8px;
  border-radius: 9px;
  background: linear-gradient(90deg, rgba(56,189,248,.16), rgba(45,212,167,.08));
  border: 1px solid rgba(56,189,248,.35);
}
.expert-bar b { color: #fff; }
.expert-bar .dot {
  width: 7px; height: 7px; border-radius: 50%; background: var(--accent2);
  box-shadow: 0 0 0 3px rgba(45,212,167,.22);
  animation: pulse 1.8s ease-in-out infinite;
}
@keyframes pulse { 0%,100% { opacity: 1 } 50% { opacity: .35 } }
.expert-off {
  margin-left: auto; background: none; border: 1px solid var(--line);
  color: var(--muted); font-size: 11px; padding: 3px 9px; border-radius: 999px; cursor: pointer;
}
.expert-off:hover { color: var(--text); border-color: var(--accent); }

/* 전문가 모드일 때 대화창 테두리 강조 */
.chat-box.expert {
  border-color: rgba(56,189,248,.55);
  box-shadow: 0 0 0 1px rgba(56,189,248,.18), 0 0 26px rgba(56,189,248,.10);
}

/* 키워드 안내 문구 */
.kw-guide {
  font-size: 13.5px; color: var(--muted); margin: 2px 0 8px;
  padding: 7px 11px; border-radius: 9px;
  background: linear-gradient(90deg, rgba(56,189,248,.10), rgba(45,212,167,.06));
  border: 1px solid rgba(56,189,248,.18);
}
.kw-guide b { color: var(--accent); font-weight: 800; }

/* 자료실(/lists) 포털 */
.pl-block { background: var(--panel); border: 1px solid var(--line); border-radius: 12px; padding: 16px; margin-bottom: 18px; }
.pl-block h3 { margin: 0 0 12px; font-size: 16px; display: flex; align-items: center; gap: 8px; }
.pl-block h4 { margin: 14px 0 8px; font-size: 13px; color: var(--muted); }
.pl-badge { font-size: 11px; padding: 2px 8px; border-radius: 999px; font-weight: 700; }
.pl-badge.life { background: rgba(99,102,241,0.2); color: #a5b4fc; }
.pl-badge.nonlife { background: rgba(245,158,11,0.18); color: #fbbf24; }
.pl-scroll { overflow-x: auto; }
.pl-table { width: 100%; border-collapse: collapse; font-size: 13px; min-width: 620px; }
.pl-table th, .pl-table td { border-bottom: 1px solid var(--line); padding: 9px 10px; text-align: left; white-space: nowrap; }
.pl-table th { color: var(--muted); font-weight: 600; position: -webkit-sticky; position: sticky; top: 0; background: var(--panel); }
.pl-table tbody tr:hover { background: var(--panel2); }
.pl-co { font-weight: 700; }
.pl-muted { color: var(--muted); }
.pl-linkgroup { margin-bottom: 6px; }
.pl-links { display: flex; flex-wrap: wrap; gap: 8px; }
.pl-link { display: inline-block; transition: background .2s ease, border-color .2s ease, color .2s ease; background: var(--panel2); border: 1px solid var(--line); color: var(--text); padding: 9px 13px; border-radius: 9px; font-size: 14px; text-decoration: none; }
.pl-link:hover { border-color: var(--accent); }
.pl-link.off { color: var(--muted); opacity: 0.55; cursor: default; }


/* ── 상품 상세 페이지 ── */
.pd-hero { padding: 18px; }
.pd-title { font-size: 21px; font-weight: 800; line-height: 1.32; margin: 0 0 6px; }
.pd-sub { font-size: 13.5px; color: var(--muted); }
.pd-sub a { color: var(--accent); text-decoration: none; font-weight: 700; }
.pd-sub a:hover { text-decoration: underline; }
.pd-actions {
  /* .card 가 column 이므로 반드시 row 로 되돌린다(안 그러면 flex-basis가 '높이'가 된다) */
  display: flex; flex-direction: row; flex-wrap: wrap;
  align-items: center; gap: 8px; padding: 14px;
}
.pd-actions .dm-btn { flex: 0 1 auto; min-width: 132px; padding: 10px 16px; font-size: 14px; }
.pd-actions .dm-btn.primary { flex: 0 1 auto; }
.pd-cov-detail {
  padding: 10px 12px 12px; margin: -2px 0 8px;
  background: rgba(255,255,255,.03);
  border: 1px solid var(--line); border-top: none;
  border-radius: 0 0 10px 10px;
}

/* 채팅 카드 '자세히 보기' */
.cc-detail {
  display: inline-block; margin-top: 8px;
  font-size: 12.5px; font-weight: 700; text-decoration: none;
  color: var(--accent); border: 1px solid var(--accent);
  border-radius: 8px; padding: 5px 10px;
  transition: background .15s ease, color .15s ease;
}
.cc-detail:hover { background: var(--accent); color: #06121b; }

@media (max-width: 760px) {
  .pd-title { font-size: 18.5px; }
  .pd-actions { flex-direction: column; align-items: stretch; }
  .pd-actions .dm-btn { width: 100%; min-width: 0; }
}


/* ── 답변 피드백 (챗봇 내) ── */
.fb { display: flex; align-items: center; gap: 6px; flex-wrap: wrap;
      margin-top: 10px; padding-top: 9px; border-top: 1px dashed var(--line); }
.fb-q { font-size: 12px; color: var(--muted); }
.fb-btn { background: transparent; color: var(--muted); border: 1px solid var(--line);
          border-radius: 8px; padding: 4px 9px; font-size: 12.5px; cursor: pointer; }
.fb-btn:hover { border-color: var(--accent); color: var(--accent); }
.fb-btn.send { background: var(--accent); color: #06121b; border-color: var(--accent); font-weight: 700; }
.fb-btn:disabled { opacity: .5; cursor: default; }
.fb-form { display: flex; flex-direction: column; gap: 6px; width: 100%; }
.fb-done { margin-top: 10px; padding-top: 9px; border-top: 1px dashed var(--line);
           font-size: 12px; color: var(--accent2); }

/* ── 대화 검수 화면 ── */
.rv-days { width: auto; padding: 6px 8px; font-size: 13px; }
.rv-stats { padding: 14px; }
.rv-fix { margin-top: 10px; display: flex; flex-direction: column; gap: 4px; }
.rv-fix-row { font-size: 12.5px; display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }
.rv-fix-row b { color: #f87171; }
.rv-n { color: var(--muted); }
.rv-where { color: var(--accent); font-family: ui-monospace, monospace; font-size: 11.5px; }

.rv-layout { display: grid; grid-template-columns: 300px 1fr; grid-gap: 12px; gap: 12px; align-items: start; }
.rv-list { padding: 12px; max-height: 74vh; overflow-y: auto; }
.rv-item { display: block; width: 100%; text-align: left; cursor: pointer;
           background: transparent; border: 1px solid var(--line); border-radius: 10px;
           padding: 8px 10px; margin-bottom: 6px; color: inherit; }
.rv-item:hover { border-color: var(--accent); }
.rv-item.on { border-color: var(--accent); background: rgba(56,189,248,.08); }
.rv-item-top { display: flex; justify-content: space-between; font-size: 11.5px; color: var(--muted); }
.rv-turns { color: var(--accent); font-weight: 700; }
.rv-preview { font-size: 12.5px; margin-top: 3px; line-height: 1.4;
              display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }

.rv-detail { display: flex; flex-direction: column; gap: 10px; }
.rv-turn { padding: 12px; border-left: 3px solid var(--line); }
.rv-turn.good { border-left-color: var(--accent2); }
.rv-turn.bad { border-left-color: #f87171; }
.rv-turn-head { display: flex; gap: 6px; align-items: center; flex-wrap: wrap; margin-bottom: 7px; }
.rv-time { font-size: 11.5px; color: var(--muted); }
.rv-q { font-size: 14.5px; font-weight: 700; margin-bottom: 4px; }
.rv-top { font-size: 12px; color: var(--muted); margin-bottom: 6px; }
.rv-answer { border: 1px solid var(--line); border-radius: 10px; padding: 10px 12px;
             margin-top: 6px; max-height: 340px; overflow-y: auto; font-size: 13px; }
.rv-actions { display: flex; gap: 6px; margin-top: 8px; }
.rv-form { display: flex; flex-direction: column; gap: 6px; margin-top: 10px;
           border-top: 1px dashed var(--line); padding-top: 10px; }
.rv-fb-saved { margin-top: 8px; font-size: 12.5px; color: var(--muted);
               display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }
.rv-fb-saved b { color: #f87171; }
.rv-expect { width: 100%; color: var(--accent2); }

@media (max-width: 860px) {
  .rv-layout { grid-template-columns: 1fr; }
  .rv-list { max-height: 260px; }
}


/* 검수 화면 — 비용 */
.rv-cost { padding: 14px; }
.rv-days-cost { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 10px; }
.rv-day { font-size: 11.5px; color: var(--muted); border: 1px solid var(--line);
          border-radius: 8px; padding: 3px 8px; }
.rv-day b { color: var(--accent2); font-weight: 700; }
.rv-day i { font-style: normal; opacity: .7; margin-left: 3px; }
.rv-note { margin-top: 9px; font-size: 11px; color: var(--muted); line-height: 1.5; }
.rv-cost-tag { font-size: 11px; font-weight: 700; color: var(--accent2);
               border: 1px solid var(--accent2); border-radius: 6px; padding: 1px 6px;
               font-family: ui-monospace, monospace; }

.rv-tok { font-family: ui-monospace, monospace; font-size: 13px; }
.rv-tok span { opacity: .45; margin: 0 1px; }
.rv-tok b { color: var(--accent2); }
.rv-tok-tag { font-size: 11px; color: var(--muted); font-family: ui-monospace, monospace;
              border: 1px solid var(--line); border-radius: 6px; padding: 1px 6px; }
.rv-tok-tag b { color: var(--fg, inherit); }
.rv-cut { font-size: 11px; font-weight: 700; color: #fbbf24;
          border: 1px solid #fbbf24; border-radius: 6px; padding: 1px 6px; }
.rv-warn { margin-top: 9px; font-size: 12px; color: #fbbf24; }

/* 검수 화면 — 모델 표시 */
.rv-models { display: flex; flex-direction: column; gap: 5px; margin-top: 10px; }
.rv-model { display: flex; gap: 9px; align-items: center; flex-wrap: wrap;
            font-size: 11.5px; color: var(--muted);
            border: 1px solid var(--line); border-radius: 8px; padding: 5px 9px; }
.rv-model b { color: var(--accent); font-size: 12.5px; }
.rv-price { font-family: ui-monospace, monospace; opacity: .75; }
.rv-model-cost { margin-left: auto; color: var(--accent2); font-weight: 700;
                 font-family: ui-monospace, monospace; }
.rv-model-tag { font-size: 11px; font-weight: 700; color: var(--accent);
                border: 1px solid var(--accent); border-radius: 6px; padding: 1px 6px; }

/* 검수 화면 — 모델 선택 */
.rv-modelpick { padding: 14px; }
.rv-picks { display: flex; flex-wrap: wrap; gap: 8px; }
.rv-pick {
  flex: 1 1 260px; text-align: left; cursor: pointer; font-family: inherit;
  background: var(--panel2); border: 1px solid var(--line); border-radius: 10px;
  padding: 10px 12px; color: inherit;
  transition: border-color .15s ease, background .15s ease;
}
.rv-pick:hover:not(:disabled) { border-color: var(--accent); }
.rv-pick.on { border-color: var(--accent2); background: rgba(45,212,167,.08); cursor: default; }
.rv-pick:disabled:not(.on) { opacity: .6; cursor: default; }
.rv-pick-top { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.rv-pick-top b { font-size: 14.5px; }
.rv-pick-price { font-size: 11.5px; font-family: ui-monospace, monospace; color: var(--muted); }
.rv-pick-now { font-size: 10.5px; font-weight: 800; color: #05231a; background: var(--accent2);
               border-radius: 999px; padding: 1px 8px; }
.rv-pick-desc { font-size: 12px; color: var(--muted); margin-top: 4px; line-height: 1.5; }
.rv-pick-tag { display: inline-block; margin-top: 6px; font-size: 10.5px; font-weight: 700;
               color: var(--accent); border: 1px solid var(--line); border-radius: 6px; padding: 1px 7px; }


/* ── 검색 결과 카드 다듬기 ── */
.cards { grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 14px; }
.card { padding: 15px 16px; gap: 7px; transition: border-color .15s ease, transform .15s ease; }
.card:hover { transform: translateY(-1px); }
.card .top { margin-bottom: 1px; }
.card .name { font-size: 15.5px; line-height: 1.4; word-break: keep-all;
              display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;
              overflow: hidden; min-height: 2.8em; }
.card .co { font-size: 12.5px; }
.card .tags { margin-top: 1px; }

/* 핵심 수치 3칸 — 카드마다 같은 높이 */
.pc-figs {
  display: grid; grid-template-columns: 1.25fr 1fr .7fr; grid-gap: 8px; gap: 8px;
  margin-top: auto; padding: 9px 0 2px; border-top: 1px solid var(--line);
}
.pc-fig { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.pc-fig .k { font-size: 10.5px; color: var(--muted); letter-spacing: .2px; }
.pc-fig .v { font-size: 13.5px; font-weight: 800; white-space: nowrap;
             overflow: hidden; text-overflow: ellipsis; }
.pc-fig .v em { font-style: normal; font-weight: 500; color: var(--muted); font-size: 12px; }
.pc-fig .v b.good { color: var(--accent2); }
.pc-fig .v b.bad { color: #fbbf24; }
.pc-fig .v i { font-style: normal; font-weight: 500; font-size: 10.5px;
               color: var(--muted); margin-left: 4px; }

.pc-foot { display: flex; align-items: center; gap: 8px; padding-top: 8px; }
.pc-more { font-size: 12.5px; font-weight: 700; color: var(--accent); cursor: pointer; }
.pc-more:hover { text-decoration: underline; }
.pc-ext { margin-left: auto; font-size: 14px; text-decoration: none; opacity: .55;
          border: 1px solid var(--line); border-radius: 7px; padding: 2px 7px; line-height: 1.4; }
.pc-ext + .pc-ext { margin-left: 0; }
.pc-ext:hover { opacity: 1; border-color: var(--accent); }

/* 비교 체크 — 눈에 덜 띄게 */
.card .chk { font-size: 11.5px; opacity: .55; }
.card:hover .chk, .card .chk:has(input:checked) { opacity: 1; }

/* ── 왼쪽 필터 — 내부 스크롤 대신 접기 ── */
.facet ul { max-height: none; overflow: visible; }
.facet ul.collapsed li:nth-child(n+7) { display: none; }
.facet-more {
  margin-top: 5px; background: none; border: none; cursor: pointer; font-family: inherit;
  color: var(--accent); font-size: 11.5px; font-weight: 700; padding: 3px 0;
}
.facet-more:hover { text-decoration: underline; }
.facet h4 { font-size: 11px; margin-bottom: 6px; }
.facet li { font-size: 12.5px; padding: 5px 8px; }

/* ── 상단 툴바 정리 ── */
.toolbar { gap: 8px; margin-bottom: 16px; }
.toolbar .search { min-width: 280px; padding: 11px 14px; font-size: 15px; }
.toolbar .btn, .toolbar select { padding: 9px 12px; font-size: 13.5px; }
.stat { margin: 4px 0 14px; }
.result-count { font-size: 13px; color: var(--muted); margin-bottom: 12px; }
.result-count b { color: var(--text); font-size: 15px; }

@media (max-width: 880px) {
  .cards { grid-template-columns: 1fr; }
  .pc-figs { grid-template-columns: 1fr 1fr .8fr; }
}


/* 확인 다이얼로그 — 두 갈래 선택지는 나란히 같은 비중으로 */
.dm.confirm .dm-actions { grid-template-columns: 1fr; gap: 7px; }
.dm.confirm .dm-btn {
  grid-column: 1 / -1 !important;
  white-space: normal; word-break: keep-all; line-height: 1.45;
  padding: 13px 14px; text-align: center;
}
/* '계속 묻기'도 선택지이므로 흐리게 두지 않는다 */
.dm.confirm .dm-btn.ghost {
  background: var(--panel2); color: var(--text); border-color: var(--line);
}
.dm.confirm .dm-btn.ghost:hover { border-color: var(--accent); color: var(--accent); }
.dm.confirm .dm-sub { line-height: 1.65; }

/* 채팅 상품 캐러셀 — 화살표를 카드 위에 띄운다 */
.cc-wrap { position: relative; }
.cc-wrap > .kw-arrow { top: calc(50% - 6px); }
@media (hover: none) { .cc-wrap > .kw-arrow { display: none; } }  /* 터치 기기는 스와이프로 충분 */


/* ── 홈 랜딩 ── */
.hm-h {
  font-size: 16px; font-weight: 800; margin: 26px 0 12px;
  display: flex; align-items: baseline; gap: 10px;
}
.hm-more { margin-left: auto; font-size: 12.5px; font-weight: 700; color: var(--accent); text-decoration: none; }
.hm-more:hover { text-decoration: underline; }
.hm-note { font-size: 12.5px; color: var(--muted); line-height: 1.6; margin: -4px 0 12px; }

/* 규모 */
.hm-stats { display: flex; flex-wrap: wrap; gap: 8px; margin: 14px 0 4px; }
.hm-stat {
  flex: 1 1 130px; background: var(--panel); border: 1px solid var(--line);
  border-radius: 12px; padding: 13px 15px;
}
.hm-stat b { display: block; font-size: 23px; font-weight: 800; letter-spacing: -.5px; color: var(--accent); }
.hm-stat span { font-size: 12px; color: var(--muted); }
.hm-stat.dim b { color: var(--muted); }

/* 기능 */
.hm-feats { display: grid; grid-template-columns: repeat(auto-fill, minmax(268px, 1fr)); grid-gap: 10px; gap: 10px; }
.hm-feat {
  display: flex; gap: 12px; align-items: flex-start; text-decoration: none; color: inherit;
  background: var(--panel); border: 1px solid var(--line); border-radius: 12px; padding: 14px 15px;
  transition: border-color .15s ease, transform .15s ease;
}
.hm-feat:hover { border-color: var(--accent); transform: translateY(-1px); }
.hm-feat.on { border-color: rgba(45,212,167,.45); background: linear-gradient(180deg, rgba(45,212,167,.07), var(--panel)); }
.hm-feat-icon { font-size: 22px; line-height: 1.2; }
.hm-feat-body { min-width: 0; }
.hm-feat-title { font-size: 14.5px; font-weight: 800; display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.hm-feat-tag { font-size: 10px; font-weight: 700; color: var(--muted);
               border: 1px solid var(--line); border-radius: 999px; padding: 1px 7px; }
.hm-feat-desc { font-size: 12.5px; color: var(--muted); margin-top: 3px; line-height: 1.5; word-break: keep-all; }

/* 대분류 */
.hm-cats { display: grid; grid-template-columns: repeat(auto-fill, minmax(250px, 1fr)); grid-gap: 8px; gap: 8px; }
.hm-cat {
  display: flex; align-items: center; gap: 10px; text-decoration: none; color: inherit;
  background: var(--panel); border: 1px solid var(--line); border-radius: 10px; padding: 11px 13px;
}
.hm-cat:hover { border-color: var(--accent); }
.hm-cat-icon { font-size: 17px; }
.hm-cat-body { display: flex; flex-direction: column; min-width: 0; }
.hm-cat-body b { font-size: 13.5px; font-weight: 700; }
.hm-cat-body i { font-style: normal; font-size: 11.5px; color: var(--muted); margin-top: 1px; }
.hm-cat-n { margin-left: auto; font-size: 13px; font-weight: 800; color: var(--accent); font-feature-settings: "tnum"; font-variant-numeric: tabular-nums; }

/* 보험사 */
.hm-cos { display: grid; grid-template-columns: repeat(auto-fill, minmax(232px, 1fr)); grid-gap: 9px; gap: 9px; }
.hm-co {
  text-decoration: none; color: inherit; background: var(--panel);
  border: 1px solid var(--line); border-radius: 11px; padding: 12px 13px;
}
.hm-co:hover { border-color: var(--accent); }
.hm-co-top { display: flex; align-items: center; gap: 7px; }
.hm-co-top b { font-size: 14px; font-weight: 800; }
.hm-co-bar { height: 5px; border-radius: 3px; background: var(--panel2); margin: 9px 0 7px; overflow: hidden; }
.hm-co-bar span { display: block; height: 100%; border-radius: 3px;
                  background: linear-gradient(90deg, var(--accent), var(--accent2)); }
.hm-co-figs { display: flex; flex-wrap: wrap; gap: 9px; font-size: 11.5px; color: var(--muted); }
.hm-co-figs b { color: var(--accent2); }

@media (max-width: 760px) {
  .hm-stat { flex: 1 1 44%; padding: 11px 12px; }
  .hm-stat b { font-size: 19px; }
  .hm-feats, .hm-cats, .hm-cos { grid-template-columns: 1fr; }
}


/* ── 등록·소멸 추세 ── */
.hm-stat b.up { color: var(--accent2); }
.hm-stat b.down { color: #f87171; }
.tr-summary {
  background: var(--panel); border: 1px solid var(--line); border-radius: 12px;
  padding: 13px 15px; font-size: 14px; line-height: 1.75; margin-top: 10px;
}
.tr-summary b { font-weight: 800; }
.tr-summary .up, .up { color: var(--accent2); }
.tr-summary .down, .down { color: #f87171; }

.tr-chart { display: flex; flex-direction: column; gap: 7px; }
.tr-row { display: flex; align-items: center; gap: 10px; }
.tr-label { flex: 0 0 46px; font-size: 11.5px; color: var(--muted); font-feature-settings: "tnum"; font-variant-numeric: tabular-nums; }
.tr-bars { flex: 1 1 auto; display: flex; flex-direction: column; gap: 3px; min-width: 0; }
.tr-bar { height: 15px; border-radius: 4px; position: relative; min-width: 2px;
          display: flex; align-items: center; transition: width .3s ease; }
.tr-bar.up { background: linear-gradient(90deg, rgba(45,212,167,.85), rgba(45,212,167,.45)); }
.tr-bar.down { background: linear-gradient(90deg, rgba(248,113,113,.85), rgba(248,113,113,.4)); }
.tr-bar i { font-style: normal; font-size: 10.5px; font-weight: 800; color: #06121b;
            padding-left: 6px; white-space: nowrap; }
.tr-net { flex: 0 0 46px; text-align: right; font-size: 12.5px; font-weight: 800;
          font-feature-settings: "tnum";
          font-variant-numeric: tabular-nums; }

.tr-groups { display: grid; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); grid-gap: 8px; gap: 8px; }
.tr-group { display: flex; align-items: center; gap: 9px; text-decoration: none; color: inherit;
            background: var(--panel); border: 1px solid var(--line); border-radius: 10px; padding: 10px 12px; }
.tr-group:hover { border-color: var(--accent); }
.tr-group b { font-size: 13px; font-weight: 700; }
.tr-g-figs { margin-left: auto; display: flex; gap: 7px; font-size: 11.5px; }
.tr-g-figs i { font-style: normal; font-weight: 700; }

.tr-lists { display: grid; grid-template-columns: 1fr 1fr; grid-gap: 16px; gap: 16px; }
.tr-items { display: flex; flex-direction: column; gap: 5px; }
.tr-item { display: flex; gap: 10px; text-decoration: none; color: inherit;
           background: var(--panel); border: 1px solid var(--line); border-radius: 9px; padding: 9px 11px; }
.tr-item:hover { border-color: var(--accent); }
.tr-item.off { opacity: .72; border-style: dashed; }
.tr-item.off b { text-decoration: line-through; }
.tr-date { flex: 0 0 38px; font-size: 11px; color: var(--muted); font-feature-settings: "tnum"; font-variant-numeric: tabular-nums; padding-top: 2px; }
.tr-item-body { min-width: 0; display: flex; flex-direction: column; }
.tr-item-body b { font-size: 13px; font-weight: 700; line-height: 1.4; word-break: keep-all;
                  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.tr-item-body i { font-style: normal; font-size: 11.5px; color: var(--muted); margin-top: 2px; }

@media (max-width: 860px) {
  .tr-lists { grid-template-columns: 1fr; }
  .tr-groups { grid-template-columns: 1fr; }
}

.rv-sid { display: flex; align-items: center; gap: 10px; flex-wrap: wrap;
          font-size: 12px; color: var(--muted); padding: 2px 2px 4px; }
.rv-sid b { color: var(--text); font-family: ui-monospace, monospace; }
.rv-sid a { color: var(--accent); text-decoration: none; font-weight: 700; }
.rv-sid a:hover { text-decoration: underline; }

/* 말풍선 → 전체 결과 */
.cc-all {
  display: block; text-align: center; margin-top: 6px;
  font-size: 12.5px; font-weight: 700; text-decoration: none; color: var(--accent);
  border: 1px dashed var(--accent); border-radius: 9px; padding: 8px 10px;
  transition: background .15s ease;
}
.cc-all:hover { background: rgba(56,189,248,.1); }
.cc-all b { color: var(--accent2); }

/* 결과 전용 화면 */
.rs-head { margin: 6px 0 14px; }
.rs-q { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.rs-q-label { font-size: 11px; color: var(--muted); border: 1px solid var(--line);
              border-radius: 6px; padding: 1px 7px; }
.rs-q b { font-size: 16px; font-weight: 800; }
.rs-expert { font-size: 11.5px; font-weight: 700; color: #bae6fd;
             background: rgba(56,189,248,.16); border-radius: 999px; padding: 2px 9px; }
.rs-count { font-size: 13px; color: var(--muted); margin-top: 6px; }
.rs-count b { color: var(--text); font-size: 15px; }
.rs-field { margin-left: 6px; }


/* 표 머리글 정렬 */
.th-sort { cursor: pointer; -webkit-user-select: none; -moz-user-select: none; user-select: none; white-space: nowrap;
           transition: color .15s ease; }
.th-sort:hover { color: var(--accent); }
.th-sort.on { color: var(--accent); }
.th-arrow { margin-left: 5px; font-size: 9.5px; opacity: .45; }
.th-sort.on .th-arrow { opacity: 1; }


/* ── 모홈 벤치마킹 ── */
.bn-lock { padding: 26px 20px; align-items: flex-start; max-width: 520px; }
.bn-lock-icon { font-size: 30px; }
.bn-list { display: flex; flex-direction: column; gap: 8px; }
.bn-item { padding: 0; gap: 0; }
.bn-item.open { border-color: var(--accent); }
.bn-head { display: flex; align-items: center; gap: 10px; padding: 11px 14px; cursor: pointer; flex-wrap: wrap; }
.bn-q { font-size: 14px; flex: 1 1 260px; line-height: 1.45; word-break: keep-all; }
.bn-meta { font-size: 11.5px; color: var(--muted); white-space: nowrap; }
.bn-caret { font-size: 10px; color: var(--muted); }
.bn-body { border-top: 1px dashed var(--line); padding: 12px 14px 14px; }
.bn-answer { font-size: 13.5px; line-height: 1.7; max-height: 520px; overflow-y: auto;
             border: 1px solid var(--line); border-radius: 10px; padding: 10px 12px; background: var(--panel2); }
.bn-sug { margin-top: 10px; display: flex; flex-wrap: wrap; gap: 5px; align-items: center; }
.bn-actions { margin-top: 10px; }