/* 대시보드 — 소스별 색. 주황(--pt)·파랑(--opp)·빨강(--crit)은 의미 색이라 소스 구분에 쓰지 않는다. */
[data-src]{--src:#64748b}
[data-src="policy"]{--src:#4c5fd5}          /* 약관 — 남색 */
[data-src="news"]{--src:#0e9384}            /* 뉴스 — 청록 */
[data-src="medical_manual"]{--src:#16a34a}  /* 진료지침 — 초록 */
[data-src="scholar"]{--src:#7c3aed}         /* 논문 — 보라 */
[data-src="regulation"]{--src:#db2777}      /* 규제 — 분홍 */
[data-src="code"]{--src:#64748b}            /* 코드·표 — 회청 */

/* 상단 소스 카드 */
.src-cards{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:12px;margin:4px 0 22px}   /* 폭 상한 없음 — 화면을 따라 늘어난다 */
.src-card{all:unset;box-sizing:border-box;cursor:pointer;display:flex;flex-direction:column;gap:10px;
  background:#fff;border:1px solid var(--line);border-radius:12px;padding:14px 14px 12px;
  box-shadow:0 1px 2px rgba(17,19,24,.04);transition:border-color .15s,box-shadow .15s}
.src-card:hover{border-color:color-mix(in srgb,var(--src) 40%,var(--line))}
.src-card:focus-visible{outline:2px solid var(--src);outline-offset:2px}
.src-card.on{border-color:var(--src);box-shadow:0 0 0 3px color-mix(in srgb,var(--src) 14%,transparent)}
.src-card .hd{display:flex;align-items:center;gap:10px}
.src-card .ic{flex:none;width:34px;height:34px;border-radius:9px;display:grid;place-items:center;
  background:color-mix(in srgb,var(--src) 12%,#fff);color:var(--src)}
.src-card .ic svg{width:18px;height:18px}
.src-card .nm{font-size:var(--fs-title);font-weight:700;color:var(--ink)}
.src-card .nm small{display:block;font-size:var(--fs-cap);font-weight:400;color:var(--ink-3)}
.src-card .big{font-size:24px;font-weight:800;letter-spacing:-.02em;line-height:1.1;font-variant-numeric:tabular-nums;color:var(--ink)}
.src-card .big small{font-size:var(--fs-cap);font-weight:500;color:var(--ink-3);margin-left:4px;letter-spacing:0}
.src-card .sub{font-size:var(--fs-cap);color:var(--ink-2);font-variant-numeric:tabular-nums;margin-top:-6px}
.src-card .bar{display:flex;align-items:center;gap:8px}
.src-card .bar .rail{flex:1;height:6px;border-radius:3px;background:var(--line-2);overflow:hidden}
.src-card .bar .rail i{display:block;height:100%;min-width:3px;border-radius:3px;background:var(--src)}
.src-card .bar b{font-size:var(--fs-cap);font-weight:700;color:var(--ink-2);font-variant-numeric:tabular-nums;min-width:32px;text-align:right}
.src-card .ft{font-size:var(--fs-cap);color:var(--ink-3);border-top:1px solid var(--line-2);padding-top:8px}

/* 기존 표·패널에 소스 색 입히기 */
.tbl.ds tr.ds td.nm b::before{content:"";display:inline-block;width:8px;height:8px;border-radius:50%;
  background:var(--src);margin-right:8px;vertical-align:.12em}
.tbl.ds td.rt .rail i{background:var(--src)}
.tbl.ds tr.ds.on td.nm{border-left-color:var(--src)}
.dsp .dsp-h{border-bottom:2px solid var(--src)}
.dsp .dsp-t .rail i{background:var(--src)}

@media (max-width:1280px){.src-cards{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (max-width:720px){.src-cards{grid-template-columns:repeat(2,minmax(0,1fr))}}

/* 바탕은 연회색, 내용 덩어리는 흰 카드로 띄운다 */
body.pg-dashboard{background:#f6f7f9}
.pg-dashboard .ds-split > section.col{background:#fff;border:1px solid var(--line);border-radius:12px;padding:6px 10px 12px;
  box-shadow:0 1px 2px rgba(17,19,24,.04)}
.pg-dashboard .ds-panel{background:#fff;border-radius:12px;box-shadow:0 1px 2px rgba(17,19,24,.04)}
.pg-dashboard .tbl.ds tr.ds:hover td,.pg-dashboard .tbl.ds tr.ds.on td{background:color-mix(in srgb,var(--src) 5%,#fff)}
.pg-dashboard main.shell{background:#f6f7f9}
.pg-dashboard .ds-split > section.col .tbl.ds{width:100%}   /* 카드 안에서는 표가 카드 폭을 따른다 */
.pg-dashboard .ds-split > section.col .sub-h{padding-left:4px}
.pg-dashboard .ds-split > section.col{overflow:clip}   /* 머리줄이 카드 밖으로 새지 않게 */
.pg-dashboard .ds-split > section.col .tbl.ds th.d{white-space:nowrap;padding-right:6px}

/* ── 3단: 리스트 · 상세 ─────────────────────────────────────────────────────
   리스트는 「문제 많은 순」. 상태는 점 하나로만 말한다 — 문제 = 빨간 점, 주의 = 빨간 테두리 점,
   정상 = 회색 점, 판정 기준 없음 = 점 없음. 빨강은 DS 규칙대로 실제 경고(수집 실패·신선도 끊김)에만. */
.pg-dashboard .dash3{display:grid;grid-template-columns:minmax(260px,330px) minmax(0,1fr);gap:14px;align-items:start}
.pg-dashboard .d3-list{position:sticky;top:calc(var(--tb, 41px) + 12px);max-height:calc(100vh - var(--tb, 41px) - 28px);
  overflow:auto;background:#fff;border:1px solid var(--line);border-radius:12px}
.pg-dashboard .d3l-h{position:sticky;top:0;z-index:1;display:flex;align-items:center;gap:6px;flex-wrap:wrap;
  padding:11px 12px 9px;background:#fff;border-bottom:1px solid var(--line-2)}
.pg-dashboard .d3l-h b{font-size:var(--fs-title)}
.pg-dashboard .d3l-h .n{font-size:var(--fs-cap);color:var(--ink-3);font-variant-numeric:tabular-nums;margin-right:auto}
.pg-dashboard .d3l-warn{margin:8px 12px 0;font-size:var(--fs-cap);color:var(--crit)}
.pg-dashboard .d3l-rows{list-style:none;margin:0;padding:5px}
.pg-dashboard .d3r{width:100%;display:grid;grid-template-columns:12px minmax(0,1fr) auto;grid-template-rows:auto auto;
  gap:1px 8px;align-items:center;text-align:left;padding:7px 8px;border:1px solid transparent;border-radius:8px;
  background:none;font:inherit;color:var(--ink);cursor:pointer}
.pg-dashboard .d3r .st{grid-column:1;grid-row:1 / span 2}
.pg-dashboard .d3r .nm{grid-column:2;grid-row:1;font-size:var(--fs-body);font-weight:700;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pg-dashboard .d3r .n{grid-column:3;grid-row:1;font-size:var(--fs-cap);color:var(--ink-3);font-variant-numeric:tabular-nums;text-align:right;white-space:nowrap}
.pg-dashboard .d3r .hl{grid-column:2 / span 2;grid-row:2;font-size:var(--fs-cap);color:var(--ink-3);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pg-dashboard .d3r:hover{background:var(--hover)}
.pg-dashboard .d3r.on{background:#fff;border-color:#D3D7DB;box-shadow:0 1px 3px rgba(17,19,24,.09)}
.pg-dashboard .d3r:focus-visible{outline:2px solid var(--ink);outline-offset:1px}

/* 상태 점 */
.pg-dashboard .st{display:inline-block;width:8px;height:8px;border-radius:50%;flex:none}
.pg-dashboard .st-crit{background:var(--crit)}
.pg-dashboard .st-warn{background:#fff;border:1.5px solid var(--crit)}
.pg-dashboard .st-ok{background:var(--ink-4)}
.pg-dashboard .st-na{background:none}

/* 상세 */
.pg-dashboard .d3-detail{min-width:0;background:#fff;border:1px solid var(--line);border-radius:12px;padding:14px 16px 16px}
.pg-dashboard .d3d-h{display:flex;align-items:baseline;gap:9px;flex-wrap:wrap;padding-bottom:9px;border-bottom:1px solid var(--line-2)}
.pg-dashboard .d3d-h .k{font-size:var(--fs-cap);color:var(--ink-3);letter-spacing:.03em;flex-basis:100%}
.pg-dashboard .d3d-h b{font-size:var(--fs-display);letter-spacing:-.015em}
.pg-dashboard .d3d-sum{margin:10px 0 8px;font-size:var(--fs-cap);color:var(--ink-2)}
.pg-dashboard .d3-empty{margin:14px 0 0;font-size:var(--fs-body);color:var(--ink-3)}
.pg-dashboard .d3d-t{width:100%}
.pg-dashboard .d3d-t td{font-size:var(--fs-body)}
.pg-dashboard .d3d-t td.n{text-align:right;font-variant-numeric:tabular-nums;white-space:nowrap}
.pg-dashboard .d3d-t td.st-c{white-space:nowrap;font-size:var(--fs-cap);color:var(--ink-2)}
.pg-dashboard .d3d-t td.st-c .st{margin-right:6px;vertical-align:1px}
.pg-dashboard .tbl-x{overflow-x:auto}

/* 좁아지면 리스트를 위로, 상세를 아래로 */
@media (max-width:1100px){
  .pg-dashboard .dash3{grid-template-columns:minmax(0,1fr)}
  .pg-dashboard .d3-list{position:static;max-height:360px}
}