/* =========================================================================
   电子书商城 · 前台组件样式
   这些样式只负责「组件」外观，可被主题覆盖。主题 ebook-cloud 会提供整体框架样式。
   ========================================================================= */

:root {
	--es-primary: #4338ca;
	--es-primary-dark: #3730a3;
	--es-primary-soft: #eef2ff;
	--es-accent: #d97706;
	--es-danger: #dc2626;
	--es-success: #16a34a;
	--es-ink: #0f172a;
	--es-ink-2: #475569;
	--es-ink-3: #94a3b8;
	--es-line: #e2e8f0;
	--es-bg: #f8fafc;
	--es-surface: #ffffff;
	--es-radius: 14px;
	--es-radius-sm: 9px;
	--es-shadow: 0 1px 2px rgba(15, 23, 42, .06), 0 8px 24px -12px rgba(15, 23, 42, .12);
	--es-shadow-lg: 0 24px 48px -24px rgba(15, 23, 42, .3);
}

/* ---------- 基础 ---------- */
.es-icon { flex: 0 0 auto; vertical-align: -2px; }

.es-grid { display: grid; gap: 22px; }
.es-grid--books { grid-template-columns: repeat(var(--es-cols, 4), minmax(0, 1fr)); }
@media (max-width: 1080px) { .es-grid--books { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 800px)  { .es-grid--books { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; } }
@media (max-width: 460px)  { .es-grid--books { grid-template-columns: 1fr; } }

/* ---------- 按钮 ---------- */
.es-btn {
	display: inline-flex; align-items: center; justify-content: center; gap: 7px;
	padding: 10px 18px; border: 1px solid transparent; border-radius: var(--es-radius-sm);
	font-size: 14px; font-weight: 600; line-height: 1.4; text-decoration: none;
	cursor: pointer; transition: .18s ease; background: var(--es-bg); color: var(--es-ink);
	white-space: nowrap;
}
.es-btn:disabled, .es-btn.is-disabled { opacity: .5; cursor: not-allowed; }
.es-btn--primary { background: var(--es-primary); color: #fff; box-shadow: 0 6px 16px -8px var(--es-primary); }
.es-btn--primary:hover:not(:disabled) { background: var(--es-primary-dark); transform: translateY(-1px); color: #fff; }
.es-btn--outline { background: #fff; border-color: var(--es-primary); color: var(--es-primary); }
.es-btn--outline:hover:not(:disabled) { background: var(--es-primary-soft); color: var(--es-primary); }
.es-btn--ghost { background: transparent; border-color: var(--es-line); color: var(--es-ink-2); }
.es-btn--ghost:hover:not(:disabled) { background: var(--es-bg); color: var(--es-ink); }
.es-btn--light { background: rgba(255, 255, 255, .18); color: #fff; border-color: rgba(255, 255, 255, .35); }
.es-btn--light:hover { background: rgba(255, 255, 255, .3); color: #fff; }
.es-btn--sm { padding: 7px 13px; font-size: 13px; }
.es-btn--lg { padding: 14px 24px; font-size: 15px; }
.es-btn--block { width: 100%; margin-top: 8px; }

/* ---------- 电子书卡片 ---------- */
.es-card {
	display: flex; flex-direction: column; background: var(--es-surface);
	border: 1px solid var(--es-line); border-radius: var(--es-radius); overflow: hidden;
	transition: .22s ease;
}
.es-card:hover { transform: translateY(-4px); box-shadow: var(--es-shadow-lg); border-color: #c7d2fe; }
.es-card__media { position: relative; display: block; aspect-ratio: 5 / 7; background: #e9edf5; overflow: hidden; }
.es-card__media img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform .35s ease; }
.es-card:hover .es-card__media img { transform: scale(1.045); }
.es-card__flag, .es-card__owned {
	position: absolute; top: 10px; left: 10px; padding: 3px 9px; border-radius: 999px;
	font-size: 11px; font-weight: 700; letter-spacing: .02em; backdrop-filter: blur(4px);
}
.es-card__flag { background: rgba(217, 119, 6, .92); color: #fff; }
/* 置顶标（红）固定在左上角；同时是精选时把「精选」让到下一行，避免两个标叠在一起。 */
.es-card__flag--sticky { background: rgba(190, 24, 93, .92); }
.es-card__flag--second { top: 38px; }
.es-card__owned { left: auto; right: 10px; background: rgba(22, 163, 74, .92); color: #fff; }
.es-card__body { display: flex; flex-direction: column; gap: 5px; padding: 11px 13px 13px; flex: 1; }

/* ⚠️ 主题 CSS 排在插件 CSS 之后，且 `.entry-content h3` / `.entry-content p` /
   `.entry-content ul` 都是 (0,1,1)，会盖掉下面这些单类 (0,1,0) 的规则：
   - h3：字号被顶到 17.5px，还多出 `margin: 26px 0 12px`
   - p ：多出 `margin-bottom: 18px`
   - ul：多出 `margin-bottom: 18px` + `padding-left: 22px`
   实测卡片正文被撑到 379px，其中约 99px 是这些「不请自来」的留白 + 字号膨胀，
   整张卡看起来松垮不专业。故卡片内部的行统一用 `.es-card .es-card__x`（0,2,0）提权。 */
.es-card .es-card__top { display: flex; align-items: center; justify-content: space-between; gap: 8px; min-width: 0; min-height: 20px; }
.es-card .es-card__cat {
	flex: none; align-self: auto; font-size: 11px; font-weight: 600; line-height: 1.7;
	color: var(--es-primary); background: var(--es-primary-soft); padding: 0 7px;
	border-radius: 999px; text-decoration: none; white-space: nowrap;
}
.es-card .es-card__cat:hover { color: var(--es-primary-dark); }
.es-card .es-card__title { margin: 0; font-size: 15px; font-weight: 700; line-height: 1.4; }
.es-card .es-card__title a { color: var(--es-ink); text-decoration: none; }
.es-card .es-card__title a:hover { color: var(--es-primary); }
.es-card .es-card__writer {
	margin: 0; font-size: 12px; line-height: 1.5; color: var(--es-ink-3);
	white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.es-card .es-card__excerpt { margin: 0; font-size: 12.5px; line-height: 1.55; color: var(--es-ink-2); }
.es-card .es-card__meta {
	display: flex; flex-wrap: wrap; gap: 9px; margin: 0; padding: 0; list-style: none;
	font-size: 11.5px; line-height: 1.5; color: var(--es-ink-3);
}
/* 主题还有一条 `.entry-content li { margin-bottom: 8px }`（0,1,1），
   作用在 li 上而非 ul，只提权 ul 压不住它（实测把这一行从 17px 顶到 25px）。 */
.es-card .es-card__meta li { margin: 0; }
/* 网格内对齐：标题/简介固定两行高度、作者/元信息预留一行，
   避免「一行标题 vs 两行标题」把同排卡片的作者、简介、角标挤歪。
   列表 / 纯文本 / 瀑布流布局保持自然高度，不受影响。 */
.es-grid--books:not(.es-layout-list):not(.es-layout-plain):not(.es-layout-masonry) > .es-card .es-card__title {
	display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; min-height: 2.8em;
}
.es-grid--books:not(.es-layout-list):not(.es-layout-plain):not(.es-layout-masonry) > .es-card .es-card__top { min-height: 20px; }
.es-grid--books:not(.es-layout-list):not(.es-layout-plain):not(.es-layout-masonry) > .es-card .es-card__excerpt {
	display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; min-height: 3.1em;
}
.es-grid--books:not(.es-layout-list):not(.es-layout-plain):not(.es-layout-masonry) > .es-card .es-card__meta { min-height: 1.5em; }
.es-card__meta li::before { content: "·"; margin-right: 5px; }
.es-card__meta li:first-child::before { content: ""; margin: 0; }
.es-card__footer { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-top: auto; padding-top: 9px; border-top: 1px solid var(--es-line); }
/* 只锁「不收缩」，尺寸仍交给 .es-btn--sm —— 手机端那条会把 --sm 放大到 38px 触控高度，
   这里若也写 padding 会以 (0,2,0) 反压它，把小屏按钮缩回去。 */
.es-card__footer .es-btn { flex: none; }
.es-card__price { display: flex; align-items: baseline; gap: 6px; flex-wrap: wrap; min-width: 0; }
/* 会员免费：价格区的金色状态徽章。旧版把这个「状态」直接当按钮文案用（按钮写「会员免费」），
   用户会以为点一下就免费；现在按钮只写动作，状态由这枚徽章承担。 */
.es-vip-tag {
	flex: none; font-size: 10.5px; font-weight: 700; line-height: 1.7; padding: 0 5px;
	color: #b45309; background: #fef3c7; border: 1px solid #fcd34d; border-radius: 4px; white-space: nowrap;
}

.es-price { font-size: 18px; font-weight: 800; color: var(--es-accent); display: inline-flex; align-items: baseline; }
.es-price em { font-size: 11px; font-style: normal; font-weight: 600; margin-left: 2px; }
.es-price--free { color: var(--es-success); font-size: 15px; }
.es-price-origin { color: var(--es-ink-3); font-size: 12px; }
.es-rating { font-size: 11.5px; color: var(--es-accent); font-weight: 700; }

/* ---------- 徽章 / 标签 ---------- */
.es-badge {
	display: inline-flex; align-items: center; gap: 4px; padding: 2px 9px; border-radius: 999px;
	font-size: 11.5px; font-weight: 700; background: var(--es-primary-soft); color: var(--es-primary);
}
.es-badge--discount { background: #fff7ed; color: var(--es-accent); }
.es-badge[style*="--es-badge-color"] { background: color-mix(in srgb, var(--es-badge-color) 14%, #fff); color: var(--es-badge-color); }
/* 会员等级徽章：等级主色胶囊 + 付费等级的皇冠图标，各等级颜色互不相同便于区分。 */
.es-badge--level svg { flex: none; }
.es-badge--level .es-badge__crown { display: block; }
.es-badge__name { white-space: nowrap; }
.es-tag { padding: 2px 8px; border-radius: 5px; font-size: 11.5px; font-weight: 600; }
.es-tag--new { background: #dcfce7; color: #15803d; }
.es-tag--used { background: #f1f5f9; color: #64748b; }

/* ---------- 提示 ---------- */
.es-alert { padding: 12px 16px; border-radius: var(--es-radius-sm); font-size: 14px; margin: 0 0 16px; border-left: 3px solid; background: #f8fafc; color: var(--es-ink-2); }
.es-alert--success, .es-alert-success { border-color: var(--es-success); background: #f0fdf4; color: #15803d; }
.es-alert--error, .es-alert-error { border-color: var(--es-danger); background: #fef2f2; color: #b91c1c; }
.es-alert--info, .es-alert-info { border-color: var(--es-primary); background: var(--es-primary-soft); color: var(--es-primary-dark); }
.es-hint { font-size: 12.5px; color: var(--es-ink-3); margin: 8px 0 0; }
.es-empty { padding: 26px 0; text-align: center; color: var(--es-ink-3); font-size: 14px; }
.es-up { color: var(--es-success); font-weight: 700; }
.es-down { color: var(--es-danger); font-weight: 700; }

/* ---------- 面板 ---------- */
.es-panel { background: var(--es-surface); border: 1px solid var(--es-line); border-radius: var(--es-radius); padding: 16px 18px; margin-bottom: 14px; }
.es-panel__title { margin: 0 0 4px; font-size: 17px; font-weight: 700; }
.es-panel__title em { font-style: normal; font-size: 13px; color: var(--es-ink-3); font-weight: 500; margin-left: 5px; }
.es-panel__desc { margin: 0 0 6px; font-size: 12.5px; color: var(--es-ink-2); line-height: 1.5; }

/* ---------- 筛选条 ---------- */
.es-filters { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px 16px; flex-wrap: wrap; margin-bottom: 22px; }
/* ⚠️ flex-basis 必须是 0（不是 auto）：本行是 flex-wrap 容器，换行按「假想主轴尺寸」判定，
   而 flex:1 1 auto 的假想尺寸 = 全部 chip 的 max-content（几十个分类有数千 px），
   于是搜索框每次都被先甩到下一行（收缩只发生在同一行内，救不回来）。
   flex-basis:0 + min-width 夹住假想尺寸 → 宽屏同行、窄屏（<约 520px）才让搜索框换行独占一行。 */
.es-filters__catbox { flex: 1 1 0%; min-width: 240px; display: flex; flex-direction: column; align-items: flex-start; gap: 10px; }
.es-filters__cats { display: flex; flex-wrap: wrap; gap: 8px; }
/* 分类超过两行时：脚本给 .is-clamped 并写死 max-height，把多出来的分类收起来，
   由「展开全部分类」放开 —— 否则分类一多就是一整墙 chip，把书都顶到屏幕外。 */
.es-filters__cats.is-clamped { overflow: hidden; }
.es-filters__more { display: inline-flex; align-items: center; gap: 4px; padding: 0; border: 0; background: none; color: var(--es-primary); font-size: 13px; line-height: 1.6; cursor: pointer; }
.es-filters__more:hover { text-decoration: underline; }
/* ⚠️ [hidden] 必须显式重声明：上面的 display:inline-flex 会盖掉 UA 的 [hidden]{display:none} */
.es-filters__more[hidden] { display: none; }
.es-filters__more-caret { font-size: 10px; }
.es-filters__search { flex: 0 0 auto; margin-left: auto; }
.es-chip {
	display: inline-flex; align-items: center; gap: 6px; padding: 7px 14px; border-radius: 999px;
	background: #fff; border: 1px solid var(--es-line); font-size: 13px; color: var(--es-ink-2);
	text-decoration: none; transition: .16s;
}
.es-chip:hover { border-color: #c7d2fe; color: var(--es-primary); }
.es-chip.is-active { background: var(--es-primary); border-color: var(--es-primary); color: #fff; }
.es-chip em { font-style: normal; font-size: 11px; opacity: .7; }
.es-filters__search form { display: flex; gap: 8px; }
.es-filters__search input[type="search"] {
	width: 200px; padding: 8px 14px; border: 1px solid var(--es-line); border-radius: var(--es-radius-sm);
	font-size: 13.5px; background: #fff;
}
.es-filters__search input[type="search"]:focus { outline: 2px solid var(--es-primary-soft); border-color: var(--es-primary); }

/* ---------- 购买区 ---------- */
.es-buybox { background: var(--es-surface); border: 1px solid var(--es-line); border-radius: var(--es-radius); padding: 22px; box-shadow: var(--es-shadow); }
.es-buybox__price { display: flex; align-items: baseline; flex-wrap: wrap; gap: 10px; }
.es-buybox__label { font-size: 13px; color: var(--es-ink-3); }
.es-buybox__value { font-size: 30px; font-weight: 800; color: var(--es-accent); display: inline-flex; align-items: baseline; }
.es-buybox__value em { font-size: 13px; font-style: normal; margin-left: 3px; }
.es-buybox__balance { margin: 12px 0 0; font-size: 13px; color: var(--es-ink-2); }
.es-buybox__balance strong { color: var(--es-ink); }
.es-buybox__balance a { color: var(--es-primary); }
.es-buybox__actions { margin-top: 16px; }
.es-buybox__file { margin: 16px 0 0; padding: 14px 0 0; border-top: 1px dashed var(--es-line); list-style: none; display: grid; gap: 8px; font-size: 13px; color: var(--es-ink-2); }
.es-buybox__file li { display: flex; align-items: center; gap: 7px; }
.es-buybox__notice { margin: 14px 0 0; font-size: 12px; color: var(--es-ink-3); line-height: 1.6; }

/* ---------- 「开通会员，本书免费领」提示框 ----------
   只出现在「已登录 + 未拥有 + 本书有售价」的详情页右栏。
   内部只用 div/span/a：主题 `.entry-content p|ul|li` 排在插件 CSS 之后会加 18px 级外边距。
   ⚠️ CTA 选择器必须写到 (0,2,0)：`.entry-content a` 是 (0,1,1)，单类 (0,1,0) 压不住下划线。 */
.es-vip-hint {
	display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 5px 12px;
	align-items: center; margin: 14px 0 0; padding: 12px 14px;
	background: linear-gradient(135deg, #fffbeb, #fef3c7 80%);
	border: 1px solid #fcd34d; border-radius: var(--es-radius-sm);
}
.es-vip-hint__head { grid-column: 1; grid-row: 1; display: flex; align-items: center; gap: 6px; min-width: 0; }
.es-vip-hint__icon { display: inline-flex; flex: none; color: var(--es-accent); }
.es-vip-hint__title { font-size: 13.5px; font-weight: 700; color: #92400e; }
.es-vip-hint__desc { grid-column: 1; grid-row: 2; font-size: 12.5px; color: #b45309; line-height: 1.5; }
.es-vip-hint .es-vip-hint__cta {
	grid-column: 2; grid-row: 1 / span 2; align-self: center;
	background: var(--es-accent); border-color: var(--es-accent); color: #fff;
	text-decoration: none; box-shadow: 0 6px 14px -8px var(--es-accent);
}
.es-vip-hint .es-vip-hint__cta:hover:not(:disabled) { background: #b45309; border-color: #b45309; color: #fff; }
@media (max-width: 520px) {
	.es-vip-hint { grid-template-columns: minmax(0, 1fr); }
	.es-vip-hint .es-vip-hint__cta { grid-column: 1; grid-row: 3; justify-self: stretch; }
}

/* ---------- 购买 / 领取确认弹窗（取代 window.confirm） ----------
   骨架在 wp_footer（body 直属子节点，不受 .entry-content 污染）。
   z-index 取 100002：主题顶栏 600 / 悬浮按钮 100000 / 后台通告 99999 / 求书弹窗 100001。
   结构上不套 overflow 容器 —— 祖先若带 transform/filter 会成为 fixed 的包含块，弹窗就跑不到视口正中。 */
.es-confirm {
	position: fixed; inset: 0; z-index: 100002;
	display: flex; align-items: center; justify-content: center; padding: 20px;
}
.es-confirm[hidden] { display: none; }
.es-confirm__mask {
	position: absolute; inset: 0; background: rgba(15, 23, 42, .55);
	-webkit-backdrop-filter: blur(2px); backdrop-filter: blur(2px);
}
.es-confirm__box {
	position: relative; width: 100%; max-width: 372px; text-align: center;
	background: var(--es-surface); border-radius: 18px; padding: 26px 24px 22px;
	box-shadow: var(--es-shadow-lg); animation: es-confirm-in .2s ease-out;
}
@keyframes es-confirm-in {
	from { opacity: 0; transform: translateY(10px) scale(.97); }
	to   { opacity: 1; transform: none; }
}
.es-confirm__close {
	position: absolute; top: 12px; right: 12px; width: 30px; height: 30px;
	display: inline-flex; align-items: center; justify-content: center;
	border: 0; background: transparent; border-radius: 50%; padding: 0;
	font-size: 20px; line-height: 1; color: var(--es-ink-3); cursor: pointer; transition: .15s ease;
}
.es-confirm__close:hover { background: var(--es-bg); color: var(--es-ink); }
.es-confirm__icon {
	width: 52px; height: 52px; margin: 0 auto 12px;
	display: flex; align-items: center; justify-content: center;
	border-radius: 50%; background: var(--es-primary-soft); color: var(--es-primary);
}
.es-confirm__box[data-pay-icon="crown"] .es-confirm__icon { background: #fff7ed; color: var(--es-accent); }
.es-confirm__title { font-size: 17px; font-weight: 800; color: var(--es-ink); line-height: 1.35; }
.es-confirm__book { margin-top: 6px; font-size: 13px; color: var(--es-ink-3); line-height: 1.5; word-break: break-word; }
.es-confirm__facts {
	margin-top: 16px; padding: 4px 14px; background: var(--es-bg);
	border: 1px solid var(--es-line); border-radius: var(--es-radius-sm);
}
.es-confirm__fact { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 9px 0; font-size: 13px; color: var(--es-ink-2); }
.es-confirm__fact + .es-confirm__fact { border-top: 1px dashed var(--es-line); }
.es-confirm__fact-k { flex: none; }
.es-confirm__fact-v { font-weight: 600; color: var(--es-ink); text-align: right; }
.es-confirm__fact-v.is-strong { font-size: 15px; font-weight: 800; color: var(--es-accent); }
.es-confirm__acts { display: flex; gap: 10px; margin-top: 18px; }
.es-confirm__acts .es-btn { flex: 1 1 0; }
.es-confirm__note { margin-top: 12px; font-size: 11.5px; color: var(--es-ink-3); line-height: 1.6; }
body.is-es-confirm-open { overflow: hidden; }
@media (max-width: 520px) {
	.es-confirm { padding: 16px; }
	.es-confirm__box { padding: 22px 18px 18px; border-radius: 16px; }
	.es-confirm__acts { flex-direction: column; }
}

/* ---------- 会员中心布局 ---------- */
.es-member { display: grid; grid-template-columns: 262px minmax(0, 1fr); gap: 22px; align-items: start; }
@media (max-width: 900px) { .es-member { grid-template-columns: 1fr; } }
.es-member__main { min-width: 0; }
.es-member__head {
	display: flex; align-items: center; gap: 16px; background: var(--es-surface);
	border: 1px solid var(--es-line); border-radius: var(--es-radius); padding: 20px 24px; margin-bottom: 20px;
}
.es-member__head > div:nth-child(2) { flex: 1; min-width: 0; }
.es-member__hi { margin: 0; font-size: 17px; font-weight: 700; }
.es-member__sub { margin: 5px 0 0; font-size: 13px; color: var(--es-ink-2); display: flex; align-items: center; gap: 7px; flex-wrap: wrap; }
.es-avatar {
	width: 48px; height: 48px; border-radius: 14px; display: grid; place-items: center;
	background: linear-gradient(135deg, var(--es-primary), #7c3aed); color: #fff; font-size: 20px; font-weight: 700;
}

/* ---------- 侧栏 ---------- */
.es-sidebar { position: sticky; top: 20px; display: grid; gap: 14px; }
@media (max-width: 900px) { .es-sidebar { position: static; } }
.es-wallet-card {
	background: linear-gradient(140deg, #4338ca, #6d28d9 60%, #7c3aed); color: #fff;
	border-radius: var(--es-radius); padding: 22px; box-shadow: 0 18px 36px -22px rgba(67, 56, 202, .9);
}
.es-wallet-card__label { margin: 0; font-size: 12.5px; opacity: .82; }
.es-wallet-card__value { margin: 4px 0 0; font-size: 34px; font-weight: 800; line-height: 1.1; }
.es-wallet-card__level { margin: 12px 0 14px; font-size: 12.5px; display: inline-flex; align-items: center; gap: 6px; background: rgba(255, 255, 255, .16); padding: 4px 11px; border-radius: 999px; }
.es-member-nav { display: grid; gap: 2px; background: var(--es-surface); border: 1px solid var(--es-line); border-radius: var(--es-radius); padding: 8px; }
.es-member-nav a { padding: 10px 14px; border-radius: var(--es-radius-sm); font-size: 14px; color: var(--es-ink-2); text-decoration: none; transition: .16s; }
.es-member-nav a:hover { background: var(--es-bg); color: var(--es-ink); }
.es-member-nav a.is-active { background: var(--es-primary-soft); color: var(--es-primary); font-weight: 600; }

/* ---------- 我的信息（资料卡 · 紧凑双栏） ---------- */
.es-profile { padding: 12px 16px; }
.es-profile .es-panel__title { margin-bottom: 8px; }
.es-profile__top {
	display: flex; align-items: center; gap: 12px;
	margin: 0 0 6px; padding: 0 0 6px;
	border-bottom: 1px solid var(--es-line);
}
.es-profile__top .es-avatar { width: 34px; height: 34px; border-radius: 10px; font-size: 14px; flex: 0 0 auto; }
.es-profile__intro { flex: 1; min-width: 0; }
.es-profile__name { margin: 0; font-size: 13.5px; font-weight: 700; color: var(--es-ink); line-height: 1.2; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.es-profile__uid { margin: 2px 0 0; font-size: 11px; color: var(--es-ink-3); letter-spacing: .02em; }
.es-info { margin: 0; padding: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1px 14px; }
.es-info__row {
	display: grid; grid-template-columns: 84px minmax(0, 1fr);
	align-items: baseline; gap: 8px; padding: 2px 0;
	border-bottom: 1px dashed var(--es-line);
}
.es-info__row dt { margin: 0; font-size: 12px; color: var(--es-ink-3); }
.es-info__row dd { margin: 0; font-size: 13px; color: var(--es-ink); display: flex; align-items: center; gap: 7px; flex-wrap: wrap; line-height: 1.3; }
.es-info__num { display: inline-flex; align-items: baseline; gap: 3px; }
.es-info__num strong { font-size: 15px; font-weight: 800; color: var(--es-brand, #e11d48); line-height: 1; }
.es-info__unit { font-size: 12px; color: var(--es-ink-2); }
.es-info__tag {
	display: inline-flex; align-items: center;
	font-size: 11px; font-weight: 700; color: #15803d;
	background: #f0fdf4; border: 1px solid #bbf7d0; border-radius: 999px; padding: 1px 8px;
}
@media (max-width: 560px) {
	.es-info { grid-template-columns: 1fr; gap: 0; }
	.es-info__row { grid-template-columns: 100px minmax(0, 1fr); gap: 10px; }
	.es-info__row dd { font-size: 13.5px; }
}

/* ---------- 表格 ---------- */
.es-table { width: 100%; border-collapse: collapse; font-size: 13.5px; }
.es-table th, .es-table td { padding: 11px 12px; text-align: left; border-bottom: 1px solid var(--es-line); }
.es-table th { font-weight: 600; color: var(--es-ink-2); background: var(--es-bg); font-size: 12.5px; }
.es-table tr:last-child td { border-bottom: 0; }
.es-table code { font-size: 12px; background: var(--es-bg); padding: 2px 6px; border-radius: 4px; }
/* 下载记录的操作列：按钮列窄且右对齐，别跟着书名一起被撑开。
   ⚠️ 必须写到 (0,2,1)：上面 `.es-table th, .es-table td { text-align: left }` 是 (0,1,1)，
   裸写 `.es-table__act`(0,1,0) 的 text-align:right 会被静默盖掉（实测 align 仍是 left）。
   `width: 1%` + nowrap 是「按内容收窄」的经典写法，省下的宽度留给书名列。 */
.es-table th.es-table__act, .es-table td.es-table__act { width: 1%; white-space: nowrap; text-align: right; }
.es-muted { color: var(--es-ink-3); }
/* 表格的横向滚动容器（个人中心 3 张表都套了）。
   ⚠️ 必须真的包一层 overflow 容器：直接给 <table> 加 display:block 会让行内边框渲染走样，
   而 overflow 留在 .es-panel 上会让标题跟着一起横向滚走。窄屏下表格在自己盒子里滚动，整页不再溢出。 */
.es-table-wrap { overflow-x: auto; -webkit-overflow-scrolling: touch; }
@media (max-width: 720px) {
	.es-table { font-size: 12.5px; }
	.es-table th, .es-table td { padding: 9px 10px; }
	/* 下载记录：手机上 IP 列信息量最低，让位给「操作」列 —— 让按钮不用横向滚动就能看见。 */
	#downloads .es-table th:nth-child(3),
	#downloads .es-table td:nth-child(3) { display: none; }
	/* 操作列贴着右边，省掉左侧内边距。 */
	.es-table td.es-table__act { padding-left: 4px; }
}

/* ---------- 书库列表 ---------- */
.es-lib-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 12px; }
.es-lib-item { display: flex; align-items: center; gap: 14px; padding: 12px; border: 1px solid var(--es-line); border-radius: var(--es-radius-sm); background: #fff; transition: .18s; }
.es-lib-item:hover { border-color: #c7d2fe; background: #fcfdff; }
.es-lib-item img { width: 58px; height: 80px; object-fit: cover; border-radius: 6px; flex: 0 0 auto; }
.es-lib-item__info { flex: 1; min-width: 0; }
.es-lib-item__title { font-size: 14.5px; font-weight: 600; color: var(--es-ink); text-decoration: none; display: block; overflow-wrap: anywhere; }
.es-lib-item__title:hover { color: var(--es-primary); }
.es-lib-item__meta { margin: 5px 0 0; font-size: 12px; color: var(--es-ink-3); overflow-wrap: anywhere; }
/* 下载按钮不参与收缩：文案变长（如「网盘下载（3 个源）」）时宁可挤书名也别把按钮压变形。 */
.es-lib-item > .es-btn { flex: 0 0 auto; }

/* 下载按钮上的两类小标：外链角标（直链型网盘源）/ 源数量（多源网盘）。
   `.es-btn` 本身 gap 7px，括号与角标贴太开，各自回一点。 */
.es-btn__ext { opacity: .75; margin-left: -3px; }
.es-btn__count { font-size: 12px; font-weight: 500; opacity: .85; margin-left: -4px; }

@media (max-width: 560px) {
	/* 窄屏收紧，给书名留出可读宽度。 */
	.es-lib-item { gap: 10px; padding: 10px; }
	.es-lib-item > .es-btn { padding: 7px 10px; gap: 5px; }
	.es-lib-item > .es-btn .es-btn__count { font-size: 11px; margin-left: -3px; }
}

/* ---------- 充值 ---------- */
.es-redeem { display: flex; gap: 10px; flex-wrap: wrap; }
.es-input { padding: 12px 16px; border: 1px solid var(--es-line); border-radius: var(--es-radius-sm); font-size: 14px; background: #fff; }
.es-input:focus { outline: 2px solid var(--es-primary-soft); border-color: var(--es-primary); }
.es-input--code { flex: 1; min-width: 220px; font-family: ui-monospace, SFMono-Regular, Menlo, monospace; letter-spacing: .12em; text-transform: uppercase; }
.es-result:empty { display: none; }
.es-result { margin-top: 16px; }
.es-result .es-alert { margin: 0; }

/* ---------- 会员套餐 ---------- */
.es-membership__head { text-align: center; margin-bottom: 28px; }
.es-membership__head h2 { margin: 0 0 10px; font-size: 26px; }
.es-membership__head p { margin: 0 auto; max-width: 620px; color: var(--es-ink-2); font-size: 14.5px; line-height: 1.75; }
/* ⚠️ 主题 CSS 排在插件 CSS 之后，`.entry-content p { margin: 0 0 18px }`(0,1,1) 会盖掉上面的 `margin:0 auto`，
   导致这段副标题的 max-width 居中失效、整段贴在容器左侧（文字只在自身 620px 内居中，看着就是没居中）。
   这里用 (0,2,1) 提权把左右 auto 拿回来；两条选择器都写，兼顾不在 .entry-content 里的场景。 */
.es-membership__head p,
.entry-content .es-membership__head p { margin-left: auto; margin-right: auto; }
.es-membership__balance { margin-top: 12px !important; font-size: 13.5px; }
.es-plans { display: flex; flex-wrap: nowrap; gap: 18px; margin-bottom: 28px; align-items: stretch; }
/* 平板端：5 列并排时会被压缩到装不下「求书广场免费置顶」等权益文案，改为 3 列两行更易读 */
@media (max-width: 1023px) { .es-plans { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); flex-wrap: wrap; } }
/* 手机端：最多一行两个，避免窄屏被压成单行过窄 */
@media (max-width: 768px) { .es-plans { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); flex-wrap: wrap; } }
.es-plan {
	position: relative; background: #fff; border: 1px solid var(--es-line); border-radius: var(--es-radius);
	padding: 24px 20px; display: flex; flex-direction: column; transition: .2s;
	flex: 1 1 0; min-width: 0;
}
.es-plan:hover { transform: translateY(-3px); box-shadow: var(--es-shadow-lg); }
.es-plan.is-current { border-color: var(--plan-color); box-shadow: 0 0 0 2px color-mix(in srgb, var(--plan-color) 22%, transparent); }
.es-plan__ribbon { position: absolute; top: -11px; left: 50%; transform: translateX(-50%); background: var(--plan-color); color: #fff; font-size: 11px; font-weight: 700; padding: 3px 12px; border-radius: 999px; white-space: nowrap; }
.es-plan__name { margin: 0 0 10px; font-size: 16px; font-weight: 700; color: var(--plan-color); }
.es-plan__price { margin: 0 0 8px; display: flex; align-items: baseline; gap: 5px; }
.es-plan__num { font-size: 30px; font-weight: 800; color: var(--es-ink); line-height: 1; }
.es-plan__unit { font-size: 12.5px; color: var(--es-ink-3); }
.es-plan__origin { font-size: 14px; font-weight: 600; color: var(--es-ink-3); text-decoration: line-through; margin-right: 8px; align-self: center; }
/* 营销活动标签（活动比会员等级折扣更划算时显示） */
.es-plan__promo { display: inline-block; margin-left: 8px; padding: 2px 8px; border-radius: 999px; font-size: 11.5px; font-weight: 700; color: #fff; background: var(--es-brand, #e11d48); align-self: center; white-space: nowrap; }
.es-plan__desc { margin: 0 0 16px; font-size: 12.5px; color: var(--es-ink-3); line-height: 1.6; min-height: 40px; }
.es-plan__features { list-style: none; margin: 0 0 20px; padding: 0; display: grid; gap: 9px; font-size: 13px; color: var(--es-ink-2); }
.es-plan__features li { display: flex; align-items: center; gap: 7px; }
.es-plan__features svg { color: var(--es-success); flex: none; }
/* 「求书广场免费置顶」权益行：整行不换行，避免尾字掉到下一行 */
.es-plan__feat--sticky { font-size: 12.5px; }
/* 「会员期内自动签到」权益行：同上收一号字，保证 5 列并排下单行放下 */
.es-plan__feat--auto { font-size: 12.5px; }
.es-plan__feat-text { white-space: nowrap; }
/* 超窄屏（单卡过窄）时退回自动换行，宁可折行也不让文字溢出卡片 */
@media (max-width: 400px) { .es-plan__feat-text { white-space: normal; } }
.es-plan > .es-btn { margin-top: auto; }

/* 会员页紧凑布局：收紧留白，一屏尽量放得下更多套餐 */
.es-membership--compact .es-membership__head { margin-bottom: 14px; }
.es-membership--compact .es-membership__head h2 { font-size: 21px; margin-bottom: 6px; }
.es-membership--compact .es-membership__head p { font-size: 13px; line-height: 1.6; }
.es-membership--compact .es-plans { gap: 12px; margin-bottom: 16px; }
.es-membership--compact .es-plan { padding: 16px 14px; }
.es-membership--compact .es-plan__name { margin-bottom: 6px; font-size: 14.5px; }
/* 价格行整行不换行：「/ 永久」比「/ 月」宽，遇促销标签时整行会换到第二行并溢出卡片。
   收紧间距与字号，让 5 列并排下也是单行。 */
.es-membership--compact .es-plan__price { margin-bottom: 6px; flex-wrap: nowrap; gap: 3px; white-space: nowrap; }
.es-membership--compact .es-plan__num { font-size: 22px; }
.es-membership--compact .es-plan__origin { margin-right: 0; }
.es-membership--compact .es-plan__promo { margin-left: 4px; padding: 2px 6px; }
.es-membership--compact .es-plan__desc { margin-bottom: 10px; font-size: 12px; min-height: 0; }
.es-membership--compact .es-plan__features { gap: 6px; margin-bottom: 12px; font-size: 12.5px; }
.es-membership--compact .es-plan__ribbon { top: -9px; font-size: 10.5px; padding: 2px 10px; }

/* 营销活动条：文案 / 力度 / 时间 / 剩余天数 */
.es-mk-bar { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 10px; margin: 0 0 16px; padding: 10px 14px; border: 1px dashed var(--es-brand, #e11d48); border-radius: var(--es-radius); background: color-mix(in srgb, var(--es-brand, #e11d48) 6%, transparent); }
.es-mk-bar__label { font-size: 11.5px; font-weight: 700; color: #fff; background: var(--es-brand, #e11d48); padding: 2px 8px; border-radius: 999px; white-space: nowrap; }
.es-mk-bar__item { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 8px; font-size: 13px; }
.es-mk-bar__badge { font-weight: 800; color: var(--es-brand, #e11d48); background: #fff; border: 1px solid var(--es-brand, #e11d48); border-radius: 6px; padding: 1px 7px; font-size: 12px; white-space: nowrap; }
.es-mk-bar__name { font-weight: 700; color: var(--es-ink); }
.es-mk-bar__time { color: var(--es-ink-3); font-size: 12px; white-space: nowrap; }
.es-mk-bar__msg { color: var(--es-ink-2); font-size: 12.5px; }
@media (max-width: 560px) { .es-mk-bar { flex-direction: column; align-items: flex-start; } }
/* 充值中心手机端：隐藏红色虚线「当前活动」框（运营位，窄屏不必要）。 */
@media (max-width: 560px) { .es-member--recharge .es-mk-bar { display: none; } }
/* 充值中心手机端：布局收成单列时隐藏整块左栏（钱包卡 + 会员导航）。
   该页「我的信息」卡已展示余额，导航另可从顶部菜单进入；隐藏后「在线充值」直接出现在首屏。 */
@media (max-width: 900px) { .es-member--recharge .es-sidebar { display: none; } }

/* ---------- FAQ ---------- */
.es-faq details { border-bottom: 1px dashed var(--es-line); padding: 12px 0; }
.es-faq details:last-child { border-bottom: 0; }
.es-faq summary { cursor: pointer; font-size: 14.5px; font-weight: 600; color: var(--es-ink); }
.es-faq summary:hover { color: var(--es-primary); }
.es-faq p { margin: 10px 0 0; font-size: 13.5px; color: var(--es-ink-2); line-height: 1.75; }

/* ---------- 每日签到 ---------- */
.es-checkin {
	background: linear-gradient(135deg, #4338ca, #6d28d9 55%, #7c3aed);
	color: #fff; border-radius: var(--es-radius); padding: 20px 22px; margin-bottom: 20px;
	box-shadow: 0 16px 34px -22px rgba(67, 56, 202, .8);
}
.es-checkin__head { display: flex; align-items: center; gap: 12px; }
.es-checkin__icon { width: 44px; height: 44px; border-radius: 12px; display: grid; place-items: center; background: rgba(255, 255, 255, .16); flex: 0 0 auto; }
.es-checkin__icon .es-icon { color: #fff; }
.es-checkin__titlewrap { flex: 1; min-width: 0; }
.es-checkin__title { margin: 0; font-size: 17px; font-weight: 700; }
.es-checkin__sub { margin: 3px 0 0; font-size: 12.5px; opacity: .82; }
.es-checkin__balance { font-size: 12.5px; background: rgba(255, 255, 255, .16); padding: 5px 12px; border-radius: 999px; white-space: nowrap; }
.es-checkin__balance strong { font-weight: 700; }
.es-checkin__body { margin-top: 16px; }
.es-checkin__status { margin: 0 0 12px; font-size: 13.5px; display: flex; align-items: center; gap: 6px; }
.es-checkin__status.is-done { color: #d1fae5; }
.es-checkin__status strong { font-weight: 800; }
.es-checkin__modes { display: flex; gap: 10px; margin-bottom: 14px; flex-wrap: wrap; }
.es-checkin__mode {
	display: inline-flex; align-items: center; gap: 6px; cursor: pointer;
	background: rgba(255, 255, 255, .14); border: 1px solid transparent; border-radius: 999px;
	padding: 7px 14px; font-size: 13px;
}
.es-checkin__mode.is-active { background: #fff; color: var(--es-primary-dark); border-color: #fff; font-weight: 600; }
.es-checkin .es-btn--primary { background: #fff; color: var(--es-primary-dark); box-shadow: none; }
.es-checkin .es-btn--primary:hover:not(:disabled) { background: #f1f5f9; }
.es-checkin .es-btn:disabled { opacity: .8; }
.es-checkin__result:empty { display: none; }
.es-checkin__auto { margin-top: 16px; padding-top: 14px; border-top: 1px solid rgba(255, 255, 255, .22); }
.es-checkin__auto-label { display: inline-flex; align-items: center; gap: 8px; cursor: pointer; font-size: 14px; font-weight: 600; }
.es-checkin__auto-label.is-disabled { cursor: not-allowed; opacity: .55; filter: grayscale(1); }
.es-checkin__auto-label input { width: 16px; height: 16px; accent-color: #fff; }
.es-checkin__auto-label.is-disabled input { cursor: not-allowed; }
.es-checkin__auto-tip { margin: 8px 0 0; font-size: 12px; line-height: 1.5; opacity: .82; }
.es-checkin__auto-tip.is-locked { opacity: .95; color: #fde68a; }

/* ---------- 每日签到 · 弹窗形态（会员中心） ----------
   展现形式变成「入口条 + 弹窗」，内容/逻辑与卡片形态完全共用，
   .es-checkin 的原有样式照常生效，只是不再自带外边距与投影（交给弹窗盒子）。 */
.es-checkin-entry {
	display: flex; align-items: center; gap: 12px; margin-bottom: 20px;
	padding: 14px 18px; background: #fff; border: 1px solid var(--es-line);
	border-radius: var(--es-radius); box-shadow: var(--es-shadow);
}
.es-checkin-entry__icon {
	width: 38px; height: 38px; flex: 0 0 auto; border-radius: 11px; display: grid; place-items: center;
	background: linear-gradient(135deg, #4338ca, #7c3aed); color: #fff;
}
.es-checkin-entry__text { flex: 1; min-width: 0; }
.es-checkin-entry__title { margin: 0; font-size: 15px; font-weight: 700; color: var(--es-ink); }
.es-checkin-entry__sub { margin: 2px 0 0; font-size: 12.5px; color: var(--es-ink-3); }
.es-checkin-entry .es-btn { flex: 0 0 auto; }

.es-checkin-modal { position: fixed; inset: 0; z-index: 9999; display: flex; align-items: center; justify-content: center; }
.es-checkin-modal[hidden] { display: none; }
.es-checkin-modal__mask { position: absolute; inset: 0; background: rgba(15, 23, 42, .55); animation: esFade .18s ease-out; }
.es-checkin-modal__box {
	position: relative; width: 384px; max-width: calc(100vw - 32px); border-radius: 16px; overflow: hidden;
	box-shadow: 0 24px 60px -12px rgba(15, 23, 42, .45); animation: esPop .2s ease-out;
}
.es-checkin-modal__close {
	position: absolute; top: 8px; right: 10px; z-index: 1; border: 0; background: transparent; cursor: pointer;
	font-size: 22px; line-height: 1; color: rgba(255, 255, 255, .8); padding: 2px 7px;
}
.es-checkin-modal__close:hover { color: #fff; }
.es-checkin-modal .es-checkin { margin: 0; box-shadow: none; border-radius: 0; }
.es-checkin-modal .es-result { margin-top: 14px; }
@keyframes esFade { from { opacity: 0; } to { opacity: 1; } }
@keyframes esPop { from { opacity: 0; transform: translateY(10px) scale(.97); } to { opacity: 1; transform: none; } }
@media (max-width: 560px) {
	.es-checkin-entry { padding: 12px 14px; }
	.es-checkin-entry__icon { width: 34px; height: 34px; }
	.es-checkin-modal__box { width: auto; }
}

/* ---------- 每日签到 · 侧栏组件（[es_checkin display="widget"]） ----------
   侧栏宽度摆不下整张签到卡，这里只放「连续天数 + 签到键 + 排行前三 + 排行入口」，
   排行榜明细与积分模式选择收进弹窗。
   组件可能出现在侧栏，也可能被短码塞进正文 → 内部只用 div/span，
   避免主题 .entry-content 的 p/ul/li 规则（在插件 CSS 之后）代入留白与项目符号。 */
.es-ckw {
	background: var(--es-surface); border: 1px solid var(--es-line); border-radius: var(--es-radius);
	padding: 14px; margin-bottom: 20px; box-shadow: var(--es-shadow);
	/* ⚠️ 兜底：内层开了容器查询（inline-size containment），组件一旦**直接**当 flex 子项，
	   本元素的 max-content 会被算成 0 而塌成一条线。min(100%,220px) 永远不超过父容器宽度，
	   所以窄侧栏也不会被顶出去 —— 实测 600px 的 flex 行里停在 220px，180px 侧栏里等于满宽。 */
	min-width: min(100%, 220px);
}
/* 宽度自适应容器（组件可能落在**任意宽度**的侧栏里，站长随时会调侧栏宽度）。
   按「容器宽度」而不是「视口宽度」切换排布 —— 仅靠视口 media 查询没用：
   1400px 的屏幕上照样可能出现 200px 的窄侧栏。
   ⚠️ container-type 会开启 layout containment，把 position:fixed 的后代改成相对本元素定位，
   所以承载它的必须是这层内包装，两个弹窗（签到排行 / 模式选择）留在它外面；
   顺带也就没有了「inline-size containment 让元素在 flex 行里塌成 0 宽」的隐患。
   查询尺寸是**内容盒**：卡片 200px 时容器为 170px（减去 1px 边框 ×2 + 14px 内边距 ×2）。 */
.es-ckw__inner { container-type: inline-size; container-name: es-checkin; }
.es-ckw__title { display: flex; align-items: center; gap: 6px; margin: 0 0 10px; font-size: 15px; font-weight: 800; color: #ec4899; }
.es-ckw__title-icon { display: inline-flex; color: #ec4899; }
.es-ckw__bar {
	display: flex; align-items: center; gap: 10px; padding: 12px 14px; border-radius: 12px;
	background: linear-gradient(135deg, #ff7a45, #ff3d6e 90%); color: #fff;
	box-shadow: 0 10px 22px -14px rgba(255, 61, 110, .95);
	/* 兜底（不支持容器查询的浏览器）：文字区基线 150px，摆不下时签到键自己换行到下一排，
	   而不是把「已连续签到 4 天」挤成一列竖排。 */
	flex-wrap: wrap;
}
.es-ckw__bar-main { flex: 1 1 150px; min-width: 0; }
.es-ckw__streak { font-size: 15px; font-weight: 700; line-height: 1.3; }
.es-ckw__streak strong { font-size: 19px; font-weight: 800; margin: 0 2px; }
.es-ckw__bar-sub { margin-top: 3px; font-size: 11.5px; opacity: .92; }
.es-ckw__btn {
	flex: 0 0 auto; margin-left: auto; width: 50px; height: 50px; padding: 0; border: 0; border-radius: 50%; cursor: pointer;
	display: grid; place-items: center; background: #fff; color: #ff3d6e;
	font-size: 13px; font-weight: 800; text-decoration: none; line-height: 1;
	box-shadow: 0 6px 14px -6px rgba(15, 23, 42, .45); transition: .18s ease;
}
.es-ckw__btn:hover:not(:disabled) { transform: scale(1.06); color: #e11d48; }
.es-ckw__btn.is-done { cursor: default; opacity: .82; }

/* ---------- 每日签到组件的宽度分级（容器查询，量的是侧栏给它的实际宽度） ---------- */
/* ① 窄侧栏（≤300px）：先把字号与内边距收紧 */
@container es-checkin (max-width: 300px) {
	.es-ckw__bar { padding: 10px 12px; gap: 8px; }
	.es-ckw__streak { font-size: 14px; }
	.es-ckw__streak strong { font-size: 17px; }
	.es-ckw__bar-sub { font-size: 11px; }
	.es-ckw__title { font-size: 14.5px; }
	.es-ckw__btn { width: 42px; height: 42px; font-size: 12px; }
	.es-ckw__row { gap: 7px; padding: 6px 2px; }
	.es-ckw__ava { width: 24px; height: 24px; font-size: 11px; }
	.es-ckw__more { font-size: 12.5px; padding: 8px 10px; }
}
/* ② 很窄的侧栏（≤260px）：渐变条改上下排、签到键变整行胶囊键。
   文字拿到整行宽度，再也不会被挤成「已连续 / 签到 / 4 天」那种竖条。
   阈值定 260 而不是 240：**游客文案**「登录后每日签到领积分」比会员文案长一截（约 140px），
   横排时文字区（W-102）要到 240 以上才放得下 —— 留出余量免得游客看到折行。 */
@container es-checkin (max-width: 260px) {
	.es-ckw__bar { flex-direction: column; flex-wrap: nowrap; align-items: stretch; gap: 9px; padding: 11px 12px; }
	/* ⚠️ 改纵向后 flex-basis 作用在**高度**上：不重置会让文字区凭空高 150px */
	.es-ckw__bar-main { flex: 0 0 auto; }
	.es-ckw__streak { font-size: 14.5px; }
	/* 换行/拉伸后不再需要 auto 外边距（它会吃掉拉伸宽度、把胶囊键缩回文字宽） */
	.es-ckw__btn { margin-left: 0; width: 100%; height: 34px; border-radius: 999px; font-size: 12.5px; }
	.es-ckw__bar-sub { font-size: 11px; }
}
.es-ckw__list { margin-top: 10px; }
.es-ckw__row { display: flex; align-items: center; gap: 8px; padding: 7px 4px; border-radius: 8px; }
.es-ckw__row + .es-ckw__row { border-top: 1px dashed var(--es-line); }
.es-ckw__row.is-me { background: var(--es-primary-soft); }
.es-ckw__no {
	width: 20px; height: 20px; flex: 0 0 auto; border-radius: 50%; display: grid; place-items: center;
	font-size: 11px; font-weight: 800; color: #fff; background: #cbd5e1;
}
.es-ckw__row.is-1 .es-ckw__no { background: #f59e0b; }
.es-ckw__row.is-2 .es-ckw__no { background: #94a3b8; }
.es-ckw__row.is-3 .es-ckw__no { background: #c2833f; }
.es-ckw__ava { width: 26px; height: 26px; flex: 0 0 auto; border-radius: 50%; display: grid; place-items: center; color: #fff; font-size: 12px; font-weight: 700; }
.es-ckw__name { flex: 1; min-width: 0; font-size: 12.5px; color: var(--es-ink-2); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.es-ckw__days { flex: 0 0 auto; font-size: 12px; font-weight: 800; color: #f59e0b; }
.es-ckw__days strong { font-size: 13.5px; }
.es-ckw__empty { padding: 10px 2px; font-size: 12.5px; color: var(--es-ink-3); text-align: center; }
.es-ckw__mine { margin-top: 8px; font-size: 12px; color: var(--es-ink-3); text-align: center; }
.es-ckw__mine strong { color: var(--es-ink); }
.es-ckw__more {
	width: 100%; margin-top: 10px; padding: 9px 12px; border: 0; border-radius: 10px; cursor: pointer;
	background: linear-gradient(135deg, #7c3aed, #6d28d9); color: #fff; font-size: 13px; font-weight: 700;
	transition: .18s ease;
}
.es-ckw__more:hover { filter: brightness(1.08); }
/* portal 后弹窗已不在 .es-ckw 内，故用元素级选择器保持层级与内边距（避免被主栏卡片压住）。 */
.es-checkin-modal { z-index: 100001; padding: 18px; }

.es-ckw-modal { position: fixed; inset: 0; z-index: 100001; display: flex; align-items: center; justify-content: center; padding: 18px; }
.es-ckw-modal[hidden] { display: none; }
.es-ckw-modal__mask { position: absolute; inset: 0; background: rgba(15, 23, 42, .55); animation: esFade .18s ease-out; }
.es-ckw-modal__box {
	position: relative; width: 340px; max-width: 100%; max-height: calc(100vh - 40px); overflow: auto;
	background: #fff; border-radius: 16px; padding: 18px 16px 16px;
	box-shadow: 0 24px 60px -12px rgba(15, 23, 42, .45); animation: esPop .2s ease-out;
}
.es-ckw-modal__close { position: absolute; top: 6px; right: 8px; border: 0; background: transparent; cursor: pointer; font-size: 22px; line-height: 1; color: var(--es-ink-3); padding: 2px 7px; }
.es-ckw-modal__close:hover { color: var(--es-ink); }
.es-ckw-modal__title { font-size: 16px; font-weight: 800; color: #ec4899; text-align: center; }
.es-ckw-modal__sub { margin-top: 4px; font-size: 11.5px; color: var(--es-ink-3); text-align: center; }
.es-ckw-modal__body { margin-top: 10px; }
.es-ckw-modal__me { margin-top: 12px; padding-top: 10px; border-top: 1px dashed var(--es-line); font-size: 12.5px; color: var(--es-ink-2); text-align: center; }
.es-ckw-modal__me strong { color: var(--es-primary); }

/* ---------- 签到成功奖励弹层 ----------
   「点完立即签到只看到右上角一条 toast」→ 改成居中大号弹层：
   领到的积分数最大，连续天数与最新余额并列在下，点「开心收下」再刷新。
   层级要压过主题顶栏(600)/悬浮按钮(100000)/全局通告(99999)/购买确认弹窗(100002)。
   ⚠️ 不能被带 transform/filter/contain 的祖先包住，否则 fixed 的包含块变了就不居中了。 */
.es-ckreward { position: fixed; inset: 0; z-index: 100003; display: flex; align-items: center; justify-content: center; padding: 20px; }
.es-ckreward[hidden] { display: none; }
.es-ckreward__mask { position: absolute; inset: 0; background: rgba(15, 23, 42, .6); backdrop-filter: blur(2px); animation: esFade .18s ease-out; }
.es-ckreward__box {
	position: relative; width: 322px; max-width: 100%; padding: 26px 22px 20px; text-align: center;
	background: linear-gradient(180deg, #fff, #fff8f1); border-radius: 20px;
	box-shadow: 0 30px 70px -20px rgba(15, 23, 42, .55); animation: esPop .22s ease-out;
}
.es-ckreward__close { position: absolute; top: 8px; right: 10px; border: 0; background: transparent; cursor: pointer; font-size: 22px; line-height: 1; color: var(--es-ink-3); padding: 2px 7px; }
.es-ckreward__close:hover { color: var(--es-ink); }
.es-ckreward__icon {
	width: 60px; height: 60px; margin: 0 auto 12px; border-radius: 50%; display: grid; place-items: center;
	background: linear-gradient(135deg, #fbbf24, #f97316); color: #fff;
	box-shadow: 0 12px 26px -12px rgba(249, 115, 22, .9);
}
.es-ckreward__amount { margin-top: 10px; display: flex; align-items: baseline; justify-content: center; gap: 3px; color: #f97316; }
.es-ckreward__amount strong { font-size: 42px; line-height: 1; font-weight: 900; }
.es-ckreward__plus { font-size: 24px; font-weight: 800; }
.es-ckreward__unit { font-size: 15px; font-weight: 700; color: #ea580c; }
.es-ckreward__title { font-size: 17px; font-weight: 800; color: var(--es-ink); }
.es-ckreward__facts { margin-top: 16px; display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.es-ckreward__fact { background: #fff; border: 1px solid #fde3c8; border-radius: 12px; padding: 9px 8px; }
.es-ckreward__fact-k { display: block; font-size: 11.5px; color: var(--es-ink-3); }
.es-ckreward__fact-v { display: block; margin-top: 3px; font-size: 12.5px; color: var(--es-ink-2); }
.es-ckreward__fact-v strong { font-size: 17px; font-weight: 800; color: var(--es-ink); margin-right: 1px; }
.es-ckreward__ok { margin-top: 16px; }
.es-ckreward__tip { margin-top: 10px; font-size: 11.5px; line-height: 1.6; color: var(--es-ink-3); }
body.is-es-ckreward-open { overflow: hidden; }

/* ---------- 钱包面板 ---------- */
.es-wallet-panel__head { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding-bottom: 18px; border-bottom: 1px solid var(--es-line); }
.es-wallet-panel__head > div { display: flex; align-items: baseline; gap: 8px; flex-wrap: wrap; }
.es-wallet-panel__label { margin: 0; font-size: 13px; color: var(--es-ink-3); width: 100%; }
.es-wallet-panel__value { margin: 0; font-size: 32px; font-weight: 800; color: var(--es-primary); line-height: 1; }
.es-wallet-panel__unit { font-size: 13px; color: var(--es-ink-3); }
.es-timeline { list-style: none; margin: 18px 0 0; padding: 0; display: grid; gap: 2px; }
.es-timeline li { display: grid; grid-template-columns: 10px 1fr auto auto; align-items: center; gap: 12px; padding: 10px 0; border-bottom: 1px dashed var(--es-line); font-size: 13.5px; }
.es-timeline li:last-child { border-bottom: 0; }
.es-timeline__dot { width: 8px; height: 8px; border-radius: 50%; }
.es-timeline__dot.is-plus { background: var(--es-success); }
.es-timeline__dot.is-minus { background: var(--es-danger); }
.es-timeline__text { color: var(--es-ink-2); }
.es-timeline time { color: var(--es-ink-3); font-size: 12px; }

/* ---------- 登录墙 ---------- */
.es-login-wall {
	max-width: 420px; margin: 60px auto; text-align: center; background: #fff;
	border: 1px solid var(--es-line); border-radius: var(--es-radius); padding: 44px 32px; box-shadow: var(--es-shadow);
}
.es-login-wall__icon { width: 66px; height: 66px; margin: 0 auto 18px; border-radius: 20px; display: grid; place-items: center; background: var(--es-primary-soft); color: var(--es-primary); }
.es-login-wall h3 { margin: 0 0 8px; font-size: 19px; }
.es-login-wall p { margin: 0 0 22px; font-size: 14px; color: var(--es-ink-2); line-height: 1.7; }
.es-login-wall .es-hint { margin: 16px 0 0; }

/* ---------- 分页 ---------- */
.es-pagination { display: flex; justify-content: center; gap: 6px; margin: 34px 0 0; flex-wrap: wrap; }
.es-pagination a, .es-pagination span {
	min-width: 38px; height: 38px; padding: 0 12px; display: inline-flex; align-items: center; justify-content: center;
	border: 1px solid var(--es-line); border-radius: var(--es-radius-sm); font-size: 13.5px;
	color: var(--es-ink-2); text-decoration: none; background: #fff;
}
.es-pagination a:hover { border-color: var(--es-primary); color: var(--es-primary); }
.es-pagination .current { background: var(--es-primary); border-color: var(--es-primary); color: #fff; font-weight: 600; }

/* ---------- 加载态 ---------- */
.es-btn.is-loading { position: relative; color: transparent !important; pointer-events: none; }
.es-btn.is-loading::after {
	content: ""; position: absolute; inset: 0; margin: auto; width: 16px; height: 16px;
	border: 2px solid rgba(255, 255, 255, .4); border-top-color: #fff; border-radius: 50%;
	animation: es-spin .7s linear infinite;
}
.es-btn--outline.is-loading::after, .es-btn--ghost.is-loading::after { border-color: rgba(67, 56, 202, .3); border-top-color: var(--es-primary); }
@keyframes es-spin { to { transform: rotate(360deg); } }

/* ---------- 浮动提示 ---------- */
.es-toast-wrap { position: fixed; top: 22px; right: 22px; z-index: 99999; display: grid; gap: 10px; }
.es-toast {
	background: #fff; border: 1px solid var(--es-line); border-left: 3px solid var(--es-primary);
	border-radius: var(--es-radius-sm); padding: 13px 18px; font-size: 13.5px; color: var(--es-ink);
	box-shadow: var(--es-shadow-lg); max-width: 340px; animation: es-slide-in .28s ease;
}
.es-toast--success { border-left-color: var(--es-success); }
.es-toast--error { border-left-color: var(--es-danger); }
@keyframes es-slide-in { from { opacity: 0; transform: translateX(24px); } }

/* =========================================================================
   网盘下载源列表
   ========================================================================= */
.es-panlist { margin: 0 0 26px; }
.es-panlist__head { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; margin-bottom: 14px; }
.es-panlist__title { display: flex; align-items: center; gap: 8px; margin: 0; font-size: 17px; font-weight: 700; color: var(--es-ink); }
.es-panlist__title .es-icon { color: var(--es-primary); }
.es-panlist__count {
	font-size: 12px; font-weight: 500; color: var(--es-primary); background: var(--es-primary-soft);
	padding: 3px 9px; border-radius: 999px;
}
.es-panlist__tip { display: flex; align-items: center; gap: 5px; margin: 0; font-size: 12.5px; color: var(--es-ink-3); }

.es-panlist__grid { display: grid; gap: 10px; margin: 0; padding: 0; list-style: none; }
.es-panlist__grid .es-pan-item--note { grid-column: 1 / -1; }

.es-pan-item {
	display: flex; align-items: center; gap: 12px;
	background: var(--es-surface); border: 1px solid var(--es-line); border-radius: var(--es-radius-sm);
	padding: 12px 14px; transition: border-color .18s, box-shadow .18s;
}
.es-pan-item:hover { border-color: #c7d2fe; box-shadow: var(--es-shadow); }
.es-pan-item.is-locked { background: #fcfcfd; }
.es-pan-item.is-locked .es-pan-item__main strong { color: var(--es-ink-2); }
.es-pan-item--note { background: #fffbeb; border-color: #fde68a; padding: 9px 14px; }
.es-pan-item--note .es-pan-item__main { display: flex; gap: 6px; align-items: center; flex-wrap: wrap; }
.es-pan-item--note em { font-style: normal; font-size: 12.5px; color: #92400e; }

.es-pan-item__badge {
	flex: 0 0 auto; width: 34px; height: 34px; border-radius: 9px; color: #fff;
	display: inline-flex; align-items: center; justify-content: center;
}
.es-pan-item__main { flex: 1 1 auto; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.es-pan-item__main strong { font-size: 14.5px; font-weight: 600; color: var(--es-ink); }
.es-pan-item__main em { font-style: normal; font-size: 12px; color: var(--es-ink-3); }

.es-pan-item__acts { flex: 0 0 auto; display: flex; align-items: center; gap: 10px; flex-wrap: wrap; justify-content: flex-end; }

/* 前往提示语：宽屏按钮在右、窄屏换行到下方，按断点切换文案（避免文案与布局不符）。 */
.es-pan-hint--narrow { display: none; }
.es-pan-item__btn {
	display: inline-flex; align-items: center; gap: 5px;
	background: var(--es-primary); color: #fff; text-decoration: none;
	padding: 7px 15px; border-radius: var(--es-radius-sm); font-size: 13px; font-weight: 600;
	transition: background .18s, transform .18s;
}
.es-pan-item__btn:hover { background: var(--es-primary-dark); color: #fff; transform: translateY(-1px); }
.es-pan-item__lock {
	flex: 0 0 auto; display: inline-flex; align-items: center; gap: 4px;
	font-size: 12px; color: var(--es-ink-3); background: var(--es-bg);
	border: 1px dashed var(--es-line); padding: 5px 11px; border-radius: 999px;
}

/* 提取码 / 解压码 */
.es-pan-code {
	display: inline-flex; align-items: center; gap: 5px;
	background: var(--es-bg); border: 1px solid var(--es-line); border-radius: 999px;
	padding: 4px 6px 4px 11px; font-size: 12.5px; color: var(--es-ink-2);
}
.es-pan-code b { color: var(--es-ink); font-weight: 700; letter-spacing: .5px; }
.es-pan-code .es-icon { color: var(--es-accent); }
.es-pan-code__btn {
	border: 0; background: var(--es-primary-soft); color: var(--es-primary);
	font-size: 11.5px; font-weight: 600; padding: 3px 9px; border-radius: 999px; cursor: pointer;
	transition: background .18s;
}
.es-pan-code__btn:hover { background: #dbe3ff; }

.es-panlist__foot { display: flex; align-items: center; gap: 6px; margin: 12px 0 0; font-size: 12px; color: var(--es-ink-3); }
.es-panlist__foot .es-icon { color: var(--es-success); }

/* 书卡上的网盘来源徽标 */
.es-card__pans { display: flex; align-items: center; gap: 4px; flex-wrap: wrap; margin-top: 0; }
.es-pan-tag {
	font-size: 10.5px; line-height: 1; color: #fff; padding: 3px 6px; border-radius: 4px; font-weight: 500;
}
/* 卡片内的来源徽标改成「淡底 + 同色文字 + 同色描边」：
   旧版是实心饱和底，而 ES_Pan 里这些网盘的色值都是相近的蓝
   （#2e6be6 / #5b6ef5 / #1f6feb / #2f7bff…），并排糊成一片分不清。
   作用域只限 .es-card__pans —— 详情页 hero 是深色底，那边继续用实心底；
   颜色由 PHP 以 `--es-pan-color` 自定义属性传入。 */
.es-card__pans .es-pan-tag {
	font-size: 10.5px; font-weight: 600; line-height: 1.7; padding: 0 6px; border-radius: 4px;
	color: var(--es-pan-color, #475569);
	background: #f1f5f9;
	background: color-mix(in srgb, var(--es-pan-color, #64748b) 10%, #fff);
	border: 1px solid color-mix(in srgb, var(--es-pan-color, #64748b) 25%, #fff);
}

@media (max-width: 640px) {
	.es-pan-item { flex-wrap: wrap; }
	.es-pan-item__acts { width: 100%; justify-content: flex-start; }
	/* 此处按钮已换行到正文下方，提示语换成「下方」。 */
	.es-pan-hint--wide { display: none; }
	.es-pan-hint--narrow { display: inline; }
}

/* ------------------------------------------------------------------
 * 网盘下载弹窗（个人书库「下载」· 该书没有站内直链时）
 *
 * ⚠️ 主题 CSS 排在插件 CSS 之后：`.entry-content a`(0,1,1) 会给这里的
 * 「直接打开」加下划线，`.entry-content p/ul/li` 会带进多余留白。
 * 所以结构上不用 p/ul/li，链接文字用 (0,2,0) 的选择器把下划线压回去。
 * ------------------------------------------------------------------ */
.es-pan-modal { position: fixed; inset: 0; z-index: 9999; display: flex; align-items: center; justify-content: center; padding: 20px; }
.es-pan-modal[hidden] { display: none; }
.es-pan-modal__mask { position: absolute; inset: 0; background: rgba(15, 23, 42, .55); animation: esFade .18s ease-out; }
.es-pan-modal__box {
	position: relative; width: 470px; max-width: 100%; max-height: calc(100vh - 40px);
	display: flex; flex-direction: column; background: #fff; border-radius: 14px; overflow: hidden;
	box-shadow: 0 24px 60px -12px rgba(15, 23, 42, .45); animation: esPop .2s ease-out;
}
.es-pan-modal__close {
	position: absolute; top: 8px; right: 10px; z-index: 2; border: 0; background: transparent;
	font-size: 22px; line-height: 1; color: var(--es-ink-3); cursor: pointer; padding: 2px 7px;
}
.es-pan-modal__close:hover { color: var(--es-ink-2); }

.es-pan-modal__head { display: flex; align-items: center; gap: 11px; padding: 18px 46px 14px 20px; border-bottom: 1px solid var(--es-line); }
.es-pan-modal__icon { flex: 0 0 auto; width: 36px; height: 36px; border-radius: 10px; display: grid; place-items: center; background: var(--es-primary-soft); color: var(--es-primary); }
.es-pan-modal__titwrap { flex: 1 1 auto; min-width: 0; }
.es-pan-modal__title { font-size: 16px; font-weight: 700; color: var(--es-ink); line-height: 1.3; }
.es-pan-modal__book { margin-top: 3px; font-size: 12.5px; color: var(--es-ink-3); line-height: 1.5; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.es-pan-modal__book:empty { display: none; }

.es-pan-modal__body { padding: 14px 20px; overflow-y: auto; display: grid; gap: 10px; align-content: start; }
.es-pan-modal__row {
	display: flex; align-items: center; gap: 11px; padding: 11px 13px;
	border: 1px solid var(--es-line); border-radius: var(--es-radius-sm); background: #fff;
	transition: border-color .18s, box-shadow .18s;
}
.es-pan-modal__row:hover { border-color: #c7d2fe; box-shadow: var(--es-shadow); }
.es-pan-modal__badge {
	flex: 0 0 auto; min-width: 40px; height: 30px; padding: 0 8px; border-radius: 8px;
	color: #fff; font-size: 11.5px; font-weight: 700;
	display: inline-flex; align-items: center; justify-content: center;
}
.es-pan-modal__main { flex: 1 1 auto; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.es-pan-modal__name { font-size: 14px; font-weight: 600; color: var(--es-ink); overflow-wrap: anywhere; }
/* 网盘地址：等宽小字、正体，长链接允许任意断行，别把行撑破。 */
.es-pan-modal__url {
	font-size: 11.5px; color: var(--es-ink-2); line-height: 1.45;
	font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
	overflow-wrap: anywhere; word-break: break-all;
}
.es-pan-modal__meta { font-size: 12px; color: var(--es-ink-3); overflow-wrap: anywhere; }
.es-pan-modal__acts { flex: 0 0 auto; display: flex; align-items: center; gap: 7px; }
.es-pan-modal__btn {
	display: inline-flex; align-items: center; gap: 4px; border: 0; cursor: pointer; white-space: nowrap;
	background: var(--es-bg); color: var(--es-ink-2); font-size: 12.5px; font-weight: 600;
	padding: 7px 13px; border-radius: var(--es-radius-sm); transition: background .18s, color .18s;
}
.es-pan-modal__btn:hover { background: #e8ecf3; color: var(--es-ink); }
.es-pan-modal__btn--go { background: var(--es-primary); color: #fff; }
.es-pan-modal__btn--go:hover { background: var(--es-primary-dark); color: #fff; }
/* ------------------------------------------------------------------
   ⚠️ 主题 main.css:404 有 `.entry-content a { text-decoration: underline }`（0,1,1），
      而主题 CSS 排在插件 CSS **之后** —— 插件里所有 (0,1,0)/(0,1,1) 的
      `text-decoration: none` 都会被它盖掉，表现为这些功能性 UI 链接长出下划线：
        · 书库页分类筛选条 `.es-chip` / 卡片按钮 `.es-btn`
        · 会员中心侧栏导航、个人书库书名、订单表格里的书名、空状态里的「去书库逛逛 →」
      故统一提权到 ≥ (0,2,0) 清掉。**只清插件自己的 UI 组件**，
      不动正文里的链接（用户自由输入的内容保持主题风格）。
      主题没有 `:hover` 变体，故只写常态即可（hover 同样保持 none）。
      弹窗挂在 body 下（不在 .entry-content 内），单独列出更稳。 */
.entry-content .es-filters a,
.entry-content .es-chip,
.entry-content .es-btn,
.entry-content .es-member a,
.entry-content .es-member-nav a,
.entry-content .es-lib-item__title,
.entry-content .es-table a,
.entry-content .es-empty a,
.entry-content .es-card a,
.entry-content .es-pagination a,
.entry-content .es-tabs a,
.es-pan-modal .es-pan-modal__btn,
.es-pan-modal .es-pan-modal__btn:hover,
.entry-content .es-pan-modal__btn { text-decoration: none; }

.es-pan-modal__foot {
	display: flex; align-items: flex-start; gap: 6px; padding: 11px 20px 15px;
	border-top: 1px solid var(--es-line); font-size: 12px; color: var(--es-ink-3); line-height: 1.6;
}
.es-pan-modal__foot[hidden] { display: none; }
.es-pan-modal__foot .es-icon { color: var(--es-success); margin-top: 2px; }
.es-pan-modal__loading { padding: 26px 0; text-align: center; font-size: 13px; color: var(--es-ink-3); }
.es-pan-modal__empty { padding: 22px 0; text-align: center; font-size: 13px; color: var(--es-ink-2); }

@media (max-width: 560px) {
	.es-pan-modal { padding: 12px; }
	.es-pan-modal__box { width: auto; max-height: calc(100vh - 24px); }
	.es-pan-modal__row { flex-wrap: wrap; }
	.es-pan-modal__acts { width: 100%; justify-content: flex-end; }
	.es-pan-modal__btn { flex: 1 1 auto; justify-content: center; }
}

/* ------------------------------------------------------------------
 * 会员钱支付弹窗（微信 / 支付宝）
 * ------------------------------------------------------------------ */
.es-pay-modal { position: fixed; inset: 0; z-index: 9999; display: flex; align-items: center; justify-content: center; }
.es-pay-modal[hidden] { display: none; }
.es-pay-modal__mask { position: absolute; inset: 0; background: rgba(15, 23, 42, .55); }
.es-pay-modal__box {
	position: relative; width: 360px; max-width: calc(100vw - 32px); background: #fff; border-radius: 14px;
	padding: 22px 22px 24px; box-shadow: 0 18px 50px rgba(15, 23, 42, .28); text-align: center;
}
.es-pay-modal__close {
	position: absolute; top: 10px; right: 12px; border: 0; background: transparent; font-size: 22px; line-height: 1;
	color: #94a3b8; cursor: pointer; padding: 2px 6px;
}
.es-pay-modal__close:hover { color: #475569; }
.es-pay-modal__title { font-size: 17px; margin: 2px 0 6px; color: #0f172a; }
.es-pay-modal__amount { font-size: 14px; color: #475569; margin: 0 0 16px; }
.es-pay-modal__amount strong { font-size: 20px; color: #e11d48; }
.es-pay-modal__promo { margin: 0 0 14px; font-size: 13px; color: var(--es-brand, #e11d48); }
.es-pay-modal__promo s { color: var(--es-ink-3); margin-right: 6px; }
.es-pay-modal__methods { display: flex; flex-direction: column; gap: 10px; }
.es-pay-method {
	border: 1px solid #e2e8f0; background: #fff; border-radius: 10px; padding: 13px 14px; font-size: 15px;
	font-weight: 600; color: #0f172a; cursor: pointer; transition: border-color .18s, background .18s;
}
.es-pay-method:hover { border-color: #94a3b8; }
.es-pay-method.is-wechat { border-color: #07c160; color: #07c160; }
.es-pay-method.is-wechat:hover { background: rgba(7, 193, 96, .08); }
.es-pay-method.is-alipay { border-color: #1677ff; color: #1677ff; }
.es-pay-method.is-alipay:hover { background: rgba(22, 119, 255, .08); }
.es-pay-method.is-paypal { border-color: #003087; color: #003087; }
.es-pay-method.is-paypal:hover { background: rgba(0, 48, 135, .08); }
/* 默认推荐（语言优先级首位）：加深边框 + 轻微底色，提示用户此为推荐项。 */
.es-pay-method.is-active { box-shadow: 0 0 0 2px rgba(15, 23, 42, .12) inset; background: #f8fafc; }
.es-pay-method.is-wechat.is-active { background: rgba(7, 193, 96, .12); }
.es-pay-method.is-alipay.is-active { background: rgba(22, 119, 255, .12); }
.es-pay-method.is-paypal.is-active { background: rgba(0, 48, 135, .12); }
.es-pay-modal__mock { margin-top: 14px; }
.es-pay-modal__mock-tip { font-size: 12.5px; color: #64748b; background: #f8fafc; border: 1px dashed #cbd5e1; border-radius: 8px; padding: 10px 12px; margin: 0 0 12px; text-align: left; }
.es-pay-modal__loading { font-size: 13px; color: #64748b; padding: 8px 0; }
.es-pay-modal__err { font-size: 13px; color: #dc2626; margin: 10px 0 0; }
.es-pay-modal__real .description { margin: 6px 0 0; font-size: 13px; color: #64748b; }

/* ---------- 币套餐（在线充值 · 紧凑） ---------- */
.es-pkgs { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; }
@media (max-width: 1024px) { .es-pkgs { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 560px)  { .es-pkgs { grid-template-columns: 1fr; } }
.es-pkg {
	position: relative; background: #fff; border: 1px solid var(--es-line); border-radius: var(--es-radius);
	padding: 11px 12px; display: flex; flex-direction: column; transition: .2s;
}
.es-pkg:hover { transform: translateY(-3px); box-shadow: var(--es-shadow-lg); border-color: var(--es-brand, #e11d48); }
.es-pkg__tag {
	position: absolute; top: -10px; right: 12px; background: var(--es-brand, #e11d48); color: #fff;
	font-size: 10.5px; font-weight: 700; padding: 2px 10px; border-radius: 999px; white-space: nowrap;
}
.es-pkg__name { margin: 0 0 3px; font-size: 13.5px; font-weight: 700; color: var(--es-ink); }
.es-pkg__coins { margin: 0 0 3px; display: flex; align-items: baseline; gap: 4px; flex-wrap: wrap; }
.es-pkg__coins strong { font-size: 18px; font-weight: 800; color: var(--es-brand, #e11d48); line-height: 1; }
.es-pkg__unit { font-size: 12px; color: var(--es-ink-3); }
.es-pkg__bonus {
	margin-left: 4px; font-size: 11px; font-weight: 700; color: #b45309;
	background: #fffbeb; border: 1px solid #fcd34d; border-radius: 6px; padding: 1px 7px; white-space: nowrap;
}
.es-pkg__actual {
	margin: 0 0 3px; display: flex; align-items: baseline; gap: 4px; flex-wrap: wrap;
	font-size: 12px; font-weight: 600; color: var(--es-brand, #e11d48);
}
.es-pkg__actual strong { font-size: 15px; font-weight: 800; color: var(--es-brand, #e11d48); line-height: 1; }
.es-pkg__desc { margin: 0 0 3px; font-size: 11px; color: var(--es-ink-3); line-height: 1.45; }
.es-pkg__price { margin: 0 0 3px; display: flex; align-items: baseline; gap: 6px; flex-wrap: wrap; }
.es-pkg__pay { font-size: 15px; font-weight: 800; color: var(--es-ink); line-height: 1; }
.es-pkg__origin { font-size: 12px; font-weight: 600; color: var(--es-ink-3); text-decoration: line-through; }
.es-pkg__promo {
	display: inline-block; padding: 2px 8px; border-radius: 999px; font-size: 11px; font-weight: 700;
	color: #fff; background: var(--es-brand, #e11d48); white-space: nowrap;
}
.es-pkg > .es-btn { margin-top: auto; padding: 8px 14px; font-size: 13.5px; }
.es-panel__tip { margin: -4px 0 14px; font-size: 12.5px; color: #15803d; background: #f0fdf4; border-left: 3px solid #16a34a; border-radius: 6px; padding: 8px 12px; }

/* ---------- 矮屏紧凑模式：保证充值中心在 768/864 等小屏也能一屏显示 ---------- */
@media (max-height: 880px) {
	.es-profile { padding: 8px 12px; }
	.es-profile .es-panel__title { margin-bottom: 4px; }
	.es-profile__top { gap: 10px; margin: 0 0 3px; padding: 0 0 3px; }
	.es-profile__top .es-avatar { width: 26px; height: 26px; border-radius: 8px; font-size: 11px; }
	.es-profile__name { font-size: 12.5px; }
	.es-info__row { padding: 1px 0; }
	.es-panel { padding: 9px 13px; margin-bottom: 10px; }
	.es-panel__title { margin-bottom: 2px; font-size: 16px; }
	.es-panel__desc { margin-bottom: 1px; font-size: 12px; line-height: 1.4; }
	.es-pkgs { gap: 9px; }
	.es-pkg { padding: 7px 9px; }
	.es-pkg__name { font-size: 13px; margin-bottom: 2px; }
	.es-pkg__coins { margin-bottom: 2px; }
	.es-pkg__coins strong { font-size: 17px; }
	.es-pkg__actual { margin-bottom: 2px; }
	.es-pkg__actual strong { font-size: 14px; }
	.es-pkg__desc { display: none; }
	.es-pkg__price { margin-bottom: 2px; }
	.es-pkg__pay { font-size: 14px; }
	.es-pkg > .es-btn { padding: 6px 10px; font-size: 12.5px; }
}

/* =========================================================================
 * 书库列表显示模式（网格 / 瀑布流 / 列表 / 纯文字）
 * 由 [es_library layout="..."] 与页面管理配置控制，作用于 .es-layout-* 容器。
 * ========================================================================= */

/* 网格（默认，沿用 .es-grid--books 原生网格，这里仅作语义化占位） */
.es-grid.es-layout-grid { display: grid; }

/* 瀑布流：CSS 多列，卡片高度随内容自适应、避免断列 */
.es-grid.es-layout-masonry { display: block; column-count: 4; column-gap: 22px; }
.es-grid.es-layout-masonry > .es-card { display: inline-block; width: 100%; margin: 0 0 22px; break-inside: avoid; }
@media (max-width: 1080px) { .es-grid.es-layout-masonry { column-count: 3; } }
@media (max-width: 800px)  { .es-grid.es-layout-masonry { column-count: 2; column-gap: 16px; } .es-grid.es-layout-masonry > .es-card { margin-bottom: 16px; } }
@media (max-width: 460px)  { .es-grid.es-layout-masonry { column-count: 1; } }

/* 列表：横向行，左侧小封面 + 右侧信息 */
.es-grid.es-layout-list { display: flex; flex-direction: column; gap: 14px; grid-template-columns: none; }
.es-grid.es-layout-list > .es-card { flex-direction: row; align-items: stretch; }
.es-grid.es-layout-list > .es-card .es-card__media { flex: 0 0 120px; width: 120px; aspect-ratio: 5 / 7; border-radius: 10px; }
.es-grid.es-layout-list > .es-card .es-card__body { flex: 1 1 auto; padding: 14px 16px; }
.es-grid.es-layout-list > .es-card:hover { transform: none; }
@media (max-width: 560px) {
	.es-grid.es-layout-list > .es-card { flex-direction: column; }
	.es-grid.es-layout-list > .es-card .es-card__media { width: 100%; flex: none; aspect-ratio: 5 / 7; border-radius: 10px 10px 0 0; }
}

/* 纯文字：无封面，纯行式文字列表（标题 + 分类 + 价格） */
.es-grid.es-layout-plain { display: flex; flex-direction: column; gap: 0; grid-template-columns: none; }
.es-grid.es-layout-plain > .es-card {
	flex-direction: row; align-items: center; border-radius: 0; border-left: 0; border-right: 0;
	overflow: hidden;
}
.es-grid.es-layout-plain > .es-card + .es-card { border-top: 0; }
.es-grid.es-layout-plain > .es-card .es-card__media { display: none; }
.es-grid.es-layout-plain > .es-card .es-card__body {
	flex: 1 1 auto; flex-direction: row; align-items: center; gap: 12px; flex-wrap: wrap; padding: 13px 2px;
}
.es-grid.es-layout-plain > .es-card .es-card__title { flex: 1 1 auto; font-size: 15px; }
.es-grid.es-layout-plain > .es-card .es-card__excerpt,
.es-grid.es-layout-plain > .es-card .es-card__meta { display: none; }
.es-grid.es-layout-plain > .es-card .es-card__footer {
	margin-top: 0; padding-top: 0; border-top: 0; flex: 0 0 auto;
}
.es-grid.es-layout-plain > .es-card:hover { transform: none; background: var(--es-bg); }

/* =========================================================================
   移动端适配增强（≤640px）
   —— iOS 聚焦缩放（控件 <16px 会触发自动放大）、触控目标尺寸
   ========================================================================= */
@media (max-width: 640px) {
	/* 1) 表单控件字号 16px，避免 iOS Safari 聚焦时缩放整页 */
	.es-input,
	.es-input--code,
	.es-filters__search input[type="search"] { font-size: 16px; }

	/* 2) 小号按钮高度补足到 38px，便于触控 */
	.es-btn--sm { min-height: 38px; padding: 9px 14px; }

	/* 3) 分类徽标 / 筛选 chip 扩大可点区域
	      ⚠️ 必须带 .es-card 前缀：上面的基础规则已提权到 (0,2,0)，
	      单类 (0,1,0) 的媒体查询覆盖不了它。 */
	.es-card .es-card__cat { padding: 4px 10px; }
	.es-chip { padding: 7px 13px; }

	/* 4) 支付弹窗在矮屏可滚动，避免超出视口 */
	.es-pay-modal__box { max-height: 88vh; overflow-y: auto; }
	.es-pay-modal__close { min-width: 32px; min-height: 32px; }
}