/* lenses.css — Lenses (Structured Intelligence) 섹션 전용 스타일
   원본: homepage_dy_application_v1.1.4.html 의 <style> 블록
   - 전역 변수/리셋이 기존 connectionary.css·hero.css와 충돌하지 않도록
     모든 규칙을 .lenses 컨테이너 아래로 스코프 (CSS nesting 사용)
   - 외부 페이지(body, html, header 등)에는 영향 없음 */

.lenses {
  /* ── primitives는 :root에서 상속 (connectionary.css) ──
     --white, --ink, --ink-rgb, --mint, --mint-rgb, --bg, --muted, --line 등 */

  /* ── 별칭 (lenses 내부 명명과 root 토큰 연결) ── */
  --fg: var(--ink);
  --fg-rgb: var(--ink-rgb);

  /* ── lenses 고유 토큰 ── */
  --bg-soft: #F5F5F2;
  --bg-tech: #FAFAF7;
  --fg-soft: #2A2C33;
  --mute-2: #8E9098;

  --accent: var(--mint);
  --accent-soft: rgba(var(--mint-rgb), 0.14);
  --accent-softer: rgba(var(--mint-rgb), 0.06);

  /* 콘텐츠 분류 (figure/quote/relation) */
  --c-figure: #0284C7;
  --c-quote: #D97706;
  --c-relation: #6D28D9;
  --c-figure-soft: rgba(2, 132, 199, 0.10);
  --c-quote-soft: rgba(var(--concern-rgb), 0.12);
  --c-relation-soft: rgba(109, 40, 217, 0.10);
  --c-figure-bd: rgba(2, 132, 199, 0.22);
  --c-quote-bd: rgba(var(--concern-rgb), 0.24);
  --c-relation-bd: rgba(109, 40, 217, 0.22);

  /* 의견/판단 강도 */
  --strengthen: var(--sig-negative);
  --strengthen-soft: rgba(var(--sig-negative-rgb), 0.08);
  --concern: #D97706;
  --concern-soft: rgba(var(--concern-rgb), 0.08);
  --weaken: #15803D;
  --weaken-soft: rgba(21, 128, 61, 0.08);

  /* 시그널 색 (조직 비교 등) */
  --sig-positive: #16A34A;
  --sig-positive-rgb: 22, 163, 74;
  --sig-negative: #DC2626;
  --sig-negative-rgb: 220, 38, 38;
  --sig-warning: #F59E0B;
  --sig-warning-rgb: 245, 158, 11;
  --sig-neutral: #9CA3AF;
  /* concern/c-quote 의 rgba 변형용 (둘 다 #D97706) */
  --concern-rgb: 217, 119, 6;

  /* 카테고리 팔레트 (차트·플래그·그룹 라벨) */
  --info-blue: #3B82F6;
  --violet: #8B5CF6;
  --indigo: #6366F1;
  --indigo-rgb: 99, 102, 241;
  --gold: #C9A56B;
  --gold-rgb: 201, 165, 107;
  --gold-deep: #B58B47;
  --rose: #D87A7A;
  --rose-rgb: 216, 122, 122;
  --rose-deep: #C25E5E;
  --sky: #8FB4D4;
  --blue-deep: #5B7FB8;

  /* 선/테두리 — ink alpha 기반 */
  --border: rgba(var(--ink-rgb), 0.10);
  --line: rgba(var(--ink-rgb), 0.08);
  --line-soft: rgba(var(--ink-rgb), 0.04);

  --mono: var(--font-jetbrains-mono), 'JetBrains Mono', 'SF Mono', 'Fira Code', Consolas, monospace;

  /* 원본 body 룰 → 컨테이너에 적용 */
  font-family: 'Pretendard', -apple-system, BlinkMacSystemFont, system-ui, sans-serif;
  background: var(--bg);
  color: var(--fg);
  line-height: 1.5;
  -webkit-font-smoothing: antialiased;
}

/* Tighten the gap between the Demo card section (#demo) and the "글로벌
   지형 위에서…" headline. section { padding: 76px 0 } 의 76px top + Demo
   섹션의 76px bottom + .struct-intel 의 28px top margin 이 합쳐져 180px 의
   빈 공간이 생겼는데, hero/demo 가 바로 위에 붙어 있어 그만큼 떨어질 필요는
   없음. .lenses top padding 만 76 → 24 로 줄여서 cards → chapter 1 의
   gap 과 비슷한 호흡으로 맞춤. */
.lenses { padding-top: 24px; }

/* 원본의 * { box-sizing/margin/padding } 리셋 → 스코프 한정 */
.lenses,
.lenses *,
.lenses *::before,
.lenses *::after { box-sizing: border-box; }
.lenses :is(div, section, article, aside, header, footer, nav,
            ul, ol, li, dl, dt, dd,
            p, h1, h2, h3, h4, h5, h6,
            figure, blockquote, table, th, td) { margin: 0; padding: 0; }

/* ===== 본문 규칙 (CSS nesting으로 .lenses 스코프 내부에 위치) ===== */
.lenses {
  /* ====== 모드 안내 배너 ====== */
  .review-banner {
    background: #FEF3C7;
    border-bottom: 1px solid #FDE68A;
    padding: 10px 24px;
    text-align: center;
    font-size: 11px;
    color: #92400E;
    letter-spacing: 0;
  }
  .review-banner strong { color: #78350F; }

  /* ====== 섹션 헤더 ====== */
  /* 폭은 connectionary.css 의 .page 와 동일하게 맞춤 */
  .section-intro {
    width: min(1180px, calc(100% - 40px));
    margin: 0 auto;
    padding: 60px 0 40px;
  }
  .section-intro-grid {
    display: grid;
    grid-template-columns: 240px 1fr;
    gap: 52px;
    align-items: start;
  }
  .section-num {
    font-size: 12px;
    color: var(--mute-2);
    letter-spacing: 0;
    font-weight: 600;
    margin-bottom: 10px;
  }
  .section-label {
    font-size: 12px;
    color: var(--accent);
    letter-spacing: 0;
    font-weight: 700;
  }
  .section-intro h2 {
    font-size: clamp(28px, 3.6vw, 40px);
    line-height: 1.2;
    letter-spacing: -0.03em;
    font-weight: 700;
    margin-bottom: 18px;
  }
  .section-lead {
    font-size: 16px;
    color: var(--fg-soft);
    line-height: 1.65;
    max-width: 740px;
  }
  .section-lead strong {
    color: var(--accent);
    font-weight: 600;
  }
  /* 인트로 lead 아래 진화 메시지 */
  .section-lead-evolve {
    margin-top: 16px;
    padding-top: 14px;
    border-top: 1px solid var(--accent-soft);
    font-size: 13px;
    color: var(--accent);
    font-weight: 500;
    letter-spacing: -0.005em;
    max-width: 740px;
    line-height: 1.5;
  }

  /* Closing 박스 (섹션 마지막) */
  .section-closing {
    width: min(1180px, calc(100% - 40px));
    margin: 30px auto 0;
    padding: 36px 0 60px;
  }
  .section-closing-grid {
    display: grid;
    grid-template-columns: 240px 1fr;
    gap: 52px;
    align-items: start;
  }
  .section-closing-eyebrow {
    font-size: 10px;
    letter-spacing: 0;
    color: var(--accent);
    font-weight: 700;
  }
  .section-closing-title {
    font-size: 18px;
    font-weight: 700;
    color: var(--fg);
    letter-spacing: -0.01em;
    line-height: 1.3;
    margin-bottom: 14px;
  }
  .section-closing-body {
    font-size: 15px;
    color: var(--fg-soft);
    line-height: 1.65;
    max-width: 720px;
  }
  .section-closing-body strong {
    color: var(--accent);
    font-weight: 600;
  }

  /* ====== 챕터 컨테이너 ====== */
  .chapters {
    width: min(1180px, calc(100% - 40px));
    margin: 0 auto;
    /* bottom: 80 → 32 — sticky scroll-driven 시절의 outro buffer 는 줄이되,
       chapter 3 와 Common Foundation 사이 호흡은 살짝 남김. */
    padding: 20px 0 32px;
    display: flex;
    flex-direction: column;
    gap: 56px;
  }

  .chapter {
    display: grid;
    grid-template-columns: 260px 1fr;
    gap: 36px;
    align-items: start;
  }

  /* ====== Normal-flow chapters (chapter1 → 2 → 3 가 위→아래로 자연스럽게 등장) ======
     이전엔 .chapters--scroll-driven 가 sticky + height 380vh 로 한 자리에서
     chapter 를 swap 했지만, 스크롤해도 페이지가 "안 내려가는" 답답함 + 데모
     자동 advance 와 사용자 스크롤이 섞여 인지 부담이 컸음. 이제는 chapter
     들이 normal flow 로 쌓이고, lenses.js 의 IntersectionObserver 가 각 chapter
     가 viewport 에 들어오는 순간 해당 replay 버튼을 1회 click 해서 데모만
     자동 재생. */
  .chapters--scroll-driven {
    /* .chapters base (flex column, gap 56px) 그대로 — sticky/height 트릭 제거 */
  }
  .chapters-sticky {
    display: flex;
    flex-direction: column;
    gap: 56px;
  }
  .chapters--scroll-driven .chapter {
    /* 항상 보이고 fade 없음. .chapter base grid 룰 그대로 사용 */
  }

  /* 좌측 텍스트 (네러티브) */
  .chapter-narrative {
    padding-top: 8px;
  }
  .chapter-tag {
    /* 13 → 17 — 기업/산업/정책의 시선 (chapter 라벨) 만 키움.
       내러티브 헤드라인/본문/chip 은 그대로. */
    font-size: 17px;
    letter-spacing: 0;
    color: var(--accent);
    font-weight: 700;
    margin-bottom: 14px;
    display: flex;
    align-items: center;
    gap: 10px;
  }
  .chapter-tag::before {
    content: '';
    width: 22px;
    height: 1.5px;
    background: var(--accent);
  }
  .chapter-narrative h3 {
    font-size: 22px;
    font-weight: 700;
    color: var(--fg);
    letter-spacing: -0.02em;
    line-height: 1.3;
    margin-bottom: 12px;
  }
  .chapter-narrative p {
    font-size: 16.5px;
    color: var(--fg-soft);
    line-height: 1.65;
    margin-bottom: 12px;
  }
  .chapter-narrative p .em {
    color: var(--accent);
    font-weight: 600;
  }
  .chapter-narrative p strong {
    color: var(--fg);
    font-weight: 600;
  }
  .chapter-fws {
    margin-top: 14px;
    display: flex;
    flex-wrap: wrap;
    gap: 5px;
    font-size: 11.5px;
  }
  .chapter-fw-chip {
    padding: 4px 10px;
    background: var(--bg-soft);
    border: 1px solid var(--line);
    border-radius: 5px;
    color: var(--muted);
    font-weight: 500;
    letter-spacing: 0;
  }
  .chapter-fw-chip.active {
    background: var(--accent);
    border-color: var(--accent);
    color: var(--white);
    font-weight: 600;
  }

  /* 우측 시각화 카드 */
  .chapter-visual {
    width: 100%;
  }

  /* ====== 카드 셸 ====== */
  /* chapter1·2·3 의 외곽 카드 세로 길이를 820px 로 고정. min-height 가 아니라
     height 인 이유: 데모 애니메이션 중 내부 콘텐츠가 살짝이라도 변동하면 (예:
     chapter3 의 pol-empty → pol-grid 전환, chapter1 의 lens-bar 행 wrap,
     chapter2 의 universe → vchain-layers 전환) min-height 가 흡수 못한 픽셀이
     카드를 자라나게 함. fixed height 로 모든 챕터·모든 단계에서 동일한 카드
     크기를 보장. 내부 flex column 이 .universe / .pol-stage 로 남는 공간을
     흡수하고, 넘치는 부분은 overflow: hidden 으로 clip. */
  .lens-card {
    background: var(--white);
    border: 1px solid var(--line);
    border-radius: 14px;
    overflow: hidden;
    box-shadow:
      0 1px 2px rgba(var(--ink-rgb), 0.04),
      0 8px 24px rgba(var(--ink-rgb), 0.04);
    height: 820px;
    display: flex;
    flex-direction: column;
    /* lens-card-progress 를 절대 좌표로 카드 위쪽 가장자리에 띄우려면 position
       relative 필요. lens-card 는 이미 lenses 의 다른 절대 positioning 에 영향
       없도록 단독으로 stacking context 형성. */
    position: relative;
  }
  /* === Demo 진행 progress bar — hero 의 .demo-progress 와 비슷한 톤. ===
     카드 최상단에 mint accent 채워지는 막대. 데모 시작 시 0→100% 로 width
     transition. 사용자가 중지 누르면 JS 가 현재 width 를 캡쳐해 freeze.
     클릭 가능 — 클릭 위치로 demo seek (chapter*.js seekTo()). */
  .lens-card-progress {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 4px;
    background: var(--line);
    /* z-index 2001: chapter1/3 의 overlay (z-99) 와 chapter2 의 overlay
       (z-1900), header (z-2000) 모두 위로 올라가서 popup 이 열린 상태에서도
       클릭이 seek 핸들러에 직접 도달. progress bar 는 lens-card 최상단 4px
       영역만 차지해서 popout 본체와 시각적 충돌 없음. */
    z-index: 2001;
    cursor: pointer;
    transition: background 0.18s ease, height 0.18s ease;
  }
  .lens-card-progress:hover {
    background: var(--line-soft);
    height: 6px;
  }
  .lens-card-progress-fill {
    height: 100%;
    width: 0%;
    background: linear-gradient(90deg, var(--accent) 0%, var(--accent) 100%);
    opacity: 0.95;
    pointer-events: none;
  }
  .lens-card + .lens-card {
    margin-top: 14px;
  }

  /* === Demo control: 3-state replay/pause/play 버튼 === */
  /* button 안에 .rb-pause / .rb-play / .rb-replay 세 span 이 있고, button 의
     data-state 에 따라 하나만 inline-flex 로 표시. 다른 두 개는 display: none. */
  .demo-replay-btn .rb-state { display: none; align-items: center; gap: 6px; }
  .demo-replay-btn[data-state="running"] .rb-pause,
  .demo-replay-btn[data-state="paused"] .rb-play,
  .demo-replay-btn[data-state="completed"] .rb-replay {
    display: inline-flex;
  }
  .demo-replay-btn .rb-icon { font-size: 11px; line-height: 1; }
  .demo-replay-btn .rb-label { display: inline-flex; align-items: center; }

  /* Mobile: 36px 원형 버튼에선 label 텍스트가 둥근 영역 밖으로 못생기게
     비져나오므로 icon (⏸ / ▶ / ↻) 만 노출. connectionary.css 에도 동일
     의도의 룰이 있지만 lenses.css 가 import 순서상 나중이라 같은 specificity
     의 기본 inline-flex 룰이 이겨버려서, 여기서 다시 한 번 hide. */
  @media (max-width: 640px) {
    .demo-replay-btn .rb-label { display: none; }
    .demo-replay-btn .rb-icon { font-size: 14px; }
  }

  /* === Demo running 중 상호작용 차단 === */
  /* 데모가 실행 중일 때 사용자가 chip / company 카드 등을 클릭해도 무반응이
     되도록 — 일부는 동작하고 일부는 안 되는 혼선 방지. replay 버튼과 popout
     내부 close 만 클릭 가능. */
  .chapter1-demo.demo-running .lens-chip,
  .chapter1-demo.demo-running .add-chip,
  .chapter1-demo.demo-running .company,
  .chapter2-demo.demo-running .vchain-filter-chip,
  .chapter2-demo.demo-running .build-cta-btn,
  .chapter2-demo.demo-running .build-cta-reset,
  .chapter2-demo.demo-running .layer-card,
  .chapter2-demo.demo-running .layer-chip,
  .chapter2-demo.demo-running .company,
  .chapter3-demo.demo-running .pol-builder-chip,
  .chapter3-demo.demo-running .pol-program {
    pointer-events: none;
  }
  .lens-card-header {
    padding: 14px 20px;
    border-bottom: 1px solid var(--line);
    background: var(--bg-tech);
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    /* z-index 2000: chapter2 의 overlay 가 z-1900 까지 올라가므로 그 위에
       헤더 / replay 버튼이 항상 sharp 하게 표시되도록 위치. (chapter1/3 의
       overlay 는 z-99 이라 사실상 다 동일. backdrop-filter 는 element 의
       paint order 상 "뒤" 만 흐리므로 위에 있는 헤더는 영향 없음.) */
    position: relative;
    z-index: 2000;
  }
  .lens-card-title-wrap {
    display: flex;
    flex-direction: column;
    gap: 3px;
  }
  .lens-card-eyebrow {
    font-size: 11px;
    letter-spacing: 0;
    color: var(--mute-2);
    font-weight: 600;
  }
  .lens-card-title {
    font-size: 15px;
    font-weight: 700;
    color: var(--fg);
    letter-spacing: -0.015em;
    display: flex;
    align-items: center;
    gap: 8px;
  }
  .lens-card-title::before {
    content: '';
    width: 6px; height: 6px;
    background: var(--accent);
    border-radius: 50%;
    box-shadow: 0 0 8px var(--accent);
  }
  .lens-card-fw {
    display: flex;
    gap: 4px;
    flex-wrap: wrap;
    justify-content: flex-end;
  }
  .lens-card-fw-tag {
    padding: 3px 8px;
    background: var(--accent-soft);
    color: var(--accent);
    border-radius: 4px;
    font-weight: 600;
    letter-spacing: 0;
    font-size: 9.5px;
  }
  .lens-card-fw-tag.active {
    background: var(--accent);
    color: var(--white);
    box-shadow: 0 0 0 3px var(--accent-soft);
  }
  .lens-card-fw-tag.pending {
    background: var(--bg-soft);
    color: var(--mute-2);
    opacity: 0.6;
  }
  .lens-card-fw-tag.done {
    background: var(--bg-soft);
    color: var(--muted);
    text-decoration: line-through;
    opacity: 0.7;
  }
  .lens-card-body {
    padding: 18px 20px;
    /* 카드 안에서 body 가 남는 세로 공간을 모두 차지하도록 flex column */
    flex: 1 1 auto;
    display: flex;
    flex-direction: column;
    min-height: 0;
  }
  .chain-step {
    color: var(--accent);
    font-weight: 700;
    margin-left: 4px;
  }

  /* ====== 챕터 1: 종합 브리핑 카드 ====== */
  .bf-section {
    padding: 14px 20px;
    border-bottom: 1px solid var(--line-soft);
  }
  .bf-section:last-child { border-bottom: none; }
  .bf-sec-label {
    font-size: 10px;
    color: var(--mute-2);
    letter-spacing: 0;
    font-weight: 600;
    margin-bottom: 8px;
    display: flex;
    align-items: center;
    gap: 8px;
  }
  .bf-sec-label::before {
    content: '';
    width: 3px;
    height: 10px;
    background: var(--mute-2);
    border-radius: 1px;
  }
  .bf-overview-text {
    font-size: 13.5px;
    color: var(--fg);
    line-height: 1.55;
  }
  .bf-overview-text .num {
    color: var(--c-figure);
    font-weight: 600;
  }
  .bf-trends {
    display: flex;
    flex-direction: column;
    gap: 7px;
  }
  .bf-trend-item {
    display: flex;
    align-items: baseline;
    gap: 10px;
    font-size: 13px;
    color: var(--fg);
  }
  .bf-trend-arrow {
    color: var(--accent);
    font-weight: 600;
    flex-shrink: 0;
    width: 12px;
  }
  .bf-trend-item .num {
    color: var(--c-figure);
    font-weight: 600;
  }
  .bf-theme-text {
    font-size: 16px;
    font-weight: 600;
    color: var(--fg);
    letter-spacing: -0.015em;
    line-height: 1.4;
    margin-bottom: 6px;
  }
  .bf-theme-text::before, .bf-theme-text::after {
    color: var(--mute-2);
    font-size: 20px;
    vertical-align: -3px;
    opacity: 0.6;
    font-family: 'Georgia', serif;
  }
  .bf-theme-text::before { content: '"'; margin-right: 1px; }
  .bf-theme-text::after { content: '"'; margin-left: 1px; }
  .bf-theme-explain {
    font-size: 12.5px;
    color: var(--muted);
    line-height: 1.55;
  }
  .bf-implication {
    font-size: 13px;
    color: var(--fg-soft);
    line-height: 1.6;
  }
  .bf-implication strong { color: var(--fg); font-weight: 600; }
  .bf-implication .lens-hint {
    color: var(--accent);
    font-weight: 600;
  }

  /* ====== Ch1 v2.0 — 실제 데이터 + 강조·블러 ====== */

  /* 메타 행 (키워드·기간·출처) */
  .bf-meta-row {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
    padding: 12px 20px;
    border-bottom: 1px solid var(--line);
    background: var(--bg-tech);
  }
  .bf-meta-keyword {
    font-size: 10px;
    color: var(--accent);
    letter-spacing: 0;
    font-weight: 700;
  }
  .bf-meta-tag {
    font-size: 10px;
    color: var(--muted);
    background: var(--white);
    border: 1px solid var(--line);
    padding: 2px 7px;
    border-radius: 3px;
    font-weight: 600;
  }

  /* 헤드라인 (최강 강조) */
  .bf-headline {
    padding: 22px 20px 18px;
    border-bottom: 1px solid var(--line);
  }
  .bf-headline-label {
    font-size: 10px;
    color: var(--accent);
    letter-spacing: 0;
    font-weight: 700;
    margin-bottom: 8px;
  }
  .bf-headline-text {
    font-size: 19px;
    font-weight: 700;
    color: var(--fg);
    letter-spacing: -0.025em;
    line-height: 1.35;
  }

  /* 개요 (AI 종합) - 첫 단락 또렷, 둘째 단락 페이드 */
  .bf-overview-block {
    padding: 14px 20px;
    border-bottom: 1px solid var(--line-soft);
  }
  .bf-overview-para {
    font-size: 12.5px;
    color: var(--fg-soft);
    line-height: 1.65;
    margin-bottom: 10px;
  }
  .bf-overview-para:last-child { margin-bottom: 0; }
  .bf-overview-para strong { color: var(--fg); font-weight: 700; }
  .bf-overview-cites {
    font-size: 9.5px;
    color: var(--mute-2);
    letter-spacing: 0;
    margin-top: 4px;
    line-height: 1.5;
  }

  /* 동향 8건 — 강조 카드들 */
  .bf-trends-v2 {
    display: flex;
    flex-direction: column;
    gap: 8px;
  }
  /* ====== Chapter 1 — 필터 / 셀렉터 패널 ====== */
  .bf-filters {
    margin-bottom: 18px;
    padding: 14px 16px;
    background: var(--white);
    border: 1px solid var(--line);
    border-radius: 6px;
    display: flex;
    flex-direction: column;
    gap: 10px;
  }
  .bf-filter-row {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
  }
  .bf-filter-label {
    font-size: 10px;
    letter-spacing: 0;
    font-weight: 700;
    color: var(--fg-soft);
    min-width: 88px;
    flex-shrink: 0;
  }
  .bf-filter-chips {
    display: flex;
    gap: 6px;
    flex-wrap: wrap;
    flex: 1;
  }
  .bf-filter-chip {
    font-size: 10.5px;
    font-weight: 600;
    letter-spacing: 0;
    padding: 5px 10px;
    border-radius: 4px;
    background: var(--bg-soft);
    border: 1px solid var(--line);
    color: var(--fg-soft);
    cursor: pointer;
    transition: all 0.15s;
  }
  .bf-filter-chip:hover { color: var(--fg); border-color: var(--fg-soft); }
  .bf-filter-chip.active {
    background: var(--accent);
    color: var(--white);
    border-color: var(--accent);
  }
  .bf-filter-chip.muted {
    opacity: 0.55;
  }

  /* 인라인 타임 슬라이더 */
  .bf-time-inline {
    flex: 1;
    position: relative;
    height: 26px;
    display: flex;
    align-items: center;
    min-width: 200px;
  }
  .bf-time-inline-line {
    position: absolute;
    left: 0;
    right: 0;
    top: 50%;
    height: 2px;
    background: var(--line);
    transform: translateY(-50%);
    border-radius: 2px;
  }
  .bf-time-inline-fill {
    position: absolute;
    left: 78%;
    right: 0;
    top: 50%;
    height: 2px;
    background: var(--accent);
    transform: translateY(-50%);
    border-radius: 2px;
  }
  .bf-time-inline-tick {
    position: absolute;
    top: 50%;
    width: 1px;
    height: 6px;
    background: var(--line);
    transform: translate(-50%, -50%);
  }
  .bf-time-inline-tick-label {
    position: absolute;
    top: calc(50% + 7px);
    transform: translateX(-50%);
    font-size: 8.5px;
    color: var(--fg-soft);
    opacity: 0.55;
    letter-spacing: 0;
    white-space: nowrap;
  }
  .bf-time-inline-handle-l,
  .bf-time-inline-handle-r {
    position: absolute;
    top: 50%;
    width: 12px;
    height: 12px;
    border-radius: 50%;
    background: var(--white);
    border: 2px solid var(--accent);
    transform: translate(-50%, -50%);
    cursor: ew-resize;
    z-index: 2;
    box-shadow: 0 1px 3px rgba(var(--ink-rgb), 0.12);
  }
  .bf-time-inline-handle-l { left: 78%; }
  .bf-time-inline-handle-r { left: 100%; }
  .bf-filter-range {
    font-size: 10.5px;
    color: var(--accent);
    font-weight: 700;
    letter-spacing: 0;
    white-space: nowrap;
    flex-shrink: 0;
    min-width: 130px;
    text-align: right;
  }
  .bf-filter-result {
    font-size: 10px;
    color: var(--fg-soft);
    opacity: 0.7;
    letter-spacing: 0;
    white-space: nowrap;
    flex-shrink: 0;
  }
  .bf-filter-result strong { color: var(--accent); font-weight: 700; opacity: 1; }

  /* ====== Chapter 1: NVIDIA 전략 — 그래피컬 카드 ====== */
  .nv-card {
    background: var(--white);
    border: 1px solid var(--line);
    border-radius: 6px;
    padding: 14px 18px 14px;
    margin-bottom: 8px;
  }
  .nv-card-head {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 14px;
    padding-bottom: 10px;
    border-bottom: 1px solid var(--line-soft);
  }
  .nv-card-head-left {
    display: flex;
    align-items: baseline;
    gap: 10px;
    flex-wrap: wrap;
  }
  .nv-card-tag {
    font-size: 10px;
    letter-spacing: 0;
    font-weight: 700;
    color: var(--fg-soft);
  }
  .nv-card-title {
    font-size: 14.5px;
    font-weight: 700;
    color: var(--fg);
    letter-spacing: -0.015em;
  }
  .nv-card-stat {
    font-size: 11px;
    color: var(--accent);
    font-weight: 700;
    letter-spacing: 0;
    white-space: nowrap;
  }
  .nv-card-evidence {
    font-size: 10px;
    color: var(--fg-soft);
    font-weight: 600;
    letter-spacing: 0;
    text-decoration: none;
    white-space: nowrap;
    border-bottom: 1px solid var(--line);
    padding-bottom: 1px;
  }
  .nv-card-evidence:hover { color: var(--accent); border-color: var(--accent); }

  /* 1. 투자 - 4 chip grid */
  .nv-invest-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 8px;
  }
  .nv-invest-chip {
    border: 1px solid var(--line);
    border-radius: 5px;
    padding: 10px 11px 11px;
    background: var(--bg-soft);
    display: flex;
    flex-direction: column;
    gap: 2px;
    min-width: 0;
  }
  .nv-chip-target {
    font-size: 12.5px;
    font-weight: 700;
    color: var(--fg);
    letter-spacing: -0.005em;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  .nv-chip-amount {
    font-size: 11px;
    color: var(--accent);
    font-weight: 700;
    letter-spacing: 0;
  }
  .nv-chip-amount.muted {
    color: var(--fg-soft);
    opacity: 0.65;
  }
  .nv-chip-meta {
    font-size: 9.5px;
    color: var(--fg-soft);
    opacity: 0.7;
    letter-spacing: 0;
    margin-top: 2px;
  }

  /* 행 스타일 시그널 표 */
  .nv-row {
    display: grid;
    grid-template-columns: 220px 1fr auto;
    gap: 18px;
    padding: 16px 4px 16px 0;
    border-bottom: 1px solid var(--line-soft);
    align-items: flex-start;
  }
  .nv-row:last-of-type { border-bottom: none; }
  .nv-row-cat {
    display: flex;
    flex-direction: column;
    gap: 4px;
  }
  .nv-row-tag {
    font-size: 13px;
    letter-spacing: 0;
    font-weight: 700;
    color: var(--fg-soft);
  }
  .nv-row-tag .num {
    color: var(--accent);
    font-weight: 700;
    margin-right: 8px;
    font-size: 12px;
  }
  .nv-row-title {
    font-size: 14px;
    font-weight: 700;
    color: var(--fg);
    letter-spacing: -0.015em;
    line-height: 1.3;
  }
  .nv-row-items {
    display: flex;
    flex-direction: column;
    gap: 8px;
    padding-top: 2px;
  }
  .nv-row-item {
    display: flex;
    align-items: baseline;
    gap: 10px;
    font-size: 13px;
    line-height: 1.4;
  }
  .nv-row-item-name {
    color: var(--fg);
    font-weight: 700;
    letter-spacing: -0.005em;
  }
  .nv-row-item-sub {
    color: var(--fg-soft);
    opacity: 0.75;
    font-size: 12px;
  }
  .nv-row-evidence {
    font-size: 10px;
    color: var(--fg-soft);
    letter-spacing: 0;
    text-decoration: none;
    white-space: nowrap;
    padding-top: 4px;
    transition: color 0.15s;
  }
  .nv-row-evidence:hover { color: var(--accent); }

  @media (max-width: 700px) {
    .nv-row { grid-template-columns: 1fr; gap: 8px; }
    .nv-row-evidence { padding-top: 0; }
  }

  /* "더보기" 힌트 */
  .nv-more {
    border: 1px dashed var(--line);
    border-radius: 6px;
    padding: 12px 18px;
    margin-bottom: 4px;
    background: var(--bg-soft);
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    cursor: pointer;
    transition: background 0.15s, border-color 0.15s;
  }
  .nv-more:hover {
    background: var(--white);
    border-color: var(--accent);
  }
  .nv-more-left {
    display: flex;
    align-items: center;
    gap: 10px;
  }
  .nv-more-icon {
    font-size: 12px;
    font-weight: 700;
    color: var(--accent);
    letter-spacing: 0;
  }
  .nv-more-text {
    font-size: 12px;
    color: var(--fg-soft);
    line-height: 1.4;
  }
  .nv-more-text strong { color: var(--fg); font-weight: 700; }
  .nv-more-arrow {
    font-size: 11px;
    color: var(--fg-soft);
    opacity: 0.7;
    letter-spacing: 0;
  }

  /* 2. 거래선 - sell / buy split */
  .nv-deals-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 10px;
  }
  .nv-deal-col {
    border: 1px solid var(--line);
    border-radius: 5px;
    padding: 11px 13px 12px;
    background: var(--bg-soft);
  }
  .nv-deal-dir {
    font-size: 9.5px;
    letter-spacing: 0;
    font-weight: 700;
    color: var(--fg-soft);
    margin-bottom: 4px;
    display: flex;
    align-items: center;
    gap: 6px;
  }
  .nv-deal-dir .arrow {
    font-family: var(--mono);
    color: var(--accent);
    font-size: 11px;
  }
  .nv-deal-name {
    font-size: 12.5px;
    font-weight: 700;
    color: var(--fg);
    letter-spacing: -0.005em;
    margin-bottom: 2px;
    line-height: 1.3;
  }
  .nv-deal-detail {
    font-size: 10px;
    color: var(--fg-soft);
    opacity: 0.7;
    letter-spacing: 0;
    line-height: 1.4;
  }

  /* 3. 경쟁 - left: rivals, right: china share bar */
  .nv-compete-grid {
    display: grid;
    grid-template-columns: 1.4fr 1fr;
    gap: 10px;
  }
  .nv-compete-col {
    border: 1px solid var(--line);
    border-radius: 5px;
    padding: 11px 13px 12px;
    background: var(--bg-soft);
  }
  .nv-compete-sublabel {
    font-size: 9.5px;
    letter-spacing: 0;
    font-weight: 700;
    color: var(--fg-soft);
    margin-bottom: 8px;
  }
  .nv-rivals-row {
    display: flex;
    gap: 6px;
    flex-wrap: wrap;
  }
  .nv-rival-chip {
    background: var(--white);
    border: 1px solid var(--line);
    border-radius: 4px;
    padding: 5px 9px;
    font-size: 11.5px;
    font-weight: 700;
    color: var(--fg);
    letter-spacing: -0.005em;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 1px;
    min-width: 0;
  }
  .nv-rival-chip-sub {
    font-size: 9px;
    color: var(--fg-soft);
    opacity: 0.7;
    font-weight: 500;
    letter-spacing: 0;
  }
  /* China share bar */
  .nv-share-bar-wrap {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-top: 2px;
  }
  .nv-share-bar {
    flex: 1;
    height: 8px;
    background: var(--line);
    border-radius: 2px;
    position: relative;
    overflow: hidden;
  }
  .nv-share-bar-from {
    position: absolute;
    left: 0;
    top: 0;
    height: 100%;
    background: rgba(var(--ink-rgb), 0.18);
    width: 95%;
    border-radius: 2px;
  }
  .nv-share-bar-to {
    position: absolute;
    left: 0;
    top: 0;
    height: 100%;
    background: var(--accent);
    width: 60%;
    border-radius: 2px;
  }
  .nv-share-nums {
    font-size: 11px;
    font-weight: 700;
    color: var(--fg);
    letter-spacing: 0;
    white-space: nowrap;
  }
  .nv-share-nums .from {
    color: var(--fg-soft);
    opacity: 0.55;
    text-decoration: line-through;
  }
  .nv-share-nums .arrow {
    margin: 0 4px;
    color: var(--fg-soft);
    opacity: 0.7;
  }
  .nv-share-nums .to {
    color: var(--accent);
  }

  /* 4. 모델 - single row */
  .nv-model-row {
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 10px 13px;
    border: 1px solid var(--line);
    border-radius: 5px;
    background: var(--bg-soft);
  }
  .nv-model-name {
    font-size: 13px;
    font-weight: 700;
    color: var(--fg);
    letter-spacing: -0.005em;
  }
  .nv-model-desc {
    font-size: 10.5px;
    color: var(--fg-soft);
    opacity: 0.75;
    letter-spacing: 0;
    flex: 1;
  }

  @media (max-width: 760px) {
    .nv-invest-grid { grid-template-columns: repeat(2, 1fr); }
    .nv-deals-grid, .nv-compete-grid { grid-template-columns: 1fr; }
    .nv-model-row { flex-wrap: wrap; }
  }

  .bf-trend-card {
    display: grid;
    grid-template-columns: auto 1fr;
    gap: 12px;
    align-items: start;
    padding: 12px 14px;
    background: var(--white);
    border: 1px solid var(--line);
    border-radius: 7px;
  }
  .bf-trend-card.highlight {
    border-color: var(--accent-soft);
    background: linear-gradient(135deg, var(--accent-softer) 0%, var(--white) 60%);
    box-shadow: 0 4px 14px rgba(var(--mint-rgb), 0.06);
  }
  .bf-trend-tag {
    font-size: 9.5px;
    color: var(--muted);
    background: var(--bg-tech);
    padding: 3px 8px;
    border-radius: 3px;
    letter-spacing: 0;
    font-weight: 700;
    flex-shrink: 0;
  }
  .bf-trend-card.highlight .bf-trend-tag {
    background: var(--accent);
    color: var(--white);
  }
  .bf-trend-body {
    font-size: 12.5px;
    color: var(--fg);
    line-height: 1.55;
    font-weight: 500;
  }
  .bf-trend-card.highlight .bf-trend-body { font-weight: 500; }
  .bf-trend-body strong { color: var(--fg); font-weight: 700; }
  .bf-trend-cites {
    font-size: 9px;
    color: var(--mute-2);
    letter-spacing: 0;
    text-align: right;
    flex-shrink: 0;
    padding-top: 3px;
    line-height: 1.4;
    max-width: 80px;
  }

  /* 블러된 동향 카드 */
  .bf-trend-card.blurred {
    filter: blur(2.5px);
    opacity: 0.55;
    pointer-events: none;
    user-select: none;
  }

  /* 테마 5개 */
  .bf-themes-v2 {
    display: flex;
    flex-direction: column;
    gap: 10px;
  }
  .bf-theme-card {
    padding: 14px 16px;
    border: 1px solid var(--line);
    border-radius: 8px;
    background: var(--white);
  }
  .bf-theme-card.highlight {
    border: 1.5px solid var(--accent);
    background: linear-gradient(135deg, var(--accent-softer) 0%, var(--white) 50%);
    box-shadow: 0 6px 20px rgba(var(--mint-rgb), 0.08);
    padding: 18px 20px;
  }
  .bf-theme-head {
    display: flex;
    align-items: baseline;
    gap: 10px;
    margin-bottom: 8px;
  }
  .bf-theme-num {
    font-family: var(--mono);
    font-size: 10px;
    color: var(--mute-2);
    font-weight: 700;
    letter-spacing: 0.04em;
  }
  .bf-theme-card.highlight .bf-theme-num {
    color: var(--accent);
  }
  .bf-theme-title {
    font-size: 14px;
    font-weight: 700;
    color: var(--fg);
    letter-spacing: -0.015em;
  }
  .bf-theme-card.highlight .bf-theme-title {
    font-size: 17px;
  }
  .bf-theme-count {
    font-family: var(--mono);
    font-size: 10px;
    color: var(--muted);
    background: var(--bg-tech);
    padding: 2px 7px;
    border-radius: 3px;
    margin-left: auto;
    font-weight: 600;
  }
  .bf-theme-body {
    font-size: 12px;
    color: var(--fg-soft);
    line-height: 1.6;
  }
  .bf-theme-card.highlight .bf-theme-body {
    font-size: 13px;
  }
  .bf-theme-body strong { color: var(--fg); font-weight: 700; }
  .bf-theme-cites {
    font-size: 9px;
    color: var(--mute-2);
    margin-top: 6px;
    letter-spacing: 0;
    line-height: 1.5;
  }

  /* 블러된 테마 카드 */
  .bf-theme-card.blurred {
    filter: blur(2.5px);
    opacity: 0.45;
    pointer-events: none;
    user-select: none;
  }
  .bf-theme-card.blurred-strong {
    filter: blur(3.5px);
    opacity: 0.35;
    pointer-events: none;
    user-select: none;
  }

  /* 시사점 시그널 */
  .bf-signals {
    display: flex;
    flex-direction: column;
    gap: 8px;
  }
  .bf-signal-card {
    display: grid;
    grid-template-columns: auto 1fr;
    gap: 12px;
    align-items: start;
    padding: 12px 14px;
    background: var(--white);
    border: 1px solid var(--line);
    border-radius: 7px;
  }
  .bf-signal-card.highlight {
    border-color: var(--accent-soft);
    background: linear-gradient(135deg, var(--accent-softer) 0%, var(--white) 60%);
  }
  .bf-signal-label {
    font-size: 9.5px;
    font-weight: 800;
    letter-spacing: 0;
    padding: 4px 9px;
    border-radius: 3px;
    flex-shrink: 0;
    color: var(--white);
  }
  .bf-signal-label.risk { background: var(--sig-negative); }
  .bf-signal-label.watch { background: var(--c-figure); }
  .bf-signal-label.signal { background: var(--accent); }
  .bf-signal-label.opportunity { background: var(--sig-positive); }
  .bf-signal-body {
    font-size: 12.5px;
    color: var(--fg);
    line-height: 1.55;
  }
  .bf-signal-body strong { font-weight: 700; }
  .bf-signal-card.blurred {
    filter: blur(2.5px);
    opacity: 0.5;
    pointer-events: none;
    user-select: none;
  }

  /* 섹션 끝 "+ N건 더" 카운터 */
  .bf-more-counter {
    font-family: var(--mono);
    font-size: 10px;
    color: var(--mute-2);
    text-align: center;
    padding: 8px 0 4px;
    letter-spacing: 0.06em;
    font-weight: 600;
  }

  /* Ch1 → Ch2 bridge */
  .bf-to-ch2-bridge {
    margin-top: 12px;
    padding: 14px 18px;
    background: linear-gradient(180deg, var(--accent-softer) 0%, transparent 100%);
    border-top: 1px dashed var(--accent-soft);
    text-align: center;
    position: relative;
  }
  .bf-to-ch2-bridge-text {
    font-size: 12.5px;
    color: var(--fg);
    line-height: 1.5;
  }
  .bf-to-ch2-bridge-text strong {
    color: var(--accent);
    font-weight: 700;
  }
  .bf-to-ch2-bridge::after {
    content: '';
    position: absolute;
    left: 50%;
    bottom: -36px;
    transform: translateX(-50%);
    width: 2px;
    height: 36px;
    background-image: linear-gradient(180deg, var(--accent) 50%, transparent 50%);
    background-size: 2px 8px;
    background-repeat: repeat-y;
    opacity: 0.6;
  }

  /* Ch2 head 위 TRACED THEME 라벨 */
  .ch2-traced-from {
    margin-bottom: 14px;
    padding: 10px 14px;
    background: var(--accent-softer);
    border: 1px solid var(--accent-soft);
    border-radius: 6px;
    display: flex;
    align-items: center;
    gap: 10px;
  }
  .ch2-traced-from-label {
    font-size: 10px;
    color: var(--accent);
    letter-spacing: 0;
    font-weight: 700;
    flex-shrink: 0;
  }
  .ch2-traced-from-text {
    font-size: 12px;
    color: var(--fg);
    font-weight: 500;
  }
  .ch2-traced-from-text strong {
    color: var(--accent);
    font-weight: 700;
  }

  /* ====== 공통 — 원문 보기 버튼 (모든 evidence 패널) ====== */
  .evidence-source-btn {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 7px 14px;
    background: var(--white);
    border: 1px solid var(--line);
    border-radius: 5px;
    font-size: 11px;
    color: var(--fg-soft);
    font-weight: 600;
    letter-spacing: 0;
    cursor: pointer;
    transition: all 0.15s ease;
    text-decoration: none;
    white-space: nowrap;
  }
  .evidence-source-btn:hover {
    border-color: var(--accent);
    background: var(--accent-softer);
    color: var(--accent);
    box-shadow: 0 2px 8px rgba(var(--mint-rgb), 0.12);
  }
  .evidence-source-btn-icon {
    color: var(--mute-2);
    font-size: 12px;
    line-height: 1;
    transition: color 0.15s ease;
  }
  .evidence-source-btn:hover .evidence-source-btn-icon {
    color: var(--accent);
  }
  .evidence-source-btn-arrow {
    color: var(--mute-2);
    font-size: 10px;
    transition: transform 0.15s ease, color 0.15s ease;
  }
  .evidence-source-btn:hover .evidence-source-btn-arrow {
    transform: translate(1px, -1px);
    color: var(--accent);
  }

  /* 원문 보기 row (버튼이 들어갈 행) */
  .evidence-source-btn-row {
    padding: 10px 14px 14px;
    display: flex;
    justify-content: flex-end;
    align-items: center;
    gap: 10px;
    border-top: 1px dashed var(--line-soft);
    margin-top: 4px;
  }
  .evidence-source-btn-row-hint {
    font-size: 9.5px;
    color: var(--mute-2);
    letter-spacing: 0;
    margin-right: auto;
  }

  /* ====== Ch1 근거 버튼 (raw ID → wrapping) ====== */
  .bf-evidence-btn {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 4px 10px 4px 8px;
    background: var(--white);
    border: 1px solid var(--line);
    border-radius: 4px;
    font-size: 10.5px;
    color: var(--fg-soft);
    font-weight: 600;
    letter-spacing: 0;
    cursor: pointer;
    transition: all 0.15s ease;
    text-decoration: none;
    white-space: nowrap;
  }
  .bf-evidence-btn:hover {
    border-color: var(--accent);
    background: var(--accent-softer);
    color: var(--accent);
  }
  .bf-evidence-btn-dash {
    color: var(--mute-2);
    font-weight: 400;
  }
  .bf-evidence-btn-arrow {
    color: var(--mute-2);
    font-size: 10px;
    transition: transform 0.15s ease;
  }
  .bf-evidence-btn:hover .bf-evidence-btn-arrow {
    transform: translate(1px, -1px);
    color: var(--accent);
  }

  /* 강조 카드 안 evidence 버튼 위치 */
  .bf-trend-evidence-row {
    margin-top: 8px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
  }
  .bf-trend-evidence-row:has(> .bf-evidence-btn:only-child),
  .bf-trend-evidence-row.right-only {
    justify-content: flex-end;
  }
  .bf-overview-evidence-row {
    margin-top: 8px;
    display: flex;
    justify-content: flex-end;
  }
  .bf-theme-evidence-row {
    margin-top: 10px;
    display: flex;
    justify-content: flex-end;
  }

  /* "+ N건 더 [...]" 통합 한 줄 (블러 대체) */
  .bf-more-line {
    margin-top: 4px;
    padding: 10px 14px;
    text-align: center;
    font-size: 11px;
    color: var(--mute-2);
    letter-spacing: 0;
    font-weight: 600;
    border: 1px dashed var(--line);
    border-radius: 6px;
    background: var(--bg-tech);
    opacity: 0.7;
  }
  .bf-more-ellipsis {
    color: var(--mute-2);
    letter-spacing: 0;
    margin-left: 4px;
  }

  /* 블러 카드 [...] 축약 */
  .bf-trend-card.blurred-compact {
    opacity: 0.6;
    filter: none;  /* blur 안 함, 본문은 [...] */
    pointer-events: auto;
  }
  .bf-trend-card.blurred-compact .bf-trend-body {
    color: var(--mute-2);
    font-style: italic;
  }
  .bf-trend-card.blurred-compact .bf-trend-tag {
    background: var(--bg-tech);
    color: var(--muted);
    opacity: 0.85;
  }
  .bf-trend-ellipsis {
    color: var(--mute-2);
    letter-spacing: 0;
    font-weight: 600;
  }
  .bf-trend-evidence-mini {
    font-size: 10.5px;
    color: var(--fg-soft);
    opacity: 0.7;
    letter-spacing: 0;
    text-align: left;
    flex-shrink: 1;
    min-width: 0;
    padding-top: 2px;
    line-height: 1.4;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  /* 블러 테마 카드도 [...] 축약 */
  .bf-theme-card.blurred-compact {
    opacity: 0.6;
    filter: none;
    pointer-events: auto;
  }
  .bf-theme-card.blurred-compact .bf-theme-body {
    color: var(--mute-2);
    font-style: italic;
  }

  /* 블러 시사점도 [...] */
  .bf-signal-card.blurred-compact {
    opacity: 0.6;
    filter: none;
    pointer-events: auto;
  }
  .bf-signal-card.blurred-compact .bf-signal-body {
    color: var(--mute-2);
    font-style: italic;
  }
  .bf-signal-card.blurred-compact .bf-signal-label {
    opacity: 0.7;
  }



  /* ====== 챕터 2a: 풍부한 조직 요약 ====== */
  .org-rich {
    padding: 16px 20px;
    display: flex;
    flex-direction: column;
    gap: 14px;
  }

  /* 컨텍스트 페이드 */
  .org-context {
    opacity: 0.45;
    position: relative;
    transition: opacity 0.2s ease;
  }
  .org-context:hover {
    opacity: 0.85;
  }

  /* 이슈 개요 */
  .org-issue {
    display: flex;
    flex-direction: column;
    gap: 6px;
  }
  .org-block-label {
    font-size: 11px;
    color: var(--fg-soft);
    font-weight: 600;
    padding-left: 6px;
    border-left: 2px solid var(--c-relation);
    line-height: 1;
  }
  .org-issue-title {
    font-size: 13px;
    font-weight: 700;
    color: var(--fg);
    letter-spacing: -0.01em;
    line-height: 1.4;
  }
  .org-issue-body {
    font-size: 12px;
    color: var(--fg-soft);
    line-height: 1.5;
  }
  .org-cite {
    font-size: 10px;
    color: var(--mute-2);
    letter-spacing: 0;
  }

  /* 기업 칩 행 */
  .org-tab-row {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    padding: 10px 0;
    border-top: 1px solid var(--line-soft);
    border-bottom: 1px solid var(--line-soft);
  }
  .org-tab {
    padding: 5px 10px;
    background: var(--bg-soft);
    border: 1px solid var(--line);
    border-radius: 6px;
    font-size: 11.5px;
    color: var(--fg-soft);
    font-weight: 500;
    display: inline-flex;
    align-items: center;
    gap: 5px;
    cursor: pointer;
    transition: all 0.15s ease;
  }
  .org-tab:hover { border-color: var(--accent-soft); }
  .org-tab.active {
    background: var(--c-figure);
    border-color: var(--c-figure);
    color: var(--white);
    font-weight: 600;
  }
  .org-tab-flag {
    font-size: 9px;
    letter-spacing: 0;
    opacity: 0.85;
    font-weight: 700;
  }

  /* FOCUS 프레임 */
  .org-focus-frame {
    position: relative;
    padding: 16px;
    margin: 0 -2px;
    border: 1px solid var(--accent-soft);
    border-radius: 10px;
    background: linear-gradient(180deg, var(--white) 0%, var(--accent-softer) 100%);
    box-shadow:
      0 0 0 4px rgba(var(--mint-rgb), 0.05),
      0 4px 16px rgba(var(--ink-rgb), 0.04);
  }
  .org-focus-frame::before {
    content: 'FOCUS';
    position: absolute;
    top: -8px;
    left: 14px;
    font-size: 9px;
    letter-spacing: 0;
    color: var(--accent);
    font-weight: 700;
    background: var(--bg);
    padding: 1px 8px;
    border: 1px solid var(--accent-soft);
    border-radius: 3px;
  }

  .org-deep {
    display: flex;
    flex-direction: column;
    gap: 14px;
  }
  .org-deep-head {
    display: flex;
    align-items: center;
    gap: 10px;
  }
  .org-deep-mark {
    width: 8px; height: 8px;
    background: var(--c-figure);
    border-radius: 50%;
  }
  .org-deep-name {
    font-size: 17px;
    font-weight: 700;
    color: var(--fg);
    letter-spacing: -0.02em;
  }
  .org-deep-flag {
    font-size: 9.5px;
    background: var(--bg-soft);
    border: 1px solid var(--line);
    border-radius: 3px;
    padding: 1px 5px;
    color: var(--muted);
    font-weight: 700;
    letter-spacing: 0;
  }
  .org-deep-type {
    font-size: 10px;
    color: var(--mute-2);
    letter-spacing: 0;
  }

  /* 전략·행보 */
  .org-strategy {
    background: var(--bg-tech);
    border: 1px solid var(--line);
    border-radius: 8px;
    padding: 12px 14px;
    font-size: 12px;
    color: var(--fg);
    line-height: 1.55;
  }
  .org-strategy-cite {
    margin-top: 8px;
    font-size: 10px;
    color: var(--mute-2);
    line-height: 1.5;
    word-break: break-all;
  }

  /* 핵심 발언 */
  .org-quote-box {
    border: 1px solid var(--c-quote-bd);
    background: var(--c-quote-soft);
    border-left: 3px solid var(--c-quote);
    border-radius: 6px;
    padding: 12px 14px;
    display: flex;
    flex-direction: column;
    gap: 6px;
  }
  .org-quote-text {
    font-size: 12.5px;
    color: var(--fg);
    line-height: 1.55;
    font-style: italic;
    font-weight: 500;
  }
  .org-quote-meta {
    font-size: 11px;
    color: var(--c-quote);
    font-weight: 600;
    display: flex;
    align-items: center;
    gap: 6px;
  }
  .org-quote-meta .org-cite { color: var(--c-quote); opacity: 0.7; }

  /* 주요 수치 */
  .org-figs {
    display: flex;
    flex-direction: column;
    gap: 6px;
  }
  .org-fig-card {
    background: var(--c-figure-soft);
    border: 1px solid var(--c-figure-bd);
    border-radius: 6px;
    padding: 10px 14px;
    display: flex;
    flex-direction: column;
    gap: 0;
  }
  .org-fig-card > div:first-child {
    display: flex;
    align-items: baseline;
    gap: 12px;
    flex-wrap: wrap;
  }
  .org-fig-val {
    font-size: 16px;
    font-weight: 800;
    color: var(--c-figure);
    letter-spacing: -0.015em;
  }
  .org-fig-label {
    font-size: 11px;
    color: var(--fg-soft);
    font-weight: 500;
    flex: 1;
  }

  /* 경쟁 구도 */
  .org-rels {
    display: flex;
    flex-direction: column;
    gap: 6px;
  }
  .org-rel-item {
    display: grid;
    grid-template-columns: 70px 1fr;
    gap: 10px;
    padding: 10px 12px;
    background: var(--c-relation-soft);
    border: 1px solid var(--c-relation-bd);
    border-radius: 6px;
    align-items: start;
  }
  .org-rel-tag {
    font-size: 9.5px;
    background: var(--c-relation);
    color: var(--white);
    border-radius: 3px;
    padding: 2px 6px;
    font-weight: 700;
    letter-spacing: 0;
    text-align: center;
    width: fit-content;
  }
  .org-rel-content { display: flex; flex-direction: column; gap: 4px; }
  .org-rel-head {
    font-size: 11.5px;
    color: var(--fg);
    font-weight: 600;
  }
  .org-rel-body {
    font-size: 11px;
    color: var(--fg-soft);
    line-height: 1.45;
  }

  /* ====== Chapter 4: 이슈 의견 분포 (이란 / 자본 시장) ====== */
  .opn-card { padding: 0; }

  /* Build 셀렉터 (Ch4) */
  .opn-builder {
    display: flex;
    flex-direction: column;
    gap: 10px;
    margin-bottom: 18px;
    padding: 14px 16px;
    background: var(--white);
    border: 1px solid rgba(var(--ink-rgb), 0.06);
    border-radius: 8px;
    box-shadow: 0 1px 2px rgba(var(--ink-rgb), 0.03);
  }
  .opn-builder-row {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
  }
  .opn-builder-label {
    font-size: 10px;
    letter-spacing: 0;
    font-weight: 700;
    color: var(--fg-soft);
    flex-shrink: 0;
    min-width: 84px;
  }
  .opn-chip {
    font-size: 10.5px;
    font-weight: 600;
    padding: 5px 10px;
    border-radius: 4px;
    background: var(--bg-soft);
    border: 1px solid var(--line);
    color: var(--fg-soft);
    cursor: pointer;
    transition: all 0.15s;
    letter-spacing: 0;
  }
  .opn-chip:hover { color: var(--fg); border-color: var(--fg-soft); }
  .opn-chip.active {
    background: var(--accent);
    color: var(--white);
    border-color: var(--accent);
  }
  .opn-chip.ghost {
    border-style: dashed;
    opacity: 0.55;
  }
  .opn-chip.ghost::before {
    content: '+ ';
    opacity: 0.7;
  }
  .opn-builder-result {
    font-size: 10px;
    color: var(--fg-soft);
    opacity: 0.7;
    letter-spacing: 0;
    margin-left: auto;
  }
  .opn-builder-result strong { color: var(--accent); font-weight: 700; opacity: 1; }

  /* 상단 메트릭 박스 */
  .opn-top {
    display: grid;
    grid-template-columns: 1.6fr 1fr;
    gap: 14px;
    margin-bottom: 18px;
  }
  .opn-hero {
    background: var(--fg);
    color: var(--white);
    border-radius: 10px;
    padding: 20px 22px;
  }
  .opn-hero-eyebrow {
    font-size: 10px;
    letter-spacing: 0;
    font-weight: 700;
    color: var(--accent);
    margin-bottom: 8px;
  }
  .opn-hero-title {
    font-size: 22px;
    font-weight: 700;
    letter-spacing: -0.03em;
    line-height: 1.2;
    margin-bottom: 10px;
  }
  .opn-hero-desc {
    font-size: 12.5px;
    color: rgba(255, 255, 255, 0.7);
    line-height: 1.55;
  }
  .opn-hero-desc strong { color: var(--white); font-weight: 600; }

  .opn-summary {
    background: var(--white);
    border: 1px solid rgba(var(--ink-rgb), 0.06);
    border-radius: 10px;
    padding: 14px 16px;
    display: grid;
    grid-template-columns: auto 1fr;
    gap: 16px;
    align-items: center;
    margin-bottom: 18px;
    box-shadow: 0 1px 2px rgba(var(--ink-rgb), 0.03);
  }
  .opn-metrics {
    display: flex;
    gap: 8px;
  }
  .opn-metric {
    background: var(--bg-soft);
    border-radius: 6px;
    padding: 10px 14px;
    min-width: 70px;
  }
  .opn-metric-num {
    font-size: 22px;
    font-weight: 700;
    color: var(--fg);
    letter-spacing: -0.02em;
    line-height: 1;
  }
  .opn-metric-num.neg { color: var(--rose-deep); }
  .opn-metric-label {
    font-size: 9.5px;
    color: var(--fg-soft);
    letter-spacing: 0;
    font-weight: 600;
    margin-top: 6px;
  }
  .opn-readout {
    font-size: 12px;
    color: var(--fg);
    line-height: 1.6;
    padding: 10px 12px;
    background: var(--accent-soft);
    border-radius: 5px;
  }
  .opn-readout strong { color: var(--rose-deep); font-weight: 700; }

  /* 토픽 3개 카드 그리드 */
  .opn-topics {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 12px;
    margin-bottom: 18px;
  }
  .opn-topic {
    background: var(--white);
    border: 1px solid rgba(var(--ink-rgb), 0.06);
    border-radius: 10px;
    padding: 16px 16px 14px;
    box-shadow: 0 1px 2px rgba(var(--ink-rgb), 0.03);
  }
  .opn-topic-head {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 10px;
    margin-bottom: 12px;
  }
  .opn-topic-title {
    font-size: 13.5px;
    font-weight: 700;
    color: var(--fg);
    letter-spacing: -0.02em;
    line-height: 1.3;
  }
  .opn-badge {
    font-size: 9px;
    font-weight: 700;
    letter-spacing: 0;
    padding: 4px 8px;
    border-radius: 999px;
    white-space: nowrap;
    flex-shrink: 0;
  }
  .opn-badge.neg { background: rgba(var(--rose-rgb), 0.15); color: var(--rose-deep); }
  .opn-badge.mix { background: rgba(var(--gold-rgb), 0.18); color: var(--gold-deep); }
  .opn-badge.pos { background: rgba(var(--mint-rgb), 0.15); color: var(--accent); }

  .opn-counts {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 6px;
    margin-bottom: 10px;
  }
  .opn-count {
    background: var(--bg-soft);
    border-radius: 5px;
    padding: 7px 9px;
    text-align: left;
  }
  .opn-count-num {
    font-size: 16px;
    font-weight: 700;
    color: var(--fg);
    letter-spacing: -0.01em;
    line-height: 1;
  }
  .opn-count-num.pos { color: var(--accent); }
  .opn-count-num.neg { color: var(--rose-deep); }
  .opn-count-num.neu { color: var(--fg-soft); }
  .opn-count-label {
    font-size: 9px;
    color: var(--fg-soft);
    margin-top: 3px;
    letter-spacing: 0;
    font-weight: 600;
  }

  /* sentiment stacked bar */
  .opn-stack {
    height: 6px;
    display: flex;
    overflow: hidden;
    border-radius: 999px;
    background: var(--bg-soft);
    margin-bottom: 12px;
  }
  .opn-stack-pos { background: var(--accent); }
  .opn-stack-neu { background: #C5CCD5; }
  .opn-stack-neg { background: var(--rose); }

  .opn-topic-summary {
    font-size: 11.5px;
    color: var(--fg-soft);
    line-height: 1.55;
    padding-top: 10px;
    border-top: 1px solid var(--line-soft);
    margin-bottom: 10px;
    min-height: 50px;
  }
  .opn-names {
    display: flex;
    flex-wrap: wrap;
    gap: 4px;
  }
  .opn-name-chip {
    background: var(--bg-soft);
    border: 1px solid var(--line);
    border-radius: 999px;
    padding: 3px 8px;
    font-size: 10px;
    color: var(--fg-soft);
    font-weight: 600;
    letter-spacing: -0.005em;
  }

  /* 영향 해석 4박스 */
  .opn-impact {
    background: var(--white);
    border: 1px solid rgba(var(--ink-rgb), 0.06);
    border-radius: 10px;
    padding: 18px 18px 14px;
    box-shadow: 0 1px 2px rgba(var(--ink-rgb), 0.03);
    margin-bottom: 18px;
  }
  .opn-section-title {
    font-size: 14px;
    font-weight: 700;
    color: var(--fg);
    letter-spacing: -0.015em;
    margin-bottom: 4px;
    display: flex;
    align-items: baseline;
    gap: 8px;
  }
  .opn-section-eyebrow {
    font-size: 9.5px;
    color: var(--accent);
    letter-spacing: 0;
    font-weight: 700;
  }
  .opn-section-sub {
    font-size: 11px;
    color: var(--fg-soft);
    opacity: 0.75;
    margin-bottom: 14px;
    line-height: 1.45;
  }
  .opn-impact-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 10px;
  }
  .opn-impact-box {
    background: var(--bg-soft);
    border-radius: 7px;
    padding: 12px 12px;
  }
  .opn-impact-label {
    font-size: 9px;
    color: var(--accent);
    letter-spacing: 0;
    font-weight: 700;
    margin-bottom: 6px;
  }
  .opn-impact-title {
    font-size: 12.5px;
    font-weight: 700;
    color: var(--fg);
    letter-spacing: -0.015em;
    line-height: 1.3;
    margin-bottom: 5px;
  }
  .opn-impact-desc {
    font-size: 11px;
    color: var(--fg-soft);
    line-height: 1.5;
  }

  /* Narrative Divergence */
  .opn-divergence {
    background: var(--white);
    border: 1px solid rgba(var(--ink-rgb), 0.06);
    border-radius: 10px;
    padding: 18px 18px 14px;
    box-shadow: 0 1px 2px rgba(var(--ink-rgb), 0.03);
  }
  .opn-div-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 10px;
  }
  .opn-div-card {
    background: var(--bg-soft);
    border-radius: 7px;
    padding: 14px 14px 12px;
    cursor: pointer;
    transition: background 0.15s, box-shadow 0.15s;
  }
  .opn-div-card:hover {
    background: var(--white);
    box-shadow: 0 2px 8px rgba(var(--ink-rgb), 0.05);
  }
  .opn-div-title {
    font-size: 12.5px;
    font-weight: 700;
    color: var(--fg);
    letter-spacing: -0.015em;
    line-height: 1.35;
    margin-bottom: 6px;
  }
  .opn-div-desc {
    font-size: 11px;
    color: var(--fg-soft);
    line-height: 1.55;
    margin-bottom: 10px;
  }
  .opn-div-meta {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 8px;
    padding-top: 8px;
    border-top: 1px solid var(--line-soft);
    font-size: 9.5px;
    color: var(--fg-soft);
    font-weight: 700;
    letter-spacing: 0;
  }
  .opn-div-meta-badge {
    font-size: 9px;
    font-weight: 700;
    padding: 3px 7px;
    border-radius: 4px;
    letter-spacing: 0;
  }
  .opn-div-meta-badge.neg { background: rgba(var(--rose-rgb), 0.18); color: var(--rose-deep); }
  .opn-div-meta-badge.mix { background: rgba(var(--gold-rgb), 0.18); color: var(--gold-deep); }

  @media (max-width: 760px) {
    .opn-top { grid-template-columns: 1fr; }
    .opn-topics { grid-template-columns: 1fr; }
    .opn-impact-grid { grid-template-columns: 1fr 1fr; }
    .opn-div-grid { grid-template-columns: 1fr; }
  }

  /* ====== Chapter 5: 다국가 정책 비교 (우주 정책) ====== */
  .pol-card { padding: 0; }

  .pol-top-summary {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px;
    margin-bottom: 18px;
  }
  .pol-summary-box {
    background: var(--white);
    border: 1px solid rgba(var(--ink-rgb), 0.06);
    border-radius: 8px;
    padding: 12px 14px;
    box-shadow: 0 1px 2px rgba(var(--ink-rgb), 0.03);
  }
  .pol-summary-label {
    font-size: 9.5px;
    color: var(--fg-soft);
    opacity: 0.8;
    letter-spacing: 0;
    font-weight: 700;
    margin-bottom: 6px;
  }
  .pol-summary-value {
    font-size: 12px;
    font-weight: 600;
    color: var(--fg);
    line-height: 1.5;
    letter-spacing: -0.005em;
  }
  .pol-summary-box.accent .pol-summary-label { color: var(--accent); }
  .pol-summary-box.accent .pol-summary-value { color: var(--fg); }

  /* 국가 그리드 */
  .pol-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 14px;
    margin-bottom: 18px;
  }
  .pol-country {
    background: var(--white);
    border: 1px solid rgba(var(--ink-rgb), 0.06);
    border-radius: 10px;
    padding: 18px 18px 16px;
    box-shadow:
      0 1px 2px rgba(var(--ink-rgb), 0.03),
      0 4px 14px rgba(var(--ink-rgb), 0.04);
  }
  .pol-country-header {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 10px;
    margin-bottom: 16px;
    padding-bottom: 12px;
    border-bottom: 1px solid var(--line-soft);
  }
  .pol-country-name-wrap {
    display: flex;
    flex-direction: column;
    gap: 3px;
  }
  .pol-country-flag {
    font-size: 10px;
    letter-spacing: 0;
    font-weight: 700;
    color: var(--accent);
  }
  .pol-country-name {
    font-size: 22px;
    font-weight: 700;
    color: var(--fg);
    letter-spacing: -0.025em;
    line-height: 1.1;
  }
  .pol-country-type {
    font-size: 9.5px;
    color: var(--fg-soft);
    opacity: 0.7;
    letter-spacing: 0;
    text-align: right;
    line-height: 1.4;
    max-width: 140px;
  }

  .pol-section {
    margin-bottom: 14px;
  }
  .pol-section:last-child { margin-bottom: 0; }
  .pol-section-label {
    font-size: 9.5px;
    color: var(--fg-soft);
    letter-spacing: 0;
    font-weight: 700;
    margin-bottom: 8px;
  }

  /* 아젠다 태그 */
  .pol-agenda {
    display: flex;
    flex-wrap: wrap;
    gap: 5px;
  }
  .pol-tag {
    font-size: 11px;
    font-weight: 600;
    color: var(--fg);
    background: var(--bg-soft);
    border: 1px solid var(--line);
    padding: 4px 9px;
    border-radius: 999px;
    letter-spacing: -0.005em;
  }

  /* 정책 카드 */
  .pol-policy {
    background: var(--bg-soft);
    border-radius: 6px;
    padding: 10px 12px;
    margin-bottom: 6px;
    cursor: pointer;
    transition: background 0.15s, box-shadow 0.15s;
  }
  .pol-policy:last-child { margin-bottom: 0; }
  .pol-policy:hover {
    background: var(--white);
    box-shadow: 0 2px 6px rgba(var(--ink-rgb), 0.04);
  }
  .pol-policy.orange,
  .pol-policy.red,
  .pol-policy.blue { /* color variants kept for hover only */ }
  .pol-policy-head {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    gap: 8px;
    margin-bottom: 3px;
  }
  .pol-policy-title {
    font-size: 13px;
    font-weight: 700;
    color: var(--fg);
    letter-spacing: -0.015em;
    line-height: 1.3;
  }
  .pol-policy-src {
    font-size: 9px;
    color: var(--fg-soft);
    opacity: 0.65;
    letter-spacing: 0;
    text-decoration: none;
    border-bottom: 1px solid var(--line);
    padding-bottom: 1px;
    white-space: nowrap;
    flex-shrink: 0;
  }
  .pol-policy-src:hover { color: var(--accent); border-color: var(--accent); opacity: 1; }
  .pol-policy-desc {
    font-size: 11.5px;
    color: var(--fg-soft);
    line-height: 1.55;
  }

  /* Operating Model (국가 카드 내부) */
  .pol-om {
    display: flex;
    flex-direction: column;
    gap: 0;
  }
  .pol-om-row {
    display: grid;
    grid-template-columns: 120px 1fr;
    gap: 12px;
    align-items: baseline;
    padding: 8px 0;
    border-bottom: 1px solid var(--line-soft);
  }
  .pol-om-row:last-child { border-bottom: none; }
  .pol-om-key {
    font-family: var(--mono);
    font-size: 10px;
    color: var(--fg-soft);
    letter-spacing: 0.04em;
    font-weight: 600;
  }
  .pol-om-val {
    font-size: 12px;
    color: var(--fg);
    line-height: 1.4;
  }
  .pol-om-val.cn strong { color: var(--blue-deep); font-weight: 700; }
  .pol-om-val.us strong { color: var(--gold); font-weight: 700; }

  /* Operating Model 매트릭스 */
  .pol-matrix-block {
    background: var(--white);
    border: 1px solid rgba(var(--ink-rgb), 0.06);
    border-radius: 10px;
    padding: 18px 18px 14px;
    box-shadow:
      0 1px 2px rgba(var(--ink-rgb), 0.03),
      0 4px 14px rgba(var(--ink-rgb), 0.04);
  }

  /* 빌드 셀렉터 / chip 스타일은 chapter3.css 가 source of truth — lenses.css 중복 정의 제거 */
  .pol-builder-result {
    font-size: 10px;
    color: var(--fg-soft);
    opacity: 0.7;
    letter-spacing: 0;
    margin-left: auto;
  }
  .pol-builder-result strong { color: var(--accent); font-weight: 700; opacity: 1; }

  .pol-matrix-title {
    font-size: 14px;
    font-weight: 700;
    color: var(--fg);
    letter-spacing: -0.015em;
    margin-bottom: 14px;
    padding-bottom: 10px;
    border-bottom: 1px solid var(--line-soft);
    display: flex;
    align-items: baseline;
    gap: 8px;
  }
  .pol-matrix-title-eyebrow {
    font-size: 9.5px;
    color: var(--accent);
    letter-spacing: 0;
    font-weight: 700;
  }
  .pol-matrix {
    display: grid;
    grid-template-columns: 160px 1fr 1fr;
    gap: 0;
  }
  .pol-matrix-cell {
    padding: 10px 12px;
    border-bottom: 1px solid var(--line-soft);
    font-size: 12px;
    color: var(--fg);
    line-height: 1.45;
  }
  .pol-matrix-cell.head {
    font-size: 9.5px;
    color: var(--fg-soft);
    letter-spacing: 0;
    font-weight: 700;
    border-bottom: 1px solid var(--line);
  }
  .pol-matrix-cell.row-label {
    font-size: 10px;
    color: var(--fg-soft);
    letter-spacing: 0;
    font-weight: 600;
  }
  .pol-matrix-cell.cn { color: var(--fg); }
  .pol-matrix-cell.cn strong { color: var(--blue-deep); font-weight: 700; }
  .pol-matrix-cell.us { color: var(--fg); }
  .pol-matrix-cell.us strong { color: var(--gold); font-weight: 700; }
  .pol-matrix-row:last-child .pol-matrix-cell { border-bottom: none; }

  @media (max-width: 760px) {
    .pol-top-summary { grid-template-columns: 1fr 1fr; }
    .pol-grid { grid-template-columns: 1fr; }
    .pol-matrix { grid-template-columns: 1fr; }
    .pol-matrix-cell.head:not(:first-child) { display: none; }
  }

  /* ====== Chapter 3-2: 이슈 타임라인 (Golden Dome) ====== */
  .tflow-card { padding: 0; }

  /* Build 셀렉터 */
  .tflow-builder {
    display: flex;
    flex-direction: column;
    gap: 10px;
    margin-bottom: 16px;
    padding: 14px 16px;
    background: var(--white);
    border: 1px solid rgba(var(--ink-rgb), 0.06);
    border-radius: 8px;
    box-shadow: 0 1px 2px rgba(var(--ink-rgb), 0.03);
  }
  .tflow-builder-row {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
  }
  .tflow-builder-label {
    font-size: 10px;
    letter-spacing: 0;
    font-weight: 700;
    color: var(--fg-soft);
    flex-shrink: 0;
    min-width: 84px;
  }
  .tflow-chip {
    font-size: 10.5px;
    font-weight: 600;
    padding: 5px 10px;
    border-radius: 4px;
    background: var(--bg-soft);
    border: 1px solid var(--line);
    color: var(--fg-soft);
    cursor: pointer;
    transition: all 0.15s;
    letter-spacing: 0;
  }
  .tflow-chip:hover { color: var(--fg); border-color: var(--fg-soft); }
  .tflow-chip.active {
    background: var(--accent);
    color: var(--white);
    border-color: var(--accent);
  }
  .tflow-chip.ghost {
    border-style: dashed;
    opacity: 0.55;
  }
  .tflow-chip.ghost::before {
    content: '+ ';
    opacity: 0.7;
  }
  .tflow-builder-result {
    font-size: 10px;
    color: var(--fg-soft);
    opacity: 0.7;
    letter-spacing: 0;
    margin-left: auto;
  }
  .tflow-builder-result strong { color: var(--accent); font-weight: 700; opacity: 1; }
  .tflow-meta {
    display: flex;
    align-items: baseline;
    gap: 14px;
    flex-wrap: wrap;
    margin-bottom: 16px;
    padding: 10px 14px;
    background: var(--bg-soft);
    border-radius: 6px;
  }
  .tflow-meta-label {
    font-size: 9.5px;
    letter-spacing: 0;
    font-weight: 700;
    color: var(--fg-soft);
  }
  .tflow-meta-stat {
    font-size: 11px;
    color: var(--fg);
    letter-spacing: 0;
    font-weight: 600;
  }
  .tflow-meta-stat strong { color: var(--accent); font-weight: 700; }

  .tflow-headline {
    margin-bottom: 18px;
    padding: 14px 16px;
    background: var(--fg);
    color: var(--white);
    border-radius: 6px;
  }
  .tflow-headline-eyebrow {
    font-size: 10px;
    color: var(--accent);
    letter-spacing: 0;
    font-weight: 700;
    margin-bottom: 4px;
  }
  .tflow-headline-text {
    font-size: 17px;
    font-weight: 700;
    letter-spacing: -0.025em;
    line-height: 1.3;
  }

  /* 수직 타임라인 컨테이너 */
  .tflow-timeline {
    position: relative;
    padding-left: 28px;
    margin-bottom: 22px;
  }
  .tflow-timeline::before {
    content: '';
    position: absolute;
    left: 8px;
    top: 8px;
    bottom: 8px;
    width: 2px;
    background: var(--line);
    border-radius: 2px;
  }

  /* Phase 그룹 */
  .tflow-phase {
    margin-bottom: 28px;
    position: relative;
  }
  .tflow-phase:last-child { margin-bottom: 8px; }
  .tflow-phase-dot {
    position: absolute;
    left: -28px;
    top: 6px;
    width: 18px;
    height: 18px;
    border-radius: 50%;
    background: var(--accent);
    border: 3px solid var(--bg);
    box-shadow: 0 0 0 2px var(--accent);
    z-index: 2;
  }
  .tflow-phase-dot.mixed {
    background: var(--gold);
    box-shadow: 0 0 0 2px var(--gold);
  }
  .tflow-phase-dot.negative {
    background: var(--rose);
    box-shadow: 0 0 0 2px var(--rose);
  }

  .tflow-phase-head {
    display: flex;
    align-items: baseline;
    gap: 10px;
    margin-bottom: 4px;
    flex-wrap: wrap;
  }
  .tflow-phase-month {
    font-family: var(--mono);
    font-size: 11px;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    font-weight: 700;
    color: var(--accent);
  }
  .tflow-phase-title {
    font-size: 15px;
    font-weight: 700;
    color: var(--fg);
    letter-spacing: -0.015em;
  }
  .tflow-phase-summary {
    font-size: 12px;
    color: var(--fg-soft);
    line-height: 1.55;
    margin-bottom: 12px;
    padding-left: 0;
  }
  .tflow-phase-summary strong { color: var(--fg); font-weight: 700; }

  /* 이벤트 카드 */
  .tflow-events {
    display: flex;
    flex-direction: column;
    gap: 6px;
  }
  .tflow-event {
    display: grid;
    grid-template-columns: 50px 84px 1fr auto auto;
    gap: 12px;
    align-items: center;
    padding: 10px 12px;
    background: var(--white);
    border: 1px solid var(--line);
    border-radius: 5px;
    cursor: pointer;
    transition: border-color 0.15s, box-shadow 0.15s;
  }
  .tflow-event:hover {
    border-color: var(--accent);
    box-shadow: 0 2px 8px rgba(var(--mint-rgb), 0.08);
  }
  .tflow-event:hover .tflow-event-source {
    color: var(--accent);
    border-color: var(--accent);
  }
  .tflow-event-date {
    font-family: var(--mono);
    font-size: 11px;
    font-weight: 700;
    color: var(--fg-soft);
    letter-spacing: 0.02em;
    line-height: 1.4;
  }
  .tflow-event-cat {
    font-size: 9.5px;
    letter-spacing: 0;
    font-weight: 700;
    padding: 3px 7px;
    border-radius: 3px;
    text-align: center;
    line-height: 1.3;
    height: fit-content;
  }
  .tflow-event-cat.policy {
    background: rgba(var(--mint-rgb), 0.15);
    color: #2A6557;
  }
  .tflow-event-cat.arch {
    background: rgba(143, 180, 212, 0.18);
    color: #3B6A8F;
  }
  .tflow-event-cat.industry {
    background: rgba(var(--gold-rgb), 0.18);
    color: #7C5B27;
  }
  .tflow-event-body {
    min-width: 0;
  }
  .tflow-event-title {
    font-size: 12.5px;
    font-weight: 700;
    color: var(--fg);
    letter-spacing: -0.005em;
    line-height: 1.35;
    margin-bottom: 3px;
  }
  .tflow-event-desc {
    font-size: 11px;
    color: var(--fg-soft);
    line-height: 1.5;
  }
  .tflow-event-signal {
    font-size: 9px;
    font-weight: 700;
    letter-spacing: 0;
    padding: 4px 8px;
    border-radius: 3px;
    height: fit-content;
    white-space: nowrap;
  }
  .tflow-event-signal.positive {
    background: rgba(var(--mint-rgb), 0.15);
    color: var(--accent);
  }
  .tflow-event-signal.mixed {
    background: rgba(var(--gold-rgb), 0.18);
    color: var(--gold-deep);
  }
  .tflow-event-signal.negative {
    background: rgba(var(--rose-rgb), 0.18);
    color: var(--rose-deep);
  }
  /* 원문 링크 */
  .tflow-event-source {
    font-size: 9.5px;
    font-weight: 600;
    color: var(--fg-soft);
    letter-spacing: 0;
    text-decoration: none;
    border-bottom: 1px solid var(--line);
    padding-bottom: 1px;
    white-space: nowrap;
    transition: color 0.15s, border-color 0.15s;
    display: flex;
    align-items: center;
    gap: 4px;
  }
  .tflow-event-source-arrow {
    font-size: 10px;
    opacity: 0.7;
  }

  /* Segment Reading 3 카드 */
  .tflow-segments {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 10px;
    margin-top: 18px;
    padding-top: 18px;
    border-top: 1px solid var(--line-soft);
  }
  .tflow-segment-head-label {
    font-size: 10px;
    letter-spacing: 0;
    font-weight: 700;
    color: var(--fg-soft);
    margin-bottom: 10px;
    grid-column: 1 / -1;
  }
  .tflow-segment {
    background: var(--white);
    border: 1px solid var(--line);
    border-radius: 6px;
    padding: 13px 14px;
  }
  .tflow-segment-top {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 8px;
    margin-bottom: 8px;
  }
  .tflow-segment-cat {
    font-size: 9.5px;
    font-weight: 700;
    padding: 3px 7px;
    border-radius: 3px;
    letter-spacing: 0;
  }
  .tflow-segment-cat.policy { background: rgba(var(--mint-rgb), 0.15); color: #2A6557; }
  .tflow-segment-cat.arch { background: rgba(143, 180, 212, 0.18); color: #3B6A8F; }
  .tflow-segment-cat.industry { background: rgba(var(--gold-rgb), 0.18); color: #7C5B27; }
  .tflow-segment-signal {
    font-size: 9px;
    font-weight: 700;
    letter-spacing: 0;
    padding: 4px 8px;
    border-radius: 3px;
  }
  .tflow-segment-signal.positive { background: var(--accent); color: var(--white); }
  .tflow-segment-signal.mixed { background: var(--gold); color: var(--white); }
  .tflow-segment-signal.negative { background: var(--rose); color: var(--white); }
  .tflow-segment-title {
    font-size: 13px;
    font-weight: 700;
    color: var(--fg);
    letter-spacing: -0.015em;
    line-height: 1.3;
    margin-bottom: 6px;
  }
  .tflow-segment-text {
    font-size: 11px;
    color: var(--fg-soft);
    line-height: 1.55;
  }

  /* 결론 박스 */
  .tflow-takeaway {
    margin-top: 14px;
    padding: 14px 16px;
    background: var(--accent-soft);
    border-radius: 6px;
    font-size: 12.5px;
    color: var(--fg);
    line-height: 1.6;
  }
  .tflow-takeaway-label {
    font-size: 10px;
    color: var(--accent);
    font-weight: 700;
    letter-spacing: 0;
    margin-bottom: 4px;
  }
  .tflow-takeaway strong { font-weight: 700; }

  @media (max-width: 700px) {
    .tflow-event { grid-template-columns: 1fr; gap: 4px; }
    .tflow-segments { grid-template-columns: 1fr; }
  }

  /* ====== Chapter 3-1: Custom Value Chain (Micron 노드 그래프) ====== */
  .vchain-card { padding: 0; }
  .vchain-selector {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
    padding-bottom: 14px;
    margin-bottom: 18px;
    border-bottom: 1px solid var(--line-soft);
  }
  .vchain-selector-label {
    font-size: 10px;
    letter-spacing: 0;
    font-weight: 700;
    color: var(--fg-soft);
    margin-right: 6px;
    align-self: center;
  }
  .vchain-chip {
    font-size: 10.5px;
    font-weight: 600;
    letter-spacing: 0;
    padding: 6px 10px;
    border-radius: 4px;
    background: var(--bg-soft);
    border: 1px dashed var(--line);
    color: var(--fg-soft);
    cursor: pointer;
    transition: all 0.15s;
    opacity: 0.6;
  }
  .vchain-chip::before {
    content: '+ ';
    opacity: 0.7;
  }
  .vchain-chip:hover { color: var(--fg); border-color: var(--fg-soft); opacity: 1; }
  .vchain-chip.active {
    background: var(--accent);
    color: var(--white);
    border: 1px solid var(--accent);
    opacity: 1;
  }
  .vchain-chip.active::before { display: none; }
  .vchain-chip-new {
    font-size: 8.5px;
    margin-left: 4px;
    opacity: 0.8;
    font-weight: 700;
  }

  /* 타임 슬라이더 */
  .vchain-time {
    display: flex;
    align-items: center;
    gap: 14px;
    margin-bottom: 14px;
    padding: 12px 16px;
    background: var(--white);
    border: 1px solid var(--line);
    border-radius: 6px;
  }
  .vchain-time-label {
    font-size: 10px;
    letter-spacing: 0;
    font-weight: 700;
    color: var(--fg-soft);
    flex-shrink: 0;
  }
  .vchain-time-track {
    flex: 1;
    position: relative;
    height: 28px;
    display: flex;
    align-items: center;
  }
  .vchain-time-line {
    position: absolute;
    left: 0;
    right: 0;
    top: 50%;
    height: 2px;
    background: var(--line);
    transform: translateY(-50%);
    border-radius: 2px;
  }
  .vchain-time-fill {
    position: absolute;
    left: 0;
    top: 50%;
    height: 2px;
    background: var(--accent);
    transform: translateY(-50%);
    border-radius: 2px;
    width: 65%;
  }
  .vchain-time-tick {
    position: absolute;
    top: 50%;
    width: 1px;
    height: 8px;
    background: var(--line);
    transform: translate(-50%, -50%);
  }
  .vchain-time-tick-label {
    position: absolute;
    top: calc(50% + 8px);
    transform: translateX(-50%);
    font-size: 9px;
    color: var(--fg-soft);
    opacity: 0.6;
    letter-spacing: 0;
    white-space: nowrap;
  }
  .vchain-time-handle-l,
  .vchain-time-handle-r {
    position: absolute;
    top: 50%;
    width: 14px;
    height: 14px;
    border-radius: 50%;
    background: var(--white);
    border: 2px solid var(--accent);
    transform: translate(-50%, -50%);
    cursor: ew-resize;
    z-index: 2;
    box-shadow: 0 1px 4px rgba(var(--ink-rgb), 0.12);
  }
  .vchain-time-handle-l { left: 5%; }
  .vchain-time-handle-r { left: 70%; }
  .vchain-time-range {
    font-size: 10.5px;
    color: var(--accent);
    font-weight: 700;
    letter-spacing: 0;
    white-space: nowrap;
    flex-shrink: 0;
    min-width: 120px;
    text-align: right;
  }

  /* 그래프 컨테이너 */
  .vchain-graph {
    position: relative;
    width: 100%;
    height: 620px;
    background:
      radial-gradient(circle at 50% 50%, rgba(var(--mint-rgb), 0.04) 0%, transparent 55%),
      linear-gradient(180deg, #FCFCFA 0%, var(--bg-soft) 100%);
    border: 1px solid var(--line-soft);
    border-radius: 10px;
    overflow: hidden;
  }
  .vchain-graph-svg {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    pointer-events: none;
  }
  .vchain-graph-svg .edge-line {
    fill: none;
    stroke-width: 1.25;
    opacity: 0.55;
    transition: stroke-width 0.2s, opacity 0.2s;
  }
  .vchain-graph-svg .edge-line.thick { stroke-width: 2; opacity: 0.75; }
  .vchain-graph-svg .edge-buy { stroke: var(--gold); }
  .vchain-graph-svg .edge-sell { stroke: var(--accent); }
  .vchain-graph-svg .edge-rival { stroke: var(--rose); stroke-dasharray: 4 4; opacity: 0.45; }
  .vchain-graph-svg .edge-mou { stroke: var(--sky); stroke-dasharray: 3 3; }

  /* 노드 (absolute 배치) */
  .vchain-node-g {
    position: absolute;
    transform: translate(-50%, -50%);
    z-index: 2;
  }
  .vchain-node-g.hub {
    z-index: 4;
  }
  .vchain-n {
    background: var(--white);
    border: 1px solid rgba(var(--ink-rgb), 0.06);
    border-radius: 10px;
    padding: 9px 14px;
    text-align: center;
    cursor: pointer;
    transition: transform 0.2s, box-shadow 0.2s, border-color 0.2s;
    min-width: 86px;
    box-shadow: 0 1px 2px rgba(var(--ink-rgb), 0.04), 0 4px 12px rgba(var(--ink-rgb), 0.04);
  }
  .vchain-n:hover {
    border-color: var(--accent);
    transform: translateY(-2px);
    box-shadow: 0 4px 16px rgba(var(--mint-rgb), 0.18);
  }
  .vchain-n-name {
    font-size: 12px;
    font-weight: 700;
    color: var(--fg);
    letter-spacing: -0.01em;
    line-height: 1.2;
    white-space: nowrap;
  }
  .vchain-n-sub {
    font-size: 8.5px;
    color: var(--fg-soft);
    opacity: 0.55;
    margin-top: 3px;
    letter-spacing: 0;
    font-weight: 500;
  }

  /* Hub 노드 */
  .vchain-n.hub {
    background: linear-gradient(145deg, #1A1D24 0%, #0F1115 100%);
    color: var(--white);
    border: none;
    padding: 18px 28px;
    border-radius: 14px;
    box-shadow:
      0 1px 3px rgba(var(--ink-rgb), 0.10),
      0 12px 32px rgba(var(--ink-rgb), 0.22),
      inset 0 1px 0 rgba(255, 255, 255, 0.05);
  }
  .vchain-n.hub:hover {
    transform: translateY(-2px);
    box-shadow:
      0 1px 3px rgba(var(--ink-rgb), 0.10),
      0 16px 40px rgba(var(--ink-rgb), 0.28),
      inset 0 1px 0 rgba(255, 255, 255, 0.05);
  }
  .vchain-n.hub .vchain-n-name {
    color: var(--white);
    font-size: 20px;
    letter-spacing: -0.03em;
    font-weight: 700;
  }
  .vchain-n.hub .vchain-n-sub {
    color: var(--accent);
    opacity: 1;
    margin-top: 6px;
    font-size: 9px;
    letter-spacing: 0;
    font-weight: 600;
  }

  /* Edge 라벨 (그래프 내부 absolute 배치) — 플레인 텍스트 */
  .vchain-edge-label {
    position: absolute;
    transform: translate(-50%, -50%);
    z-index: 3;
    background: transparent;
    border: none;
    padding: 2px 6px;
    font-size: 9.5px;
    color: var(--fg);
    letter-spacing: 0;
    font-weight: 700;
    line-height: 1.35;
    cursor: pointer;
    transition: color 0.2s;
    max-width: 180px;
    text-align: center;
    pointer-events: auto;
    box-shadow: none;
  }
  .vchain-edge-label::after { display: none; }
  .vchain-edge-label:hover {
    color: var(--accent);
    background: transparent;
    box-shadow: none;
    transform: translate(-50%, -50%);
  }
  .vchain-edge-label.buy { color: var(--gold-deep); }
  .vchain-edge-label.sell { color: var(--accent); }
  .vchain-edge-label.rival { color: var(--rose-deep); }
  .vchain-edge-label.mou { color: var(--blue-deep); }
  .vchain-edge-label-amount {
    color: var(--fg-soft);
    opacity: 0.6;
    font-size: 9px;
    display: block;
    margin-top: 2px;
    font-weight: 500;
    letter-spacing: 0;
  }

  /* 좌상단 / 좌측 영역 라벨 */
  .vchain-zone-label {
    position: absolute;
    font-size: 9.5px;
    letter-spacing: 0;
    font-weight: 700;
    color: var(--fg-soft);
    opacity: 0.7;
    z-index: 1;
  }

  /* 범례 */
  .vchain-legend {
    display: flex;
    gap: 16px;
    flex-wrap: wrap;
    margin-top: 10px;
    padding: 10px 14px;
    background: var(--white);
    border: 1px solid var(--line);
    border-radius: 6px;
    font-size: 10px;
    color: var(--fg-soft);
    font-weight: 600;
    letter-spacing: 0;
  }
  .vchain-legend-item {
    display: flex;
    align-items: center;
    gap: 6px;
  }
  .vchain-legend-line {
    width: 22px;
    height: 2px;
    flex-shrink: 0;
  }
  .vchain-legend-line.buy { background: var(--gold); }
  .vchain-legend-line.sell { background: var(--accent); }
  .vchain-legend-line.rival { background: var(--rose); }
  .vchain-legend-line.mou { background: var(--sky); }
  .vchain-legend-tip {
    margin-left: auto;
    color: var(--fg-soft);
    opacity: 0.7;
    font-family: var(--font-base);
    font-size: 11px;
    letter-spacing: 0;
    font-weight: 500;
  }

  /* 기사 모달 (edge 클릭 시 노출) */
  .vchain-article-modal {
    position: absolute;
    z-index: 10;
    background: var(--white);
    border: 1px solid rgba(var(--ink-rgb), 0.06);
    border-radius: 10px;
    box-shadow:
      0 2px 6px rgba(var(--ink-rgb), 0.04),
      0 18px 40px rgba(var(--ink-rgb), 0.10);
    padding: 16px 18px 14px;
    width: 360px;
    max-width: calc(100% - 28px);
  }
  .vchain-article-head {
    display: flex;
    align-items: baseline;
    gap: 10px;
    margin-bottom: 8px;
    padding-bottom: 8px;
    border-bottom: 1px solid var(--line-soft);
  }
  .vchain-article-tag {
    font-size: 9.5px;
    color: var(--accent);
    background: var(--accent-soft);
    padding: 3px 7px;
    border-radius: 3px;
    letter-spacing: 0;
    font-weight: 700;
  }
  .vchain-article-meta {
    font-size: 9.5px;
    color: var(--fg-soft);
    opacity: 0.75;
    letter-spacing: 0;
  }
  .vchain-article-title {
    font-size: 14px;
    font-weight: 700;
    color: var(--fg);
    letter-spacing: -0.015em;
    line-height: 1.35;
    margin-bottom: 8px;
  }
  .vchain-article-quote {
    font-size: 12px;
    color: var(--fg-soft);
    line-height: 1.55;
    padding: 9px 11px;
    background: var(--bg-soft);
    border-radius: 4px;
    margin-bottom: 10px;
  }
  .vchain-article-quote strong { color: var(--fg); font-weight: 700; }
  .vchain-article-figures {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
    margin-bottom: 10px;
  }
  .vchain-article-fig {
    background: var(--white);
    border: 1px solid var(--line);
    border-radius: 4px;
    padding: 5px 9px;
    font-size: 10.5px;
    color: var(--accent);
    font-weight: 700;
    letter-spacing: 0;
  }
  .vchain-article-fig .fig-label {
    color: var(--fg-soft);
    opacity: 0.75;
    font-weight: 500;
    margin-left: 4px;
  }
  .vchain-article-source {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    font-size: 10px;
    color: var(--fg-soft);
    opacity: 0.8;
    padding-top: 6px;
    border-top: 1px solid var(--line-soft);
  }
  .vchain-article-source-link {
    color: var(--accent);
    font-weight: 700;
    text-decoration: none;
    letter-spacing: 0;
  }
  .vchain-article-source-link:hover { text-decoration: underline; }

  @media (max-width: 760px) {
    .vchain-graph { height: 760px; }
  }

  /* ====== Chapter 2: AI 데이터센터 전력 확보 비교 — 버블 매트릭스 ====== */
  .pwr-card {
    padding: 0;
  }
  .pwr-intro {
    font-size: 13px;
    color: var(--fg-soft);
    line-height: 1.6;
    margin-bottom: 18px;
    padding: 14px 16px;
    background: var(--bg-soft);
    border-left: 2px solid var(--accent);
    border-radius: 0 6px 6px 0;
  }
  .pwr-intro strong { color: var(--fg); font-weight: 700; }

  /* 2단계 파이프라인 */
  .pwr-pipeline {
    display: grid;
    grid-template-columns: 1fr auto 1fr;
    gap: 10px;
    margin-bottom: 14px;
    align-items: stretch;
  }
  .pwr-stage {
    background: var(--white);
    border: 1px solid var(--line);
    border-radius: 6px;
    padding: 12px 14px;
    display: flex;
    flex-direction: column;
    gap: 6px;
  }
  .pwr-stage-head {
    display: flex;
    align-items: baseline;
    gap: 8px;
  }
  .pwr-stage-num {
    font-size: 10px;
    letter-spacing: 0;
    font-weight: 700;
    color: var(--accent);
  }
  .pwr-stage-title {
    font-size: 12.5px;
    font-weight: 700;
    color: var(--fg);
    letter-spacing: -0.005em;
  }
  .pwr-stage-desc {
    font-size: 11px;
    color: var(--fg-soft);
    line-height: 1.4;
  }
  .pwr-stage-meta {
    margin-top: 4px;
    padding-top: 6px;
    border-top: 1px solid var(--line-soft);
    display: flex;
    flex-wrap: wrap;
    gap: 6px 10px;
    font-size: 10px;
    color: var(--fg-soft);
    letter-spacing: 0;
    line-height: 1.4;
  }
  .pwr-stage-meta strong {
    color: var(--accent);
    font-weight: 700;
  }
  .pwr-stage-arrow {
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 18px;
    color: var(--accent);
    font-weight: 700;
    opacity: 0.7;
  }
  @media (max-width: 700px) {
    .pwr-pipeline { grid-template-columns: 1fr; }
    .pwr-stage-arrow { transform: rotate(90deg); padding: 4px 0; }
  }

  /* 카테고리 칩 (자동 추출 표시) */
  .pwr-cats {
    display: flex;
    align-items: baseline;
    flex-wrap: wrap;
    gap: 6px 10px;
    margin-bottom: 14px;
    padding: 10px 14px;
    background: var(--bg-soft);
    border-radius: 6px;
  }
  .pwr-cats-label {
    font-size: 9.5px;
    letter-spacing: 0;
    font-weight: 700;
    color: var(--fg-soft);
    margin-right: 6px;
  }
  .pwr-cats-chip {
    font-size: 10px;
    font-weight: 600;
    padding: 3px 8px;
    background: var(--white);
    border: 1px solid var(--line);
    border-radius: 3px;
    color: var(--fg-soft);
    letter-spacing: 0;
  }
  .pwr-cats-chip.active {
    background: var(--accent);
    color: var(--white);
    border-color: var(--accent);
  }
  .pwr-cats-chip.ghost {
    border-style: dashed;
    opacity: 0.55;
  }
  .pwr-cats-note {
    font-size: 10.5px;
    color: var(--fg-soft);
    opacity: 0.7;
    margin-left: auto;
    font-style: italic;
  }
  @media (max-width: 700px) {
    .pwr-cats-note { margin-left: 0; width: 100%; }
  }

  /* 버블 매트릭스 */
  .pwr-bubble-wrap {
    overflow-x: auto;
    margin-bottom: 18px;
    padding: 8px 0;
  }
  .pwr-bubble {
    width: 100%;
    border-collapse: separate;
    border-spacing: 0;
    min-width: 720px;
  }
  .pwr-bubble th,
  .pwr-bubble td {
    padding: 0;
    vertical-align: middle;
    border-bottom: 1px solid var(--line-soft);
  }
  .pwr-bubble thead th {
    border-bottom: 1px solid var(--line);
    padding: 10px 6px 10px;
    background: var(--white);
    font-size: 10px;
    color: var(--fg-soft);
    font-weight: 700;
    letter-spacing: 0;
    text-align: center;
    line-height: 1.3;
  }
  .pwr-bubble thead th.col-co {
    text-align: left;
    padding-left: 4px;
    width: 100px;
  }
  .pwr-bubble thead th.col-total {
    color: var(--fg);
    width: 90px;
  }
  .pwr-bubble thead th .col-icon {
    display: inline-block;
    width: 8px;
    height: 8px;
    margin-right: 4px;
    border-radius: 2px;
    vertical-align: middle;
  }
  .pwr-bubble thead th.h-gas    .col-icon { background: #5A5E68; }
  .pwr-bubble thead th.h-nuke   .col-icon { background: var(--accent); }
  .pwr-bubble thead th.h-renew  .col-icon { background: var(--sky); }
  .pwr-bubble thead th.h-fuel   .col-icon { background: var(--gold); }
  .pwr-bubble thead th.h-store  .col-icon { background: #B89BBF; }
  .pwr-bubble thead th.h-self   .col-icon { background: #2A2C33; }

  .pwr-bubble tbody td {
    padding: 18px 6px;
    text-align: center;
    height: 92px;
  }
  .pwr-bubble tbody td.col-co {
    text-align: left;
    padding-left: 4px;
    font-weight: 700;
    font-size: 15px;
    color: var(--fg);
    letter-spacing: -0.015em;
  }
  .pwr-bubble tbody td.col-co .co-flag {
    display: inline-block;
    margin-left: 6px;
    font-size: 9px;
    color: var(--fg-soft);
    background: var(--bg-soft);
    border: 1px solid var(--line);
    padding: 2px 5px;
    border-radius: 3px;
    letter-spacing: 0;
    font-weight: 600;
    vertical-align: 2px;
  }
  .pwr-bubble tbody tr:last-child td { border-bottom: none; }

  /* 버블 */
  .pwr-bubble-cell {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    color: var(--white);
    font-weight: 700;
    text-align: center;
    line-height: 1.1;
    padding: 4px;
    box-sizing: border-box;
    transition: transform 0.15s;
    cursor: pointer;
    position: relative;
  }
  .pwr-bubble-cell::after {
    content: '↗';
    position: absolute;
    top: -2px;
    right: -2px;
    width: 16px;
    height: 16px;
    border-radius: 50%;
    background: var(--white);
    color: var(--accent);
    font-size: 9px;
    font-weight: 700;
    display: flex;
    align-items: center;
    justify-content: center;
    opacity: 0;
    transition: opacity 0.15s;
    border: 1px solid var(--accent);
    box-shadow: 0 1px 4px rgba(var(--ink-rgb), 0.12);
  }
  .pwr-bubble-cell:hover::after { opacity: 1; }
  .pwr-bubble-cell:hover { transform: scale(1.05); }
  .pwr-bubble-cell.gas    { background: #5A5E68; }
  .pwr-bubble-cell.nuke   { background: var(--accent); }
  .pwr-bubble-cell.renew  { background: var(--sky); }
  .pwr-bubble-cell.fuel   { background: var(--gold); }
  .pwr-bubble-cell.store  { background: #B89BBF; }
  .pwr-bubble-cell.self   { background: #2A2C33; }

  .pwr-bubble-name {
    font-size: 10px;
    letter-spacing: -0.005em;
    word-break: keep-all;
  }
  .pwr-bubble-gw {
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0;
    opacity: 0.92;
    margin-top: 1px;
  }
  /* 사이즈 — GW 기준 */
  .pwr-bubble-cell.s-xs { width: 44px; height: 44px; }
  .pwr-bubble-cell.s-xs .pwr-bubble-name { font-size: 9px; }
  .pwr-bubble-cell.s-xs .pwr-bubble-gw   { font-size: 9.5px; }

  .pwr-bubble-cell.s-sm { width: 58px; height: 58px; }
  .pwr-bubble-cell.s-sm .pwr-bubble-name { font-size: 9.5px; }
  .pwr-bubble-cell.s-sm .pwr-bubble-gw   { font-size: 10.5px; }

  .pwr-bubble-cell.s-md { width: 72px; height: 72px; }

  .pwr-bubble-cell.s-lg { width: 84px; height: 84px; }
  .pwr-bubble-cell.s-lg .pwr-bubble-name { font-size: 11px; }
  .pwr-bubble-cell.s-lg .pwr-bubble-gw   { font-size: 13px; }

  .pwr-bubble-cell.s-xl { width: 92px; height: 92px; }
  .pwr-bubble-cell.s-xl .pwr-bubble-name { font-size: 11px; }
  .pwr-bubble-cell.s-xl .pwr-bubble-gw   { font-size: 14px; }

  .pwr-bubble-empty {
    color: var(--fg-soft);
    opacity: 0.22;
    font-size: 14px;
    font-weight: 500;
  }

  .pwr-bubble-total {
    font-size: 18px;
    font-weight: 700;
    color: var(--fg);
    letter-spacing: -0.01em;
  }
  .pwr-bubble-total .unit {
    font-size: 11px;
    color: var(--fg-soft);
    opacity: 0.7;
    margin-left: 3px;
    font-weight: 600;
  }

  /* 사이즈 범례 */
  .pwr-size-legend {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 18px;
    margin-top: 10px;
    padding: 10px 14px;
    background: var(--bg-soft);
    border-radius: 6px;
    font-size: 10px;
    color: var(--fg-soft);
    letter-spacing: 0;
    font-weight: 600;
  }
  .pwr-size-legend-item {
    display: flex;
    align-items: center;
    gap: 6px;
  }
  .pwr-size-legend-dot {
    border-radius: 50%;
    background: var(--fg-soft);
    opacity: 0.4;
    flex-shrink: 0;
  }
  .pwr-size-legend-dot.s1 { width: 10px; height: 10px; }
  .pwr-size-legend-dot.s2 { width: 16px; height: 16px; }
  .pwr-size-legend-dot.s3 { width: 22px; height: 22px; }
  .pwr-size-legend-dot.s4 { width: 28px; height: 28px; }

  /* 상세 출처 표 */
  .pwr-detail {
    margin-top: 12px;
    border-top: 1px solid var(--line-soft);
    padding-top: 16px;
  }
  .pwr-detail-label {
    font-size: 10px;
    letter-spacing: 0;
    font-weight: 700;
    color: var(--fg-soft);
    margin-bottom: 10px;
  }
  .pwr-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 11.5px;
  }
  .pwr-table th {
    text-align: left;
    padding: 6px 8px;
    border-bottom: 1px solid var(--line);
    font-size: 9.5px;
    color: var(--fg-soft);
    font-weight: 700;
    letter-spacing: 0;
  }
  .pwr-table td {
    padding: 7px 8px;
    border-bottom: 1px solid var(--line-soft);
    color: var(--fg);
    vertical-align: top;
    line-height: 1.45;
  }
  .pwr-table tr:last-child td { border-bottom: none; }
  .pwr-table td.col-co { font-weight: 700; }
  .pwr-table td.col-partner { color: var(--fg-soft); }
  .pwr-table td.col-type { 
    font-size: 9.5px;
    color: var(--fg-soft);
    letter-spacing: 0;
  }
  .pwr-table td.col-src {
    font-size: 9.5px;
    color: var(--fg-soft);
    opacity: 0.65;
    letter-spacing: 0;
    white-space: nowrap;
  }
  .pwr-source-link {
    color: inherit;
    text-decoration: none;
    border-bottom: 1px solid var(--line);
    padding-bottom: 1px;
  }
  .pwr-source-link:hover { color: var(--accent); border-color: var(--accent); }

  /* 결론 박스 */
  .pwr-takeaway {
    margin-top: 18px;
    padding: 14px 16px;
    background: var(--bg-soft);
    border-radius: 6px;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px;
  }
  .pwr-takeaway-item {
    display: flex;
    flex-direction: column;
    gap: 3px;
  }
  .pwr-takeaway-label {
    font-size: 9.5px;
    letter-spacing: 0;
    font-weight: 700;
    color: var(--accent);
  }
  .pwr-takeaway-text {
    font-size: 12px;
    color: var(--fg);
    line-height: 1.5;
  }
  .pwr-takeaway-text strong { font-weight: 700; }

  @media (max-width: 700px) {
    .pwr-takeaway { grid-template-columns: 1fr; }
    .pwr-table { font-size: 10.5px; }
    .pwr-table td { padding: 6px 4px; }
  }

  /* ====== 챕터 2b: 조직 비교 (실제 프레임워크 결과 스타일) ====== */
  .compare-title {
    font-size: 17px;
    font-weight: 700;
    color: var(--fg);
    letter-spacing: -0.02em;
    margin-bottom: 12px;
  }

  /* 단순화된 컬럼 헤더 */
  .compare-col-header {
    font-size: 10.5px;
    letter-spacing: 0;
    color: var(--mute-2);
    font-weight: 700;
  }

  /* 큰 수치 강조 */
  .compare-cell-figure {
    font-size: 17px;
    font-weight: 800;
    color: var(--fg);
    letter-spacing: -0.025em;
    line-height: 1.15;
  }
  .compare-cell-figure-unit {
    font-size: 11.5px;
    font-weight: 600;
    color: var(--muted);
    margin-left: 2px;
    font-family: inherit;
    letter-spacing: 0;
  }

  /* 서술형 표현 (큰 글씨 아닌 셀) */
  .compare-cell-narrative {
    font-size: 12px;
    color: var(--fg-soft);
    line-height: 1.45;
    font-weight: 500;
  }

  /* N/A는 시각적으로 거의 안 보이게 */
  .compare-cell-empty {
    color: var(--mute-2);
    opacity: 0.35;
    font-size: 14px;
  }

  /* 시연용 셀 (53.7조) - scroll-trigger 시 펄스 + 하이라이트 */
  .compare-cell-traceable {
    position: relative;
    cursor: pointer;
    border-radius: 5px;
    padding: 4px 6px;
    margin: -4px -6px;
    transition: background 0.4s ease, box-shadow 0.4s ease;
  }
  .compare-cell-traceable::after {
    content: '↗';
    position: absolute;
    top: 4px;
    right: 4px;
    font-size: 10px;
    color: var(--accent);
    opacity: 0;
    transition: opacity 0.3s ease;
    font-weight: 700;
  }
  .compare-cell-traceable:hover::after,
  .compare-cell-traceable.demo-pulse::after {
    opacity: 1;
  }
  .compare-cell-traceable.demo-pulse {
    background: var(--accent-softer);
    animation: cell-pulse 1.8s ease-out;
  }
  .compare-cell-traceable.demo-active {
    background: var(--accent-softer);
    box-shadow: 0 0 0 2px var(--accent-soft);
  }
  @keyframes cell-pulse {
    0%   { box-shadow: 0 0 0 0 rgba(var(--mint-rgb), 0); }
    30%  { box-shadow: 0 0 0 6px rgba(var(--mint-rgb), 0.2); }
    60%  { box-shadow: 0 0 0 12px rgba(var(--mint-rgb), 0.08); }
    100% { box-shadow: 0 0 0 0 rgba(var(--mint-rgb), 0); }
  }

  /* Evidence 행 (시연 셀 행 바로 아래에 펼쳐짐) */
  .compare-evidence-row {
    display: none;
  }
  .compare-evidence-row.open {
    display: table-row;
  }
  .compare-evidence-cell {
    padding: 0 !important;
    background: var(--accent-softer);
    border-bottom: 1px solid var(--accent-soft) !important;
  }
  .compare-evidence-inner {
    padding: 14px 18px;
    max-height: 0;
    opacity: 0;
    overflow: hidden;
    transition: max-height 0.5s cubic-bezier(0.22, 1, 0.36, 1),
                opacity 0.4s ease 0.15s;
  }
  .compare-evidence-row.open .compare-evidence-inner {
    max-height: 320px;
    opacity: 1;
  }
  .compare-evidence-head {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 10px;
    flex-wrap: wrap;
  }
  .compare-evidence-id {
    background: var(--accent);
    color: var(--white);
    border-radius: 4px;
    padding: 3px 8px;
    font-size: 10.5px;
    font-weight: 800;
    letter-spacing: 0;
  }
  .compare-evidence-source {
    font-size: 10.5px;
    color: var(--fg-soft);
    background: var(--white);
    border: 1px solid var(--line);
    padding: 2px 7px;
    border-radius: 3px;
    font-weight: 600;
  }
  .compare-evidence-date {
    font-size: 10.5px;
    color: var(--mute-2);
  }
  .compare-evidence-close {
    margin-left: auto;
    background: transparent;
    border: 1px solid var(--line);
    color: var(--muted);
    border-radius: 4px;
    padding: 3px 9px;
    font-size: 11px;
    font-weight: 600;
    cursor: pointer;
    font-family: inherit;
    transition: all 0.15s ease;
  }
  .compare-evidence-close:hover {
    background: var(--fg);
    border-color: var(--fg);
    color: var(--white);
  }
  .compare-evidence-doc {
    font-size: 12.5px;
    font-weight: 700;
    color: var(--fg);
    line-height: 1.4;
    margin-bottom: 8px;
    letter-spacing: -0.01em;
  }
  .compare-evidence-sentence {
    background: var(--white);
    border: 1px solid var(--accent-soft);
    border-left: 3px solid var(--accent);
    border-radius: 0 5px 5px 0;
    padding: 9px 12px;
    font-size: 12px;
    color: var(--fg-soft);
    line-height: 1.6;
    margin-bottom: 8px;
  }
  .compare-evidence-sentence-id {
    font-size: 9.5px;
    color: var(--accent);
    font-weight: 700;
    margin-bottom: 4px;
    letter-spacing: 0;
  }
  .compare-evidence-meta {
    display: flex;
    align-items: center;
    gap: 6px;
    flex-wrap: wrap;
    font-size: 10.5px;
  }
  .compare-evidence-meta-tag {
    background: var(--white);
    border: 1px solid var(--line);
    padding: 2px 7px;
    border-radius: 3px;
    color: var(--muted);
    letter-spacing: 0;
  }
  .compare-evidence-link {
    margin-left: auto;
    color: var(--accent);
    text-decoration: none;
    font-size: 11px;
    font-weight: 600;
  }
  .compare-evidence-link:hover { text-decoration: underline; }

  /* AI 분석 박스 */
  .compare-ai {
    background: rgba(var(--indigo-rgb), 0.05);
    border: 1px solid rgba(var(--indigo-rgb), 0.15);
    border-left: 3px solid var(--indigo);
    border-radius: 6px;
    padding: 12px 14px;
    margin-bottom: 14px;
  }
  .compare-ai-label {
    font-size: 9.5px;
    letter-spacing: 0;
    color: var(--indigo);
    font-weight: 700;
    margin-bottom: 6px;
  }
  .compare-ai-list {
    display: flex;
    flex-direction: column;
    gap: 4px;
  }
  .compare-ai-item {
    font-size: 12px;
    color: var(--fg-soft);
    line-height: 1.5;
  }
  .compare-ai-item strong { color: var(--fg); font-weight: 600; }

  /* 비교 매트릭스 */
  .compare-matrix-wrap {
    overflow-x: auto;
    border: 1px solid var(--line);
    border-radius: 8px;
  }
  .compare-matrix {
    width: 100%;
    border-collapse: collapse;
    font-size: 11.5px;
    min-width: 600px;
  }
  .compare-matrix thead th {
    background: var(--bg-soft);
    padding: 10px 11px;
    text-align: left;
    border-bottom: 1px solid var(--line);
    border-right: 1px solid var(--line-soft);
    vertical-align: top;
    font-weight: 700;
    color: var(--fg);
    font-size: 11.5px;
    letter-spacing: -0.005em;
  }
  .compare-matrix thead th:last-child { border-right: none; }
  .compare-matrix thead th .col-sub {
    display: block;
    font-weight: 400;
    color: var(--muted);
    font-size: 10.5px;
    margin-top: 3px;
    line-height: 1.35;
  }
  .compare-matrix thead th.col-org {
    background: var(--bg-tech);
    width: 130px;
  }
  .compare-matrix tbody td {
    padding: 10px 11px;
    vertical-align: top;
    border-bottom: 1px solid var(--line-soft);
    border-right: 1px solid var(--line-soft);
    line-height: 1.4;
    color: var(--fg-soft);
  }
  .compare-matrix tbody td:last-child { border-right: none; }
  .compare-matrix tbody tr:last-child td { border-bottom: none; }

  /* 조직 셀 */
  .compare-org-cell {
    background: var(--bg-tech);
    display: flex;
    flex-direction: column;
    gap: 4px;
  }
  .compare-org-name {
    font-size: 12.5px;
    font-weight: 700;
    color: var(--fg);
  }
  .compare-org-meta {
    display: flex;
    gap: 5px;
    align-items: center;
    font-size: 9.5px;
    letter-spacing: 0;
  }
  .compare-org-type {
    padding: 1px 5px;
    border-radius: 3px;
    font-weight: 700;
  }
  .compare-org-type.corp {
    background: rgba(var(--indigo-rgb), 0.12);
    color: var(--indigo);
  }
  .compare-org-type.gov {
    background: rgba(var(--sig-negative-rgb), 0.12);
    color: var(--sig-negative);
  }
  .compare-org-flag {
    color: var(--mute-2);
  }

  /* 데이터 셀 */
  .compare-cell-value {
    display: flex;
    align-items: flex-start;
    gap: 6px;
  }
  .compare-cell-dot {
    flex-shrink: 0;
    width: 6px;
    height: 6px;
    border-radius: 50%;
    margin-top: 5px;
  }
  .compare-cell-dot.positive { background: var(--sig-positive); }
  .compare-cell-dot.negative { background: var(--sig-negative); }
  .compare-cell-dot.warning { background: var(--sig-warning); }
  .compare-cell-dot.neutral { background: var(--sig-neutral); }
  .compare-cell-text {
    flex: 1;
    color: var(--fg);
    font-weight: 500;
    font-size: 11px;
    line-height: 1.4;
  }
  .compare-cell-na {
    color: var(--mute-2);
    font-size: 11px;
    font-style: italic;
    opacity: 0.6;
  }

  /* 시그널 범례 */
  .compare-legend {
    margin-top: 12px;
    display: flex;
    gap: 14px;
    flex-wrap: wrap;
    padding: 0 4px;
    font-size: 10.5px;
    color: var(--muted);
  }
  .compare-legend-item {
    display: flex;
    align-items: center;
    gap: 5px;
    letter-spacing: 0;
  }
  .compare-legend-dot {
    width: 7px;
    height: 7px;
    border-radius: 50%;
  }

  /* ====== 챕터 2b: 조직 비교 매트릭스 (구버전 - 호환용) ====== */
  .org-matrix {
    width: 100%;
    border-collapse: collapse;
    font-size: 12px;
  }
  .org-matrix th, .org-matrix td {
    padding: 10px 12px;
    text-align: left;
    border-bottom: 1px solid var(--line-soft);
    vertical-align: top;
  }
  .org-matrix tr:last-child td { border-bottom: none; }
  .org-matrix thead th {
    font-size: 9.5px;
    letter-spacing: 0;
    color: var(--mute-2);
    font-weight: 600;
    border-bottom: 1px solid var(--line);
    padding-bottom: 8px;
  }
  .org-matrix thead th .pillar-dot {
    display: inline-block;
    width: 6px; height: 6px;
    border-radius: 50%;
    margin-right: 6px;
    vertical-align: middle;
  }
  .org-matrix thead th.col-quo .pillar-dot { background: var(--c-quote); }
  .org-matrix thead th.col-fig .pillar-dot { background: var(--c-figure); }
  .org-matrix thead th.col-rel .pillar-dot { background: var(--c-relation); }
  .org-name {
    font-weight: 600;
    color: var(--fg);
    font-size: 12.5px;
    white-space: nowrap;
  }
  .org-flag-mini {
    font-size: 9px;
    letter-spacing: 0;
    color: var(--mute-2);
    background: var(--bg-soft);
    padding: 1px 4px;
    border-radius: 3px;
    margin-right: 5px;
    font-weight: 700;
  }
  .org-cell-quo { color: var(--fg-soft); line-height: 1.45; font-size: 11.5px; }
  .org-cell-fig {
    color: var(--c-figure);
    font-weight: 600;
    line-height: 1.4;
    font-size: 11px;
  }
  .org-cell-rel { color: var(--c-relation); line-height: 1.45; font-weight: 500; font-size: 11px; }

  /* ====== 챕터 3-1: 가치사슬 (L1-L5) ====== */
  .vc-flow {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 8px;
    align-items: stretch;
    position: relative;
  }
  .vc-stage {
    background: var(--bg-tech);
    border: 1px solid var(--line);
    border-radius: 8px;
    padding: 11px 10px;
    display: flex;
    flex-direction: column;
    gap: 6px;
    position: relative;
    min-height: 160px;
  }
  .vc-stage-code {
    font-size: 9px;
    letter-spacing: 0;
    color: var(--accent);
    font-weight: 700;
  }
  .vc-stage-label {
    font-size: 9.5px;
    letter-spacing: 0;
    color: var(--mute-2);
    font-weight: 600;
  }
  .vc-stage-title {
    font-size: 12px;
    font-weight: 700;
    color: var(--fg);
    letter-spacing: -0.01em;
    line-height: 1.3;
  }
  .vc-chips {
    display: flex;
    flex-wrap: wrap;
    gap: 3px;
    margin-top: 4px;
  }
  .vc-chip {
    padding: 2px 6px;
    background: var(--white);
    border: 1px solid var(--line);
    border-radius: 3px;
    font-size: 10.5px;
    color: var(--fg-soft);
    font-weight: 500;
  }
  .vc-chip.hot {
    border-color: var(--c-quote-bd);
    color: var(--c-quote);
    background: var(--c-quote-soft);
    font-weight: 600;
  }
  .vc-stage-arrow {
    position: absolute;
    right: -6px;
    top: 50%;
    transform: translateY(-50%);
    width: 14px;
    height: 14px;
    background: var(--bg);
    border: 1px solid var(--line);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 2;
    font-size: 9px;
    color: var(--mute-2);
  }
  .vc-stage:last-child .vc-stage-arrow { display: none; }
  .vc-summary {
    margin-top: 14px;
    padding: 10px 12px;
    background: var(--accent-softer);
    border: 1px solid var(--accent-soft);
    border-radius: 6px;
    font-size: 12px;
    color: var(--fg-soft);
    line-height: 1.5;
  }
  .vc-summary strong { color: var(--fg); font-weight: 600; }

  /* 가치사슬 → 타임라인 연결 힌트 (chain bridge) */
  .vc-bridge {
    margin-top: 12px;
    padding: 10px 14px;
    background: var(--bg-tech);
    border: 1px dashed var(--line);
    border-radius: 6px;
    font-size: 12px;
    color: var(--fg-soft);
    line-height: 1.5;
    display: flex;
    align-items: center;
    gap: 10px;
  }
  .vc-bridge-arrow {
    color: var(--accent);
    font-weight: 700;
    font-size: 14px;
    flex-shrink: 0;
  }
  .vc-bridge strong { color: var(--fg); font-weight: 600; }

  /* ====== 챕터 3-2: 이슈별 타임라인 ====== */
  /* Executive Summary (녹색 톤) */
  .ts-issue-exec {
    background: rgba(var(--sig-positive-rgb), 0.05);
    border: 1px solid rgba(var(--sig-positive-rgb), 0.18);
    border-left: 3px solid var(--sig-positive);
    border-radius: 6px;
    padding: 12px 14px;
    margin-bottom: 14px;
  }
  .ts-issue-exec-label {
    font-size: 9.5px;
    letter-spacing: 0;
    color: var(--sig-positive);
    font-weight: 700;
    margin-bottom: 6px;
  }
  .ts-issue-exec-list { display: flex; flex-direction: column; gap: 5px; }
  .ts-issue-exec-item {
    display: flex; gap: 8px; align-items: flex-start;
    font-size: 12px; line-height: 1.5; color: var(--fg-soft);
  }
  .ts-issue-exec-item strong { color: var(--fg); font-weight: 600; }
  .ts-issue-exec-num {
    flex-shrink: 0;
    width: 16px; height: 16px;
    background: var(--sig-positive);
    color: var(--white);
    border-radius: 3px;
    display: flex; align-items: center; justify-content: center;
    margin-top: 1px;
  }

  /* 그룹 칩 행 */
  .ts-issue-groups {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 6px;
    padding: 10px 0 14px;
    border-bottom: 1px solid var(--line-soft);
    margin-bottom: 14px;
  }
  .ts-issue-groups-label {
    font-size: 11px;
    color: var(--mute-2);
    margin-right: 4px;
    font-weight: 500;
  }
  .ts-issue-group-chip {
    padding: 4px 10px;
    border-radius: 5px;
    font-size: 11px;
    font-weight: 600;
    color: var(--white);
    letter-spacing: -0.005em;
  }
  .ts-issue-group-chip.g-blue { background: var(--info-blue); }
  .ts-issue-group-chip.g-green { background: var(--sig-positive); }
  .ts-issue-group-chip.g-orange { background: var(--sig-warning); }
  .ts-issue-group-chip.g-purple { background: var(--violet); }
  .ts-issue-count {
    margin-left: auto;
    font-size: 10.5px;
    color: var(--muted);
    letter-spacing: 0;
  }

  /* 타임라인 */
  .ts-issue-timeline {
    position: relative;
    padding-left: 30px;
  }
  .ts-issue-timeline::before {
    content: '';
    position: absolute;
    left: 8px;
    top: 6px;
    bottom: 6px;
    width: 1px;
    background: var(--line);
  }
  .ts-issue-event {
    position: relative;
    padding: 14px 16px;
    background: var(--white);
    border: 1px solid var(--line);
    border-radius: 8px;
    margin-bottom: 12px;
  }
  .ts-issue-event:last-child { margin-bottom: 0; }
  .ts-issue-event::before {
    content: '';
    position: absolute;
    left: -28px;
    top: 18px;
    width: 12px;
    height: 12px;
    border-radius: 3px;
    border: 2px solid var(--bg);
  }
  .ts-issue-event[data-group="blue"]::before { background: var(--info-blue); }
  .ts-issue-event[data-group="green"]::before { background: var(--sig-positive); }
  .ts-issue-event[data-group="orange"]::before { background: var(--sig-warning); }
  .ts-issue-event[data-group="purple"]::before { background: var(--violet); }

  .ts-issue-event-meta {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
    margin-bottom: 8px;
  }
  .ts-issue-event-date {
    font-size: 11px;
    color: var(--muted);
    font-weight: 500;
    letter-spacing: 0;
  }
  .ts-issue-event-group {
    padding: 3px 8px;
    border-radius: 4px;
    font-size: 10.5px;
    font-weight: 600;
    color: var(--white);
    letter-spacing: -0.005em;
  }
  .ts-issue-event-group.g-blue { background: var(--info-blue); }
  .ts-issue-event-group.g-green { background: var(--sig-positive); }
  .ts-issue-event-group.g-orange { background: var(--sig-warning); }
  .ts-issue-event-group.g-purple { background: var(--violet); }
  .ts-issue-event-tag {
    padding: 2px 7px;
    background: var(--bg-soft);
    border: 1px solid var(--line);
    border-radius: 4px;
    font-size: 10px;
    color: var(--muted);
    letter-spacing: 0;
  }

  .ts-issue-event-title {
    font-size: 14px;
    font-weight: 700;
    color: var(--fg);
    letter-spacing: -0.015em;
    line-height: 1.4;
    margin-bottom: 6px;
  }
  .ts-issue-event-body {
    font-size: 12px;
    color: var(--fg-soft);
    line-height: 1.55;
    margin-bottom: 10px;
  }
  .ts-issue-event-cites {
    display: flex;
    flex-wrap: wrap;
    gap: 5px;
  }
  .ts-issue-event-cite {
    padding: 2px 7px;
    background: var(--bg-soft);
    border-radius: 3px;
    font-size: 10px;
    color: var(--mute-2);
    font-weight: 500;
    letter-spacing: 0;
  }

  /* ====== 챕터 4: 정책 - 4개국 ====== */
  .policy-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 8px;
  }
  .policy-card {
    padding: 12px;
    border: 1px solid var(--line);
    border-radius: 8px;
    background: var(--white);
    display: flex;
    flex-direction: column;
    gap: 6px;
  }
  .policy-card.strengthen { border-color: rgba(var(--sig-negative-rgb), 0.2); background: var(--strengthen-soft); }
  .policy-card.concern { border-color: rgba(var(--concern-rgb), 0.2); background: var(--concern-soft); }
  .policy-card.divided { border-color: rgba(109, 40, 217, 0.2); background: var(--c-relation-soft); }
  .policy-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
  }
  .policy-country {
    font-size: 12.5px;
    font-weight: 700;
    color: var(--fg);
    display: flex;
    align-items: center;
    gap: 5px;
  }
  .policy-flag { font-size: 14px; }
  .policy-signal {
    font-size: 9.5px;
    letter-spacing: 0;
    font-weight: 700;
    padding: 2px 6px;
    border-radius: 3px;
  }
  .policy-card.strengthen .policy-signal { color: var(--strengthen); background: rgba(var(--sig-negative-rgb), 0.12); }
  .policy-card.concern .policy-signal { color: var(--concern); background: rgba(var(--concern-rgb), 0.14); }
  .policy-card.divided .policy-signal { color: var(--c-relation); background: rgba(109, 40, 217, 0.12); }
  .policy-stance { font-size: 11.5px; color: var(--fg-soft); line-height: 1.4; }
  .policy-quote {
    font-size: 11px;
    color: var(--muted);
    line-height: 1.4;
    font-style: italic;
    padding-top: 4px;
    border-top: 1px dashed var(--line);
  }
  .policy-quote-src {
    color: var(--mute-2);
    font-style: normal;
    font-size: 9.5px;
    margin-left: 4px;
  }

  /* ====== 챕터 5: 시계열 ====== */
  .ts-wrap { padding: 4px 4px 0; }
  .ts-meta {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    margin-bottom: 10px;
  }
  .ts-meta-label {
    font-size: 10px;
    letter-spacing: 0;
    color: var(--mute-2);
    font-weight: 600;
  }
  .ts-meta-val {
    font-size: 14px;
    color: var(--c-figure);
    font-weight: 700;
  }
  .ts-chart { width: 100%; height: 180px; display: block; }
  .ts-events {
    margin-top: 12px;
    display: flex;
    flex-direction: column;
    gap: 6px;
  }
  .ts-event {
    display: flex;
    align-items: baseline;
    gap: 8px;
    font-size: 11.5px;
    line-height: 1.4;
  }
  .ts-event-marker {
    flex-shrink: 0;
    width: 18px;
    text-align: center;
    color: var(--c-quote);
    font-weight: 700;
    font-size: 10px;
  }
  .ts-event-date {
    color: var(--mute-2);
    font-size: 10px;
    flex-shrink: 0;
  }
  .ts-event-text { color: var(--fg-soft); }
  .ts-event-text strong { color: var(--fg); font-weight: 600; }

  /* ====== 챕터 5: 투자 - 빅딜 영향 추적 ====== */

  /* 빅딜 헤드 */
  .deal-head {
    padding: 14px 18px;
    background: linear-gradient(90deg, var(--accent-softer), transparent 70%);
    border: 1px solid var(--accent-soft);
    border-left: 3px solid var(--accent);
    border-radius: 8px;
    margin-bottom: 14px;
  }
  .deal-head-label {
    font-size: 9.5px;
    letter-spacing: 0;
    color: var(--accent);
    font-weight: 700;
    margin-bottom: 6px;
  }
  .deal-head-title {
    font-size: 16px;
    font-weight: 800;
    color: var(--fg);
    letter-spacing: -0.02em;
    line-height: 1.35;
    margin-bottom: 6px;
  }
  .deal-head-desc {
    font-size: 12px;
    color: var(--fg-soft);
    line-height: 1.5;
  }

  /* KPI 행 */
  .deal-kpis {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 8px;
    margin-bottom: 16px;
  }
  .deal-kpi {
    background: var(--white);
    border: 1px solid var(--line);
    border-radius: 8px;
    padding: 10px 11px;
    display: flex;
    flex-direction: column;
    gap: 3px;
    min-height: 76px;
  }
  .deal-kpi-label {
    font-size: 8.5px;
    letter-spacing: 0;
    color: var(--mute-2);
    font-weight: 700;
  }
  .deal-kpi-num {
    font-size: 22px;
    font-weight: 800;
    color: var(--fg);
    letter-spacing: -0.02em;
    line-height: 1.1;
  }
  .deal-kpi-num.up { color: var(--sig-positive); }
  .deal-kpi-num.flat { color: var(--mute-2); }
  .deal-kpi-num.down { color: var(--sig-negative); }
  .deal-kpi-num.na { color: var(--mute-2); opacity: 0.6; }
  .deal-kpi-sub {
    font-size: 10.5px;
    color: var(--muted);
    line-height: 1.3;
  }

  /* 다른 빅딜 후보 칩 */
  .deal-others {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    align-items: center;
    padding: 10px 0 14px;
    border-bottom: 1px solid var(--line-soft);
    margin-bottom: 14px;
  }
  .deal-others-label {
    font-size: 11px;
    color: var(--mute-2);
    margin-right: 4px;
  }
  .deal-other-chip {
    padding: 4px 9px;
    background: var(--bg-soft);
    border: 1px solid var(--line);
    border-radius: 5px;
    font-size: 11px;
    color: var(--fg-soft);
    font-weight: 500;
  }
  .deal-other-chip.active {
    background: var(--accent);
    border-color: var(--accent);
    color: var(--white);
    font-weight: 700;
  }

  /* L1-L5 + 가격 반응 */
  .deal-vc {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 8px;
    margin-bottom: 12px;
  }
  .deal-vc-stage {
    background: var(--bg-tech);
    border: 1px solid var(--line);
    border-radius: 8px;
    padding: 10px;
    display: flex;
    flex-direction: column;
    gap: 8px;
    min-height: 220px;
  }
  .deal-vc-stage-head {
    border-bottom: 1px solid var(--line-soft);
    padding-bottom: 6px;
  }
  .deal-vc-code {
    font-size: 9px;
    letter-spacing: 0;
    color: var(--accent);
    font-weight: 700;
  }
  .deal-vc-name {
    font-size: 11.5px;
    font-weight: 700;
    color: var(--fg);
    margin-top: 3px;
    line-height: 1.25;
  }
  .deal-vc-nodes {
    display: flex;
    flex-direction: column;
    gap: 6px;
  }
  .deal-node {
    background: var(--white);
    border: 1.5px solid var(--line);
    border-radius: 6px;
    padding: 7px 8px;
    display: flex;
    flex-direction: column;
    gap: 3px;
  }
  .deal-node.up { border-color: rgba(var(--sig-positive-rgb), 0.4); background: rgba(var(--sig-positive-rgb), 0.04); }
  .deal-node.flat { border-color: var(--line); }
  .deal-node.down { border-color: rgba(var(--sig-negative-rgb), 0.4); background: rgba(var(--sig-negative-rgb), 0.04); }
  .deal-node.na { border-color: var(--line); background: var(--bg-soft); opacity: 0.7; }
  .deal-node.core {
    border: 2px solid var(--accent);
    background: linear-gradient(180deg, var(--accent-softer), var(--white));
    box-shadow: 0 0 0 3px rgba(var(--mint-rgb), 0.10);
  }
  .deal-node-name {
    font-size: 11.5px;
    font-weight: 700;
    color: var(--fg);
    letter-spacing: -0.01em;
  }
  .deal-node-rel {
    font-size: 9.5px;
    color: var(--mute-2);
    letter-spacing: 0;
  }
  .deal-node-px {
    font-size: 10px;
    font-weight: 700;
    margin-top: 2px;
  }
  .deal-node.up .deal-node-px { color: var(--sig-positive); }
  .deal-node.flat .deal-node-px { color: var(--mute-2); }
  .deal-node.down .deal-node-px { color: var(--sig-negative); }
  .deal-node.na .deal-node-px { color: var(--mute-2); opacity: 0.7; }
  .deal-node.core .deal-node-px { color: var(--accent); }

  /* 범례 */
  .deal-legend {
    display: flex;
    gap: 14px;
    flex-wrap: wrap;
    padding: 8px 4px 0;
    font-size: 10.5px;
    color: var(--muted);
  }
  .deal-legend-item {
    display: flex;
    align-items: center;
    gap: 5px;
    letter-spacing: 0;
  }
  .deal-legend-dot {
    width: 8px;
    height: 8px;
    border-radius: 2px;
    border: 1.5px solid;
  }
  .deal-legend-dot.up { border-color: var(--sig-positive); background: rgba(var(--sig-positive-rgb), 0.1); }
  .deal-legend-dot.flat { border-color: var(--line); background: var(--white); }
  .deal-legend-dot.down { border-color: var(--sig-negative); background: rgba(var(--sig-negative-rgb), 0.1); }
  .deal-legend-dot.na { border-color: var(--line); background: var(--bg-soft); }

  /* 영향 노드 리스트 */
  .deal-table-wrap {
    margin-top: 14px;
    border: 1px solid var(--line);
    border-radius: 8px;
    overflow: hidden;
  }
  .deal-table-head {
    padding: 10px 14px;
    font-weight: 700;
    font-size: 12px;
    background: var(--bg-tech);
    border-bottom: 1px solid var(--line);
    color: var(--fg);
  }
  .deal-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 11.5px;
  }
  .deal-table th {
    text-align: left;
    padding: 8px 12px;
    font-size: 9.5px;
    letter-spacing: 0;
    color: var(--mute-2);
    font-weight: 600;
    background: var(--white);
    border-bottom: 1px solid var(--line-soft);
  }
  .deal-table td {
    padding: 9px 12px;
    border-bottom: 1px solid var(--line-soft);
    vertical-align: top;
    line-height: 1.4;
  }
  .deal-table tr:last-child td { border-bottom: none; }
  .deal-table .col-node { font-weight: 700; color: var(--fg); }
  .deal-table .col-rel-cell {
    font-size: 10px;
    color: var(--c-figure);
    background: var(--c-figure-soft);
    border-radius: 3px;
    padding: 2px 6px;
    display: inline-block;
  }
  .deal-table .col-px {
    font-weight: 700;
  }
  .deal-table .col-px.up { color: var(--sig-positive); }
  .deal-table .col-px.flat { color: var(--mute-2); }
  .deal-table .col-px.down { color: var(--sig-negative); }
  .deal-table .col-evidence { color: var(--fg-soft); font-size: 11px; }

  /* ====== 챕터 4 (구 5): 빅딜 그래프 view ====== */

  /* 빅딜 그래프 카드 */
  .deal-graph-card {
    position: relative;
    min-height: 520px;
    border: 1px solid var(--line);
    border-radius: 12px;
    background: radial-gradient(circle at 50% 46%, var(--white) 0%, var(--white) 32%, var(--bg-tech) 100%);
    overflow: hidden;
    margin-bottom: 14px;
  }
  .deal-graph-svg {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    z-index: 1;
    pointer-events: none;
  }

  /* 그래프 노드 */
  .gnode {
    position: absolute;
    z-index: 2;
    width: 156px;
    min-height: 78px;
    border-radius: 10px;
    padding: 10px 12px;
    background: var(--white);
    border: 1.5px solid var(--line);
    box-shadow: 0 6px 18px rgba(var(--ink-rgb), 0.04);
    display: flex;
    flex-direction: column;
    gap: 4px;
    transition: transform 0.2s ease, box-shadow 0.2s ease;
  }
  .gnode:hover {
    transform: translateY(-2px);
    box-shadow: 0 10px 24px rgba(var(--ink-rgb), 0.08);
  }
  .gnode-name {
    font-size: 13px;
    font-weight: 700;
    color: var(--fg);
    letter-spacing: -0.015em;
    line-height: 1.25;
  }
  .gnode-rel {
    font-size: 9.5px;
    color: var(--mute-2);
    letter-spacing: 0;
    line-height: 1.3;
  }
  .gnode-px {
    font-size: 11px;
    font-weight: 800;
    margin-top: 4px;
    letter-spacing: -0.01em;
  }

  /* 노드 색상별 변형 */
  .gnode.supply { border-color: rgba(var(--sig-positive-rgb), 0.45); background: linear-gradient(180deg, var(--white), #F6FFF9); }
  .gnode.demand { border-color: rgba(2, 132, 199, 0.45); background: linear-gradient(180deg, var(--white), #F5FBFF); }
  .gnode.competition { border-color: rgba(var(--sig-negative-rgb), 0.5); background: linear-gradient(180deg, var(--white), #FFF6F4); }
  .gnode.power { border-color: rgba(2, 132, 199, 0.4); background: linear-gradient(180deg, var(--white), #F5FBFF); }
  .gnode.peer { border-color: var(--line); background: var(--bg-soft); opacity: 0.85; }

  /* 가격 반응 색 */
  .gnode-px.up { color: var(--sig-positive); }
  .gnode-px.down { color: var(--sig-negative); }
  .gnode-px.flat { color: var(--mute-2); }
  .gnode-px.na { color: var(--mute-2); opacity: 0.7; }

  /* 중심: 빅딜 */
  .gnode.center {
    left: 50%; top: 50%;
    transform: translate(-50%, -50%);
    width: 184px;
    min-height: 96px;
    background: var(--fg);
    color: var(--white);
    border: 2px solid var(--fg);
    box-shadow: 0 18px 44px rgba(var(--ink-rgb), 0.22);
    text-align: center;
  }
  .gnode.center:hover {
    transform: translate(-50%, -52%);
  }
  .gnode.center .gnode-name { color: var(--white); font-size: 14.5px; }
  .gnode.center .gnode-rel { color: rgba(255, 255, 255, 0.7); }
  .gnode.center .gnode-px { color: var(--accent); font-size: 12.5px; }

  /* 위쪽 보조 노드: 빅딜 주체 (Qualcomm) */
  .gnode.actor {
    left: 50%; top: 8%;
    transform: translateX(-50%);
    width: 168px;
    min-height: 78px;
    background: #1F2937;
    color: var(--white);
    border-color: #1F2937;
    text-align: center;
  }
  .gnode.actor:hover { transform: translate(-50%, -2px); }
  .gnode.actor .gnode-name { color: var(--white); font-size: 13.5px; }
  .gnode.actor .gnode-rel { color: rgba(255, 255, 255, 0.65); }

  /* 위치 클래스 */
  .pos-tl  { left: 5%;   top: 14%; }
  .pos-ml  { left: 3%;   top: 38%; }
  .pos-bl  { left: 5%;   top: 62%; }
  .pos-tr  { right: 5%;  top: 14%; }
  .pos-mr  { right: 3%;  top: 38%; }
  .pos-br  { right: 5%;  top: 62%; }
  .pos-b1  { left: 18%;  bottom: 8%; }
  .pos-b2  { left: 50%;  bottom: 8%; transform: translateX(-50%); }
  .pos-b2:hover { transform: translate(-50%, -2px); }
  .pos-b3  { right: 18%; bottom: 8%; }

  /* SVG 그래프 링크 */
  .glink {
    fill: none;
    stroke-width: 2;
    opacity: 0.7;
  }
  .glink.supply { stroke: var(--sig-positive); }
  .glink.demand { stroke: var(--c-figure); }
  .glink.competition { stroke: var(--sig-negative); }
  .glink.deal { stroke: var(--accent); stroke-width: 2.5; }
  .glabel {
    font-size: 10px;
    font-weight: 600;
    fill: var(--mute-2);
    paint-order: stroke;
    stroke: var(--bg-tech);
    stroke-width: 4px;
    stroke-linejoin: round;
    letter-spacing: 0;
  }

  /* 그래프 하단 캡션 */
  .deal-graph-caption {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 8px;
    margin-bottom: 14px;
  }
  .caption-box {
    border: 1px solid var(--line);
    border-radius: 8px;
    background: var(--bg-tech);
    padding: 9px 11px;
  }
  .caption-box-label {
    font-size: 9px;
    letter-spacing: 0;
    color: var(--accent);
    font-weight: 700;
    margin-bottom: 4px;
  }
  .caption-box-text {
    font-size: 11px;
    color: var(--fg-soft);
    line-height: 1.4;
  }

  /* 그래프 범례 */
  .deal-graph-legend {
    display: flex;
    gap: 14px;
    flex-wrap: wrap;
    padding: 10px 4px 0;
    font-size: 10.5px;
    color: var(--muted);
    letter-spacing: 0;
  }
  .deal-graph-legend-item {
    display: flex;
    align-items: center;
    gap: 5px;
  }
  .deal-graph-legend-line {
    width: 16px;
    height: 2px;
  }
  .deal-graph-legend-line.supply { background: var(--sig-positive); }
  .deal-graph-legend-line.demand { background: var(--c-figure); }
  .deal-graph-legend-line.competition { background: var(--sig-negative); }
  .deal-graph-legend-line.deal { background: var(--accent); height: 2.5px; }

  /* ====== Evidence 인용 ID + 펼쳐지는 카드 (Chapter 1 데모) ====== */

  /* 인용 가능한 ID — 클릭 가능 */
  .cite-link {
    display: inline-flex;
    align-items: center;
    gap: 3px;
    padding: 1px 6px;
    border-radius: 4px;
    background: rgba(var(--mint-rgb), 0.10);
    border: 1px solid rgba(var(--mint-rgb), 0.25);
    color: var(--accent);
    font-size: 10.5px;
    font-weight: 700;
    cursor: pointer;
    transition: all 0.15s ease;
    letter-spacing: 0;
    text-decoration: none;
  }
  .cite-link::before {
    content: '↗';
    font-size: 9px;
    opacity: 0.7;
  }
  .cite-link:hover {
    background: var(--accent);
    color: var(--white);
    border-color: var(--accent);
  }
  .cite-link.active {
    background: var(--accent);
    color: var(--white);
    border-color: var(--accent);
  }

  /* ====== Scroll-trigger evidence 확장 (Chapter 2-1) ====== */
  /* 카드가 viewport에 들어오면 .in-view가 붙고 evidence가 펼쳐짐 + 글로우 */

  .traceable {
    position: relative;
    transition:
      box-shadow 0.6s ease,
      border-color 0.6s ease;
  }

  /* 카드가 viewport 진입 시 글로우 효과 (한 번 펄스) */
  .traceable.in-view {
    animation: traceable-glow 2.4s ease-out;
    border-color: var(--accent);
  }
  @keyframes traceable-glow {
    0%   { box-shadow: 0 0 0 0 rgba(var(--mint-rgb), 0); }
    20%  { box-shadow: 0 0 0 4px rgba(var(--mint-rgb), 0.18); }
    50%  { box-shadow: 0 0 28px 4px rgba(var(--mint-rgb), 0.28); }
    100% { box-shadow: 0 0 0 0 rgba(var(--mint-rgb), 0); }
  }

  /* evidence inline: 초기 닫힘, in-view 시 펼쳐짐 */
  .evidence-inline {
    max-height: 0;
    opacity: 0;
    overflow: hidden;
    margin-top: 0;
    padding-top: 0;
    border-top: 1px solid transparent;
    transition:
      max-height 0.7s cubic-bezier(0.22, 1, 0.36, 1),
      opacity 0.5s ease 0.2s,
      margin-top 0.6s ease,
      padding-top 0.6s ease,
      border-top-color 0.6s ease;
  }
  .traceable.in-view .evidence-inline {
    max-height: 600px;
    opacity: 1;
    margin-top: 12px;
    padding-top: 12px;
    border-top-color: var(--accent-soft);
  }

  /* inline evidence 미니 헤더 */
  .evidence-inline-head {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 8px;
    flex-wrap: wrap;
  }
  .evidence-inline-id {
    background: var(--accent);
    color: var(--white);
    border-radius: 4px;
    padding: 2px 7px;
    font-size: 10px;
    font-weight: 800;
    letter-spacing: 0;
  }
  .evidence-inline-source {
    font-size: 10px;
    color: var(--fg-soft);
    background: var(--bg-soft);
    border: 1px solid var(--line);
    padding: 2px 6px;
    border-radius: 3px;
    font-weight: 600;
  }
  .evidence-inline-date {
    font-size: 10px;
    color: var(--mute-2);
    margin-left: auto;
  }

  /* inline evidence 본문 (직접 인용 + 출처 문서) */
  .evidence-inline-doc {
    font-size: 11.5px;
    font-weight: 700;
    color: var(--fg);
    line-height: 1.4;
    margin-bottom: 6px;
    letter-spacing: -0.01em;
  }
  .evidence-inline-sentence {
    background: var(--accent-softer);
    border-left: 2px solid var(--accent);
    border-radius: 0 4px 4px 0;
    padding: 8px 11px;
    font-size: 11px;
    color: var(--fg-soft);
    line-height: 1.55;
    margin-bottom: 6px;
  }
  .evidence-inline-sentence-id {
    font-size: 9.5px;
    color: var(--accent);
    font-weight: 700;
    margin-bottom: 3px;
    letter-spacing: 0;
  }
  .evidence-inline-meta {
    display: flex;
    align-items: center;
    gap: 6px;
    flex-wrap: wrap;
    font-size: 10px;
    color: var(--mute-2);
  }
  .evidence-inline-meta-tag {
    background: var(--bg-soft);
    border: 1px solid var(--line);
    padding: 1px 6px;
    border-radius: 3px;
    color: var(--muted);
    letter-spacing: 0;
  }
  .evidence-inline-link {
    margin-left: auto;
    color: var(--accent);
    text-decoration: none;
    font-size: 10.5px;
    font-weight: 600;
  }
  .evidence-inline-link:hover { text-decoration: underline; }

  /* Evidence 펼쳐지는 카드 (구버전 - 사용 안 함) */
  .evidence-popup {
    margin-top: 12px;
    background: var(--white);
    border: 1px solid var(--accent);
    border-radius: 10px;
    padding: 0;
    box-shadow: 0 18px 48px rgba(var(--mint-rgb), 0.18);
    overflow: hidden;
    max-height: 0;
    opacity: 0;
    transition: max-height 0.35s ease, opacity 0.25s ease, margin 0.25s ease;
    margin-bottom: 0;
  }
  .evidence-popup.open {
    max-height: 800px;
    opacity: 1;
    margin-top: 14px;
    margin-bottom: 4px;
  }

  .evidence-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    padding: 12px 16px;
    background: var(--accent-softer);
    border-bottom: 1px solid var(--accent-soft);
  }
  .evidence-head-left {
    display: flex;
    align-items: center;
    gap: 8px;
  }
  .evidence-id-badge {
    background: var(--accent);
    color: var(--white);
    border-radius: 5px;
    padding: 4px 9px;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 0;
  }
  .evidence-cited-tag {
    background: rgba(var(--mint-rgb), 0.15);
    color: var(--accent);
    padding: 3px 8px;
    border-radius: 4px;
    font-size: 10.5px;
    font-weight: 600;
    letter-spacing: -0.005em;
  }
  .evidence-head-right {
    display: flex;
    align-items: center;
    gap: 8px;
  }
  .evidence-date {
    font-size: 10.5px;
    color: var(--mute-2);
    letter-spacing: 0;
  }
  .evidence-close-btn {
    background: rgba(var(--sig-negative-rgb), 0.1);
    color: var(--sig-negative);
    border: 1px solid rgba(var(--sig-negative-rgb), 0.18);
    border-radius: 4px;
    padding: 3px 8px;
    font-size: 10.5px;
    font-weight: 600;
    cursor: pointer;
    font-family: inherit;
    letter-spacing: -0.005em;
  }
  .evidence-close-btn:hover {
    background: rgba(var(--sig-negative-rgb), 0.15);
  }
  .evidence-external-icon {
    color: var(--mute-2);
    font-size: 13px;
    text-decoration: none;
  }
  .evidence-external-icon:hover {
    color: var(--accent);
  }

  .evidence-body {
    padding: 14px 16px;
  }

  .evidence-doc-title {
    font-size: 14px;
    font-weight: 700;
    color: var(--fg);
    letter-spacing: -0.015em;
    line-height: 1.4;
    margin-bottom: 10px;
  }

  .evidence-tags {
    display: flex;
    align-items: center;
    gap: 6px;
    flex-wrap: wrap;
    margin-bottom: 14px;
    font-size: 11px;
  }
  .evidence-tag-label {
    color: var(--mute-2);
    margin-right: 2px;
  }
  .evidence-tag {
    padding: 3px 8px;
    border-radius: 4px;
    font-size: 10.5px;
    font-weight: 600;
    letter-spacing: -0.005em;
  }
  .evidence-tag.source {
    background: var(--fg);
    color: var(--white);
  }
  .evidence-tag.field {
    background: var(--accent-softer);
    color: var(--accent);
    border: 1px solid var(--accent-soft);
  }
  .evidence-tag.field.muted {
    background: var(--bg-soft);
    color: var(--muted);
    border-color: var(--line);
  }

  /* 직접 연관 문장 박스 */
  .evidence-sentence-block {
    background: var(--accent-softer);
    border: 1px solid var(--accent-soft);
    border-radius: 8px;
    padding: 12px 14px;
    margin-bottom: 12px;
  }
  .evidence-sentence-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 8px;
  }
  .evidence-sentence-label {
    font-size: 11.5px;
    font-weight: 700;
    color: var(--accent);
    display: flex;
    align-items: center;
    gap: 6px;
  }
  .evidence-sentence-label::before {
    content: '🔖';
    font-size: 11px;
  }
  .evidence-sentence-count {
    background: var(--accent);
    color: var(--white);
    border-radius: 50%;
    width: 18px;
    height: 18px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 10px;
    font-weight: 800;
  }
  .evidence-sentence-id {
    font-size: 10px;
    color: var(--mute-2);
    margin-bottom: 4px;
    letter-spacing: 0;
  }
  .evidence-sentence-text {
    font-size: 12.5px;
    color: var(--fg);
    line-height: 1.6;
  }

  /* 접힌 섹션들 (요약/발언/엔티티) */
  .evidence-folded-rows {
    display: flex;
    flex-direction: column;
    border: 1px solid var(--line);
    border-radius: 8px;
    overflow: hidden;
    margin-bottom: 12px;
  }
  .evidence-folded-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 10px 14px;
    border-bottom: 1px solid var(--line-soft);
    font-size: 12px;
    color: var(--fg-soft);
    cursor: pointer;
    transition: background 0.15s ease;
  }
  .evidence-folded-row:last-child { border-bottom: none; }
  .evidence-folded-row:hover { background: var(--bg-tech); }
  .evidence-folded-icon {
    display: inline-block;
    margin-right: 8px;
    font-size: 11px;
    opacity: 0.6;
  }
  .evidence-folded-count {
    display: flex;
    align-items: center;
    gap: 8px;
  }
  .evidence-folded-num {
    background: var(--bg-soft);
    color: var(--muted);
    border-radius: 50%;
    width: 18px;
    height: 18px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 10px;
    font-weight: 700;
  }
  .evidence-folded-num.has {
    background: var(--accent-softer);
    color: var(--accent);
    border: 1px solid var(--accent-soft);
  }
  .evidence-folded-arrow {
    color: var(--mute-2);
    font-size: 11px;
  }

  /* 원문 보기 footer */
  .evidence-footer {
    padding: 10px 16px;
    border-top: 1px solid var(--line-soft);
    background: var(--bg-tech);
  }
  .evidence-footer-link {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    color: var(--accent);
    text-decoration: none;
    font-size: 12px;
    font-weight: 600;
  }
  .evidence-footer-link:hover {
    text-decoration: underline;
  }

  /* 인터랙션 안내 박스 (Chapter 1 카드 위) */
  .evidence-hint {
    margin-top: 10px;
    padding: 9px 14px;
    background: linear-gradient(90deg, var(--accent-softer), transparent 70%);
    border: 1px dashed var(--accent-soft);
    border-radius: 6px;
    font-size: 11.5px;
    color: var(--fg-soft);
    line-height: 1.5;
    display: flex;
    align-items: center;
    gap: 8px;
  }
  .evidence-hint::before {
    content: '💡';
    font-size: 13px;
    flex-shrink: 0;
  }
  .evidence-hint strong {
    color: var(--accent);
    font-weight: 700;
  }

  /* ====== Chapter 2: 조직 비교 - 차트 시각화 (v1.2) ====== */

  /* 차트 영역 공통 */
  .org-chart-area {
    padding: 0;
  }

  /* 메인 차트: 영업이익 비교 + 스파크라인 */
  .org-chart-main {
    background: var(--bg-tech);
    border: 1px solid var(--line);
    border-radius: 10px;
    padding: 22px 24px 18px;
    margin-bottom: 18px;
  }
  .org-chart-title-row {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 18px;
    flex-wrap: wrap;
  }
  .org-chart-title {
    font-size: 14px;
    font-weight: 700;
    color: var(--fg);
    letter-spacing: -0.015em;
    display: flex;
    align-items: center;
    gap: 8px;
  }
  .org-chart-title::before {
    content: '';
    width: 5px;
    height: 14px;
    background: var(--accent);
    border-radius: 2px;
  }
  .org-chart-unit {
    font-size: 10.5px;
    color: var(--mute-2);
    letter-spacing: 0;
  }

  /* 막대 + 스파크라인 행 */
  .org-bar-row {
    display: grid;
    grid-template-columns: 100px 1fr 96px 90px;
    gap: 14px;
    align-items: center;
    padding: 10px 0;
    border-bottom: 1px solid var(--line-soft);
    position: relative;
  }
  .org-bar-row:last-of-type { border-bottom: none; }

  .org-bar-name {
    font-size: 12.5px;
    font-weight: 700;
    color: var(--fg);
    display: flex;
    align-items: center;
    gap: 6px;
  }
  .org-bar-flag {
    font-size: 9px;
    color: var(--mute-2);
    background: var(--white);
    border: 1px solid var(--line);
    padding: 1px 4px;
    border-radius: 3px;
    letter-spacing: 0;
    font-weight: 700;
  }

  /* 막대 자체 */
  .org-bar-track {
    position: relative;
    height: 24px;
    background: rgba(var(--ink-rgb), 0.04);
    border-radius: 5px;
    overflow: hidden;
  }
  .org-bar-fill {
    height: 100%;
    background: linear-gradient(90deg, var(--accent), rgba(var(--mint-rgb), 0.7));
    border-radius: 5px;
    width: 0;
    transition: width 1s cubic-bezier(0.22, 1, 0.36, 1);
  }
  .org-bar-row.in-view .org-bar-fill {
    width: var(--bar-w, 50%);
  }
  .org-bar-fill.alt {
    background: linear-gradient(90deg, var(--c-figure), rgba(2, 132, 199, 0.7));
  }

  /* 스파크라인 (작은 SVG) */
  .org-bar-spark {
    height: 28px;
    display: flex;
    align-items: center;
  }
  .org-bar-spark svg {
    width: 100%;
    height: 100%;
    overflow: visible;
  }
  .org-bar-spark path {
    fill: none;
    stroke: var(--mute-2);
    stroke-width: 1.5;
    stroke-linecap: round;
    stroke-linejoin: round;
    opacity: 0.7;
    transition: stroke-dashoffset 1.2s ease 0.3s;
  }
  .org-bar-spark .spark-current-dot {
    fill: var(--accent);
    stroke: var(--white);
    stroke-width: 1.5;
    opacity: 0;
    transition: opacity 0.4s ease 1.0s;
  }
  .org-bar-row.in-view .spark-current-dot {
    opacity: 1;
  }

  /* 현재 값 (큰 글씨) */
  .org-bar-value {
    text-align: right;
    font-size: 16px;
    font-weight: 800;
    color: var(--fg);
    letter-spacing: -0.02em;
    line-height: 1.1;
  }
  .org-bar-value-unit {
    font-size: 10.5px;
    font-weight: 600;
    color: var(--muted);
    margin-left: 1px;
    letter-spacing: 0;
  }

  /* x축 라벨 (분기) */
  .org-chart-xaxis {
    display: grid;
    grid-template-columns: 100px 1fr 96px 90px;
    gap: 14px;
    padding-top: 8px;
    border-top: 1px dashed var(--line);
    margin-top: 4px;
  }
  .org-chart-xaxis-empty { }
  .org-chart-xaxis-bar {
    display: flex;
    justify-content: space-between;
    font-size: 9.5px;
    color: var(--mute-2);
    letter-spacing: 0;
  }
  .org-chart-xaxis-spark {
    display: flex;
    justify-content: space-between;
    font-size: 9.5px;
    color: var(--mute-2);
    letter-spacing: 0;
  }

  /* 시연 셀(53.7조) 강조 */
  .org-bar-row.trace-cell {
    cursor: pointer;
    border-radius: 6px;
    padding: 10px 8px;
    margin: 0 -8px;
    transition: background 0.4s ease, box-shadow 0.4s ease;
  }
  .org-bar-row.trace-cell::after {
    content: '↗';
    position: absolute;
    top: 8px;
    right: 4px;
    font-size: 11px;
    color: var(--accent);
    opacity: 0;
    transition: opacity 0.3s ease;
    font-weight: 700;
  }
  .org-bar-row.trace-cell:hover::after,
  .org-bar-row.trace-cell.demo-active::after {
    opacity: 1;
  }
  .org-bar-row.trace-cell.demo-pulse {
    background: var(--accent-softer);
    animation: cell-pulse 1.8s ease-out;
  }
  .org-bar-row.trace-cell.demo-active {
    background: var(--accent-softer);
    box-shadow: 0 0 0 2px var(--accent-soft);
  }

  /* Evidence 박스 (메인 차트 아래 펼침) */
  .org-chart-evidence {
    max-height: 0;
    opacity: 0;
    overflow: hidden;
    background: var(--accent-softer);
    border: 1px solid var(--accent-soft);
    border-radius: 8px;
    margin-top: 0;
    transition: max-height 0.5s cubic-bezier(0.22, 1, 0.36, 1),
                opacity 0.4s ease 0.15s,
                margin-top 0.4s ease,
                padding 0.4s ease;
    padding: 0 16px;
  }
  .org-chart-evidence.open {
    max-height: 320px;
    opacity: 1;
    margin-top: 14px;
    padding: 14px 16px;
  }
  .org-chart-evidence-head {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 10px;
    flex-wrap: wrap;
  }
  .org-chart-evidence-id {
    background: var(--accent);
    color: var(--white);
    border-radius: 4px;
    padding: 3px 8px;
    font-size: 10.5px;
    font-weight: 800;
    letter-spacing: 0;
  }
  .org-chart-evidence-source {
    font-size: 10.5px;
    color: var(--fg-soft);
    background: var(--white);
    border: 1px solid var(--line);
    padding: 2px 7px;
    border-radius: 3px;
    font-weight: 600;
  }
  .org-chart-evidence-date {
    font-size: 10.5px;
    color: var(--mute-2);
  }
  .org-chart-evidence-close {
    margin-left: auto;
    background: transparent;
    border: 1px solid var(--line);
    color: var(--muted);
    border-radius: 4px;
    padding: 3px 9px;
    font-size: 11px;
    font-weight: 600;
    cursor: pointer;
    font-family: inherit;
    transition: all 0.15s ease;
  }
  .org-chart-evidence-close:hover {
    background: var(--fg);
    border-color: var(--fg);
    color: var(--white);
  }
  .org-chart-evidence-doc {
    font-size: 12.5px;
    font-weight: 700;
    color: var(--fg);
    line-height: 1.4;
    margin-bottom: 8px;
    letter-spacing: -0.01em;
  }
  .org-chart-evidence-sentence {
    background: var(--white);
    border: 1px solid var(--accent-soft);
    border-left: 3px solid var(--accent);
    border-radius: 0 5px 5px 0;
    padding: 9px 12px;
    font-size: 12px;
    color: var(--fg-soft);
    line-height: 1.6;
    margin-bottom: 8px;
  }
  .org-chart-evidence-sentence-id {
    font-size: 9.5px;
    color: var(--accent);
    font-weight: 700;
    margin-bottom: 4px;
    letter-spacing: 0;
  }
  .org-chart-evidence-meta {
    display: flex;
    align-items: center;
    gap: 6px;
    flex-wrap: wrap;
    font-size: 10.5px;
  }
  .org-chart-evidence-meta-tag {
    background: var(--white);
    border: 1px solid var(--line);
    padding: 2px 7px;
    border-radius: 3px;
    color: var(--muted);
    letter-spacing: 0;
  }
  .org-chart-evidence-link {
    margin-left: auto;
    color: var(--accent);
    text-decoration: none;
    font-size: 11px;
    font-weight: 600;
  }
  .org-chart-evidence-link:hover { text-decoration: underline; }

  /* 다른 단위 영역 */
  .org-chart-other {
    margin-top: 14px;
    padding-top: 12px;
    border-top: 1px dashed var(--line);
    opacity: 0.65;
  }
  .org-chart-other-label {
    font-size: 9.5px;
    letter-spacing: 0;
    color: var(--mute-2);
    font-weight: 700;
    margin-bottom: 6px;
  }
  .org-chart-other-list {
    display: flex;
    flex-wrap: wrap;
    gap: 14px;
  }
  .org-chart-other-item {
    display: flex;
    align-items: baseline;
    gap: 5px;
    font-size: 10.5px;
    color: var(--muted);
  }
  .org-chart-other-name {
    font-weight: 700;
    color: var(--fg-soft);
    font-size: 11px;
  }
  .org-chart-other-value {
    color: var(--muted);
  }
  .org-chart-other-na {
    color: var(--mute-2);
    opacity: 0.7;
    font-style: italic;
    font-size: 10px;
  }

  /* 보조 미니 카드 (가로 3개) */
  .org-mini-row {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 12px;
  }
  .org-mini-card {
    background: var(--white);
    border: 1px solid var(--line);
    border-radius: 10px;
    padding: 14px 16px;
    opacity: 0;
    transform: translateY(8px);
    transition: opacity 0.6s ease, transform 0.6s ease;
  }
  .org-mini-card.in-view {
    opacity: 1;
    transform: translateY(0);
  }
  .org-mini-header {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 8px;
    margin-bottom: 10px;
    flex-wrap: wrap;
  }
  .org-mini-title {
    font-size: 12px;
    font-weight: 700;
    color: var(--fg);
    letter-spacing: -0.01em;
    display: flex;
    align-items: center;
    gap: 6px;
  }
  .org-mini-title::before {
    content: '';
    width: 4px;
    height: 10px;
    background: var(--accent);
    border-radius: 2px;
  }
  .org-mini-meta {
    font-size: 9px;
    color: var(--mute-2);
    letter-spacing: 0;
    font-weight: 600;
    display: inline-flex;
    align-items: center;
    gap: 4px;
  }
  .org-mini-meta-dot {
    width: 5px;
    height: 5px;
    border-radius: 50%;
    background: var(--accent);
    opacity: 0.8;
    display: inline-block;
  }

  /* 액션 라인 카드 (공급망 대응) */
  .org-mini-actions {
    display: flex;
    flex-direction: column;
    gap: 6px;
  }
  .org-mini-action-row {
    display: grid;
    grid-template-columns: 48px 1fr;
    gap: 7px;
    align-items: baseline;
    font-size: 10px;
    padding: 3px 0;
    border-bottom: 1px dashed var(--line-soft);
  }
  .org-mini-action-row:last-child {
    border-bottom: none;
  }
  .org-mini-action-name {
    color: var(--fg-soft);
    font-weight: 600;
  }
  .org-mini-action-text {
    color: var(--fg);
    font-weight: 500;
    line-height: 1.4;
    font-size: 10.5px;
  }

  /* 보조 카드 evidence popover (mini) */
  .org-mini-bar-row.trace-mini {
    cursor: pointer;
    border-radius: 4px;
    padding: 2px 0;
    margin: -2px 0;
    transition: background 0.3s ease;
    position: relative;
  }
  .org-mini-bar-row.trace-mini.demo-pulse {
    background: rgba(var(--mint-rgb), 0.08);
    animation: cell-pulse 1.8s ease-out;
  }
  .org-mini-bar-row.trace-mini.demo-active {
    background: rgba(var(--mint-rgb), 0.06);
  }
  .org-mini-evidence {
    max-height: 0;
    opacity: 0;
    overflow: hidden;
    transition: max-height 0.45s cubic-bezier(0.22, 1, 0.36, 1),
                opacity 0.35s ease 0.1s,
                margin-top 0.35s ease,
                padding 0.35s ease;
    margin-top: 0;
    padding: 0 8px;
    background: var(--accent-softer);
    border: 1px solid var(--accent-soft);
    border-radius: 6px;
  }
  .org-mini-evidence.open {
    max-height: 180px;
    opacity: 1;
    margin-top: 8px;
    padding: 8px 10px;
  }
  .org-mini-evidence-head {
    display: flex;
    align-items: center;
    gap: 5px;
    margin-bottom: 5px;
    flex-wrap: wrap;
  }
  .org-mini-evidence-id {
    background: var(--accent);
    color: var(--white);
    border-radius: 3px;
    padding: 1px 6px;
    font-size: 9px;
    font-weight: 800;
  }
  .org-mini-evidence-source {
    font-size: 9px;
    color: var(--fg-soft);
    background: var(--white);
    border: 1px solid var(--line);
    padding: 1px 5px;
    border-radius: 3px;
    font-weight: 600;
  }
  .org-mini-evidence-close {
    margin-left: auto;
    background: transparent;
    border: 1px solid var(--line);
    color: var(--muted);
    border-radius: 3px;
    padding: 1px 6px;
    font-size: 9px;
    font-weight: 600;
    cursor: pointer;
    font-family: inherit;
  }
  .org-mini-evidence-close:hover {
    background: var(--fg);
    border-color: var(--fg);
    color: var(--white);
  }
  .org-mini-evidence-sentence {
    font-size: 10px;
    color: var(--fg-soft);
    line-height: 1.45;
  }
  .org-mini-evidence-sentence strong {
    color: var(--fg);
  }
  .org-mini-bars {
    display: flex;
    flex-direction: column;
    gap: 5px;
  }
  .org-mini-bar-row {
    display: grid;
    grid-template-columns: 48px 1fr;
    gap: 7px;
    align-items: center;
    font-size: 10px;
  }
  .org-mini-bar-name {
    color: var(--fg-soft);
    font-weight: 600;
  }
  .org-mini-bar-track {
    height: 13px;
    background: rgba(var(--ink-rgb), 0.04);
    border-radius: 3px;
    position: relative;
    overflow: hidden;
  }
  .org-mini-bar-fill {
    height: 100%;
    background: var(--accent);
    border-radius: 3px;
    width: 0;
    transition: width 0.9s cubic-bezier(0.22, 1, 0.36, 1) 0.2s;
    opacity: 0.85;
  }
  .org-mini-card.in-view .org-mini-bar-fill {
    width: var(--bar-w, 50%);
  }
  .org-mini-bar-value {
    position: absolute;
    right: 5px;
    top: 50%;
    transform: translateY(-50%);
    font-size: 9px;
    color: var(--fg);
    font-weight: 700;
    letter-spacing: 0;
    pointer-events: none;
  }
  .org-mini-bar-na {
    font-size: 9px;
    color: var(--mute-2);
    opacity: 0.55;
    padding-left: 6px;
    display: block;
    line-height: 13px;
  }

  @media (max-width: 760px) {
    .org-mini-row { grid-template-columns: 1fr; }
    .org-bar-row { grid-template-columns: 80px 1fr 80px; }
    .org-bar-spark { display: none; }
    .org-chart-xaxis { grid-template-columns: 80px 1fr 80px; }
    .org-chart-xaxis-spark { display: none; }
  }

  /* ====== 챕터 5-1: 단일 정책 문서 분석 ====== */

  /* 메타 행 */
  .pol-meta-row {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
    padding-bottom: 12px;
    margin-bottom: 14px;
    border-bottom: 1px solid var(--line-soft);
  }
  .pol-meta-tag {
    padding: 3px 8px;
    background: var(--bg-soft);
    border: 1px solid var(--line);
    border-radius: 4px;
    font-size: 10px;
    color: var(--muted);
    font-weight: 600;
    letter-spacing: 0;
  }
  .pol-meta-tag.cat {
    background: var(--c-relation-soft);
    border-color: var(--c-relation-bd);
    color: var(--c-relation);
  }
  .pol-meta-date {
    font-size: 11px;
    color: var(--mute-2);
    letter-spacing: 0;
  }
  .pol-meta-source {
    margin-left: auto;
    font-size: 11px;
    color: var(--accent);
    font-weight: 500;
    text-decoration: none;
  }

  /* 문서 제목 */
  .pol-doc-title {
    font-size: 18px;
    font-weight: 800;
    color: var(--fg);
    letter-spacing: -0.02em;
    line-height: 1.35;
    margin-bottom: 4px;
  }
  .pol-doc-title-en {
    font-size: 12px;
    color: var(--muted);
    font-style: italic;
    line-height: 1.4;
    margin-bottom: 14px;
  }

  /* AID 자동분석 안내 */
  .pol-ai-notice {
    background: linear-gradient(90deg, var(--accent-softer), transparent);
    border-left: 2px solid var(--accent);
    padding: 8px 12px;
    border-radius: 0 6px 6px 0;
    margin-bottom: 14px;
    font-size: 11.5px;
    color: var(--fg-soft);
    line-height: 1.45;
  }
  .pol-ai-notice::before {
    content: '✦';
    color: var(--accent);
    margin-right: 6px;
    font-weight: 700;
  }

  /* 섹션 라벨 */
  .pol-sec-label {
    font-size: 10px;
    letter-spacing: 0;
    color: var(--muted);
    font-weight: 700;
    margin-bottom: 8px;
    padding-bottom: 6px;
    border-bottom: 1px solid var(--line-soft);
  }
  .pol-sec {
    margin-bottom: 18px;
  }
  .pol-sec:last-child { margin-bottom: 0; }

  /* 전체 개요 */
  .pol-overview {
    background: var(--bg-tech);
    border: 1px solid var(--line);
    border-radius: 8px;
    padding: 12px 14px;
  }
  .pol-overview-title {
    font-size: 13.5px;
    font-weight: 700;
    color: var(--fg);
    margin-bottom: 6px;
    letter-spacing: -0.01em;
  }
  .pol-overview-body {
    font-size: 12px;
    color: var(--fg-soft);
    line-height: 1.6;
  }

  /* 핵심 주장 (강조 박스) */
  .pol-claim {
    background: rgba(var(--concern-rgb), 0.06);
    border: 1px solid var(--c-quote-bd);
    border-left: 3px solid var(--c-quote);
    border-radius: 0 6px 6px 0;
    padding: 12px 14px;
    font-size: 12.5px;
    color: var(--fg);
    line-height: 1.6;
    font-weight: 500;
  }

  /* 핵심 수치 */
  .pol-figs {
    display: flex;
    flex-direction: column;
    gap: 6px;
  }
  .pol-fig {
    display: flex;
    align-items: baseline;
    gap: 10px;
    padding: 8px 12px;
    background: var(--c-figure-soft);
    border: 1px solid var(--c-figure-bd);
    border-radius: 6px;
  }
  .pol-fig-num {
    font-size: 13px;
    font-weight: 800;
    color: var(--c-figure);
    letter-spacing: -0.01em;
    flex-shrink: 0;
  }
  .pol-fig-label {
    font-size: 11.5px;
    color: var(--fg-soft);
    line-height: 1.4;
  }

  /* 근거·발견 테이블 */
  .pol-table-wrap {
    border: 1px solid var(--line);
    border-radius: 8px;
    overflow: hidden;
  }
  .pol-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 11.5px;
  }
  .pol-table thead th {
    background: var(--bg-soft);
    padding: 8px 10px;
    text-align: left;
    border-bottom: 1px solid var(--line);
    font-size: 9.5px;
    letter-spacing: 0;
    color: var(--mute-2);
    font-weight: 700;
  }
  .pol-table tbody td {
    padding: 9px 10px;
    border-bottom: 1px solid var(--line-soft);
    vertical-align: top;
    line-height: 1.45;
    color: var(--fg-soft);
  }
  .pol-table tbody tr:last-child td { border-bottom: none; }
  .pol-table .pol-row-num {
    color: var(--mute-2);
    font-size: 10px;
    font-weight: 700;
    width: 22px;
  }
  .pol-table .pol-row-key {
    font-weight: 700;
    color: var(--fg);
    font-size: 12px;
    width: 130px;
  }

  /* 정책 권고 (보라 톤) */
  .pol-recs {
    display: flex;
    flex-direction: column;
    gap: 8px;
  }
  .pol-rec {
    background: var(--c-relation-soft);
    border: 1px solid var(--c-relation-bd);
    border-radius: 6px;
    padding: 10px 12px;
  }
  .pol-rec-head {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 4px;
    flex-wrap: wrap;
  }
  .pol-rec-num {
    width: 18px; height: 18px;
    background: var(--c-relation);
    color: var(--white);
    border-radius: 3px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 10px;
    font-weight: 800;
    flex-shrink: 0;
  }
  .pol-rec-title {
    font-size: 12.5px;
    font-weight: 700;
    color: var(--fg);
    letter-spacing: -0.01em;
  }
  .pol-rec-priority {
    margin-left: auto;
    font-size: 9.5px;
    font-weight: 700;
    padding: 2px 6px;
    border-radius: 3px;
    letter-spacing: 0;
  }
  .pol-rec-priority.high {
    background: rgba(var(--sig-negative-rgb), 0.12);
    color: var(--sig-negative);
  }
  .pol-rec-priority.mid {
    background: rgba(var(--concern-rgb), 0.14);
    color: var(--c-quote);
  }
  .pol-rec-target {
    font-size: 10.5px;
    color: var(--c-relation);
    font-weight: 600;
    margin-bottom: 4px;
  }
  .pol-rec-body {
    font-size: 11.5px;
    color: var(--fg-soft);
    line-height: 1.5;
  }

  /* 향후 전망 (두 박스) */
  .pol-outlook {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 8px;
  }
  .pol-outlook-box {
    border: 1px solid var(--line);
    border-radius: 8px;
    padding: 12px;
  }
  .pol-outlook-box.original {
    background: var(--bg-tech);
  }
  .pol-outlook-box.aid {
    background: linear-gradient(180deg, var(--accent-softer), var(--white));
    border-color: var(--accent-soft);
  }
  .pol-outlook-label {
    font-size: 9.5px;
    letter-spacing: 0;
    color: var(--muted);
    font-weight: 700;
    margin-bottom: 6px;
  }
  .pol-outlook-box.aid .pol-outlook-label {
    color: var(--accent);
  }
  .pol-outlook-body {
    font-size: 11.5px;
    color: var(--fg-soft);
    line-height: 1.55;
  }

  /* ====== 04 섹션: AI Layer for Knowledge Workers ====== */
  .users-section {
    width: min(1180px, calc(100% - 40px));
    margin: 0 auto;
    padding: 80px 0 60px;
    border-top: 1px solid var(--line);
  }
  /* users-section 에서 section-head (struct-intel 과 동일 패턴) 사용:
     h2 왼쪽, .section-desc 오른쪽 정렬. */
  .users-section .section-head {
    margin-bottom: 56px;
  }
  .users-section .section-head h2 .accent {
    color: var(--accent);
  }
  .users-head .section-lead strong {
    color: var(--fg);
    font-weight: 600;
  }

  /* 배포 옵션 행 (3컬럼) */
  /* deploy 카드 — struct-intel-card (기업·산업·정책) 와 동일한 톤:
     큰 padding · radius, 큰 제목, hairline border-top 으로 설명 분리.
     좌상단 SVG 아이콘은 mint 톤 원형 배경 위에 line-icon. */
  .deploy-row {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 20px;
  }
  .deploy-col {
    background: var(--white);
    border: 1px solid var(--line);
    border-radius: 24px;
    padding: 28px;
    display: flex;
    flex-direction: column;
    transition: background 0.25s ease, transform 0.2s ease, box-shadow 0.2s ease;
  }
  .deploy-col:hover {
    background: var(--accent-softer);
    transform: translateY(-2px);
    box-shadow: 0 14px 32px rgba(var(--ink-rgb), 0.06);
  }
  .deploy-col-icon {
    width: 60px;
    height: 60px;
    border-radius: 16px;
    background: var(--accent-soft);
    color: var(--accent);
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 24px;
  }
  .deploy-col-icon svg {
    width: 36px;
    height: 36px;
  }
  .deploy-col h3 {
    font-family: inherit;
    font-size: 24px;
    font-weight: 700;
    color: var(--fg);
    letter-spacing: -0.02em;
    line-height: 1.25;
    margin: 0 0 18px;
  }
  .deploy-col p {
    margin: 0;
    margin-top: auto;
    padding-top: 20px;
    border-top: 1px solid var(--line);
    font-size: 14px;
    font-weight: 500;
    color: var(--fg);
    letter-spacing: -0.005em;
    line-height: 1.55;
  }
  .deploy-col p strong {
    color: var(--fg);
    font-weight: 700;
  }

  /* 하단 신뢰 포인트 — 3 check item 을 가운데 정렬 */
  .deploy-checks {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 48px;
    margin-top: 40px;
    padding-top: 28px;
    border-top: 1px solid var(--line);
  }
  .deploy-check {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    font-size: 17px;
    font-weight: 500;
    color: var(--fg);
    letter-spacing: -0.005em;
  }
  .deploy-check svg {
    width: 22px;
    height: 22px;
    color: var(--accent);
    flex-shrink: 0;
  }
  @media (max-width: 900px) {
    .users-head { grid-template-columns: 1fr; gap: 16px; }
    .deploy-row { grid-template-columns: 1fr; }
  }

  /* ====== Traceability — 풀-블리드 다크 띠 (Chapter 2 직후) ====== */

  /* 풀-블리드 다크 띠 */
  .traceability-band {
    width: 100vw;
    max-width: 100vw;
    position: relative;
    left: 50%;
    right: 50%;
    margin-left: -50vw;
    margin-right: -50vw;
    margin-top: 56px;
    margin-bottom: 56px;
    padding: 0;
  }
  .traceability-band-inner {
    background: var(--fg);
    color: var(--white);
    padding: 72px 48px;
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    gap: 12px;
    position: relative;
    overflow: hidden;
  }
  /* 좌우 큰 dash 라인 (장식) */
  .traceability-band-inner::before,
  .traceability-band-inner::after {
    content: '';
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: 80px;
    height: 1px;
    background: var(--accent);
    opacity: 0.5;
  }
  .traceability-band-inner::before { left: 0; }
  .traceability-band-inner::after { right: 0; }

  .traceability-band-eyebrow {
    font-size: 11px;
    color: var(--accent);
    letter-spacing: 0;
    font-weight: 700;
    margin-bottom: 4px;
  }
  .traceability-band-text {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 14px;
    max-width: 800px;
  }
  .traceability-band-ko {
    font-size: clamp(24px, 3.6vw, 38px);
    font-weight: 700;
    letter-spacing: -0.03em;
    line-height: 1.25;
    color: var(--white);
  }
  .traceability-band-ko strong {
    color: var(--accent);
    font-weight: 700;
  }
  .traceability-band-en {
    font-size: 14px;
    color: var(--accent);
    letter-spacing: 0;
    font-weight: 500;
    opacity: 0.95;
  }
  .traceability-band-tail {
    font-size: 12px;
    color: rgba(255, 255, 255, 0.55);
    margin-top: 6px;
    letter-spacing: -0.005em;
  }
  @media (max-width: 760px) {
    .traceability-band-inner { padding: 48px 24px; }
    .traceability-band-inner::before,
    .traceability-band-inner::after { width: 30px; }
  }

  /* ====== 페르소나 entry 미니 섹션 (v1.1.0) ====== */
  .persona-entry {
    width: min(1180px, calc(100% - 40px));
    margin: 24px auto 40px;
  }
  /* AI Layer 큰 헤드 (entry 위) */
  .persona-entry-main {
    display: grid;
    grid-template-columns: 240px 1fr;
    gap: 52px;
    align-items: end;
    margin-bottom: 28px;
    padding-bottom: 22px;
    border-bottom: 1px solid var(--line);
  }
  .persona-entry-main-label {
    font-size: 12px;
    color: var(--accent);
    letter-spacing: 0;
    font-weight: 700;
  }
  .persona-entry-main-h2 {
    font-size: clamp(28px, 3.6vw, 40px);
    line-height: 1.15;
    letter-spacing: -0.035em;
    font-weight: 700;
    color: var(--fg);
    max-width: 720px;
  }
  .persona-entry-main-h2 .accent {
    color: var(--accent);
  }
  .persona-entry-head {
    display: flex;
    align-items: baseline;
    gap: 14px;
    margin-bottom: 16px;
    flex-wrap: wrap;
  }
  .persona-entry-question {
    font-size: 13px;
    font-weight: 700;
    color: var(--accent);
    letter-spacing: 0;
  }
  .persona-entry-en {
    font-size: 13px;
    color: var(--fg);
    letter-spacing: -0.005em;
    font-weight: 500;
  }
  .persona-entry-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 10px;
  }
  .persona-entry-card {
    background: var(--white);
    border: 1px solid var(--line);
    border-radius: 10px;
    padding: 14px 14px 12px;
    display: flex;
    flex-direction: column;
    gap: 6px;
    cursor: default;
    text-decoration: none;
    color: inherit;
    transition: border-color 0.2s ease, box-shadow 0.2s ease;
  }
  .persona-entry-card:hover {
    border-color: var(--accent-soft);
    box-shadow: 0 8px 20px rgba(var(--ink-rgb), 0.04);
  }
  .persona-entry-name {
    font-size: 14px;
    font-weight: 700;
    color: var(--fg);
    letter-spacing: -0.015em;
    line-height: 1.3;
  }
  .persona-entry-desc {
    font-size: 11.5px;
    color: var(--muted);
    line-height: 1.45;
    margin-bottom: 4px;
  }
  /* 챕터 칩 — 페르소나 카드 내부 */
  .persona-entry-chapter-chips {
    display: flex;
    flex-wrap: wrap;
    gap: 4px;
    margin-top: auto;
    padding-top: 6px;
  }
  .persona-entry-chip-link {
    font-size: 11px;
    padding: 3px 9px;
    background: var(--accent-softer);
    color: var(--accent);
    border: 1px solid var(--accent-soft);
    border-radius: 4px;
    font-weight: 600;
    letter-spacing: -0.005em;
    text-decoration: none;
    transition: all 0.15s ease;
    cursor: pointer;
  }
  .persona-entry-chip-link:hover {
    background: var(--accent);
    color: var(--white);
    border-color: var(--accent);
  }
  .persona-entry-chip-link.aux {
    background: var(--bg-soft);
    color: var(--muted);
    border-color: var(--line);
    font-weight: 500;
  }
  .persona-entry-chip-link.aux:hover {
    background: var(--fg-soft);
    color: var(--white);
    border-color: var(--fg-soft);
  }
  .persona-entry-chip-link.api {
    background: var(--fg);
    color: var(--white);
    border-color: var(--fg);
    font-family: var(--mono);
    font-size: 10.5px;
    letter-spacing: 0.04em;
  }
  @media (max-width: 900px) {
    .persona-entry-main { grid-template-columns: 1fr; gap: 12px; align-items: start; }
    .persona-entry-grid { grid-template-columns: 1fr 1fr; }
  }
  @media (max-width: 600px) {
    .persona-entry-grid { grid-template-columns: 1fr; }
  }

  /* ====== Structured Intelligence — replaces AI Layer block ====== */
  /* 폭은 connectionary.css 의 .page 와 동일하게 맞춤 */
  .struct-intel {
    width: min(1180px, calc(100% - 40px));
    /* bottom margin: 32 → 72 — sticky 트릭이 없어지고 chapters 가 normal
       flow 로 자연스럽게 이어 붙으니, 3-카드 행과 chapter 1 '기업의 시선'
       데모 사이에 호흡을 더 줘서 답답하지 않게. */
    margin: 28px auto 72px;
  }
  /* 타이틀(section-head)과 카드 사이 — 56 → 32 로 살짝 좁힘. */
  .struct-intel .section-head {
    margin-bottom: 32px;
  }
  .struct-intel-h2 {
    font-size: clamp(28px, 3.8vw, 44px);
    line-height: 1.18;
    letter-spacing: -0.035em;
    font-weight: 700;
    color: var(--fg);
  }
  .struct-intel-h2 .accent {
    color: var(--accent);
  }
  .struct-intel-h2 .light {
    font-weight: 500;
    color: var(--fg-soft);
  }

  /* 3 컬럼: 분석 도메인 */
  .struct-intel-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 20px;
    /* 40 → 16 — 카드와 chapters 데모 사이 거리 단축. */
    margin-bottom: 16px;
  }
  .struct-intel-card {
    background: var(--white);
    border: 1px solid var(--line);
    border-radius: 24px;
    padding: 28px;
    display: flex;
    flex-direction: column;
    transition: background 0.25s ease, transform 0.2s ease, box-shadow 0.2s ease;
  }
  /* 클릭하면 해당 chapter 데모로 smooth-scroll. 카드 자체가 link 역할이라
     pointer cursor 와 focus 링을 줘서 키보드 탐색도 가능하게. */
  .struct-intel-card[data-scroll-target] {
    cursor: pointer;
  }
  .struct-intel-card[data-scroll-target]:focus-visible {
    outline: 2px solid var(--accent);
    outline-offset: 2px;
  }
  /* sticky header (74px) 가 chapter 상단을 가리지 않게 scroll-margin-top 부여. */
  .chapter[id^="chapter-"] {
    scroll-margin-top: 90px;
  }
  .struct-intel-card:hover {
    background: var(--accent-softer);
  }
  .struct-intel-card:hover {
    transform: translateY(-2px);
    box-shadow: 0 14px 32px rgba(var(--ink-rgb), 0.06);
  }
  /* card-title 을 제거하면서 card-num 이 카드의 주 제목 역할을 맡음.
     mono/uppercase 대신 일반 헤딩 톤으로, 사이즈도 키움. */
  .struct-intel-card-num {
    font-family: inherit;
    font-size: 24px;
    letter-spacing: -0.02em;
    color: var(--fg);
    font-weight: 700;
    text-transform: none;
    margin-bottom: 18px;
    line-height: 1.25;
  }
  .struct-intel-card-title {
    font-size: 21px;
    font-weight: 700;
    color: var(--fg);
    letter-spacing: -0.02em;
    line-height: 1.3;
    margin-bottom: 16px;
  }
  .struct-intel-card-list {
    list-style: none;
    padding: 0;
    margin: 0 0 18px;
    display: flex;
    flex-direction: column;
    gap: 7px;
    flex-grow: 1;
  }
  .struct-intel-card-list li {
    font-size: 17px;
    color: var(--fg-soft);
    line-height: 1.55;
    display: flex;
    align-items: flex-start;
    gap: 10px;
  }
  .struct-intel-card-list li::before {
    content: '';
    width: 5px;
    height: 5px;
    background: var(--fg);
    border-radius: 50%;
    flex-shrink: 0;
    margin-top: 0.62em;
  }
  /* 인용문 같은 회색 영역 제거 → 상단 1px 선으로 깔끔하게 구분 */
  .struct-intel-card-hook {
    margin-top: auto;
    padding: 20px 0 0;
    border-top: 1px solid var(--line);
    background: transparent;
    border-left: none;
    font-size: 17px;
    font-weight: 500;
    color: var(--fg);
    letter-spacing: -0.005em;
    line-height: 1.55;
  }
  /* 'THE DIFFERENCE —' 라벨 (mono muted 캡스) */
  .struct-intel-card-hook-label {
    display: block;
    font-size: 10.5px;
    letter-spacing: 0;
    color: var(--muted);
    font-weight: 600;
    margin-bottom: 10px;
  }

  /* foundation-title 안의 <em> 키 단어("다섯 원칙")만 mint 강조 */
  .struct-intel-foundation-title em {
    color: var(--accent);
    font-style: normal;
  }

  /* Common Foundation intro (attrs 위 라벨 + 타이틀) */
  .struct-intel-foundation-intro {
    text-align: center;
    margin: 56px 0 28px;
  }
  /* chapters 데모 뒤에 단독 섹션으로 올 때 — 위쪽 56 + struct-intel 의
     기본 margin-top 28 이 누적되지 않도록 변형 클래스에서 intro 의
     top margin 제거. struct-intel 자체 margin-top 만으로 충분한 거리. */
  .struct-intel--foundation .struct-intel-foundation-intro {
    margin-top: 0;
  }
  .struct-intel--foundation {
    /* sticky scroll-driven 모드를 폐기한 이후로 데모 container 가 viewport
       위로 사라져 있을 일이 없으니 margin-top 은 0. padding-top 은 chapter 3
       와 connector 사이 호흡을 위해 3.5vh. padding-bottom 은 0 까지 떨어뜨려
       5 attribute 카드 (Evidence-backed) 와 다음 섹션 "요약으론 안 되는
       결정의 순간" 사이 거리를 압축. (#impact 쪽 76px top padding 도
       connectionary.css 에서 함께 줄임.) */
    margin-top: 0;
    position: relative;
    padding: 3.5vh 0 0;
  }
  /* === 세로 연결선 (scroll-driven 으로 scaleY 가 자람) ===
     기존 ::before (정적 60px 선) 는 제거하고 별도 element 로 대체. 콘텐츠
     flex flow 안에 한 줄짜리 element 로 들어가서 intro 바로 위에 자리.
     --connector-progress 는 lenses.js 가 스크롤에 따라 0~1 로 업데이트. */
  .struct-intel-foundation-connector {
    display: block;
    margin: 0 auto 36px;
    width: 1px;
    height: 120px;
    background: var(--line);
    transform-origin: top center;
    transform: scaleY(var(--connector-progress, 0));
    /* linear 트랜지션 — 스크롤 위치에 정직하게 따라붙도록 */
    transition: transform 0.12s linear;
  }

  /* === Common Foundation 진입 애니메이션 ===
     scroll progress 가 임계치를 넘으면 lenses.js 가 .is-revealed 추가 →
     intro 와 5개 attribute 가 짧은 stagger 로 등장. */
  .struct-intel--foundation .struct-intel-foundation-intro,
  .struct-intel--foundation .struct-intel-attr {
    opacity: 0;
    transform: translateY(14px);
    transition: opacity 0.45s ease, transform 0.45s ease;
  }
  .struct-intel--foundation.is-revealed .struct-intel-foundation-intro,
  .struct-intel--foundation.is-revealed .struct-intel-attr {
    opacity: 1;
    transform: translateY(0);
  }
  .struct-intel--foundation .struct-intel-foundation-intro { transition-delay: 0s; }
  .struct-intel--foundation .struct-intel-attr:nth-child(1) { transition-delay: 0.14s; }
  .struct-intel--foundation .struct-intel-attr:nth-child(2) { transition-delay: 0.21s; }
  .struct-intel--foundation .struct-intel-attr:nth-child(3) { transition-delay: 0.28s; }
  .struct-intel--foundation .struct-intel-attr:nth-child(4) { transition-delay: 0.35s; }
  .struct-intel--foundation .struct-intel-attr:nth-child(5) { transition-delay: 0.42s; }
  .struct-intel-foundation-label {
    display: inline-flex;
    align-items: center;
    gap: 16px;
    font-size: 13px;
    font-weight: 600;
    letter-spacing: 0;
    color: var(--muted);
    margin-bottom: 18px;
  }
  .struct-intel-foundation-label::before,
  .struct-intel-foundation-label::after {
    content: '';
    width: 40px;
    height: 1px;
    background: var(--line);
  }
  .struct-intel-foundation-title {
    font-size: clamp(28px, 3.4vw, 42px);
    font-weight: 700;
    color: var(--fg);
    letter-spacing: -0.02em;
    line-height: 1.25;
    margin: 0;
  }

  /* attribute pills */
  .struct-intel-attrs {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 10px;
    margin-bottom: 36px;
  }
  .struct-intel-attr {
    background: var(--bg-soft);
    border: 1px solid var(--line);
    border-radius: 16px;
    padding: 22px 16px 24px;
    text-align: center;
    display: flex;
    flex-direction: column;
    align-items: center;
  }
  .struct-intel-attr-num {
    font-size: 12px;
    letter-spacing: 0;
    color: var(--mute-2);
    font-weight: 500;
    margin-bottom: 14px;
  }
  .struct-intel-attr-title {
    font-size: 17px;
    letter-spacing: -0.01em;
    color: var(--fg);
    font-weight: 700;
    margin-bottom: 12px;
  }
  .struct-intel-attr-desc {
    font-size: 15px;
    color: var(--muted);
    line-height: 1.55;
    margin: 0;
  }

  /* 900 → 1024/640 으로 통일된 breakpoint 시스템. struct-intel-grid 는 Phase 2
     에서 이미 처리 (.lenses nesting 안의 미디어 쿼리). 여기서는 Common Foundation
     의 5 attribute pill 만 단계별로 압축. */
  @media (max-width: 1024px) {
    /* tablet: 5 → 3 cols (3+2 wrap). 2 cols (2+2+1) 보다 균형. */
    .struct-intel-attrs { grid-template-columns: repeat(3, 1fr); gap: 8px; }
    /* 마지막 카드가 혼자 자리잡을 때 padding 살짝 줄임. */
    .struct-intel-attr { padding: 18px 14px 20px; }
  }
  @media (max-width: 640px) {
    /* phone: 1 col stack. 카드 패딩 더 컴팩트하게. */
    .struct-intel-attrs { grid-template-columns: 1fr; gap: 8px; margin-bottom: 24px; }
    .struct-intel-attr { padding: 16px 18px 18px; }
    .struct-intel-attr-num { margin-bottom: 8px; }
    .struct-intel-attr-title { margin-bottom: 6px; }
  }

  /* ====== v1.2 변경 — placeholder/na/meta/시연 ====== */

  /* placeholder note (제목 옆 작은 ※) */
  .org-chart-placeholder-note {
    color: var(--mute-2);
    font-size: 10px;
    margin-left: 4px;
    opacity: 0.7;
    font-weight: 500;
  }

  /* placeholder 막대 (다른 단위 환산 - 회색 톤) */
  .org-bar-fill.placeholder {
    background: linear-gradient(90deg, var(--mute-2), rgba(118, 122, 130, 0.5)) !important;
    opacity: 0.7;
  }
  .org-bar-row.placeholder-row .org-bar-value {
    color: var(--muted);
  }
  .org-bar-row.placeholder-row .org-bar-spark path {
    stroke: var(--mute-2);
    opacity: 0.4;
  }

  /* NA 전용 행 (정부기관 등) */
  .org-bar-row.na-row {
    opacity: 0.55;
  }
  .org-bar-na-inline {
    grid-column: 2 / span 2;
    font-size: 11px;
    color: var(--mute-2);
    font-style: italic;
    padding-left: 4px;
  }
  .org-bar-value-na {
    text-align: right;
    font-size: 13px;
    font-weight: 600;
    color: var(--mute-2);
  }

  /* 미니 카드 head (제목 + 메타) */
  .org-mini-head {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 8px;
    margin-bottom: 10px;
    flex-wrap: wrap;
  }
  .org-mini-meta {
    font-size: 9.5px;
    color: var(--mute-2);
    letter-spacing: 0;
    font-weight: 500;
    display: flex;
    align-items: baseline;
    gap: 4px;
    flex-wrap: wrap;
  }
  .org-mini-meta::before {
    content: '';
    display: inline-block;
    width: 5px;
    height: 5px;
    background: var(--accent);
    border-radius: 50%;
    margin-right: 4px;
    transform: translateY(-1px);
  }
  .org-mini-meta-note {
    opacity: 0.7;
  }

  /* 미니 trace cell (매출 시연용) */
  .mini-trace {
    cursor: pointer;
    border-radius: 4px;
    padding: 2px 4px;
    margin: -2px -4px;
    transition: background 0.3s ease;
  }
  .mini-trace.demo-active {
    background: var(--accent-softer);
  }
  .mini-trace::after {
    content: '↗';
    position: absolute;
    right: -10px;
    top: 0;
    font-size: 9px;
    color: var(--accent);
    opacity: 0;
    transition: opacity 0.3s ease;
    font-weight: 700;
  }

  /* 미니 evidence 박스 (매출 카드 아래) */
  .org-mini-evidence {
    max-height: 0;
    opacity: 0;
    overflow: hidden;
    background: var(--accent-softer);
    border: 1px solid var(--accent-soft);
    border-radius: 6px;
    margin-top: 0;
    transition: max-height 0.5s cubic-bezier(0.22, 1, 0.36, 1),
                opacity 0.4s ease 0.15s,
                margin-top 0.4s ease,
                padding 0.4s ease;
    padding: 0 12px;
  }
  .org-mini-evidence.open {
    max-height: 200px;
    opacity: 1;
    margin-top: 10px;
    padding: 10px 12px;
  }
  .org-mini-evidence-head {
    display: flex;
    align-items: center;
    gap: 6px;
    margin-bottom: 7px;
    flex-wrap: wrap;
  }
  .org-mini-evidence-id {
    background: var(--accent);
    color: var(--white);
    border-radius: 3px;
    padding: 2px 6px;
    font-size: 9.5px;
    font-weight: 800;
    letter-spacing: 0;
  }
  .org-mini-evidence-source {
    font-size: 9.5px;
    color: var(--fg-soft);
    background: var(--white);
    border: 1px solid var(--line);
    padding: 1px 6px;
    border-radius: 3px;
    font-weight: 600;
  }
  .org-mini-evidence-close {
    margin-left: auto;
    background: transparent;
    border: 1px solid var(--line);
    color: var(--muted);
    border-radius: 3px;
    padding: 2px 7px;
    font-size: 10px;
    font-weight: 600;
    cursor: pointer;
    font-family: inherit;
    transition: all 0.15s ease;
  }
  .org-mini-evidence-close:hover {
    background: var(--fg);
    border-color: var(--fg);
    color: var(--white);
  }
  .org-mini-evidence-sentence {
    background: var(--white);
    border-left: 2px solid var(--accent);
    border-radius: 0 4px 4px 0;
    padding: 7px 10px;
    font-size: 10.5px;
    color: var(--fg-soft);
    line-height: 1.55;
  }

  /* 보조 미니 그리드 - 2컬럼 */
  .org-mini-row.two {
    grid-template-columns: 1fr 1fr;
  }

  /* ====== v1.3 - 발언 블록 + 여러 출처 표시 ====== */

  /* "+ N건의 다른 출처" 카운터 (head) */
  .org-chart-evidence-more {
    background: rgba(var(--ink-rgb), 0.05);
    color: var(--fg-soft);
    padding: 3px 8px;
    border-radius: 4px;
    font-size: 10px;
    font-weight: 600;
    letter-spacing: 0;
  }

  /* 수치 근거 / 관련 발언 블록 라벨 */
  .org-chart-evidence-block {
    margin-bottom: 10px;
  }
  .org-chart-evidence-block-label {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 10px;
    color: var(--mute-2);
    font-weight: 700;
    letter-spacing: 0;
    margin-bottom: 4px;
  }
  .evidence-block-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 16px;
    height: 16px;
    border-radius: 3px;
    font-size: 10px;
    font-weight: 800;
    color: var(--white);
  }
  .evidence-block-icon.figure {
    background: var(--c-figure);
  }
  .evidence-block-icon.quote {
    background: var(--c-quote);
    font-size: 12px;
    line-height: 1;
    padding-bottom: 2px;
  }

  /* 발언 문장 박스 (amber 톤) */
  .org-chart-evidence-sentence.quote {
    background: rgba(var(--concern-rgb), 0.05);
    border-color: rgba(var(--concern-rgb), 0.25);
    border-left-color: var(--c-quote);
  }
  .org-chart-evidence-sentence.quote .org-chart-evidence-sentence-id {
    color: var(--c-quote);
  }

  /* 다른 출처 영역 (메인 evidence) */
  .org-chart-evidence-sources {
    margin-bottom: 10px;
    padding-top: 4px;
  }
  .org-chart-evidence-sources-label {
    font-size: 9.5px;
    color: var(--mute-2);
    letter-spacing: 0;
    margin-bottom: 6px;
    font-weight: 600;
  }
  .org-chart-evidence-sources-list {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
  }
  .org-chart-evidence-source-chip {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 3px 9px;
    background: var(--white);
    border: 1px solid var(--line);
    border-radius: 4px;
    font-size: 10px;
    transition: all 0.15s ease;
    cursor: pointer;
  }
  .org-chart-evidence-source-chip:hover {
    border-color: var(--accent);
    background: var(--accent-softer);
  }
  .src-chip-id {
    color: var(--accent);
    font-weight: 700;
    letter-spacing: 0;
  }
  .src-chip-name {
    color: var(--fg-soft);
    font-weight: 600;
  }

  /* 미니 evidence - 외 N건 카운터 */
  .org-mini-evidence-more {
    background: rgba(var(--ink-rgb), 0.05);
    color: var(--fg-soft);
    padding: 2px 6px;
    border-radius: 3px;
    font-size: 9px;
    font-weight: 600;
  }

  /* 미니 evidence - 다른 출처 칩 (작게) */
  .org-mini-evidence-sources {
    display: flex;
    flex-wrap: wrap;
    gap: 4px;
    margin-top: 8px;
    padding-top: 7px;
    border-top: 1px dashed var(--accent-soft);
  }
  .org-mini-evidence-source-chip {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 2px 7px;
    background: var(--white);
    border: 1px solid var(--line);
    border-radius: 3px;
    font-size: 9.5px;
    transition: all 0.15s ease;
    cursor: pointer;
  }
  .org-mini-evidence-source-chip:hover {
    border-color: var(--accent);
    background: var(--accent-softer);
  }
  .src-chip-id-mini {
    color: var(--accent);
    font-weight: 700;
    letter-spacing: 0;
  }
  .src-chip-name-mini {
    color: var(--fg-soft);
    font-weight: 600;
  }

  /* evidence max-height 확장 (발언 + 출처 추가로 길어짐) */
  .org-chart-evidence.open {
    max-height: 700px !important;
  }
  .org-mini-evidence.open {
    max-height: 320px !important;
  }

  /* ====== Chapter 3-1: 가치사슬 위 관계 zoom-in (v1.4) ====== */
  .vc-relation-zoom {
    margin-top: 28px;
    padding: 22px 24px;
    background: var(--bg-tech);
    border: 1px solid var(--line);
    border-radius: 10px;
    position: relative;
  }
  .vc-relation-zoom-label {
    font-size: 10px;
    letter-spacing: 0;
    color: var(--accent);
    font-weight: 700;
    margin-bottom: 14px;
    display: flex;
    align-items: center;
    gap: 8px;
  }
  .vc-relation-zoom-label::before {
    content: '⊕';
    font-size: 12px;
    opacity: 0.7;
  }

  /* 두 노드 + 관계 라인 (그리드) */
  .vc-relation-pair {
    display: grid;
    grid-template-columns: 1fr auto 1fr;
    gap: 16px;
    align-items: center;
    margin-bottom: 14px;
  }

  .vc-rel-node {
    background: var(--white);
    border: 1px solid var(--line);
    border-radius: 8px;
    padding: 12px 16px;
    text-align: center;
    transition: border-color 0.6s ease, box-shadow 0.6s ease;
  }
  .vc-rel-node.in-view {
    border-color: var(--accent);
    box-shadow: 0 8px 24px rgba(var(--mint-rgb), 0.12);
  }
  .vc-rel-node-layer {
    font-size: 9.5px;
    letter-spacing: 0;
    color: var(--accent);
    font-weight: 700;
    margin-bottom: 4px;
  }
  .vc-rel-node-name {
    font-size: 16px;
    font-weight: 700;
    color: var(--fg);
    letter-spacing: -0.02em;
    margin-bottom: 2px;
  }
  .vc-rel-node-role {
    font-size: 11px;
    color: var(--muted);
    line-height: 1.4;
  }

  /* 관계 화살표 영역 (가운데) */
  .vc-rel-arrow {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 4px;
    min-width: 140px;
    padding: 0 8px;
    position: relative;
  }
  .vc-rel-arrow-line {
    width: 100%;
    height: 2px;
    background: rgba(var(--ink-rgb), 0.08);
    position: relative;
    border-radius: 1px;
    overflow: hidden;
  }
  .vc-rel-arrow-fill {
    position: absolute;
    inset: 0;
    background: linear-gradient(90deg, var(--accent), rgba(var(--mint-rgb), 0.5));
    transform: scaleX(0);
    transform-origin: left;
    transition: transform 0.9s cubic-bezier(0.22, 1, 0.36, 1) 0.3s;
  }
  .vc-relation-zoom.in-view .vc-rel-arrow-fill {
    transform: scaleX(1);
  }
  .vc-rel-arrow-head {
    position: absolute;
    right: -2px;
    top: 50%;
    transform: translateY(-50%);
    width: 0;
    height: 0;
    border-left: 8px solid var(--accent);
    border-top: 5px solid transparent;
    border-bottom: 5px solid transparent;
    opacity: 0;
    transition: opacity 0.3s ease 1s;
  }
  .vc-relation-zoom.in-view .vc-rel-arrow-head {
    opacity: 1;
  }
  .vc-rel-arrow-label {
    font-size: 12px;
    font-weight: 700;
    color: var(--accent);
    letter-spacing: -0.01em;
    text-align: center;
    margin-bottom: 6px;
  }
  .vc-rel-arrow-type {
    font-size: 9px;
    letter-spacing: 0;
    color: var(--mute-2);
    font-weight: 700;
    margin-top: 6px;
  }

  /* 관계 evidence (zoom-in 안) */
  .vc-rel-evidence {
    margin-top: 14px;
    max-height: 0;
    opacity: 0;
    overflow: hidden;
    background: var(--accent-softer);
    border: 1px solid var(--accent-soft);
    border-radius: 8px;
    padding: 0 16px;
    transition: max-height 0.6s cubic-bezier(0.22, 1, 0.36, 1) 0.5s,
                opacity 0.5s ease 0.7s,
                padding 0.5s ease 0.5s;
  }
  .vc-relation-zoom.in-view .vc-rel-evidence {
    max-height: 400px;
    opacity: 1;
    padding: 14px 16px;
  }
  .vc-rel-evidence-head {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 8px;
    flex-wrap: wrap;
  }
  .vc-rel-evidence-id {
    background: var(--accent);
    color: var(--white);
    border-radius: 4px;
    padding: 3px 8px;
    font-size: 10.5px;
    font-weight: 800;
    letter-spacing: 0;
  }
  .vc-rel-evidence-source {
    font-size: 10.5px;
    color: var(--fg-soft);
    background: var(--white);
    border: 1px solid var(--line);
    padding: 2px 7px;
    border-radius: 3px;
    font-weight: 600;
  }
  .vc-rel-evidence-date {
    font-size: 10.5px;
    color: var(--mute-2);
  }
  .vc-rel-evidence-more {
    background: rgba(var(--ink-rgb), 0.05);
    color: var(--fg-soft);
    padding: 3px 8px;
    border-radius: 4px;
    font-size: 10px;
    font-weight: 600;
    letter-spacing: 0;
  }
  .vc-rel-evidence-doc {
    font-size: 12.5px;
    font-weight: 700;
    color: var(--fg);
    line-height: 1.4;
    margin-bottom: 8px;
    letter-spacing: -0.01em;
  }
  .vc-rel-evidence-sentence {
    background: var(--white);
    border: 1px solid var(--accent-soft);
    border-left: 3px solid var(--accent);
    border-radius: 0 5px 5px 0;
    padding: 9px 12px;
    font-size: 12px;
    color: var(--fg-soft);
    line-height: 1.6;
    margin-bottom: 10px;
  }
  .vc-rel-evidence-sources {
    display: flex;
    align-items: center;
    gap: 6px;
    flex-wrap: wrap;
    padding-top: 6px;
    border-top: 1px dashed var(--accent-soft);
  }
  .vc-rel-evidence-sources-label {
    font-size: 9.5px;
    color: var(--mute-2);
    letter-spacing: 0;
    font-weight: 600;
  }
  .vc-rel-evidence-source-chip {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 2px 7px;
    background: var(--white);
    border: 1px solid var(--line);
    border-radius: 3px;
    font-size: 10px;
    transition: all 0.15s ease;
    cursor: pointer;
  }
  .vc-rel-evidence-source-chip:hover {
    border-color: var(--accent);
    background: var(--accent-softer);
  }
  .vc-rel-evidence-source-chip .src-id {
    color: var(--accent);
    font-weight: 700;
    letter-spacing: 0;
  }
  .vc-rel-evidence-source-chip .src-name {
    color: var(--fg-soft);
    font-weight: 600;
  }

  /* 가치사슬 → 타임라인 bridge (수직 점선 트랙 v1.6) */
  .vc-flow-bridge {
    margin-top: 22px;
    padding: 18px 20px 22px;
    background: linear-gradient(180deg,
      var(--accent-softer) 0%,
      var(--accent-softer) 60%,
      transparent 100%);
    border: 1px dashed var(--accent-soft);
    border-bottom: none;
    border-radius: 8px 8px 0 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;
    text-align: center;
    position: relative;
  }
  .vc-flow-bridge-label {
    font-size: 10px;
    color: var(--accent);
    letter-spacing: 0;
    font-weight: 700;
  }
  .vc-flow-bridge-text {
    font-size: 13px;
    color: var(--fg);
    line-height: 1.5;
    max-width: 580px;
  }
  .vc-flow-bridge-text strong {
    color: var(--accent);
    font-weight: 700;
  }
  /* 점선이 박스 아래로 흘러내림 */
  .vc-flow-bridge::after {
    content: '';
    position: absolute;
    left: 50%;
    bottom: -56px;
    transform: translateX(-50%);
    width: 2px;
    height: 56px;
    background-image: linear-gradient(180deg, var(--accent) 50%, transparent 50%);
    background-size: 2px 8px;
    background-repeat: repeat-y;
    opacity: 0.6;
  }

  /* Ch3-2 카드 상단 — 점선이 들어오는 자리 */
  .ts-rel-track-in {
    margin: 0 auto 8px;
    width: 2px;
    height: 24px;
    background-image: linear-gradient(180deg, var(--accent) 50%, transparent 50%);
    background-size: 2px 8px;
    background-repeat: repeat-y;
    opacity: 0.6;
  }
  .ts-rel-track-arrow {
    text-align: center;
    color: var(--accent);
    font-size: 14px;
    margin-bottom: 12px;
    line-height: 1;
    opacity: 0.75;
  }

  @media (max-width: 760px) {
    .vc-relation-pair { grid-template-columns: 1fr; }
    .vc-rel-arrow { min-width: auto; padding: 8px 0; }
    .vc-rel-arrow-line { display: none; }
  }

  /* 타임라인 — Apple 관련 이벤트 강조 (위 zoom-in 관계와 직결) */
  .ts-issue-event.highlight {
    border-color: var(--accent) !important;
    background: linear-gradient(135deg, var(--accent-softer), var(--white) 70%) !important;
    box-shadow: 0 10px 28px rgba(var(--mint-rgb), 0.12);
    position: relative;
  }
  .ts-issue-event.highlight::before {
    content: '↑ 위 관계의 흐름';
    position: absolute;
    top: -12px;
    left: 14px;
    background: var(--accent);
    color: var(--white);
    padding: 3px 9px;
    border-radius: 4px;
    font-size: 9.5px;
    font-weight: 700;
    letter-spacing: 0;
    white-space: nowrap;
  }

  /* ====== v1.5 — 가치사슬 칩 펄스 + Zoom-in 연결 SVG ====== */

  /* 가치사슬 카드 본문을 감싸는 영역 (SVG 오버레이용) */
  .vc-flow-wrapper {
    position: relative;
  }

  /* 가치사슬 칩 자체에 펄스 + 강조 */
  .vc-chip.zoom-target {
    background: var(--accent) !important;
    color: var(--white) !important;
    border-color: var(--accent) !important;
    font-weight: 700;
    position: relative;
    z-index: 2;
    box-shadow: 0 0 0 0 rgba(var(--mint-rgb), 0);
    animation: chip-pulse 2.4s ease-out infinite;
  }
  @keyframes chip-pulse {
    0%   { box-shadow: 0 0 0 0 rgba(var(--mint-rgb), 0.6); }
    50%  { box-shadow: 0 0 0 8px rgba(var(--mint-rgb), 0); }
    100% { box-shadow: 0 0 0 0 rgba(var(--mint-rgb), 0); }
  }

  /* zoom 연결 SVG 오버레이 */
  .vc-zoom-connector {
    position: absolute;
    left: 0;
    right: 0;
    pointer-events: none;
    z-index: 1;
    overflow: visible;
  }
  .vc-zoom-connector path {
    fill: none;
    stroke: var(--accent);
    stroke-width: 1.5;
    stroke-dasharray: 4 4;
    opacity: 0;
    transition: opacity 0.6s ease 0.4s, stroke-dashoffset 1.4s ease 0.4s;
  }
  .vc-zoom-connector.in-view path {
    opacity: 0.7;
  }

  /* zoom-in 라벨에 "↑ 가치사슬에서" 추가 */
  .vc-relation-zoom-source {
    font-size: 9.5px;
    color: var(--mute-2);
    letter-spacing: 0;
    margin-top: -10px;
    margin-bottom: 14px;
    text-align: center;
  }
  .vc-relation-zoom-source strong {
    color: var(--accent);
    font-weight: 700;
  }

  /* ====== v1.5 — 관계 전용 타임라인 (Apple-TSMC) ====== */

  /* 타임라인 카드 상단 — 관계 헤더 */
  .ts-rel-header {
    margin-bottom: 18px;
    padding-bottom: 16px;
    border-bottom: 1px solid var(--line);
    text-align: center;
  }
  .ts-rel-header-from-zoom {
    font-size: 10px;
    color: var(--accent);
    letter-spacing: 0;
    font-weight: 700;
    margin-bottom: 10px;
  }
  .ts-rel-header-title {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 14px;
    margin-bottom: 6px;
  }
  .ts-rel-header-entity {
    font-size: 20px;
    font-weight: 800;
    color: var(--fg);
    letter-spacing: -0.025em;
  }
  .ts-rel-header-arrow {
    font-size: 20px;
    color: var(--accent);
    font-weight: 400;
  }
  .ts-rel-header-sub {
    font-size: 11px;
    color: var(--muted);
    letter-spacing: 0;
  }

  /* 흐름 단계 칩 행 */
  .ts-rel-phases {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px;
    margin: 14px 0 18px;
    padding: 10px 12px;
    background: var(--bg-tech);
    border-radius: 6px;
  }
  .ts-rel-phases-label {
    font-size: 10px;
    color: var(--mute-2);
    letter-spacing: 0;
    font-weight: 700;
    margin-right: 4px;
  }
  .ts-rel-phase-chip {
    padding: 3px 10px;
    border-radius: 4px;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: -0.005em;
    color: var(--white);
  }
  .ts-rel-phase-chip.g-blue { background: var(--info-blue); }
  .ts-rel-phase-chip.g-green { background: var(--sig-positive); }
  .ts-rel-phase-chip.g-orange { background: var(--sig-warning); }
  .ts-rel-phase-chip.g-purple { background: var(--violet); }

  /* placeholder 이벤트 (데이터 미정) */
  .ts-issue-event.placeholder {
    opacity: 0.55;
    background: repeating-linear-gradient(
      135deg,
      var(--bg-soft),
      var(--bg-soft) 8px,
      rgba(var(--ink-rgb), 0.02) 8px,
      rgba(var(--ink-rgb), 0.02) 16px
    );
    border-style: dashed !important;
  }
  .ts-issue-event-tag.placeholder-tag {
    background: var(--mute-2) !important;
    color: var(--white) !important;
    font-style: italic;
  }
  .ts-issue-event-cite.placeholder-cite {
    color: var(--mute-2);
    background: transparent;
    border: 1px dashed var(--line);
    font-style: italic;
  }

  /* ====== Ch5: 정책 placeholder 스타일 ====== */

  /* 데이터 입력 안내 박스 (Ch3-2 placeholder 톤과 일관) */
  .pol-placeholder-notice {
    margin-bottom: 18px;
    padding: 14px 16px;
    background: repeating-linear-gradient(
      135deg,
      rgba(var(--mint-rgb), 0.04),
      rgba(var(--mint-rgb), 0.04) 8px,
      transparent 8px,
      transparent 16px
    );
    border: 1px dashed var(--accent-soft);
    border-radius: 8px;
  }
  .pol-placeholder-notice-label {
    font-size: 10px;
    letter-spacing: 0;
    color: var(--accent);
    font-weight: 700;
    margin-bottom: 8px;
  }
  .pol-placeholder-notice-body {
    font-size: 12px;
    color: var(--fg-soft);
    line-height: 1.65;
  }
  .pol-placeholder-notice-body strong {
    color: var(--fg);
    font-weight: 700;
  }

  /* placeholder 요소들 — 흐릿한 톤 */
  .pol-placeholder {
    opacity: 0.7;
    position: relative;
  }
  .pol-doc-title.pol-placeholder,
  .pol-doc-title-en.pol-placeholder {
    color: var(--mute-2);
    font-style: italic;
  }
  .pol-overview.pol-placeholder,
  .pol-claim.pol-placeholder,
  .pol-rec.pol-placeholder,
  .pol-outlook-box.pol-placeholder {
    background: repeating-linear-gradient(
      135deg,
      var(--bg-soft),
      var(--bg-soft) 8px,
      rgba(var(--ink-rgb), 0.02) 8px,
      rgba(var(--ink-rgb), 0.02) 16px
    ) !important;
    border-style: dashed !important;
  }
  .pol-fig.pol-placeholder {
    background: var(--bg-soft);
    border: 1px dashed var(--line);
  }
  .pol-fig.pol-placeholder .pol-fig-num {
    color: var(--mute-2);
    font-style: italic;
  }
  .pol-table.pol-placeholder tbody td {
    color: var(--muted);
    font-style: italic;
  }
  .pol-table.pol-placeholder .pol-row-key {
    font-style: normal;
    color: var(--mute-2);
  }

  /* policy-card placeholder */
  .policy-card.pol-placeholder {
    background: repeating-linear-gradient(
      135deg,
      var(--bg-soft),
      var(--bg-soft) 8px,
      rgba(var(--ink-rgb), 0.02) 8px,
      rgba(var(--ink-rgb), 0.02) 16px
    ) !important;
    border-style: dashed !important;
    opacity: 0.7;
  }
  .policy-card.pol-placeholder .policy-stance {
    color: var(--muted);
    font-style: italic;
  }
  .policy-card.pol-placeholder .policy-quote {
    color: var(--mute-2);
    font-style: italic;
  }
  .policy-card.pol-placeholder .policy-quote-src {
    background: transparent !important;
    border: 1px dashed var(--line);
    color: var(--mute-2);
  }

  /* 원본 통화 표기 (환산 메인 아래) */
  .org-bar-value-orig {
    font-size: 9.5px;
    font-weight: 500;
    color: var(--mute-2);
    letter-spacing: 0;
    margin-top: 2px;
    line-height: 1.2;
  }

  /* evidence 헤더 - 추상화 (raw ID 제거) */
  .org-chart-evidence-id-abstract,
  .org-mini-evidence-id-abstract {
    font-size: 11px;
    color: var(--accent);
    font-weight: 700;
    letter-spacing: 0;
    padding: 3px 9px;
    background: var(--accent-softer);
    border-radius: 3px;
  }
  .org-mini-evidence-id-abstract {
    font-size: 10px;
    padding: 2px 7px;
  }

  /* evidence 안 sentence speaker (발화자 - sentence-id 대신) */
  .org-chart-evidence-speaker,
  .org-mini-evidence-speaker {
    margin-top: 8px;
    font-size: 10.5px;
    color: var(--mute-2);
    font-style: italic;
    letter-spacing: 0;
    line-height: 1.5;
  }
  .org-mini-evidence-speaker {
    font-size: 10px;
    margin-top: 6px;
  }

  /* evidence block label "+ N개 발언 더" inline 카운터 */
  .evidence-block-more,
  .evidence-block-more-inline {
    margin-left: auto;
    font-size: 9.5px;
    color: var(--c-quote);
    background: rgba(var(--concern-rgb), 0.08);
    padding: 2px 7px;
    border-radius: 3px;
    letter-spacing: 0;
    font-weight: 600;
    text-transform: none;
  }
  .evidence-block-more-inline {
    font-size: 9px;
    padding: 1px 6px;
    display: inline-block;
    margin-left: 8px;
    vertical-align: 1px;
  }
  .org-chart-evidence-block-label {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 10px;
    color: var(--mute-2);
    font-weight: 700;
    letter-spacing: 0;
    margin-bottom: 4px;
  }

  /* Mini evidence — 새 구조 (CAPEX와 영업이익에서 사용) */
  .org-mini-evidence-doc-title {
    font-size: 12.5px;
    font-weight: 700;
    color: var(--fg);
    line-height: 1.45;
    padding: 10px 12px 0;
    letter-spacing: -0.01em;
  }
  .org-mini-evidence-doc-title.pol-placeholder-tag {
    color: var(--mute-2);
    font-style: italic;
    font-weight: 500;
  }
  .org-mini-evidence-block {
    padding: 8px 12px;
  }
  .org-mini-evidence-block-label {
    font-size: 9.5px;
    color: var(--mute-2);
    font-weight: 700;
    letter-spacing: 0;
    margin-bottom: 4px;
  }
  .org-mini-evidence-sentence.quote {
    border-left: 2px solid var(--c-quote);
    background: rgba(var(--concern-rgb), 0.04);
  }

  /* Mini evidence — 엔티티 칩 */
  .org-mini-evidence-entities {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    padding: 10px 12px 12px;
  }
  .org-mini-evidence-entity-chip {
    font-size: 9.5px;
    color: var(--fg-soft);
    background: var(--bg-tech);
    padding: 3px 8px;
    border-radius: 3px;
    letter-spacing: 0;
    line-height: 1.5;
  }
  .org-mini-evidence-entity-chip .entity-label {
    color: var(--accent);
    font-weight: 700;
    margin-right: 5px;
    letter-spacing: 0;
    font-size: 8.5px;
  }

  /* Ch5-1 — 매체명 (raw ID·링크 없는 표시) */
  .pol-meta-source-name {
    font-size: 11px;
    color: var(--mute-2);
    font-weight: 600;
    letter-spacing: 0;
    margin-left: auto;
  }

  /* Ch5-1 — 향후 일정 타임라인 */
  .pol-schedule {
    display: flex;
    flex-direction: column;
    gap: 0;
    margin-top: 6px;
    position: relative;
    padding-left: 24px;
  }
  .pol-schedule::before {
    content: '';
    position: absolute;
    left: 7px;
    top: 6px;
    bottom: 6px;
    width: 2px;
    background-image: linear-gradient(180deg, var(--line) 50%, transparent 50%);
    background-size: 2px 6px;
    background-repeat: repeat-y;
  }
  .pol-schedule-item {
    position: relative;
    padding: 10px 12px;
    display: flex;
    align-items: baseline;
    gap: 14px;
  }
  .pol-schedule-item::before {
    content: '';
    position: absolute;
    left: -21px;
    top: 14px;
    width: 12px;
    height: 12px;
    border-radius: 50%;
    background: var(--white);
    border: 2px solid var(--mute-2);
    z-index: 2;
  }
  .pol-schedule-item.done::before {
    background: var(--mute-2);
    border-color: var(--mute-2);
  }
  .pol-schedule-item.highlight {
    background: var(--accent-softer);
    border-left: 3px solid var(--accent);
    border-radius: 0 4px 4px 0;
  }
  .pol-schedule-item.highlight::before {
    background: var(--accent);
    border-color: var(--accent);
    box-shadow: 0 0 0 3px var(--accent-softer);
  }
  .pol-schedule-date {
    font-size: 11.5px;
    color: var(--mute-2);
    font-weight: 700;
    letter-spacing: 0;
    flex-shrink: 0;
    min-width: 88px;
  }
  .pol-schedule-item.highlight .pol-schedule-date {
    color: var(--accent);
  }
  .pol-schedule-text {
    font-size: 12.5px;
    color: var(--fg-soft);
    line-height: 1.55;
    flex: 1;
  }
  .pol-schedule-item.highlight .pol-schedule-text {
    color: var(--fg);
    font-weight: 600;
  }

  /* Ch5-1 — TRACED FROM Ch3 라벨 */
  .ch2-traced-from {
    margin-bottom: 14px;
    padding: 8px 14px;
    background: linear-gradient(135deg, var(--accent-softer), rgba(2, 132, 199, 0.05));
    border-left: 3px solid var(--c-figure);
    border-radius: 0 4px 4px 0;
    display: flex;
    align-items: center;
    gap: 12px;
    flex-wrap: wrap;
  }
  .ch2-traced-from-label {
    font-size: 10px;
    color: var(--c-figure);
    font-weight: 700;
    letter-spacing: 0;
    white-space: nowrap;
  }
  .ch2-traced-from-text {
    font-size: 12.5px;
    color: var(--fg-soft);
    line-height: 1.5;
    flex: 1;
  }
  .ch2-traced-from-text strong {
    color: var(--c-figure);
    font-weight: 700;
  }

  /* ====== Ch4 — 큰 신규 placeholder ====== */
  .ch4-coming-soon {
    margin: 24px 0 8px;
    padding: 48px 32px;
    background: repeating-linear-gradient(
      135deg,
      var(--bg-soft),
      var(--bg-soft) 10px,
      rgba(var(--ink-rgb), 0.025) 10px,
      rgba(var(--ink-rgb), 0.025) 20px
    );
    border: 2px dashed var(--accent-soft);
    border-radius: 12px;
    text-align: center;
    position: relative;
  }
  .ch4-coming-soon-badge {
    display: inline-block;
    padding: 6px 18px;
    background: var(--accent);
    color: var(--white);
    font-size: 13px;
    font-weight: 800;
    letter-spacing: 0;
    border-radius: 4px;
    margin-bottom: 18px;
    box-shadow: 0 4px 12px rgba(var(--mint-rgb), 0.25);
  }
  .ch4-coming-soon-title {
    font-size: 24px;
    font-weight: 800;
    color: var(--fg);
    letter-spacing: -0.025em;
    margin-bottom: 12px;
  }
  .ch4-coming-soon-desc {
    font-size: 14px;
    color: var(--fg-soft);
    line-height: 1.6;
    max-width: 580px;
    margin: 0 auto 24px;
  }
  .ch4-coming-soon-desc strong {
    color: var(--accent);
    font-weight: 700;
  }
  .ch4-coming-soon-spec {
    display: inline-block;
    text-align: left;
    background: var(--white);
    border: 1px solid var(--line);
    border-radius: 8px;
    padding: 16px 22px;
    margin-top: 4px;
  }
  .ch4-spec-row {
    display: flex;
    align-items: baseline;
    gap: 14px;
    padding: 6px 0;
    font-size: 12.5px;
    line-height: 1.5;
  }
  .ch4-spec-row + .ch4-spec-row {
    border-top: 1px solid var(--line-soft);
  }
  .ch4-spec-label {
    font-size: 10.5px;
    color: var(--mute-2);
    font-weight: 700;
    letter-spacing: 0;
    flex-shrink: 0;
    width: 50px;
  }
  .ch4-spec-value {
    color: var(--fg-soft);
  }

  @media (max-width: 760px) {
    .ch4-coming-soon { padding: 32px 16px; }
    .ch4-coming-soon-title { font-size: 18px; }
    .ch4-coming-soon-desc { font-size: 13px; }
    .ch4-coming-soon-spec { padding: 12px 16px; width: 100%; }
  }

  /* ====== Ch3 v2.0 — 관계 네트워크 그래프 ====== */

  /* 관계 유형 요약 */
  .vc-rel-summary {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    justify-content: center;
    padding: 12px 16px;
    background: var(--bg-tech);
    border-radius: 8px;
    margin: 0 auto 18px;
    max-width: 520px;
  }
  .vc-rel-summary-item {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 11.5px;
    color: var(--fg);
  }
  .vc-rel-summary-dot {
    width: 10px;
    height: 10px;
    border-radius: 50%;
  }
  .vc-rel-summary-dot.type-coop { background: var(--info-blue); }
  .vc-rel-summary-dot.type-deal { background: var(--sig-warning); }
  .vc-rel-summary-dot.type-comp { background: var(--sig-negative); }
  .vc-rel-summary-label {
    font-weight: 500;
  }
  .vc-rel-summary-count {
    font-size: 11px;
    color: var(--mute-2);
    font-weight: 700;
    margin-left: 2px;
  }

  /* 네트워크 그래프 컨테이너 */
  .vc-rel-network {
    position: relative;
    width: 100%;
    aspect-ratio: 720 / 480;
    margin: 0 auto;
    max-width: 720px;
  }
  .vc-rel-network-svg {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    pointer-events: none;
  }

  /* 관계 선 */
  .rel-line {
    fill: none;
    stroke-linecap: round;
    opacity: 0;
    transition: opacity 0.6s ease;
  }
  .vc-relation-zoom.in-view .rel-line {
    opacity: 0.7;
  }
  .rel-line.type-coop { stroke: var(--info-blue); }
  .rel-line.type-deal { stroke: var(--sig-warning); }
  .rel-line.type-comp { stroke: var(--sig-negative); }
  .rel-line.high { stroke-width: 2.5; }
  .rel-line.med { stroke-width: 1.3; }
  .rel-line.highlight-ch2 {
    stroke-width: 3;
    opacity: 1 !important;
  }

  /* 네트워크 노드 */
  .rel-node {
    position: absolute;
    transform: translate(-50%, -50%);
    background: var(--white);
    border: 1.5px solid var(--line);
    border-radius: 50px;
    padding: 6px 12px;
    font-size: 11px;
    text-align: center;
    box-shadow: 0 2px 8px rgba(var(--ink-rgb), 0.04);
    opacity: 0;
    transition: all 0.4s ease;
    white-space: nowrap;
    z-index: 2;
  }
  .vc-relation-zoom.in-view .rel-node {
    opacity: 1;
  }
  .rel-node-name {
    font-weight: 700;
    color: var(--fg);
    font-size: 11.5px;
    letter-spacing: -0.01em;
  }
  .rel-node-meta,
  .rel-node-tag {
    font-size: 9px;
    color: var(--mute-2);
    letter-spacing: 0;
    margin-top: 1px;
    font-weight: 600;
  }
  .rel-node-badge {
    display: inline-block;
    margin-top: 4px;
    padding: 2px 7px;
    background: var(--sig-negative);
    color: var(--white);
    border-radius: 3px;
    font-size: 8.5px;
    font-weight: 700;
    letter-spacing: 0;
  }

  .rel-node.center {
    background: var(--accent);
    border-color: var(--accent);
    padding: 12px 18px;
    box-shadow: 0 4px 16px rgba(var(--mint-rgb), 0.3);
  }
  .rel-node.center .rel-node-name {
    color: var(--white);
    font-size: 14px;
    font-weight: 800;
  }
  .rel-node.center .rel-node-meta {
    color: rgba(255, 255, 255, 0.8);
    font-size: 9.5px;
  }

  .rel-node.highlight-ch2 {
    border: 2px solid var(--c-figure);
    background: linear-gradient(135deg, rgba(2, 132, 199, 0.05), var(--white));
    box-shadow: 0 4px 12px rgba(2, 132, 199, 0.12);
  }

  .rel-node.trace-cell {
    cursor: pointer;
  }
  .rel-node.trace-cell:hover {
    transform: translate(-50%, -50%) scale(1.05);
    box-shadow: 0 6px 16px rgba(2, 132, 199, 0.18);
  }

  /* 네트워크 범례 */
  .vc-rel-network-legend {
    margin-top: 16px;
    padding: 10px 16px;
    background: var(--bg-soft);
    border: 1px solid var(--line);
    border-radius: 6px;
    display: flex;
    flex-direction: column;
    gap: 6px;
  }
  .vc-rel-legend-row {
    display: flex;
    flex-wrap: wrap;
    gap: 16px;
    justify-content: center;
  }
  .vc-rel-legend-item {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 11px;
    color: var(--fg-soft);
  }
  .legend-line {
    display: inline-block;
    width: 20px;
    height: 2px;
    border-radius: 1px;
  }
  .legend-line.type-coop { background: var(--info-blue); }
  .legend-line.type-deal { background: var(--sig-warning); }
  .legend-line.type-comp { background: var(--sig-negative); }
  .legend-line-strength {
    display: inline-block;
    width: 20px;
    background: var(--mute-2);
    border-radius: 1px;
  }
  .legend-line-strength.high { height: 3px; }
  .legend-line-strength.med { height: 1.5px; }
  .legend-node-ch2 {
    display: inline-block;
    width: 14px;
    height: 14px;
    border: 2px solid var(--c-figure);
    background: rgba(2, 132, 199, 0.05);
    border-radius: 50%;
  }

  /* Ch2 등장 조직 → Ch3 줌인 메시지 */
  .vc-rel-zoom-into {
    margin: 24px auto 14px;
    padding: 12px 18px;
    background: linear-gradient(135deg, var(--accent-softer), rgba(2, 132, 199, 0.06));
    border-left: 3px solid var(--c-figure);
    border-radius: 6px;
    max-width: 640px;
  }
  .vc-rel-zoom-into-label {
    font-size: 10px;
    color: var(--c-figure);
    letter-spacing: 0;
    font-weight: 700;
    margin-bottom: 6px;
  }
  .vc-rel-zoom-into-text {
    font-size: 13px;
    color: var(--fg);
    line-height: 1.55;
  }
  .vc-rel-zoom-into-text strong {
    color: var(--c-figure);
    font-weight: 700;
  }
  .vc-rel-zoom-into-badge {
    display: inline-block;
    margin-left: 6px;
    padding: 2px 8px;
    background: var(--sig-negative);
    color: var(--white);
    border-radius: 3px;
    font-size: 9.5px;
    font-weight: 700;
    letter-spacing: 0;
    vertical-align: 1px;
  }

  /* 줌인 화살표 - 경쟁 톤 */
  .vc-rel-arrow.comp .vc-rel-arrow-label {
    color: var(--sig-negative);
  }
  .vc-rel-arrow.comp .vc-rel-arrow-fill,
  .vc-rel-arrow.comp .vc-rel-arrow-head {
    background: var(--sig-negative);
  }
  .vc-rel-arrow.comp .vc-rel-arrow-type {
    color: var(--sig-negative);
  }

  /* 줌인 evidence 엔티티 */
  .vc-rel-evidence-entities {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    padding: 10px 14px 14px;
    margin-top: 4px;
  }

  /* 줌인 evidence 관측치 (수치) 카드들 */
  .vc-rel-evidence-figures {
    padding: 10px 14px;
    background: var(--bg-tech);
    border-top: 1px solid var(--line-soft);
    border-bottom: 1px solid var(--line-soft);
    margin-top: 4px;
  }

  /* Ch3-2 타임라인 — 이벤트 footer (근거 버튼 영역) */
  .ts-issue-event-footer {
    margin-top: 10px;
    padding-top: 10px;
    border-top: 1px dashed var(--line-soft);
    display: flex;
    justify-content: flex-end;
  }

  /* ====== Ch3-2 — Executive Summary 축약 모드 ====== */
  .ts-issue-exec-compact {
    padding-bottom: 14px;
  }
  .ts-issue-exec-more-line {
    margin-top: 8px;
    padding: 10px 14px;
    background: var(--bg-tech);
    border: 1px dashed var(--line);
    border-radius: 6px;
    display: flex;
    align-items: center;
    gap: 10px;
    opacity: 0.75;
  }
  .ts-issue-exec-more-line .bf-trend-ellipsis {
    color: var(--mute-2);
    font-weight: 700;
    letter-spacing: 0;
    font-size: 12px;
  }
  .ts-issue-exec-hint {
    font-size: 11.5px;
    color: var(--mute-2);
    font-style: italic;
    flex: 1;
  }

  /* ====== Ch3-2 v2 — 진짜 타임라인 (왼쪽 세로선 + 점) ====== */
  .ts-timeline-v2 {
    position: relative;
    padding-left: 28px;
    margin-top: 8px;
  }
  /* 왼쪽 세로 점선 - 전체 길이 */
  .ts-timeline-v2::before {
    content: '';
    position: absolute;
    left: 9px;
    top: 8px;
    bottom: 8px;
    width: 2px;
    background-image: linear-gradient(180deg, var(--line) 50%, transparent 50%);
    background-size: 2px 6px;
    background-repeat: repeat-y;
  }

  /* 이벤트 */
  .ts-tl-event {
    position: relative;
    padding-bottom: 24px;
  }
  .ts-tl-event:last-child {
    padding-bottom: 0;
  }
  /* 컬러 점 (그룹 색) */
  .ts-tl-dot {
    position: absolute;
    left: -25px;
    top: 6px;
    width: 14px;
    height: 14px;
    border-radius: 50%;
    background: var(--mute-2);
    border: 3px solid var(--white);
    box-shadow: 0 0 0 1px var(--line);
    z-index: 2;
  }
  .ts-tl-event[data-group="green"] .ts-tl-dot { background: var(--sig-positive); }
  .ts-tl-event[data-group="blue"] .ts-tl-dot { background: var(--info-blue); }
  .ts-tl-event[data-group="orange"] .ts-tl-dot { background: var(--sig-warning); }
  .ts-tl-event[data-group="red"] .ts-tl-dot { background: var(--sig-negative); }
  .ts-tl-event[data-group="purple"] .ts-tl-dot { background: var(--violet); }

  .ts-tl-content {
    /* 박스 아님 — 자연스러운 흐름 */
  }

  /* 메타 행 (날짜·그룹·태그) */
  .ts-tl-meta {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 6px;
    flex-wrap: wrap;
  }
  .ts-tl-date {
    font-size: 11px;
    color: var(--mute-2);
    font-weight: 700;
    letter-spacing: 0;
  }
  .ts-tl-group {
    padding: 2px 8px;
    border-radius: 3px;
    font-size: 10.5px;
    font-weight: 600;
    color: var(--fg);
    background: var(--bg-tech);
  }
  .ts-tl-group.g-blue { background: rgba(59, 130, 246, 0.12); color: #2563EB; }
  .ts-tl-group.g-green { background: rgba(var(--sig-positive-rgb), 0.12); color: #15803D; }
  .ts-tl-group.g-orange { background: rgba(var(--sig-warning-rgb), 0.14); color: #B45309; }
  .ts-tl-group.g-red { background: rgba(var(--sig-negative-rgb), 0.10); color: #B91C1C; }
  .ts-tl-group.g-purple { background: rgba(139, 92, 246, 0.12); color: #7C3AED; }

  .ts-tl-tag {
    font-size: 10px;
    color: var(--mute-2);
    background: transparent;
    border: 1px solid var(--line);
    padding: 2px 7px;
    border-radius: 3px;
    letter-spacing: 0;
  }

  /* 제목 */
  .ts-tl-title {
    font-size: 14.5px;
    font-weight: 700;
    color: var(--fg);
    letter-spacing: -0.015em;
    line-height: 1.4;
    margin-bottom: 8px;
  }

  /* 핵심 수치 한 줄 */
  .ts-tl-fact {
    font-size: 12.5px;
    color: var(--fg-soft);
    line-height: 1.55;
    padding: 8px 12px;
    background: var(--bg-soft);
    border-left: 3px solid var(--c-figure);
    border-radius: 0 4px 4px 0;
    margin-bottom: 10px;
  }
  .ts-tl-fact-arrow {
    color: var(--c-figure);
    font-weight: 700;
    margin-right: 6px;
  }
  .ts-tl-num {
    color: var(--c-figure);
    font-weight: 700;
    background: rgba(2, 132, 199, 0.08);
    padding: 1px 5px;
    border-radius: 3px;
    letter-spacing: -0.005em;
  }

  /* 이벤트 footer (근거 버튼) */
  .ts-tl-footer {
    display: flex;
    justify-content: flex-end;
  }

  /* "+ 9건 더" 스킵 영역 — 점선이 굵게 흐릿하게 흐름 */
  .ts-tl-skip {
    position: relative;
    padding: 16px 0 16px 0;
    text-align: center;
    margin: 4px 0 4px -28px;
    padding-left: 28px;
  }
  .ts-tl-skip-dots {
    font-size: 16px;
    color: var(--mute-2);
    letter-spacing: 0;
    line-height: 1;
    margin-bottom: 6px;
  }
  .ts-tl-skip-text {
    font-size: 11.5px;
    color: var(--mute-2);
    font-weight: 700;
    letter-spacing: 0;
  }
  .ts-tl-skip-text .bf-more-ellipsis {
    color: var(--mute-2);
    letter-spacing: 0;
    margin-left: 4px;
  }
  .ts-tl-skip-hint {
    font-size: 10.5px;
    color: var(--mute-2);
    font-style: italic;
    margin-top: 4px;
    opacity: 0.8;
  }

  /* 5개 그룹 칩 — red 추가 */
  .ts-rel-phase-chip.g-red { background: var(--sig-negative); }

  /* g-red 데이터그룹 이벤트 카드 액센트 */
  .ts-issue-event[data-group="red"]::before { background: var(--sig-negative); }
  .ts-issue-event-group.g-red {
    background: var(--sig-negative);
    color: var(--white);
  }
  .vc-rel-evidence-figures-label {
    font-size: 9.5px;
    color: var(--mute-2);
    font-weight: 700;
    letter-spacing: 0;
    margin-bottom: 8px;
  }
  .vc-rel-evidence-figure-list {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: 8px;
  }
  .vc-rel-evidence-figure {
    display: flex;
    flex-direction: column;
    padding: 8px 10px;
    background: var(--white);
    border: 1px solid var(--line);
    border-radius: 5px;
    gap: 3px;
  }
  .vc-rel-evidence-figure-num {
    font-size: 16px;
    color: var(--c-figure);
    font-weight: 700;
    letter-spacing: -0.01em;
  }
  .vc-rel-evidence-figure-num .vs-num {
    color: var(--mute-2);
    font-size: 13px;
    font-weight: 500;
    margin-left: 4px;
  }
  .vc-rel-evidence-figure-label {
    font-size: 11px;
    color: var(--fg-soft);
    line-height: 1.45;
  }
  .vc-rel-evidence-entity-chip {
    font-size: 10px;
    color: var(--fg-soft);
    background: var(--bg-tech);
    padding: 3px 9px;
    border-radius: 3px;
    letter-spacing: 0;
  }
  .vc-rel-evidence-entity-chip .entity-label {
    color: var(--accent);
    font-weight: 700;
    margin-right: 5px;
    letter-spacing: 0;
    font-size: 9px;
  }

  .vc-rel-evidence-more {
    margin-left: auto;
    font-size: 9.5px;
    color: var(--c-quote);
    background: rgba(var(--concern-rgb), 0.08);
    padding: 2px 7px;
    border-radius: 3px;
    letter-spacing: 0;
    font-weight: 600;
  }

  .vc-rel-evidence-doc.pol-placeholder-tag {
    color: var(--mute-2);
    font-style: italic;
    font-weight: 500;
  }

  /* 모바일 - 네트워크 그래프 */
  @media (max-width: 760px) {
    .vc-rel-network {
      aspect-ratio: 1 / 1.2;
    }
    .rel-node {
      padding: 4px 8px;
      font-size: 9.5px;
    }
    .rel-node-name {
      font-size: 10px;
    }
    .rel-node-tag {
      font-size: 8px;
    }
    .rel-node.center .rel-node-name {
      font-size: 11px;
    }
  }

  /* ====== Ch2 v1.7 — 하단 서술형 매트릭스 ====== */
  .org-matrix-tail {
    margin-top: 24px;
    padding-top: 20px;
    border-top: 1px dashed var(--line);
  }
  .org-matrix-head {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    margin-bottom: 12px;
    gap: 12px;
    flex-wrap: wrap;
  }
  .org-matrix-head-label {
    font-size: 10px;
    letter-spacing: 0;
    color: var(--accent);
    font-weight: 700;
  }
  .org-matrix-head-meta {
    font-size: 9.5px;
    color: var(--mute-2);
    letter-spacing: 0;
    font-weight: 600;
  }
  .org-matrix {
    width: 100%;
    border-collapse: separate;
    border-spacing: 0;
    font-size: 11.5px;
  }
  .org-matrix thead th {
    text-align: left;
    padding: 8px 10px;
    font-size: 10px;
    letter-spacing: 0;
    color: var(--mute-2);
    font-weight: 700;
    background: var(--bg-tech);
    border-bottom: 1px solid var(--line);
    border-top: 1px solid var(--line);
  }
  .org-matrix thead th:first-child {
    border-left: 1px solid var(--line);
    border-top-left-radius: 4px;
  }
  .org-matrix thead th:last-child {
    border-right: 1px solid var(--line);
    border-top-right-radius: 4px;
  }
  .org-matrix tbody td {
    padding: 10px;
    border-bottom: 1px solid var(--line-soft);
    color: var(--fg-soft);
    line-height: 1.55;
    vertical-align: top;
  }
  .org-matrix tbody td strong {
    color: var(--fg);
    font-weight: 700;
  }
  .org-matrix tbody tr:last-child td {
    border-bottom: 1px solid var(--line);
  }
  .org-matrix .om-org-cell {
    background: var(--bg-tech);
    border-right: 1px solid var(--line);
    width: 110px;
  }
  .org-matrix tbody tr:first-child .om-org-cell {
    border-top: none;
  }
  .om-org-name {
    font-weight: 700;
    color: var(--fg);
    font-size: 12.5px;
    letter-spacing: -0.01em;
    margin-bottom: 2px;
  }
  .om-org-flag {
    font-size: 9.5px;
    color: var(--mute-2);
    letter-spacing: 0;
    font-weight: 600;
  }
  .om-warning {
    color: var(--c-quote);
    font-weight: 500;
  }
  .om-warning::before {
    content: '●';
    color: var(--c-quote);
    margin-right: 4px;
    font-size: 8px;
    vertical-align: 1px;
  }

  @media (max-width: 760px) {
    .org-matrix { font-size: 10px; }
    .org-matrix thead th { padding: 6px 8px; font-size: 9px; }
    .org-matrix tbody td { padding: 8px; }
    .org-matrix .om-org-cell { width: 80px; }
  }

  /* ====== Footer ====== */
  .demo-note {
    width: min(1180px, calc(100% - 40px));
    margin: 0 auto;
    padding: 40px 0 80px;
    color: var(--mute-2);
    font-size: 12px;
    border-top: 1px dashed var(--line);
    text-align: center;
    letter-spacing: 0;
    line-height: 1.6;
  }
  .demo-note strong { color: var(--fg-soft); }

  /* === Responsive Phase 2: stack chapter narrative + visual === */
  @media (max-width: 1024px) {
    /* The chapter visual (lens-card) needs ~600+px to lay out its demo
       internals; below tablet width keep narrative on top, visual below.
       minmax(0, 1fr) is critical — plain `1fr` defaults to `minmax(auto, 1fr)`
       so the column grows to fit content's min-content (which is desktop-wide
       for chapter 1/2's demo grid). That makes lens-card spill past the
       viewport and the replay button slides off-screen. minmax(0, ...) lets
       the column shrink to zero so its child can be clipped to the cell. */
    .chapter {
      grid-template-columns: minmax(0, 1fr);
      gap: 20px;
    }
    .chapter-visual { min-width: 0; }
    .chapter1-demo,
    .chapter2-demo,
    .chapter3-demo { min-width: 0; max-width: 100%; }
    /* lens-card 의 fixed 820px height 가 mobile 에선 회사 grid (수직 21 row)
       를 잘라버림. 자연스레 콘텐츠 높이로 grow 하게 해주고, 시각 균형용
       min-height 만 살짝 유지. width 도 명시적으로 100% 제한. */
    .lens-card {
      height: auto;
      min-height: 560px;
      max-width: 100%;
    }
    /* "글로벌 지형…" 아래 3 카드 — 한 줄에 다 못 들어가니 2열로 wrap.
       세 번째 카드는 두 번째 row 에서 가로 폭 전체를 차지. */
    .struct-intel-grid {
      grid-template-columns: repeat(2, 1fr);
    }
    .struct-intel-card:last-child {
      grid-column: 1 / -1;
    }
  }
  @media (max-width: 640px) {
    /* Phone: stack the 3 domain cards single-column. */
    .struct-intel-grid {
      grid-template-columns: 1fr;
    }
    .struct-intel-card:last-child {
      grid-column: auto;
    }
    /* Chapter narrative tightens — pad isn't needed when nothing is to its
       right, and the h3 + chip can use the full row. */
    .chapter {
      gap: 14px;
    }
    .chapter-narrative {
      padding-top: 0;
    }
  }
}