/* 記事共通ビジュアル強化 */

/* color-scheme はメタタグで light dark 指定 */
html { color-scheme: light dark; }

/* ========== data-table セル内バー ========== */
.data-table td.has-bar { position: relative; }
.data-table .cell-bar {
  display: block;
  height: 4px;
  background: #eef2f8;
  border-radius: 999px;
  margin-top: 6px;
  overflow: hidden;
}
.data-table .cell-bar-fill {
  display: block;
  height: 100%;
  background: linear-gradient(90deg, #1a4fa0, #7c3aed);
  border-radius: 999px;
  transition: width 0.6s ease;
}

/* ========== セクション冒頭 KEY POINT（視認性強化） ========== */
.art-body .sec-lede {
  position: relative;
  background: linear-gradient(135deg, #e8f0ff 0%, #d5e4fa 100%);
  border: 1px solid #b5cdf0;
  border-left: 4px solid #1a4fa0;
  padding: 18px 20px 16px;
  border-radius: 0 10px 10px 0;
  margin: 0 0 22px;
  font-weight: 500;
  color: #0f1a3a;
  line-height: 1.85;
  box-shadow: 0 2px 10px -4px rgba(26, 79, 160, 0.15);
}
.art-body .sec-lede::before {
  content: "KEY POINT";
  display: inline-block;
  font-size: 0.64rem;
  font-weight: 900;
  letter-spacing: 0.18em;
  color: #fff;
  background: linear-gradient(90deg, #1a4fa0, #7c3aed);
  padding: 4px 10px;
  border-radius: 3px;
  margin-right: 12px;
  margin-bottom: 6px;
  vertical-align: 2px;
}

/* ========== strong ハイライト（ライトモード） ========== */
.art-body p strong,
.art-body li strong {
  color: #1a4fa0;
  font-weight: 800;
  background: linear-gradient(transparent 62%, #ffe58a 62%, #ffe58a 92%, transparent 92%);
  padding: 0 2px;
}
.data-table strong { color: #1a4fa0; font-weight: 900; background: none; padding: 0; }

/* data-table 磨き */
.data-table {
  border-radius: 10px;
  overflow: hidden;
  box-shadow: 0 2px 8px rgba(0,0,0,0.06);
}
.data-table th {
  font-size: 0.82rem;
  letter-spacing: 0.04em;
}

/* ===================================================== */
/* ダークモード: 全体を暗めにしつつ視認性を高める        */
/* ===================================================== */
@media (prefers-color-scheme: dark) {

  /* ベース */
  html, body {
    background-color: #0b1020 !important;
    color: #d8dfef !important;
  }

  /* 本文領域 */
  .art-layout, .art-body, .blog-wrap, .main-content, .blog-main, .container {
    background-color: transparent !important;
  }

  /* 本文テキスト */
  .art-body p, .art-body li, .art-body,
  main p, main li,
  .post-excerpt, .article-excerpt {
    color: #d8dfef !important;
  }

  /* ===== 重要：strong は黄色マーカーをやめ、薄紫下地＋明るい紫文字 ===== */
  /* 白文字と黄色下線が被って読みにくくなる問題を解消 */
  .art-body p strong,
  .art-body li strong {
    color: #c4b5fd !important;
    background: rgba(139, 92, 246, 0.18) !important;
    padding: 1px 5px !important;
    border-radius: 3px !important;
  }
  .data-table strong { color: #c4b5fd !important; background: none !important; }

  /* ===== KEY POINTリード ===== */
  .art-body .sec-lede {
    background: linear-gradient(135deg, #141828, #181c2e) !important;
    border-left-color: #a78bfa !important;
    color: #e4e8f4 !important;
  }
  .art-body .sec-lede::before {
    background: rgba(167,139,250,0.2) !important;
    color: #c4b5fd !important;
  }

  /* ===== 見出し ===== */
  .sec-head { border-bottom-color: #2a3150 !important; }
  .sec-head h2 { color: #f1f5ff !important; }
  .sec-head-en { color: #5a6488 !important; }
  .sec-sub { color: #f1f5ff !important; border-left-color: #a78bfa !important; }

  /* ===== data-table ===== */
  .data-table {
    box-shadow: 0 4px 14px -4px rgba(0,0,0,0.5) !important;
    border: 1px solid #2a3150 !important;
  }
  .data-table td {
    background-color: #141828 !important;
    color: #d8dfef !important;
    border-bottom-color: #242a44 !important;
  }
  .data-table tr:nth-child(even) td { background-color: #181c2e !important; }
  .data-table .cell-bar { background: #242a44 !important; }
  .data-table .cell-bar-fill { background: linear-gradient(90deg, #7dd3fc, #a78bfa) !important; }

  /* ===== summary-box / hlbox ===== */
  .summary-box {
    background: linear-gradient(135deg, #141828, #181c2e) !important;
    border-color: #2a3150 !important;
    border-left-color: #a78bfa !important;
  }
  .summary-box-title { color: #a78bfa !important; }
  .summary-box li { color: #d8dfef !important; }
  .hlbox {
    background: linear-gradient(135deg, #1f1a0a, #2a2208) !important;
    border-color: rgba(217,119,6,0.45) !important;
    border-left-color: #fbbf24 !important;
  }
  .hlbox p { color: #fcd34d !important; }

  /* ===== 関連記事 ===== */
  .related-head {
    color: #a78bfa !important;
    border-bottom-color: #2a3150 !important;
  }
  .related-item {
    background: #141828 !important;
    border-color: #2a3150 !important;
  }
  .related-title { color: #f1f5ff !important; }

  /* ===== サイドバー ===== */
  .sidebar-toc {
    background: linear-gradient(145deg, #141828, #0f1322) !important;
    border-color: #2a3150 !important;
  }
  .sidebar-toc-label { color: #a78bfa !important; }
  .toc-list a { color: #b9c1d9 !important; }
  .toc-list a:hover { color: #c4b5fd !important; }
  .toc-list li { border-bottom-color: #2a3150 !important; }
  .toc-n { color: #a78bfa !important; }
  .sidebar-meta { background: #141828 !important; border-color: #2a3150 !important; }
  .sidebar-meta-label { color: #a78bfa !important; }
  .tag-pill { background: #1a1f35 !important; color: #b9c1d9 !important; border-color: #2a3150 !important; }

  /* ===== サイトヘッダー ===== */
  .site-header {
    background: #0b1020 !important;
    border-bottom: 1px solid #2a3150 !important;
  }
  .logo-main { color: #f1f5ff !important; }
  .logo-sub { color: #8a93ac !important; }
  .site-nav a { color: #b9c1d9 !important; }
  .site-nav a.active { color: #c4b5fd !important; }

  /* ===== パンくず ===== */
  .breadcrumb { background: #0f1322 !important; }
  .breadcrumb-inner a, .breadcrumb-inner span { color: #b9c1d9 !important; }
  .breadcrumb-sep { color: #5a6488 !important; }

  /* ===== フッター ===== */
  .site-footer { background: #0b1020 !important; border-top: 1px solid #2a3150 !important; }
  .footer-copy { color: #8a93ac !important; }

  /* ===== 記事一覧のカード ===== */
  .article-list-item, .article-card, .post-card {
    background: #141828 !important;
    border-color: #2a3150 !important;
  }
  .article-list-title, .article-title, .post-title { color: #f1f5ff !important; }
  .article-category, .post-cat { background: rgba(167,139,250,0.2) !important; color: #c4b5fd !important; }
  .article-date, .post-date { color: #8a93ac !important; }

  /* ===== TOP ヒーロー・ゲート ===== */
  .site-hero { background: linear-gradient(135deg, #0b1020, #1a1f35) !important; }
  .gate-card { background: #141828 !important; border-color: #2a3150 !important; }
  .gate-label { color: #a78bfa !important; }

  /* ===== 画像は少し暗めに ===== */
  img { filter: brightness(0.92); }
  .art-hero-thumb, .art-thumb-img { filter: brightness(0.85) saturate(1.05); }

  /* ===== disclaimer ===== */
  .disclaimer {
    background: rgba(217,119,6,0.1) !important;
    color: #fcd34d !important;
    border-color: rgba(217,119,6,0.4) !important;
  }

  /* ===== ul/ol の good-list / bad-list ===== */
  .good-list li { color: #86efac !important; }
  .bad-list li { color: #fca5a5 !important; }
}

/* ========== モバイル追加調整 ========== */
@media (max-width: 560px) {
  .stat-card-number { font-size: 1.9rem !important; }
  .stock-ticker { font-size: 1.4rem !important; }
  .timeline { padding: 0 6px !important; }
  .tl-label { font-size: 0.68rem !important; }
  .tl-year { font-size: 0.88rem !important; }
  .hero-summary { padding: 22px 20px !important; border-radius: 14px !important; }
  .hero-summary h2 { font-size: 1.1rem !important; }
  .matrix { padding: 22px 18px !important; border-radius: 14px !important; }
  .matrix h3 { font-size: 1.05rem !important; }
  .art-body p { font-size: 0.93rem !important; line-height: 1.9 !important; }
  .q-section-head h2, .sec-head h2 { font-size: 1.08rem !important; }
  .q-section-num { font-size: 1.5rem !important; }
}