/* ===== Report Theme System — Mono + Editorial (v4.5.0) =====
   SSOT: docs/MONO_THEME_GUIDE.md (Tier 2)
   세 톤 (Editorial Cream · Burgundy Mono · Light Mono).
   - editorial_cream: 디폴트. cream + terracotta. 편집·분석·일반 보고서.
   - burgundy_mono: 위기·분쟁·사고. dark wine + amber. (v4.5.0 어둡게 보정)
   - light_mono: 폐기 예정 (legacy). 아래 블록은 호환 위해 보존.
   카테고리 구분은 hue 가 아닌 border-style + 패턴.
   ============================================================ */

/* --- Default: Editorial Cream (warm cream + terracotta + warm dark) ---
   v4.5.0 신규. LG AI Seminar 보고서 톤 차용. 인쇄·캡처·장문 가독성 우위. */
:root, [data-theme="editorial_cream"] {
  /* Surfaces */
  --bg: #F2EBDB;
  --card: #ECE3D0;
  --card-hover: #E5DBC4;
  --accent-surface: #ECE3D0;
  --border: #D4C8B0;
  --border-light: #E2D8C0;
  --divider: #D4C8B0;

  /* Text */
  --text: #1F1814;       /* warm dark — pure black 보다 따뜻 */
  --muted: #6B5C4A;      /* warm grey */

  /* Semantic accents — guide §3.2 */
  --accent: #B05A38;     /* terracotta — editorial 강조, hatch stroke, callout border */
  --up: #4A6B3E;         /* forest green — 상승·기회 (작은 변동만) */
  --down: #8B2A2A;       /* deep crimson — 하락·위험 (작은 변동, 이벤트 vline) */

  /* Map tokens */
  --map-land: #F2EBDB;
  --map-water: #DFD3B8;  /* sand — water as "aged paper" */
  --map-boundary: #1F1814;
  --map-graticule: #D4C8B0;

  /* Geometry */
  --radius: 6px;
  --radius-lg: 8px;
  --shadow: none;

  /* Legacy aliases (멀티컬러 → mono 매핑 보존) */
  --text-primary: var(--text);
  --text-secondary: #2D241B;
  --text-muted: var(--muted);
  --text-faded: #8A7A66;
  --gold: var(--accent);
  --gold-light: var(--accent);
  --red: var(--down);
  --red-light: var(--card);
  --orange: var(--accent);
  --orange-light: var(--card);
  --green: var(--up);
  --green-light: var(--card);
  --blue: var(--muted);
  --blue-light: var(--card);

  /* freeform_essay.html 톤 변형 토큰 */
  --bg-1: var(--bg);
  --bg-2: var(--card);
  --bg-3: #E5DBC4;            /* deeper cream — closing 톤 */
  --card-deep: #E5DBC4;       /* v4.5.3 — chart-card-stage 배경 (본문보다 한 단계 깊게) */
  --fg-1: var(--text);
  --fg-2: #2D241B;
  --fg-3: var(--muted);
  --border-soft: rgba(212,200,176,0.55);
}

/* --- Burgundy Mono (deep wine + amber gold + parchment) — v4.5.0 어둡게 보정 ---
   이전 #3D1820 은 "맑은 와인" 톤이었고 사용자 피드백으로 더 짙은 dried-blood 톤으로.
   위기·분쟁·사고 보고서 전용 (lens_policy._THEME_BY_CATEGORY 참조). */
[data-theme="burgundy_mono"] {
  /* Surfaces */
  --bg: #2A0F18;             /* v4.5.0: 3D1820 → 2A0F18 (R-22, G-9, B-8) */
  --card: #371721;           /* 카드는 bg 보다 한 단계 위 */
  --card-hover: #371721;
  --accent-surface: #371721;
  --border: #5A2832;         /* 6E3340 → 5A2832 (어둡게) */
  --border-light: #371721;
  --divider: #5A2832;

  /* Text */
  --text: #EFE5D1;
  --muted: #A88E7A;

  /* Semantic accents */
  --accent: #D4A858;
  --up: #A8B582;
  --down: #C9837A;

  /* Map tokens — water 도 한 단계 더 깊게 */
  --map-land: #2A0F18;
  --map-water: #1A0810;      /* 2A0E16 → 1A0810 (near-black wine) */
  --map-boundary: #EFE5D1;
  --map-graticule: #5A2832;

  /* Geometry */
  --radius: 6px;
  --radius-lg: 8px;
  --shadow: none;

  /* Legacy aliases */
  --text-primary: var(--text);
  --text-secondary: var(--text);
  --text-muted: var(--muted);
  --text-faded: var(--muted);
  --gold: var(--accent);
  --gold-light: var(--accent);
  --red: var(--down);
  --red-light: var(--card);
  --orange: var(--accent);
  --orange-light: var(--card);
  --green: var(--up);
  --green-light: var(--card);
  --blue: var(--muted);
  --blue-light: var(--card);

  --bg-1: var(--bg);
  --bg-2: var(--card);
  --bg-3: #1A0810;            /* deepest wine — closing/footer 톤 */
  --card-deep: #1A0810;       /* v4.5.3 — chart-card-stage 배경 */
  --fg-1: var(--text);
  --fg-2: #D8CCB8;
  --fg-3: var(--muted);
  --border-soft: rgba(90,40,50,0.4);
}

/* --- Light Mono (cream + deep burgundy + forest green) --- */
[data-theme="light_mono"] {
  --bg: #efe8d9;
  --card: #f8f2e4;
  --card-hover: #f8f2e4;
  --accent-surface: #f8f2e4;
  --border: #b3a586;
  --border-light: #d4c8a8;
  --divider: #b3a586;

  --text: #1a1a1a;
  --muted: #5a5a5a;

  --accent: #9a1e3c;
  --up: #2d6a3e;
  --down: #9a1e3c;

  --map-land: #efe8d9;
  --map-water: #dccea8;
  --map-boundary: #1a1a1a;
  --map-graticule: #b3a586;

  --radius: 6px;
  --radius-lg: 8px;
  --shadow: none;

  --text-primary: var(--text);
  --text-secondary: var(--text);
  --text-muted: var(--muted);
  --text-faded: var(--muted);
  --gold: var(--accent);
  --gold-light: var(--accent);
  --red: var(--down);
  --red-light: var(--card);
  --orange: var(--accent);
  --orange-light: var(--card);
  --green: var(--up);
  --green-light: var(--card);
  --blue: var(--muted);
  --blue-light: var(--card);

  /* freeform_essay.html 용 톤 변형 토큰 (v3.5.0, light mono) */
  --bg-1: var(--bg);
  --bg-2: var(--card);
  --bg-3: #dccea8;            /* deeper cream — closing 톤 */
  --card-deep: #dccea8;       /* v4.5.3 — chart-card-stage 배경 */
  --fg-1: var(--text);
  --fg-2: #3a3a3a;
  --fg-3: var(--muted);
  --border-soft: rgba(179,165,134,0.4);
}

/* ================================================================
   v5.0.2 — 5개 신규 테마 (총 7종 중 5종 추가, 사용자 요청)
   원칙: mono guide §3.3 단일 액센트. 가독성 우선. 카테고리 무관 랜덤.
   ================================================================ */

/* --- Midnight Indigo (deep indigo + sky blue) — 다크 모드, 기술·심층 톤 */
[data-theme="midnight_indigo"] {
  --bg: #161A2E;
  --card: #1F2440;
  --card-hover: #262C4A;
  --accent-surface: #1F2440;
  --border: #3A4060;
  --border-light: #262C4A;
  --divider: #3A4060;

  --text: #E8ECEF;
  --muted: #8A92A8;

  --accent: #6FB3FF;
  --up: #88B888;
  --down: #DC7A7A;

  --map-land: #161A2E;
  --map-water: #0D1020;
  --map-boundary: #E8ECEF;
  --map-graticule: #3A4060;

  --radius: 6px; --radius-lg: 8px; --shadow: none;

  --text-primary: var(--text); --text-secondary: var(--text);
  --text-muted: var(--muted); --text-faded: var(--muted);
  --gold: var(--accent); --gold-light: var(--accent);
  --red: var(--down); --red-light: var(--card);
  --orange: var(--accent); --orange-light: var(--card);
  --green: var(--up); --green-light: var(--card);
  --blue: var(--accent); --blue-light: var(--card);

  --bg-1: var(--bg); --bg-2: var(--card); --bg-3: #0D1020;
  --card-deep: #0D1020;
  --fg-1: var(--text); --fg-2: #D0D8E0; --fg-3: var(--muted);
  --border-soft: rgba(58,64,96,0.45);
}

/* --- Pine Forest (deep pine green + jade) — 다크 모드, 짙은 녹색 (v6.2.0) */
[data-theme="pine_forest"] {
  --bg: #132019;
  --card: #1B2C22;
  --card-hover: #233529;
  --accent-surface: #1B2C22;
  --border: #32503E;
  --border-light: #233529;
  --divider: #32503E;

  --text: #E7EEE8;
  --muted: #8AA294;

  --accent: #7CC6A4;
  --up: #88B888;
  --down: #DC7A7A;

  --map-land: #132019;
  --map-water: #0C140F;
  --map-boundary: #E7EEE8;
  --map-graticule: #32503E;

  --radius: 6px; --radius-lg: 8px; --shadow: none;

  --text-primary: var(--text); --text-secondary: var(--text);
  --text-muted: var(--muted); --text-faded: var(--muted);
  --gold: var(--accent); --gold-light: var(--accent);
  --red: var(--down); --red-light: var(--card);
  --orange: var(--accent); --orange-light: var(--card);
  --green: var(--up); --green-light: var(--card);
  --blue: var(--accent); --blue-light: var(--card);

  --bg-1: var(--bg); --bg-2: var(--card); --bg-3: #0C140F;
  --card-deep: #0C140F;
  --fg-1: var(--text); --fg-2: #CFE0D4; --fg-3: var(--muted);
  --border-soft: rgba(50,80,62,0.45);
}

/* --- Graphite Slate (deep graphite gray + copper) — 다크 모드, 짙은 회색 (v6.2.0) */
[data-theme="graphite_slate"] {
  --bg: #191B1E;
  --card: #23262B;
  --card-hover: #2B2F35;
  --accent-surface: #23262B;
  --border: #3D424A;
  --border-light: #2B2F35;
  --divider: #3D424A;

  --text: #E9EBED;
  --muted: #969BA3;

  --accent: #D69A5E;
  --up: #88B888;
  --down: #DC7A7A;

  --map-land: #191B1E;
  --map-water: #0E0F12;
  --map-boundary: #E9EBED;
  --map-graticule: #3D424A;

  --radius: 6px; --radius-lg: 8px; --shadow: none;

  --text-primary: var(--text); --text-secondary: var(--text);
  --text-muted: var(--muted); --text-faded: var(--muted);
  --gold: var(--accent); --gold-light: var(--accent);
  --red: var(--down); --red-light: var(--card);
  --orange: var(--accent); --orange-light: var(--card);
  --green: var(--up); --green-light: var(--card);
  --blue: var(--accent); --blue-light: var(--card);

  --bg-1: var(--bg); --bg-2: var(--card); --bg-3: #0E0F12;
  --card-deep: #0E0F12;
  --fg-1: var(--text); --fg-2: #D2D6DA; --fg-3: var(--muted);
  --border-soft: rgba(61,66,74,0.45);
}

/* --- Reset --- */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; }
body {
  font-family: 'Noto Sans KR', sans-serif;
  background: var(--bg);
  color: var(--text-secondary);
  font-size: 14px;
  line-height: 1.8;
  word-break: keep-all;
  overflow-wrap: break-word;
}

/* --- Layout --- */
.container { max-width: 960px; margin: 0 auto; padding: 0 14px; }
section { padding: 44px 0 36px; border-bottom: 1px solid var(--border-light); }

/* --- Hero --- */
.hero { background: var(--bg); color: var(--text-primary); padding: 56px 16px 36px; text-align: center; }
.hero h1 {
  font-family: 'Noto Serif KR', serif;
  font-size: clamp(24px, 6vw, 42px);
  font-weight: 900;
  line-height: 1.25;
  margin-bottom: 8px;
  color: var(--text-primary);
  word-break: keep-all;
  overflow-wrap: break-word;
}
.hero-sub {
  font-size: 12px;
  color: var(--text-muted);
  max-width: 700px;
  margin: 0 auto 14px;
  line-height: 1.7;
}

/* --- Key Summary (핵심 요약) --- */
.key-summary {
  max-width: 700px;
  margin: 0 auto;
  padding: 20px 24px;
  background: var(--card);
  border: 1px solid var(--border);
  border-left: 3px solid var(--gold);
  border-radius: 0 var(--radius-lg) var(--radius-lg) 0;
}
.key-summary-title {
  font-family: 'Noto Serif KR', serif;
  font-size: 13px;
  font-weight: 700;
  color: var(--text-primary);
  margin-bottom: 10px;
  letter-spacing: 0.5px;
}
.key-summary ol {
  list-style: none;
  counter-reset: ks;
  padding: 0;
  margin: 0;
}
.key-summary li {
  counter-increment: ks;
  font-size: 12px;
  color: var(--text-secondary);
  line-height: 1.8;
  padding: 3px 0;
}
.key-summary li::before {
  content: counter(ks) ")";
  color: var(--gold);
  font-weight: 700;
  margin-right: 6px;
}

/* --- Key Metrics Grid --- */
.key-metrics-grid {
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  gap: 8px;
  margin-bottom: 20px;
}
@media (max-width: 700px) {
  .key-metrics-grid { grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 400px) {
  .key-metrics-grid { grid-template-columns: repeat(2, 1fr); }
}
.key-metric-card {
  background: var(--card);
  border: 1px solid var(--border-light);
  border-radius: var(--radius);
  padding: 14px 8px 10px;
  text-align: center;
  box-shadow: var(--shadow);
  display: flex;
  flex-direction: column;
  align-items: center;
}
.key-metric-icon { font-size: 16px; margin-bottom: 6px; }
.key-metric-value {
  font-size: 15px;
  font-weight: 700;
  white-space: nowrap;
  flex: 1;
  display: flex;
  align-items: center;
}
.key-metric-label {
  font-size: 9px;
  color: var(--text-muted);
  text-transform: uppercase;
  letter-spacing: 1px;
  margin-top: 8px;
  white-space: nowrap;
}

/* --- Canvas Chart Grid --- */
.chart-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: 10px;
  margin-bottom: 14px;
}
.hero-tags { display: flex; gap: 8px; justify-content: center; flex-wrap: wrap; font-size: 10px; }
.hero-tags span {
  background: var(--card);
  padding: 3px 12px;
  border-radius: 20px;
  color: var(--text-muted);
  border: 1px solid var(--border);
}

/* --- Navigation --- */
.nav {
  position: sticky;
  top: 0;
  z-index: 100;
  background: rgba(43, 26, 26, .92);
  backdrop-filter: blur(8px);
  border-bottom: 1px solid var(--border);
  overflow-x: auto;
}
.nav-inner { display: flex; white-space: nowrap; padding: 0 4px; }
.nav a {
  display: block;
  padding: 10px 12px;
  font-size: 10px;
  font-weight: 500;
  color: var(--text-faded);
  text-decoration: none;
  border-bottom: 2px solid transparent;
  transition: color .2s;
}
.nav a:hover { color: var(--text-muted); }
.nav a.on { color: var(--text-primary); border-bottom-color: var(--gold); }

/* --- Section Headings --- */
.section-label {
  font-family: 'Noto Serif KR', serif;
  font-size: 10px;
  font-style: italic;
  letter-spacing: 1px;
  color: var(--text-faded);
  margin-bottom: 6px;
}
.section-title {
  font-family: 'Noto Serif KR', serif;
  font-size: clamp(18px, 4vw, 28px);
  font-weight: 900;
  line-height: 1.3;
  margin-bottom: 6px;
  color: var(--text-primary);
}
.section-desc {
  font-size: 12px;
  color: var(--text-muted);
  margin-bottom: 20px;
  line-height: 1.8;
  max-width: 640px;
}

/* --- Card --- */
.card {
  background: var(--card);
  border: 1px solid var(--border);
  border-radius: var(--radius-lg);
  padding: 16px;
}

/* --- Callout --- */
.callout {
  background: var(--card);
  border-left: 3px solid var(--gold);
  border-radius: 0 var(--radius) var(--radius) 0;
  padding: 12px 14px;
  margin: 16px 0;
}
.callout b { font-size: 12px; display: block; margin-bottom: 2px; color: var(--text-primary); }
.callout p { font-size: 11px; color: var(--text-muted); line-height: 1.75; }

/* --- Balance Analysis (균형 분석) ---
   Long-form structured analysis with paragraph spacing for readability. */
.balance-analysis {
  background: var(--card);
  border-left: 3px solid var(--gold);
  border-radius: 0 var(--radius-lg) var(--radius-lg) 0;
  padding: 18px 20px;
  margin: 18px 0;
}
.balance-analysis-title {
  font-family: 'Noto Serif KR', serif;
  font-size: 14px;
  font-weight: 700;
  color: var(--text-primary);
  margin-bottom: 12px;
  padding-bottom: 8px;
  border-bottom: 1px solid var(--border-light);
  letter-spacing: 0.3px;
}
.balance-analysis-body {
  font-size: 11.5px;
  color: var(--text-secondary);
  line-height: 1.85;
  word-break: keep-all;
  overflow-wrap: break-word;
}
.balance-analysis-body strong {
  display: inline-block;
  color: var(--gold);
  font-weight: 700;
  margin-top: 4px;
  margin-bottom: 2px;
  font-size: 11.5px;
  letter-spacing: 0.2px;
}
.balance-analysis-body br + br {
  line-height: 0.5;
}

/* --- Grid --- */
.grid-2 { display: grid; grid-template-columns: 1fr; gap: 10px; }
@media (min-width: 540px) { .grid-2 { grid-template-columns: 1fr 1fr; } }

/* --- Act Cue (막 전환 문구) --- */
.act-cue {
  text-align: center;
  padding: 24px 0 0;
  font-family: 'Noto Serif KR', serif;
  font-size: 12px;
  color: var(--text-faded);
  font-style: italic;
}

/* --- Player Cards --- */
.player-card {
  background: var(--card);
  border: 1px solid var(--border);
  border-radius: var(--radius-lg);
  padding: 14px;
  position: relative;
  overflow: hidden;
}
.player-card::before { content: ''; position: absolute; top: 0; left: 0; right: 0; height: 3px; }
.player-card.extreme::before { background: var(--red); }
.player-card.high::before { background: var(--orange); }
.player-card.medium::before { background: var(--gold); }
.player-card.low::before { background: var(--green); }

.player-header { display: flex; align-items: center; gap: 8px; margin-bottom: 6px; }
.player-emoji { font-size: 20px; }
.player-name { font-weight: 700; font-size: 14px; color: var(--text-primary); }

.badge {
  font-size: 8px;
  font-weight: 600;
  padding: 2px 8px;
  border-radius: 3px;
}
.badge.extreme { background: var(--red-light); color: var(--red); border: 1px solid var(--red); }
.badge.high { background: var(--orange-light); color: var(--orange); border: 1px solid var(--orange); }
.badge.medium { background: rgba(201,168,76,.12); color: var(--gold); border: 1px solid var(--gold); }
.badge.low { background: var(--green-light); color: var(--green); border: 1px solid var(--green); }

.player-summary { font-size: 10px; color: var(--text-muted); line-height: 1.6; margin-bottom: 6px; }
.player-detail {
  font-size: 10px;
  padding: 8px;
  background: var(--bg);
  border-radius: var(--radius);
  line-height: 1.6;
  color: var(--text-secondary);
}

/* --- Flow (Chain Reaction) --- */
.flow-list { display: flex; flex-direction: column; align-items: center; gap: 0; }
.flow-node {
  background: var(--card);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  padding: 10px 14px;
  text-align: center;
  width: 100%;
  max-width: 440px;
}
.flow-node strong { font-size: 12px; color: var(--text-primary); }
.flow-node span { font-size: 10px; color: var(--text-muted); display: block; margin-top: 1px; }
.flow-arrow {
  width: 1px;
  height: 16px;
  background: var(--divider);
  position: relative;
}
.flow-arrow::after {
  content: '\25BC';
  position: absolute;
  bottom: -5px;
  left: 50%;
  transform: translateX(-50%);
  font-size: 7px;
  color: var(--text-faded);
}

/* --- Data Table --- */
.data-table {
  width: 100%;
  border-collapse: separate;
  border-spacing: 0;
  font-size: 11px;
  border-radius: var(--radius-lg);
  overflow: hidden;
  border: 1px solid var(--border);
  background: var(--card);
}
.data-table th {
  background: var(--bg);
  color: var(--text-muted);
  padding: 10px 8px;
  font-size: 10px;
  font-weight: 600;
  text-align: left;
  text-transform: uppercase;
  letter-spacing: 0.5px;
}
.data-table td {
  padding: 10px 8px;
  border-bottom: 1px solid var(--border-light);
  vertical-align: top;
  line-height: 1.6;
  color: var(--text-secondary);
}
.data-table tr:last-child td { border-bottom: none; }
.data-table tr:hover td { background: var(--card-hover); }

/* --- Signal Grid --- */
.signal-grid { display: grid; grid-template-columns: 1fr; gap: 8px; }
@media (min-width: 540px) { .signal-grid { grid-template-columns: 1fr 1fr; } }

.signal-item {
  display: flex;
  gap: 8px;
  padding: 10px 12px;
  background: var(--card);
  border: 1px solid var(--border);
  border-radius: var(--radius);
}
.signal-icon {
  width: 26px;
  height: 26px;
  border-radius: 6px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 12px;
  flex-shrink: 0;
  background: var(--card-hover);
}
.signal-item h4 { font-size: 11px; font-weight: 700; margin-bottom: 1px; color: var(--text-primary); }
.signal-item p { font-size: 10px; color: var(--text-muted); line-height: 1.5; }

/* --- Timeline --- */
.timeline-content { font-size: 10px; line-height: 1.85; color: var(--text-secondary); }

/* --- Gauge Bar --- */
.gauge-bar { margin-bottom: 8px; }
.gauge-label {
  font-size: 11px;
  display: flex;
  justify-content: space-between;
  margin-bottom: 3px;
  color: var(--text-secondary);
}
.gauge-label span:last-child { color: var(--text-primary); font-weight: 600; }
.gauge-track { height: 20px; background: var(--card); border-radius: 3px; overflow: hidden; }
.gauge-fill {
  height: 100%;
  border-radius: 3px;
  display: flex;
  align-items: center;
  padding-left: 6px;
  font-size: 9px;
  font-weight: 600;
  color: var(--text-primary);
}

/* --- Terms --- */
.terms {
  margin-top: 16px;
  padding: 12px 14px;
  background: var(--card);
  border-radius: var(--radius);
  border: 1px solid var(--border);
  font-size: 10px;
  line-height: 1.7;
  color: var(--text-muted);
}
.terms b { color: var(--text-secondary); font-size: 10px; }

/* --- Radar --- */
.radar-wrap { display: flex; justify-content: center; margin: 20px 0; }
#radarCanvas { max-width: 100%; }

/* --- Footer --- */
.footer {
  background: var(--bg);
  border-top: 1px solid var(--divider);
  color: var(--text-faded);
  padding: 24px 14px;
  text-align: center;
  font-size: 10px;
  line-height: 1.8;
}
.footer a { color: var(--text-muted); text-decoration: underline; }

/* ============================================================ */
/* === v5.1.1 — 후속 보고서 헤더 + 출처 footnote 시스템         === */
/* ============================================================ */

/* --- Followup parent reference (h1 [1] footnote target) --- */
.followup-parent {
  padding: 18px 0 6px;
}
.followup-parent .container,
.followup-parent {
  /* container 안에서 한 단계 들여쓰기. .container 자체는 max-width 적용 됨 */
}
.followup-parent-box {
  display: flex;
  gap: 14px;
  align-items: flex-start;
  padding: 14px 16px;
  border-left: 3px solid var(--accent);
  background: var(--card);
  border-radius: 0 var(--radius) var(--radius) 0;
  font-size: 11px;
  line-height: 1.7;
}
.followup-parent-mark {
  font-family: 'Noto Serif KR', serif;
  font-size: 14px;
  font-weight: 900;
  color: var(--accent);
  flex-shrink: 0;
  min-width: 24px;
}
.followup-parent-body { flex: 1; }
.followup-parent-label {
  font-size: 9px;
  letter-spacing: 2px;
  text-transform: uppercase;
  color: var(--text-faded);
  margin-bottom: 4px;
}
.followup-parent-id { font-weight: 700; color: var(--text); margin-bottom: 6px; }
.followup-parent-id a { color: var(--text); text-decoration: underline; }
.followup-parent-signal { color: var(--text-secondary); margin-bottom: 4px; }
.followup-parent-dir {
  display: inline-block;
  padding: 1px 6px;
  border-radius: 3px;
  font-size: 9px;
  font-weight: 700;
  margin-left: 4px;
}
.followup-parent-dir-confirms_base { background: rgba(74,107,62,0.18); color: var(--up); }
.followup-parent-dir-rejects_base { background: rgba(139,42,42,0.18); color: var(--down); }
.followup-parent-dir-ambiguous { background: rgba(176,90,56,0.18); color: var(--accent); }
.followup-parent-event { color: var(--muted); font-size: 10px; margin-bottom: 4px; }
.followup-parent-depth { color: var(--text-faded); font-size: 9px; letter-spacing: 1px; }

/* --- Title footnote mark on h1 (link [1] → #followup-parent) --- */
.title-footnote-mark {
  font-family: 'Noto Serif KR', serif;
  font-size: 0.45em;
  vertical-align: super;
  margin-left: 6px;
  color: var(--accent);
  text-decoration: none;
}
.title-footnote-mark sup { line-height: 1; }

/* --- Footnote refs (inline ⁽n⁾ markers throughout body) --- */
.fn-ref {
  color: var(--accent);
  text-decoration: none;
  font-size: 0.85em;
  margin-left: 1px;
}
.fn-ref:hover { text-decoration: underline; }

/* --- Bottom footnotes section (통합 출처 리스트) --- */
.footnotes {
  padding: 28px 0 36px;
  margin-top: 24px;
  border-top: 1px solid var(--border-light);
}
.footnotes-title {
  font-family: 'Noto Serif KR', serif;
  font-size: 13px;
  font-weight: 700;
  color: var(--text);
  margin-bottom: 14px;
  letter-spacing: 1px;
}
.footnotes-list {
  margin: 0;
  padding-left: 22px;
  font-size: 10px;
  line-height: 1.8;
  color: var(--text-secondary);
}
.footnotes-item {
  padding: 4px 0;
  word-break: break-all;
}
.footnotes-link {
  color: var(--text-secondary);
  text-decoration: underline;
}
.footnotes-link:hover { color: var(--text); }
.footnotes-text { color: var(--muted); }
.footnotes-item:target {
  background: rgba(176,90,56,0.12);
  border-radius: 3px;
  padding-left: 4px;
}

/* --- Fade-in Animation --- */
.fade-in { opacity: 0; transform: translateY(8px); transition: opacity .5s, transform .5s; }
.fade-in.visible { opacity: 1; transform: none; }

/* --- Responsive --- */
@media (max-width: 700px) {
  .grid-2 { grid-template-columns: 1fr; }
  .hero h1 { font-size: 24px; }
  .data-table { font-size: 10px; }
}
@media (max-width: 540px) {
  .hero { padding: 36px 12px 28px; }
  section { padding: 32px 0 24px; }
  .player-card, .card { padding: 12px; }
}

/* ============================================================ */
/* === V3 Step 3 — Block Rendering System (append-only)        === */
/* === 디자인 토큰(--text-primary, --gold, --red 등) 재사용     === */
/* ============================================================ */

.report-block-section { padding: 28px 0 24px; border-bottom: 1px solid var(--border-light); }
.report-block-section-empty { color: var(--text-muted); font-size: 11px; padding: 8px 0; font-style: italic; }
.report-block-key-summary-section { padding: 28px 0 24px; border-bottom: 1px solid var(--border-light); }
.report-block-fallback { padding: 32px 0; }
.hero-eyebrow { font-size: 9px; letter-spacing: 3px; text-transform: uppercase; color: var(--text-faded); margin-bottom: 8px; font-family: 'Noto Serif KR', serif; font-style: italic; }
.footer-confidence { max-width: 600px; margin: 0 auto 10px; color: var(--text-faded); font-size: 10px; }
.footer-share { margin-top: 10px; font-size: 11px; }
.footer-share span { color: rgba(255,255,255,.5); }

/* --- narrative --- */
.block-narrative { margin-bottom: 14px; }
.block-narrative-title { font-weight: 700; font-size: 12px; margin-bottom: 6px; color: var(--text-primary); }
.block-narrative-body { font-size: 11px; color: var(--text-secondary); line-height: 1.7; }
.block-narrative-empty { font-size: 10px; color: var(--text-muted); font-style: italic; }

/* --- claim_card --- */
.block-claim-card { background: var(--card); border-left: 3px solid var(--gold); border-radius: 0 var(--radius) var(--radius) 0; padding: 12px 14px; margin: 12px 0; }
.block-claim-card-header { display: flex; gap: 10px; align-items: center; margin-bottom: 6px; flex-wrap: wrap; }
.block-claim-card-id { font-size: 9px; font-weight: 700; color: var(--gold); letter-spacing: 0.5px; }
.block-claim-card-type { font-size: 9px; color: var(--text-muted); padding: 1px 6px; border: 1px solid var(--border); border-radius: 4px; }
.block-claim-card-confidence { font-size: 10px; color: var(--blue); font-weight: 600; margin-left: auto; }
.block-claim-card-statement { font-size: 12px; color: var(--text-primary); line-height: 1.6; margin-bottom: 6px; }
.block-claim-card-evidence { font-size: 10px; color: var(--text-secondary); }
.block-claim-card-evidence-label { color: var(--text-muted); margin-right: 4px; }
.block-claim-card-evidence-id { display: inline-block; padding: 1px 5px; margin: 1px 2px; background: var(--accent); border-radius: 3px; font-size: 9px; color: var(--bg); }
.block-claim-card-evidence-missing { font-size: 10px; color: var(--orange); font-style: italic; }

/* --- evidence_table --- */
.block-evidence-table { margin: 12px 0; overflow-x: auto; }
.block-evidence-table-title { font-weight: 700; font-size: 12px; margin-bottom: 8px; color: var(--text-primary); }
.block-evidence-table-grid { width: 100%; border-collapse: collapse; font-size: 10px; }
.block-evidence-table-th { background: var(--card); color: var(--text-muted); padding: 8px 10px; text-align: left; font-weight: 600; border-bottom: 1px solid var(--border); }
.block-evidence-table-row td { padding: 8px 10px; border-bottom: 1px solid var(--border-light); color: var(--text-secondary); }
.block-evidence-table-id { color: var(--gold); font-weight: 600; }
.block-evidence-table-quote { line-height: 1.6; }
.block-evidence-table-link { color: var(--blue); text-decoration: none; }
.block-evidence-table-reliability { font-size: 9px; padding: 2px 6px; border-radius: 3px; display: inline-block; }
.block-evidence-table-rel-primary { background: var(--green-light); color: var(--green); }
.block-evidence-table-rel-secondary { background: var(--blue-light); color: var(--blue); }
.block-evidence-table-rel-expert { background: var(--gold); color: var(--bg); }
.block-evidence-table-rel-model_inference { background: var(--orange-light); color: var(--orange); }
.block-evidence-table-empty { font-size: 10px; color: var(--text-muted); padding: 12px 0; font-style: italic; }

/* --- timeline --- */
.block-timeline { margin: 12px 0; }
.block-timeline-title { font-weight: 700; font-size: 12px; margin-bottom: 8px; color: var(--text-primary); }
.block-timeline-list { list-style: none; padding: 0; margin: 0; }
.block-timeline-item { display: flex; gap: 12px; align-items: baseline; padding: 8px 0; border-bottom: 1px solid var(--border-light); font-size: 11px; line-height: 1.6; }
.block-timeline-item:last-child { border-bottom: 0; }
.block-timeline-date { color: var(--blue); font-weight: 600; min-width: 110px; flex-shrink: 0; white-space: nowrap; }
.block-timeline-event { color: var(--text-secondary); flex: 1; }
.block-timeline-impact { color: var(--red); font-weight: 600; margin-left: 6px; }
.block-timeline-empty { font-size: 10px; color: var(--text-muted); font-style: italic; }

/* --- matrix --- */
.block-matrix { margin: 12px 0; overflow-x: auto; }
.block-matrix-title { font-weight: 700; font-size: 12px; margin-bottom: 8px; color: var(--text-primary); }
.block-matrix-grid { width: 100%; border-collapse: collapse; font-size: 10px; }
.block-matrix-corner { background: var(--card); border: 1px solid var(--border); padding: 8px; }
.block-matrix-col { background: var(--card); color: var(--text-primary); padding: 8px; border: 1px solid var(--border); font-weight: 600; }
.block-matrix-row-label { background: var(--card); color: var(--text-primary); padding: 8px; border: 1px solid var(--border); font-weight: 600; text-align: left; }
.block-matrix-cell { padding: 8px; border: 1px solid var(--border-light); color: var(--text-secondary); }
.block-matrix-empty { font-size: 10px; color: var(--text-muted); font-style: italic; }

/* --- actor_cards --- */
.block-actor-cards { margin: 12px 0; }
.block-actor-cards-title { font-weight: 700; font-size: 12px; margin-bottom: 8px; color: var(--text-primary); }
.block-actor-cards-grid { display: grid; grid-template-columns: 1fr; gap: 10px; }
@media (min-width: 540px) { .block-actor-cards-grid { grid-template-columns: 1fr 1fr; } }
.block-actor-cards-card { background: var(--card); border-radius: var(--radius); padding: 12px; border-left: 3px solid var(--gold); }
.block-actor-cards-risk-극심 { border-left-color: var(--red); }
.block-actor-cards-risk-높음 { border-left-color: var(--orange); }
.block-actor-cards-risk-보통 { border-left-color: var(--gold); }
.block-actor-cards-risk-낮음 { border-left-color: var(--green); }
.block-actor-cards-header { display: flex; gap: 8px; align-items: center; margin-bottom: 6px; flex-wrap: wrap; }
.block-actor-cards-emoji { font-size: 16px; }
.block-actor-cards-name { font-weight: 700; font-size: 12px; color: var(--text-primary); }
.block-actor-cards-role { font-size: 9px; padding: 2px 6px; background: var(--accent); border-radius: 3px; color: var(--bg); font-weight: 600; }
.block-actor-cards-position { font-size: 11px; color: var(--text-secondary); margin-bottom: 6px; line-height: 1.6; }
.block-actor-cards-detail { font-size: 10px; color: var(--text-muted); margin: 3px 0; line-height: 1.6; }
.block-actor-cards-empty { font-size: 10px; color: var(--text-muted); font-style: italic; }

/* --- flow_chain --- */
.block-flow-chain { margin: 12px 0; }
.block-flow-chain-title { font-weight: 700; font-size: 12px; margin-bottom: 8px; color: var(--text-primary); }
.block-flow-chain-list { list-style: none; padding: 0; margin: 0; }
.block-flow-chain-step { background: var(--card); border-radius: var(--radius); padding: 10px 12px; margin-bottom: 8px; border-left: 3px solid var(--gold); position: relative; }
.block-flow-chain-step:not(:last-child)::after { content: '↓'; position: absolute; left: 50%; bottom: -16px; transform: translateX(-50%); color: var(--text-muted); font-size: 12px; }
.block-flow-chain-sev-high { border-left-color: var(--red); }
.block-flow-chain-sev-medium { border-left-color: var(--orange); }
.block-flow-chain-sev-low { border-left-color: var(--gold); }
.block-flow-chain-header { display: flex; gap: 8px; align-items: baseline; margin-bottom: 4px; }
.block-flow-chain-num { font-weight: 700; color: var(--gold); font-size: 11px; }
.block-flow-chain-title-text { font-weight: 700; font-size: 11px; color: var(--text-primary); }
.block-flow-chain-desc { font-size: 11px; color: var(--text-secondary); line-height: 1.6; margin: 4px 0; }
.block-flow-chain-meta { display: flex; gap: 12px; font-size: 9px; color: var(--text-muted); flex-wrap: wrap; }
.block-flow-chain-empty { font-size: 10px; color: var(--text-muted); font-style: italic; }

/* --- scenario_table --- */
.block-scenario-table { margin: 12px 0; overflow-x: auto; }
.block-scenario-table-title { font-weight: 700; font-size: 12px; margin-bottom: 8px; color: var(--text-primary); }
.block-scenario-table-grid { width: 100%; border-collapse: collapse; font-size: 10px; }
.block-scenario-table-th { background: var(--card); color: var(--text-muted); padding: 8px 10px; text-align: left; font-weight: 600; border-bottom: 1px solid var(--border); }
.block-scenario-table-row td { padding: 8px 10px; border-bottom: 1px solid var(--border-light); color: var(--text-secondary); vertical-align: top; }
.block-scenario-table-name strong { color: var(--text-primary); font-size: 11px; }
.block-scenario-table-tag { font-size: 9px; color: var(--gold); }
.block-scenario-table-tag-최선 { border-left: 2px solid var(--green); }
.block-scenario-table-tag-악화 { border-left: 2px solid var(--orange); }
.block-scenario-table-tag-최악 { border-left: 2px solid var(--red); }
.block-scenario-table-prob { font-weight: 700; color: var(--text-primary); }
.block-scenario-table-empty { font-size: 10px; color: var(--text-muted); font-style: italic; }

/* --- decomposition --- */
.block-decomposition { margin: 12px 0; }
.block-decomposition-title { font-weight: 700; font-size: 12px; margin-bottom: 8px; color: var(--text-primary); }
.block-decomposition-root { font-weight: 700; font-size: 13px; color: var(--gold); padding: 10px 12px; background: var(--card); border-radius: var(--radius); margin-bottom: 8px; }
.block-decomposition-tree, .block-decomposition-children { list-style: none; padding-left: 16px; margin: 0; border-left: 1px dashed var(--border); }
.block-decomposition-node { padding: 6px 0 6px 12px; position: relative; }
.block-decomposition-node::before { content: '─'; position: absolute; left: -1px; top: 12px; color: var(--border); }
.block-decomposition-label { font-weight: 600; font-size: 11px; color: var(--text-primary); }
.block-decomposition-detail { font-size: 10px; color: var(--text-secondary); line-height: 1.6; margin-top: 2px; }
.block-decomposition-depth-1 .block-decomposition-label { color: var(--gold); }
.block-decomposition-depth-2 .block-decomposition-label { color: var(--blue); }
.block-decomposition-empty { font-size: 10px; color: var(--text-muted); font-style: italic; }

/* --- argument_pair --- */
.block-argument-pair { margin: 12px 0; }
.block-argument-pair-title { font-weight: 700; font-size: 12px; margin-bottom: 8px; color: var(--text-primary); }
.block-argument-pair-grid { display: grid; grid-template-columns: 1fr; gap: 10px; }
@media (min-width: 700px) { .block-argument-pair-grid { grid-template-columns: 1fr 1fr; } }
.block-argument-pair-side { background: var(--card); padding: 12px; border-radius: var(--radius); border-top: 3px solid var(--gold); }
.block-argument-pair-side-a { border-top-color: var(--blue); }
.block-argument-pair-side-b { border-top-color: var(--orange); }
.block-argument-pair-label { font-size: 9px; text-transform: uppercase; letter-spacing: 1px; color: var(--text-muted); margin-bottom: 6px; }
.block-argument-pair-text { font-size: 11px; color: var(--text-primary); line-height: 1.6; }
.block-argument-pair-alignment { margin-top: 10px; padding: 10px 12px; background: var(--accent); border-radius: var(--radius); font-size: 10px; }
.block-argument-pair-alignment-title { font-weight: 700; color: var(--gold); margin-bottom: 4px; font-size: 10px; }
.block-argument-pair-alignment-list { padding-left: 16px; margin: 0; color: var(--text-secondary); }

/* --- data_series --- */
.block-data-series { margin: 12px 0; }
.block-data-series-title { font-weight: 700; font-size: 12px; margin-bottom: 8px; color: var(--text-primary); }
.block-data-series-unit { font-size: 10px; color: var(--text-muted); font-weight: 400; }
.block-data-series-grid { display: grid; grid-template-columns: 1fr; gap: 10px; }
@media (min-width: 540px) { .block-data-series-grid { grid-template-columns: 1fr 1fr; } }
.block-data-series-card { background: var(--card); padding: 10px 12px; border-radius: var(--radius); }
.block-data-series-label { font-weight: 700; font-size: 11px; color: var(--text-primary); margin-bottom: 6px; }
.block-data-series-table { width: 100%; border-collapse: collapse; font-size: 10px; }
.block-data-series-table th { color: var(--text-muted); text-align: left; padding: 4px 6px; font-weight: 600; border-bottom: 1px solid var(--border-light); }
.block-data-series-table td { padding: 4px 6px; color: var(--text-secondary); }
.block-data-series-x { color: var(--text-muted); }
.block-data-series-y { font-weight: 600; color: var(--text-primary); }
.block-data-series-empty { font-size: 10px; color: var(--text-muted); font-style: italic; }

/* --- watchlist --- */
.block-watchlist { margin: 12px 0; }
.block-watchlist-title { font-weight: 700; font-size: 12px; margin-bottom: 8px; color: var(--text-primary); }
.block-watchlist-grid { display: grid; grid-template-columns: 1fr; gap: 8px; }
@media (min-width: 540px) { .block-watchlist-grid { grid-template-columns: 1fr 1fr; } }
.block-watchlist-item { display: flex; gap: 10px; padding: 10px 12px; background: var(--card); border-radius: var(--radius); border-left: 3px solid var(--gold); }
.block-watchlist-dir-confirms_base { border-left-color: var(--green); }
.block-watchlist-dir-rejects_base { border-left-color: var(--red); }
.block-watchlist-dir-ambiguous { border-left-color: var(--gold); }
.block-watchlist-icon { font-size: 18px; flex-shrink: 0; }
.block-watchlist-body { flex: 1; }
.block-watchlist-signal { font-weight: 700; font-size: 11px; color: var(--text-primary); }
.block-watchlist-desc { font-size: 10px; color: var(--text-secondary); line-height: 1.6; margin-top: 2px; }
.block-watchlist-indicates { font-size: 10px; color: var(--blue); margin-top: 2px; }
.block-watchlist-deadline { font-size: 9px; color: var(--text-muted); margin-top: 4px; }
.block-watchlist-empty { font-size: 10px; color: var(--text-muted); font-style: italic; }

/* --- qna --- */
.block-qna { margin: 12px 0; }
.block-qna-title { font-weight: 700; font-size: 12px; margin-bottom: 8px; color: var(--text-primary); }
.block-qna-list { padding: 0; margin: 0; }
.block-qna-pair { background: var(--card); border-radius: var(--radius); padding: 10px 12px; margin-bottom: 6px; }
.block-qna-q { font-weight: 700; font-size: 11px; color: var(--text-primary); margin-bottom: 4px; }
.block-qna-a { font-size: 11px; color: var(--text-secondary); line-height: 1.6; padding-left: 16px; }
.block-qna-empty { font-size: 10px; color: var(--text-muted); font-style: italic; }

/* --- callout --- */
.block-callout { background: var(--card); border-left: 3px solid var(--gold); border-radius: 0 var(--radius) var(--radius) 0; padding: 12px 14px; margin: 12px 0; }
.block-callout-style-warning { border-left-color: var(--orange); }
.block-callout-style-info { border-left-color: var(--blue); }
.block-callout-style-insight { border-left-color: var(--gold); }
.block-callout-title { font-size: 12px; margin-bottom: 4px; color: var(--text-primary); }
.block-callout-body { font-size: 11px; color: var(--text-muted); line-height: 1.7; }

/* --- counter_hypothesis --- */
.block-counter-hypothesis { background: var(--card); padding: 12px 14px; border-radius: var(--radius); border-left: 3px solid var(--blue); margin: 12px 0; }
.block-counter-hypothesis-title { font-weight: 700; font-size: 12px; margin-bottom: 8px; color: var(--blue); }
.block-counter-hypothesis-base, .block-counter-hypothesis-counter, .block-counter-hypothesis-required { margin: 8px 0; }
.block-counter-hypothesis-label { font-size: 9px; text-transform: uppercase; letter-spacing: 1px; color: var(--text-muted); margin-bottom: 4px; }
.block-counter-hypothesis-text { font-size: 11px; color: var(--text-primary); line-height: 1.6; }
.block-counter-hypothesis-list { padding-left: 18px; margin: 0; font-size: 10px; color: var(--text-secondary); line-height: 1.6; }
.block-counter-hypothesis-conflict { margin-top: 8px; font-size: 10px; color: var(--orange); padding-top: 8px; border-top: 1px solid var(--border-light); }

/* --- decision_matrix --- */
.block-decision-matrix { margin: 12px 0; overflow-x: auto; }
.block-decision-matrix-title { font-weight: 700; font-size: 12px; margin-bottom: 8px; color: var(--text-primary); }
.block-decision-matrix-grid { width: 100%; border-collapse: collapse; font-size: 10px; }
.block-decision-matrix-corner, .block-decision-matrix-criterion { background: var(--card); padding: 8px; border: 1px solid var(--border); color: var(--text-primary); font-weight: 600; }
.block-decision-matrix-option { background: var(--card); padding: 8px; border: 1px solid var(--border); color: var(--text-primary); text-align: left; font-weight: 600; }
.block-decision-matrix-cell { padding: 8px; border: 1px solid var(--border-light); color: var(--text-secondary); text-align: center; }
.block-decision-matrix-rec { margin-top: 8px; padding: 8px 12px; background: var(--accent); border-radius: var(--radius); font-size: 10px; color: var(--bg); font-weight: 600; }
.block-decision-matrix-empty { font-size: 10px; color: var(--text-muted); font-style: italic; }

/* --- risk_matrix --- */
.block-risk-matrix { margin: 12px 0; overflow-x: auto; }
.block-risk-matrix-title { font-weight: 700; font-size: 12px; margin-bottom: 8px; color: var(--text-primary); }
.block-risk-matrix-grid { width: 100%; border-collapse: collapse; font-size: 10px; }
.block-risk-matrix-th { background: var(--card); color: var(--text-muted); padding: 8px 10px; text-align: left; font-weight: 600; border-bottom: 1px solid var(--border); }
.block-risk-matrix-row td { padding: 8px 10px; border-bottom: 1px solid var(--border-light); color: var(--text-secondary); }
.block-risk-matrix-impact-high { border-left: 3px solid var(--red); }
.block-risk-matrix-impact-medium { border-left: 3px solid var(--orange); }
.block-risk-matrix-impact-low { border-left: 3px solid var(--gold); }
.block-risk-matrix-empty { font-size: 10px; color: var(--text-muted); font-style: italic; }

/* ============================================================ */
/* === Mobile readability (PR1', 2026-05-01)                   === */
/* === scenario_grid 등은 charts.css 가 처리. 여기는 timeline 과 === */
/* === evidence/risk_matrix 의 좁은 폭 cram 을 해소.           === */
/* ============================================================ */

@media (max-width: 540px) {
  /* timeline: flex 좌우 → 세로 스택. min-width:110px 의 날짜 칸 해제. */
  .block-timeline-item { flex-direction: column; gap: 2px; padding: 10px 0; align-items: stretch; }
  .block-timeline-date { min-width: 0; white-space: normal; font-size: 10px; }
  .block-timeline-event { font-size: 11px; }
  .block-timeline-impact { margin-left: 0; font-size: 11px; }

  /* table 폰트 10px → 11px (모바일 가독성) */
  .block-evidence-table-grid,
  .block-matrix-grid,
  .block-risk-matrix-grid,
  .block-decision-matrix-grid { font-size: 11px; }

  /* evidence_table / risk_matrix: thead 숨기고 row → 카드, td → 라벨된 행 */
  .block-evidence-table-grid thead,
  .block-risk-matrix-grid thead { display: none; }

  .block-evidence-table-grid,
  .block-evidence-table-grid tbody,
  .block-risk-matrix-grid,
  .block-risk-matrix-grid tbody { display: block; }

  .block-evidence-table-grid tr,
  .block-risk-matrix-grid tr {
    display: block;
    background: var(--card);
    border-radius: var(--radius);
    padding: 10px 12px;
    margin-bottom: 8px;
  }

  .block-evidence-table-grid td,
  .block-risk-matrix-grid td {
    display: block;
    padding: 4px 0;
    border-bottom: 0;
  }

  /* td[data-label] 가 있으면 라벨 표시 (template 갱신 필요) */
  .block-evidence-table-grid td[data-label]::before,
  .block-risk-matrix-grid td[data-label]::before {
    content: attr(data-label) ":  ";
    font-weight: 600;
    color: var(--text-muted);
    font-size: 10px;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin-right: 4px;
  }

  /* matrix 류는 가로 스크롤 유지 (이게 더 읽힘) */
  .block-matrix, .block-decision-matrix { -webkit-overflow-scrolling: touch; }
}

/* ============================================================ */
/* === PR3 (v3.4.6) — Narrative stage badges + AMC warning      === */
/* === 5단 DSL 시각 차별화로 단조로움 직접 해소                   === */
/* ============================================================ */

.section-header { margin-bottom: 16px; }
.section-stage-badge {
  display: inline-block;
  font-size: 9px;
  font-weight: 700;
  letter-spacing: 1.5px;
  text-transform: uppercase;
  padding: 3px 10px;
  border-radius: 12px;
  margin-bottom: 6px;
  border: 1px solid currentColor;
  background: var(--accent);
}
.section-stage-badge.stage-fact       { color: var(--blue); }
.section-stage-badge.stage-mechanism  { color: var(--gold); }
.section-stage-badge.stage-divergence { color: var(--orange); }
.section-stage-badge.stage-decision   { color: var(--green); }
.section-stage-badge.stage-trigger    { color: var(--red); }

/* 섹션 자체에도 좌측 컬러 액센트 — 스크롤하면서 단계 흐름이 한눈에 보이게 */
.report-block-section.stage-fact       { border-left: 2px solid var(--blue);   padding-left: 12px; }
.report-block-section.stage-mechanism  { border-left: 2px solid var(--gold);   padding-left: 12px; }
.report-block-section.stage-divergence { border-left: 2px solid var(--orange); padding-left: 12px; }
.report-block-section.stage-decision   { border-left: 2px solid var(--green);  padding-left: 12px; }
.report-block-section.stage-trigger    { border-left: 2px solid var(--red);    padding-left: 12px; }

/* AMC 미달 경고 배너 */
.report-block-amc-warning {
  margin: 16px 0;
  padding: 12px 16px;
  border: 1px dashed var(--orange);
  border-radius: var(--radius);
  background: var(--orange-light);
}
.amc-warning-badge {
  font-weight: 700;
  font-size: 12px;
  color: var(--orange);
  margin-bottom: 4px;
}
.amc-warning-badge code {
  background: var(--accent);
  padding: 1px 6px;
  border-radius: 3px;
  font-family: 'Courier New', monospace;
  font-size: 11px;
  color: var(--text-primary);
}
.amc-warning-detail {
  font-size: 11px;
  color: var(--text-muted);
  line-height: 1.6;
}
.amc-stage-missing {
  display: inline-block;
  margin: 0 4px;
  padding: 1px 6px;
  border: 1px solid var(--orange);
  border-radius: 4px;
  color: var(--orange);
  font-weight: 600;
  font-size: 10px;
}


/* ═══════════════════════════════════════════════════════════════
   v8.0.0 — 르포(reportage) 전용 테마 8종 (다크 통일). lens_policy.REPORTAGE_THEMES
   와 1:1. 르포일 때만 data-theme 으로 적용 — 일반 보고서 5테마와 완전 분기.
   ═══════════════════════════════════════════════════════════════ */
[data-theme="reportage_cyprus"] {
  --bg: #004741; --card: #0B5349; --card-hover: #156055; --accent-surface: #0B5349;
  --border: #1E5C52; --border-light: #156055; --divider: #1E5C52;
  --text: #F0EDE4; --muted: #9DB5AC;
  --accent: #E3A93C; --up: #86C0A4; --down: #E89070;
  --text-primary: var(--text); --text-secondary: var(--text);
  --text-muted: var(--muted); --text-faded: var(--muted);
  --gold: var(--accent); --gold-light: var(--accent);
  --red: var(--down); --red-light: var(--card);
  --orange: var(--accent); --orange-light: var(--card);
  --green: var(--up); --green-light: var(--card);
  --blue: var(--accent); --blue-light: var(--card);
  --bg-1: var(--bg); --bg-2: var(--card); --bg-3: #003A33; --card-deep: #003A33;
  --fg-1: var(--text); --fg-2: #D8E0D8; --fg-3: var(--muted);
  --border-soft: rgba(255,255,255,0.09);
}
[data-theme="reportage_noturno"] {
  --bg: #001621; --card: #06222E; --card-hover: #0A2A38; --accent-surface: #06222E;
  --border: #1C3A45; --border-light: #0A2A38; --divider: #1C3A45;
  --text: #EFE3D4; --muted: #8AA0A6;
  --accent: #FF4103; --up: #8AC0A0; --down: #FF8A5C;
  --text-primary: var(--text); --text-secondary: var(--text);
  --text-muted: var(--muted); --text-faded: var(--muted);
  --gold: var(--accent); --gold-light: var(--accent);
  --red: var(--down); --red-light: var(--card);
  --orange: var(--accent); --orange-light: var(--card);
  --green: var(--up); --green-light: var(--card);
  --blue: var(--accent); --blue-light: var(--card);
  --bg-1: var(--bg); --bg-2: var(--card); --bg-3: #000E16; --card-deep: #000E16;
  --fg-1: var(--text); --fg-2: #D8E0DC; --fg-3: var(--muted);
  --border-soft: rgba(255,255,255,0.09);
}
[data-theme="reportage_bridal"] {
  --bg: #741A2F; --card: #86283C; --card-hover: #94324A; --accent-surface: #86283C;
  --border: #8E3548; --border-light: #94324A; --divider: #8E3548;
  --text: #FFE2D4; --muted: #C99A92;
  --accent: #FFB38F; --up: #D0A88A; --down: #F2998F;
  --text-primary: var(--text); --text-secondary: var(--text);
  --text-muted: var(--muted); --text-faded: var(--muted);
  --gold: var(--accent); --gold-light: var(--accent);
  --red: var(--down); --red-light: var(--card);
  --orange: var(--accent); --orange-light: var(--card);
  --green: var(--up); --green-light: var(--card);
  --blue: var(--accent); --blue-light: var(--card);
  --bg-1: var(--bg); --bg-2: var(--card); --bg-3: #5E1326; --card-deep: #5E1326;
  --fg-1: var(--text); --fg-2: #F2D0C4; --fg-3: var(--muted);
  --border-soft: rgba(255,255,255,0.09);
}
[data-theme="reportage_cosmos"] {
  --bg: #002F49; --card: #073A56; --card-hover: #0A4564; --accent-surface: #073A56;
  --border: #134A63; --border-light: #0A4564; --divider: #134A63;
  --text: #FEF0D5; --muted: #8BA3B2;
  --accent: #E8503F; --up: #88B888; --down: #C9837A;
  --text-primary: var(--text); --text-secondary: var(--text);
  --text-muted: var(--muted); --text-faded: var(--muted);
  --gold: var(--accent); --gold-light: var(--accent);
  --red: var(--down); --red-light: var(--card);
  --orange: var(--accent); --orange-light: var(--card);
  --green: var(--up); --green-light: var(--card);
  --blue: var(--accent); --blue-light: var(--card);
  --bg-1: var(--bg); --bg-2: var(--card); --bg-3: #00263B; --card-deep: #00263B;
  --fg-1: var(--text); --fg-2: #E6D8C0; --fg-3: var(--muted);
  --border-soft: rgba(255,255,255,0.09);
}
[data-theme="reportage_laurel"] {
  --bg: #0D3A35; --card: #164640; --card-hover: #1E5249; --accent-surface: #164640;
  --border: #27534A; --border-light: #1E5249; --divider: #27534A;
  --text: #FBF6F0; --muted: #9CB5AC;
  --accent: #86C0A4; --up: #86C0A4; --down: #E2937A;
  --text-primary: var(--text); --text-secondary: var(--text);
  --text-muted: var(--muted); --text-faded: var(--muted);
  --gold: var(--accent); --gold-light: var(--accent);
  --red: var(--down); --red-light: var(--card);
  --orange: var(--accent); --orange-light: var(--card);
  --green: var(--up); --green-light: var(--card);
  --blue: var(--accent); --blue-light: var(--card);
  --bg-1: var(--bg); --bg-2: var(--card); --bg-3: #082E2A; --card-deep: #082E2A;
  --fg-1: var(--text); --fg-2: #DCE6E0; --fg-3: var(--muted);
  --border-soft: rgba(255,255,255,0.09);
}
[data-theme="reportage_princess"] {
  --bg: #015AA0; --card: #0A66AC; --card-hover: #1572B8; --accent-surface: #0A66AC;
  --border: #2A74B6; --border-light: #1572B8; --divider: #2A74B6;
  --text: #ECECFF; --muted: #AEC4E0;
  --accent: #FF9457; --up: #88C0B0; --down: #FF8378;
  --text-primary: var(--text); --text-secondary: var(--text);
  --text-muted: var(--muted); --text-faded: var(--muted);
  --gold: var(--accent); --gold-light: var(--accent);
  --red: var(--down); --red-light: var(--card);
  --orange: var(--accent); --orange-light: var(--card);
  --green: var(--up); --green-light: var(--card);
  --blue: var(--accent); --blue-light: var(--card);
  --bg-1: var(--bg); --bg-2: var(--card); --bg-3: #014A85; --card-deep: #014A85;
  --fg-1: var(--text); --fg-2: #D8E0F5; --fg-3: var(--muted);
  --border-soft: rgba(255,255,255,0.09);
}
[data-theme="reportage_steel"] {
  --bg: #282433; --card: #332E41; --card-hover: #3D374D; --accent-surface: #332E41;
  --border: #453F56; --border-light: #3D374D; --divider: #453F56;
  --text: #F3E0D9; --muted: #B0A8BE;
  --accent: #E2B25C; --up: #A0C090; --down: #E89C94;
  --text-primary: var(--text); --text-secondary: var(--text);
  --text-muted: var(--muted); --text-faded: var(--muted);
  --gold: var(--accent); --gold-light: var(--accent);
  --red: var(--down); --red-light: var(--card);
  --orange: var(--accent); --orange-light: var(--card);
  --green: var(--up); --green-light: var(--card);
  --blue: var(--accent); --blue-light: var(--card);
  --bg-1: var(--bg); --bg-2: var(--card); --bg-3: #1E1B27; --card-deep: #1E1B27;
  --fg-1: var(--text); --fg-2: #E0D4DC; --fg-3: var(--muted);
  --border-soft: rgba(255,255,255,0.09);
}
[data-theme="reportage_navy"] {
  --bg: #0F0E49; --card: #1A1860; --card-hover: #24226E; --accent-surface: #1A1860;
  --border: #2D2B79; --border-light: #24226E; --divider: #2D2B79;
  --text: #ECE6F5; --muted: #B0AED4;
  --accent: #D9ABE8; --up: #A0C0B0; --down: #F08AB0;
  --text-primary: var(--text); --text-secondary: var(--text);
  --text-muted: var(--muted); --text-faded: var(--muted);
  --gold: var(--accent); --gold-light: var(--accent);
  --red: var(--down); --red-light: var(--card);
  --orange: var(--accent); --orange-light: var(--card);
  --green: var(--up); --green-light: var(--card);
  --blue: var(--accent); --blue-light: var(--card);
  --bg-1: var(--bg); --bg-2: var(--card); --bg-3: #0A0934; --card-deep: #0A0934;
  --fg-1: var(--text); --fg-2: #DCD6EC; --fg-3: var(--muted);
  --border-soft: rgba(255,255,255,0.09);
}

/* 르포 전용 폰트 — G마켓 Sans(디스플레이) + Noto Sans(본문). 일반 보고서는 영향 없음. */
@font-face{font-family:'GmarketSans';font-weight:700;font-style:normal;src:url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2001@1.1/GmarketSansBold.woff') format('woff');font-display:swap}
@font-face{font-family:'GmarketSans';font-weight:500;font-style:normal;src:url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2001@1.1/GmarketSansMedium.woff') format('woff');font-display:swap}

/* 르포: 본문 Noto Sans, 헤드라인/키커/소제목 G마켓 Sans */
[data-theme^="reportage_"],
[data-theme^="reportage_"] .freeform-prose,
[data-theme^="reportage_"] .freeform-deck,
[data-theme^="reportage_"] .freeform-lede,
[data-theme^="reportage_"] body{font-family:'Noto Sans KR','IBM Plex Sans KR',sans-serif !important}
[data-theme^="reportage_"] .freeform-headline,
[data-theme^="reportage_"] .freeform-heading,
[data-theme^="reportage_"] .freeform-kicker,
[data-theme^="reportage_"] .freeform-eyebrow,
[data-theme^="reportage_"] h1,
[data-theme^="reportage_"] h2,
[data-theme^="reportage_"] h3{font-family:'GmarketSans','Noto Sans KR',sans-serif !important;letter-spacing:-0.01em}

/* 르포: 플랫 미니멀 — 둥근 모서리/그림자 제거 */
[data-theme^="reportage_"] .freeform-figure,
[data-theme^="reportage_"] .chart-card,
[data-theme^="reportage_"] .freeform-fact-grid > *,
[data-theme^="reportage_"] .freeform-pullquote,
[data-theme^="reportage_"] .freeform-analogy,
[data-theme^="reportage_"] .freeform-origin,
[data-theme^="reportage_"] figure,
[data-theme^="reportage_"] img,
[data-theme^="reportage_"] [class*="card"]{border-radius:0 !important;box-shadow:none !important}

/* 르포 [르포] 배지 (헤더 eyebrow). 본문 텍스트 아님 — UI 라벨. */
.reportage-badge{display:inline-block;font-family:'GmarketSans',sans-serif;font-weight:700;font-size:11px;letter-spacing:0.12em;padding:3px 9px;border:1px solid var(--accent);color:var(--accent);margin-right:10px;vertical-align:middle}


/* v8.0.0 — 르포 테마 지도(globe) 색 변수. 없으면 :root(라이트)를 상속해 크림색으로 나옴. */
[data-theme="reportage_cyprus"]{--map-water:#003A33;--map-land:#156055;--map-boundary:#1E5C52}
[data-theme="reportage_noturno"]{--map-water:#000E16;--map-land:#0A2A38;--map-boundary:#1C3A45}
[data-theme="reportage_bridal"]{--map-water:#5E1326;--map-land:#94324A;--map-boundary:#8E3548}
[data-theme="reportage_cosmos"]{--map-water:#00263B;--map-land:#0A4564;--map-boundary:#134A63}
[data-theme="reportage_laurel"]{--map-water:#082E2A;--map-land:#1E5249;--map-boundary:#27534A}
[data-theme="reportage_princess"]{--map-water:#014A85;--map-land:#1572B8;--map-boundary:#2A74B6}
[data-theme="reportage_steel"]{--map-water:#1E1B27;--map-land:#3D374D;--map-boundary:#453F56}
[data-theme="reportage_navy"]{--map-water:#0A0934;--map-land:#24226E;--map-boundary:#2D2B79}
