/* ============================================================================
   CardSpicy · 宝可梦收藏百科物种页 —— 折叠轨道（繁中 / 韩文 / 其他语种）
   版本随文件 mtime 自动变化（mu-plugin cs-lang-fold.php 用 filemtime 作版本号）

   这套类名与结构与 Tips 页（#86）的折叠区**完全同构**：
       <details class="cs151-fold" id="tc">
         <summary class="cs151-fold-t"><h2>…</h2><p><span class="cs151-fold-n">39 printings</span>
           <span class="cs151-fold-i" aria-hidden="true"></span></p></summary>
         <div class="cs-lf-body"> … </div>
       </details>

   🔴 为什么这里再声明一遍变量：#86 的变量定义在 `.cs151.cs151` 作用域里，文章页读不到。
      色值取自 `cs-tips151-assets/tips151.css` 顶部（--c-soft / --c-accent / --c-rule），
      改那边时要一起改。
   🔴 summary 里那个 h2 只去外边距，**字号一个像素都不动**（与 #86 一致）。
   ⚠ `alignwide` 由主题提供；文章正文不在 alignwide 容器里时，折叠区跟随正文宽度即可。
   ========================================================================== */

.cs151-fold {
	--c-soft: #8a8880;
	--c-accent: #8b1a1a;
	--c-rule: #edeae2;
	margin-block: 0.5rem 1.1rem;
	scroll-margin-top: 130px; /* 页头是 fixed，锚点落点要避开它 */
}

.cs151-fold > summary {
	display: flex;
	align-items: center;
	gap: 0.6rem;
	padding: 0.78rem 0;
	border-top: 1px solid var(--c-rule);
	border-bottom: 1px solid var(--c-rule);
	cursor: pointer;
	list-style: none;
}

.cs151-fold > summary::-webkit-details-marker { display: none; }
.cs151-fold > summary::marker { content: ""; }

.cs151-fold > summary:focus-visible {
	outline: 2px solid var(--c-accent);
	outline-offset: 3px;
}

.cs151-fold > summary h2 { margin: 0; }

.cs151-fold-n {
	flex: 0 0 auto;
	padding: 0.1rem 0.44rem;
	border: 1px solid #e8cbc9;
	border-radius: 999px;
	background: #fbf4f3;
	font-size: 0.66rem;
	font-weight: 700;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	color: var(--c-accent);
	white-space: nowrap;
}

/* 右侧箭头：收起朝下、展开朝上 */
.cs151-fold-i {
	flex: 0 0 auto;
	width: 0.6em;
	height: 0.6em;
	margin-left: auto;
	border-right: 2px solid var(--c-soft);
	border-bottom: 2px solid var(--c-soft);
	transform: translateY(-0.18em) rotate(45deg);
	transition: transform 0.15s ease;
}

.cs151-fold[open] > summary .cs151-fold-i { transform: translateY(0.18em) rotate(-135deg); }
.cs151-fold[open] > summary { border-bottom-color: transparent; }

/* ---------------- 折叠体 ---------------- */
.cs-lf-body { margin-top: 1rem; }
.cs-lf-body > p:first-child { opacity: 0.86; }
.cs-lf-body > ul { margin-block: 0.9rem 0.6rem; }
.cs-lf-body figure.wp-block-table { margin: 1rem 0; }

@media (max-width: 781px) {
	.cs151-fold > summary { flex-wrap: wrap; }
	.cs-lf-body { margin-top: 0.85rem; }
}

@media (prefers-reduced-motion: reduce) {
	.cs151-fold-i { transition: none; }
}