:root {
  --bg: #141821;
  --panel: #1b2130;
  --panel-2: #202839;
  --line: #2a3247;
  --text: #e8ecf5;
  --muted: #8b94a8;
  --accent: #5b8cff;
  --accent-dim: #33415e;
  --danger: #ff6b6b;
  --radius: 10px;
}

* { box-sizing: border-box; }
html, body { height: 100%; }
body {
  margin: 0;
  background: var(--bg);
  color: var(--text);
  font: 14px/1.55 "Segoe UI Variable Text", "Segoe UI", "Malgun Gothic", sans-serif;
  display: flex;
  flex-direction: column;
  overflow: hidden;
}

/* ── 상단바 ─────────────────────────────── */
#topbar {
  display: flex; align-items: center; justify-content: space-between;
  padding: 10px 16px;
  border-bottom: 1px solid var(--line);
  background: var(--panel);
  flex: 0 0 auto;
}
.brand { display: flex; align-items: baseline; gap: 8px; }
.brand-mark { color: var(--accent); font-size: 18px; }
.brand-name { font-size: 17px; font-weight: 650; letter-spacing: .3px; }
.brand-sub { color: var(--muted); font-size: 12.5px; }

/* ── 3단 레이아웃 ───────────────────────── */
#layout {
  flex: 1 1 auto; min-height: 0;
  display: grid;
  grid-template-columns: 232px minmax(0, 1fr) 360px;
  gap: 12px;
  padding: 12px;
}
#sources, #articles, #chat {
  background: var(--panel);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  display: flex; flex-direction: column;
  min-height: 0;
}
h2 { font-size: 13px; font-weight: 600; color: var(--muted); text-transform: uppercase;
     letter-spacing: .6px; margin: 0; }
.pane-head {
  display: flex; align-items: center; justify-content: space-between;
  padding: 12px 14px 8px;
}
.muted { color: var(--muted); font-size: 12px; }
.empty { color: var(--muted); text-align: center; margin-top: 32px; font-size: 13px; }

/* ── 매체 패널 ──────────────────────────── */
#sources { padding: 12px 0 10px; }
#sources h2 { padding: 0 14px 8px; }
#source-list { list-style: none; margin: 0; padding: 0 6px; flex: 1; overflow-y: auto; }
#source-list li {
  display: flex; align-items: center; gap: 8px;
  padding: 7px 8px; border-radius: 7px; font-size: 13.5px;
}
#source-list li:hover { background: var(--panel-2); }
#source-list li.off .src-name { color: var(--muted); }
.src-name { flex: 1; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.src-del {
  border: 0; background: none; color: var(--muted); cursor: pointer;
  font-size: 15px; padding: 0 2px; visibility: hidden;
}
#source-list li:hover .src-del { visibility: visible; }
.src-del:hover { color: var(--danger); }
#source-add { display: grid; gap: 6px; padding: 10px 12px 2px; border-top: 1px solid var(--line); }
#source-add input {
  background: var(--bg); color: var(--text);
  border: 1px solid var(--line); border-radius: 7px;
  padding: 7px 9px; font-size: 13px; outline: none;
}
#source-add input:focus { border-color: var(--accent-dim); }

/* ── 기사 패널 ──────────────────────────── */
#article-list { flex: 1; overflow-y: auto; padding: 4px 10px 12px; }
.card {
  padding: 12px 12px 11px; margin: 0 2px 8px;
  background: var(--panel-2);
  border: 1px solid transparent; border-radius: var(--radius);
  cursor: pointer;
}
.card:hover { border-color: var(--accent-dim); }
.card-meta { display: flex; gap: 8px; align-items: baseline; margin-bottom: 3px; }
.badge {
  font-size: 11px; font-weight: 600; color: var(--accent);
  background: color-mix(in srgb, var(--accent) 14%, transparent);
  padding: 1.5px 7px; border-radius: 99px;
}
.card-time { color: var(--muted); font-size: 11.5px; }
.card-title { font-size: 14.5px; font-weight: 600; line-height: 1.4; }
.card-summary {
  color: var(--muted); font-size: 12.8px; margin-top: 4px;
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
}
.fetch-error { color: var(--danger); font-size: 12.5px; padding: 2px 14px 6px; }

/* ── 채팅 패널 ──────────────────────────── */
#chat-log { flex: 1; overflow-y: auto; padding: 6px 12px; display: flex; flex-direction: column; gap: 8px; }
.msg { max-width: 88%; padding: 9px 12px; border-radius: 12px; white-space: pre-wrap;
       overflow-wrap: anywhere; font-size: 13.5px; }
.msg.user { align-self: flex-end; background: var(--accent-dim); border-bottom-right-radius: 4px; }
.msg.ai { align-self: flex-start; background: var(--panel-2); border-bottom-left-radius: 4px; }
.msg.error { align-self: flex-start; background: color-mix(in srgb, var(--danger) 12%, transparent);
             color: var(--danger); }
.msg.thinking { color: var(--muted); font-style: italic; }
#chat-form { display: grid; grid-template-columns: 1fr auto; gap: 8px;
             padding: 10px 12px; border-top: 1px solid var(--line); align-items: end; }
#chat-input {
  background: var(--bg); color: var(--text);
  border: 1px solid var(--line); border-radius: 8px;
  padding: 8px 10px; font: inherit; resize: none; outline: none;
}
#chat-input:focus { border-color: var(--accent-dim); }

/* ── 공통 버튼 ──────────────────────────── */
.btn {
  border: 1px solid var(--line); border-radius: 8px;
  background: var(--panel-2); color: var(--text);
  padding: 7px 14px; font-size: 13px; cursor: pointer;
}
.btn:hover { border-color: var(--accent-dim); }
.btn.primary { background: var(--accent); border-color: var(--accent); color: #fff; font-weight: 600; }
.btn.primary:hover { filter: brightness(1.08); }
.btn:disabled { opacity: .45; cursor: default; }

::-webkit-scrollbar { width: 9px; }
::-webkit-scrollbar-thumb { background: var(--line); border-radius: 99px; }
::-webkit-scrollbar-thumb:hover { background: var(--accent-dim); }

/* ── 탭 ─────────────────────────────────── */
.tabs { display: flex; gap: 2px; }
.tab {
  border: 0; background: none; color: var(--muted); cursor: pointer;
  font-size: 13px; font-weight: 600; padding: 4px 10px; border-radius: 7px;
  text-transform: uppercase; letter-spacing: .6px;
}
.tab.active { color: var(--text); background: var(--panel-2); }

/* ── 리포트 ─────────────────────────────── */
#report-view { flex: 1; min-height: 0; display: flex; flex-direction: column; }
.report-bar, #article-bar {
  display: flex; gap: 8px; align-items: center;
  padding: 0 14px 10px;
}
.report-bar select { flex: 1; min-width: 0; }
#report-body { flex: 1; overflow-y: auto; padding: 4px 22px 24px; }

/* ── 채팅 헤더·옵션 ─────────────────────── */
.chat-session { display: flex; gap: 6px; align-items: center; min-width: 0; }
.chat-session select { max-width: 150px; }
.chat-opts {
  display: flex; gap: 12px; padding: 0 14px 8px;
  border-bottom: 1px solid var(--line);
}
.chat-opts label { display: flex; gap: 6px; align-items: center; color: var(--muted); font-size: 12px; }
select {
  background: var(--bg); color: var(--text);
  border: 1px solid var(--line); border-radius: 7px;
  padding: 4px 6px; font-size: 12.5px; outline: none;
}
select:focus { border-color: var(--accent-dim); }
.btn.small { padding: 4px 10px; font-size: 12px; }

/* ── 컨텍스트 칩 ────────────────────────── */
#context-chip {
  display: flex; gap: 8px; align-items: center;
  margin: 0 12px 0; padding: 6px 10px;
  background: color-mix(in srgb, var(--accent) 10%, transparent);
  border: 1px solid var(--accent-dim); border-radius: 8px;
  font-size: 12.5px;
}
#context-chip[hidden] { display: none; }
.chip-label { flex: 1; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.chip-x { border: 0; background: none; color: var(--muted); cursor: pointer; font-size: 15px; }
.chip-x:hover { color: var(--danger); }
.card.selected { border-color: var(--accent); }
.card-actions { float: right; }
.card-open {
  border: 0; background: none; color: var(--muted); cursor: pointer; font-size: 14px;
}
.card-open:hover { color: var(--accent); }

/* ── 마크다운 본문 ──────────────────────── */
.md { line-height: 1.65; font-size: 13.8px; }
.md h1 { font-size: 20px; margin: 14px 0 8px; }
.md h2 { font-size: 16px; margin: 16px 0 6px; color: var(--text); text-transform: none; letter-spacing: 0; }
.md h3 { font-size: 14px; margin: 12px 0 4px; }
.md p { margin: 6px 0; }
.md ul, .md ol { margin: 6px 0; padding-left: 22px; }
.md li { margin: 3px 0; }
.md a { color: var(--accent); text-decoration: none; }
.md a:hover { text-decoration: underline; }
.md code {
  background: var(--bg); border: 1px solid var(--line); border-radius: 5px;
  padding: 1px 5px; font-family: "Cascadia Code", Consolas, monospace; font-size: 12px;
}
.md pre {
  background: var(--bg); border: 1px solid var(--line); border-radius: 8px;
  padding: 10px 12px; overflow-x: auto;
}
.md pre code { border: 0; padding: 0; }
.md blockquote {
  margin: 8px 0; padding: 4px 12px;
  border-left: 3px solid var(--accent-dim); color: var(--muted);
}
.md table { border-collapse: collapse; margin: 8px 0; width: 100%; }
.md th, .md td { border: 1px solid var(--line); padding: 5px 9px; text-align: left; font-size: 12.8px; }
.md th { background: var(--panel-2); }
.msg.ai.md { max-width: 94%; }

/* ── v0.3: 상단바 기간 · 말풍선 밀도 · 옵션 줄바꿈 ── */
.chat-opts { flex-wrap: wrap; row-gap: 4px; }

/* AI 말풍선의 마크다운 여백을 촘촘하게 (실사용 피드백: 줄바꿈 간격 과도) */
.msg.md { line-height: 1.5; }
.msg.md p { margin: 3px 0; }
.msg.md ul, .msg.md ol { margin: 3px 0; padding-left: 18px; }
.msg.md li { margin: 1px 0; }
.msg.md li > p { margin: 0; }
.msg.md h1, .msg.md h2, .msg.md h3 { margin: 8px 0 3px; }
.msg.md > :first-child { margin-top: 0; }
.msg.md > :last-child { margin-bottom: 0; }
.msg.md pre { margin: 5px 0; padding: 8px 10px; }
.msg.md blockquote { margin: 5px 0; }
#report-view[hidden] { display: none !important; }  /* display:flex가 hidden을 이기지 않게 */

/* ── v0.4: 커스텀 타이틀 바 + 패널 스플리터 ── */
#topbar {
  padding: 0 0 0 16px;
  height: 44px;
  user-select: none;           /* 드래그 영역 — 텍스트 선택 금지 */
  -webkit-user-select: none;
}
.brand { pointer-events: auto; }
#win-controls { display: flex; align-self: stretch; margin-left: 14px; }
#win-controls button {
  border: 0; background: none; color: var(--muted); cursor: default;
  width: 46px; display: grid; place-items: center;
}
#win-controls button:hover { background: var(--panel-2); color: var(--text); }
#win-close:hover { background: #e81123; color: #fff; }

#layout {
  grid-template-columns: var(--w-sources, 232px) 5px minmax(0, 1fr) 5px var(--w-chat, 360px);
  gap: 0;
  padding: 12px 12px 12px;
}
#sources { margin-right: 3px; }
#chat { margin-left: 3px; }
#articles { margin: 0 3px; }
.gutter { cursor: col-resize; position: relative; }
.gutter::after {
  content: ""; position: absolute; inset: 20% 1px;
  border-radius: 2px; background: transparent;
}
.gutter:hover::after, .gutter.dragging::after { background: var(--accent-dim); }
.brand { flex: 1; }             /* actions·창버튼을 오른쪽으로 밀착 */

/* ── v0.5: 타이틀 바를 배경에 융화 ── */
#topbar { background: var(--bg); border-bottom: 0; }

/* ── v0.6: VS Code식 입력창 + 다이얼로그 + 세션 행 ── */
.chat-session { display: flex; gap: 6px; padding: 0 12px 8px; }
.chat-session select { flex: 1; min-width: 0; max-width: none; }

#chat-form {
  display: block;
  margin: 10px 12px 12px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: var(--bg);
}
#chat-form:focus-within { border-color: var(--accent-dim); }
#chat-input {
  display: block; width: 100%;
  border: 0; background: transparent; color: var(--text);
  padding: 10px 12px 2px; resize: none; outline: none;
  font-family: Consolas, "Cascadia Code", "Courier New", monospace; /* VS Code 기본 에디터 폰트 */
  font-size: 14px; line-height: 1.5;
}
.input-bar {
  display: flex; align-items: center; justify-content: space-between;
  padding: 2px 6px 6px 8px;
}
.input-opts { display: flex; flex-wrap: wrap; gap: 2px; row-gap: 4px; min-width: 0; }
.input-opts select {
  border: 0; background: transparent; color: var(--muted);
  font-size: 12px; padding: 3px 4px; border-radius: 6px; cursor: pointer;
}
.input-opts select:hover { background: var(--panel-2); color: var(--text); }
#job-bar { display: flex; flex-direction: column; gap: 4px; padding: 6px 10px 2px; font-size: 12px; color: var(--muted); }
#job-bar[hidden] { display: none !important; }
.job-row { display: flex; align-items: center; gap: 8px; }
.job-row .spin { width: 10px; height: 10px; border: 2px solid var(--border, #2a3242); border-top-color: var(--accent); border-radius: 50%; animation: job-spin 0.9s linear infinite; flex: none; }
@keyframes job-spin { to { transform: rotate(360deg); } }
.job-row button { margin-left: auto; }
.send-btn {
  flex: 0 0 auto; width: 28px; height: 28px;
  border: 0; border-radius: 7px; background: var(--accent); color: #fff;
  display: grid; place-items: center; cursor: pointer;
}
.send-btn:hover { filter: brightness(1.1); }
.send-btn:disabled { opacity: .45; }

#source-actions { padding: 10px 12px 2px; border-top: 1px solid var(--line); display: grid; }

dialog {
  background: var(--panel); color: var(--text);
  border: 1px solid var(--line); border-radius: 12px;
  padding: 18px 18px 14px; min-width: 320px;
  box-shadow: 0 12px 40px rgba(0, 0, 0, .5);
}
#src-dialog { position: fixed; left: 252px; top: 110px; margin: 0; } /* 매체 패널 옆, 모달리스 */
#confirm-dialog { margin: auto; }
dialog::backdrop { background: rgba(10, 13, 20, .55); }
dialog h3 { margin: 0 0 12px; font-size: 15px; }
.dlg-field { display: grid; gap: 4px; margin-bottom: 10px; font-size: 12.5px; color: var(--muted); }
.dlg-field input {
  background: var(--bg); color: var(--text);
  border: 1px solid var(--line); border-radius: 7px;
  padding: 7px 9px; font-size: 13px; outline: none;
}
.dlg-field input:focus { border-color: var(--accent-dim); }
#dlg-msg { margin: 2px 0 10px; font-size: 12.5px; }
#dlg-msg.err { color: var(--danger); }
#dlg-msg.ok { color: var(--muted); }
.dlg-actions { display: flex; justify-content: flex-end; gap: 8px; }
.btn.danger { background: #b3261e; border-color: #b3261e; color: #fff; }
.btn.danger:hover { filter: brightness(1.1); }
#confirm-text { margin: 2px 0 14px; font-size: 13.5px; }

/* ── v0.7: 줄간격 진범 수정 + 커스텀 콤보 + ── */
/* pre-wrap이 marked의 태그 간 소스 개행을 빈 줄로 그리던 것 — md 말풍선은 normal */
.msg.md { white-space: normal; }

select.combo-hidden { display: none !important; }
.combo {
  display: flex; align-items: center; gap: 6px;
  background: var(--bg); color: var(--text);
  border: 1px solid var(--line); border-radius: 7px;
  padding: 4px 8px; font-size: 12.5px; cursor: pointer; min-width: 0;
}
.combo:hover { border-color: var(--accent-dim); }
.combo-label { flex: 1; text-align: left; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.combo svg { flex: 0 0 auto; opacity: .65; }
.combo-min { border: 0; background: transparent; color: var(--muted); padding: 3px 5px; }
.combo-min:hover { background: var(--panel-2); color: var(--text); border: 0; }
.chat-session .combo, .report-bar .combo { flex: 1; }

.combo-menu {
  position: fixed; z-index: 1000;
  background: var(--panel); border: 1px solid var(--line); border-radius: 9px;
  box-shadow: 0 10px 32px rgba(0, 0, 0, .55);
  padding: 4px; max-height: 280px; overflow-y: auto; min-width: 120px;
}
.combo-item {
  position: relative; padding: 6px 10px 6px 26px; border-radius: 6px;
  font-size: 12.8px; cursor: pointer; max-width: 420px;
  display: flex; align-items: center; gap: 12px;
}
.combo-text { flex: 1; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.combo-count { color: var(--muted); font-size: 11.5px; flex: 0 0 auto; }
.combo-item:hover { background: var(--panel-2); }
.combo-item.sel::before { content: "✓"; position: absolute; left: 8px; color: var(--accent); }

/* 입력창과 옵션 바 사이 희미한 구분선 */
.input-bar { border-top: 1px solid color-mix(in srgb, var(--line) 65%, transparent); margin-top: 4px; padding-top: 5px; }

/* v0.8 마감: 입력창 한글은 맑은 고딕 (monospace 스택의 한글 기본값이 굴림으로 빠짐) */
#chat-input {
  font-family: Consolas, "Cascadia Code", "Malgun Gothic", "맑은 고딕", "Courier New", monospace;
}
/* 구분선 아래 옵션 바 — 상하좌우 동일 여백 */
.input-bar { padding: 6px; margin-top: 4px; }

/* ── v0.10: 입력창 축소 + 말풍선 '크게 보기' 버튼 ── */
#chat-input { font-size: 13px; padding: 7px 9px 2px; }
.msg.ai { position: relative; }
.msg-open {
  position: absolute; top: 3px; right: 5px;
  width: 20px; height: 20px; border: 0; border-radius: 5px;
  background: var(--panel); color: var(--muted);
  font-size: 12px; cursor: pointer; visibility: hidden;
}
.msg.ai:hover .msg-open { visibility: visible; }
.msg-open:hover { color: var(--accent); }

/* ── v0.12: 차트 (dataviz 검증 팔레트, 표면 #1b2130) ── */
figure.chart {
  margin: 14px 0; padding: 12px 14px 10px;
  background: var(--panel); border: 1px solid var(--line); border-radius: 10px;
}
figure.chart figcaption { font-size: 13px; font-weight: 600; color: var(--text); margin-bottom: 6px; }
.chart-svg { width: 100%; height: auto; display: block; }
.chart-svg text { font-family: system-ui, "Segoe UI", "Malgun Gothic", sans-serif; }
.chart-svg .tick { fill: #8b94a8; font-size: 10.5px; font-variant-numeric: tabular-nums; }
.chart-svg .value { fill: #c3c6d4; font-size: 10.5px; font-variant-numeric: tabular-nums; }
.chart-svg .seg-label { font-size: 11px; font-weight: 600; }
.chart-error { color: var(--muted); font-size: 12.5px; }

.chart-legend { display: flex; flex-wrap: wrap; gap: 6px 14px; margin-top: 6px; }
.legend-item { display: inline-flex; align-items: center; gap: 6px; font-size: 12px; color: var(--muted); }
.tip-key-rect { display: inline-block; width: 10px; height: 10px; border-radius: 3px; flex: 0 0 auto; }
.tip-key-line { display: inline-block; width: 14px; height: 3px; border-radius: 2px; flex: 0 0 auto; }

.chart-tip {
  position: fixed; z-index: 2000; pointer-events: none;
  background: #232b3e; border: 1px solid var(--line); border-radius: 8px;
  padding: 7px 10px; box-shadow: 0 8px 24px rgba(0, 0, 0, .5);
  font-size: 12px; max-width: 280px;
}
.tip-title { color: var(--muted); margin-bottom: 3px; font-size: 11.5px; }
.tip-row { display: flex; align-items: center; gap: 7px; margin: 2px 0; }
.tip-row strong { color: var(--text); font-variant-numeric: tabular-nums; }
.tip-name { color: var(--muted); }

.chart-table { margin-top: 8px; }
.chart-table summary { color: var(--muted); font-size: 11.5px; cursor: pointer; }
.chart-table table { border-collapse: collapse; margin-top: 6px; width: 100%; }
.chart-table th, .chart-table td {
  border: 1px solid var(--line); padding: 4px 8px; text-align: left;
  font-size: 12px; font-variant-numeric: tabular-nums;
}
.chart-table th { background: var(--panel-2); }

/* ── v0.13: 모션 — 상태 변화를 설명하는 최소한만, transform/opacity로 ── */
@media (prefers-reduced-motion: no-preference) {
  @keyframes fade-in { from { opacity: 0; } }
  @keyframes msg-in { from { opacity: 0; transform: translateY(6px); } }
  .msg { animation: msg-in 160ms ease-out; }
  @keyframes think-pulse { 50% { opacity: .55; } }
  .msg.thinking { animation: msg-in 160ms ease-out, think-pulse 1.4s ease-in-out 300ms infinite; }

  @keyframes card-in { from { opacity: 0; transform: translateY(8px); } }
  .card { animation: card-in 240ms ease-out both; animation-delay: calc(var(--i, 0) * 24ms); }

  @keyframes pane-in { from { opacity: .35; } }
  #article-list:not([hidden]), #report-view:not([hidden]) { animation: pane-in 140ms ease-out; }
  #context-chip:not([hidden]) { animation: msg-in 140ms ease-out; }

  @keyframes dlg-in { from { opacity: 0; transform: translateY(-8px) scale(.97); } }
  dialog[open] { animation: dlg-in 170ms cubic-bezier(.2, .9, .3, 1.08); }
  dialog::backdrop { animation: fade-in 170ms ease-out; }

  @keyframes menu-in { from { opacity: 0; transform: scale(.97); } }
  .combo-menu { animation: menu-in 120ms ease-out; transform-origin: top center; }
  .combo-menu.up { transform-origin: bottom center; }

  /* 차트 등장 — 막대는 베이스라인에서 자라고, 선은 그려지고, 세그먼트는 왼쪽부터 */
  @keyframes bar-grow { from { transform: scaleY(0); } }
  .anim-bar { animation: bar-grow 480ms cubic-bezier(.2, .8, .3, 1) both; transform-box: fill-box; transform-origin: 50% 100%; }
  @keyframes seg-grow { from { transform: scaleX(0); } }
  .anim-seg { animation: seg-grow 420ms cubic-bezier(.2, .8, .3, 1) both; transform-box: fill-box; transform-origin: left center; }
  .anim-fade { animation: fade-in 300ms ease-out both; }

  /* 채팅 분석이 가운데 패널로 자동 이동했음을 알리는 잔광 */
  @keyframes panel-flash {
    0% { border-color: var(--accent); box-shadow: 0 0 0 1px var(--accent), 0 0 24px rgba(91, 140, 255, .25); }
    100% { border-color: var(--line); box-shadow: none; }
  }
  #articles.flash { animation: panel-flash 900ms ease-out; }

  .btn, .combo, .tab, .src-del, .card-open, .msg-open, #win-controls button {
    transition: background-color 120ms, border-color 120ms, color 120ms, filter 120ms;
  }
  .gutter::after { transition: background 120ms; }
}

/* ── v0.14: 매체 카테고리 트리 + 아티팩트(HTML) 리포트 ── */
#source-actions, #company-actions, #sector-actions { grid-template-columns: 1fr 1fr; gap: 6px; }
#source-actions .btn, #company-actions .btn, #sector-actions .btn { padding: 7px 8px; font-size: 12.5px; white-space: nowrap; }

.cat-head {
  display: flex; align-items: center; gap: 6px;
  padding: 6px 8px 4px; margin-top: 2px;
  font-size: 12px; font-weight: 600; color: var(--muted);
  cursor: pointer; user-select: none;
}
.cat-arrow { flex: 0 0 auto; font-size: 10px; transition: transform 120ms; }
.cat-arrow.closed { transform: rotate(-90deg); }
.cat-name { flex: 1; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--text); }
.cat-count { font-weight: 400; font-size: 11px; }
.cat-act {
  border: 0; background: none; color: var(--muted); cursor: pointer;
  font-size: 12px; padding: 0 2px; visibility: hidden;
}
.cat-head:hover .cat-act { visibility: visible; }
.cat-act:hover { color: var(--accent); }
.cat-act:last-child:hover { color: var(--danger); }
#source-list li.in-cat { margin-left: 14px; }

.src-tag {
  border: 0; background: none; color: var(--muted); cursor: pointer;
  font-size: 12px; padding: 0 2px; visibility: hidden;
}
#source-list li:hover .src-tag { visibility: visible; }
.src-tag:hover { color: var(--accent); }

.cat-menu-item {
  display: flex; gap: 8px; align-items: center;
  padding: 5px 10px; border-radius: 6px;
  font-size: 12.8px; cursor: pointer; white-space: nowrap;
}
.cat-menu-item:hover { background: var(--panel-2); }

#dlg-cats { display: flex; flex-wrap: wrap; gap: 4px 12px; max-width: 300px; }
.dlg-cat { display: inline-flex; gap: 5px; align-items: center; color: var(--text); font-size: 12.8px; }

/* 아티팩트 리포트 — iframe이 패널을 꽉 채우고 스크롤은 문서가 가진다 */
#report-body.artifact { overflow: hidden; padding: 4px 14px 14px; display: flex; }
.artifact-frame {
  flex: 1; width: 100%; border: 0; border-radius: 8px;
  background: var(--bg);
}

/* ── v0.15: 카테고리 순서 변경(드래그) + 필터 + 웹 조회 토글 ── */
.cat-head.drop { box-shadow: inset 0 2px 0 var(--accent); }

#web-toggle, #report-toggle {
  display: inline-flex; gap: 4px; align-items: center; flex: 0 0 auto; white-space: nowrap;
  border: 0; background: transparent; color: var(--muted);
  font-size: 12px; padding: 3px 7px; border-radius: 6px; cursor: pointer;
}
#web-toggle:hover, #report-toggle:hover { background: var(--panel-2); }
#web-toggle.on, #report-toggle.on { color: var(--accent); }

/* ── v0.16: 설정창 + 수집 요약 바 ── */

.dlg-note { margin: 2px 0 12px; font-size: 12px; color: var(--muted); max-width: 320px; }
#settings-dialog { margin: auto; }

/* 숫자 입력 — 네이티브 스피너 대신 커스텀 스테퍼 (콤보와 같은 톤) */
input[type="number"]::-webkit-inner-spin-button,
input[type="number"]::-webkit-outer-spin-button { -webkit-appearance: none; margin: 0; }
.num-wrap {
  display: inline-flex; align-items: stretch; width: 110px;
  background: var(--bg); border: 1px solid var(--line); border-radius: 7px;
  overflow: hidden;
}
.num-wrap:focus-within { border-color: var(--accent-dim); }
.num-wrap input, .dlg-field .num-wrap input {
  flex: 1; min-width: 0; border: 0; background: transparent;
  color: var(--text); padding: 7px 9px; font-size: 13px; outline: none;
}
.num-steps { display: flex; flex-direction: column; border-left: 1px solid var(--line); }
.num-step {
  flex: 1; border: 0; background: none; color: var(--muted); cursor: pointer;
  padding: 0 7px; display: grid; place-items: center;
}
.num-step + .num-step { border-top: 1px solid var(--line); }
.num-step:hover { background: var(--panel-2); color: var(--accent); }

.fetch-summary {
  display: flex; flex-wrap: wrap; gap: 4px 8px; align-items: center;
  padding: 4px 14px 8px; font-size: 11.5px; color: var(--muted);
}
.sum-chip { background: var(--panel-2); border-radius: 99px; padding: 1px 8px; white-space: nowrap; }
.sum-range { margin-left: auto; white-space: nowrap; }

/* ── v0.17: 액티비티 바 + 기업 북마크 + 웹형 매체 ── */
#layout {
  grid-template-columns: 44px var(--w-sources, 232px) 5px minmax(0, 1fr) 5px var(--w-chat, 360px);
}
#activitybar {
  display: flex; flex-direction: column; gap: 4px;
  padding: 8px 0; align-items: center;
}
.act-btn {
  width: 34px; height: 34px; border: 0; border-radius: 9px;
  background: none; color: var(--muted); cursor: pointer;
  display: grid; place-items: center;
}
.act-btn:hover { color: var(--text); background: var(--panel); }
.act-btn.active { color: var(--accent); background: var(--panel); }

.side-view { display: flex; flex-direction: column; min-height: 0; flex: 1; }
.side-view[hidden] { display: none !important; }
#company-actions, #sector-actions { padding: 10px 12px 2px; border-top: 1px solid var(--line); display: grid; }

#company-list, #sector-list, #archive-list { list-style: none; margin: 0; padding: 0 6px; flex: 1; overflow-y: auto; }
#company-list li.company, #sector-list li.company, #archive-list li.company {
  display: flex; align-items: center; gap: 6px;
  padding: 7px 8px; border-radius: 7px; font-size: 13.5px; cursor: pointer;
}
#company-list li.company:hover, #sector-list li.company:hover, #archive-list li.company:hover { background: var(--panel-2); }
#company-list li.company.sel, #sector-list li.company.sel, #archive-list li.company.sel { background: var(--accent-dim); }
.com-name { flex: 1; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.com-act {
  border: 0; background: none; color: var(--muted); cursor: pointer;
  font-size: 13px; padding: 0 2px; visibility: hidden;
}
li.company:hover .com-act { visibility: visible; }
.com-act:hover { color: var(--accent); }
.com-act.com-del:hover { color: var(--danger); }

.com-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 0 14px; min-width: 420px; }
#com-dialog, #sec-dialog { margin: auto; }
#com-dialog textarea, #sec-dialog textarea {
  background: var(--bg); color: var(--text);
  border: 1px solid var(--line); border-radius: 7px;
  padding: 7px 9px; font: inherit; font-size: 13px; outline: none; resize: vertical;
}
#com-dialog textarea:focus, #sec-dialog textarea:focus { border-color: var(--accent-dim); }
#com-msg, #sec-msg { margin: 2px 0 10px; font-size: 12.5px; }
#com-msg.err, #sec-msg.err { color: var(--danger); }
#com-msg.ok, #sec-msg.ok { color: var(--muted); }
.com-research { margin-right: auto; }

.type-pick { display: grid; gap: 4px; }
.type-pick label {
  display: flex; gap: 6px; align-items: center;
  color: var(--text); font-size: 12.8px; cursor: pointer;
}
.src-web {
  flex: 0 0 auto; font-size: 10px; color: var(--accent);
  border: 1px solid var(--accent-dim); border-radius: 4px; padding: 0 4px;
}

/* ── v0.18: 중앙 기업 프로필 뷰 + 동명 기업 후보 선택 ── */
#company-view, #sector-view { flex: 1; min-height: 0; overflow-y: auto; padding: 8px 22px 24px; }
#company-view[hidden] { display: none !important; }
.cprof h1 { font-size: 21px; margin: 10px 0 4px; }
.cprof-sub { display: flex; flex-wrap: wrap; gap: 6px 10px; align-items: center; }
.cprof-home { color: var(--accent); font-size: 12.5px; text-decoration: none; }
.cprof-home:hover { text-decoration: underline; }
.cprof-cat {
  font-size: 11px; color: var(--accent);
  background: color-mix(in srgb, var(--accent) 12%, transparent);
  border-radius: 99px; padding: 1px 8px;
}
.cprof-tiles {
  display: grid; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr));
  gap: 10px; margin-top: 18px;
}
.cprof-tile {
  background: var(--panel-2); border: 1px solid var(--line); border-radius: 10px;
  padding: 10px 13px;
}
.cprof-tile.wide { grid-column: 1 / -1; }  /* 긴 값(주력 분야·규모 서술)은 한 줄 전체 */
.cprof-tile .k { color: var(--muted); font-size: 11.5px; margin-bottom: 3px; }
.cprof-tile .v { font-size: 13.6px; line-height: 1.55; }
.cprof-summary {
  margin: 12px 0 0; line-height: 1.65; font-size: 13.8px;
  background: var(--panel-2); border: 1px solid var(--line); border-radius: 10px;
  padding: 12px 14px;
}
.cprof-btns { display: flex; gap: 8px; margin-top: 18px; }
.cprof-meta { color: var(--muted); font-size: 11.5px; margin-top: 16px; }

#com-candidates { display: grid; gap: 6px; margin: 4px 0 10px; }
#com-candidates[hidden] { display: none !important; }
.com-cand-title { color: var(--muted); font-size: 12.3px; }
.com-cand {
  text-align: left; border: 1px solid var(--line); border-radius: 8px;
  background: var(--bg); color: var(--text); padding: 8px 10px;
  cursor: pointer; font-size: 12.8px;
}
.com-cand:hover { border-color: var(--accent-dim); background: var(--panel-2); }
.com-cand:disabled { opacity: .5; cursor: default; }
.com-cand b { display: block; }
.com-cand span { color: var(--muted); font-size: 12px; }

/* ── v0.20: 섹터 북마크 — 리서치 결과 카드에서 등록할 섹터 선택 ── */
#sec-dialog { width: 820px; max-width: 92vw; }
#sec-fields { display: grid; }
#sec-fields[hidden], #sec-results[hidden] { display: none !important; }
#sec-results {
  display: grid; gap: 8px; margin: 4px 0 10px;
  max-height: 56vh; overflow-y: auto;
}
.sec-results-title { color: var(--muted); font-size: 12.3px; }
.sec-card {
  display: flex; gap: 10px; align-items: flex-start;
  text-align: left; border: 1px solid var(--line); border-radius: 8px;
  background: var(--bg); padding: 9px 11px; cursor: pointer;
}
.sec-card:hover { border-color: var(--accent-dim); background: var(--panel-2); }
.sec-card:has(input:checked) { border-color: var(--accent); }
.sec-card input { margin-top: 3px; }
.sec-card .sec-card-body { min-width: 0; font-size: 12.6px; line-height: 1.5; overflow-wrap: anywhere; }
.sec-card b { font-size: 13.2px; }
.sec-card-kind {
  margin-left: 6px; font-size: 10.5px; color: var(--accent);
  border: 1px solid var(--accent-dim); border-radius: 4px; padding: 0 4px;
  vertical-align: 1px; white-space: nowrap;
}
.sec-card-sum { margin: 3px 0 5px; color: var(--text); }
.sec-kv { color: var(--muted); margin-top: 3px; }
.sec-kv b { color: var(--text); font-size: 11.5px; font-weight: 600; margin-right: 4px; }

/* ── v0.20: 상장 정보 (시세·차트·공시·재무) ── */
.market-sec { margin-top: 26px; border-top: 1px solid var(--line); padding-top: 12px; }
.market-head { display: flex; gap: 10px; align-items: baseline; }
.market-head .btn { margin-left: auto; }
.quote-row { display: flex; gap: 12px; align-items: baseline; flex-wrap: wrap; margin: 10px 0 2px; }
.quote-price { font-size: 26px; font-weight: 700; font-variant-numeric: tabular-nums; }
.quote-chg { font-size: 14px; font-weight: 600; font-variant-numeric: tabular-nums; }
.quote-chg.up { color: #ff6b6b; }     /* 국내 관례: 상승 빨강 */
.quote-chg.down { color: #5b8cff; }
.quote-sub { color: var(--muted); font-size: 12px; }
.price-chart { width: 100%; height: auto; display: block; margin-top: 2px; }
.price-chart .tick { fill: #8b94a8; font-size: 10.5px; font-variant-numeric: tabular-nums; }
.price-chart .value { fill: #c3c6d4; font-size: 10.5px; font-weight: 600; font-variant-numeric: tabular-nums; }

.market-cols { display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: 12px; margin-top: 12px; }
.market-card { background: var(--panel-2); border: 1px solid var(--line); border-radius: 10px; padding: 10px 13px; }
.market-card h3 { margin: 0 0 8px; font-size: 12px; font-weight: 600; color: var(--muted); }
.filing-row { display: flex; gap: 10px; align-items: baseline; margin: 5px 0; font-size: 12.8px; }
.filing-row a { flex: 1; color: var(--accent); text-decoration: none; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.filing-row a:hover { text-decoration: underline; }
.filing-row .muted { white-space: nowrap; font-size: 11.5px; }
.fin-table { width: 100%; border-collapse: collapse; font-size: 12.5px; }
.fin-table th, .fin-table td { padding: 4px 6px; border-bottom: 1px solid var(--line); text-align: right; font-variant-numeric: tabular-nums; }
.fin-table td:first-child { text-align: left; color: var(--muted); }
.fin-table tr:last-child td { border-bottom: 0; }
.market-note { color: var(--muted); font-size: 11.5px; margin: 10px 0 0; }
.market-err { color: var(--danger); font-size: 12.5px; margin: 8px 0 0; }

/* 로그인 안내 */
.msg.notice {
  align-self: center; max-width: 96%;
  background: transparent; border: 1px dashed var(--line);
  color: var(--muted); font-size: 12.5px;
}
.login-btn { margin-top: 6px; }

/* ── 브라우저 모드 (Argus.Web): 창 제어 버튼은 WebView2 셸에만 있다 ── */
body.browser #win-controls { display: none; }
body.browser #topbar { cursor: default; }

/* ── 로그인·승인 대기 화면 (login.html, pending.html) ── */
body.auth { display: flex; align-items: center; justify-content: center; min-height: 100vh; margin: 0; }
.auth-card {
  width: min(420px, 90vw); padding: 36px 32px; border-radius: 12px;
  background: var(--panel, #1b2130); border: 1px solid var(--border, #2a3242);
  display: flex; flex-direction: column; gap: 18px; align-items: flex-start;
}
.auth-card .brand { display: flex; align-items: baseline; gap: 8px; }
.auth-title { margin: 0; font-size: 18px; }
.auth-lead { margin: 0; line-height: 1.6; color: var(--muted, #9aa4b8); }
.auth-error { margin: 0; padding: 10px 12px; border-radius: 8px; background: rgba(232, 17, 35, .12); color: #ff8a95; font-size: 13px; }
.auth-btn { align-self: stretch; text-align: center; text-decoration: none; padding: 10px 14px; font-size: 14px; }
#account { position: relative; margin-left: 14px; margin-right: 12px; font-size: 12px; }
.account-btn { display: flex; align-items: center; gap: 8px; padding: 4px 8px 4px 4px; border-radius: 16px; border: 1px solid transparent; background: transparent; color: var(--text); cursor: pointer; font: inherit; }
.account-btn:hover, .account-btn[aria-expanded="true"] { background: var(--panel-2, #222a3a); border-color: var(--border, #2a3242); }
.account-btn #account-name { max-width: 160px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.avatar { width: 22px; height: 22px; border-radius: 50%; background: var(--accent, #4f7cff); color: #fff; display: inline-flex; align-items: center; justify-content: center; font-size: 11px; font-weight: 600; flex: none; }
.menu { position: absolute; right: 0; top: calc(100% + 6px); min-width: 220px; background: var(--panel, #1b2130); border: 1px solid var(--border, #2a3242); border-radius: 10px; box-shadow: 0 10px 30px rgba(0,0,0,.45); padding: 6px; z-index: 50; }
.menu-head { display: flex; flex-direction: column; gap: 2px; padding: 8px 10px 10px; border-bottom: 1px solid var(--border, #2a3242); margin-bottom: 6px; }
.menu-head b { font-size: 13px; }
.menu-head .muted { font-size: 11px; word-break: break-all; }
.menu-item { display: block; width: 100%; text-align: left; padding: 8px 10px; border-radius: 6px; border: 0; background: transparent; color: var(--text); font: inherit; font-size: 13px; text-decoration: none; cursor: pointer; box-sizing: border-box; }
.menu-item:hover { background: var(--panel-2, #222a3a); }
.menu-item[hidden] { display: none; }  /* display:block이 hidden을 이기지 않게 (관리 메뉴는 관리자에게만) */

/* ── 헬퍼 배너·기기 목록·설치 가이드 ── */
#helper-banner, #dup-banner { background: #3a2f12; color: #ffd57a; padding: 8px 16px; font-size: 13px; border-bottom: 1px solid #5a4a1c; }
#helper-banner[hidden], #dup-banner[hidden] { display: none !important; }
#helper-banner a { color: #ffe8a8; margin-left: 8px; }
#set-devices h4 { margin: 12px 0 6px; font-size: 13px; }
#device-list { list-style: none; margin: 0; padding: 0; }
.device-row { display: flex; justify-content: space-between; align-items: center; gap: 8px; padding: 6px 0; border-bottom: 1px solid var(--border, #2a3242); font-size: 13px; }
.device-row .muted { font-size: 12px; }
.device-dot { display: inline-block; width: 8px; height: 8px; border-radius: 50%; background: #5a6478; margin-right: 6px; }
.device-dot.on { background: #2f9c5f; }
.setup-card { width: min(680px, 92vw); }
.step { display: flex; gap: 14px; align-items: flex-start; padding: 12px 0; border-top: 1px solid var(--border, #2a3242); width: 100%; }
.step .mark { width: 24px; height: 24px; border-radius: 50%; border: 1px solid var(--border, #2a3242); display: flex; align-items: center; justify-content: center; font-size: 12px; flex: none; }
.step.done .mark { background: #1f6f43; border-color: #2f9c5f; color: #fff; }
.step p { margin: 6px 0 0; line-height: 1.6; }
.setup-card code, #dev-code code { background: var(--panel-2, #222a3a); padding: 2px 6px; border-radius: 4px; font-size: 12px; user-select: all; }
.setup-card code.copyable { cursor: pointer; user-select: none; position: relative; }
.setup-card code.copyable:hover { outline: 1px solid var(--accent, #5aa9ff); }
.setup-card code.copied { background: var(--accent, #5aa9ff); color: #0d1117; }
code.pair-code { font-size: 18px; letter-spacing: 3px; padding: 4px 10px; }
code.hash { display: inline-block; margin-top: 4px; word-break: break-all; font-size: 11px; }

/* ── 관리 화면 (관리자 전용) ── */
.badge { display: inline-block; min-width: 16px; padding: 0 6px; border-radius: 10px; background: #e8a33a; color: #1b1b1b; font-size: 11px; font-weight: 600; text-align: center; margin-left: 6px; line-height: 16px; }
.admin-dialog { width: min(960px, 94vw); max-height: 88vh; overflow: auto; }
.admin-head { display: flex; justify-content: space-between; align-items: center; }
.admin-head h3 { margin: 0; }
.admin-tabs { margin: 10px 0 12px; }
.admin-pane table { width: 100%; border-collapse: collapse; font-size: 12px; }
.admin-pane th, .admin-pane td { padding: 6px 8px; border-bottom: 1px solid var(--border, #2a3242); text-align: left; vertical-align: top; }
.admin-pane th { color: var(--muted, #9aa4b8); font-weight: 500; white-space: nowrap; }
.admin-pane td.actions { white-space: nowrap; }
.admin-pane td.actions .btn, .admin-pane td .combo { margin-right: 4px; }
.admin-pane select { font-size: 12px; }
.status-pending { color: #ffd57a; }
.status-disabled, .status-rejected { color: #ff8a95; }
.status-active { color: #7fd39a; }
.admin-pane .empty { padding: 20px 0; }
.admin-devices { margin: 4px 0 0; padding: 0; list-style: none; font-size: 12px; }
.admin-devices li { display: flex; gap: 8px; align-items: center; padding: 3px 0; }
.audit-time { white-space: nowrap; color: var(--muted, #9aa4b8); }
.badge[hidden] { display: none; }

/* 로그인·대기·설치 가이드 페이지의 링크: 브라우저 기본 파랑은 어두운 배경에서 읽기 어렵다 */
body.auth a { color: #9fbcff; text-decoration: underline; text-underline-offset: 3px; text-decoration-color: rgba(159, 188, 255, .45); }
body.auth a:hover { color: #c7d7ff; text-decoration-color: currentColor; }
body.auth a.btn { text-decoration: none; }

/* ── 탐색 탭: 키워드 연상 그래프 ── */
#graph-view { flex: 1; min-height: 0; display: flex; flex-direction: column; padding: 0 14px 10px; gap: 8px; }
#graph-view[hidden] { display: none !important; }
.graph-bar { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; font-size: 12px; }
.graph-bar .spacer { flex: 1; }
#graph-search { width: 200px; padding: 7px 12px; border-radius: 8px; border: 1px solid var(--line); background: var(--bg); color: var(--text); font: inherit; font-size: 13px; }
#graph-search:focus { outline: none; border-color: var(--accent-dim); }
.graph-path { display: flex; align-items: center; gap: 4px; flex-wrap: wrap; }
.graph-path-sep { color: var(--muted); }
.graph-crumb { border: 1px solid var(--border, #2a3242); background: var(--panel-2, #222a3a); color: var(--text); border-radius: 12px; padding: 2px 9px; font: inherit; font-size: 12px; cursor: pointer; }
.graph-crumb.active { border-color: var(--accent); color: #fff; background: color-mix(in srgb, var(--accent) 30%, transparent); }
.graph-crumb.muted { color: var(--muted); }
.graph-legend { display: flex; gap: 10px; color: var(--muted); font-size: 11px; }
.graph-legend-item { display: inline-flex; align-items: center; gap: 4px; }
.gd-dot { display: inline-block; width: 8px; height: 8px; border-radius: 50%; margin-right: 5px; }
#graph-canvas { flex: 1; min-height: 0; border: 1px solid var(--border, #2a3242); border-radius: 10px; overflow: hidden; background: color-mix(in srgb, var(--bg) 70%, transparent); }
#graph-canvas canvas { display: block; }
#graph-detail { max-height: 40%; overflow: auto; border: 1px solid var(--border, #2a3242); border-radius: 10px; padding: 8px 12px; font-size: 12.5px; background: var(--panel, #1b2130); }
#graph-detail[hidden] { display: none !important; }
.gd-head { display: flex; align-items: center; gap: 8px; margin-bottom: 6px; }
.gd-head .spacer { flex: 1; }
.gd-head b { font-size: 14px; }
.gd-cols { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.gd-cols h4 { margin: 4px 0 6px; font-size: 11px; color: var(--muted); font-weight: 500; text-transform: uppercase; }
.gd-cols ul { list-style: none; margin: 0; padding: 0; }
.gd-cols li { padding: 3px 0; line-height: 1.45; }
.gd-neighbor { border: 0; background: none; color: var(--text); font: inherit; cursor: pointer; padding: 0; text-align: left; }
.gd-neighbor:hover { color: #c7d7ff; }
.gd-why { display: block; color: var(--muted); font-size: 11.5px; margin-left: 13px; }
#gd-articles a { color: #9fbcff; text-decoration: none; }
#gd-articles a:hover { text-decoration: underline; }
.graph-status { margin: 0; font-size: 12px; min-height: 16px; }
.graph-status.busy { color: var(--accent); }

/* ── 탐색 탭: 3D 모드 ── */
#graph-canvas-3d { flex: 1; min-height: 0; position: relative; border: 1px solid var(--border, #2a3242); border-radius: 10px; overflow: hidden; background: #0f131c; }
#graph-canvas-3d[hidden], #graph-canvas[hidden] { display: none !important; }
#graph-canvas-3d canvas { display: block; }
#graph-labels { position: absolute; inset: 0; pointer-events: none; overflow: hidden; }
.g3-label { position: absolute; left: 0; top: 0; pointer-events: auto; cursor: pointer; white-space: nowrap; font-size: 12px; color: #e8ecf5; text-shadow: 0 0 4px #0f131c, 0 0 8px #0f131c, 0 1px 2px #000; padding: 1px 4px; border-radius: 4px; }
.g3-label.sel { font-weight: 700; font-size: 14px; color: #fff; background: rgba(91,140,255,.25); }
#graph-mode { min-width: 44px; }
.gd-summary { margin: 0 0 8px; color: var(--muted); font-size: 12.5px; line-height: 1.5; }
/* 로그인 버튼: Google 브랜드 가이드의 흰 바탕 + G 로고 (로그인 수단이 Google뿐임을 보여준다) */
.auth-btn.google { display: flex; align-items: center; justify-content: center; gap: 12px; background: #fff; border-color: #dadce0; color: #1f1f1f; font-weight: 600; }
.auth-btn.google:hover { background: #f4f6fb; border-color: #c6cbd4; }
.auth-btn.google .google-g { flex: none; }

/* ── 리포트 아카이브 ── */
.archive-tools { display: flex; gap: 6px; padding: 0 8px 6px; }
.archive-tools input {
  flex: 1; min-width: 0;
  background: var(--bg); color: var(--text);
  border: 1px solid var(--line); border-radius: 7px;
  padding: 6px 9px; font: inherit; font-size: 13px; outline: none;
}
.archive-tools input:focus { border-color: var(--accent-dim); }
.archive-tools .combo { flex: 0 0 auto; max-width: 108px; }

.tag-row { display: flex; flex-wrap: wrap; gap: 4px; padding: 0 8px 6px; }
.tag-row[hidden] { display: none; }
dialog .tag-row { padding: 4px 0 0; }
.tag-chip {
  border: 1px solid var(--line); border-radius: 999px;
  background: var(--panel-2); color: var(--muted);
  padding: 1px 8px; font: inherit; font-size: 11px; line-height: 1.5; cursor: pointer;
}
.tag-chip:hover { color: var(--text); }
.tag-chip.on { background: var(--accent-dim); border-color: var(--accent); color: var(--text); }
.tag-chip.mini { font-size: 10px; padding: 0 6px; }

#archive-list li.company { flex-wrap: wrap; }
.arc-date { font-size: 11px; color: var(--muted); }
#archive-list .arc-meta { display: flex; flex-wrap: wrap; align-items: center; gap: 3px 4px; flex-basis: 100%; margin-top: 1px; }
#archive-list .arc-date { margin-right: 2px; }
#archive-dialog { margin: auto; }
#arc-dlg-report { margin: -6px 0 12px; font-size: 13px; }

/* ── 기사 도구 줄 + 바 높이 통일 ── */
#article-bar[hidden] { display: none !important; }
#article-bar label { display: flex; gap: 6px; align-items: center; white-space: nowrap; }
#fetch-status { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.combo[data-for="cat-filter"] { flex: 0 0 160px; width: 160px; }
.report-bar .btn, #article-bar .btn { padding: 4px 10px; font-size: 12.5px; line-height: 1.4; }
.report-bar .combo, #article-bar .combo { line-height: 1.4; }

/* 미분류 그룹엔 ✎·× 버튼이 없다 — order로 건수를 항상 맨 오른쪽에 */
.cat-head .cat-act { order: 1; }
.cat-head .cat-count { order: 2; min-width: 14px; text-align: right; }