/* =====================================================================
   today_card.css —「今日の資格」カード意匠(no=81 / 全社No.23)
   意匠案B: ヘッダー帯(上部に極薄ティント帯＋帯下端に分野色1pxヘアライン、本体は白地)。
   ・style.css / Bootstrap を上書きしない。全セレクタを .today_card 系にスコープする。
   ・新色を追加しない。分野色(--bunya-color)と --color-accent-tint の範囲で成立させる。
   ・index(1枚)と today.php(ヒーロー)は同一コンポーネントの密度違い(.today_card--hero)。
   ・既存部品(.bunya_badge / .score_meter / .nando_star)の出力はそのまま受け入れる。
   ===================================================================== */

.today_card {
	display: flex;
	flex-direction: column;
	height: 100%;
	background: var(--color-bg, #fff);
	border: 1px solid var(--color-hairline-strong, rgba(0,0,0,.14));
	border-radius: var(--radius-lg, 10px);
	box-shadow: var(--shadow-card, 0 1px 2px rgba(0,0,0,.05), 0 6px 16px rgba(0,0,0,.06));
	overflow: hidden;
	margin: 0 0 var(--space-5, 32px) 0;
}

/* ── ヘッダー帯(案B) ── 初期は帯背景を共通アクセントtint固定。帯下端に分野色1pxヘアライン。 */
.today_card_band {
	display: flex;
	align-items: center;
	justify-content: space-between;
	flex-wrap: wrap;
	gap: var(--space-2, 8px);
	padding: var(--space-2, 8px) var(--space-4, 20px);
	background: var(--color-accent-tint, #eef4fc);
	border-bottom: 1px solid var(--bunya-color, var(--color-hairline-strong, rgba(0,0,0,.14)));
}
.today_card_band_meta {
	display: flex;
	align-items: baseline;
	gap: var(--space-3, 12px);
	flex-wrap: wrap;
}
.today_card_label {
	font-size: 11px;
	font-weight: 700;
	letter-spacing: .08em;
	color: var(--color-accent-dark, #1f5299);
	text-transform: none;
}
.today_card_date {
	font-size: 12px;
	font-weight: 600;
	color: var(--color-text-muted, #8a8a86);
	font-variant-numeric: tabular-nums;
}
/* 帯内の分野バッジ: 既存 .bunya_badge をそのまま使うため上書きは最小限(余白のみ) */
.today_card_bunya { margin: 0; }

/* ── 本体(白地) ── */
.today_card_body {
	display: flex;
	flex-direction: column;
	gap: var(--space-3, 12px);
	padding: var(--space-4, 20px);
	flex: 1 1 auto;
}

/* 資格名: line-clamp:2 + min-height で1行/2行のガタつきを防ぐ(高さ揃え) */
.today_card_name {
	margin: 0;
	font-size: 18px;
	font-weight: 700;
	line-height: 1.4;
	min-height: 2.8em;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
}
.today_card_name a { color: var(--color-text, #2b2b2b); }
.today_card_name a:hover { color: var(--color-accent, #2f74d1); text-decoration: none; }
.today_card_kana {
	margin: -8px 0 0 0;
	font-size: 12px;
	color: var(--color-text-muted, #8a8a86);
}

/* 難易度★(メーターとは必ず別行) */
.today_card_nando {
	display: flex;
	align-items: center;
	gap: var(--space-2, 8px);
}
.today_card_nando_label {
	font-size: 11.5px;
	color: var(--color-text-muted, #8a8a86);
}

/* 指数メーター: 375pxは縦積み、480px以上で横並び。★とは同一行に詰めない。 */
.today_card_meters {
	display: flex;
	flex-direction: column;
	gap: var(--space-3, 12px);
}
@media (min-width: 480px) {
	.today_card_meters {
		flex-direction: row;
		gap: var(--space-4, 20px);
	}
	.today_card_meters .score_meter { flex: 1 1 0; min-width: 0; }
}
/* No.64 の「N.N / 5.0」統一表記を厳守(ranking と同じ後置表記をカード内に限定して付与) */
.today_card_meters .score_meter_value::after {
	content: " / 5.0";
	font-size: 11px;
	color: var(--color-text-muted, #8a8a86);
	font-weight: 400;
}

/* 一言 */
.today_card_hitokoto {
	margin: 0;
	font-size: 13px;
	line-height: 1.7;
	color: var(--color-text, #2b2b2b);
}
/* index(非ヒーロー)は line-clamp:2、ヒーローは全文 */
.today_card:not(.today_card--hero) .today_card_hitokoto {
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
}

.today_card_cta { margin: var(--space-1, 4px) 0 0 0; }
.today_card_cta .btn { font-size: 13px; }

/* 中立注記(index=極小) */
.today_card_note {
	margin: 0;
	font-size: 10.5px;
	line-height: 1.5;
	color: var(--color-text-muted, #8a8a86);
}

/* ── ヒーロー密度(today.php) ── 余白・文字サイズを拡大 */
.today_card--hero {
	max-width: 640px;
}
.today_card--hero .today_card_band {
	padding: var(--space-3, 12px) var(--space-5, 32px);
}
.today_card--hero .today_card_label { font-size: 12px; }
.today_card--hero .today_card_date { font-size: 13px; }
.today_card--hero .today_card_body {
	gap: var(--space-4, 20px);
	padding: var(--space-5, 32px);
}
.today_card--hero .today_card_name {
	font-size: 24px;
	min-height: 0;              /* ヒーローは全文表示・高さ揃え不要 */
	-webkit-line-clamp: initial;
	display: block;
	overflow: visible;
}
.today_card--hero .today_card_hitokoto { font-size: 15px; }

/* =====================================================================
   today.php 本文・todays.php 一覧の補助スタイル(いずれも .today_ / .todays_ にスコープ)
   ===================================================================== */

/* today.php: ページ見出し脇の日付 */
.today_page_date {
	display: inline-block;
	margin-left: var(--space-3, 12px);
	font-size: 14px;
	font-weight: 600;
	color: var(--color-text-muted, #8a8a86);
	font-variant-numeric: tabular-nums;
}

/* today.php: 説明セクション */
.today_about { margin: var(--space-5, 32px) 0; }
.today_about p { max-width: 46em; line-height: 1.9; }
.today_detail_link { margin: var(--space-4, 20px) 0; }

/* today.php: バックナンバー抜粋 / todays.php 一覧 共通の行 */
.today_backnumber { margin-top: var(--space-6, 48px); }
.today_backnumber_list,
.todays_list {
	list-style: none;
	margin: 0;
	padding: 0;
}
.today_backnumber_item,
.todays_item {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: var(--space-3, 12px);
	padding: var(--space-3, 12px) 0;
	border-bottom: 1px solid var(--color-hairline, rgba(0,0,0,.08));
}
.today_backnumber_date,
.todays_date {
	flex: 0 0 auto;
	font-size: 12px;
	font-weight: 600;
	color: var(--color-text-muted, #8a8a86);
	font-variant-numeric: tabular-nums;
	min-width: 6.5em;
}
.today_backnumber_name,
.todays_name {
	flex: 1 1 12em;
	font-weight: 600;
	color: var(--color-text, #2b2b2b);
}
.today_backnumber_name:hover,
.todays_name:hover { color: var(--color-accent, #2f74d1); text-decoration: none; }
.todays_nando { flex: 0 0 auto; }
.today_backnumber_more { margin-top: var(--space-4, 20px); }

/* todays.php: 一覧中の広告枠は行の区切りを消してブロック配置 */
.todays_ad { list-style: none; border: 0; padding: var(--space-3, 12px) 0; }

/* 375px: 日付を1行目に単独で置き、行の窮屈さを避ける */
@media (max-width: 480px) {
	.today_backnumber_date,
	.todays_date { flex: 1 0 100%; min-width: 0; }
}