/*
 * 授業レポート1本（/cuelcollege/report/{slug}/）だけで使う見た目。2026-10-22
 *
 * ★theme.css（共通）に無いものだけをここに書く。共通CSSは触らない。
 *   読み込むのは src/pages/cuelcollege/report/[slug].astro。
 *
 * 講師カード（本文の cuelLecturers ブロック → src/components/report/ReportLecturers.astro）
 *   WordPress 版は本文に style 付きの HTML を貼っていた（~/.agents/skills/cuel-report/lecturer-card.html）。
 *   その見た目をそのまま class に移した。
 * 質疑の箱（cuelQa）と本文の画像は theme.css の .report-single-body の指定がそのまま効く。
 */
.report-single-body .report-lecturers { display: grid; gap: 12px; }
.report-single-body .report-lecturer {
	display: flex;
	align-items: center;
	gap: 16px;
	padding: 16px 18px;
	border: 1px solid #f0e4dc;
	border-radius: 14px;
	background: #fffaf6;
}
.report-single-body .report-lecturer img {
	flex: none;
	width: 80px;
	height: 80px;
	border-radius: 50%;
	object-fit: cover;
}
.report-single-body .report-lecturer p { margin: 0; font-size: 14px; line-height: 1.8; }
.report-single-body .report-lecturer strong { display: block; font-size: 15px; }
.report-single-body .report-lecturer strong span { margin-left: 8px; color: #c8663a; font-size: 12px; }

/* 本文の画像（EmDash の image ブロック）。figure の外側の余白を本文の段落とそろえる */
.report-single-body .emdash-image { margin: 0 0 26px; }

@media (max-width: 760px) {
	.report-single-body .report-lecturer { align-items: flex-start; gap: 12px; padding: 14px; }
	.report-single-body .report-lecturer img { width: 64px; height: 64px; }
	.report-single-body .report-lecturer p { font-size: 13.5px; }
}