/* SAFE U WORKS · 보건 AX — UI-TOKENS.md 정본 이식 (action-status-board 계승) */

/* ── 기초 ───────────────────────────────────────────── */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
@font-face{font-family:'Wanted Sans';src:url('/assets/fonts/WantedSansVariable.woff2') format('woff2-variations');font-weight:100 900;font-style:normal;font-display:swap}
@font-face{font-family:'Pretendard';src:url('/assets/fonts/PretendardVariable.woff2') format('woff2-variations');font-weight:45 920;font-style:normal;font-display:swap}
body{font-family:'Wanted Sans','Pretendard','Apple SD Gothic Neo',-apple-system,sans-serif;background:#F0F1F3;color:#222;font-size:15px;line-height:1.6;-webkit-font-smoothing:antialiased}
button,input,select,textarea{font-family:inherit;font-size:inherit;color:inherit}
button{background:none;border:none;cursor:pointer}
[hidden]{display:none !important}
h1,h2,h3,h4{font-weight:800;letter-spacing:-.02em}
ol,ul{list-style:none}
::-webkit-scrollbar{width:9px;height:9px}
::-webkit-scrollbar-thumb{background:#D5D9E0;border-radius:5px;border:2px solid transparent;background-clip:padding-box}
::-webkit-scrollbar-thumb:hover{background:#BCC3D1;background-clip:padding-box;border:2px solid transparent}
::-webkit-scrollbar-track{background:transparent}

.ic{display:inline-flex;align-items:center;justify-content:center;width:16px;height:16px;flex:none;color:currentColor}
.ic svg{width:100%;height:100%;display:block}
.ic14{width:14px;height:14px}
.ic18{width:18px;height:18px}
.ic20{width:20px;height:20px}

/* ── 헤더 ───────────────────────────────────────────── */
.hd{position:sticky;top:0;z-index:60;background:#fff;border-bottom:1px solid #E8EBF0}
.hd-in{max-width:1440px;margin:0 auto;height:62px;padding:0 20px;display:flex;align-items:center;gap:14px}
.hd-logo{height:22px;width:auto;display:block}
.hd-div{width:1px;height:20px;background:#E5E8EB}
.hd-name{display:flex;align-items:baseline;gap:9px;min-width:0}
.hd-name strong{font-size:16px;font-weight:800;letter-spacing:-.02em;color:#222}
.hd-name span{font-size:12.5px;color:#9A9DA4;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.hd-right{margin-left:auto;display:flex;align-items:center;gap:10px}
.hd-health{display:inline-flex;align-items:center;gap:6px;font-size:12px;font-weight:700;color:#9A9DA4}
.hd-health i{width:6px;height:6px;border-radius:50%;background:#BCC3D1;flex:none}
.hd-health.ok i{background:#1F66F1}
.hd-health.ok b{color:#5A5F68}
.hd-health.off i{background:#D5D9E0}
.hd-health b{font-weight:700}
.hd-intro{display:inline-flex;align-items:center;gap:6px;border:1px solid #E5E8EB;background:#fff;border-radius:8px;padding:6px 11px;font-size:12.5px;font-weight:700;color:#5A5F68;transition:.13s}
.hd-intro:hover{border-color:#C7DDFF;color:#1F66F1;background:#F7FAFF}
.hd-intro .ic{color:#BCC3D1}
.hd-intro:hover .ic{color:#1F66F1}

/* 뷰 스위처 세그먼트 (헤더 중앙 고정) */
.hd-in{position:relative}
.hd-seg{position:absolute;left:50%;transform:translateX(-50%);width:270px}
.seg{display:flex;background:#F0F1F3;border-radius:9px;padding:3px;gap:2px}
.sg{flex:1;border:none;background:none;border-radius:8px;padding:7px 8px;font-size:13.5px;font-weight:700;color:#5A5F68;cursor:pointer;transition:.13s}
.sg:hover{color:#222}
.sg.on{background:#fff;color:#222;box-shadow:0 1px 3px rgba(0,0,0,.09)}

/* ── 레이아웃 ───────────────────────────────────────── */
.view[hidden]{display:none !important}
body.v-chat{overflow:hidden}
.page{max-width:1180px;margin:0 auto;padding:24px 20px 72px}
.wrap{max-width:1440px;margin:0 auto;padding:16px 20px 20px;display:grid;grid-template-columns:minmax(0,1fr) 392px;gap:18px;height:calc(100vh - 62px)}
.chat{background:#fff;border-radius:14px;box-shadow:0 1px 3px rgba(0,0,0,.05);display:flex;flex-direction:column;min-width:0;min-height:0;overflow:hidden}
.agent{display:flex;flex-direction:column;gap:12px;min-height:0;overflow-y:auto;padding-right:3px}

/* ── 퀵칩 행 ────────────────────────────────────────── */
.qc{display:flex;align-items:flex-start;gap:11px;padding:13px 22px;border-bottom:1px solid #F0F1F3;background:#fff}
.qc-lb{font-size:11.5px;font-weight:800;color:#9A9DA4;padding-top:6px;white-space:nowrap;letter-spacing:-.01em}
.qc-row{display:flex;flex-wrap:wrap;gap:6px;min-width:0}
.pchip{border:1px solid #E5E8EB;background:#fff;border-radius:999px;padding:5px 11px;font-size:11.5px;font-weight:700;color:#5A5F68;cursor:pointer;display:inline-flex;align-items:center;gap:5px;transition:.13s}
.pchip:hover{border-color:#9A9DA4;color:#222}
.pchip.on{background:#191F28;border-color:#191F28;color:#fff}
.pchip:disabled{opacity:.45;cursor:default}
.pchip:disabled:hover{border-color:#E5E8EB;color:#5A5F68}
.pchip .ic{color:#BCC3D1}
.pchip:hover .ic{color:#5A5F68}
.qcw{display:inline-flex}
.qinfo{display:inline-flex;align-items:center;justify-content:center;width:16px;height:16px;border-radius:50%;margin-left:2px;opacity:0;transition:.13s}
.qinfo .ic{width:13px;height:13px;color:#BCC3D1}
.pchip:hover .qinfo,.qinfo:focus{opacity:1}
.qinfo:hover{background:#E8F1FF}
.qinfo:hover .ic{color:#1F66F1}
.pchip:disabled .qinfo{display:none}

/* ── 스트림 ─────────────────────────────────────────── */
.stream{flex:1;overflow-y:auto;padding:22px 26px 10px;scroll-behavior:smooth}
.turn{margin-bottom:26px}
.turn:last-child{margin-bottom:10px}

/* 사용자 말풍선 */
.u-row{display:flex;justify-content:flex-end;margin-bottom:22px}
.u-bub{background:#0F172A;color:#fff;border-radius:18px 18px 4px 18px;padding:11px 14px;font-size:13.5px;font-weight:500;line-height:1.55;max-width:72%;word-break:break-word;white-space:pre-wrap}
.u-thumb{display:block;margin-bottom:8px;border-radius:10px;max-width:180px;max-height:130px;object-fit:cover;border:1px solid rgba(255,255,255,.18)}

/* 인트로 */
.intro{border:1px solid #E8EBF0;border-radius:14px;padding:20px 22px 18px;background:linear-gradient(180deg,#F7FAFF 0%,#fff 62%)}
.intro h3{font-size:17px;color:#222;margin-bottom:6px}
.intro p{font-size:13.5px;color:#5A5F68;line-height:1.65}
.intro-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin-top:14px}
.intro-it{display:flex;align-items:flex-start;gap:9px;background:#fff;border:1px solid #E8EBF0;border-radius:10px;padding:11px 13px}
.intro-it .ic{color:#1F66F1;margin-top:4px}
.intro-it b{display:block;font-size:13px;font-weight:800;color:#222;letter-spacing:-.02em}
.intro-it span{display:block;font-size:12px;color:#9A9DA4;margin-top:2px;line-height:1.5}

/* ── 진행 접힌 줄 (UX-PATTERNS A-2) ─────────────────── */
.prog{display:inline-flex;align-items:center;gap:9px;border:1px solid #E5E8EB;background:#FAFBFC;border-radius:999px;padding:6px 13px 6px 11px;font-size:12.5px;font-weight:700;color:#5A5F68;margin-bottom:12px;transition:.13s}
.prog:hover{border-color:#C7DDFF;background:#F7FAFF;color:#1F66F1}
.prog.run{border-color:#C7DDFF;background:#F7FAFF;color:#1F66F1}
.prog .chev{font-size:11px;color:#BCC3D1;transition:transform .15s}
.prog.open .chev{transform:rotate(90deg)}
.spin{width:14px;height:14px;border:2px solid #E2E8F0;border-top-color:#1F66F1;border-radius:50%;animation:spin .7s linear infinite;flex:none}
@keyframes spin{to{transform:rotate(360deg)}}
.prog .dot-ok{width:14px;height:14px;border-radius:50%;background:#E8F1FF;color:#1F66F1;display:inline-flex;align-items:center;justify-content:center;flex:none}
.prog.halt .dot-ok{background:#F0F1F3;color:#9A9DA4}
.prog .dot-ok .ic{width:10px;height:10px}
.prog-list{border:1px solid #E8EBF0;border-radius:12px;padding:6px 4px;margin:-4px 0 14px;background:#FAFBFC}
.prog-list li{display:flex;align-items:flex-start;gap:9px;padding:7px 11px;font-size:12.5px;color:#5A5F68;line-height:1.5}
.prog-list li b{color:#222;font-weight:700}
.prog-list li .ic{color:#BCC3D1;margin-top:4px}

/* ── AI 답변 블록 (A-1 3중 신호) ────────────────────── */
.ans{position:relative;border-radius:4px 18px 18px 18px;padding:16px 20px 14px;background:linear-gradient(180deg,#F7FAFF 0%,#FDFEFF 46%,#fff 100%);border:1px solid #E8EBF0}
.eyebrow{display:flex;align-items:center;gap:7px;margin-bottom:9px}
.eyebrow .spark{width:15px;height:15px;flex:none}
.eyebrow .spark svg{width:100%;height:100%;display:block}
.eyebrow .lb{font-size:11.5px;font-weight:800;letter-spacing:-.01em;background:linear-gradient(90deg,#1F66F1,#5B8DEF);-webkit-background-clip:text;background-clip:text;color:transparent}
.eyebrow .ai{margin-left:auto;font-size:11px;font-weight:700;color:#BCC3D1;border:1px solid #E8EBF0;border-radius:6px;padding:1px 6px;background:#fff}
.ans-body{font-size:14.5px;color:#222;line-height:1.72}
.ans-body p{margin:0 0 11px}
.ans-body p:last-child{margin-bottom:0}
.ans-body strong{font-weight:800}
.ans-body ul,.ans-body ol{margin:0 0 11px;padding-left:2px}
.ans-body li{position:relative;padding-left:14px;margin-bottom:5px;color:#222}
.ans-body ul li::before{content:'';position:absolute;left:3px;top:11px;width:4px;height:4px;border-radius:50%;background:#BCC3D1}
.ans-body ol{counter-reset:n}
.ans-body ol li{counter-increment:n;padding-left:20px}
.ans-body ol li::before{content:counter(n) '.';position:absolute;left:2px;top:0;font-size:12.5px;font-weight:800;color:#1F66F1}
.ans-body h4{font-size:14px;margin:14px 0 7px}
.ans-body code{background:#F5F7FA;border:1px solid #E8EBF0;border-radius:5px;padding:1px 5px;font-size:12.5px}
.ans-body .tbl{overflow-x:auto;margin:0 0 12px;border:1px solid #E8EBF0;border-radius:10px}
.ans-body table{width:100%;border-collapse:collapse;font-size:12.5px}
.ans-body th{background:#F5F7FA;text-align:left;font-weight:800;color:#5A5F68;padding:8px 11px;border-bottom:1px solid #E8EBF0;white-space:nowrap}
.ans-body td{padding:8px 11px;border-bottom:1px solid #F0F1F3;color:#222}
.ans-body tr:last-child td{border-bottom:none}
.caret{display:inline-block;width:2px;height:15px;background:#1F66F1;vertical-align:-2px;margin-left:2px;animation:blink .9s steps(1) infinite}
@keyframes blink{50%{opacity:0}}
.ans-limit{margin-top:12px;padding-top:11px;border-top:1px dashed #E8EBF0;font-size:12px;color:#9A9DA4;line-height:1.55}

/* 출처 덩어리 (A-8) */
.srcblk{margin-top:12px}
.srcbtn{display:inline-flex;align-items:center;gap:8px;border:1px solid #E5E8EB;background:#fff;border-radius:999px;padding:5px 12px 5px 9px;font-size:12px;font-weight:700;color:#5A5F68;transition:.13s}
.srcbtn:hover{border-color:#C7DDFF;color:#1F66F1;background:#F7FAFF}
.srcbtn .stack{display:inline-flex;align-items:center}
.srcbtn .stack .ic{width:13px;height:13px;color:#9A9DA4}
.srcbtn .stack .ic+.ic{margin-left:-5px}
.srcbtn:hover .stack .ic{color:#1F66F1}
.srclist{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px}
.srcchip{display:inline-flex;align-items:center;gap:6px;background:#E8F1FF;color:#1F66F1;border:1px solid #C7DDFF;border-radius:20px;padding:3px 10px 3px 8px;font-size:11.5px;font-weight:700;transition:.13s}
.srcchip:hover{background:#DCE9FF}
.srcchip i{font-style:normal;font-weight:800}
.srcchip span{color:#5B8DEF;font-weight:600;max-width:210px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

/* 후속 질문 */
.follow{margin-top:12px}
.follow-row{display:flex;flex-wrap:wrap;gap:6px}
.fchip{border:1px solid #E5E8EB;background:#fff;border-radius:999px;padding:6px 12px;font-size:12px;font-weight:700;color:#5A5F68;transition:.13s}
.fchip:hover{border-color:#C7DDFF;color:#1F66F1;background:#F7FAFF}

/* ── 카드 공통 ──────────────────────────────────────── */
.cards{display:flex;flex-direction:column;gap:12px;margin-bottom:12px}
.card{background:#fff;border-radius:14px;padding:22px 24px 26px;box-shadow:0 1px 3px rgba(0,0,0,.05)}
.rcard{border:1px solid #E8EBF0;border-radius:14px;padding:18px 20px 16px;box-shadow:0 1px 3px rgba(0,0,0,.04);background:#fff;animation:pop .22s ease-out}
@keyframes pop{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
.chd{display:flex;align-items:center;gap:9px;margin-bottom:4px}
.chd .ic{color:#1F66F1}
.chd h3{font-size:17px;color:#222;letter-spacing:-.02em}
.chd .tail{margin-left:auto;display:flex;align-items:center;gap:6px}
.csub{font-size:12.5px;color:#9A9DA4;margin-bottom:14px;line-height:1.55}
.cfoot{display:flex;align-items:flex-start;gap:9px;margin-top:13px;padding-top:12px;border-top:1px solid #F0F1F3}
.cfoot .why{flex:none;background:#F5F7FA;border:1px solid #E8EBF0;border-radius:6px;padding:2px 8px;font-size:11.5px;font-weight:800;color:#5A5F68}
.cfoot .txt{font-size:12px;color:#9A9DA4;line-height:1.55}

/* 뱃지 */
.b{display:inline-block;font-size:12px;font-weight:700;padding:2px 7px;border-radius:5px;white-space:nowrap}
.b.g{background:#F0F1F3;color:#5A5F68}
.b.blue{background:#E8F1FF;color:#1F66F1}
.b.red{background:#FFF0F0;color:#E5383B}
.b.line{background:#fff;border:1px solid #BCC3D1;color:#5A5F68}
.b.warn{background:#FFFBF0;color:#B78103}
.vb{display:inline-block;border-radius:6px;padding:2px 8px;font-size:11.5px;font-weight:800;border:1px solid;white-space:nowrap}
.vb.good{background:#F5F7FA;border-color:#E8EBF0;color:#222}
.vb.bad{background:#FFF5F5;border-color:#F5C5C5;color:#E5383B}
.vb.wait{background:#E8F1FF;border-color:#D6E6FF;color:#1F66F1}
.vb.na{background:#F5F7FA;border-color:#E8EBF0;color:#9A9DA4}
.vb.warn{background:#FFFBF0;border-color:#F0E0B0;color:#B78103}
.pill{background:#E8F1FF;color:#1F66F1;border:1px solid #C7DDFF;border-radius:20px;padding:3px 10px;font-size:12px;font-weight:700;display:inline-flex;gap:6px;align-items:center}
.pill.gray{background:#F5F7FA;color:#5A5F68;border-color:#E8EBF0}

/* 인박스 리스트 */
.inbox{border:1px solid #E8EBF0;border-radius:12px;overflow:hidden;margin-top:12px}
.ibh{display:flex;align-items:center;gap:9px;padding:11px 15px;background:#F5F7FA;border-bottom:1px solid #E8EBF0}
.ibh .ic{color:#9A9DA4}
.ibh .t{font-size:14px;font-weight:800;color:#222;letter-spacing:-.02em}
.ibh .n{font-size:12px;font-weight:800;color:#1F66F1;background:#E8F1FF;border-radius:9px;padding:1px 8px}
.ibh .rt{margin-left:auto;font-size:11.5px;font-weight:700;color:#9A9DA4}
.ir{display:flex;align-items:center;gap:13px;padding:12px 15px;border-bottom:1px solid #F0F1F3}
.ir:last-child{border-bottom:none}
.ir:hover{background:#FAFBFC}
.ir .grow{flex:1;min-width:0}
.it{font-weight:600;color:#222;line-height:1.5;font-size:14.5px}
.it .nm{font-weight:800}
.it .meta{font-weight:600;color:#5A5F68;font-size:13px;margin-left:7px}
.sub{font-size:12.5px;color:#9A9DA4;margin-top:3px;line-height:1.5}
.sub.rd{color:#E5383B}
.av{width:30px;height:30px;border-radius:9px;background:#F5F7FA;border:1px solid #E8EBF0;display:flex;align-items:center;justify-content:center;flex:none;color:#9A9DA4}

/* 노란 안내 / 파란 힌트 */
.dnote{display:flex;align-items:flex-start;gap:10px;background:#FFFBF0;border:1px solid #F0E0B0;border-radius:10px;padding:11px 15px;font-size:13px;font-weight:600;color:#6B5400;line-height:1.55;margin-top:12px}
.dnote .ic{color:#B78103;margin-top:4px}
.savep{padding:11px 13px;background:#F0F6FF;border-radius:10px;font-size:12.5px;color:#1F3A6B;font-weight:600;line-height:1.55;margin-top:10px}

/* 버튼 */
.cta{background:#1F66F1;color:#fff;border:none;border-radius:9px;padding:10px 18px;font-size:14px;font-weight:700;cursor:pointer}
.cta:hover{background:#1858D8}
.cta.line{background:#fff;color:#222;border:1px solid #BCC3D1}
.cta.line:hover{background:#FAFBFC}
.cta.sm{padding:6px 11px;font-size:12.5px;border-radius:7px}

/* ── 카드: gapji ────────────────────────────────────── */
.gp-worker{display:flex;align-items:center;gap:11px;background:#FAFBFC;border:1px solid #F0F1F3;border-radius:11px;padding:11px 14px}
.gp-worker .av{width:34px;height:34px}
.gp-worker .nm{font-size:15px;font-weight:800;color:#222;letter-spacing:-.02em}
.gp-worker .mt{font-size:12.5px;color:#5A5F68;margin-top:2px}
.gp-worker .rt{margin-left:auto;text-align:right}
.gp-worker .rt .k{font-size:11px;font-weight:700;color:#9A9DA4}
.gp-worker .rt .v{font-size:13px;font-weight:800;color:#222;margin-top:2px}
.gp-row{display:flex;align-items:flex-start;gap:13px;padding:11px 15px;border-bottom:1px solid #F0F1F3}
.gp-row:last-child{border-bottom:none}
.gp-row .no{width:19px;height:19px;border-radius:6px;background:#F5F7FA;color:#9A9DA4;font-size:11px;font-weight:800;display:flex;align-items:center;justify-content:center;flex:none;margin-top:2px}
.gp-row.on .no{background:#E8F1FF;color:#1F66F1}
.gp-row .grow{flex:1;min-width:0}
.gp-row .nm{font-size:14.5px;font-weight:700;color:#222}
.gp-row .bs{font-size:12px;color:#9A9DA4;margin-top:3px;line-height:1.55}
.gp-row .tail{display:flex;align-items:center;gap:6px;flex:none;margin-top:1px}
.gp-items{margin-top:12px}
.gp-hz{border:1px solid #E8EBF0;border-radius:10px;padding:11px 13px;margin-bottom:7px}
.gp-hz:last-child{margin-bottom:0}
.gp-hz .hh{display:flex;align-items:center;gap:8px;margin-bottom:7px}
.gp-hz .hh .nm{font-size:13.5px;font-weight:800;color:#222}
.gp-hz .tags{display:flex;flex-wrap:wrap;gap:5px}
.tg{background:#F5F7FA;border:1px solid #E8EBF0;border-radius:6px;padding:2px 7px;font-size:11.5px;font-weight:600;color:#5A5F68;line-height:1.5}
.more{background:none;border:none;color:#1F66F1;font-size:11.5px;font-weight:800;padding:2px 4px}
.more:hover{text-decoration:underline}
.sechd{display:flex;align-items:center;gap:8px;margin:16px 0 2px}
.sechd .t{font-size:12.5px;font-weight:800;color:#5A5F68;letter-spacing:-.01em}
.sechd .ln{flex:1;height:1px;background:#F0F1F3}

/* ── 카드: dashboard ────────────────────────────────── */
.stt-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:9px;margin-top:12px}
.stt{background:#FAFBFC;border:1px solid #F0F1F3;border-radius:12px;padding:13px 15px 14px}
.stt .k{font-size:11.5px;font-weight:700;color:#9A9DA4;letter-spacing:-.01em}
.stt .v{font-size:36px;font-weight:800;letter-spacing:-.03em;color:#222;margin-top:5px;font-variant-numeric:tabular-nums;line-height:1.1}
.stt .v u{text-decoration:none;font-size:14px;font-weight:700;color:#9A9DA4;margin-left:2px;letter-spacing:0}
.stt.blue .v{color:#1F66F1}
.stt.red .v{color:#E5383B}
.co-row{display:flex;align-items:center;gap:13px;padding:11px 15px;border-bottom:1px solid #F0F1F3}
.co-row:last-child{border-bottom:none}
.co-row .nm{font-size:14px;font-weight:700;color:#222;width:92px;flex:none}
.co-row .barwrap{display:block;flex:1;min-width:0}
.bar{display:block;height:7px;background:#F0F1F3;border-radius:4px;overflow:hidden}
.bar i{display:block;height:100%;background:#1F66F1;border-radius:4px;transition:width .5s ease-out}
.bar.low i{background:#E5383B}
.co-row .val{font-size:13.5px;font-weight:800;color:#222;width:52px;text-align:right;flex:none;font-variant-numeric:tabular-nums}
.co-row .cnt{font-size:12px;color:#9A9DA4;width:64px;text-align:right;flex:none;font-variant-numeric:tabular-nums}
.al-row{display:flex;align-items:center;gap:10px;padding:10px 15px;border-bottom:1px solid #F0F1F3}
.al-row:last-child{border-bottom:none}
.al-row .ic{color:#B78103}
.al-row .nm{font-size:13.5px;font-weight:600;color:#222;flex:1}
.al-row .n{font-size:13.5px;font-weight:800;color:#222;font-variant-numeric:tabular-nums}

/* ── 카드: screening ────────────────────────────────── */
.sc-row{padding:12px 15px;border-bottom:1px solid #F0F1F3}
.sc-row:last-child{border-bottom:none}
.sc-top{display:flex;align-items:center;gap:9px}
.sc-top .nm{font-size:14.5px;font-weight:800;color:#222}
.sc-top .tail{margin-left:auto;display:flex;gap:5px}
.sc-mets{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px}
.met{border:1px solid #E8EBF0;border-radius:8px;padding:5px 9px;background:#FAFBFC;min-width:0}
.met .k{font-size:11px;font-weight:700;color:#9A9DA4}
.met .v{font-size:13.5px;font-weight:800;color:#222;font-variant-numeric:tabular-nums;margin-top:1px}
.met .r{font-size:11px;color:#9A9DA4;margin-top:1px}
.met.dn{border-color:#F5C5C5;background:#FFF5F5}
.met.dn .v{color:#E5383B}
.met.cn{border-color:#D6E6FF;background:#F7FAFF}
.met.cn .v{color:#1F66F1}
.met.warn{border-color:#F0E0B0;background:#FFFBF0}
.met.warn .v{color:#B78103}
.sc-act{font-size:12.5px;color:#5A5F68;margin-top:8px;display:flex;align-items:flex-start;gap:7px;line-height:1.55}
.sc-act .ic{color:#BCC3D1;margin-top:4px}

/* ── 카드: mapping ──────────────────────────────────── */
.mp-hz{padding:12px 15px;border-bottom:1px solid #F0F1F3}
.mp-hz:last-child{border-bottom:none}
.mp-hz:hover{background:#FAFBFC}
.mp-top{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.mp-top .ic{color:#9A9DA4}
.mp-top .nm{font-size:14.5px;font-weight:800;color:#222;letter-spacing:-.02em}
.mp-top .tail{margin-left:auto;display:flex;gap:5px;flex-wrap:wrap}
.mp-hz .tags{display:flex;flex-wrap:wrap;gap:5px;margin-top:8px}

/* ── 카드: extract ──────────────────────────────────── */
.ex-wrap{display:flex;gap:15px;margin-top:12px}
.ex-img{width:150px;flex:none;border:1px solid #E8EBF0;border-radius:10px;overflow:hidden;background:#FAFBFC}
.ex-img img{width:100%;display:block}
.ex-ph{height:190px;display:flex;align-items:center;justify-content:center;color:#BCC3D1}
.ex-fields{flex:1;min-width:0;border:1px solid #E8EBF0;border-radius:11px;overflow:hidden}
.ex-f{display:flex;align-items:center;gap:11px;padding:10px 14px;border-bottom:1px solid #F0F1F3}
.ex-f:last-child{border-bottom:none}
.ex-f .k{font-size:12.5px;font-weight:700;color:#9A9DA4;width:104px;flex:none}
.ex-f .v{font-size:14px;font-weight:700;color:#222;flex:1;min-width:0;word-break:break-all}
.ex-f .cf{display:flex;align-items:center;gap:7px;flex:none}
.cfbar{display:block;width:44px;height:5px;border-radius:3px;background:#F0F1F3;overflow:hidden}
.cfbar i{display:block;height:100%;background:#1F66F1}
.cfbar.mid i{background:#5B8DEF}
.cfbar.low i{background:#B78103}

/* ── 카드: criteria ─────────────────────────────────── */
.cr-rule{font-size:14px;font-weight:700;color:#1F3A6B;background:#F0F6FF;border-radius:10px;padding:12px 14px;line-height:1.6;margin-top:12px}
.cr-basis{font-size:12.5px;color:#5A5F68;line-height:1.65;margin-top:10px}

/* 오류 카드 */
.errc{border:1px solid #F5B5B5;background:#FFF0F0;border-radius:12px;padding:14px 16px;display:flex;gap:10px;align-items:flex-start}
.errc .ic{color:#E5383B;margin-top:4px}
.errc b{display:block;font-size:13.5px;font-weight:800;color:#E5383B}
.errc span{display:block;font-size:12.5px;color:#8A3A3C;margin-top:3px;line-height:1.55}

/* ── 스켈레톤 · 고스트 (A-5 · A-7) ──────────────────── */
.ghost{border:1px dashed #C7DDFF;border-radius:14px;padding:18px 20px;background:#F7FAFF}
.ghost .gh{display:flex;align-items:center;gap:9px;margin-bottom:12px}
.skel{border-radius:6px;background:linear-gradient(100deg,#E8F1FF 8%,#F7FAFF 26%,#DCE9FF 44%,#E8F1FF 62%);background-size:280% 100%;animation:sweep 1.5s ease-in-out infinite}
@keyframes sweep{0%{background-position:130% 0}100%{background-position:-30% 0}}
.skel.t{height:13px}
.skel.w40{width:40%}.skel.w60{width:60%}.skel.w80{width:80%}.skel.w100{width:100%}
.skel.h30{height:30px;border-radius:9px}
.gh-rows{display:flex;flex-direction:column;gap:9px}
.gh-note{font-size:11.5px;font-weight:700;color:#5B8DEF;margin-top:12px}

/* 상태 문구 셔머 (A-6) */
.shim{background:linear-gradient(90deg,#9A9DA4 0%,#1F66F1 42%,#9A9DA4 84%);background-size:220% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;animation:shim 2.1s linear infinite}
@keyframes shim{0%{background-position:120% 0}100%{background-position:-120% 0}}

/* ── 컴포저 ─────────────────────────────────────────── */
.composer{border-top:1px solid #F0F1F3;padding:12px 22px 14px;background:#fff}
.attach{display:flex;align-items:center;gap:10px;border:1px solid #C7DDFF;background:#F7FAFF;border-radius:10px;padding:8px 11px;margin-bottom:9px}
.attach img{width:38px;height:38px;object-fit:cover;border-radius:7px;border:1px solid #E8EBF0;flex:none}
.attach .nm{font-size:12.5px;font-weight:700;color:#1F3A6B;flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.attach .rm{font-size:12px;font-weight:800;color:#5B8DEF;padding:3px 7px;border-radius:6px}
.attach .rm:hover{background:#E8F1FF}
.cbox{display:flex;align-items:flex-end;gap:9px;border:1px solid #BCC3D1;border-radius:12px;padding:8px 8px 8px 10px;background:#fff;transition:border-color .13s}
.cbox.focus{border-color:#1F66F1}
.cbox textarea{flex:1;min-width:0;border:none;outline:none;resize:none;font-size:14px;line-height:1.6;max-height:132px;padding:6px 2px;background:transparent}
.cbox textarea::placeholder{color:#BCC3D1}
.ibtn{width:34px;height:34px;border-radius:9px;display:flex;align-items:center;justify-content:center;color:#9A9DA4;flex:none;transition:.13s}
.ibtn:hover{background:#F5F7FA;color:#222}
.ibtn.on{background:#E8F1FF;color:#1F66F1}
.sendbtn{width:34px;height:34px;border-radius:9px;background:#1F66F1;color:#fff;display:flex;align-items:center;justify-content:center;flex:none;transition:.13s}
.sendbtn:hover{background:#1858D8}
.sendbtn:disabled{background:#E8EBF0;color:#BCC3D1;cursor:default}
.sendbtn.stop{background:#191F28}
.sendbtn.stop:hover{background:#000}
.sendbtn .sq{width:11px;height:11px;border-radius:2.5px;background:currentColor;display:block}
.notice{margin-top:9px;font-size:11.5px;color:#9A9DA4;text-align:center;line-height:1.5}

/* ── 에이전트 패널 ──────────────────────────────────── */
.pcard{padding:15px 17px 16px;flex:none}
.pcard.flash{animation:flash .9s ease-out}
@keyframes flash{0%{box-shadow:0 0 0 3px #C7DDFF}100%{box-shadow:0 1px 3px rgba(0,0,0,.05)}}
.phd{display:flex;align-items:center;gap:8px;margin-bottom:10px}
.phd .ic{color:#5A5F68}
.phd h2{font-size:14px;color:#222}
.phd-state{margin-left:auto;font-size:11.5px;font-weight:700;color:#9A9DA4;background:#F5F7FA;border-radius:6px;padding:2px 8px}
.phd-state.run{background:#E8F1FF;color:#1F66F1}
.phd-n{margin-left:auto;font-size:11.5px;font-weight:800;color:#1F66F1;background:#E8F1FF;border-radius:9px;padding:1px 8px}
.pstatus{font-size:12.5px;font-weight:700;color:#5A5F68;line-height:1.55;padding:9px 11px;background:#FAFBFC;border-radius:9px}
.pempty{font-size:12.5px;color:#BCC3D1;line-height:1.55;padding:2px 0}

/* 타임라인 */
.tl{margin-top:10px;position:relative}
.tl li{position:relative;padding:0 0 13px 25px}
.tl li:last-child{padding-bottom:0}
.tl li::before{content:'';position:absolute;left:8px;top:17px;bottom:-1px;width:1.5px;background:#E8EBF0}
.tl li:last-child::before{display:none}
.tl .mk{position:absolute;left:0;top:2px;width:17px;height:17px;border-radius:50%;background:#E8EBF0;color:#9A9DA4;display:flex;align-items:center;justify-content:center;font-size:10px;font-weight:800}
.tl .mk .ic{width:10px;height:10px}
.tl li.run .mk{background:#1F66F1;color:#fff}
.tl li.done .mk{background:#DCE9FF;color:#1F66F1}
.tl li.fail .mk{background:#FFF0F0;color:#E5383B}
.tl li.halt .mk{background:#F0F1F3;color:#9A9DA4}
.tl li.halt .lb{color:#9A9DA4}
.tl .lb{font-size:13px;font-weight:800;color:#222;letter-spacing:-.02em;display:flex;align-items:center;gap:7px}
.tl .lb .tool{font-size:10.5px;font-weight:700;color:#BCC3D1;background:#F5F7FA;border-radius:5px;padding:1px 5px}
.tl .dt{font-size:12px;color:#9A9DA4;margin-top:3px;line-height:1.5;word-break:break-word}
.tl .sm{font-size:12px;color:#1F3A6B;background:#F0F6FF;border-radius:8px;padding:7px 10px;margin-top:6px;line-height:1.5;font-weight:600}
.tl .ms{font-size:11px;font-weight:700;color:#BCC3D1;margin-left:auto;font-variant-numeric:tabular-nums}

/* 근거 뷰 */
.evi{display:flex;flex-direction:column;gap:9px}
.evi-g{border:1px solid #E8EBF0;border-radius:11px;overflow:hidden}
.evi-g.hi{border-color:#1F66F1;box-shadow:0 0 0 2px #E8F1FF}
.evi-q{font-size:11.5px;font-weight:700;color:#9A9DA4;padding:8px 12px;background:#F5F7FA;border-bottom:1px solid #E8EBF0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.evi-s{display:flex;align-items:flex-start;gap:9px;padding:9px 12px;border-bottom:1px solid #F0F1F3}
.evi-s:last-child{border-bottom:none}
.evi-s .ic{color:#BCC3D1;margin-top:4px}
.evi-s .id{font-size:11.5px;font-weight:800;color:#1F66F1;background:#E8F1FF;border-radius:5px;padding:1px 6px;flex:none}
.evi-s .tx{min-width:0}
.evi-s .tt{font-size:12.5px;font-weight:700;color:#222;line-height:1.5}
.evi-s .dd{font-size:11.5px;color:#9A9DA4;margin-top:2px}

/* 세션 이력 */
.hist li{display:flex;align-items:flex-start;gap:9px;padding:8px 0;border-bottom:1px solid #F0F1F3}
.hist li:last-child{border-bottom:none}
.hist .st{width:7px;height:7px;border-radius:50%;background:#BCC3D1;flex:none;margin-top:7px}
.hist .st.ok{background:#1F66F1}
.hist .st.run{background:#5B8DEF;animation:pulse 1.1s ease-in-out infinite}
.hist .st.err{background:#E5383B}
.hist .st.stop{background:#9A9DA4}
@keyframes pulse{50%{opacity:.35}}
.hist .q{flex:1;min-width:0;font-size:12.5px;font-weight:600;color:#222;line-height:1.5;overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.hist .tm{font-size:11px;font-weight:700;color:#BCC3D1;flex:none;margin-top:2px}

/* 지식베이스 */
.kb li{border-bottom:1px solid #F0F1F3}
.kb li:last-child{border-bottom:none}
.kb li button{display:flex;align-items:center;gap:9px;width:100%;text-align:left;padding:8px 6px;border-radius:8px;cursor:pointer;transition:.13s}
.kb li button:hover{background:#F7FAFF}
.kb li button:hover .chv{opacity:1}
.kb .chv{opacity:0;color:#1F66F1;transition:.13s}
.kb .ic{color:#BCC3D1}
.kb .nm{font-size:12.5px;font-weight:600;color:#222;flex:1;min-width:0}
.kb .n{font-size:11.5px;font-weight:800;color:#5A5F68;font-variant-numeric:tabular-nums}
.law-links{margin-top:14px;padding:10px 13px;background:#F0F6FF;border-radius:10px;font-size:12px;font-weight:600;color:#1F3A6B}
.law-links a{color:#1F66F1;font-weight:700;text-decoration:underline;text-underline-offset:2px}
.kb-note{font-size:11px;color:#BCC3D1;line-height:1.5;margin-top:10px}

/* 토스트 */
#toast{position:fixed;left:50%;bottom:34px;transform:translateX(-50%) translateY(16px);background:#222;color:#fff;padding:12px 20px;border-radius:11px;font-size:13.5px;font-weight:600;opacity:0;pointer-events:none;transition:.2s;z-index:300}
#toast.on{opacity:1;transform:translateX(-50%) translateY(0)}

/* ── 웰컴 블록 (D1 · D4 · E4) ───────────────────────── */
.wel{border:1px solid #E8EBF0;border-radius:14px;padding:20px 22px 18px;background:linear-gradient(180deg,#F7FAFF 0%,#fff 62%)}
.wel h3{font-size:17px;color:#222;margin-bottom:6px}
.wel .lead{font-size:13.5px;color:#5A5F68;line-height:1.65}
.wel .limit{font-size:12.5px;color:#9A9DA4;line-height:1.6;margin-top:8px}
.wel .limit b{color:#5A5F68;font-weight:700}
.wel-hd{font-size:11.5px;font-weight:800;color:#9A9DA4;letter-spacing:-.01em;margin:16px 0 8px}
.wel-cards{display:flex;flex-direction:column;gap:7px}
.wcard{display:flex;align-items:flex-start;gap:10px;width:100%;text-align:left;background:#fff;border:1px solid #E8EBF0;border-radius:11px;padding:12px 14px;transition:.13s}
.wcard:hover{border-color:#C7DDFF;background:#F7FAFF}
.wcard.key{border-color:#C7DDFF;box-shadow:0 0 0 2px #E8F1FF}
.wcard .ic{color:#1F66F1;margin-top:4px}
.wcard .gw{flex:1;min-width:0}
.wcard b{display:block;font-size:13.5px;font-weight:700;color:#222;line-height:1.5}
.wcard span{display:block;font-size:12px;color:#9A9DA4;margin-top:3px;line-height:1.5}
.wcard .tagk{flex:none;font-size:11px;font-weight:800;color:#1F66F1;background:#E8F1FF;border-radius:6px;padding:2px 7px;margin-top:1px}

/* 근거 ID 인라인 스팬 (E2 조정) */
.eid{color:#1F66F1;font-weight:700;border-bottom:1px dashed #C7DDFF;cursor:pointer;padding:0 1px}
.eid:hover{background:#E8F1FF;border-radius:3px}

/* 후속 질문 · 평가 (E8 · E10) */
.follow-hd{font-size:11.5px;font-weight:800;color:#9A9DA4;letter-spacing:-.01em;margin:14px 0 7px}
.rate{display:flex;align-items:center;gap:7px;margin-top:12px;padding-top:11px;border-top:1px dashed #E8EBF0}
.rate .lb{font-size:11.5px;font-weight:700;color:#BCC3D1}
.rchip{border:1px solid #E5E8EB;background:#fff;border-radius:999px;padding:4px 11px;font-size:11.5px;font-weight:700;color:#5A5F68;transition:.13s}
.rchip:hover{border-color:#C7DDFF;color:#1F66F1;background:#F7FAFF}
.rchip.on{background:#191F28;border-color:#191F28;color:#fff}
.errc .retry{margin-top:9px}

/* 용어 밑줄 (C1 · C3) */
.term{border-bottom:1px dashed #BCC3D1;cursor:help}

/* ── 아코디언 (용어 설명) ───────────────────────────── */
.acc{margin-top:11px;border-top:1px solid #F0F1F3;padding-top:9px}
.acc-hd{display:flex;align-items:center;gap:7px;width:100%;font-size:12.5px;font-weight:700;color:#5A5F68;padding:4px 0}
.acc-hd:hover{color:#1F66F1}
.acc-hd .ic{color:#BCC3D1}
.acc-hd .t{flex:1;text-align:left}
.acc-hd .chev{color:#BCC3D1;transition:transform .15s}
.acc-hd[aria-expanded="true"] .chev{transform:rotate(90deg)}
.acc-bd{padding:4px 0 2px}
.acc-it{padding:7px 0;border-bottom:1px solid #F0F1F3}
.acc-it:last-child{border-bottom:none}
.acc-it b{display:block;font-size:12.5px;font-weight:800;color:#222}
.acc-it span{display:block;font-size:11.5px;color:#5A5F68;line-height:1.55;margin-top:2px}
.acc-it i{font-style:normal;font-size:11px;font-weight:800;color:#1F66F1;background:#E8F1FF;border-radius:5px;padding:1px 5px;margin-left:5px}

/* ── 페이지 뷰 공통 (A5 여백 구획) ──────────────────── */
.pghd{display:flex;align-items:flex-end;gap:16px;margin-bottom:18px}
.pghd-t{flex:1;min-width:0}
.pghd h1{font-size:22px;color:#222;letter-spacing:-.02em}
.pgsub{font-size:12.5px;color:#9A9DA4;margin-top:6px;line-height:1.6}
.pghd-a{flex:none;display:flex;align-items:center;gap:9px}
.lnk{display:inline-flex;align-items:center;gap:6px;font-size:12.5px;font-weight:700;color:#1F66F1;text-decoration:none;border:1px solid #C7DDFF;background:#fff;border-radius:8px;padding:7px 12px;transition:.13s}
.lnk:hover{background:#F7FAFF;border-color:#1F66F1}
.lnk .ic{color:#5B8DEF}
.lnk.plain{border:none;background:none;padding:2px 0}
.lnk.plain:hover{text-decoration:underline;background:none}

.sec{margin-top:30px}
.sechd2{display:flex;align-items:center;gap:8px;margin-bottom:4px}
.sechd2 h2{font-size:17px;color:#222;letter-spacing:-.02em}
.sechd2 .ic{color:#BCC3D1;cursor:help}
.sechd2 .ic:hover{color:#1F66F1}
.sechd2 .tail{margin-left:auto;display:flex;align-items:center;gap:9px}
.secsub{font-size:12.5px;color:#9A9DA4;line-height:1.6;margin-bottom:12px}
.grid2 .sechd2+.secsub{min-height:40px}
.grid2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}

/* 첫 진입 안내 (D3·D6 대체) */
.coach{display:flex;align-items:center;gap:9px;margin-bottom:16px}
.coach .ic{color:#5B8DEF}
.coach .gw{flex:1}
.coach-x{font-size:11.5px;font-weight:800;color:#5B8DEF;padding:3px 8px;border-radius:6px}
.coach-x:hover{background:#E8F1FF}

/* KPI 타일 (A1 · A6 · A9) */
.kpis{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.kpi{background:#fff;border:1px solid #E8EBF0;border-radius:14px;padding:16px 18px 17px;text-align:left;width:100%;transition:.13s;box-shadow:0 1px 3px rgba(0,0,0,.04)}
.kpi:hover{border-color:#C7DDFF;box-shadow:0 2px 8px rgba(31,102,241,.08)}
.kpi .k{display:flex;align-items:center;gap:5px;font-size:11.5px;font-weight:700;color:#9A9DA4;letter-spacing:-.01em}
.kpi .k .ic{width:13px;height:13px;color:#D5D9E0}
.kpi:hover .k .ic{color:#5B8DEF}
.kpi .v{display:block;font-size:36px;font-weight:800;letter-spacing:-.03em;color:#222;margin-top:6px;font-variant-numeric:tabular-nums;line-height:1.1}
.kpi .v u{text-decoration:none;font-size:14px;font-weight:700;color:#9A9DA4;margin-left:3px;letter-spacing:0}
.kpi .v.zero{color:#D5D9E0}
.kpi.red .v{color:#E5383B}
.kpi .cap{display:block;font-size:12px;color:#9A9DA4;margin-top:8px;line-height:1.5}

/* 업체 랭킹 (A7 · A8) */
.rank{border:1px solid #E8EBF0;border-radius:12px;overflow:hidden;background:#fff}
.rank-hd{display:flex;align-items:center;gap:9px;padding:10px 15px;background:#F5F7FA;border-bottom:1px solid #E8EBF0;font-size:11.5px;font-weight:800;color:#9A9DA4}
.rank-hd .sortkey{color:#1F66F1}
.rank-hd .rt{margin-left:auto}
.rrow{display:flex;align-items:center;gap:12px;padding:12px 15px;border-bottom:1px solid #F0F1F3;width:100%;text-align:left;transition:.13s}
.rrow:last-child{border-bottom:none}
.rrow:hover{background:#FAFBFC}
.rrow .no{width:18px;font-size:12.5px;font-weight:800;color:#BCC3D1;font-variant-numeric:tabular-nums;flex:none}
.rrow.on .no{color:#1F66F1}
.rrow .nm{width:88px;flex:none;font-size:14px;font-weight:700;color:#222}
.rrow .barwrap{flex:1;min-width:0}
.rrow .bar{display:block;height:7px;background:#F0F1F3;border-radius:4px;overflow:hidden}
.rrow .bar i{display:block;height:100%;background:#D5D9E0;border-radius:4px;transition:width .5s ease-out}
.rrow.on .bar i{background:#1F66F1}
.rrow .val{width:54px;text-align:right;flex:none;font-size:13.5px;font-weight:800;color:#222;font-variant-numeric:tabular-nums}
.rrow.on .val{color:#1F66F1}
.rrow .cnt{width:62px;text-align:right;flex:none;font-size:12px;color:#9A9DA4;font-variant-numeric:tabular-nums}

/* 조치 목록 · 명단 행 */
.lrow{display:flex;align-items:center;gap:11px;padding:12px 15px;border-bottom:1px solid #F0F1F3;width:100%;text-align:left;transition:.13s}
.lrow:last-child{border-bottom:none}
.lrow:hover{background:#FAFBFC}
.lrow .ic{color:#BCC3D1;flex:none}
.lrow:hover .ic{color:#5B8DEF}
.lrow .gw{flex:1;min-width:0}
.lrow .nm{font-size:14px;font-weight:600;color:#222;line-height:1.5}
.lrow .nm b{font-weight:800}
.lrow .sb{font-size:12px;color:#9A9DA4;margin-top:3px;line-height:1.5;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.lrow .nm{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.lrow .tail{flex:none;display:flex;align-items:center;gap:7px}
.lrow .cnum{font-size:13.5px;font-weight:800;color:#222;font-variant-numeric:tabular-nums}
.lrow .cnum.zero{color:#D5D9E0}
.lrow .chev{color:#D5D9E0;font-size:14px}
.lrow.wait{background:#FAFBFC}
.lrow.wait .nm{color:#5A5F68}

/* 유해인자 barlist */
.blist .brow{display:flex;align-items:center;gap:11px;padding:9px 15px;border-bottom:1px solid #F0F1F3}
.blist .brow:last-child{border-bottom:none}
.blist .nm{width:132px;flex:none;font-size:13px;font-weight:600;color:#222;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.blist .barwrap{flex:1;min-width:0}
.blist .bar{display:block;height:7px;background:#F0F1F3;border-radius:4px;overflow:hidden}
.blist .bar i{display:block;height:100%;background:#5B8DEF;border-radius:4px}
.blist .val{width:52px;text-align:right;flex:none;font-size:12.5px;font-weight:800;color:#222;font-variant-numeric:tabular-nums}

/* 현황 스켈레톤 */
.bskel{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.bskel .bs{background:#fff;border:1px solid #E8EBF0;border-radius:14px;padding:16px 18px 17px}
.bskel .bs .skel{display:block}
.bskel .bs .skel+.skel{margin-top:9px}

/* ── 데이터 테이블 (B1~B9) ──────────────────────────── */
.strip{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:14px}
.stripe{display:inline-flex;align-items:baseline;gap:6px;background:#F5F7FA;border-radius:10px;padding:8px 13px}
.stripe .k{font-size:11.5px;font-weight:700;color:#9A9DA4}
.stripe .v{font-size:15px;font-weight:800;color:#222;font-variant-numeric:tabular-nums}
.stripe.note{color:#5A5F68;font-size:12px;font-weight:600;align-items:center}

.tbar{display:flex;align-items:center;gap:12px;margin-bottom:10px}
.tcount{font-size:12.5px;font-weight:700;color:#5A5F68}
.tcount b{color:#1F66F1;font-weight:800}
.tbar .tail{margin-left:auto;display:flex;align-items:center;gap:9px}
.tsearch{position:relative;margin-bottom:10px}
.tsearch .ic{position:absolute;left:12px;top:50%;transform:translateY(-50%);color:#BCC3D1}
.tsearch .nlin{padding-left:36px}
.nlin{width:100%;border:1px solid #BCC3D1;border-radius:10px;padding:11px 14px;font-size:14px;outline:none;background:#fff}
.nlin:focus{border-color:#1F66F1}
.nlin::placeholder{color:#BCC3D1}
.fchips{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:12px}

table.dt{width:100%;border-collapse:collapse;background:#fff;border:1px solid #E8EBF0;border-radius:12px;overflow:hidden;font-size:13px}
table.dt thead th{background:#F5F7FA;border-bottom:1px solid #E8EBF0;padding:0;text-align:left;white-space:nowrap}
table.dt thead button{display:flex;align-items:center;gap:4px;width:100%;padding:10px 13px;font-size:11.5px;font-weight:800;color:#9A9DA4;letter-spacing:-.01em}
table.dt thead button:hover{color:#5A5F68}
table.dt thead th.on button{color:#1F66F1}
table.dt thead .car{font-size:9px;color:#1F66F1;visibility:hidden}
table.dt thead th.on .car{visibility:visible}
table.dt thead button.num{justify-content:flex-end}
table.dt tbody tr{border-bottom:1px solid #F0F1F3;cursor:pointer}
table.dt tbody tr:last-child{border-bottom:none}
table.dt tbody tr:nth-child(even){background:#FCFDFE}
table.dt tbody tr:hover{background:#F7FAFF}
table.dt td{padding:11px 13px;color:#222;vertical-align:middle}
table.dt td.nm{font-weight:700}
table.dt td.num{text-align:right;font-variant-numeric:tabular-nums}
table.dt td.mut{color:#9A9DA4}
table.dt td.zero{color:#D5D9E0}

.pager{display:flex;align-items:center;justify-content:center;gap:5px;margin-top:14px}
.pbtn{min-width:30px;height:30px;border:1px solid #E5E8EB;background:#fff;border-radius:8px;font-size:12.5px;font-weight:700;color:#5A5F68;padding:0 8px}
.pbtn:hover{border-color:#9A9DA4;color:#222}
.pbtn.on{background:#191F28;border-color:#191F28;color:#fff}
.pbtn:disabled{opacity:.4;cursor:default}
.pbtn:disabled:hover{border-color:#E5E8EB;color:#5A5F68}

.empty{text-align:center;padding:44px 20px;background:#fff;border:1px solid #E8EBF0;border-radius:12px}
.empty .ic{color:#BCC3D1;margin-bottom:10px}
.empty b{display:block;font-size:14.5px;font-weight:800;color:#222}
.empty span{display:block;font-size:12.5px;color:#5A5F68;margin-top:5px;line-height:1.6}
.empty .cta{margin-top:14px}

/* 문서 카드 그리드 */
.doccards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.doccard{background:#fff;border:1px solid #E8EBF0;border-radius:14px;padding:16px 17px 15px;text-align:left;width:100%;transition:.13s;box-shadow:0 1px 3px rgba(0,0,0,.04)}
.doccard:hover{border-color:#C7DDFF;box-shadow:0 2px 8px rgba(31,102,241,.08)}
.doccard .dh{display:flex;align-items:center;gap:8px;margin-bottom:8px}
.doccard .dh .ic{color:#1F66F1}
.doccard .dh .tail{margin-left:auto}
.doccard b{display:block;font-size:14px;font-weight:800;color:#222;letter-spacing:-.02em;line-height:1.45}
.doccard .og{display:block;font-size:12px;color:#9A9DA4;margin-top:6px;line-height:1.55}
.doccard .ct{display:inline-block;font-size:11.5px;font-weight:800;color:#1F66F1;background:#E8F1FF;border-radius:6px;padding:1px 7px;margin-top:9px;font-variant-numeric:tabular-nums}

/* 원천 3분류 */
.orig{background:#fff;border:1px solid #E8EBF0;border-radius:14px;padding:6px 0}
.orig-g{padding:13px 18px;border-bottom:1px solid #F0F1F3}
.orig-g:last-child{border-bottom:none}
.orig-g .oh{display:flex;align-items:center;gap:8px;margin-bottom:7px}
.orig-g .oh b{font-size:13.5px;font-weight:800;color:#222}
.orig-g ul{display:flex;flex-direction:column;gap:5px}
.orig-g li{font-size:12.5px;color:#5A5F68;line-height:1.6;padding-left:12px;position:relative}
.orig-g li::before{content:'';position:absolute;left:2px;top:9px;width:3px;height:3px;border-radius:50%;background:#BCC3D1}
.orig-g li b{color:#222;font-weight:700}

/* ── 모달 (C4 · C7 · 안티 3) ────────────────────────── */
.modal{position:fixed;inset:0;z-index:200;display:flex;align-items:center;justify-content:center;padding:36px 20px}
.modal-dim{position:absolute;inset:0;background:rgba(25,31,40,.5)}
.modal-card{position:relative;background:#fff;border-radius:20px;width:100%;max-width:640px;max-height:calc(100vh - 72px);display:flex;flex-direction:column;box-shadow:0 18px 48px rgba(25,31,40,.22);animation:mopen .18s ease-out}
.modal.wide .modal-card{max-width:960px}
@keyframes mopen{from{opacity:0;transform:translateY(10px) scale(.99)}to{opacity:1;transform:none}}
.modal-hd{display:flex;align-items:center;gap:12px;padding:20px 20px 14px 24px;border-bottom:1px solid #F0F1F3;flex:none}
.modal-hd h2{flex:1;min-width:0;font-size:18px;color:#222;letter-spacing:-.02em;outline:none}
.modal-x{width:44px;height:44px;border-radius:10px;display:flex;align-items:center;justify-content:center;color:#5A5F68;flex:none;margin:-8px -6px -8px 0}
.modal-x:hover{background:#F5F7FA;color:#222}
.modal-bd{flex:1;min-height:0;overflow-y:auto;padding:20px 24px 24px}
.modal-foot{display:flex;align-items:center;gap:9px;margin-top:18px;padding-top:16px;border-top:1px solid #F0F1F3}
.modal-foot .sp{flex:1}
.mnote{font-size:11.5px;color:#9A9DA4;line-height:1.55;margin-top:14px;padding-top:12px;border-top:1px dashed #E8EBF0}

/* 모달 내부 공통 */
.mprofile{display:flex;align-items:center;gap:12px;background:#FAFBFC;border:1px solid #F0F1F3;border-radius:12px;padding:13px 16px}
.mprofile .av{width:38px;height:38px}
.mprofile .nm{font-size:16px;font-weight:800;color:#222;letter-spacing:-.02em}
.mprofile .mt{font-size:12.5px;color:#5A5F68;margin-top:3px}
.mprofile .rt{margin-left:auto;text-align:right;display:flex;flex-direction:column;align-items:flex-end;gap:5px}
.mgrid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin-top:12px}
.mkv{border:1px solid #E8EBF0;border-radius:10px;padding:10px 13px}
.mkv .k{font-size:11.5px;font-weight:700;color:#9A9DA4}
.mkv .v{font-size:14px;font-weight:700;color:#222;margin-top:3px;line-height:1.5}
.mkv .v.rd{color:#E5383B}
.mvals{display:flex;flex-wrap:wrap;gap:6px;margin-top:10px}
.mtags{display:flex;flex-wrap:wrap;gap:5px;margin-top:10px}

/* M2 문서 뷰어 */
.viewer{display:grid;grid-template-columns:236px minmax(0,1fr);gap:16px;min-height:340px}
.viewer-nav{background:#F5F7FA;border-radius:12px;padding:5px;overflow-y:auto;max-height:52vh}
.viewer-nav button{display:block;width:100%;text-align:left;padding:9px 11px;border-radius:9px;font-size:12px;color:#5A5F68;line-height:1.45;transition:.13s}
.viewer-nav button:hover{background:rgba(255,255,255,.7);color:#222}
.viewer-nav button.on{background:#fff;color:#1F66F1;font-weight:700;box-shadow:0 1px 3px rgba(0,0,0,.07)}
.viewer-nav .sid{display:block;font-size:10.5px;font-weight:800;color:#BCC3D1}
.viewer-nav button.on .sid{color:#5B8DEF}
.viewer-bd{padding:4px 6px 4px 4px;overflow-y:auto;max-height:52vh}
.viewer-bd h4{font-size:15px;color:#222;margin-bottom:10px}
.viewer-bd pre{white-space:pre-wrap;word-break:break-word;font-family:inherit;font-size:13px;color:#222;line-height:1.75}

/* M5 제품 소개 */
.intro-face{display:none}
.intro-face.on{display:block}
.intro-nav{display:flex;gap:6px;margin-bottom:16px}
.intro-dots{display:flex;align-items:center;gap:6px;margin-left:auto}
.intro-dots i{width:6px;height:6px;border-radius:50%;background:#E5E8EB;display:block}
.intro-dots i.on{background:#1F66F1;width:16px;border-radius:3px}
.ilist{display:flex;flex-direction:column;gap:8px}
.iitem{display:flex;align-items:flex-start;gap:11px;border:1px solid #E8EBF0;border-radius:11px;padding:13px 15px}
.iitem .no{width:20px;height:20px;border-radius:6px;background:#F5F7FA;color:#9A9DA4;font-size:11px;font-weight:800;display:flex;align-items:center;justify-content:center;flex:none;margin-top:2px}
.iitem b{display:block;font-size:13.5px;font-weight:800;color:#222;line-height:1.5}
.iitem span{display:block;font-size:12.5px;color:#5A5F68;margin-top:4px;line-height:1.6}
.iitem em{display:block;font-style:normal;font-size:12px;color:#1F3A6B;background:#F0F6FF;border-radius:8px;padding:7px 10px;margin-top:7px;line-height:1.55;font-weight:600}
.iflow{width:100%;height:auto;display:block;margin:4px 0 14px}
.scen{display:flex;flex-direction:column;gap:10px}
.scen-b{border:1px solid #E8EBF0;border-radius:11px;padding:13px 15px}
.scen-b .k{font-size:11.5px;font-weight:800;color:#5B8DEF;letter-spacing:-.01em}
.scen-b .v{font-size:13.5px;color:#222;line-height:1.65;margin-top:4px}
.scen-b.res{background:#F7FAFF;border-color:#C7DDFF}

/* ── 툴팁 (C1 · C2 · C8) ────────────────────────────── */
#tip{position:fixed;z-index:400;max-width:260px;background:#191F28;color:#fff;font-size:12px;font-weight:600;line-height:1.55;border-radius:8px;padding:8px 11px;pointer-events:none;opacity:0;transition:opacity .12s;box-shadow:0 6px 18px rgba(25,31,40,.24)}
#tip.on{opacity:1}
#tip[hidden]{display:none}

/* 좁은 화면 대응 (1280px+ 기준) */
@media (max-width:1180px){
  .wrap{grid-template-columns:minmax(0,1fr) 340px}
  .stt-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .kpis{grid-template-columns:repeat(2,minmax(0,1fr))}
  .doccards{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:980px){
  .wrap{grid-template-columns:minmax(0,1fr);height:auto}
  .agent{overflow:visible}
  .chat{height:calc(100vh - 102px)}
  .grid2{grid-template-columns:minmax(0,1fr)}
  .viewer{grid-template-columns:minmax(0,1fr)}
}
