/* seminar-samsung — 시트 뷰 + 관계도
 * 원칙: 화면은 데이터 나열이 아니라 결론을 먼저 말한다 (01-DESIGN 화면 설계 원칙)
 */
:root {
  --surface: #F6F8F5; --panel: #FFFFFF; --panel-2: #FBFCFA;
  --ink: #202725; --ink-2: #5B6662; --ink-3: #8A948F;
  --border: #E1E6E0; --border-strong: #C7CFC8;
  --accent: #0A6E52; --accent-ink: #FFFFFF; --accent-soft: #E3F1EB;
  --person: #0A8560; --person-fill: #E6F4ED;
  --company: #4A57A6; --company-fill: #EAEDF8; --company-deep: #2F3B85;
  --st-doc: #1A7F37; --st-doc-bg: #E1F3E6;
  --st-verbal: #2E67B1; --st-verbal-bg: #E4EEF9;
  --st-guess: #9A6700; --st-guess-bg: #FAF0D6;
  --danger: #B4231F; --danger-bg: #FBE9E7;
  --shadow: 0 1px 2px rgba(20,30,25,.05), 0 4px 16px rgba(20,30,25,.06);
}

* { box-sizing: border-box; }
[hidden] { display: none !important; }
body {
  margin: 0; background: var(--surface); color: var(--ink);
  font-family: "Pretendard Variable", Pretendard, -apple-system, BlinkMacSystemFont, "Apple SD Gothic Neo", "Malgun Gothic", "Segoe UI", sans-serif;
  font-size: 14px; line-height: 1.55;
}
button { font: inherit; cursor: pointer; }
input, select { font: inherit; color: var(--ink); }

/* ── 상단 바 ── */
.topbar {
  display: flex; align-items: center; gap: 20px; flex-wrap: wrap;
  padding: 10px 20px; background: var(--panel);
  border-bottom: 1px solid var(--border);
  position: sticky; top: 0; z-index: 5;
}
.brand { font-weight: 800; font-size: 15px; white-space: nowrap; }
.brand small { display: block; font-weight: 500; font-size: 11px; color: var(--ink-3); letter-spacing: .04em; }
.tabs { display: flex; gap: 4px; flex-wrap: wrap; }
.tab { border: 1px solid transparent; background: none; color: var(--ink-2); padding: 7px 14px; border-radius: 8px; font-weight: 600; }
.tab:hover { background: var(--panel-2); color: var(--ink); }
.tab.active { background: var(--accent); color: var(--accent-ink); }
.tab:disabled { color: var(--ink-3); cursor: not-allowed; }
.tab .soon { font-size: 10px; font-weight: 700; color: var(--ink-3); border: 1px solid var(--border-strong); border-radius: 99px; padding: 1px 6px; margin-left: 4px; }
.tab:focus-visible, .btn:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }

main { max-width: 1280px; margin: 0 auto; padding: 20px; display: grid; gap: 16px; }

/* ── 패널/버튼 ── */
.panel { background: var(--panel); border: 1px solid var(--border); border-radius: 12px; box-shadow: var(--shadow); overflow: hidden; }
.panel-head { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; padding: 12px 16px; border-bottom: 1px solid var(--border); }
.panel-head h2 { margin: 0; font-size: 14px; font-weight: 800; }
.panel-head .count { font-size: 12px; color: var(--ink-3); }
.panel-head .right { margin-left: auto; display: flex; gap: 10px; align-items: center; font-size: 12.5px; color: var(--ink-2); }
.btn { border: 1px solid var(--border-strong); background: var(--panel); color: var(--ink); padding: 5px 12px; border-radius: 8px; font-weight: 600; font-size: 13px; }
.btn.primary { background: var(--accent); border-color: var(--accent); color: var(--accent-ink); }
.btn.small { padding: 2px 9px; font-size: 12px; }
.btn.ghost { border-color: transparent; color: var(--ink-3); }
.btn.ghost:hover { color: var(--ink); border-color: var(--border-strong); }

.hint-strip {
  display: flex; align-items: center; gap: 12px; flex-wrap: wrap;
  background: var(--accent-soft); border: 1px solid var(--border); border-radius: 12px;
  padding: 10px 16px; font-size: 13px; color: var(--ink-2);
}
.hint-strip b { color: var(--ink); }
.hint-strip .btn { margin-left: auto; }

.warn-banner {
  display: none; background: var(--danger-bg); color: var(--danger);
  border: 1px solid var(--danger); border-radius: 12px; padding: 10px 16px; font-size: 13px; font-weight: 600;
}
.warn-banner.show { display: block; }

/* ── 기업 표 ── */
.table-wrap { overflow-x: auto; }
table { border-collapse: collapse; width: 100%; min-width: 760px; }
th, td { padding: 6px 10px; text-align: left; border-bottom: 1px solid var(--border); white-space: nowrap; }
th { font-size: 11px; font-weight: 700; color: var(--ink-3); letter-spacing: .05em; background: var(--panel-2); }
td.num, th.num { text-align: right; font-variant-numeric: tabular-nums; }
tbody tr:hover td { background: var(--panel-2); }
tr.new-row td { background: var(--panel-2); }
tr.new-row .cell { border-style: dashed; border-color: var(--border-strong); background: var(--panel); }

.cell {
  width: 100%; min-width: 60px; border: 1px solid transparent; border-radius: 6px;
  background: none; padding: 4px 6px; font-size: 13.5px;
}
.cell:hover { border-color: var(--border); }
.cell:focus { border-color: var(--accent); background: var(--panel); outline: none; }
.cell.num { text-align: right; font-variant-numeric: tabular-nums; }
.cell.w-s { min-width: 52px; max-width: 76px; }
.cell.w-m { min-width: 96px; }
select.cell { max-width: 110px; }

.chip { display: inline-block; font-size: 11.5px; font-weight: 700; border-radius: 99px; padding: 2px 9px; line-height: 1.5; }
.chip.doc { color: var(--st-doc); background: var(--st-doc-bg); }
.chip.verbal { color: var(--st-verbal); background: var(--st-verbal-bg); }
.chip.guess { color: var(--st-guess); background: var(--st-guess-bg); }
.chip.plain { color: var(--ink-2); background: var(--panel-2); border: 1px solid var(--border); }
.chip.person { color: var(--person); background: var(--person-fill); }
.chip.corp { color: var(--company); background: var(--company-fill); }
.chip.risk { color: var(--danger); background: var(--danger-bg); }

/* ── 지분: 기업별 카드 + 지분 구성 바 ── */
.sh-card { border-bottom: 1px solid var(--border); padding: 14px 16px 12px; }
.sh-card:last-child { border-bottom: none; }
.sh-card-head { display: flex; align-items: baseline; gap: 10px; flex-wrap: wrap; margin-bottom: 8px; }
.sh-card-head .cname { font-size: 15px; font-weight: 800; }
.sh-card-head .cmeta { font-size: 12px; color: var(--ink-3); }
.sh-card-head .flags { margin-left: auto; display: flex; gap: 6px; }

.sh-bar {
  display: flex; height: 30px; border-radius: 7px; overflow: hidden;
  border: 1px solid var(--border-strong); background: var(--panel-2);
}
.sh-bar .seg {
  display: flex; align-items: center; justify-content: center;
  font-size: 11px; font-weight: 800; color: #fff; white-space: nowrap; overflow: hidden;
  border-right: 2px solid var(--panel); min-width: 0;
}
.sh-bar .seg:last-child { border-right: none; }
.sh-bar .seg.person { background: var(--person); }
.sh-bar .seg.corp { background: var(--company); }
.sh-bar .seg.guess { opacity: .48; }   /* 흐릴수록 확인 안 된 지분 */
.sh-bar .seg.verbal { opacity: .74; }
.sh-bar .seg.unknown {
  color: var(--ink-2); font-weight: 800; opacity: 1;
  background: repeating-linear-gradient(45deg, var(--panel-2), var(--panel-2) 5px, var(--border) 5px, var(--border) 9px);
}
.sh-bar-legend { display: flex; gap: 14px; font-size: 11px; color: var(--ink-3); margin: 4px 2px 0; flex-wrap: wrap; }

.sh-rows { margin-top: 8px; display: grid; }
.sh-row {
  display: grid; grid-template-columns: minmax(130px, 1.2fr) 90px 110px 110px 130px auto;
  gap: 8px; align-items: center; padding: 3px 0; font-size: 13.5px;
  border-bottom: 1px dashed var(--border);
}
.sh-row:last-child { border-bottom: none; }
.sh-row .owner { font-weight: 700; display: flex; gap: 6px; align-items: center; min-width: 0; }
.sh-row .owner span.nm { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.sh-row .pct { text-align: right; font-variant-numeric: tabular-nums; font-weight: 800; }
.sh-row .actions { display: flex; gap: 4px; justify-content: flex-end; }
.sh-row.ended { color: var(--ink-3); }
.sh-row.ended .owner { font-weight: 500; }
.sh-row.new { background: var(--panel-2); border-radius: 8px; padding: 5px 6px; }
.sh-add { margin-top: 6px; }
@media (max-width: 820px) { .sh-row { grid-template-columns: 1fr 80px auto; } .sh-row .sub-hide { display: none; } }

/* ── 관계도 ── */
.graph-toolbar {
  display: flex; align-items: center; gap: 16px; flex-wrap: wrap;
  padding: 10px 16px; border-bottom: 1px solid var(--border); background: var(--panel-2);
  font-size: 13px; color: var(--ink-2);
}
.graph-toolbar select { border: 1px solid var(--border-strong); border-radius: 8px; background: var(--panel); padding: 4px 10px; font-weight: 700; }
.graph-toolbar label { display: inline-flex; align-items: center; gap: 6px; font-weight: 600; color: var(--ink); }
.legend { display: flex; gap: 14px; flex-wrap: wrap; margin-left: auto; font-size: 12px; align-items: center; }
.legend .li { display: inline-flex; align-items: center; gap: 6px; }
.lg-person { width: 12px; height: 12px; border-radius: 50%; background: var(--person-fill); border: 2px solid var(--person); }
.lg-corp { width: 14px; height: 11px; border-radius: 3px; background: var(--company-fill); border: 2px solid var(--company); }
.lg-corp.ctl { background: var(--company); border-color: var(--company-deep); }
.lg-line { width: 26px; height: 0; border-top: 2px solid var(--ink-3); }
.lg-line.dash { border-top-style: dashed; }
.lg-line.dot { border-top-style: dotted; }

.summary-strip {
  display: flex; gap: 22px; flex-wrap: wrap; align-items: baseline;
  padding: 10px 16px; border-bottom: 1px solid var(--border); background: var(--panel);
  font-size: 12.5px; color: var(--ink-3);
}
.summary-strip .stat b { font-size: 17px; color: var(--ink); font-variant-numeric: tabular-nums; margin-right: 2px; }
.summary-strip .stat.risk b { color: var(--danger); }

.graph-body { display: flex; align-items: stretch; min-height: 580px; }
#cy {
  flex: 1 1 600px; min-height: 580px;
  background-color: #F8FAFC;
  background-image: radial-gradient(circle, #D1D6DB 1px, transparent 1px);
  background-size: 20px 20px;
  position: relative; overflow: hidden; cursor: grab;
}
#cy.panning { cursor: grabbing; }
.gworld { position: absolute; left: 0; top: 0; transform-origin: 0 0; }
.gworld svg { position: absolute; left: 0; top: 0; overflow: visible; }

/* 관계도 노드 = 진짜 HTML 카드 */
.gnode { position: absolute; transform: translate(-50%, -50%); cursor: pointer; user-select: none; transition: opacity .18s ease; }
.gnode.company {
  background: #FFFFFF; border: 1px solid #E2E8F0; border-radius: 12px;
  box-shadow: 0 1px 2px rgba(15, 23, 42, .05), 0 6px 16px rgba(15, 23, 42, .06);
  padding: 11px 14px; display: flex; flex-direction: column; gap: 3px; justify-content: center;
  transition: box-shadow .15s ease, border-color .15s ease, opacity .18s ease;
}
.gnode.company:hover { border-color: #94A3B8; box-shadow: 0 2px 4px rgba(15,23,42,.07), 0 12px 28px rgba(15,23,42,.10); }
.gnode.company.ctl { border-left: 4px solid #4F46E5; }
.gnode.company.core { box-shadow: 0 0 0 3px rgba(79, 70, 229, .16), 0 8px 24px rgba(15, 23, 42, .09); }
.gnode.sel {
  outline: 2px solid #4F46E5; outline-offset: 2px;
  box-shadow: 0 0 0 6px rgba(79, 70, 229, .10), 0 12px 28px rgba(15, 23, 42, .14) !important;
}
/* 포커스 모드: 비관련 요소는 한 층으로 균일하게 물러남 (찢어진 느낌 방지) */
.gnode.dimmed { opacity: .3; }
.elabel.dimmed { opacity: .3; }
.gworld path.dimmed { opacity: .15 !important; }
/* 선택된 관계선은 인디고로 살아남 */
.gworld path.hl { stroke: #4F46E5 !important; }
.elabel.hl { border-color: #A5B4FC; color: #4F46E5; }
.gnode .nm { font-weight: 700; font-size: 13.5px; line-height: 1.25; color: #0F172A; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.gnode .nm .star { color: #4F46E5; margin-right: 2px; }
.gnode .mt { font-size: 11px; color: #94A3B8; white-space: nowrap; font-variant-numeric: tabular-nums; }
/* 매출 = 카드의 주인공 숫자 (크기 서열의 핵심) */
.gnode.company .rev { font-size: 17px; font-weight: 800; color: #0F172A; font-variant-numeric: tabular-nums; letter-spacing: -.01em; line-height: 1.15; }
.gnode.company .rev span { font-size: 11px; color: #94A3B8; font-weight: 600; margin-left: 1px; }
.gnode.company.core .nm { font-size: 15.5px; }
.gnode.company.core .rev { font-size: 23px; }
/* 비지배·비핵심은 한 톤 죽여서 중요한 것이 떠오르게 */
.gnode.company.dim { border-color: #EBEEF4; box-shadow: 0 1px 2px rgba(15, 23, 42, .04); }
.gnode.company.dim .nm { color: #8494A8; }
.gnode.company.dim .rev { color: #A3AEBF; font-size: 13.5px; }
.gnode.company.dim .rev span { font-size: 10px; }
/* 리스크 = 카드 모서리 빨간 점 (스캔 1순위) */
.rdot {
  position: absolute; top: -8px; right: -8px; width: 19px; height: 19px; border-radius: 50%;
  background: var(--danger); color: #fff; font-size: 12px; font-weight: 900;
  display: flex; align-items: center; justify-content: center;
  box-shadow: 0 2px 6px rgba(180, 35, 31, .45); border: 2px solid #fff;
}
.gnode .chips { display: flex; gap: 4px; margin-top: 4px; flex-wrap: nowrap; overflow: hidden; }
/* 카드 하단 지분 구성 미니 막대: 진한=법인 보유, 연한=인물 보유, 빗금=미파악 */
.cbar {
  display: flex; height: 5px; border-radius: 99px; overflow: hidden; margin-top: 7px;
  background: repeating-linear-gradient(45deg, #F1F5F9, #F1F5F9 3px, #E2E8F0 3px, #E2E8F0 6px);
}
.cbar .s { height: 100%; }
.cbar .s.p { background: #A5B4FC; border-right: 1.5px solid #fff; }
.cbar .s.c { background: #4F46E5; border-right: 1.5px solid #fff; }
.gnode.company.dim .cbar .s.p { background: #CBD5E1; }
.gnode.company.dim .cbar .s.c { background: #94A3B8; }

.chip.mini { font-size: 10px; padding: 1px 7px; border-radius: 99px; font-weight: 700; white-space: nowrap; }
.chip.mini.ctlc { background: #4F46E5; color: #fff; }
.chip.mini.eff { background: #EEF2FF; color: #4F46E5; }
.chip.mini.ceo { background: #F1F5F9; color: #475569; border: 1px solid #E2E8F0; }
.chip.mini.warn { background: var(--danger-bg); color: var(--danger); }

.gnode.person { text-align: center; width: 120px; }
/* 파스텔 배경 + 동일 계열 진한 이니셜 (업계 관행), 인물마다 색 교대 */
.gnode.person .avatar {
  width: 48px; height: 48px; border-radius: 50%; margin: 0 auto;
  background: #E0E7FF; border: 1.5px solid #C7D2FE; color: #4338CA;
  display: flex; align-items: center; justify-content: center;
  font-weight: 800; font-size: 17px;
  box-shadow: 0 2px 8px rgba(15, 23, 42, .08);
}
.gnode.person.av1 .avatar { background: #D1FAE5; border-color: #A7F3D0; color: #047857; }
.gnode.person.av2 .avatar { background: #FEF3C7; border-color: #FDE68A; color: #B45309; }
.gnode.person.av3 .avatar { background: #FCE7F3; border-color: #FBCFE8; color: #BE185D; }
.gnode.person .pname { font-weight: 700; font-size: 12.5px; margin-top: 5px; color: #0F172A; }
.gnode.person .prole { font-size: 10.5px; color: #94A3B8; }
.gnode.person.ubo .avatar { width: 68px; height: 68px; background: #4F46E5; color: #fff; font-size: 24px; border-color: #4F46E5; box-shadow: 0 0 0 5px rgba(79, 70, 229, .14), 0 4px 12px rgba(15,23,42,.15); }
.gnode.person.ubo .pname { font-size: 14px; }
.gnode.person.succ .avatar { box-shadow: 0 0 0 4px rgba(217, 119, 6, .18), 0 2px 8px rgba(15,23,42,.08); border-color: #D97706; }

/* 간선 라벨 알약 */
.elabel {
  position: absolute; transform: translate(-50%, -50%);
  background: #FFFFFF; border: 1px solid #E2E8F0; border-radius: 99px;
  padding: 1px 8px; font-size: 10.5px; font-weight: 600; color: #475569;
  box-shadow: 0 1px 3px rgba(15, 23, 42, .06); white-space: nowrap; pointer-events: none;
  font-variant-numeric: tabular-nums; transition: opacity .18s ease;
}
.elabel.guess { border-style: dashed; color: #B45309; }
.elabel.plan { color: var(--plan, #0A6E52); border-color: #9CCBBD; background: #F0FAF6; }
.elabel.removed { color: #98A0AE; text-decoration: line-through; }

.side { flex: 0 0 330px; border-left: 1px solid var(--border); background: var(--panel-2); overflow-y: auto; max-height: 720px; }
@media (max-width: 980px) { .graph-body { flex-direction: column; } .side { border-left: none; border-top: 1px solid var(--border); flex-basis: auto; max-height: none; } }

/* 브리핑: 자동 생성 결론 목록 */
.briefing { padding: 14px 16px; display: grid; gap: 6px; border-bottom: 1px solid var(--border); }
.briefing h4 { margin: 0 0 2px; font-size: 11px; font-weight: 800; letter-spacing: .08em; color: var(--ink-3); }
.insight {
  border: none; text-align: left; background: var(--panel); border-radius: 8px;
  padding: 7px 10px 7px 12px; font-size: 12.8px; line-height: 1.45; color: var(--ink);
  border-left: 3px solid var(--border-strong); cursor: pointer; width: 100%;
}
.insight:hover { filter: brightness(.97); }
.insight.risk { border-left-color: var(--danger); background: var(--danger-bg); }
.insight.warn { border-left-color: var(--st-guess); background: var(--st-guess-bg); }
.insight.fact { border-left-color: var(--company); }
.insight b { font-weight: 800; }

/* 상세 패널 */
.detail { padding: 14px 16px; display: grid; gap: 10px; align-content: start; }
.detail h3 { margin: 0; font-size: 15px; }
.detail .sub { font-size: 12px; color: var(--ink-3); margin-top: -6px; }
.detail dl { margin: 0; display: grid; grid-template-columns: auto 1fr; gap: 3px 12px; font-size: 13px; }
.detail dt { color: var(--ink-3); }
.detail dd { margin: 0; text-align: right; font-variant-numeric: tabular-nums; font-weight: 600; }
.detail .sec { font-size: 10.5px; font-weight: 800; letter-spacing: .08em; color: var(--ink-3); margin-top: 4px; }
.detail .h-row { display: flex; align-items: center; gap: 7px; font-size: 13px; }
.detail .h-row .pct { margin-left: auto; font-variant-numeric: tabular-nums; font-weight: 700; }
.detail .note { font-size: 12.5px; border-radius: 8px; padding: 8px 10px; color: var(--danger); background: var(--danger-bg); }
.detail .empty { color: var(--ink-3); font-size: 13px; }

/* ── 인물별 지분 현황 ── */
.person-rows { display: grid; }
.person-row {
  display: flex; gap: 14px; align-items: center; flex-wrap: wrap;
  padding: 10px 16px; border-bottom: 1px solid var(--border);
}
.person-row:last-child { border-bottom: none; }
.person-row .who { flex: 0 0 220px; display: flex; gap: 6px; align-items: center; flex-wrap: wrap; }
.person-row .who .nm { font-weight: 800; font-size: 14.5px; }
.person-row .holds { flex: 1 1 320px; display: flex; gap: 8px; flex-wrap: wrap; }
.hold-pill {
  border: 1.5px solid var(--border-strong); border-radius: 8px; padding: 4px 10px;
  font-size: 12.5px; font-weight: 700; white-space: nowrap;
  background: linear-gradient(90deg, var(--person-fill) var(--fill, 0%), var(--panel) var(--fill, 0%));
}
.hold-pill b { font-variant-numeric: tabular-nums; color: var(--person); margin-left: 5px; }
.hold-pill.guess { border-style: dashed; }
.hold-pill.none { color: var(--ink-3); font-weight: 600; border-style: dashed; }

/* ── 관계도 모드 토글 (현재 / 작업 후) ── */
.mode-toggle { display: inline-flex; border: 1px solid var(--border-strong); border-radius: 9px; overflow: hidden; }
.mode-toggle button { border: none; background: var(--panel); color: var(--ink-2); padding: 6px 14px; font-weight: 700; font-size: 13px; }
.mode-toggle button.active { background: var(--accent); color: var(--accent-ink); }

/* ── 시나리오 패널 ── */
.scenario { padding: 14px 16px; display: grid; gap: 8px; border-bottom: 1px solid var(--border); }
.scenario h4 { margin: 0 0 2px; font-size: 11px; font-weight: 800; letter-spacing: .08em; color: var(--ink-3); }
.op-row {
  display: flex; gap: 6px; align-items: center; flex-wrap: wrap;
  background: var(--panel); border: 1px solid var(--border); border-left: 3px solid var(--accent);
  border-radius: 8px; padding: 6px 10px; font-size: 12.5px;
}
.op-row .t { font-weight: 800; color: var(--accent); }
.op-row .del { margin-left: auto; }
.op-form { display: grid; gap: 6px; background: var(--panel); border: 1px dashed var(--border-strong); border-radius: 8px; padding: 10px; }
.op-form .fr { display: flex; gap: 6px; flex-wrap: wrap; }
.op-form select, .op-form input { border: 1px solid var(--border); border-radius: 6px; padding: 4px 8px; font-size: 12.5px; background: var(--panel); min-width: 0; }
.op-form input { flex: 1 1 90px; }
.diff-item {
  font-size: 12.8px; background: var(--accent-soft); border-left: 3px solid var(--accent);
  border-radius: 8px; padding: 7px 10px; color: var(--ink);
}
.diff-item.neg { background: var(--st-guess-bg); border-left-color: var(--st-guess); }
.scenario .tl-note { font-size: 11.5px; color: var(--ink-3); }

/* ── 작업 이력 ── */
.timeline { padding: 14px 16px; border-top: 1px solid var(--border); display: grid; gap: 5px; }
.timeline h4 { margin: 0 0 2px; font-size: 11px; font-weight: 800; letter-spacing: .08em; color: var(--ink-3); }
.tl-item { font-size: 12.5px; color: var(--ink-2); display: flex; gap: 8px; align-items: baseline; }
.tl-item .d { color: var(--ink-3); font-variant-numeric: tabular-nums; flex: 0 0 78px; font-size: 11.5px; }
.tl-item.ev-end { color: var(--danger); }
.timeline .tl-note { font-size: 11.5px; color: var(--ink-3); margin-top: 4px; }

/* ── 원본 보관소 / 필터 조회 ── */
.drop {
  margin: 16px; border: 2px dashed var(--border-strong); border-radius: 12px;
  padding: 22px; text-align: center; color: var(--ink-2); background: var(--panel-2);
  display: grid; gap: 12px; justify-items: center;
}
.drop .drow { display: flex; gap: 10px; align-items: center; flex-wrap: wrap; justify-content: center; }
.inp { border: 1px solid var(--border-strong); border-radius: 8px; padding: 6px 10px; font-size: 13px; background: var(--panel); color: var(--ink); }
.fbar {
  display: flex; gap: 12px; padding: 14px 16px; flex-wrap: wrap; align-items: end;
  border-bottom: 1px solid var(--border); background: var(--panel-2);
}
.fbar .f { display: grid; gap: 4px; }
.fbar .f label { font-size: 10.5px; font-weight: 800; letter-spacing: .05em; color: var(--ink-3); }
.fbar .btn { margin-left: auto; }
.afoot {
  display: flex; gap: 10px; align-items: center; padding: 12px 16px;
  border-top: 1px solid var(--border); background: var(--panel-2); flex-wrap: wrap;
}
.afoot .sel { font-size: 13px; color: var(--ink-2); font-weight: 600; }
.afoot .right { margin-left: auto; display: flex; gap: 8px; }
tr.regrow td { color: var(--ink-3); background: var(--panel-2); }

/* ── 토스트 ── */
#toast {
  position: fixed; left: 50%; bottom: 28px; transform: translateX(-50%);
  background: var(--ink); color: var(--surface); padding: 10px 18px; border-radius: 10px;
  font-size: 13px; font-weight: 600; box-shadow: var(--shadow);
  opacity: 0; pointer-events: none; transition: opacity .25s; z-index: 50; max-width: 90vw;
}
#toast.show { opacity: 1; }
#toast.error { background: var(--danger); color: #fff; }

footer { max-width: 1280px; margin: 0 auto; padding: 4px 20px 32px; color: var(--ink-3); font-size: 12px; }

/* ── 확인 모달 (브라우저 기본 confirm 대체) ── */
.modal-overlay {
  position: fixed; inset: 0; z-index: 60; padding: 20px;
  background: rgba(20, 30, 25, .38);
  display: flex; align-items: center; justify-content: center;
  animation: modalFade .12s ease-out;
}
@keyframes modalFade { from { opacity: 0; } to { opacity: 1; } }
.modal {
  background: var(--panel); color: var(--ink);
  border: 1px solid var(--border); border-radius: 14px; box-shadow: var(--shadow);
  max-width: 440px; width: 100%; padding: 20px 20px 16px;
  animation: modalPop .14s ease-out;
}
@keyframes modalPop { from { transform: translateY(6px) scale(.99); opacity: .5; } to { transform: none; opacity: 1; } }
.modal-body { white-space: pre-line; font-size: 14px; line-height: 1.6; color: var(--ink); }
.modal-actions { display: flex; justify-content: flex-end; gap: 8px; margin-top: 18px; }
.modal-btn { padding: 8px 16px; border-radius: 9px; font-weight: 600; border: 1px solid transparent; }
.modal-cancel { background: var(--panel-2); border-color: var(--border); color: var(--ink-2); }
.modal-cancel:hover { background: var(--surface); color: var(--ink); }
.modal-ok { background: var(--accent); color: var(--accent-ink); }
.modal-ok:hover { filter: brightness(1.06); }
.modal-ok.danger { background: var(--danger); }
.modal-btn:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }

/* ── 비서 홈 (오늘의 브리핑) ── */
#briefing-home .bf-hd { display: flex; align-items: baseline; gap: 12px; margin-bottom: 16px; }
#briefing-home .bf-hd h1 { font-size: 20px; margin: 0; }
.bf-sub { color: var(--ink-3); font-size: 13px; }
.bf-tiles { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 12px; margin-bottom: 16px; }
.bf-tile { background: var(--panel); border: 1px solid var(--border); border-radius: 12px; padding: 14px 16px; box-shadow: var(--shadow); }
.bf-tile .n { font-size: 26px; font-weight: 800; letter-spacing: -.02em; }
.bf-tile .l { font-size: 12px; color: var(--ink-3); font-weight: 600; margin-top: 2px; }
.bf-tile.warn .n { color: var(--danger); }
.bf-grid { display: grid; grid-template-columns: 1.25fr 1fr; gap: 16px; align-items: start; }
.bf-col { display: grid; gap: 16px; }
.bf-panel { background: var(--panel); border: 1px solid var(--border); border-radius: 14px; box-shadow: var(--shadow); overflow: hidden; }
.bf-panel h2 { font-size: 13px; font-weight: 700; margin: 0; padding: 12px 16px; border-bottom: 1px solid var(--border); color: var(--ink-2); }
.bf-panel h2 span { color: var(--ink-3); font-weight: 600; }
.bf-row { display: flex; gap: 12px; align-items: flex-start; padding: 11px 16px; border-bottom: 1px solid var(--border); }
.bf-row:last-child { border-bottom: 0; }
.bf-time { font-weight: 800; color: var(--accent); min-width: 44px; font-variant-numeric: tabular-nums; }
.bf-main { flex: 1; }
.bf-meta { color: var(--ink-3); font-size: 12px; margin-top: 1px; }
.bf-empty { padding: 14px 16px; color: var(--ink-3); font-size: 13px; }
.bf-pill { display: inline-block; font-size: 11px; font-weight: 700; border-radius: 99px; padding: 2px 9px; }
.bf-pill.stage { background: var(--accent-soft); color: var(--accent); }
.bf-pill.due { background: var(--st-guess-bg); color: var(--st-guess); }
.bf-pill.today { background: var(--danger-bg); color: var(--danger); }
.bf-alert { display: flex; gap: 10px; padding: 11px 16px; border-bottom: 1px solid var(--border); }
.bf-alert:last-child { border-bottom: 0; }
.bf-alert .bf-ic { font-size: 15px; line-height: 1.3; }
.bf-alert b { font-weight: 700; }
.bf-row.gap b { color: var(--danger); }
.bf-line { display: flex; gap: 8px; padding: 7px 16px; border-bottom: 1px dashed var(--border); font-size: 13px; }
.bf-line:last-child { border-bottom: 0; }
.bf-line .bf-k { color: var(--ink-3); min-width: 72px; font-weight: 600; font-size: 12px; }
.bf-cal { display: grid; grid-template-columns: repeat(7, 1fr); gap: 4px; padding: 12px 16px 16px; }
.bf-dow { font-size: 11px; color: var(--ink-3); font-weight: 700; text-align: center; padding-bottom: 2px; }
.bf-day { border: 1px solid var(--border); border-radius: 8px; min-height: 52px; padding: 4px 5px; background: var(--panel-2); overflow: hidden; }
.bf-dn { color: var(--ink-3); font-weight: 700; font-size: 11px; }
.bf-day.td { border-color: var(--accent); background: var(--accent-soft); }
.bf-ev { display: block; margin-top: 2px; font-size: 10px; font-weight: 700; border-radius: 4px; padding: 1px 4px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.bf-ev.m { background: var(--company-fill); color: var(--company); }
.bf-ev.t { background: var(--st-guess-bg); color: var(--st-guess); }
@media (max-width: 900px) { .bf-tiles { grid-template-columns: repeat(2, 1fr); } .bf-grid { grid-template-columns: 1fr; } }

/* ── 비서 홈: 기한 임박 경고 배너 ────────────────────────── */
.bf-deadwarn { display: block; width: 100%; text-align: left; margin-bottom: 16px; cursor: pointer;
  background: var(--danger-bg); color: var(--danger); border: 1px solid #F3C9C4; border-radius: 10px;
  padding: 10px 14px; font-weight: 700; font-size: 13px; }
.bf-deadwarn:hover { filter: brightness(0.98); }
.bf-deadwarn b { font-weight: 800; }

/* ── 기한 엔진 화면 (ADR 0011) ───────────────────────────── */
#deadline-view { display: grid; gap: 16px; }
.dl-head h1 { font-size: 20px; margin: 0 0 2px; }
.dl-note { color: var(--ink-3); font-size: 12.5px; }
.dl-warn { background: var(--danger-bg); color: var(--danger); border: 1px solid #F3C9C4; border-radius: 10px; padding: 10px 14px; font-weight: 700; font-size: 13px; }
.dl-ok { background: var(--accent-soft); color: var(--accent); border: 1px solid #BFE0D2; border-radius: 10px; padding: 10px 14px; font-weight: 700; font-size: 13px; }
.dl-grid { display: grid; grid-template-columns: 1.15fr 1fr; gap: 16px; align-items: start; }
.dl-col { display: grid; gap: 16px; }
.dl-card { background: var(--panel); border: 1px solid var(--border); border-radius: 14px; box-shadow: var(--shadow); overflow: hidden; }
.dl-card h2 { font-size: 13px; font-weight: 700; margin: 0; padding: 12px 16px; border-bottom: 1px solid var(--border); color: var(--ink-2); display: flex; gap: 8px; align-items: center; }
.dl-card h2 .r { margin-left: auto; color: var(--ink-3); font-weight: 600; font-size: 12px; }
.dl-card h2 .r label { display: flex; gap: 5px; align-items: center; cursor: pointer; }

.dl-rows, .dl-rules { display: block; }
.dl-row { display: flex; gap: 10px; align-items: center; padding: 11px 16px; border-bottom: 1px solid var(--border); }
.dl-row:last-child { border-bottom: 0; }
.dl-row.done { opacity: 0.6; }
.dl-main { flex: 1; min-width: 0; }
.dl-main b { font-weight: 700; }
.dl-who { color: var(--company); font-weight: 700; font-size: 12px; margin-left: 4px; }
.dl-sub { color: var(--ink-3); font-size: 12px; margin-top: 2px; }
.dl-empty { color: var(--ink-3); font-size: 13px; padding: 14px 16px; }

.dl-dday { font-weight: 800; font-variant-numeric: tabular-nums; border-radius: 99px; padding: 3px 10px; font-size: 12px; white-space: nowrap; }
.dl-dday.red { background: var(--danger-bg); color: var(--danger); }
.dl-dday.amber { background: var(--st-guess-bg); color: var(--st-guess); }
.dl-dday.gray { background: var(--panel-2); color: var(--ink-3); border: 1px solid var(--border); }

.dl-calc { padding: 14px 16px; display: grid; gap: 10px; }
.dl-cf { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }
.dl-cf > select, .dl-cf > input { flex: 1; min-width: 90px; }
#deadline-view input, #deadline-view select { background: #fff; border: 1px solid var(--border-strong, #C7CFC8); border-radius: 8px; padding: 7px 10px; font: inherit; font-size: 13px; color: var(--ink); }
#deadline-view input[type="number"] { flex: 0 0 auto; }
.dl-out { border: 1px dashed var(--border); border-radius: 10px; padding: 10px 12px; background: var(--panel-2); display: grid; gap: 6px; }
.dl-outrow { display: flex; gap: 12px; align-items: baseline; }
.dl-outrow .k { color: var(--ink-3); font-size: 12px; font-weight: 600; min-width: 64px; }
.dl-outrow .v { font-weight: 800; color: var(--accent); font-size: 15px; }
.dl-muted { color: var(--ink-3); font-weight: 500; font-size: 12px; }

.dl-rule { display: flex; gap: 10px; align-items: center; padding: 10px 16px; border-bottom: 1px solid var(--border); }
.dl-rule:last-child { border-bottom: 0; }
.dl-rule.off { opacity: 0.5; }
.dl-rule-main { flex: 1; min-width: 0; }
.dl-rule-main b { font-weight: 700; }
.dl-cat { font-size: 11px; font-weight: 700; border-radius: 99px; padding: 2px 8px; background: var(--company-fill); color: var(--company); }
.dl-tog { width: 40px; height: 22px; border-radius: 99px; position: relative; cursor: pointer; border: none; background: var(--accent); flex: 0 0 auto; }
.dl-tog.off { background: var(--border-strong, #C7CFC8); }
.dl-tog i { position: absolute; top: 2px; left: 2px; width: 18px; height: 18px; border-radius: 50%; background: #fff; transition: .15s; }
.dl-tog.on i { left: 20px; }
.dl-addrule { padding: 12px 16px; display: grid; gap: 8px; border-top: 1px solid var(--border); background: var(--panel-2); }
.dl-addtitle { font-size: 12px; font-weight: 800; color: var(--ink-2); }
.dl-editbtn { border: 1px solid var(--border); background: var(--panel); color: var(--ink-2); border-radius: 8px; padding: 4px 10px; font-size: 11px; font-weight: 700; cursor: pointer; flex: 0 0 auto; }
.dl-editbtn:hover { border-color: var(--accent); color: var(--accent); }
.dl-rule.editing { background: var(--accent-soft); }
.dl-flabel { font-size: 12px; font-weight: 700; color: var(--ink-2); flex: 0 0 auto; }
.dl-recur { color: var(--accent); font-weight: 700; }

/* 로그아웃 (인증, ADR 0014) */
.logout { margin-left: auto; font-size: 12px; font-weight: 700; color: var(--ink-3); text-decoration: none; padding: 6px 11px; border: 1px solid var(--border); border-radius: 8px; white-space: nowrap; }
.logout:hover { color: var(--ink); border-color: var(--border-strong, #C7CFC8); }

@media (max-width: 900px) { .dl-grid { grid-template-columns: 1fr; } }

/* ── 케이스 워크스페이스 (M1 토대) ───────────────────────── */
#case-view { display: grid; gap: 14px; }
#case-view input, #case-view select, #case-view textarea { background: #fff; border: 1px solid var(--border-strong, #C7CFC8); border-radius: 8px; padding: 7px 10px; font: inherit; font-size: 13px; color: var(--ink); }
#case-view textarea { width: 100%; min-height: 60px; resize: vertical; }
.cs-empty { background: var(--panel); border: 1px solid var(--border); border-radius: 14px; box-shadow: var(--shadow); padding: 22px; color: var(--ink-2); }
.cs-newcase { margin-top: 12px; display: flex; gap: 8px; align-items: center; }
.cs-emptyrow { color: var(--ink-3); font-size: 13px; padding: 12px 15px; }
.cs-note { color: var(--ink-3); font-size: 11.5px; padding: 8px 15px; border-top: 1px solid var(--border); background: var(--panel-2); }
.cs-muted { color: var(--ink-3); font-weight: 500; font-size: 11px; }

/* 케이스 헤더 */
.cs-hd { background: var(--panel); border: 1px solid var(--border); border-radius: 14px; box-shadow: var(--shadow); padding: 13px 18px; display: flex; align-items: center; gap: 14px; flex-wrap: wrap; }
.cs-picker { font-weight: 700; }
.cs-hd h1 { font-size: 18px; margin: 0; }
.cs-meta { color: var(--ink-3); font-size: 12.5px; margin-top: 2px; }
.cs-sp { margin-left: auto; display: flex; gap: 6px; align-items: center; flex-wrap: wrap; }
.cs-newwrap { display: flex; gap: 6px; align-items: center; }

/* 트랙 보드 */
.cs-tracks { display: grid; gap: 10px; }
.cs-track { background: var(--panel); border: 1px solid var(--border); border-radius: 14px; box-shadow: var(--shadow); padding: 12px 16px; }
.cs-thd { display: flex; align-items: center; gap: 8px; margin-bottom: 10px; flex-wrap: wrap; }
.cs-tnm { font-weight: 800; }
.cs-tnext { margin-left: auto; font-size: 12px; color: var(--ink-3); display: flex; align-items: center; gap: 5px; flex-wrap: wrap; }
.cs-inline { padding: 4px 8px !important; font-size: 12px !important; min-width: 180px; }
.cs-inline-d { padding: 3px 6px !important; font-size: 12px !important; }
.cs-due { color: var(--accent); font-weight: 800; }
.cs-due.today { color: var(--danger); }
.cs-stepper { display: flex; align-items: center; overflow-x: auto; }
.cs-step { flex: 0 0 auto; }
.cs-dot { font-size: 12px; font-weight: 700; color: var(--ink-3); background: var(--panel-2); border: 1px solid var(--border); border-radius: 99px; padding: 4px 11px; white-space: nowrap; cursor: pointer; }
.cs-dot:hover { border-color: var(--accent); color: var(--accent); }
.cs-step.done .cs-dot { color: var(--accent); background: var(--accent-soft); border-color: #BFE0D2; }
.cs-step.cur .cs-dot { color: #fff; background: var(--accent); border-color: var(--accent); box-shadow: 0 2px 6px rgba(10,110,82,.3); }
.cs-link { width: 16px; height: 2px; background: var(--border); flex: 0 0 auto; }
.cs-step.done + .cs-link { background: #BFE0D2; }
.cs-addtrack { display: flex; gap: 8px; align-items: center; background: var(--panel); border: 1px dashed var(--border-strong, #C7CFC8); border-radius: 12px; padding: 10px 14px; }
.cs-addtrack input { flex: 1; }

/* 3열 */
.cs-grid { display: grid; grid-template-columns: 1fr 1fr 1.05fr; gap: 14px; align-items: start; }
.cs-card { background: var(--panel); border: 1px solid var(--border); border-radius: 14px; box-shadow: var(--shadow); overflow: hidden; }
.cs-card h2 { font-size: 13px; font-weight: 700; margin: 0; padding: 11px 15px; border-bottom: 1px solid var(--border); color: var(--ink-2); display: flex; gap: 8px; align-items: center; }
.cs-card h2 .r { margin-left: auto; color: var(--accent); font-weight: 700; font-size: 12px; cursor: pointer; }
.cs-form { padding: 12px 15px; border-bottom: 1px solid var(--border); background: var(--panel-2); display: grid; gap: 8px; }
.cs-fr { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }
.cs-mt { padding: 12px 15px; border-bottom: 1px solid var(--border); }
.cs-mt:last-child { border-bottom: 0; }
.cs-d { font-weight: 800; font-size: 12.5px; }
.cs-who { color: var(--ink-3); font-size: 12px; }
.cs-rep { margin-top: 4px; }
.cs-na { margin-top: 5px; font-size: 12.5px; color: var(--accent); font-weight: 600; }
.cs-task { display: flex; gap: 9px; align-items: center; padding: 9px 15px; border-bottom: 1px solid var(--border); }
.cs-task:last-child { border-bottom: 0; }
.cs-task input[type="checkbox"] { width: 16px; height: 16px; accent-color: var(--accent); flex: 0 0 auto; padding: 0; }
.cs-tt { flex: 1; }
.cs-tt.done { color: var(--ink-3); text-decoration: line-through; }
.cs-due2 { font-size: 11px; font-weight: 800; border-radius: 99px; padding: 2px 8px; background: var(--panel-2); border: 1px solid var(--border); color: var(--ink-3); white-space: nowrap; }
.cs-due2.today { background: var(--danger-bg); color: var(--danger); border-color: #F3C9C4; }

/* 미팅 브리핑 */
.cs-brief { border: 1.5px solid #BFE0D2; }
.cs-brief h2 { background: var(--accent-soft); color: var(--accent); border-bottom-color: #BFE0D2; }
.cs-bsec { padding: 10px 15px; border-bottom: 1px solid var(--border); }
.cs-bsec:last-child { border-bottom: 0; }
.cs-bsec .k { font-size: 11px; font-weight: 800; color: var(--ink-3); margin-bottom: 3px; }
.cs-bsec .v { font-size: 13px; }
.cs-missrow { display: flex; gap: 6px; flex-wrap: wrap; }
.cs-miss { font-size: 11px; font-weight: 700; border-radius: 99px; padding: 2px 9px; background: var(--danger-bg); color: var(--danger); }
.cs-miss.ok { background: var(--accent-soft); color: var(--accent); }
.cs-warn { color: var(--danger); font-weight: 700; }
@media (max-width: 1000px) { .cs-grid { grid-template-columns: 1fr; } }

/* 수집 체크리스트 (M2 ①) */
.cs-collect .cs-ci-list { display: block; }
.cs-ci { display: flex; gap: 10px; align-items: center; padding: 9px 15px; border-bottom: 1px solid var(--border); }
.cs-ci:last-child { border-bottom: 0; }
.cs-cilb { flex: 1; font-weight: 600; }
.cs-cat { font-size: 10.5px; font-weight: 700; border-radius: 99px; padding: 1px 7px; background: var(--panel-2); border: 1px solid var(--border); color: var(--ink-3); }
.cs-seg2 { border: 1px solid var(--border); border-radius: 8px; overflow: hidden; display: flex; flex: 0 0 auto; }
.cs-seg2b { border: 0; border-left: 1px solid var(--border); background: var(--panel-2); padding: 5px 10px; font-size: 11px; font-weight: 700; color: var(--ink-3); cursor: pointer; }
.cs-seg2b:first-child { border-left: 0; }
.cs-seg2b:hover { color: var(--ink); }
.cs-seg2b.miss { background: var(--danger-bg); color: var(--danger); }
.cs-seg2b.got { background: var(--accent-soft); color: var(--accent); }
.cs-seg2b.na { background: #EEF1EF; color: var(--ink-2); }
.cs-addci { display: flex; gap: 8px; align-items: center; padding: 10px 15px; border-top: 1px solid var(--border); background: var(--panel-2); }
.cs-addci input { flex: 1; }
.cs-grid2 { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; align-items: start; }
@media (max-width: 1000px) { .cs-grid2 { grid-template-columns: 1fr; } }

/* 증여 (M2 ②) */
.cs-gr { padding: 11px 15px; border-bottom: 1px solid var(--border); }
.cs-grtop { display: flex; gap: 8px; align-items: baseline; }
.cs-gamt { margin-left: auto; font-weight: 800; }
.cs-grsub { color: var(--ink-3); font-size: 12px; margin-top: 1px; }
.cs-gsumwrap { background: var(--panel-2); border-top: 1px solid var(--border); padding: 11px 15px; display: grid; gap: 8px; }
.cs-gsum { display: grid; gap: 5px; }
.cs-gsk { font-size: 13px; }
.cs-gsr { display: flex; gap: 10px; align-items: center; flex-wrap: wrap; }
.cs-gleft { font-weight: 700; }
.cs-gleft b { color: var(--accent); }
.cs-gchk { display: flex; gap: 5px; align-items: center; font-size: 12.5px; color: var(--ink-2); white-space: nowrap; }
.cs-gchk input { width: 15px; height: 15px; accent-color: var(--accent); }

/* ── 캘린더 통합 뷰 (M2 ④) ───────────────────────────────── */
.cal-card { background: var(--panel); border: 1px solid var(--border); border-radius: 14px; box-shadow: var(--shadow); overflow: hidden; }
.cal-bar { display: flex; align-items: center; gap: 8px; padding: 11px 15px; border-bottom: 1px solid var(--border); flex-wrap: wrap; }
.cal-mo { font-weight: 800; font-size: 15px; }
.cal-legend { margin-left: auto; display: flex; gap: 12px; font-size: 11.5px; color: var(--ink-3); flex-wrap: wrap; }
.cal-legend span { display: flex; align-items: center; gap: 5px; }
.cal-dot { width: 9px; height: 9px; border-radius: 3px; display: inline-block; }
.cal-dot.mtg { background: var(--company); }
.cal-dot.task { background: var(--st-guess); }
.cal-dot.due { background: var(--danger); }
.cal-dot.next { background: var(--ink-3); }
.cal-grid { display: grid; grid-template-columns: repeat(7, 1fr); }
.cal-dow { font-size: 11px; font-weight: 700; color: var(--ink-3); text-align: center; padding: 7px 0; border-bottom: 1px solid var(--border); }
.cal-cell { min-height: 92px; border-right: 1px solid var(--border); border-bottom: 1px solid var(--border); padding: 5px 6px; overflow: hidden; }
.cal-cell:nth-child(7n) { border-right: 0; }
.cal-cell.off { background: var(--panel-2); }
.cal-cell.td { background: var(--accent-soft); }
.cal-dn { font-size: 11px; font-weight: 700; color: var(--ink-3); }
.cal-cell.td .cal-dn { color: var(--accent); }
.cal-ev { display: block; margin-top: 3px; font-size: 10.5px; font-weight: 700; border-radius: 5px; padding: 2px 5px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.cal-ev.mtg { background: var(--company-fill); color: var(--company); }
.cal-ev.task { background: var(--st-guess-bg); color: var(--st-guess); }
.cal-ev.due { background: var(--danger-bg); color: var(--danger); }
.cal-ev.next { background: #EEF1EF; color: var(--ink-2); }

/* ── 리스크 전용 화면 (A) ─────────────────────────────────── */
#risk-view { display: grid; gap: 16px; }
.rk-head h1 { font-size: 20px; margin: 0 0 2px; }
.rk-note { color: var(--ink-3); font-size: 12.5px; }
.rk-tiles { display: grid; grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); gap: 12px; }
.rk-tile { background: var(--panel); border: 1px solid var(--border); border-radius: 12px; padding: 14px 16px; box-shadow: var(--shadow); }
.rk-tile .n { font-size: 26px; font-weight: 800; color: var(--danger); letter-spacing: -.02em; }
.rk-tile .l { font-size: 12px; color: var(--ink-3); font-weight: 600; margin-top: 2px; }
.rk-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; align-items: start; }
.rk-col { display: grid; gap: 16px; }
.rk-card { background: var(--panel); border: 1px solid var(--border); border-radius: 14px; box-shadow: var(--shadow); overflow: hidden; }
.rk-card h2 { font-size: 13px; font-weight: 700; margin: 0; padding: 12px 16px; border-bottom: 1px solid var(--border); color: var(--ink-2); display: flex; gap: 8px; align-items: center; }
.rk-card h2 .r { margin-left: auto; color: var(--ink-3); font-weight: 600; font-size: 12px; }
.rk-row { display: flex; gap: 12px; align-items: center; padding: 11px 16px; border-bottom: 1px solid var(--border); }
.rk-row:last-child { border-bottom: 0; }
.rk-ic { width: 26px; height: 26px; border-radius: 8px; display: flex; align-items: center; justify-content: center; font-size: 14px; flex: 0 0 auto; background: var(--danger-bg); }
.rk-main { flex: 1; min-width: 0; }
.rk-main b { font-weight: 700; }
.rk-sub { color: var(--ink-3); font-size: 12px; margin-top: 1px; }
.rk-amt { font-weight: 800; white-space: nowrap; }
.rk-amt.bad { color: var(--danger); }
.rk-gap { display: flex; gap: 12px; align-items: center; padding: 11px 16px; border-bottom: 1px solid var(--border); }
.rk-gap:last-child { border-bottom: 0; }
.rk-bar { flex: 1; height: 8px; border-radius: 99px; background: var(--panel-2); overflow: hidden; border: 1px solid var(--border); }
.rk-bar i { display: block; height: 100%; background: var(--danger); }
.rk-empty { color: var(--ink-3); font-size: 13px; padding: 14px 16px; }
@media (max-width: 1000px) { .rk-grid { grid-template-columns: 1fr; } }