/**
 * 記事本文と編集画面で共有する見た目.
 * ヘッダー、一覧カード、関連記事には当てない。
 *
 * 数値の正本は :root の --content-width と --article-* 。
 * 子テーマはここだけ上書きする。--ai-content とは分けてある。
 */

:root {
	--content-width: 760px;

	--article-font-size: 16px;
	--article-line-height: 1.9;

	--article-paragraph-gap: 24px;

	--article-h2-top: 56px;
	--article-h2-bottom: 24px;

	--article-h3-top: 36px;
	--article-h3-bottom: 16px;

	--article-h4-top: 28px;
	--article-h4-bottom: 12px;
	--article-h5-top: 24px;
	--article-h5-bottom: 12px;

	--article-h2-size: 24px;
	--article-h3-size: 20px;
	--article-h4-size: 18px;
	--article-h5-size: 17px;

	--article-list-gap: 8px;
	--article-list-line-height: 1.75;
	--article-quote-gap: 32px;
	--article-quote-padding: 24px;
	--article-quote-inner-gap: 14px;
	--article-quote-line-height: 1.8;
	--article-cell-padding-block: 14px;
	--article-cell-padding-inline: 16px;
	--article-cell-line-height: 1.6;
}

@media (max-width: 49.99rem) {
	:root {
		--article-line-height: 1.85;
		--article-paragraph-gap: 22px;
		--article-quote-gap: 24px;
		--article-quote-padding: 16px;
		--article-h2-size: 22px;
		--article-h3-size: 19px;
		--article-h4-size: 17px;
		--article-h2-top: 40px;
		--article-h2-bottom: 20px;
		--article-h3-top: 28px;
		--article-h3-bottom: 14px;
		--article-h4-top: 24px;
	}
}

.entry-header {
	max-width: var(--content-width);
	margin-bottom: 1.25rem;
}

.entry-hero {
	margin: 0 0 1.5rem;
}

.entry-hero-image,
.entry-content img,
.entry-content video {
	max-width: 100%;
	height: auto;
}

.entry-content,
.editor-styles-wrapper {
	color: var(--ai-color-ink, var(--wp--preset--color--ink, #1c1917));
	font-size: var(--article-font-size);
	line-height: var(--article-line-height);
	line-break: strict;
	overflow-wrap: break-word;
	text-spacing-trim: trim-start;
}

.entry-content > :where(:not(.alignleft):not(.alignright):not(.alignwide):not(.alignfull)) {
	max-width: var(--content-width);
	margin-inline: auto;
}

.entry-content > .alignwide {
	width: 100%;
	max-width: none;
	margin-inline: auto;
}

.entry-content > .alignfull {
	width: 100vw;
	max-width: 100vw;
	margin-left: calc(50% - 50vw);
}

.entry-content :where(p, ul, ol, dl, blockquote, pre, figure, h1, h2, h3, h4, h5, h6) {
	margin-block: 0;
}

.entry-content > * + *,
.entry-content :where(.is-layout-flow, .is-layout-constrained, .wp-block-column, .wp-block-group__inner-container) > * + * {
	margin-block-start: var(--article-paragraph-gap);
}

.entry-content > :first-child {
	margin-block-start: 0;
}

.entry-content > :last-child {
	margin-block-end: 0;
}

.entry-content p:empty {
	display: none;
}

.entry-content br + br {
	display: none;
}

.entry-content :is(h1, h2, h3, h4, h5, h6),
.editor-styles-wrapper :is(h1, h2, h3, h4, h5, h6):not(.editor-post-title) {
	font-weight: 600;
	line-height: 1.4;
	text-wrap: pretty;
	break-inside: avoid;
	break-after: avoid;
}

.entry-content :is(h1, h2, h3, h4) + *,
.editor-styles-wrapper :is(h1, h2, h3, h4):not(.editor-post-title) + * {
	break-before: avoid;
}

.entry-content h1,
.editor-styles-wrapper h1.wp-block-heading {
	margin-block-start: var(--article-h2-top);
	margin-block-end: var(--article-h2-bottom);
	font-size: clamp(1.5rem, 1.2rem + 1vw, 1.75rem);
}

.entry-content h2,
.editor-styles-wrapper h2:not(.editor-post-title) {
	margin-block-start: var(--article-h2-top);
	margin-block-end: var(--article-h2-bottom);
	font-size: var(--article-h2-size);
}

.entry-content h3,
.editor-styles-wrapper h3:not(.editor-post-title) {
	margin-block-start: var(--article-h3-top);
	margin-block-end: var(--article-h3-bottom);
	font-size: var(--article-h3-size);
}

.entry-content h4,
.editor-styles-wrapper h4:not(.editor-post-title) {
	margin-block-start: var(--article-h4-top);
	margin-block-end: var(--article-h4-bottom);
	font-size: var(--article-h4-size);
}

.entry-content :is(h5, h6),
.editor-styles-wrapper :is(h5, h6):not(.editor-post-title) {
	margin-block-start: var(--article-h5-top);
	margin-block-end: var(--article-h5-bottom);
	font-size: var(--article-h5-size);
}

.entry-content > :is(h1, h2, h3, h4, h5, h6):first-child,
.entry-content :where(.is-layout-flow, .is-layout-constrained, .wp-block-column, .wp-block-group__inner-container, blockquote, .wp-block-pullquote) > :is(h1, h2, h3, h4, h5, h6):first-child {
	margin-block-start: 0;
}

.entry-content :is(h1, h2, h3, h4, h5, h6) + *:not(h1, h2, h3, h4, h5, h6) {
	margin-block-start: 0;
}

.entry-content a,
.editor-styles-wrapper a {
	color: var(--ai-color-accent, var(--wp--preset--color--accent, #1f4d3a));
	text-decoration-thickness: 1px;
	text-underline-offset: 0.18em;
}

.entry-content a:hover,
.editor-styles-wrapper a:hover {
	color: var(--ai-color-ink, var(--wp--preset--color--ink, #1c1917));
}

.entry-content :where(ul, ol):not(.wp-block-gallery, .blocks-gallery-grid),
.editor-styles-wrapper :where(ul, ol):not(.wp-block-gallery, .blocks-gallery-grid) {
	padding-inline-start: 1.5rem;
	line-height: var(--article-list-line-height);
	list-style-position: outside;
}

.entry-content :where(ul, ol):not(.wp-block-gallery, .blocks-gallery-grid) > li + li,
.editor-styles-wrapper :where(ul, ol):not(.wp-block-gallery, .blocks-gallery-grid) > li + li,
.entry-content li > :where(ul, ol),
.editor-styles-wrapper li > :where(ul, ol) {
	margin-block-start: var(--article-list-gap);
}

.entry-content li > * + *,
.entry-content :where(td, th) > * + * {
	margin-block-start: 0.5rem;
}

.entry-content dt {
	font-weight: 600;
}

.entry-content dd {
	margin-inline-start: 0;
}

.entry-content dt + dd {
	margin-block-start: 0.35rem;
}

.entry-content dd + dt {
	margin-block-start: var(--article-paragraph-gap);
}

.wp-block-list.is-axiom-list-frame {
	background: var(--wp--preset--color--surface, var(--ai-color-surface, #fff));
	border: 1px solid var(--wp--preset--color--line, var(--ai-color-line, #e7e5e4));
	border-radius: 0.35rem;
	padding-block: 0.75rem;
	padding-inline: 1rem 1rem;
	padding-inline-start: 2rem;
}

.wp-block-list.is-axiom-marker-check,
.wp-block-list.is-axiom-marker-circle,
.wp-block-list.is-axiom-marker-triangle,
.wp-block-list.is-axiom-marker-cross,
.wp-block-list.is-axiom-marker-num,
.wp-block-list.is-axiom-marker-note {
	list-style: none;
	padding-inline-start: 0;
}

.wp-block-list.is-axiom-list-frame.is-axiom-marker-check,
.wp-block-list.is-axiom-list-frame.is-axiom-marker-circle,
.wp-block-list.is-axiom-list-frame.is-axiom-marker-triangle,
.wp-block-list.is-axiom-list-frame.is-axiom-marker-cross,
.wp-block-list.is-axiom-list-frame.is-axiom-marker-num,
.wp-block-list.is-axiom-list-frame.is-axiom-marker-note {
	padding-inline-start: 1rem;
}

.wp-block-list.is-axiom-marker-check > li,
.wp-block-list.is-axiom-marker-circle > li,
.wp-block-list.is-axiom-marker-triangle > li,
.wp-block-list.is-axiom-marker-cross > li,
.wp-block-list.is-axiom-marker-note > li {
	position: relative;
	padding-inline-start: 1.65em;
}

.wp-block-list.is-axiom-marker-num {
	counter-reset: axiom-li;
}

.wp-block-list.is-axiom-marker-num > li {
	position: relative;
	padding-inline-start: 2.1em;
	counter-increment: axiom-li;
}

.wp-block-list.is-axiom-marker-check > li::before,
.wp-block-list.is-axiom-marker-circle > li::before,
.wp-block-list.is-axiom-marker-triangle > li::before,
.wp-block-list.is-axiom-marker-cross > li::before,
.wp-block-list.is-axiom-marker-num > li::before,
.wp-block-list.is-axiom-marker-note > li::before {
	position: absolute;
	display: block;
	box-sizing: border-box;
	content: "";
	inset-inline-start: 0;
}

.wp-block-list.is-axiom-marker-check > li::before {
	top: 0.42em;
	width: 0.42em;
	height: 0.72em;
	margin-inline-start: 0.18em;
	border-right: 0.12em solid var(--wp--preset--color--accent, var(--ai-color-accent, #1f4d3a));
	border-bottom: 0.12em solid var(--wp--preset--color--accent, var(--ai-color-accent, #1f4d3a));
	transform: rotate(40deg);
}

.wp-block-list.is-axiom-marker-circle > li::before {
	top: 0.55em;
	width: 0.72em;
	height: 0.72em;
	margin-inline-start: 0.08em;
	border: 0.1em solid var(--wp--preset--color--accent, var(--ai-color-accent, #1f4d3a));
	border-radius: 50%;
}

.wp-block-list.is-axiom-marker-triangle > li::before {
	top: 0.62em;
	width: 0;
	height: 0;
	margin-inline-start: 0.12em;
	border-color: transparent transparent transparent var(--wp--preset--color--accent, var(--ai-color-accent, #1f4d3a));
	border-style: solid;
	border-width: 0.32em 0 0.32em 0.46em;
}

.wp-block-list.is-axiom-marker-cross > li::before {
	top: 0.08em;
	color: var(--wp--preset--color--ink, var(--ai-color-ink, #1c1917));
	content: "×";
	font-size: 1.05em;
	line-height: 1;
}

.wp-block-list.is-axiom-marker-note > li::before {
	top: 0.18em;
	color: var(--wp--preset--color--muted, var(--ai-color-muted, #57534e));
	content: "※";
	font-size: 0.85em;
	line-height: 1;
}

.wp-block-list.is-axiom-marker-num > li::before {
	top: 0.22em;
	display: grid;
	width: 1.45em;
	height: 1.45em;
	place-items: center;
	color: var(--wp--preset--color--accent, var(--ai-color-accent, #1f4d3a));
	content: counter(axiom-li);
	font-size: 0.75em;
	line-height: 1;
	border: 1px solid currentColor;
	border-radius: 50%;
}

.entry-content blockquote,
.editor-styles-wrapper .wp-block-quote {
	margin-block: var(--article-quote-gap);
	padding: var(--article-quote-padding);
	border-inline-start: 3px solid var(--ai-color-accent, var(--wp--preset--color--accent, #1f4d3a));
	line-height: var(--article-quote-line-height);
}

.entry-content .wp-block-quote.is-style-plain,
.editor-styles-wrapper .wp-block-quote.is-style-plain {
	padding-inline-start: 0;
	border: 0;
}

.entry-content blockquote > * + *,
.editor-styles-wrapper .wp-block-quote > * + * {
	margin-block-start: var(--article-quote-inner-gap);
}

.entry-content :where(blockquote, .wp-block-pullquote) :is(h1, h2, h3, h4, h5, h6),
.editor-styles-wrapper :where(.wp-block-quote, .wp-block-pullquote) :is(h1, h2, h3, h4, h5, h6) {
	margin-block: var(--article-quote-inner-gap);
	font-size: 1.0625rem;
}

.entry-content blockquote > :is(h1, h2, h3, h4, h5, h6):first-child,
.entry-content .wp-block-pullquote > :is(h1, h2, h3, h4, h5, h6):first-child {
	margin-block-start: 0;
}

.entry-content :where(blockquote cite, .wp-block-quote__citation, .wp-block-pullquote__citation),
.editor-styles-wrapper :where(.wp-block-quote cite, .wp-block-quote__citation, .wp-block-pullquote cite, .wp-block-pullquote__citation) {
	display: block;
	margin-block-start: 0.75rem;
	color: var(--ai-color-muted, var(--wp--preset--color--muted, #57534e));
	font-size: 0.875rem;
	font-style: normal;
	line-height: 1.7;
}

.entry-content .wp-block-pullquote,
.editor-styles-wrapper .wp-block-pullquote {
	margin-block: var(--article-quote-gap);
	padding-block: var(--article-quote-padding);
	padding-inline: 0;
	border-block: 1px solid var(--ai-color-line, var(--wp--preset--color--line, #e7e5e4));
	border-inline: 0;
	line-height: var(--article-quote-line-height);
}

.entry-content .wp-block-pullquote blockquote,
.editor-styles-wrapper .wp-block-pullquote blockquote {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 1.125rem;
	line-height: inherit;
}

.entry-content .wp-block-table {
	overflow-x: auto;
	max-width: var(--content-width);
	margin-inline: auto;
}

.entry-content > table {
	display: block;
	overflow-x: auto;
	max-width: var(--content-width);
	margin-inline: auto;
}

.entry-content table {
	border-collapse: collapse;
}

.entry-content th,
.entry-content td,
.editor-styles-wrapper :where(th, td) {
	padding: var(--article-cell-padding-block) var(--article-cell-padding-inline);
	line-height: var(--article-cell-line-height);
	text-align: start;
	vertical-align: top;
	overflow-wrap: anywhere;
	border: 1px solid var(--ai-color-line, var(--wp--preset--color--line, #e7e5e4));
}

.entry-content th,
.editor-styles-wrapper th {
	font-weight: 600;
	background: var(--ai-color-paper, var(--wp--preset--color--paper, #f7f6f3));
}

.entry-content :where(hr, .wp-block-separator):not(.is-style-dots) {
	height: 0;
	margin-block: var(--article-paragraph-gap);
	border: 0;
	border-block-start: 1px solid var(--ai-color-line, #e7e5e4);
}

.entry-content :where(.wp-block-image, .wp-block-gallery, .wp-block-video, .wp-block-audio, .wp-block-embed, .wp-block-table) :where(img, video, iframe, svg) {
	max-width: 100%;
	height: auto;
}

.entry-content :where(.wp-block-image, figure) img,
.entry-content :where(.wp-block-image, figure) video {
	display: block;
}

.entry-content .wp-block-gallery {
	min-width: 0;
}

.entry-content :where(.wp-block-embed__wrapper, iframe, video, embed, object) {
	max-width: 100%;
}

.entry-content .wp-block-file {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 0.75rem 1rem;
}

.entry-content .wp-block-footnotes {
	margin-block-start: var(--article-paragraph-gap);
	padding-block-start: 1rem;
	color: var(--ai-color-muted, #57534e);
	font-size: 0.875rem;
	line-height: 1.7;
	border-block-start: 1px solid var(--ai-color-line, #e7e5e4);
}

.entry-content code,
.entry-content pre {
	font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
}

.entry-content :where(code, kbd, samp),
.editor-styles-wrapper :where(code, kbd, samp) {
	padding: 0.1em 0.35em;
	font-size: 0.875em;
	line-height: 1.5;
	background: var(--ai-color-surface, var(--wp--preset--color--surface, #fff));
	border-radius: 0.2rem;
}

.entry-content pre code,
.editor-styles-wrapper pre code {
	padding: 0;
	font-size: inherit;
	background: transparent;
}

.entry-content pre,
.editor-styles-wrapper pre {
	padding: 1rem;
	overflow-x: auto;
	font-size: 0.875rem;
	line-height: 1.65;
	background: var(--ai-color-surface, var(--wp--preset--color--surface, #fff));
}

.entry-content figcaption,
.editor-styles-wrapper figcaption {
	margin-block-start: 0.5rem;
	color: var(--ai-color-muted, var(--wp--preset--color--muted, #57534e));
	font-size: 0.875rem;
	line-height: 1.7;
}

.entry-content .wp-block-button__link,
.entry-content .wp-block-button__link:hover,
.entry-content .wp-block-file__button,
.entry-content .wp-block-file__button:hover,
.editor-styles-wrapper .wp-block-button__link,
.editor-styles-wrapper .wp-block-button__link:hover,
.editor-styles-wrapper .wp-block-file__button,
.editor-styles-wrapper .wp-block-file__button:hover {
	color: var(--ai-color-accent-contrast, var(--wp--preset--color--accent-contrast, #fff));
	line-height: 1.5;
	text-decoration: none;
}

.entry-content .wp-block-file__button,
.editor-styles-wrapper .wp-block-file__button {
	display: inline-block;
	padding: 0.55rem 1rem;
	background: var(--ai-color-accent, var(--wp--preset--color--accent, #1f4d3a));
	border-radius: 0.25rem;
}

.entry-content iframe {
	max-width: 100%;
}

.entry-footer {
	display: flex;
	flex-wrap: wrap;
	gap: 0.5rem 1.25rem;
	max-width: var(--content-width);
	margin-top: 2rem;
	color: var(--ai-color-muted, #57534e);
	font-size: 0.875rem;
}

.post-navigation {
	display: grid;
	gap: 0.75rem;
	margin-top: 2rem;
}

.post-navigation a {
	display: flex;
	flex-direction: column;
	gap: 0.15rem;
	padding: 0.75rem 1rem;
	color: inherit;
	text-decoration: none;
	background: var(--ai-color-surface, #fff);
	border: 1px solid var(--ai-color-line, #e7e5e4);
	border-radius: 0.5rem;
}

.nav-subtitle {
	color: var(--ai-color-muted, #57534e);
	font-size: 0.875rem;
}

.comments {
	max-width: var(--content-width);
	margin-top: 3rem;
	padding-top: 1.5rem;
	border-top: 1px solid var(--ai-color-line, #e7e5e4);
}

.comment-list {
	margin: 0;
	padding: 0;
	list-style: none;
}

.comment-list .children {
	margin-inline-start: 1.25rem;
	padding: 0;
	list-style: none;
}

.comment-body {
	margin-bottom: 1rem;
}

.recent-posts {
	margin-top: 3rem;
}

.recent-posts-title {
	margin: 0 0 1rem;
	font-size: 1.5rem;
	line-height: 1.35;
}

@media (min-width: 50rem) {
	.post-navigation .nav-next {
		grid-column: 2;
		text-align: end;
	}
}
