/* ============================================================
   NylonWeb · 认证页 / 后台页 / 顶部认证控件样式
   复用首页的设计令牌：--bg #050505 / --ink #f2f0ec / --dim / --line
   ============================================================ */

:root{
  --bg:#050505;
  --ink:#f2f0ec;
  --dim:#8f8b86;
  --line:rgba(255,255,255,.07);
  --line-soft:rgba(255,255,255,.04);
  --glow:rgba(214,218,230,.14);
  --danger:#e2685f;
  --ok:#7fc08a;
}

/* ============================================================
   ⚠ 必须保留：让 hidden 属性真正生效
   ------------------------------------------------------------
   hidden 是靠浏览器默认样式 [hidden]{display:none} 生效的，
   而本文件里给若干元素写了显式 display（例如
   .nav-avatar{display:block}、.nav-avatar-fallback{display:grid}、
   .crop-modal{display:flex}、.avatar-lg{display:block}），
   作者样式的优先级高于浏览器默认样式 —— 于是这些元素的
   hidden 会被无视：
     · 顶部控件会同时显示「头像图」和「首字兜底」两个头像
     · 个人中心的裁剪弹窗会一进页面就盖在屏幕上
   所以这里用 !important 兜底，保证 hidden 永远有效。
   ============================================================ */
[hidden]{display:none !important}

*{margin:0;padding:0;box-sizing:border-box}

/* ============================================================
   滚动条：统一成细窄的深色条
   ------------------------------------------------------------
   浏览器默认滚动条是浅色系统样式（还带箭头按钮），放在深色站点里很跳。
   Chrome / Edge / Safari 用 ::-webkit-scrollbar 系列，Firefox 用
   scrollbar-width + scrollbar-color（两套都要写，前者对后者无影响）。
   滚动条本体只有 4px 可见（8px 轨道里用透明边框 + background-clip 收窄）。
   ============================================================ */
*{
  scrollbar-width:thin;
  scrollbar-color:rgba(255,255,255,.2) transparent;
}
::-webkit-scrollbar{width:8px;height:8px}
::-webkit-scrollbar-track{background:transparent}
::-webkit-scrollbar-thumb{
  background:rgba(255,255,255,.16);
  border:2px solid transparent;      /* 收窄可见宽度 */
  background-clip:content-box;
  border-radius:8px;
}
::-webkit-scrollbar-thumb:hover{background:rgba(255,255,255,.32);background-clip:content-box}
::-webkit-scrollbar-thumb:active{background:rgba(255,255,255,.45);background-clip:content-box}
::-webkit-scrollbar-corner{background:transparent}
/* 横滑容器（漫画卡、继续观看）也走同一套 */
::-webkit-scrollbar-button{display:none;width:0;height:0}

body.auth-body{
  background:var(--bg);
  color:var(--ink);
  font-family:"Noto Sans SC","PingFang SC","Microsoft YaHei",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  font-weight:300;
  line-height:1.7;
  letter-spacing:.02em;
  min-height:100vh;
  display:flex;
  flex-direction:column;
  -webkit-font-smoothing:antialiased;
}

a{color:inherit;text-decoration:none}
a:hover{opacity:.8}

/* ---------- 顶栏 ---------- */
.auth-nav{
  display:flex;align-items:center;justify-content:space-between;
  padding:22px clamp(18px,4vw,54px);
  border-bottom:1px solid var(--line-soft);
}
.auth-brand{display:flex;align-items:center;gap:12px}
.auth-brand img{height:24px;width:auto}
.auth-brand .n{display:flex;flex-direction:column;line-height:1.25}
.auth-brand b{font-weight:400;font-size:.74rem;letter-spacing:.3em}
.auth-brand em{font-style:normal;font-size:.56rem;letter-spacing:.3em;color:var(--dim)}
.auth-nav .back{font-size:.62rem;letter-spacing:.28em;text-transform:uppercase;color:var(--dim)}

/* ---------- 主区域 ---------- */
.auth-wrap{
  flex:1;
  display:flex;align-items:center;justify-content:center;
  padding:clamp(28px,6vh,72px) 18px;
}
.auth-card{
  width:100%;max-width:420px;
  border:1px solid var(--line);
  background:linear-gradient(180deg,rgba(255,255,255,.022),rgba(255,255,255,0));
  padding:clamp(24px,4vw,38px);
  position:relative;
}
.auth-card::before{
  content:"";position:absolute;left:0;top:0;height:1px;width:100%;
  background:linear-gradient(90deg,transparent,var(--glow),transparent);
}
.auth-title{font-size:1.3rem;font-weight:300;letter-spacing:.12em}
.auth-sub{color:var(--dim);font-size:.74rem;margin-top:10px;letter-spacing:.04em}

/* ---------- 表单 ---------- */
.auth-form{margin-top:26px}
.field{margin-bottom:18px}
.field label{
  display:block;font-size:.6rem;letter-spacing:.26em;text-transform:uppercase;
  color:var(--dim);margin-bottom:8px;
}
.field input[type=email],
.field input[type=password],
.field input[type=text],
.field input[type=number],
.field input[type=search]{
  width:100%;
  background:rgba(255,255,255,.03);
  border:1px solid var(--line);
  color:var(--ink);
  padding:12px 14px;
  font:inherit;font-size:.86rem;letter-spacing:.04em;
  transition:border-color .3s,background .3s,box-shadow .3s;
}
/* 数字框去掉系统上下箭头（我们不用它的原生外观） */
.field input[type=number]{
  appearance:textfield;-moz-appearance:textfield;
}
.field input[type=number]::-webkit-outer-spin-button,
.field input[type=number]::-webkit-inner-spin-button{
  -webkit-appearance:none;appearance:none;margin:0;
}
.field input:focus{
  outline:none;
  border-color:rgba(255,255,255,.22);
  background:rgba(255,255,255,.05);
  box-shadow:0 0 0 3px rgba(214,218,230,.06);
}
.field input::placeholder{color:rgba(143,139,134,.55)}

/* ---------- 下拉框：与深色主题统一（浏览器默认外观太白太跳） ---------- */
.field select,
.adm-inline select,
.adm-table select{
  appearance:none;
  -webkit-appearance:none;
  -moz-appearance:none;
  width:100%;
  background-color:rgba(255,255,255,.03);
  /* 自绘箭头（内联 SVG，颜色与 --dim 一致） */
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='11' height='7' viewBox='0 0 11 7'><path d='M1 1l4.5 4.5L10 1' fill='none' stroke='%238f8b86' stroke-width='1.5' stroke-linecap='round'/></svg>");
  background-repeat:no-repeat;
  background-position:right 14px center;
  border:1px solid var(--line);
  color:var(--ink);
  padding:12px 38px 12px 14px;
  font:inherit;font-size:.86rem;letter-spacing:.04em;
  cursor:pointer;
  transition:border-color .3s,background-color .3s,box-shadow .3s;
}
.field select:hover,
.adm-inline select:hover{background-color:rgba(255,255,255,.05)}
.field select:focus,
.adm-inline select:focus{
  outline:none;
  border-color:rgba(255,255,255,.22);
  background-color:rgba(255,255,255,.05);
  box-shadow:0 0 0 3px rgba(214,218,230,.06);
}
/* 展开后的选项列表（Chrome/Firefox 生效；Windows 原生下拉列表只能改到这一步） */
.field select option,
.adm-inline select option{background:#0a0a0a;color:var(--ink)}

/* ---------- 文本域 ---------- */
.field textarea,
textarea.adm-textarea{
  width:100%;
  background:rgba(255,255,255,.03);
  border:1px solid var(--line);
  color:var(--ink);
  padding:13px 14px;
  font:inherit;font-size:.82rem;line-height:1.85;letter-spacing:.02em;
  resize:vertical;
  transition:border-color .3s,background .3s,box-shadow .3s;
}
.field textarea:focus,
textarea.adm-textarea:focus{
  outline:none;
  border-color:rgba(255,255,255,.22);
  background:rgba(255,255,255,.05);
  box-shadow:0 0 0 3px rgba(214,218,230,.06);
}

/* ---------- 后台里紧凑排布时不再强制 100% 宽 ---------- */
.adm-inline select{width:auto;min-width:220px;padding:10px 34px 10px 12px;font-size:.74rem}
.adm-table select{padding:7px 30px 7px 10px;font-size:.68rem;width:auto;min-width:92px}
.admin-inline-form select{width:auto}
.field .pw{position:relative}
.field .pw input{padding-right:64px}
.pw-toggle{
  position:absolute;right:10px;top:50%;transform:translateY(-50%);
  background:none;border:0;color:var(--dim);cursor:pointer;
  font:inherit;font-size:.62rem;letter-spacing:.16em;padding:6px 4px;
}
.pw-toggle:hover{color:var(--ink)}
.err{color:var(--danger);font-size:.68rem;margin-top:7px;letter-spacing:.03em}
.hint{color:var(--dim);font-size:.66rem;margin-top:7px;letter-spacing:.03em}

.check{display:flex;align-items:center;gap:9px;font-size:.72rem;color:var(--dim);margin:6px 0 20px;cursor:pointer}
.check input{appearance:none;width:15px;height:15px;border:1px solid rgba(255,255,255,.22);background:rgba(255,255,255,.03);position:relative;cursor:pointer;flex:0 0 auto}
.check input:checked{border-color:rgba(255,255,255,.45)}
.check input:checked::after{content:"";position:absolute;left:4px;top:1px;width:5px;height:9px;border-right:1.5px solid var(--ink);border-bottom:1.5px solid var(--ink);transform:rotate(42deg)}

.btn{
  width:100%;
  background:var(--ink);color:#0b0b0b;border:0;
  padding:13px 18px;font:inherit;font-size:.76rem;font-weight:400;
  letter-spacing:.26em;text-transform:uppercase;cursor:pointer;
  transition:opacity .3s,transform .2s;
}
.btn:hover{opacity:.88}
.btn:active{transform:translateY(1px)}
.btn[disabled]{opacity:.45;cursor:not-allowed}
.btn.ghost{background:transparent;color:var(--ink);border:1px solid var(--line);letter-spacing:.2em}
.btn.ghost:hover{border-color:rgba(255,255,255,.25)}

/* ---------- 提示条 ---------- */
.banner{
  border:1px solid var(--line);
  background:rgba(255,255,255,.03);
  padding:11px 14px;font-size:.72rem;letter-spacing:.03em;margin-bottom:20px;
}
.banner.err{border-color:rgba(226,104,95,.35);color:#f0a49d}
.banner.ok{border-color:rgba(127,192,138,.3);color:#a8d8b1}
.banner.dim{color:var(--dim)}

/* ---------- 底部链接 ---------- */
.link-row{
  margin-top:24px;padding-top:18px;border-top:1px solid var(--line-soft);
  display:flex;align-items:center;gap:10px;flex-wrap:wrap;
  font-size:.7rem;color:var(--dim);
}
.link-row a{border-bottom:1px solid transparent;padding-bottom:1px}
.link-row a:hover{border-bottom-color:var(--dim);opacity:1}
.link-row .dot{opacity:.4}

/* ---------- 开发期提示 ---------- */
.dev-note{
  margin-top:18px;font-size:.62rem;letter-spacing:.06em;color:rgba(143,139,134,.75);
  border-left:2px solid var(--line);padding-left:10px;
}

/* ---------- 页脚 ---------- */
.auth-foot{
  border-top:1px solid var(--line-soft);
  padding:18px clamp(18px,4vw,54px);
  display:flex;justify-content:space-between;gap:14px;flex-wrap:wrap;
  font-size:.58rem;letter-spacing:.1em;color:rgba(143,139,134,.6);
}

/* ---------- 顶部认证控件（首页导航右上角） ----------
   ⚠ 首页 nav 带 mix-blend-mode:difference：任何放在 nav 内部的面板都会被
   差值混合连同文字一起翻色，实测对比度很差甚至"遮罩消失"。
   所以这个控件由 home.php 放在 nav 之外的 .nav-auth-bar 里，
   并自带深色胶囊底 —— 无论横幅是深是浅都保证清晰可读。 */
.nav-auth{
  display:flex;align-items:center;gap:16px;
  font-size:.66rem;letter-spacing:.2em;text-transform:uppercase;
  white-space:nowrap;
  color:#f2f0ec;
  background:rgba(5,5,5,.74);
  -webkit-backdrop-filter:blur(8px);
  backdrop-filter:blur(8px);
  border:1px solid rgba(255,255,255,.10);
  border-radius:999px;
  padding:7px 16px;
}
.nav-auth a{color:#f2f0ec;opacity:1;transition:opacity .3s;white-space:nowrap;text-decoration:none}
.nav-auth a:hover{opacity:.72}
.nav-auth .sep{opacity:.35}

/* 头像 + 昵称合成一个链接：点一下直接进个人中心 */
.nav-auth .nav-user{
  position:relative;
  display:inline-flex;align-items:center;gap:9px;
  text-transform:none;letter-spacing:.08em;
}
.nav-auth .nav-user::after{
  content:"";position:absolute;left:0;bottom:-4px;height:1px;width:100%;
  background:currentColor;transform:scaleX(0);transform-origin:right;
  transition:transform .45s cubic-bezier(.6,0,.2,1);
}
.nav-auth .nav-user:hover::after{transform:scaleX(1);transform-origin:left}
.nav-auth .badge{
  font-size:.5rem;letter-spacing:.12em;border:1px solid rgba(226,104,95,.55);
  color:#ffb3ab;padding:1px 5px;text-transform:uppercase;
}
.nav-auth .skeleton{width:96px;height:10px;background:rgba(255,255,255,.14);display:inline-block}

/* 窄一点的桌面宽度下隐藏次要入口，避免和站点原有导航项挤在一起 */
@media(max-width:1200px){
  .nav-auth{gap:13px;font-size:.6rem;letter-spacing:.14em;padding:6px 13px}
  .nav-auth .nav-admin{display:none}
}

/* 移动端全屏菜单里的那一份（≤920px，位于 .nav-menu 内，正常混合） */
.nav-auth-mobile{display:none}
@media(max-width:920px){
  .nav-auth-mobile{
    display:flex;flex-direction:column;align-items:center;gap:18px;
    font-size:.86rem;letter-spacing:.24em;text-transform:uppercase;
    margin-top:6px;padding-top:20px;border-top:1px solid rgba(255,255,255,.18);
    color:#f2f0ec;
  }
  .nav-auth-mobile a{color:#f2f0ec;opacity:1;text-decoration:none}
  .nav-auth-mobile .nav-user{font-size:.86rem;letter-spacing:.14em}
}

/* ============================================================
   用户后台 / 个人中心
   ============================================================ */
.dash{width:100%;max-width:720px}
.dash-head{
  display:flex;align-items:center;gap:22px;
  padding:0 0 24px;border-bottom:1px solid var(--line-soft);margin-bottom:26px;
}
.dash-id{min-width:0}
.dash-nick{font-size:1.25rem;font-weight:300;letter-spacing:.08em;margin-bottom:6px}
.dash-email{font-size:.76rem;color:var(--dim);letter-spacing:.03em;word-break:break-all}
.dash-meta{font-size:.62rem;color:rgba(143,139,134,.65);letter-spacing:.08em;margin-top:8px}

.avatar-wrap{position:relative;flex:0 0 auto}
.avatar-lg{
  width:88px;height:88px;border-radius:50%;object-fit:cover;
  border:1px solid var(--line);display:block;
}
.avatar-fallback{
  display:grid;place-items:center;
  font-size:1.6rem;letter-spacing:0;color:var(--ink);
}
.avatar-pick{
  position:absolute;left:50%;transform:translateX(-50%);bottom:-11px;
  background:#0a0a0a;border:1px solid var(--line);color:var(--dim);
  font:inherit;font-size:.56rem;letter-spacing:.1em;
  padding:3px 9px;cursor:pointer;white-space:nowrap;
}
.avatar-pick:hover{color:var(--ink);border-color:rgba(255,255,255,.22)}

.pill{
  display:inline-block;font-size:.54rem;letter-spacing:.12em;text-transform:uppercase;
  border:1px solid var(--line);padding:1px 7px;margin-left:6px;color:var(--dim);
}
.pill.warn{border-color:rgba(226,104,95,.45);color:#f0a49d}

.dash-block{
  border:1px solid var(--line);
  background:linear-gradient(180deg,rgba(255,255,255,.018),rgba(255,255,255,0));
  padding:22px;margin-bottom:20px;
}
.dash-title{font-size:.92rem;font-weight:300;letter-spacing:.14em}
.dash-sub{font-size:.68rem;color:var(--dim);margin:8px 0 18px;letter-spacing:.03em;line-height:1.7}
.dash-actions{display:flex;gap:12px;flex-wrap:wrap}
.dash-actions .btn{width:auto;padding:10px 20px;letter-spacing:.18em;font-size:.68rem}

.dash-table{width:100%;font-size:.72rem;border-collapse:collapse}
.dash-table td{padding:6px 0;vertical-align:top}
.dash-table td:first-child{color:var(--dim);width:110px}

/* 顶部控件里的小头像 */
.nav-avatar,.nav-avatar-fallback{
  width:22px;height:22px;border-radius:50%;flex:0 0 auto;
}
.nav-avatar{object-fit:cover;border:1px solid var(--line);display:block}
.nav-avatar-fallback{
  display:grid;place-items:center;font-size:.6rem;letter-spacing:0;
  border:1px solid var(--line);color:var(--ink);
}

/* ---------- 裁剪弹窗 ---------- */
.crop-modal{
  position:fixed;inset:0;z-index:400;
  background:rgba(3,3,3,.86);
  display:flex;align-items:center;justify-content:center;padding:20px;
  backdrop-filter:blur(3px);
}
.crop-panel{
  width:100%;max-width:380px;
  border:1px solid var(--line);background:#0a0a0a;
  padding:22px;
}
.crop-title{font-size:.95rem;font-weight:300;letter-spacing:.12em}
.crop-hint{font-size:.64rem;color:var(--dim);margin:8px 0 16px;line-height:1.7}
.crop-stage{
  display:flex;justify-content:center;margin-bottom:16px;
}
.crop-stage canvas{
  width:300px;height:300px;max-width:100%;
  border:1px solid var(--line);cursor:grab;touch-action:none;display:block;
}
.crop-zoom{
  display:flex;align-items:center;gap:12px;
  font-size:.62rem;letter-spacing:.16em;text-transform:uppercase;color:var(--dim);
  margin-bottom:18px;
}
.crop-zoom input[type=range]{flex:1;accent-color:#f2f0ec}
.crop-actions{display:flex;gap:12px}
.crop-actions .btn{flex:1;padding:11px 14px;font-size:.68rem;letter-spacing:.2em}

/* ---------- 首页图裁切（assets/js/home-image-crop.js）----------
   与头像裁剪同一个弹窗/同一套按钮，只有两点不同：
     · 取景框**不是正方形**（比例来自槽位预设）→ .crop-stage.prop 的 canvas 用自身
       宽高属性当内在尺寸（width/height:auto），窄屏时靠 max-width:100% 等比缩下来；
     · 预设多一个「比例」选择行。 */
.crop-panel-wide{max-width:460px}
.crop-ratios{display:flex;gap:8px;margin:0 0 14px}
.crop-ratios button{
  flex:1;min-height:34px;padding:8px 6px;cursor:pointer;font-size:.6rem;letter-spacing:.1em;
  display:flex;align-items:center;justify-content:center;
  border:1px solid var(--line);background:transparent;color:var(--dim);
  transition:border-color .3s,color .3s;
}
.crop-ratios button.on{border-color:rgba(255,255,255,.5);color:var(--ink)}
/* 取景框：显示尺寸由 JS 显式写死（内在比例 ≠ 头像那张 1:1），这里只兜底 */
.crop-stage.prop canvas{width:auto;height:auto;max-width:100%;aspect-ratio:auto}
@media (max-width:640px){
  /* 三个按钮（换图/取消/使用这张）在窄屏竖排，别挤成 3 个 20px 的小方块 */
  .crop-panel-wide .crop-actions{flex-wrap:wrap;gap:10px}
  .crop-panel-wide .crop-actions .btn{min-height:38px}
}

@media (max-width:640px){
  .dash-head{flex-direction:column;align-items:flex-start;gap:18px}
  .dash-block{padding:18px 16px}
  .crop-stage canvas{width:100%;height:auto;aspect-ratio:1/1}
  .crop-actions{flex-direction:column}
}

/* ============================================================
   内容管理后台
   ============================================================ */
.adm-nav{
  display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;
  padding-bottom:16px;border-bottom:1px solid var(--line-soft);margin-bottom:22px;
}
.adm-nav-links{display:flex;flex-wrap:wrap;gap:18px;font-size:.68rem;letter-spacing:.2em;text-transform:uppercase}
.adm-nav-links a{opacity:.6;transition:opacity .3s;white-space:nowrap}
.adm-nav-links a:hover{opacity:1}
.adm-nav-links a.on{opacity:1;border-bottom:1px solid currentColor}
.adm-nav-right{display:flex;gap:14px;font-size:.62rem;letter-spacing:.12em;color:var(--dim)}
.adm-nav-right a{opacity:.75}
.adm-nav-right a:hover{opacity:1}

/* 导航里不再有可展开的父项 / 子菜单（.adm-nav-group / .adm-nav-parent /
   .adm-nav-sub / .adm-nav-caret 与 assets/js/admin-nav.js 一起删掉了）：
   「作品」现在是顶层链接，视频 / 小说 / 漫画 的切换在列表页页内用 .rep-tabs
   标签栏（见文件末尾「作品标签栏」一节），导航条因此始终是一行、宽度不被撑开。 */

.adm-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:12px}
.adm-stat{
  display:block;border:1px solid var(--line);padding:16px 18px;
  background:linear-gradient(180deg,rgba(255,255,255,.02),rgba(255,255,255,0));
}
.adm-stat b{display:block;font-size:1.4rem;font-weight:300;letter-spacing:.04em}
.adm-stat span{display:block;font-size:.62rem;letter-spacing:.14em;color:var(--dim);margin-top:6px}
a.adm-stat:hover{border-color:rgba(255,255,255,.22)}

.adm-table{width:100%;border-collapse:collapse;font-size:.7rem;margin-top:12px}
.adm-table th{
  text-align:left;font-weight:400;color:var(--dim);font-size:.6rem;
  letter-spacing:.14em;text-transform:uppercase;padding:8px 10px 8px 0;
  border-bottom:1px solid var(--line);
}
.adm-table td{padding:10px 10px 10px 0;border-bottom:1px solid var(--line-soft);vertical-align:top}
.adm-table a{text-decoration:none;border-bottom:1px solid rgba(255,255,255,.18)}
.adm-table a:hover{border-bottom-color:currentColor}
.adm-dim{color:var(--dim);font-size:.62rem;letter-spacing:.06em;margin-top:3px}
.adm-ok{color:#a8d8b1}
.adm-ip{
  font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  font-size:.66rem;letter-spacing:0;color:var(--ink);
  background:rgba(255,255,255,.05);border:1px solid var(--line);
  padding:1px 6px;display:inline-block;
}
.adm-link{background:none;border:0;color:var(--dim);font:inherit;font-size:.66rem;cursor:pointer;padding:0;letter-spacing:.1em}
.adm-link:hover{color:var(--ink)}
.adm-link.danger:hover{color:#f0a49d}

.adm-row{display:flex;gap:16px;flex-wrap:wrap}
.adm-row .field{min-width:150px}
.adm-inline{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin-top:14px}
.adm-inline input[type=text],.adm-inline select{
  background:rgba(255,255,255,.03);border:1px solid var(--line);color:var(--ink);
  padding:10px 12px;font:inherit;font-size:.74rem;min-width:220px;
}
.adm-inline input[type=text]:focus,.adm-inline select:focus{outline:none;border-color:rgba(255,255,255,.22)}

.adm-cover{display:block;margin-top:14px;max-width:260px;border:1px solid var(--line)}
.adm-textarea{
  width:100%;background:rgba(255,255,255,.03);border:1px solid var(--line);color:var(--ink);
  padding:14px;font:inherit;font-size:.8rem;line-height:1.9;resize:vertical;
}
.adm-textarea:focus{outline:none;border-color:rgba(255,255,255,.22);background:rgba(255,255,255,.05)}

.up-status{font-size:.66rem;color:var(--dim);letter-spacing:.1em}
.up-bar{height:3px;background:rgba(255,255,255,.08);margin-top:12px;overflow:hidden}
.up-bar i{display:block;height:100%;width:0;background:var(--ink);transition:width .2s}
.up-msg{min-height:1.2em}
.up code{font-size:.62rem;color:var(--dim);word-break:break-all}

/* ============================================================
   后台「大文件分片上传」控件（.cup）
   ------------------------------------------------------------
   与 .up（一次性上传）并列、观感同族：深色底 + 细边框 + 低饱和强调色。
   自绘、不用原生控件 —— <progress> / <input type=range> 在深色主题里
   会带系统外观（浅灰轨道 + 高亮色），与本设计系统完全不搭（见 §26 的取舍）。
   进度条沿用 .adm-prog 的形态（4px 细条），但这里要给"百分比 + 已传/总大小
   + 平均速度 + 分片计数"留位置，所以单独一组 .cup-* 类名。
   ============================================================ */
.cup{
  margin-top:18px;padding:16px 16px 14px;
  border:1px solid var(--line);
  background:linear-gradient(180deg,rgba(255,255,255,.016),rgba(255,255,255,0));
}
.cup-head{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.cup-title{font-size:.8rem;letter-spacing:.12em}
.cup-row{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.cup-seg{display:inline-flex;border:1px solid var(--line);background:rgba(255,255,255,.02)}
.cup-seg-btn{
  appearance:none;-webkit-appearance:none;
  background:none;border:0;border-right:1px solid var(--line);
  color:var(--dim);font:inherit;font-size:.66rem;letter-spacing:.06em;
  padding:8px 12px;cursor:pointer;transition:color .2s,background .2s;
  display:inline-flex;align-items:center;min-height:32px;
}
.cup-seg-btn:last-child{border-right:0}
.cup-seg-btn:hover{color:var(--ink);background:rgba(255,255,255,.04)}
.cup-seg-btn.on{color:var(--ink);background:rgba(255,255,255,.07)}
.cup-meta{margin-top:14px}
.cup-bar{height:4px;background:rgba(255,255,255,.08);overflow:hidden}
.cup-bar-fill{display:block;height:100%;width:0;background:#f0d6a8;transition:width .25s}
.cup-stat{
  display:flex;align-items:center;gap:14px;flex-wrap:wrap;
  margin:9px 0 12px;font-size:.64rem;color:var(--dim);
  font-variant-numeric:tabular-nums;letter-spacing:.04em;
}
.cup-stat .cup-pct{color:var(--ink);font-size:.78rem;letter-spacing:.08em}
.cup-state{margin:0 !important}
.cup-msg{min-height:1.2em}
.cup .btn.sm{width:auto}

/* 后台：ffmpeg 日志块 / 迁移日志 / 孤儿清理日志
   ⚠ 这里**故意不再** max-height + overflow:auto（原来是 280px 的独立滚动区）：
     页面上每条日志块都是"页面自己一条主滚动"之外的第二条纵向滚动条，
     手机上尤其难受（手指在日志里滚，滚到底页面不动，得先挪手指出来）。
     改成完整展开：内容本身是**日志尾**（storage_*_log_tail(12) 只取最后 12 行）
     与固定的 curl 示例，展开后页面只长几百像素，比"两个滚动条"划算得多；
     外面套 <details> 的地方仍然可以一键折叠。 */
.adm-log{
  margin-top:10px;padding:12px 14px;
  background:rgba(0,0,0,.4);border:1px solid var(--line);
  font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  font-size:.62rem;line-height:1.7;color:var(--dim);white-space:pre-wrap;word-break:break-all;
}

/* ---------- 后台：漫画页面批量上传与页面列表 ---------- */
.cmp-queue{list-style:none;margin:12px 0 0;padding:0;max-height:240px;overflow:auto}
.cmp-row{
  display:flex;align-items:center;gap:10px;padding:5px 0;
  font-size:.66rem;color:var(--dim);border-bottom:1px solid var(--line-soft);
}
.cmp-row-i{
  flex:0 0 26px;text-align:right;color:rgba(143,139,134,.6);
  font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
}
.cmp-row-n{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--ink)}
.cmp-row-s{flex:0 0 auto;letter-spacing:.06em}
.cmp-row-s.ok{color:#a8d8b1}
.cmp-row-s.err{color:#f0a49d}

.cmp-grid{
  display:grid;grid-template-columns:repeat(auto-fill,minmax(132px,1fr));
  gap:14px;margin-top:18px;
}
.cmp-item{
  margin:0;border:1px solid var(--line);background:rgba(255,255,255,.02);
  display:flex;flex-direction:column;
}
.cmp-item img{
  width:100%;aspect-ratio:3/4;object-fit:cover;display:block;
  background:#0d0d0f;border-bottom:1px solid var(--line-soft);
}
.cmp-item figcaption{display:flex;flex-direction:column;gap:2px;padding:7px 9px 4px}
.cmp-idx{font-size:.64rem;color:var(--ink);letter-spacing:.1em}
.cmp-item .adm-dim{font-size:.56rem}
.cmp-ops{
  display:flex;align-items:center;gap:10px;padding:4px 9px 9px;margin-top:auto;
}
.cmp-ops form{display:inline}
.cmp-ops .adm-link{font-size:.7rem;line-height:1}
.cmp-ops .adm-link[disabled]{opacity:.3;cursor:default}

@media(max-width:640px){
  /* ============================================================
     ⚠ 窄屏下 .adm-row 改纵向排列时的两个坑（用户反馈「上面的输入框和下面的
     输入框间隔特别大」就是这两个叠加的结果，实测 120–350px）：
       ① 字段上那些为**横排**写的 inline style="flex:1 1 220px" / "flex:0 0 260px"
          在 flex-direction:column 下 flex-basis 作用到的是**高度**：每个 .field
          被撑成一个 basis 那么高的空盒子，内容贴在顶上，剩下一大片空。
          → 必须用 !important 压掉 inline（作者样式里的 !important 优先于行内样式）。
       ② gap:14px 与 .field 自己的 margin-bottom:18px **同时生效** = 32px，
          而页面其它地方相邻字段只有 18px，观感不一致。
          → gap 归零，间距只由 margin 提供，全站统一 18px。
     这里用 !important 是**必须**的，不是偷懒：
       · 字段上的 inline style="flex:1 1 220px" / "margin-top:10px" 只有 !important 压得住；
       · §809 那一族的 .up-card .field{margin:0}（特异性 0,2,0）也为横排而写，
         它会把纵向间距整个抹平 —— 实测 /admin/home 的 5 张 up-card 里
         22 对相邻输入框间距是 **0px**（用 _probe-one.js 逐元素量出来的）。
     ============================================================ */
  .adm-row{flex-direction:column;gap:0}
  .adm-row > *{flex:0 0 auto !important;min-width:0;margin-bottom:0 !important}
  .adm-row > * + *{margin-top:18px !important}
  /* 末个字段补回下边距（与其它 .field 的 18px 对齐；.adm-row 的子元素都是 .field，
     这条只影响最后一个，不改变"字段之间"的间距） */
  .adm-row > .field:last-child{margin-bottom:18px !important}
  .adm-row .field{min-width:0}
  .adm-inline input[type=text],.adm-inline select{min-width:0;width:100%}
  /* 表格自身**不再**当横向滚动容器：它外面永远有 .adm-table-wrap（line 1409），
     两层 overflow-x:auto 会各画一条横向滚动条 —— 这就是"这里有两个滚动条"。
     保留 white-space:nowrap（窄屏不要压坏列），横向滚动交给 wrap 那**一条**。
     包裹用的 .adm-table-wrap 之外若还有裸表（历史上只出现在小说编辑页的章节表，
     已一并补上 wrap），下面的 :not() 分支保留旧行为兜底。 */
  .adm-table{white-space:nowrap}
  .adm-table-wrap .adm-table{display:table;overflow:visible}
  .adm-table:not(.adm-table-wrap .adm-table){display:block;overflow-x:auto}
}

/* ---------- 移动端 ---------- */
@media (max-width:640px){
  .auth-card{max-width:100%;padding:22px 18px}
  .auth-title{font-size:1.14rem}
  .nav-auth{font-size:.6rem;gap:10px}
  .auth-foot{flex-direction:column;gap:6px}
}

/* ============================================================
   共用浮层：登录提示框 / 内容详情框（首页与 /watch 共用）
   z-index：内容详情 275 < 提示框 280 < 自定义光标 300
   ------------------------------------------------------------
   ⚠ v47 删除了「视频播放器浮层」：`.player` / `.player-meta` / `.player-title` /
     `.player-sub` / `.player-note` / `.player-close` 这些规则只被
     views/partials/media-player.php 那一段标记使用，而那个 partial 与
     assets/js/player.js 全仓库 **0 处引用**（没有任何页面加载 / include），
     属死代码，已一并删除。`.player-box` 例外，见下面保留处的原因。
   ============================================================ */
body.locked{overflow:hidden}

.gate,.info{
  position:fixed;inset:0;display:flex;align-items:center;justify-content:center;padding:22px;
  -webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);
}
.gate[hidden],.info[hidden],.dlg[hidden]{display:none}

/* ---------- 站内弹窗（替代原生 confirm/alert） ---------- */
.dlg{
  position:fixed;inset:0;z-index:290;display:flex;align-items:center;justify-content:center;padding:22px;
  background:rgba(3,3,3,.82);
  -webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);
}
.dlg-box{
  width:100%;max-width:380px;background:#0a0a0a;border:1px solid rgba(255,255,255,.12);
  padding:24px 22px 20px;position:relative;
}
.dlg-box::before{
  content:"";position:absolute;left:0;top:0;height:1px;width:100%;
  background:linear-gradient(90deg,transparent,rgba(214,218,230,.28),transparent);
}
.dlg-title{
  font-family:"Noto Serif SC",serif;font-weight:400;font-size:.98rem;
  letter-spacing:.1em;color:var(--ink);margin-bottom:12px;
}
.dlg-text{font-size:.74rem;line-height:1.9;color:var(--dim);margin-bottom:20px;white-space:pre-line}
.dlg-actions{display:flex;gap:10px}
.dlg-btn{
  flex:1;padding:10px 14px;font:inherit;font-size:.68rem;letter-spacing:.18em;
  background:transparent;color:var(--ink);border:1px solid rgba(255,255,255,.16);
  cursor:pointer;transition:opacity .25s,border-color .25s,background .25s,color .25s;
}
.dlg-btn:hover{border-color:rgba(255,255,255,.34)}
.dlg-btn.primary{background:var(--ink);color:#0b0b0b;border-color:var(--ink)}
.dlg-btn.primary:hover{opacity:.86}
.dlg-btn.primary.danger{background:#e2685f;border-color:#e2685f;color:#120404}
.dlg-btn.primary.danger:hover{opacity:.88}

/* ---------- 站内轻提示（右下角浮出） ---------- */
.toast{
  position:fixed;right:22px;bottom:26px;z-index:295;max-width:min(360px,86vw);
  background:#0a0a0a;border:1px solid rgba(255,255,255,.16);
  color:var(--ink);font-size:.72rem;letter-spacing:.04em;line-height:1.7;
  padding:12px 16px;box-shadow:0 10px 30px rgba(0,0,0,.5);
}
.toast[hidden]{display:none}
.gate{z-index:280;background:rgba(3,3,3,.84)}
.info{z-index:275;background:rgba(3,3,3,.9)}

.gate-box{
  width:100%;max-width:420px;text-align:center;
  border:1px solid rgba(255,255,255,.12);background:#0a0a0a;
  padding:32px 26px;position:relative;
}
.gate-box::before{
  content:"";position:absolute;left:0;top:0;height:1px;width:100%;
  background:linear-gradient(90deg,transparent,rgba(214,218,230,.28),transparent);
}
.gate-tag{font-size:.54rem;letter-spacing:.34em;text-transform:uppercase;color:var(--dim)}
.gate-title{font-size:1.06rem;font-weight:300;letter-spacing:.12em;margin:14px 0 12px;color:var(--ink)}
.gate-sub{font-size:.72rem;line-height:1.9;color:var(--dim);margin-bottom:24px}
.gate-actions{display:flex;gap:12px}
.gate-btn{
  flex:1;display:inline-flex;align-items:center;justify-content:center;
  padding:12px 16px;font:inherit;font-size:.7rem;letter-spacing:.2em;text-transform:uppercase;
  border:1px solid rgba(255,255,255,.16);background:transparent;color:var(--ink);
  cursor:pointer;transition:opacity .3s,border-color .3s,background .3s;text-decoration:none;
}
.gate-btn:hover{border-color:rgba(255,255,255,.34)}
.gate-btn.primary{background:var(--ink);color:#0b0b0b;border-color:var(--ink)}
.gate-btn.primary:hover{opacity:.86}

/* ⚠ .player-box —— **保留**，不是漏删：
   assets/js/player-ui.js:44 与 assets/js/watch-watermark.js:45 都在用
   `v.closest('.player-box') || v.closest('.stage-frame') || v.parentNode`
   这条「全屏/覆盖层挂哪个容器」的回退链（两文件都在 /watch 上真实加载），
   另外 storage/dev-tests/wm-canvas-cdp.js、wm-fullscreen-cdp.js 两个真机探针
   也会自己造一个 .player-box 来验水印挂载。所以它仍被在用代码引用 → 保留。
   只被已删除的 media-player.php 使用的 .player-* 子规则已删除（见上方说明）。 */
.player-box{width:100%;max-width:1000px;position:relative}
.player-box video{
  width:100%;max-height:70vh;display:block;
  background:#000;border:1px solid var(--line);outline:none;
}

/* 漫画/内容详情浮层 */
.info-box{
  width:100%;max-width:640px;border:1px solid rgba(255,255,255,.12);background:#0a0a0a;
  padding:26px;position:relative;
}
.info-body{display:flex;gap:22px}
.ci-cover{
  width:132px;flex:0 0 132px;aspect-ratio:3/4;background:#0d0d0f center/cover no-repeat;
  border:1px solid var(--line);
}
.ci-cover.empty{background-image:linear-gradient(160deg,#16161c,#0a0a0c)}
.ci-main{min-width:0;flex:1}
.ci-title{font-family:"Noto Serif SC",serif;font-weight:400;font-size:1.1rem;letter-spacing:.1em;margin:14px 0 10px;color:var(--ink)}
.ci-meta{font-size:.66rem;color:var(--dim);letter-spacing:.08em;line-height:1.8}
.ci-summary{font-size:.74rem;color:var(--dim);line-height:1.9;margin-top:12px}
.ci-price{font-size:.7rem;color:var(--ink);margin-top:12px;letter-spacing:.08em}
.ci-close{
  position:absolute;right:12px;top:12px;width:30px;height:30px;border-radius:50%;
  background:none;border:1px solid rgba(255,255,255,.22);color:var(--ink);
  cursor:pointer;font-size:.76rem;line-height:1;
}
.ci-close:hover{border-color:rgba(255,255,255,.5)}

/* ============================================================
   观看页：左边窗口 + 右边信息流（视频网站式布局）
   ============================================================ */
.tabs{
  display:flex;align-items:center;gap:8px;flex-wrap:wrap;
  margin:22px 0 20px;padding-bottom:14px;border-bottom:1px solid var(--line-soft);
}
.tabs .tab{
  background:none;border:1px solid transparent;color:var(--dim);
  font:inherit;font-size:.7rem;letter-spacing:.2em;text-transform:uppercase;
  padding:9px 16px;cursor:pointer;transition:color .3s,border-color .3s,background .3s;
}
.tabs .tab:hover{color:var(--ink)}
.tabs .tab.on{color:var(--ink);border-color:var(--line);background:rgba(255,255,255,.03)}
.tabs-info{margin-left:auto;font-size:.6rem;color:var(--dim);letter-spacing:.12em}

.watch-wrap{display:grid;grid-template-columns:minmax(0,1fr) 366px;gap:24px;align-items:start}
/* 左栏：窗口 + 评论区（评论区要跟着内容走，所以和 .stage 同一个 grid 单元格里上下排） */
.watch-main{display:flex;flex-direction:column;gap:22px;min-width:0}

/* ---------- 评论区（观看页左栏，窗口下方）----------
   设计：和窗口同一套语言（细边框、深底、.seg 分段控件、.btn 尺寸），
   回复缩进一层但**不再嵌套**（回复的回复仍挂同一个顶层评论，避免越缩越窄）。 */
.cmt{border:1px solid var(--line);background:rgba(255,255,255,.02);padding:18px 20px 20px;min-width:0}
.cmt-head{display:flex;align-items:center;justify-content:space-between;gap:14px;flex-wrap:wrap;margin-bottom:14px}
.cmt-title{margin:0;font-size:.9rem;font-weight:400;letter-spacing:.1em;display:flex;align-items:center;gap:9px}
.cmt-count{
  font-size:.62rem;color:var(--dim);letter-spacing:.06em;
  border:1px solid var(--line);padding:2px 8px;border-radius:999px;
}
.cmt-notice{
  margin:0 0 12px;padding:9px 12px;font-size:.66rem;letter-spacing:.04em;
  border:1px solid var(--line);background:rgba(255,255,255,.03);color:var(--ink);
}
.cmt-notice.err{border-color:rgba(240,164,157,.34);color:#f0a49d}
.cmt-notice.ok{border-color:rgba(127,192,138,.34);color:#a8d8b1}

/* 输入区 */
.cmt-editor{margin-bottom:18px}
.cmt-editor textarea{
  width:100%;box-sizing:border-box;min-height:84px;resize:vertical;
  background:rgba(255,255,255,.03);border:1px solid var(--line);color:var(--ink);
  font:inherit;font-size:.74rem;line-height:1.7;letter-spacing:.02em;padding:11px 13px;
  transition:border-color .3s,background .3s;
}
.cmt-editor textarea:focus{outline:none;border-color:rgba(255,255,255,.22);background:rgba(255,255,255,.05)}
.cmt-editor textarea::placeholder{color:rgba(143,139,134,.55)}
.cmt-editor-bar{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:9px}
.cmt-tip{font-size:.6rem;color:var(--dim);letter-spacing:.06em}
.cmt-tip.err{color:#f0a49d}
.cmt-editor-inline{margin:12px 0 4px;padding:12px;border:1px solid var(--line-soft);background:rgba(255,255,255,.015)}
.cmt-editor-inline textarea{min-height:60px}

/* 不能发言时的提示条 */
.cmt-gate{
  display:flex;align-items:center;justify-content:space-between;gap:14px;flex-wrap:wrap;
  margin-bottom:18px;padding:13px 15px;border:1px solid var(--line);
  background:rgba(255,255,255,.02);
}
.cmt-gate-hint{margin:0;font-size:.68rem;color:var(--dim);letter-spacing:.04em}

/* 列表 */
.cmt-list{display:flex;flex-direction:column;gap:2px}
.cmt-empty{padding:22px 0;text-align:center;font-size:.68rem;color:var(--dim);letter-spacing:.06em}
.cmt-item{padding:14px 0;border-top:1px solid var(--line-soft)}
.cmt-item:first-child{border-top:0}
.cmt-top{display:flex;gap:10px;align-items:flex-start}
.cmt-av{width:30px;height:30px;flex:0 0 auto;object-fit:cover;border:1px solid var(--line);background:rgba(255,255,255,.04);display:block}
.cmt-av-letter{
  display:flex;align-items:center;justify-content:center;
  font-size:.72rem;color:var(--dim);letter-spacing:0;
}
.cmt-who{display:flex;align-items:center;gap:8px;flex-wrap:wrap;min-width:0}
.cmt-name{font-size:.72rem;color:var(--ink);letter-spacing:.06em}
.cmt-badge{
  font-size:.56rem;letter-spacing:.08em;color:var(--dim);
  border:1px solid var(--line);padding:1px 6px;border-radius:999px;
}
.cmt-badge.warn{border-color:rgba(240,214,168,.34);color:#f0d6a8}
.cmt-at{font-size:.6rem;color:var(--dim);letter-spacing:.04em}
.cmt-time{font-size:.6rem;color:var(--dim);letter-spacing:.04em;margin-left:auto}
.cmt-body{
  margin:9px 0 0 40px;font-size:.74rem;line-height:1.85;color:var(--ink);
  letter-spacing:.02em;white-space:pre-wrap;word-break:break-word;
}
.cmt-ops{display:flex;align-items:center;gap:16px;margin:9px 0 0 40px}
.cmt-op{
  background:none;border:0;padding:0;cursor:pointer;
  font:inherit;font-size:.62rem;color:var(--dim);letter-spacing:.08em;
  transition:color .2s;
}
.cmt-op:hover{color:var(--ink)}
.cmt-op.on{color:#f0a49d}
.cmt-op.danger:hover{color:#f0a49d}
.cmt-op[disabled]{opacity:.5;cursor:default}
.cmt-replies{margin-left:40px}
.cmt-reply{padding:11px 0 0;border-top:1px dashed var(--line-soft);margin-top:11px}
.cmt-reply .cmt-av{width:24px;height:24px}
.cmt-reply .cmt-body,.cmt-reply .cmt-ops{margin-left:34px}
.cmt-item-dead .cmt-dead{
  margin-left:40px;font-size:.68rem;color:var(--dim);font-style:italic;letter-spacing:.06em;
}
.cmt-more-reply{
  display:block;margin:12px 0 2px;background:none;border:0;padding:0;
  color:var(--dim);font:inherit;font-size:.62rem;letter-spacing:.08em;cursor:pointer;
}
.cmt-more-reply:hover{color:var(--ink)}
.cmt-more{margin-top:16px}
/* 后台「首页装修」：每个可重复槽位一张小卡（轮播图 / 线下卡片），带预览缩略图 */
.up-card{
  border:1px solid var(--line-soft);background:rgba(255,255,255,.015);
  padding:14px 16px 16px;margin-bottom:12px;
}
.up-card-head{display:flex;align-items:center;gap:12px;margin-bottom:12px}
.up-card .field{margin:0}
.up-card .field label{display:block;margin-bottom:6px}
.up-thumb{
  flex:0 0 132px;height:74px;border:1px solid var(--line);background:rgba(255,255,255,.02);
  display:flex;align-items:center;justify-content:center;overflow:hidden;
}
.up-thumb img{width:100%;height:100%;object-fit:cover;display:block}
/* 后台评论列表里的正文：保留换行、限宽，长评论不把表格撑爆 */
.cmt-admin-body{
  white-space:pre-wrap;word-break:break-word;max-width:420px;
  font-size:.7rem;line-height:1.7;letter-spacing:.02em;
}

/* ---------- 左：窗口 ---------- */
.stage{border:1px solid var(--line);background:rgba(255,255,255,.02);min-width:0}
.stage-frame{
  position:relative;aspect-ratio:16/9;background:#000;overflow:hidden;
  display:flex;align-items:center;justify-content:center;
}
.stage-frame video{width:100%;height:100%;display:block;background:#000;outline:none}
/* 版权内容：长按/选中/拖拽都不给"保存"的机会（配合 controlslist=nodownload 与右键屏蔽） */
.stage-frame video,.player-box video{
  -webkit-touch-callout:none;
  -webkit-user-select:none;user-select:none;
  -webkit-user-drag:none;
}
.stage-poster{
  position:absolute;inset:0;background:#0d0d0f center/cover no-repeat;
  filter:brightness(.42) saturate(.9);
}
.stage-poster-empty{background-image:linear-gradient(160deg,#16161c,#0a0a0c)}
.stage-lock{position:relative;text-align:center;padding:26px 22px;max-width:520px}
.stage-lock-title{
  font-family:"Noto Serif SC",serif;font-weight:400;font-size:1.2rem;
  letter-spacing:.1em;color:var(--ink);margin:14px 0 12px;
}
.stage-lock-sub{font-size:.72rem;line-height:1.9;color:var(--dim);margin-bottom:22px}
.stage-comic-note{
  position:relative;font-size:.72rem;letter-spacing:.08em;color:var(--ink);
  background:rgba(5,5,5,.72);border:1px solid rgba(255,255,255,.18);padding:10px 16px;
}

/* ---------- 漫画阅读器（窗口内翻页 / 滚动） ---------- */
.stage-frame-comic{aspect-ratio:4/5;align-items:stretch;background:#08080a}
.crd{position:relative;flex:1;display:flex;flex-direction:column;min-width:0;min-height:0}
.crd-stage{
  flex:1;min-height:0;overflow:auto;display:flex;justify-content:center;align-items:flex-start;
  background:#08080a;
}
.crd-stage img{
  display:block;max-width:100%;height:auto;cursor:pointer;
  background:#101014;
}
/* 整页可见：整张图缩进窗口里（不滚动） */
.crd.fit-h .crd-stage{align-items:center;overflow:hidden}
.crd.fit-h .crd-stage img{max-height:100%;width:auto;max-width:100%;object-fit:contain}
/* 连续滚动：所有页铺开 */
.crd-scroll{display:block;padding:0}
.crd-scroll img{width:100%;max-width:100%;height:auto;display:block;border-bottom:1px solid #000;cursor:default}

.crd-nav{
  position:absolute;top:50%;transform:translateY(-50%);
  width:46px;height:78px;display:flex;align-items:center;justify-content:center;
  background:rgba(5,5,5,.5);border:1px solid rgba(255,255,255,.12);color:var(--ink);
  font-size:1.5rem;line-height:1;cursor:pointer;transition:background .25s,border-color .25s,opacity .25s;
}
.crd-nav:hover{background:rgba(5,5,5,.82);border-color:rgba(255,255,255,.32)}
.crd-nav[disabled]{opacity:.22;cursor:default}
.crd-nav.prev{left:10px}
.crd-nav.next{right:10px}

.crd-bar{
  display:flex;align-items:center;gap:14px;padding:9px 16px;
  background:rgba(5,5,5,.88);border-top:1px solid var(--line-soft);
}
.crd-btn{
  background:none;border:1px solid var(--line);color:var(--dim);font:inherit;
  font-size:.62rem;letter-spacing:.12em;padding:5px 11px;cursor:pointer;white-space:nowrap;
  transition:color .25s,border-color .25s;
}
.crd-btn:hover{color:var(--ink);border-color:rgba(255,255,255,.3)}
.crd-pos{font-size:.64rem;color:var(--dim);letter-spacing:.08em;white-space:nowrap}
.crd-pos b{color:var(--ink);font-weight:400}
.crd-range{flex:1;min-width:60px;accent-color:#f2f0ec;height:3px}
.crd-hint{
  position:absolute;left:50%;top:14px;transform:translateX(-50%);
  background:rgba(5,5,5,.86);border:1px solid rgba(255,255,255,.16);
  padding:6px 14px;font-size:.64rem;letter-spacing:.08em;color:var(--ink);white-space:nowrap;
}

/* ---------- 阅读器全屏（漫画 / 小说共用） ---------- */
/* 说明：全屏元素由浏览器 UA 样式铺满视口（position:fixed;inset:0），这里只补必要的尺寸与底色，
   并处理"窗口内的固定高/窄宽度"在满屏时应该放开的问题。 */
.crd:fullscreen,
.crd:-webkit-full-screen{
  width:100vw;height:100vh;background:#050505;
}
.crd:fullscreen .crd-stage,
.crd:-webkit-full-screen .crd-stage{background:#050505}
.crd:fullscreen .crd-bar,
.crd:-webkit-full-screen .crd-bar{
  background:rgba(5,5,5,.92);padding:12px 22px;border-top-color:rgba(255,255,255,.12);
}
.crd:fullscreen .crd-btn,
.crd:-webkit-full-screen .crd-btn{padding:7px 14px}
/* 满屏滚动模式下别把图拉满一整块 2K 屏，居中限宽更好读 */
.crd:fullscreen .crd-scroll img,
.crd:-webkit-full-screen .crd-scroll img{max-width:min(100%,1100px);margin:0 auto}
.crd:fullscreen .crd-nav,
.crd:-webkit-full-screen .crd-nav{width:58px;height:104px;font-size:1.8rem}

.stage-frame-reader:fullscreen,
.stage-frame-reader:-webkit-full-screen{
  display:flex;flex-direction:column;width:100vw;height:100vh;background:#08080a;
}
.stage-frame-reader:fullscreen .stage-reader,
.stage-frame-reader:-webkit-full-screen .stage-reader{
  max-height:none;flex:1;padding:36px clamp(24px,8vw,140px) 60px;
}
.stage-frame-reader:fullscreen .reader-tools,
.stage-frame-reader:-webkit-full-screen .reader-tools{background:rgba(5,5,5,.92)}
.crd-btn.on, .reader-btn.on{color:var(--ink);border-color:rgba(255,255,255,.42)}
.stage-frame-reader{aspect-ratio:auto;align-items:stretch;background:rgba(255,255,255,.02);display:block}
.reader-tools{
  display:flex;align-items:center;gap:10px;padding:10px 16px;
  border-bottom:1px solid var(--line-soft);background:rgba(255,255,255,.02);
}
.reader-label{font-size:.58rem;letter-spacing:.2em;text-transform:uppercase;color:var(--dim)}
.reader-btn{
  background:none;border:1px solid var(--line);color:var(--ink);font:inherit;
  font-size:.64rem;letter-spacing:.1em;padding:5px 10px;cursor:pointer;text-decoration:none;
}
.reader-btn:hover{border-color:rgba(255,255,255,.3)}
.reader-fs{font-size:.64rem;color:var(--dim);min-width:1.6em;text-align:center}
.stage-reader{
  max-height:min(68vh,700px);overflow:auto;padding:28px clamp(18px,4vw,44px);
  font-family:"Noto Serif SC",serif;line-height:2.05;color:var(--ink);
}
.stage-reader p{margin:0 0 1.15em;text-indent:2em}
.stage-reader .reader-h{
  font-size:1.02em;font-weight:400;letter-spacing:.12em;margin:1.6em 0 1em;
  padding-left:12px;border-left:2px solid var(--line);text-indent:0;
}

.stage-info{padding:18px 20px 20px;border-top:1px solid var(--line-soft)}
.stage-title{
  font-family:"Noto Serif SC",serif;font-weight:400;font-size:1.16rem;
  letter-spacing:.06em;line-height:1.5;color:var(--ink);
}
.stage-sub{font-size:.66rem;color:var(--dim);letter-spacing:.06em;margin-top:8px}
.stage-bar{display:flex;align-items:center;gap:16px;flex-wrap:wrap;margin-top:14px}
.stage-views,.stage-price{font-size:.68rem;color:var(--dim);letter-spacing:.06em}
.stage-like{
  background:none;border:1px solid var(--line);color:var(--dim);font:inherit;
  font-size:.68rem;letter-spacing:.08em;padding:6px 14px;cursor:pointer;transition:color .25s,border-color .25s;
}
.stage-like:hover{color:#f0a49d;border-color:rgba(240,164,157,.45)}
.stage-like.on{color:#e2685f;border-color:rgba(226,104,95,.5)}
.stage-like:disabled{opacity:.6;cursor:default}
.stage-price{margin-left:auto}
.stage-desc{font-size:.72rem;color:var(--dim);line-height:1.9;margin-top:12px}
.stage-note{margin-top:10px}

/* 收藏按钮（私有清单，与公开的点赞区分） */
.stage-fav{
  background:none;border:1px solid var(--line);color:var(--dim);font:inherit;
  font-size:.68rem;letter-spacing:.08em;padding:6px 14px;cursor:pointer;
  transition:color .25s,border-color .25s;
}
.stage-fav:hover{color:#f2e2a8;border-color:rgba(242,226,168,.45)}
.stage-fav.on{color:#e8cf74;border-color:rgba(232,207,116,.5)}
.stage-fav:disabled{opacity:.6;cursor:default}

/* 侧栏里的「继续观看」（紧凑竖向列表，不挤窗口） */
.resume{border-bottom:1px solid var(--line-soft);background:rgba(255,255,255,.015)}
.resume-head{
  display:flex;align-items:center;gap:10px;padding:11px 14px 8px;
}
.resume-head strong{font-size:.68rem;font-weight:400;letter-spacing:.14em;color:var(--ink)}
.resume-more,.resume-clear{
  background:none;border:0;color:var(--dim);font:inherit;
  font-size:.58rem;letter-spacing:.1em;cursor:pointer;padding:0;
}
.resume-more{margin-left:auto}
.resume-more:hover{color:var(--ink)}
.resume-clear:hover{color:#f0a49d}
.resume-clear:disabled,.resume-more:disabled{opacity:.5;cursor:default}
.resume-list{padding:0 8px 10px;max-height:212px;overflow:auto}
.resume-item{
  display:grid;grid-template-columns:74px minmax(0,1fr);gap:10px;align-items:center;
  padding:6px 6px;text-decoration:none;border-radius:2px;
  transition:background .25s;
}
.resume-item:hover{background:rgba(255,255,255,.05)}
.resume-thumb{aspect-ratio:16/10;background:#0d0d0f center/cover no-repeat;border:1px solid var(--line);overflow:hidden}
.resume-thumb img{width:100%;height:100%;object-fit:cover;display:block}
.resume-thumb-empty{background-image:linear-gradient(160deg,#16161c,#0a0a0c)}
.resume-body{min-width:0}
.resume-title{
  font-size:.68rem;line-height:1.45;color:var(--ink);
  display:-webkit-box;-webkit-line-clamp:1;-webkit-box-orient:vertical;overflow:hidden;
}
.resume-meta{font-size:.58rem;color:var(--dim);margin-top:4px;letter-spacing:.05em}
.resume-bar{height:2px;background:rgba(255,255,255,.1);margin-top:5px;overflow:hidden}
.resume-bar i{display:block;height:100%;background:var(--ink);opacity:.7}

/* 观看页标签行里的搜索入口 */
.tab-search{
  margin-left:auto;font-size:.64rem;letter-spacing:.16em;color:var(--dim);
  text-decoration:none;border:1px solid var(--line);padding:8px 14px;
  transition:color .25s,border-color .25s;
}
.tab-search:hover{color:var(--ink);border-color:rgba(255,255,255,.3)}

/* ---------- 搜索页 ---------- */
.search-form{display:flex;gap:12px;align-items:stretch;margin:18px 0 24px;flex-wrap:wrap}
.search-form input[type=search]{
  flex:1;min-width:220px;background:rgba(255,255,255,.03);border:1px solid var(--line);
  color:var(--ink);padding:12px 14px;font:inherit;font-size:.86rem;letter-spacing:.04em;
}
.search-form input[type=search]:focus{outline:none;border-color:rgba(255,255,255,.22);background:rgba(255,255,255,.05)}
.search-form select{width:auto;min-width:110px}
.search-head{margin-bottom:18px}
.search-group{margin:26px 0 0}
.search-group .dash-title{margin-bottom:14px}
.search-empty{border:1px dashed var(--line);padding:34px 20px;text-align:center;margin-top:10px}

/* 搜索结果列表：紧凑、对齐的行式列表（v2026-09-15 排版修复）
   ⚠ 起因：结果卡片用的是观看页 v17 卡片网格时代的类名（`.watch-grid` / `.w-card` / `.w-cover` /
     `.w-body` / `.w-title` / `.w-meta` / `.w-foot`）—— v18 观看页改成"窗口 + 信息流"后，
     **整组定义在 CSS 里都不存在了**，只剩第 ~1100 行那条孤立的 `.w-cover img{width:100%;height:100%}`。
     于是封面 `<img>` 的百分比高度因为父元素没有高度而退化成 auto，宽度铺满 980px 容器 →
     竖版漫画封面（270×480）被等比撑成 **980×1742**，一条结果就占两屏（实测行高 1828px）。
   ⚠ 这些类名只有 `assets/js/search.js` 在用（`/watch` 已不用），所以这里定义是安全的。 */
.watch-grid{display:flex;flex-direction:column;gap:10px}
.w-card{
  display:grid;grid-template-columns:84px minmax(0,1fr);gap:14px;align-items:center;
  padding:10px 12px;border:1px solid var(--line-soft);background:rgba(255,255,255,.02);
  text-decoration:none;color:inherit;transition:background .25s,border-color .25s;
}
.w-card:hover{background:rgba(255,255,255,.05);border-color:rgba(255,255,255,.22)}
.w-card:focus-visible{outline:1px solid rgba(255,255,255,.35);outline-offset:2px}
/* 封面统一框：高度 112px、宽 84px（3:4），配合既有的 `.w-cover img{object-fit:cover}` 裁切不拉伸；
   没有封面的条目也占同样大小的空框，所以三类内容的行高一致、行距统一 */
.w-cover{width:84px;height:112px;overflow:hidden;border:1px solid var(--line);background:#0d0d0f center/cover no-repeat}
.w-cover-empty{background-image:linear-gradient(160deg,#16161c,#0a0a0c)}
.w-body{min-width:0;display:flex;flex-direction:column;gap:6px}
.w-title{
  font-size:.82rem;font-weight:300;line-height:1.5;letter-spacing:.06em;color:var(--ink);
  overflow-wrap:anywhere;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;
}
.w-meta{font-size:.62rem;line-height:1.6;letter-spacing:.04em;color:var(--dim);overflow-wrap:anywhere}
.w-foot{display:flex;align-items:center;justify-content:space-between;gap:10px;font-size:.62rem;letter-spacing:.06em}
.w-views{color:var(--dim);white-space:nowrap}
.w-act{
  color:var(--ink);border:1px solid rgba(255,255,255,.22);
  padding:2px 8px;white-space:nowrap;background:rgba(5,5,5,.6);
}
@media (max-width:640px){
  .w-card{grid-template-columns:72px minmax(0,1fr);gap:12px;padding:9px 10px}
  .w-cover{width:72px;height:96px}
}

/* ---------- 个人中心：收藏 / 最近观看 ---------- */
.dash-count{font-size:.66rem;color:var(--dim);letter-spacing:.06em}
.acct-cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(196px,1fr));gap:14px}
.acct-card{position:relative;border:1px solid var(--line);background:rgba(255,255,255,.02)}
.acct-card-link{display:block;text-decoration:none}
.acct-thumb{aspect-ratio:16/10;background:#0d0d0f center/cover no-repeat;overflow:hidden}
.acct-thumb img{width:100%;height:100%;object-fit:cover;display:block}
.acct-thumb-empty{background-image:linear-gradient(160deg,#16161c,#0a0a0c)}
.acct-body{padding:9px 11px 11px}
.acct-title{
  font-size:.72rem;line-height:1.5;color:var(--ink);
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;
}
.acct-meta{font-size:.6rem;color:var(--dim);margin-top:6px;letter-spacing:.06em}
.acct-remove{
  position:absolute;right:6px;top:6px;width:24px;height:24px;border-radius:50%;
  background:rgba(5,5,5,.75);border:1px solid rgba(255,255,255,.2);color:var(--ink);
  font-size:.62rem;line-height:1;cursor:pointer;
}
.acct-remove:hover{border-color:rgba(240,164,157,.6);color:#f0a49d}
.acct-remove:disabled{opacity:.5;cursor:default}

/* ---------- 右：信息流 ---------- */
.feed{
  border:1px solid var(--line);background:rgba(255,255,255,.02);
  display:flex;flex-direction:column;
  max-height:calc(100vh - 132px);position:sticky;top:96px;
}
.feed-head{
  display:flex;align-items:center;gap:10px;flex-wrap:wrap;padding:12px 14px;
  border-bottom:1px solid var(--line-soft);
}
.feed-head strong{font-size:.7rem;font-weight:400;letter-spacing:.12em;color:var(--ink)}

/* 分段控件（信息流排序 / 其它单选式切换）：比原生 select 好看，也不受系统外观影响 */
.seg{display:inline-flex;margin-left:auto;border:1px solid var(--line)}
.seg-btn{
  background:none;border:0;border-left:1px solid var(--line-soft);
  color:var(--dim);font:inherit;font-size:.6rem;letter-spacing:.14em;
  padding:6px 11px;cursor:pointer;transition:color .25s,background .25s;
}
.seg-btn:first-child{border-left:0}
.seg-btn:hover{color:var(--ink);background:rgba(255,255,255,.04)}
.seg-btn.on{color:var(--ink);background:rgba(255,255,255,.09)}
.seg-btn:focus-visible{outline:1px solid rgba(255,255,255,.35);outline-offset:-2px}
.feed-list{overflow:auto;flex:1;min-height:0}
.feed-item{
  display:grid;grid-template-columns:128px minmax(0,1fr);gap:12px;
  padding:10px 12px;cursor:pointer;border-bottom:1px solid var(--line-soft);
  transition:background .25s,box-shadow .25s;
}
.feed-item:hover{background:rgba(255,255,255,.045)}
.feed-item.on{background:rgba(255,255,255,.07);box-shadow:inset 2px 0 0 var(--ink)}
.feed-thumb{
  position:relative;aspect-ratio:16/9;background:#0d0d0f center/cover no-repeat;
  border:1px solid var(--line);overflow:hidden;
}
.feed-thumb img{width:100%;height:100%;object-fit:cover;display:block}
.w-cover img{width:100%;height:100%;object-fit:cover;display:block}
.resume-thumb img{width:100%;height:100%;object-fit:cover;display:block}
.feed-thumb-empty{background-image:linear-gradient(160deg,#16161c,#0a0a0c)}
.feed-thumb .dur{
  position:absolute;right:5px;bottom:5px;font-size:.56rem;letter-spacing:.04em;
  background:rgba(0,0,0,.74);color:#f2f0ec;padding:1px 5px;
}
.feed-body{min-width:0;display:flex;flex-direction:column;gap:6px}
.feed-title{
  font-size:.76rem;line-height:1.5;color:var(--ink);
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;
}
.feed-item.on .feed-title{opacity:1}
.feed-meta{font-size:.6rem;color:var(--dim);letter-spacing:.04em}
.feed-soon{
  align-self:flex-start;font-size:.56rem;letter-spacing:.14em;color:var(--dim);
  border:1px solid var(--line);padding:1px 6px;
}

/* 内容卡片上的价格徽标（首页视频卡片另有更细的样式） */
.price-badge{
  display:inline-block;font-size:.62rem;letter-spacing:.12em;color:var(--ink);
  border:1px solid rgba(255,255,255,.22);padding:2px 8px;white-space:nowrap;background:rgba(5,5,5,.6);
}
.price-badge.free{border-color:rgba(127,192,138,.45);color:#a8d8b1}
.price-badge .old{opacity:.45;text-decoration:line-through;margin-left:6px;font-style:normal}

/* ---------- 付费：购买窗口（观看页） ---------- */
.pay-price{display:flex;align-items:baseline;justify-content:center;gap:10px;margin:4px 0 6px}
.pay-old{font-size:.72rem;color:var(--dim);text-decoration:line-through}
.pay-now{font-family:"Noto Serif SC",serif;font-weight:400;font-size:1.6rem;letter-spacing:.06em;color:var(--ink)}
.pay-off{
  font-size:.56rem;letter-spacing:.18em;text-transform:uppercase;color:#f0d6a8;
  border:1px solid rgba(240,214,168,.4);padding:2px 7px;
}
.pay-bal{font-size:.68rem;color:var(--dim);letter-spacing:.06em;margin-top:6px}
.pay-bal b{color:var(--ink);font-weight:400}
.pay-msg{margin-top:12px;font-size:.68rem;line-height:1.7;color:var(--dim)}
.stage-owned{
  font-size:.6rem;letter-spacing:.16em;text-transform:uppercase;color:#a8d8b9;
  border:1px solid rgba(168,216,185,.35);padding:3px 9px;
}

/* ---------- 个人中心：余额 / 充值 / 流水 / 订单 ---------- */
.wal-top{display:flex;flex-wrap:wrap;gap:18px;align-items:flex-end;justify-content:space-between}
.wal-balance{display:flex;flex-direction:column;gap:6px}
.wal-label{font-size:.58rem;letter-spacing:.2em;text-transform:uppercase;color:var(--dim)}
.wal-amount{font-family:"Noto Serif SC",serif;font-weight:400;font-size:2rem;letter-spacing:.04em;color:var(--ink);line-height:1}
.wal-presets{display:flex;flex-wrap:wrap;gap:8px}
.wal-chip{
  background:none;border:1px solid var(--line);color:var(--ink);font:inherit;
  font-size:.68rem;letter-spacing:.08em;padding:8px 14px;cursor:pointer;
  transition:border-color .25s,background .25s;
}
.wal-chip:hover{border-color:rgba(255,255,255,.34);background:rgba(255,255,255,.04)}
.wal-chip[disabled]{opacity:.4;cursor:default}
.wal-form{display:flex;gap:10px;align-items:flex-end;margin-top:12px;flex-wrap:wrap}
/* 自定义金额：复用站点统一的 .field 外观（深色底 / 细边框 / 聚焦光圈 / 去掉数字框上下箭头） */
.wal-form .field{flex:0 0 170px;margin:0}
.wal-form .btn{width:auto;padding:12px 26px}
.wal-note{font-size:.62rem;line-height:1.8;color:var(--dim);margin-top:10px}
.wal-table{width:100%;border-collapse:collapse;margin-top:12px}
.wal-table th{
  text-align:left;font-weight:400;font-size:.56rem;letter-spacing:.18em;text-transform:uppercase;
  color:var(--dim);padding:0 10px 8px 0;border-bottom:1px solid var(--line-soft);white-space:nowrap;
}
.wal-table td{
  font-size:.68rem;padding:9px 10px 9px 0;border-bottom:1px solid var(--line-soft);
  color:var(--ink);vertical-align:middle;
}
.wal-table td.dim{color:var(--dim)}
.wal-table .num{font-variant-numeric:tabular-nums;white-space:nowrap}
.wal-in{color:#a8d8b9}
.wal-out{color:#f0a49d}
.wal-tag{
  font-size:.56rem;letter-spacing:.14em;text-transform:uppercase;
  border:1px solid var(--line);padding:2px 7px;color:var(--dim);white-space:nowrap;
}
.wal-tag.ok{border-color:rgba(168,216,185,.4);color:#a8d8b9}
.wal-tag.warn{border-color:rgba(240,164,157,.4);color:#f0a49d}
.wal-more{margin-top:12px}
.wal-empty{font-size:.68rem;color:var(--dim);padding:12px 0}

/* ---------- 后台表格/行内的小表单（余额调整、退款原因） ----------
   刻意不复用 .field：这些控件在表格单元格或一行里，要的是紧凑尺寸；
   但**外观仍然是站点自己的**（深色底、细边框、聚焦光圈、统一占位色、数字框去箭头），
   不是浏览器原生的白底控件。 */
.mini-form{display:flex;flex-wrap:wrap;gap:6px;align-items:center;margin-top:6px}
.mini-form .w-amt{flex:0 0 78px}
.mini-form .w-sign{flex:0 0 76px}
.mini-form .w-why{flex:1 1 110px;min-width:96px}
.mini-form input[type=text],
.mini-form input[type=number]{
  width:100%;background:rgba(255,255,255,.03);border:1px solid var(--line);
  color:var(--ink);font:inherit;font-size:.64rem;letter-spacing:.02em;padding:5px 8px;
  transition:border-color .3s,background .3s;
}
/* 加/减选择框：与站点其它下拉一致（自绘箭头、深色底），只是尺寸收小 */
.mini-form select{
  appearance:none;-webkit-appearance:none;-moz-appearance:none;
  width:100%;cursor:pointer;
  background-color:rgba(255,255,255,.03);
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='11' height='7' viewBox='0 0 11 7'><path d='M1 1l4.5 4.5L10 1' fill='none' stroke='%238f8b86' stroke-width='1.5' stroke-linecap='round'/></svg>");
  background-repeat:no-repeat;background-position:right 7px center;
  border:1px solid var(--line);color:var(--ink);
  font:inherit;font-size:.64rem;letter-spacing:.02em;padding:5px 22px 5px 8px;
  transition:border-color .3s,background-color .3s;
}
.mini-form select:hover{background-color:rgba(255,255,255,.05)}
.mini-form select:focus{outline:none;border-color:rgba(255,255,255,.24);background-color:rgba(255,255,255,.05)}
.mini-form select option{background:#0a0a0a;color:var(--ink)}
.mini-form input[type=text]:focus,
.mini-form input[type=number]:focus{outline:none;border-color:rgba(255,255,255,.24);background:rgba(255,255,255,.05)}
.mini-form input::placeholder{color:rgba(143,139,134,.55)}
/* 数字框去掉系统上下箭头（与 .field 里保持一致） */
.mini-form input[type=number]{appearance:textfield;-moz-appearance:textfield}
.mini-form input[type=number]::-webkit-outer-spin-button,
.mini-form input[type=number]::-webkit-inner-spin-button{-webkit-appearance:none;appearance:none;margin:0}
.mini-form .check{margin:0;gap:6px;font-size:.6rem;letter-spacing:.06em}

/* ---------- 后台：订单列表 ---------- */
.ord-filters{display:flex;flex-wrap:wrap;gap:10px;align-items:flex-end;margin:14px 0 6px}
.ord-filters .field{flex:0 0 auto;min-width:130px;margin:0}
.ord-filters .field.grow{flex:1 1 200px}
.ord-sum{display:flex;flex-wrap:wrap;gap:26px;margin:8px 0 4px}
.ord-sum div{font-size:.62rem;letter-spacing:.1em;color:var(--dim)}
.ord-sum b{display:block;font-size:1.05rem;color:var(--ink);font-weight:400;margin-top:4px;letter-spacing:.02em}
.ord-table{width:100%;border-collapse:collapse;margin-top:10px;font-size:.68rem}
.ord-table th{
  text-align:left;font-weight:400;font-size:.56rem;letter-spacing:.16em;text-transform:uppercase;
  color:var(--dim);padding:0 10px 8px 0;border-bottom:1px solid var(--line-soft);white-space:nowrap;
}
.ord-table td{padding:9px 10px 9px 0;border-bottom:1px solid var(--line-soft);vertical-align:middle;color:var(--ink)}
.ord-no{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:.62rem;color:var(--dim)}
.ord-sub{font-size:.6rem;color:var(--dim);margin-top:3px}
.pager{display:flex;gap:12px;align-items:center;margin-top:16px;font-size:.66rem;color:var(--dim)}
.pager a{color:var(--ink);text-decoration:none;border-bottom:1px solid var(--line);padding-bottom:2px}
.pager a:hover{border-color:rgba(255,255,255,.4)}

@media(max-width:1100px){
  .watch-wrap{grid-template-columns:1fr;gap:18px}
  .feed{position:static;max-height:none}
  .feed-list{max-height:none}
}
@media(max-width:640px){
  .gate-actions{flex-direction:column}
  .gate-box{padding:26px 20px}
  .player-box video{max-height:48vh}
  .info{padding:14px}
  .info-box{padding:20px 16px;max-height:88vh;overflow:auto}
  .info-body{flex-direction:column;gap:16px}
  .ci-cover{width:100%;flex:0 0 auto;max-width:200px}
  .tabs .tab{padding:8px 12px;font-size:.64rem}
  .stage-info{padding:15px 14px 17px}
  .stage-reader{padding:20px 16px;max-height:60vh}
  .feed-item{grid-template-columns:104px minmax(0,1fr);gap:10px}
  .stage-frame-comic{aspect-ratio:3/4}
  .crd-nav{width:38px;height:60px;font-size:1.2rem}
  .crd-nav.prev{left:4px}
  .crd-nav.next{right:4px}
  .crd-bar{gap:9px;padding:8px 10px}
  .crd-btn{font-size:.58rem;padding:5px 8px;letter-spacing:.08em}
}

/* ============================================================
   支付相关：中间页 /pay/afdian/<单号> + 后台「支付设置」/admin/pay
   （这两处早先漏了样式，页签和回调地址框是裸的 —— 现在补齐）
   ============================================================ */

/* ---------- 中间页 ---------- */
.pay-mid{max-width:620px}
.pay-mid-box{
  border:1px solid var(--line);
  background:rgba(255,255,255,.02);
  padding:14px 18px;margin-top:16px;
}
.pay-mid-row{
  display:flex;align-items:center;gap:12px;
  padding:10px 0;border-bottom:1px solid var(--line);
  font-size:.74rem;letter-spacing:.03em;
}
.pay-mid-row:last-child{border-bottom:0;padding-bottom:2px}
.pay-mid-row .wal-label{flex:0 0 78px}
.pay-mid-no{
  flex:1;font-family:ui-monospace,Menlo,Consolas,monospace;
  font-size:.72rem;letter-spacing:.06em;color:var(--ink);
  word-break:break-all;
}
.pay-mid-count{
  font-family:"Noto Serif SC",serif;font-weight:400;
  font-size:2.4rem;line-height:1;color:var(--ink);
  margin:20px 0 6px;letter-spacing:.04em;
}
/* 到账成功块：**大字**、绿色描边，一眼看到 */
.pay-done{
  border:1px solid rgba(127,192,138,.34);
  background:linear-gradient(180deg,rgba(127,192,138,.09),rgba(127,192,138,.02));
  padding:22px 20px;margin-top:18px;text-align:center;
}
.pay-done .pd-icon{display:block;font-size:1.5rem;line-height:1}
.pay-done .pd-amt{
  display:block;margin:10px 0 8px;
  font-family:"Noto Serif SC",serif;font-weight:400;
  font-size:1.9rem;letter-spacing:.05em;color:#a8d8b1;
}
.pay-done .pd-sub{
  display:block;font-size:.7rem;color:var(--dim);letter-spacing:.04em;line-height:1.8;
}
.pay-done .pd-sub strong{color:var(--ink);font-weight:400}

/* ---------- 后台「支付设置」 ---------- */
.pay-tabs{
  display:flex;flex-wrap:wrap;gap:4px;
  border-bottom:1px solid var(--line);margin:4px 0 22px;
}
.pay-tab{
  display:inline-block;padding:11px 18px;margin-bottom:-1px;
  font-size:.68rem;letter-spacing:.12em;color:var(--dim);text-decoration:none;
  border:1px solid transparent;border-bottom:1px solid transparent;
  transition:color .2s,background .2s,border-color .2s;
}
.pay-tab:hover{color:var(--ink);background:rgba(255,255,255,.035)}
.pay-tab.on{
  color:var(--ink);background:rgba(255,255,255,.05);
  border-color:var(--line);border-bottom-color:transparent;
}
.pay-url{
  display:flex;align-items:center;gap:12px;
  border:1px solid var(--line);background:rgba(255,255,255,.03);
  padding:12px 14px;margin:10px 0 6px;
}
.pay-url code{
  flex:1;font-family:ui-monospace,Menlo,Consolas,monospace;
  font-size:.7rem;letter-spacing:.04em;color:var(--ink);word-break:break-all;
}
.wal-tag{
  display:inline-block;padding:2px 8px;border:1px solid var(--line);
  font-size:.58rem;letter-spacing:.1em;color:var(--dim);
}
.wal-tag.ok{border-color:rgba(127,192,138,.3);color:#a8d8b1}
.wal-tag.warn{border-color:rgba(240,164,157,.32);color:#f0a49d}

@media (max-width:560px){
  .pay-mid-row{flex-wrap:wrap;gap:6px}
  .pay-mid-row .wal-label{flex:0 0 100%}
  .pay-tab{padding:9px 12px;letter-spacing:.08em}
  .pay-done .pd-amt{font-size:1.6rem}
}

/* ============================================================
   后台「站点设置」：左（可改）/ 右（只读）两栏，把宽屏的空间用起来
   （早先整页套在登录页的 .auth-card 里，只有 620px，右边全空着）
   ============================================================ */
.set-grid{
  display:grid;
  grid-template-columns:minmax(0,1.5fr) minmax(300px,1fr);
  gap:20px;align-items:start;margin-top:4px;
}
.set-grid .dash-block{margin-bottom:20px}
.set-grid .dash-block:last-child{margin-bottom:0}
.set-side .dash-block{
  background:linear-gradient(180deg,rgba(255,255,255,.012),rgba(255,255,255,0));
}
.set-grid .dash-table td:first-child{width:96px}
.set-side code{word-break:break-all;font-size:.66rem}
.field-pair{display:grid;grid-template-columns:1fr 1fr;gap:0 20px}
.check-grid{display:grid;grid-template-columns:1fr 1fr;gap:0 24px}
.check-grid .check{margin:6px 0 14px}
.set-save{display:flex;align-items:center;gap:16px;flex-wrap:wrap;margin:16px 0 26px}
    /* .set-save 原来一条外边距都没有：上贴字段、下贴下一个板块。分开写便于单独调。 */
    .set-save .hint{margin:0}
.set-save .btn{width:auto;padding:13px 30px}

@media (max-width:1040px){
  .set-grid{grid-template-columns:1fr}
}
@media (max-width:700px){
  .field-pair,.check-grid{grid-template-columns:1fr}
}

/* ============================================================
   后台设计系统（整站后台统一观感）
   —— 早先 .adm-table 只有一条 select 规则、表格是裸 HTML，
      页面宽度也各写各的（900/980/1100/1240），这里统一。
   宽度约定：列表页 1240 · 编辑/详情页 1100 · 设置页 1180 · 概览 1100
   ============================================================ */

/* ---------- 数据表（videos / novels / comics / users / orders / pay / wallet 共用） ---------- */
.adm-table,.ord-table,.wal-table{
  width:100%;border-collapse:collapse;margin-top:12px;font-size:.72rem;
}
.adm-table th,.ord-table th,.wal-table th{
  padding:9px 10px;text-align:left;font-weight:400;
  font-size:.58rem;letter-spacing:.18em;text-transform:uppercase;color:var(--dim);
  border-bottom:1px solid var(--line);white-space:nowrap;
}
.adm-table td,.ord-table td,.wal-table td{
  padding:11px 10px;border-bottom:1px solid var(--line-soft);vertical-align:middle;
}
.adm-table tr:last-child td,.ord-table tr:last-child td,.wal-table tr:last-child td{border-bottom:0}
.adm-table tr:hover td,.ord-table tr:hover td,.wal-table tr:hover td{background:rgba(255,255,255,.028)}
.adm-table .num,.ord-table .num,.wal-table .num{text-align:right;font-variant-numeric:tabular-nums}
/* 表格宽了就在卡片里横向滚动，不要把别的列挤扁。
   ⚠ 必须显式写 overflow-y:hidden（用户反馈「这里有两个滚动条」的根因之一）：
     CSS 规定"一个轴不是 visible 时，另一个轴的 visible 会被算成 auto"，
     所以只写 overflow-x:auto 时，计算值其实是 overflow-y:auto ——
     表格一横向溢出，容器底下就被那条横向滚动条占掉几像素高度，
     scrollHeight 随即大于 clientHeight，于是**又冒出一条纵向滚动条**。
     这里把纵轴钉成 hidden：容器高度本来就是 auto（跟着表格长），
     钉死纵轴不会裁掉任何内容，却彻底去掉了那条多余的纵向滚动条。 */
.adm-table-wrap{overflow-x:auto;overflow-y:hidden;margin-top:12px;-webkit-overflow-scrolling:touch}
.adm-table-wrap .adm-table{margin-top:0;min-width:640px}

/* ---------- 空状态 ---------- */
.adm-empty{
  border:1px dashed var(--line);padding:28px 20px;margin-top:12px;text-align:center;
  color:var(--dim);font-size:.72rem;letter-spacing:.04em;line-height:1.9;
}
.adm-empty a{color:var(--ink);opacity:.85}

/* ---------- 状态胶囊 ---------- */
.adm-pill{
  display:inline-block;padding:2px 9px;border:1px solid var(--line);
  font-size:.6rem;letter-spacing:.1em;color:var(--dim);white-space:nowrap;
}
.adm-pill.ok{border-color:rgba(127,192,138,.34);color:#a8d8b1}
.adm-pill.warn{border-color:rgba(240,214,168,.34);color:#f0d6a8}
.adm-pill.off{border-color:rgba(255,255,255,.1);color:var(--dim);opacity:.8}
.adm-pill.bad{border-color:rgba(240,164,157,.34);color:#f0a49d}

/* ---------- 「已超时」派生徽章 ----------
   用在订单列表（后台 /admin/orders 与用户侧「我的订单」）：`status` 明明还是「待支付」，
   但 created_at 已经超过订单 TTL —— 不显示出来的话，管理员和用户都会以为"这单还能付款"
   （以前就是这样：倒计时只剩 0 分钟，按钮却照样能点）。
   口径与 app/orders.php 的 order_is_expired() 完全一致（展示层只读派生，不改库）。
   自绘、不用原生控件；配色沿用站点警示色的**低饱和红**，形状与 .wal-tag / .adm-pill 同族，
   小圆点参考 .proto-badge::before。 */
.ord-exp-badge{
  display:inline-flex;align-items:center;gap:5px;margin-left:6px;padding:2px 8px;
  border:1px solid rgba(240,164,157,.42);background:rgba(240,164,157,.06);
  color:#f0a49d;font-size:.56rem;letter-spacing:.12em;white-space:nowrap;vertical-align:middle;
}
.ord-exp-badge::before{
  content:'';width:4px;height:4px;border-radius:50%;background:#f0a49d;
  box-shadow:0 0 5px rgba(240,164,157,.75);
}

/* ---------- 工具条（搜索 / 筛选 / 批量操作） ---------- */
.adm-toolbar,.ord-filters{
  display:flex;flex-wrap:wrap;gap:10px;align-items:flex-end;
  margin:0 0 16px;padding:14px 16px;border:1px solid var(--line);background:rgba(255,255,255,.015);
}
.adm-toolbar .field,.ord-filters .field{margin-bottom:0;min-width:150px}
.adm-toolbar .grow,.ord-filters .grow{flex:1 1 220px}
.adm-toolbar .adm-actions{margin-left:auto;display:flex;gap:10px;align-items:center}

/* ---------- 按钮尺寸（替代到处写的 style="width:auto;padding:..."） ---------- */
.btn.sm{width:auto;padding:10px 20px;font-size:.72rem}
.btn.xs{width:auto;padding:7px 14px;font-size:.66rem;letter-spacing:.06em}
.btn.sm,.btn.xs{display:inline-block}

/* ---------- 页面级小件 ---------- */
.adm-ops{display:flex;gap:14px;align-items:center;flex-wrap:wrap}
.adm-kv{display:grid;grid-template-columns:auto 1fr;gap:9px 18px;font-size:.72rem;align-items:baseline}
.adm-kv dt{color:var(--dim);font-size:.6rem;letter-spacing:.18em;text-transform:uppercase}
.adm-kv dd{margin:0;word-break:break-all}
.adm-section-head{
  display:flex;align-items:flex-end;justify-content:space-between;gap:16px;flex-wrap:wrap;
  margin:4px 0 16px;
}
.adm-section-head .dash-title{margin:0}
.adm-section-head .dash-sub{margin:6px 0 0}

/* 卡片里的标题不要太靠上、块与块之间留够气口 */
.dash-block > .dash-title:first-child{margin-top:0}
.dash-block > .dash-sub:first-child{margin-top:0}
.dash-block .adm-table-wrap{margin-top:12px}

/* ---------- 表格里的批量勾选框（列表页）----------
   之前只给 .check input 写了自绘样式，表格里的勾选框是**原生外观**（很突兀）。
   这里统一成同一套视觉：深色底 + 细边框 + 手绘对勾；悬停/选中/半选/键盘聚焦都有态。 */
.bulkBox{
  appearance:none;-webkit-appearance:none;
  width:16px;height:16px;margin:0;padding:0;
  border:1px solid rgba(255,255,255,.22);
  background:rgba(255,255,255,.03);
  position:relative;cursor:pointer;vertical-align:middle;
  transition:border-color .2s,background .2s;
}
.bulkBox:hover{border-color:rgba(255,255,255,.42);background:rgba(255,255,255,.06)}
.bulkBox:checked{border-color:rgba(255,255,255,.5);background:rgba(255,255,255,.1)}
.bulkBox:checked::after{
  content:"";position:absolute;left:5px;top:1px;width:5px;height:9px;
  border-right:1.5px solid var(--ink);border-bottom:1.5px solid var(--ink);
  transform:rotate(45deg);
}
.bulkBox:focus-visible{outline:1px solid rgba(255,255,255,.4);outline-offset:2px}
/* .check 的勾选框与 .bulkBox 的**键盘焦点态**保持一致：
   Chrome 对 appearance:none 的 checkbox 只给 outline:auto（computed 是 1px rgb(16,16,16)，
   在深色底上又细又暗，且与 .bulkBox 的细白环明显不同），所以这里复用 .bulkBox:focus-visible
   的同一条声明，让两套自绘勾选框的 hover / 选中 / 半选 / 聚焦四态完全同源。 */
.check input:focus-visible{outline:1px solid rgba(255,255,255,.4);outline-offset:2px}
/* 全选处于"选了一部分"时给一条横杠（原生 indeterminate 是灰方块，很丑） */
.check input:indeterminate::after{
  content:"";position:absolute;left:3px;top:6px;width:7px;height:0;
  border-bottom:1.5px solid var(--ink);transform:none;
}
.check input:indeterminate{border-color:rgba(255,255,255,.45)}
/* 工具条里的勾选框不要那 6/20 的外边距 */
.adm-toolbar .check,.ord-filters .check{margin:0}
/* 勾选列窄一点、垂直居中 */
.adm-table td > .bulkBox{display:block;margin:0 auto}

/* ---------- 抽屉（把"只读的细枝末节"收起来，别占地方）---------- */
details.adm-drawer{
  border:1px solid var(--line);
  background:linear-gradient(180deg,rgba(255,255,255,.014),rgba(255,255,255,0));
  margin-top:20px;
}
details.adm-drawer > summary{
  cursor:pointer;list-style:none;padding:15px 20px;
  display:flex;align-items:center;gap:12px;flex-wrap:wrap;
  font-size:.8rem;letter-spacing:.08em;color:var(--ink);
}
details.adm-drawer > summary::-webkit-details-marker{display:none}
details.adm-drawer > summary::before{
  content:'▸';color:var(--dim);font-size:.8rem;transition:transform .2s;
}
details.adm-drawer[open] > summary::before{transform:rotate(90deg)}
details.adm-drawer > summary:hover{background:rgba(255,255,255,.03)}
details.adm-drawer > summary .adm-drawer-sub{color:var(--dim);font-size:.66rem;letter-spacing:.04em;margin-left:auto}
details.adm-drawer > .adm-drawer-body{padding:0 20px 20px;border-top:1px solid var(--line-soft)}
details.adm-drawer > .adm-drawer-body > .dash-title{margin-top:16px;font-size:.82rem}

/* ---------- 概览页统计卡 ---------- */
.adm-stat .adm-stat-num{
  font-family:"Noto Serif SC",serif;font-weight:400;font-size:1.6rem;
  line-height:1.1;letter-spacing:.02em;color:var(--ink);display:block;
}
.adm-stat .adm-stat-label{
  display:block;font-size:.58rem;letter-spacing:.2em;text-transform:uppercase;color:var(--dim);margin-bottom:8px;
}
.adm-stat .adm-stat-sub{display:block;font-size:.62rem;color:var(--dim);margin-top:7px}

/* 待处理异常：有异常时卡片与区块整体提亮成警示色 */
.adm-stat-hot{border-color:rgba(240,164,157,.4);background:linear-gradient(180deg,rgba(240,164,157,.09),rgba(240,164,157,.02))}
.adm-stat-hot .adm-stat-num{color:#f0a49d}
.dash-block-hot{border-color:rgba(240,164,157,.28);background:linear-gradient(180deg,rgba(240,164,157,.05),rgba(255,255,255,0))}

/* ---------- 概览页：非 .dash-block 的"分区"也要有同样的 20px 下间距 ----------
   用户反馈「内容概览与最近购买之间没有空隙」。根因不是 .dash-block 的
   margin-bottom（那条一直是 20px，见上面 .dash-block 的规则，实测也生效），
   而是「内容概览」这一组（h1 + .dash-sub + .adm-grid）**不是 .dash-block**：
   .adm-grid 自己没有任何下边距，于是紧跟在它后面的第一个块（#recent-buy）会
   **直接贴着统计卡** —— 实测 0px，而 /admin 之外的相邻 .dash-block 都是 20px。
   之前只有"有支付异常"那个块靠 inline style="margin-top:22px"（dashboard.php:157）
   自己补了间距，#recent-buy（dashboard.php:186）没有，所以没异常时就是贴着的。
   同类问题还有抽屉：details.adm-drawer 只有 margin-top（见上面的规则），
   收尾的「最近添加的视频」块同样贴上来（实测 0px）。
   这两条都只命中 /admin（.adm-grid 与 details.adm-drawer 只在 dashboard.php 用过）。 */
.adm-grid{margin-bottom:20px}
details.adm-drawer{margin-bottom:20px}

/* ---------- 窄屏 ---------- */
@media (max-width:880px){
  .adm-table-wrap .adm-table{min-width:560px}
  .adm-toolbar,.ord-filters{padding:12px}
  .adm-toolbar .field,.ord-filters .field{flex:1 1 140px}
  .adm-nav{gap:10px}
  .adm-nav-links{gap:12px;font-size:.64rem}
}

/* ---------- 转码进度条 / 报表柱状图 / 日志细节 ---------- */
.adm-prog{display:block;height:4px;background:rgba(255,255,255,.08);margin:0 0 5px;overflow:hidden}
.adm-prog > span{display:block;height:100%;background:#f0d6a8;transition:width .3s}
.adm-detail{margin-top:6px}
.adm-detail > summary{cursor:pointer;font-size:.62rem;color:var(--dim);letter-spacing:.06em}
.adm-detail > summary:hover{color:var(--ink)}
/* 判定依据 / 迁移细节的 <pre>
   ⚠ 与 .adm-log 同因：原来 max-height:220px + overflow:auto 会在**每一行**
     （/admin/security 的 19 行各一个）生成一条独立纵向滚动条，
     一页几十个滚动容器。这些内容都在 <details> 里（默认折叠 / 可折叠），
     展开就更该一次看全，而不是再套一层小滚动条。 */
.adm-detail > pre{
  margin:8px 0 2px;padding:10px 12px;
  background:rgba(0,0,0,.35);border:1px solid var(--line);
  font-family:ui-monospace,Menlo,Consolas,monospace;font-size:.62rem;line-height:1.7;
  color:var(--dim);white-space:pre-wrap;word-break:break-all;
}
.rep-bars{display:flex;align-items:flex-end;gap:4px;height:170px;padding-top:6px}
.rep-bar{flex:1;display:flex;flex-direction:column;justify-content:flex-end;align-items:center;height:100%;min-width:0}
.rep-col{
  width:100%;background:rgba(255,255,255,.16);border-top:1px solid rgba(255,255,255,.3);
  display:flex;flex-direction:column;justify-content:flex-end;min-height:2px;
}
.rep-col > .rep-seg-recharge{display:block;width:100%;background:rgba(255,255,255,.55)}
.rep-day{font-size:.52rem;color:var(--dim);margin-top:5px;letter-spacing:.02em}
@media (max-width:700px){
  .rep-bars{height:120px;gap:2px}
  .rep-day{font-size:0}
  .rep-day::after{content:'·';font-size:.5rem}
}

/* ============================================================
   维护模式（§30）
   ------------------------------------------------------------
   · .banner.warn      —— 维护中/已到期之类的"注意但没坏"提示条
   · .btn.warn         —— 维护模式开关按钮（警示色，别让人误点）
   · .maint-block      —— 站点设置里那块开关面板（开启时整体提亮）
   · .maint-facts      —— 开关文件/自动恢复时间这类只读事实
   · .maint-bar        —— 管理员在**前台**页面顶部的"维护中"提示条
   ============================================================ */
.banner.warn{border-color:rgba(240,214,168,.32);color:#f0d6a8}
.btn.warn{background:transparent;color:#f0d6a8;border:1px solid rgba(240,214,168,.34)}
.btn.warn:hover{opacity:1;border-color:rgba(240,214,168,.62)}
.btn.warn:active{transform:translateY(1px)}

.maint-block{border-color:rgba(255,255,255,.1)}
.maint-block.is-on{
  border-color:rgba(226,104,95,.32);
  background:linear-gradient(180deg,rgba(226,104,95,.06),rgba(255,255,255,0));
}
.maint-facts{list-style:none;margin:0 0 18px;padding:0}
.maint-facts li{
  display:flex;gap:14px;align-items:flex-start;
  padding:7px 0;border-top:1px solid var(--line-soft);
  font-size:.68rem;color:var(--dim);
}
.maint-facts li:first-child{border-top:0}
.maint-facts li > span{
  flex:0 0 88px;font-size:.58rem;letter-spacing:.16em;text-transform:uppercase;opacity:.75;padding-top:2px;
}
.maint-facts li > code{
  font-family:ui-monospace,Menlo,Consolas,monospace;font-size:.64rem;
  color:var(--ink);word-break:break-all;opacity:.9;
}

/* 管理员在前台页面顶部看到的提示条（普通访客看不到：那时他们拿到的是 503 维护页） */
.maint-bar{
  background:rgba(240,214,168,.08);border-bottom:1px solid rgba(240,214,168,.28);
  color:#f0d6a8;font-size:.66rem;letter-spacing:.04em;
  padding:9px 18px;display:flex;gap:14px;align-items:center;flex-wrap:wrap;
}
.maint-bar b{font-weight:400;letter-spacing:.18em;text-transform:uppercase;font-size:.58rem;opacity:.8}
.maint-bar a{color:#f0d6a8;border-bottom:1px solid rgba(240,214,168,.4);margin-left:auto}
.maint-bar a:hover{border-bottom-color:#f0d6a8}

/* ============================================================
   流量与用户（§31）：报表页签 / 指标卡 / 地图 / 排行 / 时长分布
   .rep-tabs 也是后台「作品」三个列表页（视频 / 小说 / 漫画）的页内标签栏 ——
   同一套排版，不再另造一套标签样式。
   ============================================================ */
.rep-tabs{display:flex;gap:22px;border-bottom:1px solid var(--line);margin:10px 0 20px}
.rep-tabs a{
  font-size:.74rem;letter-spacing:.16em;color:var(--dim);text-decoration:none;
  padding:0 2px 11px;border-bottom:1px solid transparent;display:inline-flex;align-items:center;gap:7px;
}
.rep-tabs a:hover{color:var(--ink)}
.rep-tabs a.on{color:var(--ink);border-bottom-color:rgba(255,255,255,.5)}
.rep-tabs a em{
  font-style:normal;font-size:.58rem;min-width:16px;text-align:center;
  border:1px solid rgba(240,214,168,.4);color:#f0d6a8;padding:1px 5px;
}

.tr-head{display:flex;align-items:flex-end;justify-content:space-between;gap:18px;flex-wrap:wrap}
.tr-range{display:flex;align-items:center;gap:14px;font-size:.68rem;flex-wrap:wrap}
.tr-range a{
  color:var(--dim);text-decoration:none;padding:5px 10px;border:1px solid var(--line);
}
.tr-range a:hover{color:var(--ink);border-color:rgba(255,255,255,.25)}
.tr-range a.on{color:var(--ink);border-color:rgba(255,255,255,.4);background:rgba(255,255,255,.05)}
.tr-online{color:var(--dim);letter-spacing:.06em}
.tr-online strong{color:#a8d8b1;font-weight:400}

.adm-stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(168px,1fr));gap:14px;margin:16px 0 22px}

.tr-map-wrap{display:flex;gap:28px;align-items:flex-start;flex-wrap:wrap;margin-top:12px}
.tr-map{flex:1 1 420px;min-width:280px;max-width:560px}
.tr-map svg{width:100%;height:auto;display:block;overflow:visible}
.tr-map path{transition:opacity .2s}
.tr-map path:hover{opacity:.75}
.tr-p0{fill:rgba(255,255,255,.045);stroke:rgba(255,255,255,.10);stroke-width:.5}
.tr-p1{fill:rgba(120,170,210,.22);stroke:rgba(255,255,255,.12);stroke-width:.5}
.tr-p2{fill:rgba(120,180,220,.38);stroke:rgba(255,255,255,.14);stroke-width:.5}
.tr-p3{fill:rgba(130,195,235,.55);stroke:rgba(255,255,255,.16);stroke-width:.5}
.tr-p4{fill:rgba(150,210,245,.75);stroke:rgba(255,255,255,.2);stroke-width:.5}
.tr-p5{fill:rgba(196,232,255,.95);stroke:rgba(255,255,255,.3);stroke-width:.5}
.tr-dash{fill:none;stroke:#f0d6a8;stroke-width:1.7;stroke-linecap:round}
.tr-map-side{flex:1 1 320px;min-width:260px}
.tr-sub{
  font-size:.6rem;letter-spacing:.2em;text-transform:uppercase;color:var(--dim);
  font-weight:400;margin:0 0 10px;
}

.tr-row{display:flex;align-items:center;gap:10px;font-size:.66rem;padding:3px 0;color:var(--dim)}
.tr-row-k{flex:0 0 38%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:var(--ink);opacity:.85}
.tr-row-bar{flex:1 1 auto;height:5px;background:rgba(255,255,255,.06);position:relative;overflow:hidden}
.tr-row-bar i{display:block;height:100%;background:rgba(160,205,240,.55)}
.tr-row-v{flex:0 0 auto;font-size:.62rem;color:var(--dim);white-space:nowrap}

.tr-dims{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:20px 30px;margin-top:14px}

.tr-dwell{margin-top:6px}
.tr-dwell-row{display:flex;align-items:center;gap:12px;font-size:.68rem;padding:4px 0}
.tr-dwell-k{flex:0 0 150px;color:var(--dim)}
.tr-dwell-bar{flex:1 1 auto;height:9px;background:rgba(255,255,255,.05);overflow:hidden}
.tr-dwell-bar i{display:block;height:100%;background:linear-gradient(90deg,rgba(140,190,230,.5),rgba(200,232,255,.85))}
.tr-dwell-v{flex:0 0 86px;text-align:right;color:var(--ink)}
.tr-dwell-v em{font-style:normal;color:var(--dim);font-size:.6rem;margin-left:5px}

.tr-risk-form{display:flex;gap:6px;align-items:center;flex-wrap:wrap}
.tr-risk-form select,.tr-risk-form input[type=text]{
  background:rgba(0,0,0,.25);border:1px solid var(--line);color:var(--ink);
  font:inherit;font-size:.64rem;padding:5px 8px;letter-spacing:.04em;
}
.tr-risk-form input[type=text]{min-width:120px;flex:1 1 120px}
.tr-risk-form select{cursor:pointer}

@media (max-width:760px){
  .tr-map-side{flex:1 1 100%}
  .tr-dwell-k{flex:0 0 108px;font-size:.62rem}
  .rep-tabs{gap:14px}
}
/* ---------- 搜索页类型筛选：下拉多选（自绘；不用原生控件，见 §26） ----------
   选项不做成复选框：没有方框、没有原生控件，选中状态靠
   「整行底色 + 左侧 2px 竖条 + 文字提亮」表达 —— 更像菜单，也更轻。 */
.fsel{position:relative}
.fsel-sum{display:inline-flex;align-items:center;gap:10px;cursor:pointer;list-style:none;user-select:none;
  border:1px solid var(--line);background:rgba(255,255,255,.02);padding:11px 14px;
  font-size:.7rem;letter-spacing:.1em;color:var(--dim);transition:color .2s,border-color .2s,background .2s}
.fsel-sum::-webkit-details-marker{display:none}
.fsel-sum:hover{color:var(--ink);border-color:rgba(255,255,255,.22);background:rgba(255,255,255,.04)}
.fsel[open] .fsel-sum{color:var(--ink);border-color:rgba(255,255,255,.32);background:rgba(255,255,255,.05)}
.fsel-k{font-size:.58rem;letter-spacing:.2em;text-transform:uppercase;opacity:.6}
.fsel-v{color:var(--ink);letter-spacing:.08em;max-width:190px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.fsel-caret{width:0;height:0;border-left:4px solid transparent;border-right:4px solid transparent;
  border-top:4px solid currentColor;opacity:.6;transition:transform .2s;margin-left:2px}
.fsel[open] .fsel-caret{transform:rotate(180deg)}
.fsel-pop{position:absolute;top:calc(100% + 6px);left:0;z-index:40;min-width:168px;
  max-width:calc(100vw - 32px);padding:6px;
  display:block;background:#0a0a0b;border:1px solid rgba(255,255,255,.12);
  box-shadow:0 18px 40px rgba(0,0,0,.55)}
/* ⚠ 必须显式隐藏：作者样式里的 display 会覆盖浏览器对收起 <details> 的 display:none */
.fsel:not([open]) .fsel-pop{display:none}
.filter-i{display:flex;align-items:center;justify-content:space-between;gap:12px;
  padding:9px 12px;cursor:pointer;user-select:none;
  font-size:.7rem;letter-spacing:.1em;color:var(--dim);
  border-left:2px solid transparent;transition:color .18s,background .18s,border-color .18s}
.filter-i:hover{color:var(--ink);background:rgba(255,255,255,.05)}
.filter-i:has(input:checked){color:var(--ink);background:rgba(255,255,255,.08);border-left-color:rgba(255,255,255,.5)}
.filter-i input{position:absolute;width:1px;height:1px;opacity:0;pointer-events:none}
.filter-i input:focus-visible ~ span{outline:1px solid rgba(255,255,255,.4);outline-offset:2px}
/* 窄屏：搜索框（min-width:220px）会把 `.fsel` 挤到第一行右侧、贴着视口右缘，
   而 min-width 撑出来的菜单仍从 left:0 往右排 → 右边缘冲出视口
   （390px 实测 scrollWidth 406 > innerWidth 390，右侧 16px 被切）。
   这里让菜单宽度跟随触发器（left:0;width:100%，等价于"右边缘与触发器右边缘对齐"）
   并允许收窄，再用 max-width 兜底；>640px 的桌面布局完全不走这条规则。 */
@media (max-width:640px){
  .fsel-pop{min-width:0;width:100%;left:0;right:auto;max-width:calc(100vw - 32px)}
}
/* ---------- 播放器水印覆盖层（§33）：只在播放时画，不拦鼠标 ---------- */
.wm-layer{position:absolute;left:0;top:0;width:100%;height:100%;pointer-events:none;z-index:3;opacity:.9}
/* ---------- 水印自绘全屏按钮 + theater 全屏（§33）----------
   原生控件的全屏按钮全屏的是 <video> 本身，而 video 的子元素浏览器不渲染 →
   水印必然消失。所以去掉原生全屏入口，改由这个按钮全屏**容器**：
   容器全屏时覆盖层仍在里面，水印跟着进全屏。
   theater 是 requestFullscreen 被拒（无手势授权/被策略拦）时的退路：CSS 撑满视口。 */
/* --- 水印控件：右上角、鼠标不动就淡出（不挡原生控件的右下角 ⋮ 菜单） --- */
.wm-ui{position:absolute;right:14px;top:14px;z-index:5;display:flex;gap:8px;opacity:.62;transition:opacity .2s}
.wm-ui:hover{opacity:1}
.wm-ui .wm-fsbtn{position:static;left:auto;right:auto;top:auto;bottom:auto}
.wm-fsbtn{appearance:none;-webkit-appearance:none;
  border:1px solid var(--line);border-radius:2px;background:rgba(10,10,12,.62);color:#e8e6e3;
  font:inherit;font-size:.72rem;letter-spacing:.08em;padding:7px 12px;cursor:pointer;
  backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);opacity:.9;transition:opacity .2s,border-color .2s}
.wm-fsbtn:hover{opacity:1;border-color:rgba(255,255,255,.34)}
.wm-fsbtn.on{border-color:rgba(240,164,157,.5);color:#f0a49d}
/* Chrome 的 controlsList 只认 nodownload / noremoteplayback，**nofullscreen 不生效**，
   原生全屏按钮得靠影子部件隐藏：不隐藏的话，点它会全屏 <video> 本身（子元素不渲染=没水印）。 */
video::-webkit-media-controls-fullscreen-button{display:none!important}
.wm-theater{position:fixed!important;inset:0!important;width:100vw!important;height:100vh!important;
  margin:0!important;border-radius:0!important;background:#000;z-index:9998}
.wm-theater .wm-layer{opacity:.95}
body.wm-lock{overflow:hidden}
.wm-pvbtn{order:-1}

/* ---------- 播放协议小金标（HLS / MP4）----------
   原来播放器下面挂着**一整句**"当前为原始文件播放（后台开启 HLS 转码后会自动改用加密分片）。"，
   用户反馈太长（"可以改成一个像 HiFi 那样的小金标不"）。现在只剩这个金色小标：
   文字由真实播放路径决定（HLS = 走加密分片，MP4 = 原片直连），整句解释搬进 title / aria-label
   ——悬停可见、读屏可读，页面上一个字都不显示。
   位置：与 .wm-ui 同思路的绝对定位角标，**不参与** .stage-frame 的 flex 布局（那个坑见 watch-watermark.js）；
   左上角是唯一空着的角（右上 .wm-ui 是「预览水印 / 全屏」，底部 .np-ui 是自绘控制栏）。
   z-index:4 压在水印 canvas（.wm-layer，z-index:3）之上，又在两套控件（5 / 6）之下。 */
.proto-badge{
  position:absolute;left:12px;top:12px;z-index:4;
  display:inline-flex;align-items:center;gap:6px;
  padding:3px 8px;border:1px solid rgba(232,195,122,.55);border-radius:3px;
  background:linear-gradient(180deg,rgba(58,46,20,.78),rgba(20,16,9,.78));
  color:#e8c37a;font-size:.58rem;font-weight:600;letter-spacing:.18em;line-height:1.6;
  cursor:help;user-select:none;-webkit-user-select:none;
  backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);
  transition:border-color .2s,color .2s;
}
/* 小圆点：让"金标"更像 HiFi 那种认证贴纸，而不是普通文字标签 */
.proto-badge::before{
  content:'';width:5px;height:5px;border-radius:50%;background:#e8c37a;
  box-shadow:0 0 6px rgba(232,195,122,.9);
}
.proto-badge:hover,.proto-badge:focus-visible{border-color:rgba(240,213,150,.95);color:#f3d79b;outline:none}
.proto-badge:focus-visible{box-shadow:0 0 0 1px rgba(232,195,122,.7)}
/* MP4 = 原始文件直连（没走加密分片），用同一套暖金但降一档饱和度：
   一眼能看出"这是原片"，又不至于变成第二套配色。 */
.proto-badge[data-proto="MP4"]{color:#c9b183;border-color:rgba(201,177,131,.45)}
.proto-badge[data-proto="MP4"]::before{background:#c9b183;box-shadow:0 0 6px rgba(201,177,131,.75)}
.proto-badge[data-proto="MP4"]:hover,.proto-badge[data-proto="MP4"]:focus-visible{color:#dfc79a;border-color:rgba(223,199,154,.8)}
/* （原「备用浮层播放器 player.js 的小金标不飘到画面上」的 .player-note .proto-badge
    已于 v47 随该浮层一起删除：那个浮层 0 处引用。） */

/* ---------- 自绘播放器控制层（§34）----------
   原生控件已关闭（video.controls=false），这里是唯一的控件区：
   进度条（含缓冲）、播放/暂停、时间、倍速、音量、画质（多档位时才出现）、全屏。
   全部绝对定位在播放容器内，不参与宿主布局（flex 宿主也不会被挤）。 */
.np-ui{position:absolute;left:0;right:0;bottom:0;z-index:6;padding:10px 14px 12px;
  background:linear-gradient(180deg,rgba(0,0,0,0),rgba(0,0,0,.72));
  font-size:.74rem;letter-spacing:.04em;opacity:1;transition:opacity .25s;user-select:none}
.np-ui.hide{opacity:0;pointer-events:none}
.np-progress{position:relative;height:14px;cursor:pointer;margin-bottom:6px}
.np-progress::before{content:'';position:absolute;left:0;right:0;top:6px;height:2px;background:rgba(255,255,255,.18)}
.np-buf{position:absolute;left:0;top:6px;height:2px;background:rgba(255,255,255,.32)}
.np-played{position:absolute;left:0;top:6px;height:2px;background:#f0a49d}
.np-knob{position:absolute;top:3px;width:8px;height:8px;margin-left:-4px;border-radius:50%;background:#f0a49d;opacity:0;transition:opacity .15s}
.np-ui:hover .np-knob{opacity:1}
.np-row{display:flex;align-items:center;gap:12px;color:#e8e6e3}
.np-spacer{flex:1 1 auto}
.np-btn{appearance:none;-webkit-appearance:none;border:0;background:transparent;color:#e8e6e3;
  font:inherit;font-size:.78rem;letter-spacing:.06em;padding:4px 6px;cursor:pointer;opacity:.85;transition:opacity .15s,color .15s}
.np-btn:hover{opacity:1;color:#fff}
.np-time{font-variant-numeric:tabular-nums;opacity:.8;min-width:96px}
.np-vol{display:flex;align-items:center;gap:6px}
.np-voltrack{position:relative;width:74px;height:14px;cursor:pointer;display:inline-block}
.np-voltrack::before{content:'';position:absolute;left:0;right:0;top:6px;height:2px;background:rgba(255,255,255,.18)}
.np-volfill{position:absolute;left:0;top:6px;height:2px;background:#e8e6e3}
.np-menu{position:absolute;right:14px;bottom:52px;min-width:170px;padding:6px;border:1px solid var(--line);
  border-radius:2px;background:rgba(12,12,14,.94);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);
  display:flex;flex-direction:column;gap:2px;z-index:7}
.np-mi{appearance:none;-webkit-appearance:none;border:0;background:transparent;color:#cfcac4;text-align:left;
  font:inherit;font-size:.74rem;padding:8px 10px;cursor:pointer;border-radius:2px}
.np-mi:hover{background:rgba(255,255,255,.07);color:#fff}
.np-mi.on{color:#f0a49d}
.np-toast{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);padding:8px 14px;border-radius:2px;
  background:rgba(0,0,0,.66);color:#fff;font-size:.78rem;letter-spacing:.08em;pointer-events:none}
.np-theater{position:fixed!important;inset:0!important;width:100vw!important;height:100vh!important;
  margin:0!important;border-radius:0!important;background:#000;z-index:9998}
body.np-lock{overflow:hidden}
.np-idle{cursor:none}

/* ---------- 窄屏 / 触屏下的控制栏（§35）----------
   症状（390×844 实测）：舞台 352px 宽 → 控制栏可用 324px，而一行内容需要 354px。
   flex 行溢出 30px，`.np-fs`（全屏）被挤到 x=362..387 —— 右半边跑到舞台外面，
   自身只剩 25px 宽（"全屏"两个字竖排，25×50）；
   `document.elementFromPoint(全屏按钮中心)` 命中的是 main.auth-wrap → **根本点不到**。
   窄屏重排：一行放 播放/时间/倍速/全屏（按钮最小 32×32 触控区），音量条降到第二行整条展开
   （拖动目标更大）；万一还放不下（长时间轴），`.np-vol` 有 order:9 会自己换行，不会溢出。
   触屏拖动：滑条加 touch-action:none —— 否则浏览器会把拖动当成页面滚动，
   直接发 pointercancel 打断 bindSlider，表现就是"音量条拖不动"。 */
.np-progress,.np-voltrack{touch-action:none}
@media (max-width:860px), (pointer:coarse) and (max-width:1024px){
  .np-ui{padding:6px 10px 8px;font-size:.72rem}
  .np-row{flex-wrap:wrap;gap:2px 6px;row-gap:2px}
  .np-btn{min-width:32px;min-height:32px;display:inline-flex;align-items:center;justify-content:center;
    padding:4px 6px;white-space:nowrap}
  .np-time{min-width:0;font-size:.72rem}
  .np-vol{order:9;flex:0 1 auto;gap:8px;min-width:0}
  .np-voltrack{width:88px;min-width:56px;height:32px}
  .np-voltrack::before{top:14px;height:3px}
  .np-volfill{top:14px;height:3px}
  .np-progress{height:32px;margin-bottom:0}
  .np-progress::before{top:15px;height:3px}
  .np-buf,.np-played{top:15px;height:3px}
  .np-knob{top:9px;width:14px;height:14px;margin-left:-7px}
  /* 弹出菜单挪到控制栏上方（原来是 bottom:52px，控制栏高了会被压在中间） */
  .np-menu{right:10px;bottom:100%;margin-bottom:6px;min-width:150px}
  .np-mi{padding:10px 12px;font-size:.76rem}
}
@media (hover:none),(pointer:coarse){
  /* 触屏没有 hover：进度圆点常显，否则拖动时看不出拖到哪了 */
  .np-ui .np-knob{opacity:1}
}

/* 设置页小节标题（水印板块里区分"前台覆盖层 / 烧进文件"） */
.set-sub{margin:22px 0 12px;padding-top:16px;border-top:1px solid var(--line);
  font-size:.72rem;font-weight:400;letter-spacing:.16em;color:var(--dim);text-transform:uppercase}
.dash-block > .set-sub:first-of-type{border-top:0;padding-top:0;margin-top:16px}
.dash-block > .check{margin:6px 0 14px}

/* ============================================================
   首页公告（v45）：顶部横幅 + 弹窗
   ------------------------------------------------------------
   · 横幅固定在最上方；显示时给 <body> 加 ann-banner-on，并把可变高度写进
     --ann-banner-h，导航与右上角认证控件整体下移 —— 保证两者不重叠
   · 弹窗沿用登录提示框的视觉语言（.gate-* 同款描边/高光/按钮）
   · z-index：横幅 130（在 nav 120 之上）< 浮层 285 < 站内弹窗 290 < 光标 300
     —— 加载遮罩 200 比横幅高，所以加载动画期间横幅不会先冒出来
   ============================================================ */
:root{--ann-banner-h:0px}

.ann-banner{
  position:fixed;left:0;right:0;top:0;z-index:130;
  display:flex;align-items:center;gap:clamp(10px,2vw,20px);
  padding:11px clamp(16px,6vw,72px);
  background:linear-gradient(180deg,rgba(13,13,15,.97),rgba(7,7,8,.94));
  border-bottom:1px solid rgba(255,255,255,.12);
  -webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);
  color:var(--ink);font-size:.72rem;letter-spacing:.05em;line-height:1.6;
}
.ann-banner .ann-flag{
  flex:0 0 auto;font-size:.54rem;letter-spacing:.3em;text-transform:uppercase;color:var(--dim);
  border:1px solid rgba(255,255,255,.16);padding:2px 8px;
}
.ann-banner .ann-txt{flex:1 1 auto;min-width:0;display:flex;gap:10px;align-items:baseline;flex-wrap:wrap}
.ann-banner .ann-txt b{font-weight:400;letter-spacing:.12em;white-space:nowrap}
.ann-banner .ann-txt span{
  color:var(--dim);white-space:pre-line;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;
}
.ann-banner .ann-x{
  flex:0 0 auto;font:inherit;font-size:.62rem;letter-spacing:.22em;text-transform:uppercase;
  background:transparent;color:var(--ink);border:1px solid rgba(255,255,255,.16);
  padding:6px 14px;cursor:pointer;transition:border-color .3s,background .3s;
}
.ann-banner .ann-x:hover{border-color:rgba(255,255,255,.38);background:rgba(255,255,255,.05)}

/* 横幅可见时整体下移固定导航 / 右上角认证控件（home.php 里 nav{top:0} 的同权重覆盖） */
body.ann-banner-on nav{top:var(--ann-banner-h)}
body.ann-banner-on .nav-auth-bar{top:calc(16px + var(--ann-banner-h))}

/* ---------- 公告弹窗 ---------- */
.ann{
  position:fixed;inset:0;z-index:285;display:flex;align-items:center;justify-content:center;padding:22px;
  background:rgba(3,3,3,.84);
  -webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);
}
.ann-box{
  width:100%;max-width:480px;max-height:86vh;overflow:auto;text-align:center;
  border:1px solid rgba(255,255,255,.12);background:#0a0a0a;
  padding:32px 26px;position:relative;
}
.ann-box::before{
  content:"";position:absolute;left:0;top:0;height:1px;width:100%;
  background:linear-gradient(90deg,transparent,rgba(214,218,230,.28),transparent);
}
.ann-tag{font-size:.54rem;letter-spacing:.34em;text-transform:uppercase;color:var(--dim)}
.ann-title{font-size:1.06rem;font-weight:300;letter-spacing:.12em;margin:14px 0 12px;color:var(--ink)}
.ann-sub{
  font-size:.74rem;line-height:1.95;color:var(--dim);margin-bottom:24px;
  white-space:pre-line;text-align:left;max-height:46vh;overflow:auto;word-break:break-word;
}
.ann-actions{display:flex;gap:12px}
.ann-btn{
  flex:1;display:inline-flex;align-items:center;justify-content:center;
  padding:12px 16px;font:inherit;font-size:.7rem;letter-spacing:.2em;text-transform:uppercase;
  border:1px solid rgba(255,255,255,.16);background:transparent;color:var(--ink);
  cursor:pointer;transition:opacity .3s,border-color .3s,background .3s;text-decoration:none;
}
.ann-btn:hover{border-color:rgba(255,255,255,.34)}
.ann-btn.primary{background:var(--ink);color:#0b0b0b;border-color:var(--ink)}
.ann-btn.primary:hover{opacity:.86}

@media(max-width:640px){
  .ann-banner{font-size:.68rem;padding:9px 16px}
  .ann-banner .ann-txt span{-webkit-line-clamp:1}
  .ann-box{padding:26px 20px}
}

/* datetime-local 输入框：与其它 .field 输入框同一套外观（auth.css 里原来没有这个类型） */
.field input[type=datetime-local]{
  width:100%;min-height:44px;
  background:rgba(255,255,255,.03);border:1px solid var(--line);color:var(--ink);
  padding:12px 14px;font:inherit;font-size:.86rem;letter-spacing:.04em;
  color-scheme:dark;                     /* 让浏览器自带的日历弹层也走深色 */
  transition:border-color .3s,background .3s,box-shadow .3s;
}
.field input[type=datetime-local]:focus{
  outline:none;border-color:rgba(255,255,255,.22);background:rgba(255,255,255,.05);
  box-shadow:0 0 0 3px rgba(214,218,230,.06);
}

/* ============================================================
   手机端排版（§35）
   ------------------------------------------------------------
   只在"窄屏（≤700px）或粗指针（触屏）"下生效 —— 桌面 1280×900（fine 指针、宽屏）
   一条都进不来，所以桌面观感零变化。
   修的是两类实测问题：
     · 触控目标太小：390×844 量到"返回首页"69×17、顶栏品牌 181×26、
       分段控件（最新/最热/浏览/点赞）44×28、漫画页码滑条 150×3、
       个人中心卡片上的 ✕ 24×24、继续观看里"全部记录/清空" 41×16 / 20×16、
       登录页"显示密码" 31×29 —— 手指点不准。统一补到 ≥32px。
     · 若干本该换行/收紧的地方在手机上一行挤满，这里把间距和内边距收一收。
   ============================================================ */
@media (max-width:700px), (pointer:coarse){
  /* 顶栏：品牌 + 返回首页的点击区（原来 26px / 17px 高） */
  .auth-nav{padding:14px 16px}
  .auth-brand{padding:6px 0}
  .auth-nav .back{padding:8px 4px;display:inline-flex;align-items:center;min-height:32px}
  .auth-wrap{padding:20px 14px}

  /* 观看页标签行 / 分段控件 / 阅读器按钮 */
  .tabs{margin:16px 0 14px;gap:6px}
  .seg-btn{padding:9px 12px}
  .tab-search{display:inline-flex;align-items:center;min-height:32px;padding:8px 12px}
  .crd-btn,.reader-btn{min-height:32px;padding:7px 10px}
  .crd-range{height:32px}
  .crd-bar{gap:9px;padding:8px 10px}

  /* 个人中心 / 继续观看 / 表单里的小按钮 */
  .acct-remove{width:32px;height:32px}
  .avatar-pick{padding:8px 12px;bottom:-15px}
  .resume-head{gap:8px}
  .resume-more,.resume-clear{min-height:32px;min-width:32px;padding:8px 6px}
  .link-row a{padding:7px 0;min-height:32px;min-width:32px;display:inline-flex;align-items:center}
  .pw-toggle{min-width:32px;min-height:32px;display:inline-flex;align-items:center;justify-content:center}
  .field .pw input{padding-right:52px}
  .check{padding:7px 0}
  .check input{width:18px;height:18px}
  .check input:checked::after{left:5px;top:2px}
  .cmt-op{padding:7px 0}

  /* 长字符串不再把容器撑破（英文邮箱 / 标题 / 地址） */
  .stage-sub,.stage-desc,.dash-sub,.dash-email,.feed-meta,.resume-meta{overflow-wrap:anywhere}
}

/* ============================================================
   后台手机端（§36）：390×844 逐页实测出来的三类问题
   ------------------------------------------------------------
   ① 「上面的输入框和下面的输入框间隔特别大」
      根因不在这一节，而在 537 行那个 @media(max-width:640px)：
      .field 上为**横排**写的 inline flex-basis 在纵向排列时变成了**高度**，
      再叠加 gap 与 margin —— 已在那里修掉，相邻字段统一 18px。
   ② 触控目标 <32px（实测）：后台导航项 25×18、表格里的「编辑/隐藏/删除」
      23×18 与翻页箭头 7×11、<details> 标题 328×17、表格内下拉 92×29、
      勾选框 16×16。这里全部补到 ≥32px：
        · 能改内边距的直接改（导航项、折叠标题、表格内的下拉/输入）；
        · 内联文字链接**不能**改行高 —— 一列 30 行会平白长 400+px，
          所以用绝对定位的伪元素把**命中区**撑到 32×32：视觉零变化、命中达标；
        · 勾选框本体 18×18 保持不变（改了会和手绘对勾的位置打架），
          同样用 ::before 加一圈 32×32 的透明命中区。
      这一节只进"窄屏或粗指针"，桌面 1280×900（fine 指针、宽屏）一条都不生效。
   ============================================================ */
@media (max-width:700px), (pointer:coarse){
  /* 后台导航 / 右侧入口：一项一个 ≥32×32 的可点区域（两个字的项只有 29px 宽） */
  .adm-nav-links a,.adm-nav-right a,.adm-nav-right span{
    display:inline-flex;align-items:center;justify-content:center;
    min-height:32px;min-width:32px;padding:6px 2px;
  }
  .adm-nav-links{gap:4px 16px}

  /* <details> 折叠标题（判定依据速查 / 看细节 / 导入日志 / 最近日志） */
  details.adm-detail > summary,details > summary{display:flex;align-items:center;min-height:32px}

  /* 表格里的下拉与短输入（原来 29px 高） */
  .adm-table select,.adm-table input[type=text],.adm-table input[type=number],.adm-table input[type=search],
  .ord-table select,.ord-table input[type=text],.wal-table select,.wal-table input[type=text]{min-height:32px}

  /* 内联文字链接：伪元素撑命中区（不改行高、不改视觉）。
     选择器故意放宽到 .dash 下所有 <a> 与 .adm-nav 的链接 —— 之前只列了
     .adm-link / .adm-table a / td a 这几类，实测漏掉了分页符（18×34）、
     作品/报表的页内标签（31×32）、公告页 .adm-kv 里的链接（89×15）等。 */
  .dash a,.adm-nav a,.adm-link,.adm-table a,td a,summary{position:relative}
  .dash a::before,.adm-nav a::before,.adm-link::before,.adm-table a::before,td a::before,.adm-empty a::before,.banner a::before{
    content:"";position:absolute;left:0;right:0;top:50%;height:32px;min-width:32px;transform:translateY(-50%);
  }

  /* 表格单元格不要窄到"一个字一列"：某个方格里有长对象键（word-break:break-all）时，
     auto 布局会把它压到 1 个字符宽，旁边的数字格跟着被压成竖排
     （实测 /admin/settings 的媒体列表出现过 24×148 的 "137 MB"）。给一个下限，
     宁可让 .adm-table-wrap 横向滚 —— 那才是这一页该有的那**一条**滚动条。 */
  .adm-table td,.adm-table th,.dash-table td,.dash-table th,
  .ord-table td,.ord-table th,.wal-table td,.wal-table th{min-width:52px}
  .adm-table td.num,.ord-table td.num,.wal-table td.num{white-space:nowrap}

  /* 勾选框：本体 18×18 不变，外面加一圈 32×32 的透明命中区 */
  .check input::before,.bulkBox::before{
    content:"";position:absolute;left:50%;top:50%;width:32px;height:32px;transform:translate(-50%,-50%);
  }
}