/* ========================================
 * ソニリアと世界観（ID:11）: ④ マッピング
 * 読み込み順: 子テーマstyle.cssより後（functions.php で登録）
 *
 * 現在のマッピングセクションは style.css の既存ルール
 * （.page-id-11 #section-mapping 等）を継承しています。
 * セクション固有の調整が必要になった場合はここに追記してください。
 * 温存: 2026-08-30 font-unify plan 1788064902319 — overflow-wrap:anywhere(129,344,390) / white-space:nowrap(327 timeline-date) は意図ありとして温存
 * ======================================== */

/* マッピング2カラム比率（左: 画像50% / 右: テキスト50%） */
.page-id-11 .creation-two-column > .character-mapping-media {
  flex: 0 0 calc(50% - 0.75em) !important;
  max-width: calc(50% - 0.75em);
}

.page-id-11 .creation-two-column > .character-mapping-text {
  flex: 0 0 calc(50% - 0.75em) !important;
  max-width: calc(50% - 0.75em);
}

/* マッピング図プレースホルダー（二重マット額縁 + ヒーロー背景） — section-soniria/top-soniria準拠
   高さは下の「プレースホルダー高さポリシー」セクションで一元管理 */
.page-id-11 .character-placeholder-mapping {
  position: relative;
  isolation: isolate;
  display: block;
  width: 100%;
  overflow: hidden;
  border-radius: 8px;
  border: 1px solid var(--color-border, #DCE6EE);
  background:
    linear-gradient(rgba(255,255,255,0.20), rgba(255,255,255,0.20)),
    linear-gradient(135deg, #8ED1E0 0%, #BBB7DA 50%, #F3FAFD 100%);
  box-shadow:
    0 1px 3px rgba(31,32,65,0.06),
    0 6px 16px rgba(31,32,65,0.06),
    inset 0 0 0 1px rgba(255,255,255,0.90);
  box-sizing: border-box;
}

.page-id-11 .character-placeholder-mapping::before {
  content: "";
  position: absolute;
  inset: 0;
  padding: 7px;
  background: rgba(255,255,255,0.5);
  backdrop-filter: blur(4px);
  -webkit-backdrop-filter: blur(4px);
  border-radius: 8px;
  mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
  mask-composite: exclude;
  -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
  -webkit-mask-composite: xor;
  pointer-events: none;
  z-index: 1;
}

.page-id-11 .character-placeholder-mapping::after {
  content: "";
  position: absolute;
  inset: 7px;
  border: 1px solid var(--color-fuji, #BBB7DA);
  border-radius: 6px;
  pointer-events: none;
  z-index: 2;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,0.65);
}

/* ========================================
 * ④ マッピング ─ プレースホルダー高さポリシー(唯一の高さ制御箇所)
 * 追加日: 2026-08-25 — .kilo/plans/1787665231431-mapping-hint-clearance-plan.md
 * 方針: SVG viewBox を 640x392 へ拡張し下部にヒント専用帯(62単位)を予約。
 *       aspect-ratio を「重なり回避の最小高」として全BPで保証。
 *       比率のBP差は --mapping-ratio の差し替えのみ。flex挙動は下の2ブロック。
 * ======================================== */
.page-id-11 .character-placeholder-mapping {
  --mapping-ratio: 640 / 392;
  aspect-ratio: var(--mapping-ratio);
}
/* moved to css/responsive-768.css:APPEND [768] (plan 1790697927646 V008) - SP isolation */



/* ========================================
 * ④ マッピング ─ 画像エリア内 白背景の垂直中央揃え
 * 更新日: 2026-08-29 — .kilo/plans/1787999304366-mapping-image-vertical-centering-fix.md / 1788015605182-829-mapping-copyright-augmentation-plan.md
 * 方式: SVG内で幾何中央化（層 y=9）。CSS移動による調整は不要のため撤去。
 *       ヒント .mapping-hint と額縁 ::before/::after は移動しない。
 *       基準A: 白上端〜額縁内側上端 ≒ 白下端〜ヒント上端 (|diff|≤4px)
 *       計算式: y = (viewBox高392 - ヒント帯62 - 層高312) / 2 = 9
 *       将来ヒント font-size 変更時は y = (392-62-312)/2 を再計算すること。
 *       SVG相似で伸長しても中央は保たれるため --mapping-ratio / flex:1 1 auto は維持。
 * ======================================== */

  /* カラム共通 */
 .page-id-11 .character-mapping-media,
 .page-id-11 .character-mapping-text {
   display: flex;
   flex-direction: column;
   gap: 0.5em;
 }

 /* マッピング説明ボックス */
 .page-id-11 .character-mapping-media .mapping-description-box {
   width: 100%;
    max-width: 100%;
   background: #ffffff;
   border: 1px solid var(--color-border);
   border-radius: 8px;
    padding: 0.5rem 0.75rem;
   font-size: 1rem;
   line-height: 1.8;
   box-sizing: border-box;
    margin: 0;
    overflow-wrap: anywhere;
 }

  .page-id-11 .character-mapping-media .mapping-description-box p {
    font-size: 18px;
    line-height: 1.8;
    margin: 0;
  }

 /* マッピング図見出し */
 .page-id-11 .character-mapping-media h3,
 .page-id-11 .character-mapping-text h3 {
   color: var(--color-main);
    background: #ffffff;
   border-bottom: none; /* H3下線なしで統一（グローバルh3帯スタイル打ち消し） */
    padding: 0.5em 0.8em;
    border-radius: 8px; /* 6px から変更 */
   margin-bottom: 0.5em;
 }





/* ========================================
 * ④ マッピング ─ H2見出しの余白調整
 * 追加日: 2026-08-20 / 調整: 2026-08-25
 * 目的: 見出し上部余白を詰め、帯内で文字が上下中央に見えるようにする
 * 調整(2026-08-25): 本セクションは display:flex のため H2 の margin-top が
 *       直前HRの margin-bottom(32px) と相殺されず加算され、
 *       仕切り線〜H2間が他セクション(実測52px)より16px過大になった。
 *       flex内では margin-top:0 とし他セクションと同じ約52pxに統一。
 *       （padding 10px 20px の白帯仕様は維持）
 * ======================================== */
.page-id-11 #section-mapping > h2 {
  margin-top: 0;
  padding: 10px 20px;
}

/* ----------
 * ④ マッピング ─ 直前のHR余白ハック撤去
 * 撤去日: 2026-08-25
 * 経緯: 2026-08-20 に H2上余白を約16pxへ圧縮するハック（直前HR margin-bottom:0 +
 *       #section-mapping padding-top:20px + H2 margin-top:-24px）を導入していたが、
 *       他セクション（用語集/主な活動 = HR下端〜H2上端 実測52px）と比べて
 *       仕切り線〜見出し間だけ過小（実測16px）との指摘により撤去。
 *       ルール削除により他セクションと同一構成（HR既定margin + H2 margin-top:16px）に復帰。
 * -------------------------------------------------- */

/* ========================================
 * ④ マッピング ─ H3上余白均等化（優先度対策）
 * 追加日: 2026-08-21 / 調整: 2026-08-25
 *   （.kilo/plans/1787661950603-mapping-figure-caption-gap-plan.md）
 * 目的: H3「活動のつながり/活動の歩み」の上余白だけが
 *       左右下より大きくなる問題を解消。四方均等化。
 * 原因: character-mapping.css:60-68 が padding/margin-bottom のみ定義し
 *       margin-top を未定義のため汎用 .entry-content h3{margin-top:1.5rem}
 *       が勝つ。親flex gap と合算で上が過大になる。
 * 対策: 高specificity(ID+class 111) + !important で必ず勝つ。
 *       H2ハックには触れない。
 * 調整(2026-08-25): margin-bottom を 0 にして間隔を親 gap 1em に一本化。
 *       H3→図 / 図→説明欄 / H3→タイムライン をすべて 1em で均一化。
 * ======================================== */
.page-id-11 .character-mapping-media h3,
.page-id-11 .character-mapping-text h3 {
  margin-top: 0 !important;
  margin-bottom: 0 !important;
  padding: 0.5em 0.8em !important;
}
/* カラム共通 gap を 1em に統一（図⇔説明欄の間隔を約18pxへ拡大） */
.page-id-11 .character-mapping-media,
.page-id-11 .character-mapping-text {
  gap: 1em !important;
}
.page-id-11 .character-mapping-media .mapping-description-box {
  margin: 0 !important;
}
/* マッピング説明文: PC/タブレットは現行文言を表示、モバイル(≤480px)のみ短縮文言に差し替え (切替は responsive-480.css) */
.page-id-11 .character-mapping-media .mapping-description-box .mapping-desc-sp {
  display: none;
}
/* ========================================
 * ④ マッピング ─ カード上部帯(::before)の下余白リセット
 * 追加日: 2026-08-25
 * 目的: カード上端〜H3見出しの余白を左右と同程度(約22px)にする
 * 原因: style.css の .wp-block-column::before が margin-bottom:1em を持ち、
 *       本セクションの flex gap:1em と二重加算され上だけ約40pxに膨らむ
 * 対策: 本セクション2カラムの ::before margin-bottom を 0 にし、
 *       間隔を親 flex gap 1em に一本化（帯4px+18px≈左右padding1.2em+1pxと同等）
 * スコープ: .page-id-11 の2カラムのみ（他ページの帯は無影響）
 * ======================================== */
.page-id-11 .creation-two-column > .character-mapping-media::before,
.page-id-11 .creation-two-column > .character-mapping-text::before {
  margin-bottom: 0;
}
/* モバイル側も同様に margin-bottom: 0。親 gap は L74 の 0.5em だが
   上記の gap: 1em !important が全ブレークポイントで勝つため個別指定不要 */


/* ========================================
 * ④ マッピング ─ 活動の歩み タイムライン
 * 追加日: 2026-08-21 / 再デザイン: 2026-08-25
 *   （.kilo/plans/1787658893486-timeline-date-redesign-plan.md）
 * 目的: 右カラム内の縦タイムライン（日付テキスト + 縦レール + ドット）。
 *       ピル型日付を廃止し、右寄せプレーンなタイポグラフィへ変更。
 *       レール/ドットは日付列と内容列の「中間軸」= 専用ガター中央に配置し
 *       日付|●|内容 の左右余白を対称化。
 * 数値: desktop  日付5rem + gap1.75rem → レール中心 x=5.875rem（幅2px）
 *       768px以下 日付4.25rem + gap1.25rem → レール中心 x=4.875rem（幅2px）
 * スコープ: .page-id-11 のみ（他ページへ影響なし）
 * ======================================== */

/* 親2カラムの伸縮調整：等高化のため stretch に変更（旧 flex-start は廃止） */
.page-id-11 .creation-two-column:has(> .character-mapping-media) {
  align-items: stretch;
}

/* タイムライン本体 */
.page-id-11 .mapping-timeline {
  position: relative;
  list-style: none;
  margin: 0;
  padding: 0;
}

/* desktop(≥769px): 等高化の余剰高をspace-betweenで行間へ分配。
   ≤768px はカラム積み上げのため上寄り・固定行間（margin-top:0.85em が最小間隔） */
/* moved to css/responsive-768.css:APPEND [768] (plan 1790697927646 V009) - SP isolation */

/* 縦レール（日付|内容 の中間軸: 5rem + 1.75rem/2 = 5.875rem） */
.page-id-11 .mapping-timeline::before {
  content: "";
  position: absolute;
  left: calc(5.875rem - 1px);
  top: 0.6em;
  bottom: 0.6em;
  width: 2px;
  background: var(--color-border, #DCE6EE);
  border-radius: 1px;
}

/* 各行（ベースライン揃え: 日付と内容の1行目ベースラインを一致させる）
   margin-left:0 は親テーマの ol li 余白を打ち消し、行をレール（ol基準）と
   同一座標系に揃えるための指定 */
.page-id-11 .mapping-timeline-item {
  position: relative;
  display: flex;
  align-items: baseline;
  gap: 1.75rem;
  padding-left: 0;
  margin-left: 0;
}

.page-id-11 .mapping-timeline-item + .mapping-timeline-item {
  margin-top: 0.85em;
}

/* ドット（縦線上・内容1行目の中心） */
.page-id-11 .mapping-timeline-item::before {
  content: "";
  position: absolute;
  left: calc(5.875rem - 5px);
  top: calc(0.85em - 5px);
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: var(--color-fuji-mid, #7369A0);
  border: 2px solid #fff;
  box-sizing: border-box;
}

/* 日付（プレーンな右寄せタイポグラフィ。ピル装飾は廃止）
   font-sizeは本文18px基準で0.85em: 「2020.09」が5rem(80px)列内に収まり
   レール中心5.875remに対し左右ガターを対称(各14px)に保つため */
.page-id-11 .mapping-timeline-date {
  flex: 0 0 5rem;
  max-width: 5rem;
  min-width: 5rem;
  white-space: nowrap;
  text-align: right;
  font-variant-numeric: tabular-nums;
  font-feature-settings: "tnum";
  /* 2026-09-06 fix(plan:1788666829748 follow-up): 年月9行の幅統一 — 実測で46.91〜50.34pxとバラつき
     （例: 2024.11=47.59 vs 2023.04=50.13）、右寄せのため左端がガタつく。原因は body のフォントスタック
     (Zen Kaku→ヒラギノ/Meiryo)が tnum 未対応で "1" が細く出ること（"11"=14.41 vs "00"=18.77・tnum有無で不変を確認）。
     対策: 日付のみ等幅数字フォントを先頭にしたスタックに変更。Win=Segoe UI(既定tabular・700でも等幅実測)、
     mac/iOS=-apple-system(SF・上記tabular-nums指定で等幅化)、Android=Roboto(既定tabular)。
     全行が同一書式「dddd.dd」(数字6+ピリオド)のため、等幅化で9行ピクセル一致する。右寄せ・列幅・レール不変。
     letter-spacing は 0.02em→0（字間分の微差を消し、モバイル3.125rem=50px枠への収まりを確保。約47.6px/12.8px時）。 */
  font-family: "Segoe UI", -apple-system, Roboto, "Helvetica Neue", Arial, "Hiragino Kaku Gothic ProN", "Hiragino Sans", Meiryo, sans-serif;
  letter-spacing: 0px; /* 0 と等価。注意: Chromium は computed を "normal" と報告するため E2E では指定値を直接読む */
  font-weight: 700;
  font-size: 0.85em;
  line-height: 1.7;
  color: var(--color-main, #5F568E);
}

/* 内容 */
.page-id-11 .mapping-timeline-content {
  flex: 1;
  min-width: 0;
  line-height: 1.7;
  color: var(--color-text, #333);
  overflow-wrap: anywhere;
}

/* 将来リンク用（現時点ではリンクなしだが拡張に備える） */
.page-id-11 .mapping-timeline-content a {
  color: var(--color-link, #5F568E);
  text-decoration: underline;
  text-underline-offset: 0.15em;
}

.page-id-11 .mapping-timeline-content a:focus-visible {
  outline: 2px solid var(--color-fuji-mid, #7369A0);
  outline-offset: 2px;
  border-radius: 2px;
}

/* レスポンシブ 768px以下（日付4.25rem + gap1.25rem → レール中心 4.875rem） */


/* 480px以下でも横並び維持（gapは中間軸の計算と一致させるため据え置き） */


/* 印刷（ピル装飾は廃止済みのため、色指定のみ整理） */
@media print {
  .page-id-11 .mapping-timeline::before {
    background: #999 !important;
    -webkit-print-color-adjust: exact;
    print-color-adjust: exact;
  }

  .page-id-11 .mapping-timeline-item::before {
    background: #7369A0 !important;
    border-color: #fff !important;
    -webkit-print-color-adjust: exact;
    print-color-adjust: exact;
  }

  .page-id-11 .mapping-timeline-date {
    color: #5F568E !important;
    -webkit-print-color-adjust: exact;
    print-color-adjust: exact;
  }
}

/* ========================================
 * ④ マッピング ─ 左右等高化（固定ページID:11専用）
 * 追加日: 2026-08-22 / 調整: 2026-08-25
 * 目的: デスクトップ(769px以上)で左右カラムを等高化。低い方を高い方へ伸長。
 * 手法: 親 stretch + タイムライン flex:1。
 *       プレースホルダーの flex/aspect-ratio は「プレースホルダー高さポリシー」
 *       セクションへ一元移管されたため、ここには記述しない。
 * 将来 <img> 差し替え時は .character-placeholder-mapping を img に置換し
 * img { width:100%; height:100%; object-fit:cover; border-radius:8px } で追従可能。
 * ======================================== */
/* moved to css/responsive-768.css:APPEND [768] (plan 1790697927646 V011) - SP isolation */

/* ========================================
 * 2026-09-02 fix: mapping timeline 白カード化 — tint直置き解消（soniria hero と同トークン）
 * ======================================== */
.page-id-11 .mapping-timeline-card {
  background: #ffffff;
  border: 1px solid var(--color-border, #DCE6EE);
  border-radius: 8px;
  padding: 1rem 1rem 1rem 1.2rem;
  -webkit-print-color-adjust: exact;
  print-color-adjust: exact;
}
.page-id-11 .mapping-timeline-card .mapping-timeline {
  margin: 0;
  padding: 0;
}
@media print {
  .page-id-11 .mapping-timeline-card {
    -webkit-print-color-adjust: exact;
    print-color-adjust: exact;
  }

  .page-id-11 .creation-two-column > .character-mapping-media,
  .page-id-11 .creation-two-column > .character-mapping-text {
    -webkit-print-color-adjust: exact;
    print-color-adjust: exact;
  }
}

/* ========================================
 * 2026-09-01 fix: mapping 左右を翡翠 tint パネルとして完全一致
 * ======================================== */
.page-id-11 .creation-two-column > .character-mapping-media,
.page-id-11 .creation-two-column > .character-mapping-text {
  background: var(--color-bg-jade, #EFF8F5) !important;
  background-color: var(--color-bg-jade, #EFF8F5) !important;
  opacity: 1 !important;
  border: none !important;
  border-radius: 15px !important;
  padding: 10px !important;
}
.page-id-11 .creation-two-column > .character-mapping-media::before,
.page-id-11 .creation-two-column > .character-mapping-text::before {
  content: none !important;
  display: none !important;
  height: 0 !important;
  margin: 0 !important;
  background: none !important;
}

/* ② マッピング 額縁 レスポンシブ / フォールバック / 印刷 — section-soniria準拠 */


@supports not ((backdrop-filter: blur(4px)) or (-webkit-backdrop-filter: blur(4px))) {
  .page-id-11 .character-placeholder-mapping::before {
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
  }
}

@media print {
  .page-id-11 .character-placeholder-mapping {
    -webkit-print-color-adjust: exact;
    print-color-adjust: exact;
  }
  .page-id-11 .character-placeholder-mapping::before {
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
    background: transparent !important;
    mask: none !important;
    -webkit-mask: none !important;
    mask-composite: unset !important;
    -webkit-mask-composite: unset !important;
    padding: 0 !important;
    border: 7px solid rgba(255,255,255,0.5) !important;
    border-radius: 8px !important;
  }
  .page-id-11 .character-placeholder-mapping::after {
    -webkit-print-color-adjust: exact;
    print-color-adjust: exact;
  }
}

/* ========================================
 * ④ マッピング ─ 活動のつながり図（コード描画）
 * 追加日: 2026-08-25 — .kilo/plans/1787619007667-mapping-diagram-code-draw.md
 * スコープ: .page-id-11 のみ（他ページへ影響なし）
 * 方式: 純SVG <a><rect rx><text> + marker矢印、額縁 ::before/::after は維持 (z1/z2)、SVGはz0
 * ======================================== */

/* ラッパーは既存 .character-placeholder-mapping の額縁を継承、図専用で上書きは最小限 */
.page-id-11 .character-mapping-diagram {
  /* 既存の gradient + border + shadow を維持、SVGが中身を描画 */
  display: block;
  overflow: hidden;
}

/* SVG自体: 額縁の下(z0)で全面に敷く */
.page-id-11 .character-mapping-diagram svg {
  width: 100%;
  height: 100%;
  display: block;
  position: relative;
  z-index: 0;
}

/* レイヤー背景（白半透明：プレースホルダー虹色と被らない / 透過度高め） */
.page-id-11 .mapping-layer {
  fill: rgba(255,255,255,0.42);
  stroke: var(--color-border, #DCE6EE);
  stroke-width: 1.2;
}

/* レイヤー見出し（非クリック・枠上部中央：着想/深化/展開） — ボックスより一段小さいサイズ */
.page-id-11 .mapping-layer-label {
  font-family: inherit;
  font-size: 15px;
  font-weight: 700;
  fill: var(--color-main, #5F568E);
  opacity: 0.8;
  text-anchor: middle;
  dominant-baseline: central;
  letter-spacing: 0.12em;
  pointer-events: none;
  user-select: none;
}

/* 図外ヒント：プレースホルダー内で図外かつ枠内に配置 */
.page-id-11 .mapping-hint {
  position: absolute;
  right: 10px;
  bottom: 10px;
  z-index: 3;
  /* font-balance 1788579499092 R8: 290px容器の隅バッジ極小の底上げ・絶対配置単行のため行増なし */
  font-size: 13px;
  line-height: 1;
  color: var(--color-main, #5F568E);
  background: rgba(255,255,255,0.88);
  border: 1px solid var(--color-border, #DCE6EE);
  border-radius: 999px;
  padding: 5px 9px;
  pointer-events: none;
  letter-spacing: 0.03em;
  box-shadow: 0 1px 4px rgba(31,32,65,0.08);
}



/* ノード（角丸四角 rx8） */
.page-id-11 .mapping-node {
  fill: #ffffff;
  stroke: var(--color-border, #DCE6EE);
  stroke-width: 1.2;
  transition: stroke 0.2s ease, filter 0.2s ease, fill 0.2s ease;
}

/* リンクホバー/フォーカス時の強調 */
.page-id-11 .mapping-node-link:hover .mapping-node,
.page-id-11 .mapping-node-link:focus-visible .mapping-node {
  stroke: var(--color-fuji-mid, #7369A0);
  filter: drop-shadow(0 2px 6px rgba(115,105,160,0.15));
  fill: var(--color-bg-fuji, #F6F3FB);
}

.page-id-11 .mapping-node-link,
.page-id-11 .character-mapping-diagram a {
  text-decoration: none !important;
  border: none !important;
}

.page-id-11 .mapping-node-link:focus-visible .mapping-node {
  stroke-width: 1.6;
}

/* フォーカスリングは rect の外周に stroke で表現 + SVG外周のoutline代替 */
.page-id-11 .mapping-node-link:focus-visible {
  outline: 2px solid var(--color-fuji-mid, #7369A0);
  outline-offset: 2px;
  border-radius: 8px;
}

/* ラベルテキスト */
.page-id-11 .mapping-node-label {
  font-family: inherit;
  font-size: 17px;
  font-weight: 700;
  fill: var(--color-main, #5F568E);
  text-anchor: middle;
  dominant-baseline: central;
  pointer-events: none;
  user-select: none;
  text-decoration: none !important;
}

/* 矢印: 藤色細線 + marker */
.page-id-11 .mapping-arrow {
  fill: none;
  stroke: #7369A0;
  stroke-width: 1.6;
  stroke-linecap: round;
  stroke-linejoin: round;
  marker-end: url(#arrow-fuji);
}

/* 中央の太い接続矢印（第1→第2ループ） */
.page-id-11 .mapping-arrow--central {
  stroke-width: 2.0;
}

/* フィードバック矢印は破線で区別 */
.page-id-11 .mapping-arrow--feedback {
  stroke-dasharray: 4 3;
  opacity: 0.9;
}

/* レスポンシブ: SVGはviewBoxで縮小するが、文字潰れ対策
   （図の縦横比は「プレースホルダー高さポリシー」セクションの --mapping-ratio で管理） */




/* 印刷: 矢印とノードが消えないように */
@media print {
  .page-id-11 .character-mapping-diagram svg {
    -webkit-print-color-adjust: exact;
    print-color-adjust: exact;
  }
  .page-id-11 .mapping-layer {
    fill: rgba(255,255,255,0.95) !important;
    stroke: #DCE6EE !important;
    -webkit-print-color-adjust: exact;
    print-color-adjust: exact;
  }
  .page-id-11 .mapping-node {
    fill: #ffffff !important;
    stroke: #7369A0 !important;
    -webkit-print-color-adjust: exact;
    print-color-adjust: exact;
  }
  .page-id-11 .mapping-arrow {
    stroke: #7369A0 !important;
    -webkit-print-color-adjust: exact;
    print-color-adjust: exact;
  }
  .page-id-11 .mapping-node-label {
    fill: #5F568E !important;
    -webkit-print-color-adjust: exact;
    print-color-adjust: exact;
  }
  .page-id-11 .mapping-layer-label {
    fill: #5F568E !important;
    opacity: 0.85 !important;
    -webkit-print-color-adjust: exact;
    print-color-adjust: exact;
  }
}