/* ==========================================================================
   Inkline Editorial — 核心塊適配 blocks.css
   覆蓋：段落 / 標題 / 引用 / pullquote / 詩句 / 代碼 / 表格 / 圖片 / 畫廊 /
        columns / details / 分隔線 / 註腳 / 列表 / 按鈕 / 查詢與文章模板
   原則：僅用 1px 髮絲線與 2px 結構線表達層級，禁止陰影、漸變、圓角、斑馬紋。
   ========================================================================== */

/* ==========================================================================
   1. 文字類
   ========================================================================== */

.wp-block-paragraph {
	line-height: var(--lh-body);
}

.wp-block-paragraph.has-drop-cap::first-letter {
	font-family: var(--font-heading);
	font-size: 3.6em;
	line-height: 0.82;
	padding-inline-end: 0.08em;
	color: var(--accent);
}

.wp-block-heading {
	text-wrap: balance;
}

/* 註腳 */
.wp-block-footnotes {
	margin-block-start: var(--sp-8);
	padding-block-start: var(--sp-5);
	border-top: var(--rule-hair) solid var(--rule);
	font-size: var(--fs-small);
	color: var(--muted);
}

.wp-block-footnotes ol {
	padding-inline-start: 1.4em;
}

.wp-block-footnotes li {
	margin-block-end: var(--sp-2);
	line-height: 1.7;
}

.fn-ref,
sup.footnote-ref {
	font-family: var(--font-mono);
	font-size: 0.68em;
	letter-spacing: 0;
	color: var(--accent);
}

/* 列表：方形標記，不用圓點 */
.ink-entry-content ul,
.wp-block-list {
	list-style: square;
	padding-inline-start: 1.4em;
}

.ink-entry-content ul li::marker,
.wp-block-list li::marker {
	color: var(--accent);
	font-size: 0.9em;
}

.ink-entry-content ol {
	padding-inline-start: 1.6em;
}

.ink-entry-content ol li::marker {
	font-family: var(--font-mono);
	font-size: 0.86em;
	color: var(--muted);
	font-variant-numeric: tabular-nums;
}

.ink-entry-content li {
	margin-block-end: var(--sp-2);
	line-height: var(--lh-body);
}

.ink-entry-content li > ul,
.ink-entry-content li > ol {
	margin-block-start: var(--sp-2);
}

.wp-block-list.has-background {
	padding: var(--sp-4) var(--sp-4) var(--sp-4) 2.2em;
}

/* ==========================================================================
   2. 引用 / 詩句 / pullquote
   ========================================================================== */

.wp-block-quote,
.ink-entry-content blockquote {
	margin: var(--sp-6) 0;
	padding: 0 0 0 var(--sp-5);
	border: 0;
	border-inline-start: var(--rule-structural) solid var(--accent);
	background-color: transparent;
	font-size: var(--fs-lead);
	line-height: 1.6;
	color: var(--ink);
	font-style: normal;
}

.wp-block-quote p:last-child,
.ink-entry-content blockquote p:last-child {
	margin-block-end: 0;
}

.wp-block-quote cite,
.ink-entry-content blockquote cite {
	display: block;
	margin-block-start: var(--sp-3);
	font-family: var(--font-mono);
	font-size: var(--fs-caption);
	font-style: normal;
	letter-spacing: 0.04em;
	color: var(--muted);
}

.wp-block-quote.is-style-plain,
.wp-block-quote.is-style-large {
	border-inline-start: 0;
	padding-inline-start: 0;
}

.wp-block-quote.is-style-large {
	font-family: var(--font-heading);
	font-size: var(--fs-h3);
	line-height: 1.35;
}

/* 引用樣式：僅左緣細線、無底色（規格 4.3） */
.wp-block-quote.is-style-inkline-rule {
	border-inline-start: var(--rule-hair) solid var(--rule-strong);
	font-size: var(--fs-body);
	line-height: 1.8;
}

/* 代碼面底色的引用變體 */
.wp-block-quote.is-style-inkline-surface {
	padding: var(--sp-5);
	border-inline-start: var(--rule-structural) solid var(--accent);
	background-color: var(--code-bg);
	font-size: var(--fs-body);
	line-height: 1.8;
}

.wp-block-pullquote {
	margin: var(--sp-8) 0;
	padding: var(--sp-6) 0;
	border: 0;
	border-top: var(--rule-hair) solid var(--rule);
	border-bottom: var(--rule-hair) solid var(--rule);
	text-align: start;
}

.wp-block-pullquote blockquote {
	margin: 0;
	padding: 0;
	border: 0;
}

.wp-block-pullquote p {
	font-family: var(--font-heading);
	font-size: var(--fs-h3);
	line-height: 1.35;
	margin: 0;
}

.wp-block-pullquote cite,
.wp-block-pullquote footer {
	margin-block-start: var(--sp-4);
	font-family: var(--font-mono);
	font-size: var(--fs-caption);
	font-style: normal;
	letter-spacing: 0.04em;
	color: var(--muted);
}

.wp-block-verse {
	margin: var(--sp-6) 0;
	font-family: var(--font-body);
	font-size: var(--fs-body);
	line-height: 1.8;
	border: 0;
	padding: 0;
	white-space: pre-wrap;
}

/* ==========================================================================
   3. 代碼 / 預格式化
   ========================================================================== */

.wp-block-code,
.ink-entry-content code,
.ink-entry-content kbd,
.ink-entry-content samp {
	font-family: var(--font-mono);
	font-size: var(--fs-code);
	line-height: var(--lh-code);
	font-variant-ligatures: none;
}

.wp-block-code {
	margin: var(--sp-6) 0;
	padding: var(--sp-4) var(--sp-5);
	overflow-x: auto;
	background-color: var(--code-bg);
	color: var(--ink);
	border: var(--rule-hair) solid var(--rule);
	border-radius: var(--radius-none);
	/* 保證窄屏不撐破容器 */
	overscroll-behavior-x: contain;
}

.wp-block-code code {
	display: block;
	background: none;
	border: 0;
	padding: 0;
	color: inherit;
	white-space: pre;
	tab-size: 4;
}

/* 行內代碼 */
.ink-entry-content :not(pre) > code,
.ink-entry-content p code,
.ink-entry-content li code {
	padding: 0.12em 0.36em;
	background-color: var(--code-bg);
	border: var(--rule-hair) solid var(--rule);
	border-radius: var(--radius-hair);
	font-size: 0.9em;
	line-height: 1.5;
	white-space: break-spaces;
}

.wp-block-preformatted {
	margin: var(--sp-6) 0;
	padding: var(--sp-4) var(--sp-5);
	overflow-x: auto;
	background-color: var(--code-bg);
	border: var(--rule-hair) solid var(--rule);
	font-family: var(--font-mono);
	font-size: var(--fs-code);
	line-height: var(--lh-code);
	white-space: pre-wrap;
	word-break: break-word;
}

/* ==========================================================================
   4. 表格：僅橫向髮絲線
   ========================================================================== */

.wp-block-table {
	margin: var(--sp-6) 0;
	overflow-x: auto;
}

.wp-block-table table {
	width: 100%;
	border-collapse: collapse;
	border: 0;
	font-size: var(--fs-small);
	font-variant-numeric: tabular-nums;
	background-color: transparent;
}

.wp-block-table th,
.wp-block-table td {
	padding: var(--sp-3) var(--sp-4) var(--sp-3) 0;
	border: 0;
	border-bottom: var(--rule-hair) solid var(--rule);
	text-align: start;
	vertical-align: baseline;
	background-color: transparent;
}

.wp-block-table thead th {
	border-bottom-color: var(--rule-strong);
	font-family: var(--font-mono);
	font-size: var(--fs-meta);
	letter-spacing: var(--track-meta);
	text-transform: uppercase;
	color: var(--muted);
	font-weight: 400;
}

.wp-block-table tbody tr:last-child th,
.wp-block-table tbody tr:last-child td {
	border-bottom: 0;
}

.wp-block-table figcaption {
	margin-block-start: var(--sp-3);
	font-family: var(--font-mono);
	font-size: var(--fs-caption);
	letter-spacing: 0.04em;
	color: var(--muted);
	text-align: start;
}

/* 條紋樣式在此設計系統中降級為髮絲線 */
.wp-block-table.is-style-stripes tbody tr:nth-child(odd) {
	background-color: transparent;
}

.wp-block-table.is-style-stripes {
	border: 0;
}

/* ==========================================================================
   5. 圖片 / 畫廊 / 媒體
   ========================================================================== */

.wp-block-image {
	margin: var(--sp-6) 0;
}

.wp-block-image img,
.ink-entry-content img:not(.wp-block-site-logo img) {
	border: var(--rule-hair) solid var(--rule);
	border-radius: var(--radius-none);
	display: block;
	height: auto;
}

.wp-block-image.is-style-inkline-frame img {
	border: var(--rule-hair) solid var(--rule);
}

.wp-block-image.is-style-inkline-bare img {
	border: 0;
}

.wp-block-image figcaption,
figure.wp-block-gallery figcaption,
.ink-entry-content figcaption {
	margin-block-start: var(--sp-3);
	font-family: var(--font-mono);
	font-size: var(--fs-caption);
	line-height: 1.6;
	letter-spacing: 0.04em;
	color: var(--muted);
	text-align: start;
}

.wp-block-gallery {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(0, 1fr));
	gap: var(--sp-2);
	margin: var(--sp-6) 0;
}

.wp-block-gallery.has-nested-images figure.wp-block-image:not(#individual-image) {
	margin: 0;
}

.wp-block-media-text {
	margin: var(--sp-6) 0;
	gap: var(--sp-4);
}

.wp-block-media-text__content {
	padding: 0 var(--sp-4);
}

.wp-block-audio audio {
	width: 100%;
}

.wp-block-embed {
	margin: var(--sp-6) 0;
}

.wp-block-embed iframe {
	border: var(--rule-hair) solid var(--rule);
}

.wp-block-site-logo img {
	border: 0;
	border-radius: 0;
}

/* ==========================================================================
   6. 分隔線 / 間隔
   ========================================================================== */

.wp-block-separator {
	border: 0;
	border-top: var(--rule-hair) solid var(--rule);
	background-color: transparent;
	margin: var(--sp-7) 0;
	opacity: 1;
}

.wp-block-separator.is-style-wide {
	border-top-width: var(--rule-hair);
}

.wp-block-separator.is-style-dots {
	border: 0;
	background: none;
	text-align: center;
	letter-spacing: 0.6em;
	color: var(--rule);
}

.wp-block-separator.is-style-dots::before {
	content: "···";
	font-family: var(--font-mono);
	font-size: var(--fs-meta);
	color: currentColor;
}

/* 自訂樣式：結構粗線 */
.wp-block-separator.is-style-inkline-structural {
	border-top-width: var(--rule-structural);
	border-top-color: var(--rule-strong);
}

/* 自訂樣式：強調色短線 */
.wp-block-separator.is-style-inkline-short {
	width: 64px;
	margin-inline: 0;
	border-top-width: var(--rule-structural);
	border-top-color: var(--accent);
}

.wp-block-spacer {
	background: none;
}

/* ==========================================================================
   7. 版面類：columns / group / cover
   ========================================================================== */

.wp-block-columns {
	gap: var(--sp-6);
	margin-block-end: var(--sp-6);
	align-items: flex-start;
}

.wp-block-column {
	min-width: 0;
}

.wp-block-group.has-background {
	background-color: var(--code-bg);
	border: var(--rule-hair) solid var(--rule);
}

.wp-block-cover {
	background-color: var(--code-bg);
}

.wp-block-cover__inner-container {
	padding: var(--sp-6);
}

.wp-block-details {
	margin: var(--sp-4) 0;
	padding: var(--sp-4) 0;
	border: 0;
	border-top: var(--rule-hair) solid var(--rule);
	border-bottom: var(--rule-hair) solid var(--rule);
	font-size: var(--fs-small);
}

.wp-block-details summary {
	display: flex;
	align-items: baseline;
	gap: var(--sp-3);
	cursor: pointer;
	font-family: var(--font-mono);
	font-size: var(--fs-meta);
	letter-spacing: var(--track-meta);
	text-transform: uppercase;
	color: var(--ink);
	list-style: none;
}

.wp-block-details summary::-webkit-details-marker {
	display: none;
}

.wp-block-details summary::before {
	content: "＋";
	flex: none;
	font-size: 12px;
	line-height: 1;
	color: var(--accent);
}

.wp-block-details[open] > summary::before {
	content: "−";
}

.wp-block-details[open] > summary {
	color: var(--accent);
}

.wp-block-details > *:not(summary) {
	margin-block-start: var(--sp-4);
}

/* ==========================================================================
   8. 按鈕
   ========================================================================== */

.wp-block-button__link,
.wp-element-button {
	display: inline-block;
	padding: var(--sp-3) var(--sp-5);
	background-color: var(--accent);
	color: var(--accent-ink);
	border: var(--rule-hair) solid var(--accent);
	border-radius: var(--radius-none);
	font-family: var(--font-mono);
	font-size: var(--fs-meta);
	letter-spacing: var(--track-meta);
	text-transform: uppercase;
	text-decoration: none;
	transition: background-color var(--dur-color) linear, color var(--dur-color) linear,
		border-color var(--dur-color) linear;
}

.wp-block-button__link:hover,
.wp-block-button__link:focus,
.wp-element-button:hover,
.wp-element-button:focus {
	background-color: var(--ink);
	border-color: var(--ink);
	color: var(--bg);
}

.wp-block-button.is-style-outline .wp-block-button__link {
	background-color: transparent;
	color: var(--ink);
	border-color: var(--rule-strong);
}

.wp-block-button.is-style-outline .wp-block-button__link:hover,
.wp-block-button.is-style-outline .wp-block-button__link:focus {
	background-color: var(--ink);
	color: var(--bg);
	border-color: var(--ink);
}

/* ==========================================================================
   9. 查詢 / 文章模板 → 發絲線列表
   ========================================================================== */

.wp-block-post-template,
.wp-block-query-loop {
	list-style: none;
	margin: 0;
	padding: 0;
	border-top: var(--rule-hair) solid var(--rule);
	counter-reset: ink-item;
}

.wp-block-post-template > li,
.wp-block-post-template > .wp-block-post-template__item {
	position: relative;
	display: block;
	padding: var(--sp-5) 0;
	padding-inline-start: 3.4em;
	border-bottom: var(--rule-hair) solid var(--rule);
	counter-increment: ink-item;
	transition: padding-inline-start var(--dur-color) linear;
}

.wp-block-post-template > li:hover,
.wp-block-post-template > li:focus-within {
	padding-inline-start: calc(3.4em + 10px);
}

.wp-block-post-template > li::before {
	content: counter(ink-item, decimal-leading-zero);
	position: absolute;
	inset-inline-start: 0;
	top: var(--sp-5);
	font-family: var(--font-mono);
	font-size: var(--fs-meta);
	line-height: 1.6;
	letter-spacing: var(--track-meta);
	color: var(--muted);
	font-variant-numeric: tabular-nums;
	transition: color var(--dur-color) linear;
}

.wp-block-post-template > li:hover::before,
.wp-block-post-template > li:focus-within::before {
	color: var(--accent);
}

/* 列表項內的文章標題 */
.wp-block-post-template .wp-block-post-title {
	margin: 0;
	font-family: var(--font-heading);
	font-size: clamp(1.15rem, 2.2vw, 1.5rem);
	font-weight: 400;
	line-height: 1.25;
}

.wp-block-post-template .wp-block-post-title a {
	color: var(--ink);
	text-decoration: none;
	transition: color var(--dur-color) linear;
}

.wp-block-post-template .wp-block-post-title a:hover,
.wp-block-post-template .wp-block-post-title a:focus {
	color: var(--accent);
}

/* 一行元信息：日期 · 分類 · 閱讀時長 */
.ink-list__metarow {
	display: flex;
	flex-wrap: wrap;
	align-items: baseline;
	margin-block-start: var(--sp-2);
	font-family: var(--font-mono);
	font-size: var(--fs-meta);
	line-height: 1.6;
	letter-spacing: var(--track-meta);
	text-transform: uppercase;
	color: var(--muted);
	font-variant-numeric: tabular-nums;
}

.ink-list__metarow > * {
	margin: 0;
}

.ink-list__metarow > * + *::before {
	content: "·";
	display: inline-block;
	margin-inline: var(--sp-2);
	color: var(--rule-strong);
}

.ink-list__metarow a {
	color: inherit;
	text-decoration: none;
	border-bottom: var(--rule-hair) solid transparent;
	transition: color var(--dur-color) linear, border-color var(--dur-color) linear;
}

.ink-list__metarow a:hover,
.ink-list__metarow a:focus {
	color: var(--accent);
	border-bottom-color: var(--accent);
}

.wp-block-post-excerpt__excerpt {
	margin: 0;
}

.wp-block-post-excerpt__more-text {
	margin-block-start: var(--sp-2);
}

.wp-block-post-excerpt__more-link {
	font-family: var(--font-mono);
	font-size: var(--fs-meta);
	letter-spacing: var(--track-meta);
	text-transform: uppercase;
	text-decoration: none;
	border-bottom: var(--rule-hair) solid var(--rule);
}

/* 特色圖在列表項中的克制處理 */
.wp-block-post-featured-image {
	margin: var(--sp-4) 0 0;
	max-width: 360px;
}

.wp-block-post-featured-image img {
	border: var(--rule-hair) solid var(--rule);
}

/* 查詢無結果 */
.wp-block-query-no-results {
	padding-block: var(--sp-6);
	border-bottom: var(--rule-hair) solid var(--rule);
	color: var(--muted);
}

/* 查詢標題與分頁 */
.wp-block-query-title,
.wp-block-archive-title {
	margin: 0 0 var(--sp-3);
	font-size: var(--fs-h2);
}

.wp-block-term-description {
	max-width: var(--measure);
	margin-block-end: var(--sp-4);
	color: var(--muted);
	font-size: var(--fs-small);
	line-height: 1.75;
}

/* ==========================================================================
   10. 其他核心塊的克制化
   ========================================================================== */

.wp-block-tag-cloud {
	display: flex;
	flex-wrap: wrap;
	gap: var(--sp-2);
	align-items: baseline;
}

.wp-block-tag-cloud a {
	display: inline-block;
	padding: 2px var(--sp-2);
	border: var(--rule-hair) solid var(--rule);
	color: var(--muted);
	font-family: var(--font-mono);
	font-size: var(--fs-meta) !important;
	letter-spacing: var(--track-meta);
	text-transform: uppercase;
	text-decoration: none;
	transition: color var(--dur-color) linear, border-color var(--dur-color) linear;
}

.wp-block-tag-cloud a:hover,
.wp-block-tag-cloud a:focus {
	color: var(--accent);
	border-color: var(--accent);
}

.wp-block-latest-posts,
.wp-block-archives,
.wp-block-categories,
.wp-block-page-list {
	list-style: none;
	margin: 0;
	padding: 0;
	border-top: var(--rule-hair) solid var(--rule);
	font-variant-numeric: tabular-nums;
}

.wp-block-latest-posts li,
.wp-block-archives li,
.wp-block-categories li,
.wp-block-page-list li {
	margin: 0;
	padding: var(--sp-3) 0;
	border-bottom: var(--rule-hair) solid var(--rule);
	line-height: 1.5;
}

.wp-block-latest-posts a,
.wp-block-archives a,
.wp-block-categories a,
.wp-block-page-list a {
	color: var(--ink);
	text-decoration: none;
}

.wp-block-latest-posts a:hover,
.wp-block-archives a:hover,
.wp-block-categories a:hover,
.wp-block-page-list a:hover {
	color: var(--accent);
}

.wp-block-calendar table {
	border-collapse: collapse;
	font-family: var(--font-mono);
	font-size: var(--fs-caption);
}

.wp-block-calendar th,
.wp-block-calendar td {
	border: var(--rule-hair) solid var(--rule);
	padding: var(--sp-1) var(--sp-2);
	text-align: center;
}

.wp-block-calendar caption {
	font-family: var(--font-mono);
	font-size: var(--fs-meta);
	letter-spacing: var(--track-meta);
	text-transform: uppercase;
	color: var(--muted);
}

.wp-block-social-links .wp-social-link {
	border-radius: 0;
}

.wp-block-file .wp-block-file__button {
	border-radius: 0;
	background-color: var(--accent);
	color: var(--accent-ink);
}

/* 自訂區塊樣式：等寬小字段落 */
.is-style-inkline-meta {
	font-family: var(--font-mono);
	font-size: var(--fs-meta);
	letter-spacing: var(--track-meta);
	text-transform: uppercase;
	color: var(--muted);
	font-variant-numeric: tabular-nums;
}

/* 自訂區塊樣式：結構分隔框（1px 上線 + 2px 下線） */
.is-style-inkline-ruled {
	border-top: var(--rule-hair) solid var(--rule);
	border-bottom: var(--rule-structural) solid var(--rule-strong);
	padding-block: var(--sp-5);
}
