@charset "utf-8";
/* =========================================================
   コードブロック（Highlighting Code Block）の配色：白地版
   （V04.9 2026-10-17 追加。黒地版 hcb-palette.css と同じ8色を、明るさを逆にして使う）

     #eef1f4             … 背景（パレット外。#e0e5e9 を白に寄せた同じ青み。2026-10-17）
     #e0e5e9             … 選択したときの背景
     #b5b9c6             … 枠線
     #8a8f9d             … コメント（斜体）、言語名の帯（文字は白抜き）
     #606579             … 文字列・値・数字・記号（{ } ; など）
     #4a4e63             … ふつうの文字・プロパティ・属性名
     #1d1f28  一番濃い … セレクタ・タグ・キーワード・関数

   ★ 切り替え・元に戻すとき
     header.php の $memo_hcb_palette で選ぶ（'dark'／'light'／''＝元の prism.css の配色）
   ========================================================= */

/* 背景と枠（main.css の黒地の指定を上書き。このファイルは main.css より後に読み込む） */
.hcb_wrap pre.prism {
	background: #eef1f4; /* #e0e5e9 と白の中間くらい（パレット外の色。2026-10-17 #ffffff → #e0e5e9 → #eef1f4） */
	border: 1px solid #b5b9c6; /* 罫線を細く（prism.css の 0.3em ≒ 3px → 1px。2026-10-17） */
	box-shadow: none; /* prism.css の内側の黒い影を消す */
}

/* ふつうの文字。prism.css の黒い影は消す */
.hcb_wrap code[class*="language-"],
.hcb_wrap pre[class*="language-"] {
	color: #4a4e63;
	text-shadow: none;
}

/* 言語名（右上の CSS / PHP）：#8a8f9d の帯に白抜き文字（2026-10-17） */
.hcb_wrap pre[data-lang]::before {
	color: #ffffff;
	background: #8a8f9d;
	border-radius: 0 0 3px 3px; /* 上の枠に付いているので、下の角だけ丸く */
}

/* 選択したときの背景 */
.hcb_wrap pre[class*="language-"] ::selection,
.hcb_wrap pre[class*="language-"]::selection {
	background: #e0e5e9; /* 選択したときの背景：背景より一段濃く */
}

/* コメント：一番控えめに、斜体 */
.hcb_wrap .token.comment,
.hcb_wrap .token.prolog,
.hcb_wrap .token.doctype,
.hcb_wrap .token.cdata {
	color: #8a8f9d;
	font-style: italic;
}

/* 一番目立たせるもの：セレクタ・タグ・キーワード・関数など */
.hcb_wrap .token.selector,
.hcb_wrap .token.tag,
.hcb_wrap .token.keyword,
.hcb_wrap .token.function,
.hcb_wrap .token.atrule,
.hcb_wrap .token.builtin,
.hcb_wrap .token.constant,
.hcb_wrap .token.symbol,
.hcb_wrap .token.important,
.hcb_wrap .language-markup .token.tag {
	color: #1d1f28;
}

/* プロパティ・属性名・変数：ふつうの文字と同じ */
.hcb_wrap .token.property,
.hcb_wrap .token.attr-name,
.hcb_wrap .token.variable,
.hcb_wrap .language-markup .token.attr-name {
	color: #4a4e63;
}

/* 文字列・値・数字・記号：一段控えめに */
.hcb_wrap .token.string,
.hcb_wrap .token.char,
.hcb_wrap .token.attr-value,
.hcb_wrap .token.url,
.hcb_wrap .token.number,
.hcb_wrap .token.boolean,
.hcb_wrap .token.regex,
.hcb_wrap .token.entity,
.hcb_wrap .token.inserted,
.hcb_wrap .token.deleted,
.hcb_wrap .token.operator,
.hcb_wrap .token.punctuation,
.hcb_wrap .language-css .token.string,
.hcb_wrap .language-markup .token.punctuation {
	color: #606579;
	background: none; /* prism.css で operator などに付く背景を消す */
}
/* 記号は prism.css で半透明になっているので戻す */
.hcb_wrap .token.punctuation,
.hcb_wrap .token.namespace {
	opacity: 1;
}

/* ---------------------------------------------------------
   HCB 2.x 用（本番は Highlighting Code Block 2.2.1。ローカルは 1.4.1）
   2.x は色を CSS 変数（--hcb--bgc など）で持ち、
   背景・枠を「.hcb_wrap.hcb_wrap > pre」という強い指定で付けるので、上の指定だけでは効かない。
   → 変数を .hcb_wrap に上書きし、枠は同じくらい強い指定で付け直す（1.x には影響しない）
   --------------------------------------------------------- */
.hcb_wrap {
	--hcb--bgc: #eef1f4;              /* 背景 */
	--hcb--c: #4a4e63;                /* ふつうの文字 */
	--hcb--tsh: none;                 /* 文字の影なし */
	--hcb--data-label--bgc: #8a8f9d;  /* 言語名の帯 */
	--hcb--data-label--c: #ffffff;    /* 言語名の文字（白抜き） */
	--hcb--line-numbers--c: #8a8f9d;  /* 行番号 */
}
.hcb_wrap.hcb_wrap.hcb_wrap > pre {
	border: 1px solid #b5b9c6;        /* 枠（2.x は枠なしが標準） */
}
/* 言語名：HCB の設定で「言語名を表示」が切れていても出す */
.hcb_wrap > pre[data-lang]::before {
	content: attr(data-lang);
}