/* huangseckkp.cc —— 全站样式。手写、无框架。
   约定：**尺寸一律 px**（不吃根字号，跟外部脚本解耦 —— 见 kaiche 那个 rem 被放大 2.5 倍的坑）。

   2026-10-08 整站视觉重做：
   · 主色 **橙 #ff9000 → 网飞红 #e50914**（用户定的），红底上的字一律改成白（--on-ac）
   · 首页加 Hero、列表页加筛选/排序、详情页加信息表/标签/演员/相关推荐
   · 卡片加番号角标 / 无码标记 / 时长
   详见 plans/reflective-wobbling-crescent.md
*/

:root {
    --bg: #0b0b0d;
    --bg2: #151517;
    --card: #1c1c1f;
    --card2: #232327;
    --line: #2a2a2e;
    --line2: #38383d;
    --tx: #f5f5f7;
    --tx2: #a5a5ad;
    --tx3: #6e6e77;
    --ac: #e50914;          /* 网飞红 */
    --ac2: #f6121d;         /* hover 亮一档 */
    --on-ac: #fff;          /* 红底上的字 */
    --radius: 8px;
    --radius-lg: 12px;
}

* { box-sizing: border-box; }
html, body { margin: 0; padding: 0; }
body {
    background: var(--bg);
    color: var(--tx);
    font: 15px/1.6 -apple-system, "PingFang SC", "Microsoft YaHei", "Helvetica Neue", Arial, sans-serif;
    -webkit-text-size-adjust: 100%;
}
a { color: var(--tx); text-decoration: none; }
a:hover { color: var(--ac2); }
img { max-width: 100%; display: block; }
.wrap { width: 100%; max-width: 1180px; margin: 0 auto; padding: 0 14px; }

/* ══════════ 顶栏 ══════════ */
.hd { background: var(--bg2); border-bottom: 1px solid var(--line); position: sticky; top: 0; z-index: 20; }
.hd__in { display: flex; align-items: center; gap: 16px; height: 58px; }
.hd__logo { font-size: 20px; font-weight: 800; color: var(--ac); letter-spacing: .3px; flex: none; }
.hd__logo:hover { color: var(--ac2); }
.hd__search { flex: 1; display: flex; max-width: 520px; }
.hd__search input {
    flex: 1; min-width: 0; height: 36px; padding: 0 12px;
    background: var(--card); border: 1px solid var(--line); border-right: 0;
    border-radius: var(--radius) 0 0 var(--radius); color: var(--tx); font-size: 14px; outline: none;
}
.hd__search input:focus { border-color: var(--ac); }
.hd__search button {
    height: 36px; padding: 0 18px; border: 0; cursor: pointer;
    background: var(--ac); color: var(--on-ac); font-weight: 600; font-size: 14px;
    border-radius: 0 var(--radius) var(--radius) 0;
}
.hd__search button:hover { background: var(--ac2); }
/* ══════════ 主导航（2026-10-08 照 javdb：一行紧凑导航 + 下拉菜单）══════════
   用户原话：「这个排版我还是觉得不好看。你按 javdb 导航逻辑试试呢」
   → 把原来那三行胶囊墙撤了，改成 javdb 那种 **一行 `类别 ▾ 年份 ▾ 中文字幕 最新`**。
   🔴 下拉用**原生 `<details>/<summary>`** —— 不用 JS 就能开合、键盘也能操作 ✓
      「点外面关掉 / 按 Esc 关掉」那点 JS 在 `public/foot.html` 里。
   ⚠️ 收起时靠 `details:not([open])`，**别用 hover 展开**（触屏上 hover 是废的 ✗） */
.hd__nav { display: flex; align-items: center; gap: 2px; font-size: 14px; flex: none; }
.hd__nav > a,
.dd > summary {
    display: flex; align-items: center; gap: 6px;
    padding: 7px 11px; border-radius: var(--radius);
    color: var(--tx2); cursor: pointer; white-space: nowrap;
    list-style: none;                       /* 去掉 <summary> 自带的那个三角 */
}
.dd > summary::-webkit-details-marker { display: none; }
.hd__nav > a:hover, .dd > summary:hover { background: var(--card); color: var(--tx); }
.hd__nav > a.is-on { color: var(--ac); font-weight: 600; }
/* 自己画一个能跟字色走的 ▾（原生那个既丑又不能改色） */
.dd > summary::after {
    content: ''; width: 5px; height: 5px;
    border-right: 1.5px solid currentColor; border-bottom: 1.5px solid currentColor;
    transform: rotate(45deg); margin-top: -3px; transition: transform .15s;
}
.dd[open] > summary { background: var(--card); color: var(--tx); }
.dd[open] > summary::after { transform: rotate(-135deg); margin-top: 2px; }

.dd { position: relative; }
.dd__m {
    position: absolute; top: calc(100% + 6px); left: 0; z-index: 60;
    min-width: 220px; max-height: 68vh; overflow-y: auto;
    background: var(--bg2); border: 1px solid var(--line2); border-radius: var(--radius-lg);
    box-shadow: 0 12px 34px rgba(0, 0, 0, .55); padding: 6px;
}
.dd__m a {
    display: flex; justify-content: space-between; align-items: center; gap: 16px;
    padding: 8px 11px; border-radius: var(--radius);
    color: var(--tx2); font-size: 14px; white-space: nowrap;
}
.dd__m a:hover { background: var(--card); color: var(--ac2); }
.dd__m a i { font-style: normal; color: var(--tx3); font-size: 12px; }

/* 登录态 —— 2026-10-08 加。🔴 刻意**不放在 .hd__nav 里**：窄屏时 nav 是 display:none，
   放进去手机上就没登录入口了 */
.hd__user { display: flex; align-items: center; gap: 8px; flex: none; font-size: 13px; }
.hd__uname {
    max-width: 96px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
    color: var(--tx2);
}
.hd__ulink {
    padding: 5px 11px; border: 1px solid var(--line2); border-radius: 999px;
    color: var(--tx2); line-height: 1.4;
}
.hd__ulink:hover { border-color: var(--ac); color: var(--ac2); }
.hd__ulink--reg { background: var(--ac); border-color: var(--ac); color: var(--on-ac); font-weight: 600; }
.hd__ulink--reg:hover { background: var(--ac2); border-color: var(--ac2); color: var(--on-ac); }

/* ══════════ 分类胶囊条 —— **已撤掉**（2026-10-08）══════════
   用户当天先让改成「固定三行」，看过之后说「这个排版我还是觉得不好看，
   你按 javdb 导航逻辑试试呢」→ 改成上面那套**下拉菜单**了，`.cats*` 的样式全部删掉。
   （分类入口现在在 `.hd__nav` 的「类别 ▾」下拉里）*/

.main { padding: 20px 14px 40px; }

/* ══════════ 面包屑 ══════════ */
.crumb { font-size: 13px; color: var(--tx3); margin: 0 0 16px; }
.crumb a { color: var(--tx2); }
.crumb a:hover { color: var(--ac2); }
.crumb span { margin: 0 6px; color: var(--line2); }

/* ══════════ 首页 Hero ══════════ */
.hero {
    background: linear-gradient(135deg, #17171a 0%, #1d1416 60%, #241418 100%);
    border: 1px solid var(--line); border-radius: var(--radius-lg);
    padding: 34px 26px; margin-bottom: 26px;
}
.hero__t { font-size: 26px; font-weight: 800; margin: 0 0 8px; letter-spacing: .5px; }
.hero__t em { font-style: normal; color: var(--ac); }
.hero__s { color: var(--tx2); font-size: 14px; margin: 0 0 20px; }
.hero__s b { color: var(--tx); font-weight: 700; }
.hero__search { display: flex; max-width: 560px; }
.hero__search input {
    flex: 1; min-width: 0; height: 44px; padding: 0 14px;
    background: var(--bg); border: 1px solid var(--line2); border-right: 0;
    border-radius: var(--radius) 0 0 var(--radius); color: var(--tx); font-size: 15px; outline: none;
}
.hero__search input:focus { border-color: var(--ac); }
.hero__search button {
    height: 44px; padding: 0 24px; border: 0; cursor: pointer;
    background: var(--ac); color: var(--on-ac); font-weight: 700; font-size: 15px;
    border-radius: 0 var(--radius) var(--radius) 0;
}
.hero__search button:hover { background: var(--ac2); }
.hero__hot { margin-top: 14px; font-size: 13px; color: var(--tx3); }
.hero__hot a { color: var(--tx2); margin-right: 12px; }
.hero__hot a:hover { color: var(--ac2); }

/* ══════════ 区块标题 ══════════ */
.sec { margin-bottom: 30px; }
.sec__h { display: flex; align-items: baseline; justify-content: space-between; margin: 0 0 13px; }
.sec__h h2 { font-size: 18px; margin: 0; font-weight: 700; }
.sec__h h2::before {
    content: ''; display: inline-block; width: 3px; height: 15px; background: var(--ac);
    border-radius: 2px; margin-right: 9px; vertical-align: -2px;
}
.sec__h a { font-size: 13px; color: var(--tx3); }
.sec__h a:hover { color: var(--ac2); }

/* ══════════ 卡片网格 ══════════
   🔴🔴 **列数必须是"固定值"，不能让它跟着容器宽度算** —— 2026-10-08 用户：
   「不管 PC 是多少 px 宽度的浏览器，都能填满，不要出现现在这种显示空缺」。

   原来写的是 `repeat(auto-fill, minmax(150px, 1fr))` —— 列数是**根据容器宽度算出来的**
   （实测 1152px 宽 → 7 列），而每块内容的**条数是固定的** →
   **最后一行永远对不齐**：24 张 ÷ 7 列 = 最后一行只有 3 张、空 4 位 ✗；
   而且**换个窗口宽度列数就变**（5/6/8 列），空缺位置跟着乱跳 ✗。

   ✅ 现在的规矩（**两个数必须配套**）：
      · **列数固定 6 / 4 / 3 / 2**（四个断点）
      · **每块内容的条数必须是 6 的倍数**（6 的倍数自动也是 4/3/2 的倍数）→
        24 ✓ / 48 ✓；**18 ✗（除不尽 4）、40 ✗（除不尽 3 和 6）**
   ⚠️ **以后改任何一块的条数（首页各块、per_page），先看能不能被 6 整除。**
   `minmax(0, 1fr)` 里的 **0 是防溢出的**（默认 minmax(auto,1fr) 会被长内容顶破栅格）。 */
.grid {
    display: grid; gap: 14px;
    grid-template-columns: repeat(6, minmax(0, 1fr));   /* ≥1100px */
}
@media (max-width: 1099px) {
    .grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}
@media (max-width: 899px) {
    .grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
.card { display: block; }
.card__pic {
    position: relative; display: block; aspect-ratio: 5 / 7;
    background-color: var(--card);
    background-size: cover; background-position: center;   /* inline 塞封面 URL，给 ::before 垫底用 */
    border: 1px solid var(--line); border-radius: var(--radius);
    overflow: hidden; transition: border-color .15s, transform .15s;
}
.card:hover .card__pic { border-color: var(--ac); transform: translateY(-2px); }

/* 垫底环境图 —— 把封面放大模糊铺满整格。
   2026-10-08：实测采到的封面**横竖混杂**（横版 76% / 竖版 24%，中位数 1.49），
   而卡片是 5:7 竖版。若用 object-fit:cover 会把横版裁掉一半宽（标题常被切）✗，
   所以改成 **contain 不裁 + 用户要求的「横版图靠右」**，留白的地方由这层模糊垫底，
   不会出现死黑的空条。 */
.card__pic::before {
    content: ''; position: absolute; inset: -12px;
    background: inherit; background-size: cover; background-position: center;
    filter: blur(16px); opacity: .45;
}
.card__pic img {
    position: relative; width: 100%; height: 100%;
    object-fit: contain;              /* 不裁 */
    object-position: right center;    /* 🔴 用户 2026-10-08：「横版图靠右显示」 */
}
.card__noimg {
    position: absolute; inset: 0; display: flex; align-items: center; justify-content: center;
    color: var(--tx3); font-size: 15px; font-weight: 600; letter-spacing: .5px;
    padding: 8px; text-align: center; word-break: break-all;
}
/* 角标：右上「无码」，左上「番号」，左下「时长」 */
.card__un {
    position: absolute; top: 6px; right: 6px; background: var(--ac); color: var(--on-ac);
    font-size: 11px; font-weight: 700; padding: 1px 6px; border-radius: 4px; line-height: 1.5;
}
.card__cn {
    position: absolute; top: 6px; right: 6px; background: var(--ac); color: var(--on-ac);
    font-size: 11px; font-weight: 700; padding: 1px 6px; border-radius: 4px; line-height: 1.5;
}
.card__badge {
    position: absolute; top: 6px; left: 6px; background: rgba(0, 0, 0, .68);
    color: #fff; font-size: 11px; font-weight: 600; padding: 1px 6px; border-radius: 4px;
    max-width: 70%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; line-height: 1.5;
}
.card__dur {
    position: absolute; bottom: 6px; left: 6px; background: rgba(0, 0, 0, .68);
    color: #fff; font-size: 11px; padding: 1px 6px; border-radius: 4px; line-height: 1.5;
}
.card__t {
    display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
    font-size: 14px; margin-top: 8px; min-height: 44px;
}
.card:hover .card__t { color: var(--ac2); }
.card__m { display: block; font-size: 12px; color: var(--tx3); margin-top: 4px; }
.card__code { font-style: normal; color: var(--tx2); font-weight: 600; }

/* ══════════ 筛选条 / 排序 ══════════ */
.filters {
    background: var(--card); border: 1px solid var(--line); border-radius: var(--radius-lg);
    padding: 4px 14px; margin: 0 0 18px;
}
.filters__row {
    display: flex; align-items: flex-start; gap: 12px;
    padding: 10px 0; border-bottom: 1px solid var(--line);
}
.filters__row:last-child { border-bottom: 0; }
.filters__lbl { flex: none; width: 52px; font-size: 13px; color: var(--tx3); line-height: 26px; }
.filters__items { display: flex; flex-wrap: wrap; gap: 6px; flex: 1; min-width: 0; }
.filters__i {
    padding: 3px 11px; border: 1px solid var(--line); border-radius: 999px;
    font-size: 13px; color: var(--tx2); line-height: 20px;
}
.filters__i:hover { border-color: var(--ac); color: var(--ac2); }
.filters__i.is-on { background: var(--ac); border-color: var(--ac); color: var(--on-ac); font-weight: 600; }
.filters__i i { font-style: normal; color: var(--tx3); font-size: 11px; margin-left: 5px; }
.filters__i.is-on i { color: rgba(255, 255, 255, .72); }
.sorts__i { margin-left: 0; }
.filters__clear {
    flex: none; font-size: 13px; color: var(--tx3); line-height: 26px;
}
.filters__clear:hover { color: var(--ac2); }

/* ══════════ 详情页 ══════════
   2026-10-08 用户要求改成：**封面大图居中 + 影片信息分行排在封面下方**（照色花堂帖子正文那种
   `【标签】值` 的排版），**并且去掉相关推荐**。
   所以 .detail 不再是「左封面 + 右内容」的栅格，改成单栏居中。

   🔴 **封面一律按「原图尺寸」显示，绝不放大**（用户 2026-10-08：「采集到的图是多大，
      在详情页就放多大」）。所以：
      · 容器 `width: fit-content` —— **自己缩到图片那么大**，别固定 400 让里面留白
      · img `width: auto; max-width: 100%` —— **比容器宽就缩，比容器窄就原样**，
        千万别用 `width: 100%`（那会把小图硬撑大 → 糊 ✗）
   采集器把封面统一压到**最大宽 400**，所以正常情况就是 400 宽、1:1 显示。 */
/* 2026-10-08 用户：「信息栏卡片太大，封面的卡片太小，**各占一半**，**高度也保持一致**」
   → 栅格改成 1fr / 1fr；两张卡靠 `align-items: stretch`（栅格默认）等高。
   ⚠️ **取舍**：卡片填满左半栏（约 560px 宽），但**图仍按原图尺寸显示、不放大**
      （用户上一轮刚定的「采集到的图是多大就放多大」）—— 所以 400px 的封面在宽卡片里
      **是居中的、四周会留一点底色**。想让图也跟着铺满卡片就得放开 `width:auto` 那条，
      代价是 400px 的图被拉到 ~560px（1.4 倍）会明显发虚。 */
.detail { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 20px; align-items: stretch; }
.detail__cover {
    width: auto; max-width: 100%; margin: 0; min-height: 200px;
    display: flex; align-items: center; justify-content: center;   /* 图在卡片里居中 */
    border: 1px solid var(--line); border-radius: var(--radius-lg); overflow: hidden;
    background: var(--card);
}
/* 🔴 `width:auto` + `max-width:100%` = **原图多大就多大，只缩不放**。别改成 width:100% */
.detail__cover img { display: block; width: auto; max-width: 100%; max-height: 100%; height: auto; }
/* 没有封面时的占位块：这时候没有图片撑尺寸，得自己给 */
.detail__cover .card__noimg { position: static; width: 100%; aspect-ratio: 5 / 7; }
/* 右栏（信息行 + 简介）。⚠️ min-width:0 —— 栅格子项默认 min-width:auto，
   内容一宽就把栅格撑破（长标题/长标签会顶出去） */
.detail__side { min-width: 0; display: flex; flex-direction: column; }
/* 让**信息卡片本身**撑满右栏高度，跟左边封面卡等高。
   ⚠️ 必须把它的 `margin-bottom` 归零 —— 不归零的话卡片会矮 20px，
      看着就是「没对齐」（实测差 20px，正是那条 margin 的宽度）。 */
.detail__side .filminfo { flex: 1; margin-bottom: 0; }
/* 有简介时，简介跟上面的信息卡片之间留点空（上面的 margin 被归零了） */
.detail__side .detail__intro { margin-top: 16px; }

/* 影片信息：一行一项，`【标签】值` 的排法（照色花堂帖子正文） */
.filminfo {
    background: var(--card); border: 1px solid var(--line); border-radius: var(--radius-lg);
    padding: 14px 18px; margin: 0 0 20px;
}
.filminfo__row { padding: 5px 0; line-height: 1.8; font-size: 14px; }
.filminfo__k { color: var(--tx3); margin-right: 6px; }
/* 【影片名称】那一行的值就是 h1 —— 保留 h1 是为了 SEO，样式上跟正文一样大 */
.filminfo__h1 { display: inline; font-size: 15px; font-weight: 700; margin: 0; line-height: inherit; }
.filminfo a { color: var(--ac2); }

.detail__intro {
    color: var(--tx2); font-size: 14px; line-height: 1.85; white-space: pre-wrap;
    background: var(--card); border: 1px solid var(--line); border-radius: var(--radius-lg);
    padding: 14px 16px; margin: 0 0 4px;
}

/* 标签 / 演员 */
.tags { display: flex; flex-wrap: wrap; gap: 6px; }
.tag {
    font-size: 12px; color: var(--tx2); background: var(--card2);
    border: 1px solid var(--line); border-radius: 4px; padding: 2px 9px;
}
.tag:hover { border-color: var(--ac); color: var(--ac2); }

/* ══════════ 磁力列表 ══════════ */
.mags { margin-top: 24px; }
.mags h2 { font-size: 16px; margin: 0 0 12px; font-weight: 700; }
.mags h2::before {
    content: ''; display: inline-block; width: 3px; height: 14px; background: var(--ac);
    border-radius: 2px; margin-right: 9px; vertical-align: -2px;
}
.mag {
    background: var(--card); border: 1px solid var(--line); border-radius: var(--radius-lg);
    padding: 13px 15px; margin-bottom: 10px;
}
.mag:hover { border-color: var(--line2); }
.mag__top { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; margin-bottom: 9px; font-size: 13px; }
/* 「磁力链接1 / 2 / 3」—— 2026-10-08 用户要求用它代替原来那个网站 tag（原来显示 `sehuatang`） */
.mag__no { color: var(--tx); font-weight: 700; }
.mag__size { color: var(--ac2); font-weight: 700; }
.mag__res { color: var(--tx2); }
.mag__cn {
    background: var(--ac); color: var(--on-ac); font-size: 11px; font-weight: 700;
    padding: 1px 6px; border-radius: 4px;
}
.mag__row { display: flex; gap: 8px; }
.mag__url {
    flex: 1; min-width: 0; height: 36px; padding: 0 10px; background: var(--bg);
    border: 1px solid var(--line); border-radius: var(--radius); color: var(--tx2);
    font: 12px/34px ui-monospace, Menlo, Consolas, monospace;
    overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.mag__copy {
    flex: none; height: 36px; padding: 0 18px; border: 0; cursor: pointer;
    background: var(--ac); color: var(--on-ac); font-weight: 700; font-size: 14px;
    border-radius: var(--radius);
}
.mag__copy:hover { background: var(--ac2); }
.mag__copy.ok { background: #2ea86a; color: #fff; }

/* ---- 磁力门禁：未登录时整块替换（2026-10-08「注册后才能看到磁力链接」）---- */
.maggate {
    background: var(--card); border: 1px solid var(--line); border-radius: var(--radius-lg);
    padding: 34px 20px; text-align: center;
}
.maggate__lock { font-size: 30px; line-height: 1; margin-bottom: 12px; }
.maggate__t { font-size: 16px; font-weight: 700; margin: 0 0 6px; }
.maggate__s { color: var(--tx3); font-size: 13px; margin: 0 0 18px; }
.maggate__btns { display: flex; gap: 10px; justify-content: center; flex-wrap: wrap; }
.maggate__btn {
    padding: 9px 26px; border-radius: var(--radius); font-size: 14px; font-weight: 600;
    background: var(--ac); color: var(--on-ac);
}
.maggate__btn:hover { background: var(--ac2); color: var(--on-ac); }
.maggate__btn--ghost { background: transparent; border: 1px solid var(--line2); color: var(--tx2); }
.maggate__btn--ghost:hover { border-color: var(--ac); background: transparent; color: var(--ac2); }

/* ---- 赞 / 踩 ---- */
.votes { margin-top: 18px; }
.votes__form { display: flex; gap: 10px; }
.votes__b {
    display: inline-flex; align-items: center; gap: 8px;
    padding: 8px 18px; cursor: pointer;
    background: var(--card); border: 1px solid var(--line); border-radius: 999px;
    color: var(--tx2); font: inherit; font-size: 14px; line-height: 1.2;
    transition: border-color .15s, color .15s, background .15s;
}
.votes__b:hover { border-color: var(--ac); color: var(--tx); }
.votes__b.is-on { border-color: var(--ac); color: var(--ac2); background: rgba(229, 9, 20, .12); font-weight: 700; }
.votes__i { font-size: 16px; line-height: 1; }
.votes__n { min-width: 14px; text-align: left; }

/* ---- 登录 / 注册页 ---- */
.authbox {
    max-width: 400px; margin: 30px auto 10px;
    background: var(--card); border: 1px solid var(--line); border-radius: var(--radius-lg);
    padding: 28px 24px;
}
.authbox__t { font-size: 20px; margin: 0 0 6px; text-align: center; }
.authbox__s { color: var(--tx3); font-size: 13px; margin: 0 0 20px; text-align: center; }
.authbox__err {
    background: rgba(229, 9, 20, .12); border: 1px solid var(--ac); border-radius: var(--radius);
    color: #ff9aa1; font-size: 13px; padding: 9px 12px; margin: 0 0 16px;
}
.authform__r { display: block; margin-bottom: 14px; }
.authform__r > span { display: block; font-size: 13px; color: var(--tx2); margin-bottom: 6px; }
.authform__r > span em { font-style: normal; color: var(--tx3); font-size: 12px; }
.authform__r input {
    width: 100%; height: 40px; padding: 0 12px;
    background: var(--bg); border: 1px solid var(--line2); border-radius: var(--radius);
    color: var(--tx); font-size: 14px; outline: none;
}
.authform__r input:focus { border-color: var(--ac); }
.authform__btn {
    width: 100%; height: 42px; margin-top: 6px; border: 0; cursor: pointer;
    background: var(--ac); color: var(--on-ac); font-size: 15px; font-weight: 700;
    border-radius: var(--radius);
}
.authform__btn:hover { background: var(--ac2); }
.authbox__f { text-align: center; font-size: 13px; color: var(--tx3); margin: 18px 0 0; }
.authbox__f a { color: var(--ac2); }

/* ══════════ 分页 ══════════ */
.pager { display: flex; flex-wrap: wrap; gap: 6px; margin: 26px 0 0; }
.pager a, .pager span {
    min-width: 34px; height: 34px; padding: 0 10px; line-height: 32px; text-align: center;
    border: 1px solid var(--line); border-radius: var(--radius); font-size: 14px; color: var(--tx2);
}
.pager a:hover { border-color: var(--ac); color: var(--ac2); }
.pager .cur { background: var(--ac); border-color: var(--ac); color: var(--on-ac); font-weight: 700; }

/* ══════════ 年份条（/year/ 和首页快捷） ══════════ */
.years { display: flex; flex-wrap: wrap; gap: 8px; }
.years__i {
    padding: 7px 16px; background: var(--card); border: 1px solid var(--line);
    border-radius: var(--radius); font-size: 14px; color: var(--tx2);
}
.years__i:hover { border-color: var(--ac); color: var(--ac2); }
.years__i i { font-style: normal; color: var(--tx3); font-size: 12px; margin-left: 6px; }

/* ══════════ 空状态 / 提示 ══════════ */
.empty { text-align: center; color: var(--tx3); padding: 60px 20px; font-size: 15px; }
.empty a { color: var(--ac2); }
.count { color: var(--tx3); font-size: 13px; margin: 0 0 14px; }
.count b { color: var(--tx2); }

/* ══════════ 页脚 ══════════ */
.ft { border-top: 1px solid var(--line); padding: 26px 0; margin-top: 30px; color: var(--tx3); font-size: 13px; text-align: center; }
.ft p { margin: 0 0 8px; }
.ft__links a { color: var(--tx2); margin: 0 7px; }
.ft__links a:hover { color: var(--ac2); }

/* ══════════ 移动端 ══════════ */
@media (max-width: 720px) {
    /* 顶栏折成三行：① logo + 登录 ② 主导航 ③ 搜索
       🔴 **导航不能再 `display:none` 了** —— 分类入口现在全在「类别 ▾」下拉里，
          藏掉的话手机上就没法逛分类了 ✗（原来有胶囊条兜着，现在没有） */
    .hd__in { height: auto; flex-wrap: wrap; padding: 8px 0; gap: 8px; }
    .hd__logo { order: 1; }
    .hd__user { order: 2; margin-left: auto; }
    .hd__nav { order: 3; flex-basis: 100%; }
    .hd__search { order: 4; max-width: none; flex-basis: 100%; }
    /* 手机上下拉菜单别跑出屏幕 */
    .dd__m { min-width: 0; max-width: calc(100vw - 24px); max-height: 60vh; }
    .hero { padding: 22px 16px; }
    .hero__t { font-size: 20px; }
    .hero__search input, .hero__search button { height: 40px; }
    /* ≤720px：**固定 2 列**（24 / 48 都能被 2 整除 ✓）—— 别改回 auto-fill，理由见上面网格那段 */
    .grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
    .card__t { font-size: 13px; min-height: 40px; }
    .card__badge { font-size: 10px; padding: 1px 5px; }
    .detail { grid-template-columns: 1fr; gap: 16px; }
    .detail__cover { max-width: 260px; margin: 0 auto; }
    .filminfo { padding: 12px 14px; }
    .filminfo__row { font-size: 13px; }
    .filminfo__h1 { font-size: 14px; }
    .hd__user { font-size: 12px; gap: 6px; }
    .hd__uname { max-width: 62px; }
    .hd__ulink { padding: 4px 10px; }
    .dd > summary, .hd__nav > a { padding: 6px 9px; }
    .maggate { padding: 26px 16px; }
    .authbox { padding: 22px 16px; margin-top: 18px; }
    .filters { padding: 2px 12px; }
    .filters__lbl { width: 44px; }
    .filters__items { flex-wrap: nowrap; overflow-x: auto; padding-bottom: 2px; }
    .filters__i { flex: none; }
    .main { padding: 16px 10px 32px; }
    .years__i { padding: 6px 13px; font-size: 13px; }
}

/* ============ 广告（2026-10-19） ============ */
/* 横幅：**全站顶部**。容器固定高度、图片 `object-fit: fill` 拉伸填满。
   🔴 绝对别改成 cover —— 会裁掉两边的字（全站广告的硬约定） */
.adbar { background: var(--bg2); border-bottom: 1px solid var(--line); }
.adbar__in { max-width: 1180px; margin: 0 auto; padding: 8px 14px; display: flex; flex-direction: column; gap: 8px; }
.adbar__i { position: relative; display: block; height: 80px; border-radius: 6px; overflow: hidden; line-height: 0; background: var(--card); }
.adbar__i img { display: block; width: 100%; height: 100%; object-fit: fill; }
.adbar__tag {
    position: absolute; right: 6px; top: 6px; font-style: normal;
    font-size: 11px; line-height: 1.6; padding: 0 6px; border-radius: 4px;
    color: #fff; background: rgba(0, 0, 0, .55);
}

/* 图标走马灯：**全站底部**。结构照 69yingshipy(conch) 的 .coop_scroll ——
   两份一模一样的列表并排 + 整体平移到 -50% = 无缝循环；hover 暂停 */
.adrow { background: var(--bg2); border-top: 1px solid var(--line); padding: 14px 0 16px; }
.adrow__hd {
    max-width: 1180px; margin: 0 auto 10px; padding: 0 14px;
    display: flex; align-items: center; gap: 8px; font-size: 15px; color: var(--tx);
}
.adrow__hd i {
    font-style: normal; font-size: 11px; color: var(--tx3);
    border: 1px solid var(--line2); border-radius: 4px; padding: 0 5px;
}
.adrow__scroll { overflow: hidden; position: relative; }
.adrow__track {
    display: flex; width: max-content;
    animation: adrowScroll 40s linear infinite;
    will-change: transform; backface-visibility: hidden;
}
.adrow__list { display: flex; width: max-content; flex-shrink: 0; }
/* 尺寸：2026-10-19 用户先说「照六九影视」，照做之后又说「还是太大」→
   在六九（每项 128 / 图标 108）的基础上再缩一档：**每项 96px、内边距 8px → 图标 80px**
   手机 18vw。要再调只改这两个数（图标 = width − padding×2）。 */
.adrow__i { flex: 0 0 auto; width: 96px; padding: 8px; text-align: center; min-width: 0; }
.adrow__pic {
    display: block; width: 100%; aspect-ratio: 1 / 1;
    overflow: hidden; border-radius: 6px;
    border: 1px solid var(--line);          /* 和 69 一样加一圈细边，视觉上收一点 */
    background: var(--card);
}
.adrow__pic img { display: block; width: 100%; height: 100%; object-fit: fill; }
.adrow__name {
    display: block; margin-top: 4px; font-size: 12px; color: var(--tx2);
    white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.adrow__scroll:hover .adrow__track { animation-play-state: paused; }
@keyframes adrowScroll { to { transform: translateX(-50%); } }

/* 窄屏：18vw（跟着视口缩，不是写死） */
@media (max-width: 767px) {
    .adbar__i { height: 56px; }
    .adrow__i { width: 18vw; padding: 3px; }
    .adrow__name { font-size: 11px; }
}