/* ==========================================================================
   parts-card.css —— 卡片部件皮肤（唯一真源，home 与 list 共用）
   --------------------------------------------------------------------------
   【铁律】卡片皮肤只有这一份。任何页面要改卡片长什么样，改这里，不准在页面里写。
   【来源】1:1 摘自 assets/css/ds-part-card.css（用户原设计，未改一条规则）
   【依赖】必须先加载 parts-tokens.css
   ========================================================================== */

/* ==========================================================================
   0. 分类色令牌（卡片专用）
   --------------------------------------------------------------------------
   【为什么令牌在这里而不在 parts-tokens.css】
   这 8 个分类色只服务卡片的色脊 / 色点 / 色带（--c），别的部件用不到，
   放在卡片皮肤里就近维护。卡片 PHP 侧只输出 style="--c:var(--part-cat-xxx)"，
   色值本身不落在 PHP 里 —— 改色只改这一处。
   数值 1:1 沿用主题原设计 module/card.php 的 mbt_home5_cat_color() 8 色板。
   ========================================================================== */
:root{
  --part-cat-3d:#5a8cff;
  --part-cat-ui:#a06bff;
  --part-cat-font:#ff9f43;
  --part-cat-eng:#ee5253;
  --part-cat-audio:#2ec4b6;
  --part-cat-web:#6fce8f;
  --part-cat-palette:#ff9f43;
  --part-cat-motion:#a06bff;
  /* 未收录分类的兜底：保证色脊/色带/色点永远有颜色，不会出现透明 */
  --part-cat-default:#8a8a96;
}

/* ==========================================================================
   1. 卡片本体通用语言（R43 起全局唯一形态 C；原 homepage5.css .wrap .res* 迁移）
   ========================================================================== */
.res{
  position:relative;min-width:0;
  background:var(--part-card);border:1px solid var(--part-line);border-radius:var(--part-r-md,10px);overflow:hidden;
  transition:box-shadow .3s,border-color .3s,transform .3s;
}
.res:hover{box-shadow:var(--part-sh-hov);border-color:var(--part-line2)}
/* R-徽标（2026-10-02 战役 #徽标部件收口）：原 .res .bdset/.bd 三态与 .bd.coin 死规则已迁入
   assets/css/ds-part-badge.css（基础盒 + 三态 + V6 层）；.bd.coin 无消费面随迁删除（G24）。
   定位规则 .res.fx-c .cover .bdset 留在本文件（形态几何）。 */
.res .stats{display:flex;flex-wrap:wrap;gap:13px;font-size:11.5px;color:var(--part-text3);font-variant-numeric:tabular-nums}
/* 项6（2026-09-29）：.stats/.perf 子项统一 inline-flex，承载图标字体 + 数字的基线对齐（防 1px 抖动） */
.res .stats > span{display:inline-flex;align-items:center;gap:3px}
.res .stats .icon,
.res .perf .icon{font-size:12px;line-height:1;vertical-align:-.15em}
.res .stats b{font-weight:600;color:var(--part-text2)}
.res .cat-chip{display:inline-flex;align-items:center;gap:5px;font-size:11.5px;font-weight:600;color:var(--part-text2)}
.res .cat-chip::before{content:'';width:7px;height:7px;border-radius:2px;background:var(--c);flex:none}

/* ==========================================================================
   2. 形态 C：票根存根卡（虚线撕口 + 半圆咬口 + 价格竖排）
   ========================================================================== */
.res.fx-c{border-radius:var(--part-r-md,10px)}
.res.fx-c .cover{position:relative;aspect-ratio:16/10;overflow:hidden;background:var(--part-line)}
.res.fx-c .cover img{width:100%;height:100%;object-fit:cover;transition:transform .55s}
.res.fx-c:hover .cover img{transform:scale(1.06)}
.res.fx-c .cover .bdset{position:absolute;top:10px;right:10px;z-index:2}
.res.fx-c .cover .ribbon{position:absolute;left:0;bottom:0;padding:6px 12px 6px 11px;z-index:2;
  background:linear-gradient(180deg,rgba(8,8,14,.60),rgba(8,8,14,.86)),var(--c);
  color:#fff;font-size:11px;font-weight:800;letter-spacing:.6px;text-shadow:0 1px 2px rgba(0,0,0,.45);
  clip-path:polygon(0 0,100% 0,calc(100% - 9px) 100%,0 100%)}
.res.fx-c .stub{position:relative;padding:15px 16px 16px;border-top:2px dashed var(--part-line2)}
/* 撕口缺口：以页面底色实心圆覆盖卡片边缘与虚线，形成半圆咬口（半径 10，圆心压在卡片边界上） */
.res.fx-c .stub::before,
.res.fx-c .stub::after{content:'';position:absolute;top:-10px;width:20px;height:20px;border-radius:50%;background:var(--part-page-bg);z-index:2}
.res.fx-c .stub::before{left:-10px}
.res.fx-c .stub::after{right:-10px}
.res.fx-c .stub .sq{display:grid;grid-template-columns:1fr auto;gap:10px;align-items:stretch}
/* 项4：标题恒占 2 行高（min-height = 2 × line-height:1.45），短标题也保持卡高一致 */
.res.fx-c h3{font-size:14.5px;font-weight:800;line-height:1.45;min-height:2.9em;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.res.fx-c .cat-chip{margin-top:6px}
/* 项5：价态列随同行高撑满并与标题首行对齐（原 align-items:start 令其塌顶、卡高不一致） */
.res.fx-c .pricecol{text-align:right;flex:none;border-left:1px solid var(--part-line);padding-left:12px;
  display:flex;flex-direction:column;justify-content:center}
/* 项1（2026-09-30 战役#10）：拉近两级字号（21/11.5 → 20/12.5）+ 收紧行盒 + 纵向居中，
   使 42px 内容块在 67px 价态列内上下配平，消除大片空白。 */
.res.fx-c .pricecol .p{font-family:var(--part-font-num);font-size:20px;font-weight:900;color:var(--part-accent);line-height:1.05;letter-spacing:-.5px}
/* 免费态价格：原设计在标签上写 style="color:var(--free)" 内联硬编码，
   部件层禁止内联颜色，改为修饰类，颜色仍只走 --part-free-text 令牌 */
.res.fx-c .pricecol .p.p--free{color:var(--part-free-text)}
.res.fx-c .pricecol .p small{font-size:12px;font-weight:700}
.res.fx-c .pricecol .u{font-size:12.5px;font-weight:600;color:var(--part-text3);margin-top:3px;letter-spacing:.2px}
/* 4b. 底部 meta 行（.perf）—— 与形态 A/B 的 .stats 同一排版语言（11.5px / --text3 / tabular-nums）。
   修复「查看/下载次数变长后挤压换行」：原 .perf 未吃到 .stats 的字号，继承 body 15px/1.5，
   且子项 min-width:auto 可在「◎ 空档」处断行 → 卡宽 215 时 3 位数即换行、4 位数达 2~3 行。
   方案：nowrap 稳态 + 子项 flex:0 0 auto 不换行；仅时间 .pt 允许收缩并省略（兜底，永不溢出）；
   窄卡（≤1366，卡宽 ≤226）把 .go 文案收敛为「详情」，保证「◎ 1382 + ↓ 486 + 日期」仍单行。
   子项类 .pv/.pd/.pt 与 .go-l/.go-s 为 card.php 新增（附加类，不影响 .perf/.go 既有契约）。 */
.res.fx-c .perf{display:flex;align-items:center;flex-wrap:nowrap;gap:8px;margin-top:12px;padding-top:11px;border-top:1px solid var(--part-line);
  min-width:0;font-size:11.5px;line-height:1.45;color:var(--part-text3);font-variant-numeric:tabular-nums}
.res.fx-c .perf>span{display:inline-flex;align-items:center;gap:3px;flex:0 0 auto;min-width:0;white-space:nowrap}
.res.fx-c .perf>span b{font-weight:600;color:var(--part-text2)}
.res.fx-c .perf .pt{flex:0 1 auto;overflow:hidden;text-overflow:ellipsis}
.res.fx-c .perf .go{margin-left:auto;flex:0 0 auto;height:30px;padding:0 12px;border-radius:15px;border:none;background:var(--part-text);color:var(--part-card);font-size:12px;font-weight:700;display:inline-flex;align-items:center;white-space:nowrap;transition:.25s}
.res.fx-c .perf .go .go-s{display:none}
.res.fx-c:hover .perf .go{background:var(--part-accent);color:var(--part-on-accent)}
/* 项4/5（2026-09-29）：票根卡「整卡等高」——网格行内所有卡片与最高者同高，
   使标题固定 2 行高（项4）在视觉上真正收敛为统一卡高；.perf 底部吸附。
   （R43 后形态 A/B 已移除，本规则为唯一形态 C 的等高几何） */
.res.fx-c{display:flex;flex-direction:column;height:100%}
.res.fx-c .cover{flex:none}
/* R43：形态 C 封面高度跟随缩略图高度（--part-thumb-h）。
   grid 部件在内联 style 写 --part-thumb-h（thumb_h 参数透传）时，
   封面改固定高度，aspect-ratio 作废；无该变量时保持 16:10。
   与 .gcard 的高度跟随同一机制，作用域限定 .part-grid 直接子卡。 */
.part-grid[style*="--part-thumb-h"]>.res.fx-c .cover{
  aspect-ratio:auto;
  height:var(--part-thumb-h);
}
.res.fx-c .stub{flex:1;display:flex;flex-direction:column}
.res.fx-c .perf{margin-top:auto}
@media(max-width:1366px){
  .res.fx-c .perf .go{padding:0 11px}
  .res.fx-c .perf .go .go-l{display:none}
  .res.fx-c .perf .go .go-s{display:inline}
}

/* ==========================================================================
   列数规则（R26b / R41 口径，2026-10-11 用户拍板）
   ==========================================================================
   · 首页模板五资源区列数完全跟随官方 list_column —— 由 grid 部件的 max
     （mbt_art_list_cols() 映射）决定，任何宽度都不再锁死列数。
   · 形态卡网格的列宽门槛由 parts-ui.css 的
     `.part-grid--card{--part-grid-min:260px}` 保证（R26 实测 260px 门槛），
     本文件不再重复覆盖 grid-template-columns。 */