/* ==========================================================================
   Folio 模板 · 页面层（fp- 前缀）
   --------------------------------------------------------------------------
   与结构层（folio-base.css 的 fo- 组件）分工：
     fo- = 全站复用的组件（顶栏/卡/行式榜/面包屑/页脚…）
     fp- = 单页版式（首页 / 详情 / 播放 / 列表 / 资讯 / 用户…）
   ⚠️ 页面里不要再造第二份「卡片」「按钮」；缺样式就补到 base 的组件上。
   ========================================================================== */

/* --------------------------------------------------------------------------
   0. 网格工具（列数与取数条数必须自洽，见各页注释）
   --------------------------------------------------------------------------
   ⚠️ .fo-grid 是「推荐墙/楼层」网格，取数固定 24 条：
      24 能被 2 / 3 / 4 / 6 / 8 整除 → 任何断点都不会留半行残卡。
      改列数前先把 24 拆一遍，别出现 12 张之后只剩 4 张、右下空两格。
   -------------------------------------------------------------------------- */
.fo-grid { display: grid; gap: var(--fo-gap-inline); grid-template-columns: repeat(2, minmax(0, 1fr)); }
@media (min-width: 560px)  { .fo-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (min-width: 768px)  { .fo-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
@media (min-width: 1024px) { .fo-grid { grid-template-columns: repeat(6, minmax(0, 1fr)); } }
@media (min-width: 1500px) { .fo-grid { grid-template-columns: repeat(8, minmax(0, 1fr)); } }

/* 分页列表用：一次取 48 条 —— 2/3/4/6/8 列都能整除，任何断点都不留半行残卡 */
.fo-grid--list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
@media (min-width: 480px)  { .fo-grid--list { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (min-width: 768px)  { .fo-grid--list { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
@media (min-width: 1024px) { .fo-grid--list { grid-template-columns: repeat(6, minmax(0, 1fr)); } }
@media (min-width: 1400px) { .fo-grid--list { grid-template-columns: repeat(8, minmax(0, 1fr)); } }

/* ==========================================================================
   1. 首页（fp-home）
   --------------------------------------------------------------------------
   顺序：速报条 → 编辑推荐（左大图 + 右三条带摘要）→ 分类楼层（4 列 + 长尾标签）
        → 三列榜单 → 资讯
   与现款的区别：没有全幅幻灯舞台（编辑推荐是「图 + 文」并排），
   楼层卡片下方多一条长尾标签行（内链密度），榜单在首页就铺开三列。
   ========================================================================== */

/* 1.1 速报条：细长一条，朱砂左边线 + 最近的更新内链 */
.fp-ticker {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px 12px;
    padding: 9px 12px;
    background: var(--fo-surface);
    border: 1px solid var(--fo-line);
    border-left: 3px solid var(--fo-accent);
    border-radius: var(--fo-r-sm);
    font-size: var(--fo-fs-sm);
    color: var(--fo-ink-2);
}
.fp-ticker__label {
    flex: 0 0 auto;
    font-family: var(--fo-serif);
    font-weight: 700;
    color: var(--fo-accent);
}
.fp-ticker__stat { flex: 0 0 auto; color: var(--fo-ink-3); }
.fp-ticker__stat b { color: var(--fo-ink); font-variant-numeric: tabular-nums; }
.fp-ticker__list { flex: 1 1 220px; display: flex; align-items: center; gap: 8px 12px; min-width: 0; overflow: hidden; }
.fp-ticker__list a {
    flex: 0 1 auto;
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    color: var(--fo-ink-2);
}
.fp-ticker__list a:hover { color: var(--fo-accent); }
.fp-ticker__list i { color: var(--fo-line-2); font-style: normal; flex: 0 0 auto; }
.fp-ticker__more { flex: 0 0 auto; margin-left: auto; color: var(--fo-ink-3); }
.fp-ticker__more:hover { color: var(--fo-accent); }
/* ⚠️ 移动端（<768）整条隐藏（需求方 2026-09-23 口径）：
   窄屏一条塞 6 个片名会折成 3~4 行，把首屏挤下去，观感反而更差 ——
   移动端的「最近更新」入口由页脚与「最近更新」页承担。 */
@media (max-width: 767.98px) {
    .fp-ticker { display: none; }
}

/* 1.2 编辑推荐：左 2/3 大图轮播 + 右 1/3 三条带摘要 */
.fp-lead {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: var(--fo-gap-inline);
    margin-top: var(--fo-gap-inline);
}
@media (min-width: 900px) { .fp-lead { grid-template-columns: minmax(0, 2.1fr) minmax(0, 1fr); } }

.fp-lead__stage {
    position: relative;
    border-radius: var(--fo-r-md);
    overflow: hidden;
    background: var(--fo-surface-3);
    border: 1px solid var(--fo-line);
    border-bottom: 0;
}
/* 占位撑高度：右侧「本期精选」更高时舞台被 grid 拉伸，图片 cover 铺满不露底色；
   右侧更矮时由它兜底，保持 16:8.2 的固有高度。 */
.fp-lead__stage::before {
    content: "";
    display: block;
    aspect-ratio: 16 / 9;
}
@media (min-width: 900px) { .fp-lead__stage::before { aspect-ratio: 16 / 8.2; } }
.fp-slide {
    position: absolute;
    inset: 0;
    opacity: 0;
    visibility: hidden;
    transition: opacity .5s var(--fo-ease), visibility .5s var(--fo-ease);
}
.fp-slide.is-active { opacity: 1; visibility: visible; }
.fp-slide__bg { display: block; position: relative; height: 100%; }
.fp-slide__bg img { width: 100%; height: 100%; object-fit: cover; }
.fp-slide__shade {
    position: absolute;
    inset: 0;
    background: linear-gradient(90deg, rgba(20, 17, 13, .84) 0%, rgba(20, 17, 13, .58) 46%, rgba(20, 17, 13, .16) 100%);
}
.fp-slide__cap {
    position: absolute;
    left: 0; right: 0; bottom: 0;
    padding: clamp(14px, 2vw, 24px);
    /* 底部多留 20px 给圆点（圆点与文案分行，不叠在按钮上） */
    padding-bottom: clamp(30px, 3vw, 40px);
    color: #fdfaf3;
    display: grid;
    gap: 8px;
}
.fp-slide__k {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: var(--fo-fs-xs);
    color: #f0e7d8;
    opacity: .92;
}
.fp-slide__k i { font-style: normal; opacity: .5; }
.fp-slide__cap h2 {
    font-family: var(--fo-serif);
    font-size: var(--fo-fs-xl);
    color: #fffdf8;
    margin: 0;
}
.fp-slide__cap h2 a:hover { color: #fff; border-bottom: 2px solid var(--fo-accent); }
.fp-slide__cap p {
    font-size: var(--fo-fs-sm);
    color: #ece3d4;
    max-width: 62ch;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
.fp-slide__acts { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 2px; }
.fp-slide__acts .fo-btn { height: 34px; }
/* ⚠️ 大图上不能用默认的 ghost 按钮：它是「深字浅底」——深色图上直接变隐形。
   这里在深色遮罩上反色（浅字浅边）。 */
.fp-slide__acts .fo-btn--ghost { color: #fdfaf3; border-color: rgba(253, 250, 243, .55); }
.fp-slide__acts .fo-btn--ghost:hover { background: rgba(253, 250, 243, .16); color: #fffdf8; border-color: #fffdf8; }

.fp-lead__nav {
    position: absolute;
    right: 12px; top: 12px;
    z-index: 3;
    display: flex;
    gap: 6px;
}
.fp-lead__nav button {
    display: grid;
    place-items: center;
    width: 30px; height: 30px;
    border-radius: var(--fo-r-sm);
    background: rgba(255, 253, 248, .88);
    color: #1e1b16;
}
.fp-lead__nav button:hover { background: #fffdf8; color: var(--fo-accent); }
.fp-lead__nav svg { width: 14px; height: 14px; fill: none; stroke: currentColor; stroke-width: 2.4; stroke-linecap: round; }
.fp-lead__dots {
    position: absolute;
    left: clamp(14px, 2vw, 24px); bottom: 12px;
    z-index: 3;
    display: flex;
    gap: 5px;
}
.fp-lead__dots button {
    width: 18px;
    height: 3px;
    border-radius: 2px;
    background: rgba(255, 253, 248, .5);
    transition: background var(--fo-t) var(--fo-ease), width var(--fo-t) var(--fo-ease);
}
.fp-lead__dots button.is-active { background: var(--fo-accent); width: 26px; }

.fp-lead__side {
    display: grid;
    align-content: start;
    gap: 1px;
    background: var(--fo-surface);
    border: 1px solid var(--fo-line);
    border-radius: var(--fo-r-md);
    padding: 6px;
}
.fp-lead__side-head {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 6px 8px 8px;
    border-bottom: 1px solid var(--fo-line);
    margin-bottom: 4px;
}
.fp-lead__side-head h2 { font-size: var(--fo-fs-md); }
.fp-lead__side-head span { font-size: var(--fo-fs-xs); color: var(--fo-ink-3); }
.fp-pick {
    display: grid;
    grid-template-columns: 62px minmax(0, 1fr);
    gap: 10px;
    padding: 9px 8px;
    border-radius: var(--fo-r-sm);
    min-width: 0;
    transition: background var(--fo-t) var(--fo-ease);
}
.fp-pick:hover { background: var(--fo-surface-2); }
.fp-pick__pic { width: 62px; aspect-ratio: 2 / 3; border-radius: var(--fo-r-xs); overflow: hidden; background: var(--fo-surface-3); }
.fp-pick__pic img { width: 100%; height: 100%; object-fit: cover; }
.fp-pick__copy { display: grid; gap: 4px; min-width: 0; align-content: start; }
.fp-pick__copy b { font-size: var(--fo-fs-base); font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.fp-pick__copy p {
    font-size: var(--fo-fs-xs);
    color: var(--fo-ink-3);
    line-height: 1.6;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
.fp-pick__copy i { font-style: normal; font-size: var(--fo-fs-2xs); color: var(--fo-accent); }

/* 1.3 分类楼层：4 列海报网格 + 楼层脚长尾标签行 */
.fp-floor { margin-top: var(--fo-gap-block); }
.fp-floor__head { padding-bottom: 10px; border-bottom: 1px solid var(--fo-line); margin-bottom: 14px; }
.fp-floor__line { display: flex; align-items: center; gap: 9px; flex-wrap: wrap; }
.fp-floor__line h2 { font-size: var(--fo-fs-lg); }
.fp-floor__line h2 a:hover { color: var(--fo-accent); }
.fp-floor__line em { font-style: normal; font-size: var(--fo-fs-sm); color: var(--fo-ink-3); }
.fp-floor__link { margin-left: auto; font-size: var(--fo-fs-sm); color: var(--fo-ink-3); flex: 0 0 auto; }
.fp-floor__link:hover { color: var(--fo-accent); }
.fp-floor__tags {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 6px 8px;
    margin-top: 12px;
    padding-top: 10px;
    border-top: 1px dashed var(--fo-line);
}
.fp-floor__tags > span { font-size: var(--fo-fs-xs); color: var(--fo-ink-3); flex: 0 0 auto; }
.fp-floor__tags a {
    padding: 3px 8px;
    border: 1px solid var(--fo-line);
    border-radius: var(--fo-r-xs);
    font-size: var(--fo-fs-xs);
    color: var(--fo-ink-2);
    background: var(--fo-surface);
}
.fp-floor__tags a:hover { border-color: var(--fo-accent); color: var(--fo-accent); background: var(--fo-accent-soft); }

/* 1.4 首页三列榜单 */
.fp-boards { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--fo-gap-inline); }
@media (min-width: 760px)  { .fp-boards { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 1100px) { .fp-boards { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.fp-board { background: var(--fo-surface); border: 1px solid var(--fo-line); border-radius: var(--fo-r-md); padding: 12px 12px 8px; }
.fp-board__head {
    display: flex;
    align-items: center;
    gap: 8px;
    padding-bottom: 9px;
    margin-bottom: 6px;
    border-bottom: 1px solid var(--fo-line);
}
.fp-board__head h3 { font-size: var(--fo-fs-md); }
.fp-board__head span { font-size: var(--fo-fs-xs); color: var(--fo-ink-3); }
.fp-board__head a { margin-left: auto; font-size: var(--fo-fs-xs); color: var(--fo-ink-3); }
.fp-board__head a:hover { color: var(--fo-accent); }
/* 榜单前 3 名：序号换成朱砂印章 */
.fp-board .fo-rows > li:nth-child(-n+3) .fo-num {
    display: grid;
    place-items: center;
    width: 20px; height: 20px;
    border-radius: var(--fo-r-seal);
    background: var(--fo-accent);
    color: var(--fo-accent-ink);
    font-size: var(--fo-fs-2xs);
    font-family: var(--fo-serif);
}
.fp-board .fo-rows > li:nth-child(1) .fo-num { background: var(--fo-accent); }
.fp-board .fo-rows > li:nth-child(2) .fo-num { background: #d1624c; }
.fp-board .fo-rows > li:nth-child(3) .fo-num { background: #df8b77; }

/* 1.5 首页资讯：编辑式版式（左「一条主推」+ 右「四条行式条目」）
   ⚠️ 这里刻意**不用图片网格**：楼层已经是海报网格，资讯再铺 4 张图卡就是同一版式重复两遍。
      改用「大图主推 + 纯文本行」，图文节奏与楼层错开，同时行式条目的可索引文本更多。 */
.fp-news { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--fo-gap-inline); }
@media (min-width: 900px) {
    /* ⚠️ 这里不能用 align-items:start —— 右栏只有 4 行短文本，不拉伸就只有主推的 1/3 高，
       下方空一大片。要让右栏跟着主推等高，再靠 .fp-news__list 的 grid-auto-rows:1fr 均分行高。 */
    .fp-news { grid-template-columns: minmax(0, 1.06fr) minmax(0, 1fr); gap: var(--fo-gap-block); align-items: stretch; }
}

/* 主推 */
.fp-news__feature {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    background: var(--fo-surface);
    border: 1px solid var(--fo-line);
    border-radius: var(--fo-r-md);
    overflow: hidden;
    transition: border-color var(--fo-t) var(--fo-ease), box-shadow var(--fo-t) var(--fo-ease);
}
.fp-news__feature:hover { border-color: var(--fo-accent); box-shadow: var(--fo-sh-2); }
.fp-news__feature-pic { display: block; aspect-ratio: 16 / 9; background: var(--fo-surface-3); overflow: hidden; }
.fp-news__feature-pic img { width: 100%; height: 100%; object-fit: cover; transition: transform .5s var(--fo-ease); }
.fp-news__feature:hover .fp-news__feature-pic img { transform: scale(1.03); }
.fp-news__feature-copy { display: grid; gap: 9px; padding: 14px 16px 17px; align-content: start; }
.fp-news__feature-copy strong {
    font-family: var(--fo-serif);
    font-size: var(--fo-fs-lg);
    font-weight: 700;
    line-height: 1.5;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
.fp-news__feature-copy p {
    font-size: var(--fo-fs-sm);
    color: var(--fo-ink-2);
    line-height: 1.8;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

/* 分类 + 日期 元信息行（主推与行式条目共用） */
.fp-news__meta { display: inline-flex; align-items: baseline; gap: 7px; font-size: var(--fo-fs-2xs); color: var(--fo-ink-3); }
.fp-news__meta b {
    padding: 1px 6px;
    border: 1px solid var(--fo-accent-soft-2);
    border-radius: var(--fo-r-xs);
    background: var(--fo-accent-soft);
    color: var(--fo-accent);
    font-weight: 600;
}
.fp-news__meta i { font-style: normal; opacity: .6; }

/* 行式条目：序号 + 标题 + 元信息，行间用极浅横线分隔（不用卡片，避免又变成网格）
   ⚠️ 右侧只有 4 行短文本、左侧主推是一张 16:9 大图，若行高按内容走，
      右栏下半部会空出一大片。所以宽屏下行高用 1fr 均分，把右栏撑成与主推等高。 */
.fp-news__list { display: grid; align-content: stretch; }
@media (min-width: 900px) { .fp-news__list { grid-auto-rows: minmax(0, 1fr); } }
.fp-news__list > li + li { border-top: 1px solid var(--fo-line); }
.fp-news__list a {
    display: grid;
    grid-template-columns: 26px minmax(0, 1fr);
    align-items: center;
    gap: 11px;
    height: 100%;
    padding: 14px 4px;
    transition: background var(--fo-t) var(--fo-ease);
}
.fp-news__list a:hover { background: var(--fo-surface-2); }
.fp-news__list .fo-num { font-size: var(--fo-fs-sm); }
.fp-news__list-copy { display: grid; gap: 6px; min-width: 0; }
.fp-news__list-copy strong {
    font-family: var(--fo-serif);
    font-size: var(--fo-fs-base);
    font-weight: 700;
    line-height: 1.55;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
.fp-news__list a:hover .fp-news__list-copy strong { color: var(--fo-accent); }

/* ==========================================================================
   2. 详情页（fp-detail）
   --------------------------------------------------------------------------
   顶卡 = 两栏（海报 | 信息）+ **整行资料带**。
   ⚠️ 刻意不做「海报 | 信息 | 速览」三栏等高：等高时短的那一栏底部必然留一个洞
      （vela 实测中栏空 219px）。资料带横排铺满，结构上不存在等高要求。
   ========================================================================== */
.fp-detail__top {
    display: grid;
    grid-template-columns: 118px minmax(0, 1fr);
    grid-template-rows: auto auto;
    gap: 12px 14px;
    padding: 14px;
    background: var(--fo-surface);
    border: 1px solid var(--fo-line);
    border-radius: var(--fo-r-md);
}
@media (min-width: 900px) {
    .fp-detail__top { grid-template-columns: 220px minmax(0, 1fr); gap: 16px 24px; padding: 18px 20px; }
}
.fp-detail__poster {
    position: relative;
    grid-column: 1;
    grid-row: 1;
    align-self: start;
    border-radius: var(--fo-r-sm);
    overflow: hidden;
    background: var(--fo-surface-3);
    border: 1px solid var(--fo-line);
}
.fp-detail__poster img { width: 100%; aspect-ratio: 2 / 3; object-fit: cover; }
.fp-detail__score {
    position: absolute;
    left: 8px; top: 8px;
    display: inline-flex;
    align-items: baseline;
    gap: 1px;
    padding: 2px 8px;
    border-radius: var(--fo-r-xs);
    background: var(--fo-surface);
    color: var(--fo-gold);
    font: 700 var(--fo-fs-md)/1.7 var(--fo-num);
}
.fp-detail__score i { font: 400 var(--fo-fs-2xs)/1 var(--fo-sans); font-style: normal; opacity: .85; }
/* 整行资料带：跨两列铺在卡底 */
.fp-detail__facts {
    grid-column: 1 / -1;
    grid-row: 2;
    padding-top: 12px;
    margin-top: 2px;
    border-top: 1px solid var(--fo-line);
}

.fp-detail__main { grid-column: 2; grid-row: 1; display: grid; gap: 11px; align-content: start; min-width: 0; }
.fp-detail__eyebrow {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 7px;
    font-size: var(--fo-fs-sm);
    color: var(--fo-ink-3);
}
.fp-detail__eyebrow a { color: var(--fo-accent); }
.fp-detail__eyebrow a:hover { border-bottom: 1px solid var(--fo-accent); }
.fp-detail__eyebrow i { font-style: normal; opacity: .5; }
.fp-detail__eyebrow span {
    padding: 1px 7px;
    border: 1px solid var(--fo-line);
    border-radius: var(--fo-r-xs);
    font-size: var(--fo-fs-xs);
    color: var(--fo-ink-2);
}
.fp-detail__title {
    font-family: var(--fo-serif);
    font-size: var(--fo-fs-h1);
    line-height: 1.3;
}
.fp-detail__blurb {
    font-size: var(--fo-fs-md);
    color: var(--fo-ink-2);
    line-height: 1.85;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
.fp-detail__acts { display: flex; flex-wrap: wrap; gap: 9px; }
.fp-detail__tags { display: flex; flex-wrap: wrap; gap: 6px; }
.fp-detail__widefacts { display: block; }
@media (min-width: 900px) { .fp-detail__widefacts { display: none; } }

/* 2.2 线路剧集速览（本模板独有①）：每条线路一个 <details>，展开即选集
   （2026-09-25 由表格改为展开式，选集并进线路板块） */
.fp-lines { margin-top: 6px; }
.fp-lines__item { border-bottom: 1px solid var(--fo-line); }
.fp-lines__item:last-child { border-bottom: 0; }
.fp-lines__item summary {
    display: grid;
    grid-template-columns: minmax(6em, 1fr) 4.5em minmax(9em, 1.5fr) minmax(7em, 1fr) auto;
    gap: 10px;
    align-items: center;
    padding: 11px 12px;
    cursor: pointer;
    list-style: none;
    font-size: var(--fo-fs-sm);
}
.fp-lines__item summary::-webkit-details-marker { display: none; }
.fp-lines__item summary:hover { background: var(--fo-surface-2); }
.fp-lines__item[open] summary { border-bottom: 1px dashed var(--fo-line); }
.fp-lines__name { font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.fp-lines__num { font-variant-numeric: tabular-nums; color: var(--fo-ink-2); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.fp-lines__go { display: inline-flex; align-items: center; gap: 8px; justify-self: end; white-space: nowrap; }
/* 展开动作文案：收起态显示「展开」、展开态显示「收起」（纯 CSS，随 [open] 切换） */
.fp-lines__fold, .fp-lines__unfold { font-style: normal; color: var(--fo-ink-3); font-size: var(--fo-fs-sm); }
.fp-lines__unfold { display: none; }
.fp-lines__item[open] .fp-lines__fold { display: none; }
.fp-lines__item[open] .fp-lines__unfold { display: inline; }
/* 展开箭头：收起朝下、展开朝上 */
.fp-lines__caret {
    width: 7px; height: 7px;
    border-right: 1.5px solid var(--fo-ink-3);
    border-bottom: 1.5px solid var(--fo-ink-3);
    transform: rotate(45deg);
    transition: transform .2s ease;
}
.fp-lines__item[open] .fp-lines__caret { transform: rotate(-135deg); }
/* 展开区：选集 chips + 「还有 N 集未展开」提示 */
.fp-lines__eps { padding: 12px 12px 14px; }
.fp-lines__eps .fp-episodes__more { margin-top: 10px; }
/* 窄屏：隐藏「集数」「首末集」两列，保留 线路 / 状态 / 播放 */
@media (max-width: 767px) {
    .fp-lines__item summary { grid-template-columns: minmax(0, 1fr) auto; }
    .fp-lines__num { display: none; }
    .fp-lines__eps { padding: 10px 12px 12px; }
}
/* 线路备注：只在「备注与线路名不同」时作为补充信息跟在状态后面 */
.fp-lines__note { margin-left: 6px; color: var(--fo-ink-3); font-size: var(--fo-fs-xs); font-style: normal; }

/* 2.3 标签图谱（本模板独有②）：四组维度词，带组名的 chips 矩阵 */
.fp-atlas { display: grid; gap: 10px; }
.fp-atlas__row {
    display: grid;
    grid-template-columns: 62px minmax(0, 1fr);
    gap: 10px;
    align-items: start;
}
.fp-atlas__row > dt {
    font-family: var(--fo-serif);
    font-size: var(--fo-fs-sm);
    color: var(--fo-ink-3);
    padding-top: 5px;
}
.fp-atlas__list { display: flex; flex-wrap: wrap; gap: 6px; }

/* 2.4 维度交叉推荐（本模板独有③）：同题材/同情绪/同场景/同看点 四组 */
.fp-cross { display: grid; gap: var(--fo-gap-inline); grid-template-columns: minmax(0, 1fr); }
@media (min-width: 700px)  { .fp-cross { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 1200px) { .fp-cross { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
.fp-cross__col { background: var(--fo-surface); border: 1px solid var(--fo-line); border-radius: var(--fo-r-md); padding: 12px; }
.fp-cross__col > header { display: flex; align-items: baseline; gap: 8px; padding-bottom: 8px; margin-bottom: 6px; border-bottom: 1px solid var(--fo-line); }
.fp-cross__col > header h3 { font-size: var(--fo-fs-base); }
.fp-cross__col > header span { font-size: var(--fo-fs-2xs); color: var(--fo-ink-3); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.fp-cross__col .fo-vrow { grid-template-columns: 40px minmax(0, 1fr); padding: 7px 6px; }
.fp-cross__col .fo-vrow__pic { width: 40px; }

/* 2.5 剧情简介 + 正文 */
.fp-story { display: grid; gap: 14px; }
.fp-story__lead {
    padding: 14px;
    border-left: 3px solid var(--fo-accent);
    background: var(--fo-accent-soft);
    border-radius: 0 var(--fo-r-sm) var(--fo-r-sm) 0;
    font-size: var(--fo-fs-md);
    line-height: 1.9;
    color: var(--fo-ink-2);
}

/* 2.6 选集折叠（details）：summary = 印章 + 标题 + 计数 + 收起标签 + 箭头 */
.fp-fold > summary {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 9px;
    cursor: pointer;
}
.fp-fold > summary h2 { font-size: var(--fo-fs-md); }
.fp-fold > summary em { font-style: normal; font-size: var(--fo-fs-sm); color: var(--fo-ink-3); }
.fp-fold__label { margin-left: auto; font-size: var(--fo-fs-sm); color: var(--fo-ink-3); flex: 0 0 auto; }
.fp-fold > summary:hover .fp-fold__label { color: var(--fo-accent); }
.fp-fold > summary > svg {
    width: 14px; height: 14px;
    flex: 0 0 auto;
    fill: none; stroke: currentColor; stroke-width: 2.4; stroke-linecap: round;
    transition: transform var(--fo-t) var(--fo-ease);
}
.fp-fold[open] > summary > svg { transform: rotate(180deg); }
.fp-fold__body { padding-top: 12px; }
.fp-fold__group { margin-bottom: 14px; }
.fp-fold__group:last-child { margin-bottom: 0; }
.fp-fold__group h3 { font-size: var(--fo-fs-sm); color: var(--fo-ink-3); margin-bottom: 8px; }

/* 2.7 常见问答（fp-faq） */
.fp-faq { display: grid; gap: 1px; }
.fp-faq details {
    background: var(--fo-surface);
    border: 1px solid var(--fo-line);
    border-radius: var(--fo-r-sm);
    overflow: hidden;
}
.fp-faq details + details { margin-top: 6px; }
.fp-faq summary {
    display: flex;
    align-items: center;
    gap: 9px;
    padding: 11px 13px;
    cursor: pointer;
    font-size: var(--fo-fs-base);
    font-weight: 600;
}
.fp-faq summary::-webkit-details-marker { display: none; }
.fp-faq summary:hover { color: var(--fo-accent); }
.fp-faq summary svg {
    width: 13px; height: 13px;
    margin-left: auto;
    flex: 0 0 auto;
    fill: none; stroke: currentColor; stroke-width: 2.4; stroke-linecap: round;
    transition: transform var(--fo-t) var(--fo-ease);
}
.fp-faq details[open] summary svg { transform: rotate(180deg); }
.fp-faq__a {
    padding: 0 13px 13px 40px;
    font-size: var(--fo-fs-sm);
    color: var(--fo-ink-2);
    line-height: 1.85;
}

/* ==========================================================================
   3. 播放页（fp-play）
   ========================================================================== */
.fp-play__top { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--fo-gap-inline); }
@media (min-width: 1100px) { .fp-play__top { grid-template-columns: minmax(0, 1fr) 320px; align-items: start; } }
.fp-player {
    border: 1px solid var(--fo-line);
    border-radius: var(--fo-r-md);
    overflow: hidden;
    background: #12100c;
}
.fp-player iframe, .fp-player video { display: block; width: 100%; aspect-ratio: 16 / 9; border: 0; }
.fp-nowbar {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px 12px;
    padding: 11px 13px;
    background: var(--fo-surface);
    border: 1px solid var(--fo-line);
    border-top: 0;
    border-radius: 0 0 var(--fo-r-md) var(--fo-r-md);
    margin-top: -1px;
    font-size: var(--fo-fs-sm);
}
.fp-nowbar strong { font-family: var(--fo-serif); font-size: var(--fo-fs-md); }
.fp-nowbar em { font-style: normal; color: var(--fo-accent); }
.fp-nowbar__switch { display: flex; gap: 8px; margin-left: auto; flex: 0 0 auto; }

/* 上一集 / 下一集快切：按数组位置取相邻集（集名可能是「正片」「预告」，不能 ±1 算） */
.fp-switch { display: flex; gap: 8px; }
.fp-switch__btn {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    flex: 0 0 auto;
    height: 32px;
    padding: 0 12px;
    border: 1px solid var(--fo-line-2);
    border-radius: var(--fo-r-sm);
    font-size: var(--fo-fs-sm);
    color: var(--fo-ink-2);
    max-width: 190px;
    overflow: hidden;
    white-space: nowrap;
}
.fp-switch__btn:hover { border-color: var(--fo-accent); color: var(--fo-accent); }
.fp-switch__btn span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.fp-switch__btn svg { width: 12px; height: 12px; flex: 0 0 auto; fill: none; stroke: currentColor; stroke-width: 2.4; stroke-linecap: round; }
.fp-switch__btn.is-disabled { color: var(--fo-ink-3); opacity: .55; pointer-events: none; }
.fp-lines-chips { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 12px; }
.fp-play__eps { margin-top: 14px; }

/* 第三方播放入口（没有内嵌播放源时）
   层级：海报氛围层 z0 → 遮罩 z2 → HUD z4（pointer-events:none）→ 跳转热区 z6
   ⚠️ 绝不嵌套 <a>：可见的「按钮」用 span 渲染，可访问名走热区的 aria-label。
   ⚠️ 氛围底图只用 blur(46px+) + opacity ≤ .4（中等模糊会显脏）。 */
.fp-thirdparty {
    position: relative;
    display: block;
    aspect-ratio: 16 / 9;
    overflow: hidden;
    background: #1a1712;
    color: #fdfaf3;
}
.fp-thirdparty__poster { position: absolute; inset: 0; z-index: 0; display: block; }
.fp-thirdparty__poster img {
    width: 100%; height: 100%;
    object-fit: cover;
    filter: blur(46px) saturate(.8);
    opacity: .38;
    transform: scale(1.12);
}
.fp-thirdparty__scrim {
    position: absolute;
    inset: 0;
    z-index: 2;
    display: block;
    background: linear-gradient(180deg, rgba(20, 17, 13, .55), rgba(20, 17, 13, .8));
}
.fp-thirdparty__hit { position: absolute; inset: 0; z-index: 6; display: block; }
.fp-thirdparty__hud {
    position: absolute;
    inset: 0;
    z-index: 4;
    display: grid;
    place-content: center;
    justify-items: center;
    gap: 8px;
    padding: 18px;
    text-align: center;
    pointer-events: none;
}
.fp-thirdparty__brand {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: var(--fo-fs-xs);
    color: #e9dfd0;
    letter-spacing: .04em;
}
.fp-thirdparty__name { font-family: var(--fo-serif); font-size: var(--fo-fs-xl); font-weight: 700; }
.fp-thirdparty__ep { font-size: var(--fo-fs-sm); color: #d9cfbf; }
.fp-thirdparty__cta {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    margin-top: 4px;
    padding: 9px 18px;
    border-radius: var(--fo-r-sm);
    background: var(--fo-accent);
    color: var(--fo-accent-ink);
    font-size: var(--fo-fs-base);
    font-weight: 600;
}
.fp-thirdparty__hint { font-size: var(--fo-fs-2xs); color: #bdb2a2; }
.fp-side { display: grid; gap: var(--fo-gap-inline); align-content: start; min-width: 0; }
.fp-side__card { background: var(--fo-surface); border: 1px solid var(--fo-line); border-radius: var(--fo-r-md); padding: 12px; }
.fp-side__head { display: flex; align-items: baseline; gap: 8px; padding-bottom: 8px; margin-bottom: 6px; border-bottom: 1px solid var(--fo-line); }
.fp-side__head h3 { font-size: var(--fo-fs-base); }
.fp-side__head a { margin-left: auto; font-size: var(--fo-fs-xs); color: var(--fo-ink-3); }

/* 播放列表（选集）：胶囊，宽度跟集名走，不写定宽网格 */
.fp-episodes { display: flex; flex-wrap: wrap; gap: 6px; }
.fp-episodes a {
    flex: 0 0 auto;
    max-width: 100%;
    padding: 5px 10px;
    border: 1px solid var(--fo-line-2);
    border-radius: var(--fo-r-sm);
    font-size: var(--fo-fs-sm);
    color: var(--fo-ink-2);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.fp-episodes a:hover { border-color: var(--fo-accent); color: var(--fo-accent); }
.fp-episodes a.is-active { background: var(--fo-accent); border-color: var(--fo-accent); color: var(--fo-accent-ink); font-weight: 600; }
.fp-episodes__more {
    margin-top: 12px;
    padding-top: 10px;
    border-top: 1px dashed var(--fo-line);
    font-size: var(--fo-fs-sm);
    color: var(--fo-ink-3);
}
.fp-episodes__more a { color: var(--fo-accent); }

/* ==========================================================================
   4. 列表类页面（fp-list：频道 / 筛选 / 搜索 / 最新 / 榜单）
   ========================================================================== */
.fp-list__layout { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--fo-gap-block); }
@media (min-width: 1100px) { .fp-list__layout { grid-template-columns: minmax(0, 1fr) 280px; } }
.fp-list__side { display: grid; gap: var(--fo-gap-inline); align-content: start; min-width: 0; }

/* 筛选器：一行一组，可用「更多筛选」折叠 */
.fp-filter { background: var(--fo-surface); border: 1px solid var(--fo-line); border-radius: var(--fo-r-md); padding: 12px 14px; }
.fp-filter__row {
    display: grid;
    grid-template-columns: 52px minmax(0, 1fr);
    gap: 10px;
    padding: 7px 0;
    border-bottom: 1px dashed var(--fo-line);
}
.fp-filter__row:last-child { border-bottom: 0; }
.fp-filter__row > strong { font-size: var(--fo-fs-sm); color: var(--fo-ink-3); font-weight: 600; padding-top: 3px; }
.fp-filter__items { display: flex; flex-wrap: wrap; gap: 5px; min-width: 0; }
.fp-filter__items a {
    flex: 0 0 auto;
    padding: 4px 9px;
    border-radius: var(--fo-r-xs);
    font-size: var(--fo-fs-xs);
    color: var(--fo-ink-2);
}
.fp-filter__items a:hover { background: var(--fo-accent-soft); color: var(--fo-accent); }
.fp-filter__items a.active { background: var(--fo-accent); color: var(--fo-accent-ink); font-weight: 600; }
.fp-filter__actions { display: flex; justify-content: center; padding-top: 9px; }
.fp-filter__toggle { display: inline-flex; align-items: center; gap: 6px; font-size: var(--fo-fs-sm); color: var(--fo-ink-3); }
.fp-filter__toggle:hover { color: var(--fo-accent); }
.fp-filter__toggle svg {
    width: 13px; height: 13px;
    fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round;
    transition: transform var(--fo-t) var(--fo-ease);
}
.fp-filter__toggle[aria-expanded="true"] svg { transform: rotate(180deg); }
/* 折叠：grid-template-rows 0fr ↔ 1fr（内层必须 min-height:0 + overflow:hidden） */
.fp-filter__extra { display: grid; grid-template-rows: 0fr; transition: grid-template-rows var(--fo-t) var(--fo-ease); }
.fp-filter__extra[data-open="1"] { grid-template-rows: 1fr; }
.fp-filter__extra > div { min-height: 0; overflow: hidden; }
@media (max-width: 767.98px) {
    .fp-filter__body { display: grid; grid-template-rows: 0fr; transition: grid-template-rows var(--fo-t) var(--fo-ease); }
    .fp-filter[data-open="1"] .fp-filter__body { grid-template-rows: 1fr; }
    .fp-filter__body > div { min-height: 0; overflow: hidden; }
}

/* 排序 / 视图条 */
.fp-sortbar {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px 12px;
    padding: 9px 0;
    border-bottom: 1px solid var(--fo-line);
    margin-bottom: 14px;
    font-size: var(--fo-fs-sm);
}
.fp-sortbar a { color: var(--fo-ink-2); }
.fp-sortbar a:hover { color: var(--fo-accent); }
.fp-sortbar a.is-active { color: var(--fo-accent); font-weight: 600; }
.fp-sortbar em { font-style: normal; color: var(--fo-ink-3); margin-left: auto; }

/* 行式列表（最新更新 / 搜索结果文字模式） */
.fp-linelist { display: grid; gap: 8px; }
.fp-linerow {
    display: grid;
    grid-template-columns: 96px minmax(0, 1fr);
    gap: 12px;
    padding: 10px;
    background: var(--fo-surface);
    border: 1px solid var(--fo-line);
    border-radius: var(--fo-r-md);
    transition: border-color var(--fo-t) var(--fo-ease), box-shadow var(--fo-t) var(--fo-ease);
}
.fp-linerow:hover { border-color: var(--fo-accent); box-shadow: var(--fo-sh-1); }
.fp-linerow__pic { width: 96px; aspect-ratio: 2 / 3; border-radius: var(--fo-r-xs); overflow: hidden; background: var(--fo-surface-3); }
.fp-linerow__pic img { width: 100%; height: 100%; object-fit: cover; }
.fp-linerow__copy { display: grid; gap: 5px; align-content: start; min-width: 0; }
.fp-linerow__copy b { font-family: var(--fo-serif); font-size: var(--fo-fs-md); font-weight: 700; }
.fp-linerow__copy b a:hover { color: var(--fo-accent); }
.fp-linerow__copy p {
    font-size: var(--fo-fs-sm);
    color: var(--fo-ink-3);
    line-height: 1.75;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
.fp-linerow__meta { display: flex; align-items: center; flex-wrap: wrap; gap: 6px 12px; font-size: var(--fo-fs-xs); color: var(--fo-ink-3); }
.fp-linerow__meta a { color: var(--fo-ink-2); }
.fp-linerow__meta a:hover { color: var(--fo-accent); }
.fp-linerow__meta em { font-style: normal; color: var(--fo-accent); }

/* 榜单页：三份面板 DOM 全量并存，列数定义在面板自身（不能定义在外层） */
.fp-rank__tabs { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 14px; }
.fp-rank__panel { display: none; }
.fp-rank__panel.is-active { display: block; }
.fp-rank__grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: 8px; }
@media (min-width: 700px)  { .fp-rank__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 1200px) { .fp-rank__grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } }

/* ==========================================================================
   5. 资讯（fp-art）
   ========================================================================== */
.fp-art__layout { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--fo-gap-block); }
@media (min-width: 1000px) { .fp-art__layout { grid-template-columns: minmax(0, 1fr) 300px; } }
.fp-art__side { display: grid; gap: var(--fo-gap-inline); align-content: start; min-width: 0; }
.fp-article { background: var(--fo-surface); border: 1px solid var(--fo-line); border-radius: var(--fo-r-md); padding: clamp(16px, 2vw, 28px); }
.fp-article h1 { font-family: var(--fo-serif); font-size: var(--fo-fs-h1); line-height: 1.35; margin-bottom: 10px; }
.fp-article__meta {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px 14px;
    padding-bottom: 14px;
    margin-bottom: 18px;
    border-bottom: 1px solid var(--fo-line);
    font-size: var(--fo-fs-sm);
    color: var(--fo-ink-3);
}
.fp-article__meta a { color: var(--fo-accent); }
.fp-article__body { max-width: 780px; }
.fp-art__list { display: grid; gap: 12px; }
.fp-artcard {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    background: var(--fo-surface);
    border: 1px solid var(--fo-line);
    border-radius: var(--fo-r-md);
    overflow: hidden;
    transition: border-color var(--fo-t) var(--fo-ease), box-shadow var(--fo-t) var(--fo-ease);
}
@media (min-width: 620px) { .fp-artcard { grid-template-columns: 210px minmax(0, 1fr); } }
.fp-artcard:hover { border-color: var(--fo-accent); box-shadow: var(--fo-sh-1); }
.fp-artcard__pic { display: block; aspect-ratio: 16 / 10; background: var(--fo-surface-3); overflow: hidden; }
.fp-artcard__pic img { width: 100%; height: 100%; object-fit: cover; }
.fp-artcard__copy { display: grid; gap: 7px; padding: 13px 15px; align-content: center; }
.fp-artcard__copy strong { font-family: var(--fo-serif); font-size: var(--fo-fs-md); font-weight: 700; line-height: 1.45; }
.fp-artcard__copy p {
    font-size: var(--fo-fs-sm);
    color: var(--fo-ink-3);
    line-height: 1.75;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
.fp-artcard__copy i { font-style: normal; font-size: var(--fo-fs-xs); color: var(--fo-ink-3); }
.fp-artcard__copy i b { color: var(--fo-accent); font-weight: 600; }
.fp-article__neighbor { display: grid; gap: 8px; margin-top: var(--fo-gap-inline); }
@media (min-width: 620px) { .fp-article__neighbor { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.fp-article__neighbor a, .fp-article__neighbor span {
    display: block;
    padding: 11px 13px;
    background: var(--fo-surface);
    border: 1px solid var(--fo-line);
    border-radius: var(--fo-r-sm);
    font-size: var(--fo-fs-sm);
}
.fp-article__neighbor a:hover { border-color: var(--fo-accent); color: var(--fo-accent); }
.fp-article__neighbor em { display: block; font-style: normal; font-size: var(--fo-fs-2xs); color: var(--fo-ink-3); margin-bottom: 4px; }
.fp-article__neighbor span.is-disabled { color: var(--fo-ink-3); }
/* 相关资讯：补文章列底部空白 + 同分类内链 */
.fp-relart { margin-top: 26px; padding-top: 20px; border-top: 1px solid var(--fo-line); }
.fp-relart__grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: 10px; }
@media (min-width: 620px) { .fp-relart__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.fp-relart__item {
    display: grid;
    grid-template-columns: 78px minmax(0, 1fr);
    gap: 11px;
    align-items: center;
    padding: 8px;
    background: var(--fo-surface);
    border: 1px solid var(--fo-line);
    border-radius: var(--fo-r-sm);
    min-width: 0;
    transition: border-color var(--fo-t) var(--fo-ease);
}
.fp-relart__item:hover { border-color: var(--fo-accent); }
.fp-relart__item .pic { width: 78px; aspect-ratio: 4 / 3; border-radius: var(--fo-r-xs); overflow: hidden; background: var(--fo-surface-3); }
.fp-relart__item .pic img { width: 100%; height: 100%; object-fit: cover; }
.fp-relart__item .copy { display: grid; gap: 4px; min-width: 0; }
.fp-relart__item .copy b {
    font-size: var(--fo-fs-sm);
    font-weight: 600;
    line-height: 1.5;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
.fp-relart__item .copy i { font-style: normal; font-size: var(--fo-fs-2xs); color: var(--fo-ink-3); }

/* ==========================================================================
   6. 演员 / 角色 / 分集剧情（fp-simple 简版页）
   ========================================================================== */
.fp-simple__grid { display: grid; gap: var(--fo-gap-inline); grid-template-columns: repeat(2, minmax(0, 1fr)); }
@media (min-width: 620px)  { .fp-simple__grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (min-width: 1024px) { .fp-simple__grid { grid-template-columns: repeat(5, minmax(0, 1fr)); } }
@media (min-width: 1400px) { .fp-simple__grid { grid-template-columns: repeat(6, minmax(0, 1fr)); } }
.fp-person {
    background: var(--fo-surface);
    border: 1px solid var(--fo-line);
    border-radius: var(--fo-r-md);
    overflow: hidden;
    transition: border-color var(--fo-t) var(--fo-ease), box-shadow var(--fo-t) var(--fo-ease);
}
.fp-person:hover { border-color: var(--fo-accent); box-shadow: var(--fo-sh-1); }
.fp-person__pic { display: block; aspect-ratio: 3 / 4; background: var(--fo-surface-3); overflow: hidden; }
.fp-person__pic img { width: 100%; height: 100%; object-fit: cover; }
.fp-person__body { display: block; padding: 9px 11px 12px; }
.fp-person__body strong { display: block; font-family: var(--fo-serif); font-size: var(--fo-fs-base); font-weight: 700; }
.fp-person__body span { display: block; margin-top: 4px; font-size: var(--fo-fs-xs); color: var(--fo-ink-3); }

/* ==========================================================================
   7. 表单 / 留言 / 用户中心
   ========================================================================== */
.fp-form { display: grid; gap: 12px; }
.fp-form__field { display: grid; gap: 6px; }
.fp-form__field label { font-size: var(--fo-fs-sm); color: var(--fo-ink-2); }
.fp-form__field input, .fp-form__field textarea, .fp-form__field select {
    width: 100%;
    padding: 10px 12px;
    border: 1px solid var(--fo-line-2);
    border-radius: var(--fo-r-sm);
    background: var(--fo-surface);
    font-size: var(--fo-fs-base);
    outline: none;
}
.fp-form__field textarea { min-height: 118px; resize: vertical; }
.fp-form__field input:focus, .fp-form__field textarea:focus { border-color: var(--fo-accent); }
.fp-form__tip { font-size: var(--fo-fs-sm); }
.fp-form__tip.is-ok { color: var(--fo-accent); }
.fp-form__tip.is-err { color: var(--fo-danger); }

.fp-user__layout { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--fo-gap-block); }
@media (min-width: 900px) { .fp-user__layout { grid-template-columns: 200px minmax(0, 1fr); } }
.fp-user__nav { display: grid; gap: 2px; align-content: start; }
.fp-user__nav a {
    padding: 9px 12px;
    border-radius: var(--fo-r-sm);
    font-size: var(--fo-fs-sm);
    color: var(--fo-ink-2);
}
.fp-user__nav a:hover { background: var(--fo-surface-2); color: var(--fo-accent); }
.fp-user__nav a.is-active { background: var(--fo-accent-soft); color: var(--fo-accent); font-weight: 600; }
.fp-user__box { background: var(--fo-surface); border: 1px solid var(--fo-line); border-radius: var(--fo-r-md); padding: 16px; }
.fp-table { font-size: var(--fo-fs-sm); }
.fp-table th {
    text-align: left;
    padding: 9px 10px;
    background: var(--fo-surface-2);
    border-bottom: 1px solid var(--fo-line-2);
    color: var(--fo-ink-3);
    font-weight: 600;
    white-space: nowrap;
}
.fp-table td { padding: 9px 10px; border-bottom: 1px solid var(--fo-line); }
.fp-table tr:last-child td { border-bottom: 0; }

/* 评论 / 留言条目 */
.fp-comment { display: grid; gap: 10px; }
.fp-comment__item {
    display: grid;
    grid-template-columns: 38px minmax(0, 1fr);
    gap: 11px;
    padding: 12px;
    background: var(--fo-surface);
    border: 1px solid var(--fo-line);
    border-radius: var(--fo-r-md);
}
.fp-comment__avatar {
    width: 38px; height: 38px;
    border-radius: 50%;
    background: var(--fo-surface-2);
    display: grid;
    place-items: center;
    font-family: var(--fo-serif);
    font-size: var(--fo-fs-sm);
    color: var(--fo-ink-3);
    overflow: hidden;
}
.fp-comment__copy { display: grid; gap: 6px; min-width: 0; }
.fp-comment__copy header { display: flex; align-items: baseline; gap: 10px; font-size: var(--fo-fs-xs); color: var(--fo-ink-3); }
.fp-comment__copy header b { font-size: var(--fo-fs-sm); color: var(--fo-ink-2); }
.fp-comment__copy p { font-size: var(--fo-fs-sm); color: var(--fo-ink-2); line-height: 1.8; overflow-wrap: anywhere; }

/* ==========================================================================
   7.5 分类索引（最新更新页 / 地图页共用）
   --------------------------------------------------------------------------
   一级分类 = 一张卡（名称 + 子类计数 + 进入箭头），二级分类 = 卡内 chips。
   之前这几个类名没有任何样式 → 一级和二级挤成一片纯文本，看不出层级。
   ========================================================================== */
.fp-map {
    display: grid;
    gap: var(--fo-gap-inline);
    grid-template-columns: minmax(0, 1fr);
    /* ⚠️ 默认 align-items:stretch 会让没有子类的分类卡被拉到与同行最高的卡等高，
       看起来像个「没填满的空盒子」。卡片按自身内容定高。 */
    align-items: start;
}
@media (min-width: 720px)  { .fp-map { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 1200px) { .fp-map { grid-template-columns: repeat(3, minmax(0, 1fr)); } }

.fp-map__group {
    display: grid;
    align-content: start;
    gap: 12px;
    padding: 14px 16px 16px;
    background: var(--fo-surface);
    border: 1px solid var(--fo-line);
    border-radius: var(--fo-r-md);
    transition: border-color var(--fo-t) var(--fo-ease), box-shadow var(--fo-t) var(--fo-ease);
}
.fp-map__group:hover { border-color: var(--fo-line-2); box-shadow: var(--fo-sh-1); }
/* 没有子分类的一级分类（短剧 / 纪录片 / 资讯…）：收成一行，不留下半张空卡 */
.fp-map__group--flat { gap: 0; padding: 13px 16px; }
.fp-map__group--flat .fp-map__pid { padding-bottom: 0; border-bottom: 0; }

/* 一级分类：朱砂方点（替代图标）+ 衬线名称 + 子类计数 + 右侧进入箭头 */
.fp-map__pid {
    display: flex;
    align-items: center;
    gap: 9px;
    padding-bottom: 11px;
    border-bottom: 1px solid var(--fo-line);
    font-family: var(--fo-serif);
    font-size: var(--fo-fs-md);
    font-weight: 700;
    color: var(--fo-ink);
}
.fp-map__pid::before {
    content: "";
    flex: 0 0 auto;
    width: 6px;
    height: 6px;
    border-radius: 1px;
    background: var(--fo-accent);
}
.fp-map__pid em {
    font: 400 var(--fo-fs-2xs)/1 var(--fo-sans);
    font-style: normal;
    color: var(--fo-ink-3);
    margin-left: auto;
}
.fp-map__pid::after {
    content: "→";
    flex: 0 0 auto;
    font-family: var(--fo-num);
    font-size: var(--fo-fs-sm);
    color: var(--fo-ink-3);
    transition: transform var(--fo-t) var(--fo-ease);
}
.fp-map__pid:hover { color: var(--fo-accent); }
.fp-map__pid:hover::after { color: var(--fo-accent); transform: translateX(3px); }

.fp-map__children { display: flex; flex-wrap: wrap; gap: 6px; }
.fp-map__children a {
    padding: 3px 9px;
    border: 1px solid var(--fo-line);
    border-radius: var(--fo-r-xs);
    background: var(--fo-paper);
    font-size: var(--fo-fs-xs);
    color: var(--fo-ink-2);
    transition: color var(--fo-t) var(--fo-ease), border-color var(--fo-t) var(--fo-ease), background var(--fo-t) var(--fo-ease);
}
.fp-map__children a:hover {
    border-color: var(--fo-accent);
    background: var(--fo-accent-soft);
    color: var(--fo-accent);
}

/* ==========================================================================
   7.6 认证页（fp-auth：登录 / 注册 / 找回密码 / 邮箱手机重置）
   --------------------------------------------------------------------------
   两栏：左「说明栏」= 印章 + 宋体衬线标题 + 编号要点；右「表单卡」。
   ⚠️ 表单的显隐与错误提示全部用**属性**控制（data-show / aria-pressed），
      folio.js 只改属性不写 style —— 与全站 JS/CSS 边界一致，也不会和过渡打架。
   ========================================================================== */
.fp-auth__grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--fo-gap-block); margin-top: 18px; }
@media (min-width: 900px) {
    .fp-auth__grid {
        grid-template-columns: minmax(0, 1fr) 428px;
        align-items: start;
        gap: clamp(20px, 3.2vw, 44px);
    }
}

/* ---- 左：说明栏 ---------------------------------------------------------- */
.fp-auth__aside { display: grid; align-content: start; gap: 12px; min-width: 0; }
.fp-auth__aside > .fo-seal { width: 34px; height: 34px; font-size: var(--fo-fs-md); border-radius: var(--fo-r-sm); }
.fp-auth__aside h2 { font-family: var(--fo-serif); font-size: var(--fo-fs-h1); font-weight: 700; }
.fp-auth__lead { font-size: var(--fo-fs-base); color: var(--fo-ink-2); line-height: 1.9; max-width: 44ch; }

.fp-auth__feats { display: grid; margin-top: 4px; border-top: 1px solid var(--fo-line); }
.fp-auth__feats li {
    display: grid;
    grid-template-columns: 30px minmax(0, 1fr);
    gap: 12px;
    align-items: start;
    padding: 13px 0;
    border-bottom: 1px solid var(--fo-line);
}
.fp-auth__feats i {
    justify-self: start;
    font: 600 var(--fo-fs-sm)/1.6 var(--fo-num);
    font-style: normal;
    color: var(--fo-accent);
    border-bottom: 2px solid var(--fo-accent-soft-2);
}
.fp-auth__feats b { display: block; font-family: var(--fo-serif); font-size: var(--fo-fs-md); margin-bottom: 3px; }
.fp-auth__feats em { font-style: normal; font-size: var(--fo-fs-sm); color: var(--fo-ink-3); line-height: 1.75; }

.fp-auth__note {
    display: grid;
    grid-template-columns: 18px minmax(0, 1fr);
    gap: 9px;
    align-items: start;
    margin-top: 6px;
    font-size: var(--fo-fs-sm);
    color: var(--fo-ink-3);
    line-height: 1.75;
}
.fp-auth__note svg {
    width: 18px; height: 18px;
    fill: none;
    stroke: var(--fo-accent);
    stroke-width: 1.6;
    stroke-linecap: round;
    stroke-linejoin: round;
}

/* 步骤条（邮箱 / 手机重置：① 验证 ② 设新密码） */
.fp-auth__steps { display: grid; gap: 9px; margin-top: 4px; }
.fp-auth__steps li {
    display: grid;
    grid-template-columns: 22px minmax(0, 1fr);
    gap: 10px;
    align-items: center;
    font-size: var(--fo-fs-sm);
    color: var(--fo-ink-3);
    transition: color var(--fo-t) var(--fo-ease);
}
.fp-auth__steps i {
    display: grid;
    place-items: center;
    width: 22px; height: 22px;
    border: 1px solid var(--fo-line-2);
    border-radius: var(--fo-r-seal);
    font: 600 var(--fo-fs-2xs)/1 var(--fo-num);
    font-style: normal;
    transition: background var(--fo-t) var(--fo-ease), border-color var(--fo-t) var(--fo-ease), color var(--fo-t) var(--fo-ease);
}
.fp-auth__steps li.is-active { color: var(--fo-ink); }
.fp-auth__steps li.is-active i { background: var(--fo-accent); border-color: var(--fo-accent); color: var(--fo-accent-ink); }

/* ---- 右：表单卡 ---------------------------------------------------------- */
.fp-auth__panel {
    display: grid;
    gap: 16px;
    padding: clamp(16px, 2.2vw, 26px);
    background: var(--fo-surface);
    border: 1px solid var(--fo-line);
    border-radius: var(--fo-r-md);
    box-shadow: var(--fo-sh-1);
    min-width: 0;
}
.fp-auth__panelhead {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    gap: 6px 12px;
    padding-bottom: 13px;
    border-bottom: 1px solid var(--fo-line);
}
.fp-auth__panelhead h2 { font-family: var(--fo-serif); font-size: var(--fo-fs-xl); }
.fp-auth__panelhead > span { margin-left: auto; font-size: var(--fo-fs-sm); color: var(--fo-ink-3); }
.fp-auth__panelhead a { color: var(--fo-accent); border-bottom: 1px solid var(--fo-accent-soft-2); }
.fp-auth__panelhead a:hover { border-bottom-color: var(--fo-accent); }

.fp-auth__submit { width: 100%; height: 44px; font-size: var(--fo-fs-md); }
.fp-auth__helper {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    gap: 8px 14px;
    font-size: var(--fo-fs-sm);
    color: var(--fo-ink-3);
}
.fp-auth__helper a { color: var(--fo-ink-2); border-bottom: 1px solid var(--fo-line-2); }
.fp-auth__helper a:hover { color: var(--fo-accent); border-bottom-color: var(--fo-accent); }

/* 没设过密保时的备选路径块 */
.fp-auth__alt { display: grid; gap: 8px; padding-top: 14px; border-top: 1px solid var(--fo-line); }
.fp-auth__alt h3 { font-family: var(--fo-serif); font-size: var(--fo-fs-md); }
.fp-auth__alt p { font-size: var(--fo-fs-sm); color: var(--fo-ink-3); }
.fp-auth__alt-links { display: flex; flex-wrap: wrap; gap: 8px; }

/* 认证表单的显隐：JS 只改 data-show，视觉态归 CSS */
.fp-form[data-show="0"] { display: none; }

/* 完成态（注册写入成功但账号待开通）：替代表单，不再让用户对着无用表单点 */
.fp-auth__done { display: grid; gap: 10px; justify-items: start; }
.fp-auth__done[data-show="0"] { display: none; }
.fp-auth__done > h3 { font-family: var(--fo-serif); font-size: var(--fo-fs-lg); }
.fp-auth__done > p { font-size: var(--fo-fs-sm); color: var(--fo-ink-2); line-height: 1.85; }
.fp-auth__done > p b { color: var(--fo-accent); }

/* 第二段表单（邮箱/手机重置）：发出验证码前整段收起 */
.fp-auth__step2[data-show="0"] { display: none; }
.fp-auth__step2[data-show="1"] { display: grid; animation: fo-rise .32s var(--fo-ease); }
@keyframes fo-rise {
    from { opacity: 0; transform: translateY(6px); }
    to   { opacity: 1; transform: none; }
}

/* ---- 表单内的三件套：验证码行 / 密码可见切换 / 错误提示 ------------------- */
.fp-form__code { display: grid; grid-template-columns: minmax(0, 1fr) 112px; gap: 10px; }
.fp-form__code img {
    width: 112px;
    height: 42px;
    object-fit: cover;
    border: 1px solid var(--fo-line-2);
    border-radius: var(--fo-r-sm);
    background: #fff;
    cursor: pointer;
}
.fp-form__send { height: 42px; padding: 0 12px; font-size: var(--fo-fs-sm); }
.fp-form__send[disabled] { opacity: .62; cursor: default; }

.fp-form__pw { position: relative; display: block; }
.fp-form__pw input { padding-right: 42px; }
.fp-form__eye {
    position: absolute;
    right: 6px;
    top: 50%;
    transform: translateY(-50%);
    display: grid;
    place-items: center;
    width: 30px; height: 30px;
    border-radius: var(--fo-r-xs);
    color: var(--fo-ink-3);
    transition: color var(--fo-t) var(--fo-ease), background var(--fo-t) var(--fo-ease);
}
.fp-form__eye:hover { color: var(--fo-accent); background: var(--fo-accent-soft); }
.fp-form__eye svg {
    width: 17px; height: 17px;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.6;
    stroke-linecap: round;
    stroke-linejoin: round;
}
.fp-form__eye[aria-pressed="true"] { color: var(--fo-accent); }

.fp-form__error {
    font-size: var(--fo-fs-sm);
    line-height: 1.65;
    color: var(--fo-danger);
    padding: 8px 11px;
    border: 1px solid var(--fo-danger-soft);
    border-radius: var(--fo-r-sm);
    background: var(--fo-danger-bg);
}
.fp-form__error[data-show="0"] { display: none; }

/* 成功 / 中性提示：与错误框同一位置、不同色相（朱砂系浅底），避免「成功了却飘红字」 */
.fp-form__notice {
    font-size: var(--fo-fs-sm);
    line-height: 1.65;
    color: var(--fo-accent);
    padding: 8px 11px;
    border: 1px solid var(--fo-accent-soft-2);
    border-radius: var(--fo-r-sm);
    background: var(--fo-accent-soft);
}
.fp-form__notice[data-show="0"] { display: none; }

/* 表单里的提交按钮是 <input type="submit">，归一成 .fo-btn 的外观 */
input.fo-btn {
    font-family: inherit;
    cursor: pointer;
    border: 0;
}
input.fo-btn:hover { background: var(--fo-accent-strong); }

/* ==========================================================================
   8. 错误页 / 占位页
   ========================================================================== */
.fp-error { padding: clamp(30px, 8vw, 80px) 0; text-align: center; }
/* 错误码做成「朱砂印」式牌匾，不用巨型数字：
   全站字号硬上限是 26px（--fo-fs-max），错误页也属于模板页面，不做例外。 */
.fp-error__code {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 62px;
    height: 30px;
    padding: 0 10px;
    margin-bottom: 14px;
    border: 1px solid var(--fo-accent);
    border-radius: var(--fo-r-xs);
    background: var(--fo-accent-soft);
    color: var(--fo-accent);
    font-family: var(--fo-num);
    font-size: var(--fo-fs-md);
    font-weight: 700;
    letter-spacing: .08em;
    line-height: 1;
}
.fp-error h1 { font-size: var(--fo-fs-xl); margin-bottom: 10px; }
.fp-error p { font-size: var(--fo-fs-sm); color: var(--fo-ink-3); margin-bottom: 18px; }
.fp-error__acts { display: flex; justify-content: center; flex-wrap: wrap; gap: 10px; }

/* 跳转页（public/jump）：文案与按钮在上，倒计时是弱提示，不再打印原始 URL。
   ⚠️ 原来的实现把 $url 直接当正文输出，游客点会员中心时页面上就写着 /user/login.html。 */
.fp-error-page { padding: clamp(18px, 3vw, 34px) 0 clamp(40px, 9vw, 90px); }
.fp-error-page .fo-crumb { margin-bottom: 6px; }
.fp-error__hint { max-width: 46ch; margin-left: auto; margin-right: auto; }
.fp-error__wait {
    margin-top: 16px !important;
    margin-bottom: 0 !important;
    font-size: var(--fo-fs-xs) !important;
    color: var(--fo-ink-3);
}
.fp-error__wait b { font-family: var(--fo-num); color: var(--fo-accent); font-weight: 700; }
.fp-placeholder { padding: clamp(26px, 6vw, 56px) 0; text-align: center; }
.fp-placeholder h1 { font-size: var(--fo-fs-xl); margin-bottom: 10px; }
.fp-placeholder p { font-size: var(--fo-fs-sm); color: var(--fo-ink-3); margin-bottom: 18px; }