@charset "UTF-8";
/* ============================================================================
   新中式东方漫画馆 · orient-user.css
   用户中心 / 作者中心 / 小说频道的设计系统落地

   策略说明（重要）：
   系统在 template/pc/default/js/user.js 与 author.js 内按固定类名/ID 查找 DOM
   （充值弹层、头像裁切、短信验证、省市联动、收藏选择等），这些钩子不可改名。
   因此本文件的做法是：**保留官方标记结构，用 CSS 完整重绘外观**，
   全部选择器都带 .p-user / .p-author / .p-book 作用域前缀，避免影响前台主站样式。

   依赖：必须在其之前加载官方 common_user.css 与 user.css（提供布局骨架与图标字体），
   本文件只做视觉覆盖，不删除官方规则。
   ========================================================================== */

/* ==========================================================================
   0. 作用域与令牌继承
   ========================================================================== */
.p-user, .p-author, .p-book {
  font-family: var(--f-body);
  color: var(--ink);
  background-color: var(--paper);
  background-image: var(--tex-fiber), var(--tex-paper);
}

/* 官方布局容器补上版心与安全边距 */
.p-user .container--response,
.p-author .container--response,
.p-book .container--response { max-width: var(--wrap); margin: 0 auto; padding-left: var(--gutter); padding-right: var(--gutter); }

/* 清掉官方遗留的圆角与阴影观感 */
.p-user *, .p-author *, .p-book * { border-radius: 0; }

/* ==========================================================================
   1. 用户区顶栏（user/head.html · author/head.html 的标记结构）
   ========================================================================== */
.header-user-wrapper {
  background: rgba(245, 242, 235, .92);
  border-bottom: 1px solid var(--line-soft);
  position: sticky; top: 0; z-index: var(--z-head);
  -webkit-backdrop-filter: saturate(140%) blur(10px);
  backdrop-filter: saturate(140%) blur(10px);
}
.header-user-wrapper .main-container {
  max-width: var(--wrap); margin: 0 auto;
  padding: 0 var(--gutter);
  display: flex; align-items: center; gap: var(--sp-5);
  height: 66px;
}

/* 品牌 */
.header-user-wrapper .header-logo {
  display: flex; align-items: center; gap: var(--sp-3);
  flex: none;
}
.header-user-wrapper .header-logo .mccms-logo-img { max-height: 36px; max-width: 160px; display: block; object-fit: contain; }
.header-user-wrapper .header-logo .logo-text-fallback {
  font-family: var(--f-display); font-size: 19px; letter-spacing: .14em; color: var(--ink);
}
.header-user-wrapper .header-logo:has(.mccms-logo-img) .logo-text-fallback { display: none; }

/* 导航 */
.header-user-wrapper .nav-menu { display: flex; align-items: center; gap: var(--sp-1); margin: 0; }
.header-user-wrapper .nav-menu li { list-style: none; position: relative; }
.header-user-wrapper .nav-menu a {
  display: inline-block; padding: 8px 13px;
  font-size: 15px; letter-spacing: .1em; color: var(--ink-2);
  border-radius: var(--r-s);
  transition: color var(--t-fast) var(--ease), background var(--t-fast) var(--ease);
}
.header-user-wrapper .nav-menu a:hover { color: var(--ink); background: rgba(42, 39, 35, .04); }
/* 消息小圆点 */
.header-user-wrapper .nav-menu i {
  position: absolute; right: 6px; top: 6px;
  width: 6px; height: 6px; border-radius: 50%;
  background: var(--seal); display: none;
}
.header-user-wrapper .nav-menu i.is-on { display: block; }

/* 搜索 */
.header-user-wrapper .search-box {
  position: relative; display: flex; align-items: center;
  flex: 1; max-width: 230px; margin-left: auto; height: 36px;
  border: 1px solid var(--line); border-radius: var(--r-s);
  background: rgba(251, 250, 246, .8); overflow: hidden;
  transition: border-color var(--t-fast) var(--ease);
}
.header-user-wrapper .search-box:focus-within { border-color: var(--seal); background: var(--paper-white); }
.header-user-wrapper .search-box input {
  flex: 1; min-width: 0; height: 100%; padding: 0 12px;
  border: 0; background: none; outline: none; font-size: 14px; color: var(--ink);
}
.header-user-wrapper .search-box input::placeholder { color: var(--ink-4); }
.header-user-wrapper .search-btn {
  flex: none; width: 38px; height: 100%;
  display: flex; align-items: center; justify-content: center;
  color: var(--paper-white); background: var(--ink); cursor: pointer;
  transition: background var(--t-fast) var(--ease);
}
.header-user-wrapper .search-btn:hover { background: var(--seal); }

/* 官方 common_user.css:3114 给 .search-btn 加了 padding:10px 15px。
   按钮宽 38px，扣掉左右内边距后内容区只剩 8px，里面的 16×16 放大镜 svg
   被 flex 压缩成 8×8（实测 computed 8px x 8px），整个按钮看上去就是一块纯黑方块。
   下面用与官方同特异性的选择器覆盖内边距，并给 svg 固定尺寸、禁止收缩。 */
.header-user-wrapper .search-box .search-btn { padding: 0; }
.header-user-wrapper .search-btn svg { width: 16px; height: 16px; flex: none; }

/* 右侧区 */
.header-user-wrapper .fr { display: flex; align-items: center; gap: var(--sp-3); flex: none; }

/* 官方 common_user.css:3040-3070 把 ul.switch-tab 写死成
   width:80px / height:28px / line-height:28px / float:left / margin-top:22px，
   还带一块 #2ccc9c 的亮绿底和 14px 14px 3px 14px 的大圆角。
   本主题给 a 用了 13px 字号 + 26px 内边距，"去作者中心"需要约 100px，
   在被限死的 80px 里必然折成两行、撑破 28px（线上实测 a 高 70px、文字溢出成
   孤零零一个"中心"），同时露出那块与全站调性冲突的绿。
   这里把外壳整体重置为透明、随内容自适应，视觉全部交由下面的 a 承担。 */
.header-user-wrapper .switch-tab,
.header-user-wrapper .switch-tab.reader,
.header-user-wrapper .switch-tab.author {
  float: none; margin: 0; padding: 0; text-align: left;
  width: auto; height: auto; min-height: 0; line-height: normal;
  background: none; border: 0; border-radius: 0;
}
.header-user-wrapper .switch-tab a {
  display: inline-block; padding: 6px 13px; white-space: nowrap;
  font-size: 13px; letter-spacing: .06em; color: var(--dai-deep);
  border: 1px solid var(--dai-wash); border-radius: var(--r-s);
  background: var(--dai-wash);
  transition: all var(--t-fast) var(--ease);
}
.header-user-wrapper .switch-tab a:hover { color: var(--paper-white); background: var(--dai); border-color: var(--dai); }

/* 头像与下拉 */
.header-user-wrapper .user-box { position: relative; }
.header-user-wrapper .user-avatar {
  width: 36px; height: 36px; border-radius: 50%; overflow: hidden;
  border: 1px solid var(--line); background: var(--paper-3);
  transition: border-color var(--t-fast) var(--ease);
}
.header-user-wrapper .user-avatar:hover { border-color: var(--seal); }
.header-user-wrapper .user-avatar img { width: 100%; height: 100%; object-fit: cover; display: block; }

/* 头像下拉面板（.dialog__header-avatar 由 JS 控制显隐） */
.p-user .dialog__header-avatar,
.p-author .dialog__header-avatar {
  position: absolute; right: 0; top: calc(100% + 12px);
  width: 268px; padding: var(--sp-5);
  background: var(--paper); background-image: var(--tex-paper);
  border: 1px solid var(--line); border-radius: var(--r-m);
  box-shadow: var(--sh-3);
  z-index: var(--z-modal);
}
.p-user .dialog__header-avatar .triangle,
.p-author .dialog__header-avatar .triangle { display: none; }
.p-user .dialog__header-avatar .base-info,
.p-author .dialog__header-avatar .base-info { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.p-user .dialog__header-avatar .nickname,
.p-author .dialog__header-avatar .nickname { font-family: var(--f-display); font-size: 15px; color: var(--ink); }
.p-user .dialog__header-avatar .logout,
.p-author .dialog__header-avatar .logout { margin-left: auto; font-size: 12.5px; color: var(--ink-4); }
.p-user .dialog__header-avatar .logout:hover,
.p-author .dialog__header-avatar .logout:hover { color: var(--seal); }
.p-user .dialog__header-avatar .expire,
.p-author .dialog__header-avatar .expire { margin-top: 8px; font-size: 12.5px; color: var(--ink-4); }
.p-user .dialog__header-avatar .buy-vip,
.p-author .dialog__header-avatar .buy-vip {
  display: inline-block; margin-top: 10px; padding: 5px 12px;
  font-size: 12.5px; color: var(--paper-white); background: var(--seal); border-radius: var(--r-s);
}
.p-user .dialog__header-avatar .row-2,
.p-author .dialog__header-avatar .row-2 {
  margin-top: var(--sp-4); padding-top: var(--sp-4);
  border-top: 1px solid var(--line-soft);
  display: grid; grid-template-columns: 1fr 1fr; gap: var(--sp-3);
}
.p-user .dialog__header-avatar .fund-item,
.p-author .dialog__header-avatar .fund-item {
  display: flex; align-items: center; gap: 8px;
  font-size: 12px; color: var(--ink-4);
}
.p-user .dialog__header-avatar .fund-item span,
.p-author .dialog__header-avatar .fund-item span { font-family: var(--f-num); font-size: 15px; color: var(--ink); }
.p-user .dialog__header-avatar .fund-item__icon,
.p-author .dialog__header-avatar .fund-item__icon { color: var(--gold); font-size: 17px; }

/* ==========================================================================
   2. 主体布局：左栏菜单 + 主内容
   ========================================================================== */
/* 只作用于 body 的直接子元素 —— 头部里也有一个 .main-container
   （.header-user-wrapper .main-container），两者特异性相同，
   若写成 .p-user .main-container 会把这个 grid 覆盖到头部的 flex 上，
   导致 logo/导航/搜索/头像被塞进 218px 首列并换行、整条头部压住正文。 */
.p-user > .main-container,
.p-author > .main-container {
  max-width: var(--wrap); margin: 0 auto;
  padding: var(--sp-6) var(--gutter) var(--sp-9);
  display: grid; grid-template-columns: 218px minmax(0, 1fr);
  gap: var(--sp-6); align-items: start;
}

/* 左侧菜单（user/left.html · author/left.html） */
.p-user .aside-user,
.p-author .aside-user { margin: 0; }
.p-user .aside-user dl,
.p-author .aside-user dl {
  margin: 0 0 var(--sp-4);
  background: var(--paper-white);
  border: 1px solid var(--line-soft);
  border-radius: var(--r-m);
  box-shadow: var(--sh-1);
  overflow: hidden;
}
.p-user .aside-user dt,
.p-author .aside-user dt {
  display: flex; align-items: center; gap: 9px;
  padding: 12px 16px;
  font-family: var(--f-display); font-size: 15px; letter-spacing: .12em;
  color: var(--ink);
  background: linear-gradient(180deg, rgba(231, 224, 210, .6), rgba(231, 224, 210, .22));
  border-bottom: 1px solid var(--line-soft);
  position: relative;
}
.p-user .aside-user dt::before,
.p-author .aside-user dt::before {
  content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 3px; background: var(--seal);
}
.p-user .aside-user dt i,
.p-author .aside-user dt i { color: var(--seal); font-size: 15px; }
.p-user .aside-user--first dt,
.p-author .aside-user--first dt { background: var(--ink); color: var(--paper-white); border-bottom-color: transparent; }
.p-user .aside-user--first dt a,
.p-author .aside-user--first dt a { color: var(--paper-white); }
.p-user .aside-user--first dt i,
.p-author .aside-user--first dt i { color: var(--paper-white); }
.p-user .aside-user--first dt::before,
.p-author .aside-user--first dt::before { background: var(--gold); }

.p-user .aside-user dd,
.p-author .aside-user dd { margin: 0; border-bottom: 1px solid var(--line-soft); }
.p-user .aside-user dd:last-child,
.p-author .aside-user dd:last-child { border-bottom: 0; }
.p-user .aside-user dd a,
.p-author .aside-user dd a {
  display: block; padding: 10px 16px 10px 26px;
  font-size: 14px; color: var(--ink-2);
  position: relative;
  transition: all var(--t-fast) var(--ease);
}
.p-user .aside-user dd a::before,
.p-author .aside-user dd a::before {
  content: ""; position: absolute; left: 15px; top: 50%; margin-top: -2px;
  width: 4px; height: 4px; border-radius: 50%; background: var(--ink-5);
  transition: background var(--t-fast) var(--ease);
}
.p-user .aside-user dd a:hover,
.p-author .aside-user dd a:hover { color: var(--seal); background: rgba(239, 234, 224, .6); padding-left: 30px; }
.p-user .aside-user dd a:hover::before,
.p-author .aside-user dd a:hover::before { background: var(--seal); }
/* 当前项高亮：页面脚本给 dd 加类，官方用 .aside-user--selected，本项目用 .dt--selected，两者都支持 */
.p-user .aside-user dd.dt--selected a,
.p-user .aside-user dd.selected a,
.p-user .aside-user dd.aside-user--selected a,
.p-user .aside-user dd a.is-on,
.p-author .aside-user dd.dt--selected a,
.p-author .aside-user dd.selected a,
.p-author .aside-user dd.aside-user--selected a,
.p-author .aside-user dd a.is-on {
  color: var(--seal); background: var(--seal-wash); font-weight: 400;
}
.p-user .aside-user dd.dt--selected a::before,
.p-user .aside-user dd.selected a::before,
.p-user .aside-user dd.aside-user--selected a::before,
.p-author .aside-user dd.selected a::before { background: var(--seal); }
.p-user .aside-user dd { position: relative; }

/* 主内容区 */
.p-user .main-content--aside,
.p-author .main-content--aside,
.p-user .main-content,
.p-author .main-content { min-width: 0; }

/* 通用面板：给主内容里的区块统一纸面观感 */
.p-user .panel,
.p-author .panel,
.p-user .user-panel,
.p-author .author-panel {
  background: var(--paper-white);
  border: 1px solid var(--line-soft);
  border-radius: var(--r-m);
  box-shadow: var(--sh-1);
  padding: var(--sp-5) var(--sp-6);
}
.p-user .panel + .panel, .p-author .panel + .panel { margin-top: var(--sp-5); }

/* 内容区小标题 */
.p-user .main-content--aside h3,
.p-user .main-content h3,
.p-author .main-content--aside h3,
.p-author .main-content h3 {
  font-family: var(--f-display); font-weight: 400;
  font-size: 17px; letter-spacing: .12em; color: var(--ink);
}

/* ==========================================================================
   3. 登录 / 注册 / 找回密码
   ========================================================================== */
.page-login .main-content {
  max-width: var(--wrap); margin: 0 auto;
  padding: var(--sp-8) var(--gutter) var(--sp-9);
}
.page-login .login-box {
  display: grid; grid-template-columns: minmax(0, 1fr) 420px;
  gap: var(--sp-8); align-items: center;
  background: var(--paper-white);
  border: 1px solid var(--line-soft);
  border-radius: var(--r-l);
  box-shadow: var(--sh-2);
  overflow: hidden;
  position: relative;
}
/* 左侧插画位：不放位图，改为一幅内联 SVG 山水（由页面标记提供） */
.page-login .login-pic {
  position: relative; align-self: stretch;
  min-height: 420px;
  display: flex; align-items: center; justify-content: center;
  background: linear-gradient(160deg, #F3EFE6, #E7E0D2);
  border-right: 1px solid var(--line-soft);
  overflow: hidden;
}
.page-login .login-pic img { display: none; }          /* 官方位图缺失，隐藏 */
.page-login .login-pic svg { width: 100%; height: 100%; position: absolute; inset: 0; }

.page-login .dialog-login { padding: var(--sp-7) var(--sp-7) var(--sp-8) 0; }
.page-login .dialog-login_content { display: block; }
.page-login .tab-content { width: 100%; }
.page-login .j-tab-item { display: none; }
.page-login .j-tab-item.active { display: block; }

/* 登录卡片右列只有 265px 宽。原 h3 用 24px + .16em 字距，"用户登录"需约 115px，
   与右侧"没账号…快速注册"挤在一行放不下 → 折成"用户登 / 录"两行。
   收小字号与字距并禁止换行，同时允许整行在极端窄屏下自然换行。 */
.page-login .form-title {
  display: flex; align-items: baseline; justify-content: space-between;
  gap: var(--sp-3); flex-wrap: wrap;
  margin-bottom: var(--sp-6);
}
.page-login .form-title h3 {
  font-family: var(--f-display); font-size: 21px; font-weight: 400;
  letter-spacing: .1em; color: var(--ink); white-space: nowrap;
}
.page-login .form-title a { font-size: 13px; color: var(--dai); }
.page-login .form-title a:hover { color: var(--seal); }

/* 表单项 */
.page-login .form-item { margin-bottom: var(--sp-4); }
.page-login .input-block,
.page-login .input-block--inline { position: relative; display: flex; align-items: center; gap: 8px; }
.page-login .input-block input,
.page-login .input-block--inline input {
  width: 100%; height: 46px; padding: 0 15px;
  font-size: 14.5px; color: var(--ink);
  background: var(--paper-white);
  border: 1px solid var(--line); border-radius: var(--r-s);
  outline: none;
  transition: border-color var(--t-fast) var(--ease), box-shadow var(--t-fast) var(--ease);
}
.page-login .input-block input:focus,
.page-login .input-block--inline input:focus { border-color: var(--seal); box-shadow: 0 0 0 3px var(--seal-wash); }
.page-login .input-block input::placeholder,
.page-login .input-block--inline input::placeholder { color: var(--ink-4); letter-spacing: .04em; }

/* 图形验证码图 */
.page-login .code_pic {
  flex: none; height: 46px; width: 104px; object-fit: cover;
  border: 1px solid var(--line) !important; border-radius: var(--r-s);
  cursor: pointer;
}
/* 短信按钮 */
.page-login .sms-btn {
  flex: none; height: 46px; padding: 0 16px;
  display: inline-flex; align-items: center; justify-content: center;
  font-size: 13.5px; letter-spacing: .06em; white-space: nowrap;
  color: var(--ink-2); background: var(--paper-3);
  border: 1px solid var(--line); border-radius: var(--r-s);
  cursor: pointer;
  transition: all var(--t-fast) var(--ease);
}
.page-login .sms-btn:hover { color: var(--seal); border-color: var(--line-seal); background: var(--paper-white); }
.page-login .sms-btn.disabled { opacity: .5; pointer-events: none; }

/* 提交按钮 */
.page-login .submit-btn {
  height: 48px; display: flex; align-items: center; justify-content: center;
  font-size: 16px; letter-spacing: .2em;
  color: var(--paper-white); background: var(--ink);
  border-radius: var(--r-s); cursor: pointer;
  transition: background var(--t-fast) var(--ease);
}
.page-login .submit-btn:hover { background: var(--seal); }

/* 【重要纠正】官方 .disabled-select 只是「禁止选中文字」——common_user.css:2927
   仅含三条 user-select，与禁用交互毫无关系。
   我此前把它误当成禁用态写成 pointer-events:none，而登录/注册/重置密码三个主按钮
   的标记里都带 disabled-select，于是**鼠标完全点不动**（实测 pointer-events=none、
   opacity=.45，点击穿透到父元素 .form-item），整条登录/注册/找回密码流程被卡死。
   官方真正的禁用态是 .submit-btn.disabled（只改背景色，见 common_user.css:4742）。
   这里改为只匹配 .disabled；把 .disabled-select 交还给官方定义。 */
.page-login .submit-btn.disabled { opacity: .45; pointer-events: none; }

/* 协议 */
.page-login .tip-protocol { margin-top: var(--sp-4); font-size: 12.5px; line-height: 1.9; color: var(--ink-4); }
.page-login .tip-protocol a { color: var(--dai); }
.page-login .tip-protocol a:hover { color: var(--seal); }

/* 第三方登录 */
.page-login .other-login { margin-top: var(--sp-6); }
.page-login .other-login .title { margin-bottom: var(--sp-4); }
.page-login .other-login .title-line { display: none; }
.page-login .other-login .title-text { font-size: 13px; color: var(--ink-4); letter-spacing: .1em; text-align: center; }
.page-login .other-link { display: flex; align-items: center; justify-content: center; gap: var(--sp-4); }
.page-login .other-link a {
  width: 42px; height: 42px; border-radius: 50%;
  display: inline-flex; align-items: center; justify-content: center;
  font-size: 19px; color: var(--ink-3);
  border: 1px solid var(--line); background: var(--paper-white);
  transition: all var(--t-fast) var(--ease);
}
.page-login .other-link a:hover { color: var(--paper-white); background: var(--ink); border-color: var(--ink); }

/* 校验错误条 */
.page-login .j-verify-err {
  display: flex; align-items: center; gap: 7px;
  margin-top: 8px; padding: 8px 12px;
  font-size: 13px; color: var(--seal-deep);
  background: var(--seal-wash); border-radius: var(--r-s);
}

/* ==========================================================================
   4. 表单通用（资料 / 绑定 / 认证 / 投稿）
   ========================================================================== */
.p-user .form-row,
.p-author .form-row {
  display: flex; align-items: flex-start; gap: var(--sp-4);
  padding: var(--sp-4) 0; border-bottom: 1px dashed var(--line-soft);
}
.p-user .form-row:last-child, .p-author .form-row:last-child { border-bottom: 0; }
.p-user .form-label,
.p-author .form-label {
  flex: none; width: 108px; padding-top: 10px;
  font-size: 14px; color: var(--ink-3); letter-spacing: .06em;
}
.p-user .form-field, .p-author .form-field { flex: 1; min-width: 0; }
.p-user .form-field input[type=text],
.p-user .form-field input[type=password],
.p-user .form-field input[type=email],
.p-user .form-field input[type=tel],
.p-user .form-field select,
.p-user .form-field textarea,
.p-author .form-field input[type=text],
.p-author .form-field input[type=password],
.p-author .form-field input[type=email],
.p-author .form-field input[type=tel],
.p-author .form-field select,
.p-author .form-field textarea {
  width: 100%; min-height: 42px; padding: 9px 13px;
  font-family: var(--f-body); font-size: 14.5px; color: var(--ink);
  background: var(--paper-white);
  border: 1px solid var(--line); border-radius: var(--r-s);
  outline: none;
  transition: border-color var(--t-fast) var(--ease), box-shadow var(--t-fast) var(--ease);
}
.p-user .form-field textarea, .p-author .form-field textarea { min-height: 120px; line-height: 1.85; resize: vertical; }
.p-user .form-field input:focus, .p-user .form-field select:focus, .p-user .form-field textarea:focus,
.p-author .form-field input:focus, .p-author .form-field select:focus, .p-author .form-field textarea:focus {
  border-color: var(--seal); box-shadow: 0 0 0 3px var(--seal-wash);
}
.p-user .form-field input::placeholder, .p-author .form-field input::placeholder { color: var(--ink-4); }
.p-user .form-tip, .p-author .form-tip { margin-top: 7px; font-size: 12.5px; color: var(--ink-4); line-height: 1.8; }
.p-user .form-acts, .p-author .form-acts { margin-top: var(--sp-5); display: flex; gap: var(--sp-3); flex-wrap: wrap; }

/* 通用提交按钮（用户/作者中心的 .submit-btn / .save-btn 等） */
.p-user .submit-btn, .p-author .submit-btn,
.p-user .save-btn, .p-author .save-btn,
.p-user .btn-submit, .p-author .btn-submit {
  display: inline-flex; align-items: center; justify-content: center;
  min-width: 130px; height: 42px; padding: 0 26px;
  font-size: 14.5px; letter-spacing: .12em;
  color: var(--paper-white); background: var(--ink);
  border-radius: var(--r-s); cursor: pointer;
  transition: background var(--t-fast) var(--ease);
}
.p-user .submit-btn:hover, .p-author .submit-btn:hover,
.p-user .save-btn:hover, .p-author .save-btn:hover { background: var(--seal); }

/* 取消 / 次要按钮 */
.p-user .cancel-btn, .p-author .cancel,
.p-user .clear-btn, .p-user .del-btn {
  display: inline-flex; align-items: center; justify-content: center;
  min-width: 100px; height: 42px; padding: 0 20px;
  font-size: 14px; color: var(--ink-2);
  background: var(--paper-3); border: 1px solid var(--line);
  border-radius: var(--r-s); cursor: pointer;
  transition: all var(--t-fast) var(--ease);
}
.p-user .cancel-btn:hover, .p-author .cancel:hover,
.p-user .clear-btn:hover { color: var(--ink); background: var(--paper-sink); }
.p-user .del-btn:hover { color: var(--paper-white); background: var(--seal); border-color: var(--seal); }

/* ==========================================================================
   5. 读者中心首页（user/index.html）
   ========================================================================== */
.user-info {
  display: grid; grid-template-columns: 88px minmax(0, 1fr) auto;
  gap: var(--sp-5); align-items: center;
  padding: var(--sp-6);
  background: linear-gradient(150deg, #FBFAF6, #F1ECE1 70%);
  border: 1px solid var(--line-soft);
  border-radius: var(--r-m);
  box-shadow: var(--sh-1);
}
.user-info__avatar {
  width: 88px; height: 88px; border-radius: 50%; overflow: hidden;
  border: 1px solid var(--line); background: var(--paper-3);
}
.user-info__avatar img { width: 100%; height: 100%; object-fit: cover; display: block; }
.user-info__info { min-width: 0; }
.user-info__info .user-name {
  font-family: var(--f-display); font-size: 20px; color: var(--ink); letter-spacing: .06em;
}
.user-info__info .vip-info { display: block; margin-top: 8px; font-size: 13px; color: var(--ink-3); }
.user-info__info .vip-recharge {
  display: inline-block; margin-top: 10px; padding: 5px 14px;
  font-size: 12.5px; color: var(--paper-white); background: var(--gold-deep);
  border-radius: var(--r-s); cursor: pointer;
}
.user-info__funds { display: flex; gap: var(--sp-6); }
.user-info__funds--item { text-align: center; position: relative; }
.user-info__funds--num { font-family: var(--f-num); font-size: 22px; color: var(--ink); }
.user-info__funds--text { font-size: 12.5px; color: var(--ink-4); letter-spacing: .06em; }
.user-info__funds--icon { display: none; }

/* 页签（layui tab 的外观覆盖） */
.p-user .main-content__user-tab { margin-top: var(--sp-5); }
.p-user .layui-tab-title { border-bottom: 1px solid var(--line-soft) !important; }
.p-user .layui-tab-title li {
  font-size: 15px !important; letter-spacing: .1em; color: var(--ink-3) !important;
  padding: 0 18px !important;
}
.p-user .layui-tab-title .layui-this { color: var(--ink) !important; }
.p-user .layui-tab-brief > .layui-tab-title .layui-this:after { border-bottom: 2px solid var(--seal) !important; }
.p-user .tab-con__balance { font-size: 14px; color: var(--ink-2); padding: var(--sp-4) 0; }
.p-user .tab-con__balance span { font-family: var(--f-num); font-size: 20px; color: var(--ink); }
.p-user .tab-con__record { font-size: 13px; color: var(--dai); }
.p-user .tab-con__record:hover { color: var(--seal); }
.p-user .tab-con__h3 {
  margin: var(--sp-5) 0 var(--sp-3);
  font-family: var(--f-display); font-size: 16px; letter-spacing: .12em; color: var(--ink);
}
.p-user .tab-con__btn {
  display: inline-flex; align-items: center; justify-content: center;
  min-width: 120px; height: 40px; padding: 0 22px; margin-top: var(--sp-4);
  font-size: 14px; letter-spacing: .12em;
  color: var(--paper-white); background: var(--seal);
  border-radius: var(--r-s); cursor: pointer;
}
.p-user .tab-con__gold-qs p { font-size: 13.5px; line-height: 2; color: var(--ink-2); }
.p-user .tab-con__gold-flow { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--sp-3); }
.p-user .tab-con__gold-flow--item {
  padding: var(--sp-4); text-align: center;
  background: var(--paper-white); border: 1px solid var(--line-soft); border-radius: var(--r-s);
}
.p-user .tab-con__gold-flow--item-title { font-size: 14px; color: var(--ink); }
.p-user .tab-con__gold-flow--item-title span {
  display: inline-flex; width: 20px; height: 20px; margin-right: 5px;
  align-items: center; justify-content: center;
  font-family: var(--f-num); font-size: 12px;
  color: var(--paper-white); background: var(--seal); border-radius: 50%;
}
.p-user .tab-con__gold-flow--item-des { margin-top: 6px; font-size: 12.5px; color: var(--ink-4); }
.p-user .tab-con__vip-flow { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--sp-3); }
.p-user .tab-con__vip-flow--item {
  padding: var(--sp-4); background: var(--paper-white);
  border: 1px solid var(--line-soft); border-radius: var(--r-s);
}
.p-user .tab-con__vip-flow--item-title { font-size: 14px; color: var(--ink); }
.p-user .tab-con__vip-flow--item-des { margin-top: 5px; font-size: 12.5px; color: var(--ink-4); }
.p-user .tab-con__title { font-family: var(--f-display); font-size: 18px; letter-spacing: .1em; }
.p-user .tab-con__des { margin-top: 6px; font-size: 13.5px; color: var(--ink-3); }

/* ==========================================================================
   6. 列表类页面：收藏 / 历史 / 购买 / 评论 / 消息 / 订单
   ========================================================================== */
/* 官方列表容器（user/fav.html、read.html 等使用 {mccms:fav} 等循环输出） */
.p-user .user-comic-list,
.p-user .user-list,
.p-user .collection-list { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--sp-4); }

.p-user .user-comic-item,
.p-user .user-list-item {
  position: relative;
  background: var(--paper-white);
  border: 1px solid var(--line-soft);
  border-radius: var(--r-m);
  box-shadow: var(--sh-1);
  overflow: hidden;
  transition: transform var(--t-base) var(--ease), box-shadow var(--t-base) var(--ease);
}
.p-user .user-comic-item:hover,
.p-user .user-list-item:hover { transform: translateY(-3px); box-shadow: var(--sh-2); }
.p-user .user-comic-item img,
.p-user .user-list-item img { width: 100%; aspect-ratio: 3 / 4; object-fit: cover; display: block; }
.p-user .user-comic-item p,
.p-user .user-list-item p {
  padding: 9px 11px; margin: 0;
  font-size: 14px; color: var(--ink);
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}

/* 收藏选择态（user.js 依赖 .user-comic-item--selected / .j-item-select） */
.p-user .user-comic-item--selected { border-color: var(--seal); box-shadow: 0 0 0 2px var(--seal-wash); }
.p-user .j-item-select, .p-user .toolbox-btn {
  position: absolute; left: 8px; top: 8px; z-index: 2;
  width: 20px; height: 20px; border-radius: 50%;
  border: 1px solid var(--line-2); background: rgba(251, 250, 246, .92);
  cursor: pointer;
}
.p-user .user-comic-item--selected .j-item-select { background: var(--seal); border-color: var(--seal); }

/* 消息列表 */
.p-user .message-text { font-size: 14px; line-height: 1.9; color: var(--ink-2); }
.p-user .message-item {
  padding: var(--sp-4) 0; border-bottom: 1px dashed var(--line-soft);
}
.p-user .message-item:last-child { border-bottom: 0; }

/* 表格类（消费记录 / 订单） */
.p-user table, .p-author table { width: 100%; border-collapse: collapse; font-size: 14px; }
.p-user table th, .p-author table th {
  padding: 12px 14px; text-align: left;
  font-family: var(--f-display); font-weight: 400; letter-spacing: .08em;
  color: var(--ink); background: rgba(231, 224, 210, .5);
  border-bottom: 1px solid var(--line-soft);
}
.p-user table td, .p-author table td {
  padding: 12px 14px; color: var(--ink-2);
  border-bottom: 1px solid var(--line-soft);
}
.p-user table tr:hover td, .p-author table tr:hover td { background: rgba(239, 234, 224, .45); }

/* ==========================================================================
   7. 作者中心
   ========================================================================== */
.p-author .author-stat,
.p-author .home-stat {
  display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--sp-4);
}
.p-author .author-stat-item,
.p-author .home-stat-item {
  padding: var(--sp-5); text-align: center;
  background: var(--paper-white); border: 1px solid var(--line-soft);
  border-radius: var(--r-m); box-shadow: var(--sh-1);
}
.p-author .author-stat-item b,
.p-author .home-stat-item b { display: block; font-family: var(--f-num); font-size: 24px; color: var(--ink); font-weight: 400; }
.p-author .author-stat-item span,
.p-author .home-stat-item span { display: block; margin-top: 5px; font-size: 12.5px; color: var(--ink-4); letter-spacing: .06em; }

/* 作品管理行 */
.p-author .author-comic-item {
  display: flex; align-items: center; gap: var(--sp-4);
  padding: var(--sp-4) 0; border-bottom: 1px solid var(--line-soft);
}
.p-author .author-comic-item:last-child { border-bottom: 0; }
.p-author .author-comic-item img {
  width: 52px; height: 69px; object-fit: cover; flex: none;
  border: 1px solid var(--line-soft); border-radius: var(--r-xs);
}

/* 封面上传裁切区（author.js 依赖 .cover-x/.cover-y/.J_cover_x 等） */
.p-author .cover-dialog-x, .p-author .cover-dialog-y,
.p-author .cover-x, .p-author .cover-y, .p-author .x-cover, .p-author .y-cover {
  border: 1px dashed var(--line-2); border-radius: var(--r-s); background: var(--paper-2);
}
.p-author .j-change-avatar, .p-user .j-change-avatar {
  display: inline-flex; align-items: center; justify-content: center;
  padding: 8px 16px; font-size: 13.5px; color: var(--ink-2);
  background: var(--paper-3); border: 1px solid var(--line); border-radius: var(--r-s);
  cursor: pointer;
}
.p-author .j-change-avatar:hover, .p-user .j-change-avatar:hover { color: var(--seal); border-color: var(--line-seal); }

/* 类型标签多选（author.js 依赖 .type-tags:checked） */
.p-author .type-tags-list { display: flex; flex-wrap: wrap; gap: 8px; }
.p-author .type-tags-list label {
  display: inline-flex; align-items: center; gap: 6px;
  padding: 6px 13px; font-size: 13.5px; color: var(--ink-2);
  background: var(--paper-white); border: 1px solid var(--line-soft);
  border-radius: var(--r-xs); cursor: pointer;
  transition: all var(--t-fast) var(--ease);
}
.p-author .type-tags-list label:hover { border-color: var(--line-seal); color: var(--seal); }
.p-author .type-tags-list label:has(input:checked) { color: var(--paper-white); background: var(--seal); border-color: var(--seal); }

/* ==========================================================================
   8. 小说频道（book）
   ========================================================================== */
.p-book .sec-title::before { background: var(--dai); }     /* 小说频道用黛青区分 */

.p-book .topbar,
.p-book .header-book { background: rgba(245, 242, 235, .92); border-bottom: 1px solid var(--line-soft); }

/* 小说阅读页：正文排版 */
.p-book .read-content, .p-book .book-read-content {
  max-width: 760px; margin: 0 auto;
  font-family: var(--f-body); font-size: 17px; line-height: 2.1; color: var(--ink);
}
.p-book .read-content p, .p-book .book-read-content p { margin: 0 0 1.2em; text-indent: 2em; }
.p-book .read-bar {
  position: sticky; top: 0; z-index: var(--z-head);
  background: rgba(245, 242, 235, .94);
  -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px);
  border-bottom: 1px solid var(--line-soft);
  display: flex; align-items: center; gap: var(--sp-3);
  padding: 10px var(--gutter);
}

/* ==========================================================================
   9. 通用：分页 / 空态 / 弹层（用户中心内）
   ========================================================================== */
.p-user .page, .p-author .page, .p-user .pagination, .p-author .pagination {
  display: flex; align-items: center; justify-content: center;
  gap: 6px; padding: var(--sp-6) 0 0; flex-wrap: wrap;
}
.p-user .page a, .p-author .page a,
.p-user .pagination a, .p-author .pagination a,
.p-user .page span, .p-author .page span {
  min-width: 34px; height: 34px; padding: 0 10px;
  display: inline-flex; align-items: center; justify-content: center;
  font-family: var(--f-num); font-size: 13.5px; color: var(--ink-2);
  background: var(--paper-white); border: 1px solid var(--line-soft);
  border-radius: var(--r-xs);
  transition: all var(--t-fast) var(--ease);
}
.p-user .page a:hover, .p-author .page a:hover { color: var(--seal); border-color: var(--line-seal); }
.p-user .page .on, .p-author .page .on,
.p-user .page .current, .p-author .page .current { color: var(--paper-white); background: var(--ink); border-color: var(--ink); }

/* 用户中心空态 */
.p-user .no-data, .p-author .no-data, .p-user .empty-tip {
  padding: var(--sp-9) var(--sp-5); text-align: center;
  font-size: 14px; color: var(--ink-4); line-height: 2;
}

/* 用户中心内的 layui 弹层观感统一 */
.layui-layer { border-radius: var(--r-m) !important; }
.layui-layer-title { font-family: var(--f-display) !important; letter-spacing: .1em; }

/* 主内容区标题行（各列表页共用） */
.p-user .main-content_title, .p-author .main-content_title {
  display: flex; align-items: baseline; justify-content: space-between;
  gap: var(--sp-4); flex-wrap: wrap;
  padding-bottom: var(--sp-3); margin-bottom: var(--sp-5);
  border-bottom: 1px solid var(--line-soft);
}
.p-user .main-content_title h3, .p-author .main-content_title h3 {
  font-family: var(--f-display); font-size: 20px; font-weight: 400;
  letter-spacing: .12em; color: var(--ink);
  display: flex; align-items: center; gap: 10px;
}
.p-user .main-content_title h3::before, .p-author .main-content_title h3::before {
  content: ""; width: 3px; height: 18px; background: var(--seal); border-radius: 1px;
}
.p-user .main-content_subtitle, .p-author .main-content_subtitle { font-size: 13.5px; color: var(--ink-3); }
.p-user .main-content_subtitle strong { font-family: var(--f-num); font-weight: 400; color: var(--seal); font-size: 16px; }
.p-user .main-content__title--toolbox { display: flex; align-items: center; gap: var(--sp-3); flex-wrap: wrap; }

/* 收藏分页区 */
.p-user .pagination--center { padding-top: var(--sp-6); }
.p-user .pagination--center .layui-box { display: flex; justify-content: center; }
.p-user .layui-laypage a, .p-user .layui-laypage span {
  border-color: var(--line-soft) !important; color: var(--ink-2) !important;
  background: var(--paper-white) !important;
}
.p-user .layui-laypage .layui-laypage-curr .layui-laypage-em { background: var(--ink) !important; }
.p-user .layui-laypage a:hover { color: var(--seal) !important; }

/* ==========================================================================
   10. 页脚覆盖（user/bottom.html · author/bottom.html）
   ========================================================================== */
.p-user .footer-wrapper, .p-author .footer-wrapper, .p-book .footer-wrapper {
  margin-top: var(--sp-9);
  padding: var(--sp-7) 0 var(--sp-6);
  background: linear-gradient(180deg, rgba(231, 224, 210, 0), rgba(226, 218, 203, .8));
  border-top: 1px solid var(--line-soft);
}
.p-user .footer-top, .p-author .footer-top {
  display: grid; grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: var(--sp-6); padding-bottom: var(--sp-6);
  border-bottom: 1px solid var(--line-soft);
}
.p-user .column-title, .p-author .column-title {
  font-family: var(--f-display); font-size: 15px; letter-spacing: .12em; color: var(--ink);
  margin-bottom: 12px;
}
.p-user .link-list li, .p-author .link-list li { list-style: none; }
.p-user .link-list a, .p-author .link-list a { font-size: 13px; line-height: 2.1; color: var(--ink-3); }
.p-user .link-list a:hover, .p-author .link-list a:hover { color: var(--seal); }
.p-user .footer-link, .p-author .footer-link {
  display: flex; flex-wrap: wrap; gap: var(--sp-4);
  padding: var(--sp-5) 0;
}
.p-user .footer-link li, .p-author .footer-link li { list-style: none; font-size: 12.5px; color: var(--ink-4); }
.p-user .footer-link a, .p-author .footer-link a { color: var(--ink-3); }
.p-user .footer-link a:hover, .p-author .footer-link a:hover { color: var(--seal); }
.p-user .footer-bottom p, .p-author .footer-bottom p { font-size: 12.5px; color: var(--ink-4); line-height: 2; }
.p-user .footer-bottom a, .p-author .footer-bottom a { color: var(--ink-3); }
.p-user .pic-tg img, .p-user .pic-kf img, .p-user .pic-qq img { display: none; }
.p-user .icon-wx, .p-user .icon-wb, .p-author .icon-wx, .p-author .icon-wb { display: none; }

/* ==========================================================================
   11. 响应式
   ========================================================================== */
@media (max-width: 1199px) {
  .p-user > .main-container, .p-author > .main-container { grid-template-columns: 196px minmax(0, 1fr); gap: var(--sp-5); }
  .p-user .user-comic-list, .p-user .user-list, .p-user .collection-list { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .page-login .login-box { grid-template-columns: minmax(0, 1fr) 380px; gap: var(--sp-6); }
  .p-author .author-stat, .p-author .home-stat { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .p-user .tab-con__gold-flow { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .p-user .tab-con__vip-flow { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 991px) {
  /* 左侧菜单变横向滚动条 */
  .p-user > .main-container, .p-author > .main-container { grid-template-columns: minmax(0, 1fr); }
  .p-user .aside-user, .p-author .aside-user {
    display: flex; gap: 8px; overflow-x: auto; padding-bottom: 8px;
    scrollbar-width: none;
  }
  .p-user .aside-user::-webkit-scrollbar, .p-author .aside-user::-webkit-scrollbar { display: none; }
  .p-user .aside-user dl, .p-author .aside-user dl { flex: none; margin: 0; min-width: 150px; }
  .p-user .aside-user dt::before, .p-author .aside-user dt::before { display: none; }

  .header-user-wrapper .main-container { gap: var(--sp-3); }
  .header-user-wrapper .nav-menu { display: none; }
  .header-user-wrapper .search-box { max-width: none; }

  .page-login .login-box { grid-template-columns: minmax(0, 1fr); }
  .page-login .login-pic { display: none; }
  .page-login .dialog-login { padding: var(--sp-7); }
  .p-user .user-comic-list, .p-user .user-list, .p-user .collection-list { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .p-user .footer-top, .p-author .footer-top { grid-template-columns: minmax(0, 1fr); }
}

@media (max-width: 767px) {
  .p-user > .main-container, .p-author > .main-container { padding: var(--sp-4) var(--gutter) var(--sp-8); gap: var(--sp-4); }
  .header-user-wrapper .main-container { height: 56px; }
  .header-user-wrapper .header-logo .logo-text-fallback { font-size: 16px; letter-spacing: .1em; }
  .header-user-wrapper .search-box { display: none; }   /* 窄屏搜索收进抽屉/主页 */
  .header-user-wrapper .switch-tab { display: none; }
  .header-user-wrapper .dialog__header-avatar { width: min(280px, 88vw); }

  .p-user .user-info { grid-template-columns: 64px minmax(0, 1fr); gap: var(--sp-4); padding: var(--sp-5); }
  .p-user .user-info__avatar { width: 64px; height: 64px; }
  .p-user .user-info__funds { grid-column: 1 / -1; justify-content: flex-start; gap: var(--sp-6); padding-top: var(--sp-4); border-top: 1px solid var(--line-soft); }

  .p-user .user-comic-list, .p-user .user-list, .p-user .collection-list { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
  .p-user .tab-con__gold-flow, .p-user .tab-con__vip-flow { grid-template-columns: minmax(0, 1fr); }
  .page-login .dialog-login { padding: var(--sp-6) var(--sp-5); }
  .page-login .form-title h3 { font-size: 20px; }
  .p-user .form-row, .p-author .form-row { flex-direction: column; gap: 8px; }
  .p-user .form-label, .p-author .form-label { width: auto; padding-top: 0; }
  .p-author .author-stat, .p-author .home-stat { grid-template-columns: minmax(0, 1fr); }
  .p-user table, .p-author table { display: block; overflow-x: auto; white-space: nowrap; }
}

@media (prefers-reduced-motion: reduce) {
  .p-user *, .p-author *, .p-book * { transition-duration: .001ms !important; }
  .p-user .user-comic-item:hover, .p-author .author-comic-item:hover { transform: none; }
}

/* ==========================================================================
   §X 充值弹窗主题层（user.js 注入，原样式在 vendor common_user.css）
   --------------------------------------------------------------------------
   弹窗不是主题模板的一部分，而是 user.js 里的 payhtml 字符串渲染出来的，
   样式全部来自 vendor 的 common_user.css —— 其中 .dialog-pay_header 的背景
   是一张内联 base64 PNG（橙色渐变），所以四个主题此前看起来完全一样。
   下面用同特异性选择器覆盖颜色，**结构与尺寸不动**，只换视觉语言。
   注：弹窗挂在 body 下，详情页（p-comic）也会用到，故不加 .p-user 前缀。
   ========================================================================== */

/* 头部：原来的橙色位图换成主题底色 + 一道发丝线 */
.dialog-pay_header {
  background: linear-gradient(180deg, #3A3630 0%, #2A2723 100%);
  box-shadow: inset 0 -1px 0 rgba(181,69,58,.55);
}
.dialog-pay_header--username { color: #FBFAF6; letter-spacing: .08em; }
.dialog-pay_header--foundinfo,
.dialog-pay_header--foundinfo em { color: rgba(251,250,246,.72); }
.dialog-pay_header--close i { color: #FBFAF6; }

/* 主体 */
.dialog-pay_body { background: #F5F2EB; border-radius: 3px; }

/* 分区标题与小竖条 */
.dialog-pay_body--tab-body .item--title { color: #7D766A; }
.dialog-pay_body--tab-body .item--title-icon {
  background-color: #B5453A; width: 3px; border-radius: 1px;
}
.dialog-pay_body--tab-body .item--recome { color: #B5453A; }

/* 金额卡（购买项目） */
.dialog-pay_body--tab-body .item--btn {
  color: #2A2723;
  background: #FBFAF6;
  border: 1px solid rgba(42,39,35,.14);
  border-radius: 3px;
  transition: border-color 160ms ease, background 160ms ease;
}
.dialog-pay_body--tab-body .item--btn:hover { border-color: #B5453A; }
.dialog-pay_body--tab-body .active.item--btn {
  color: #8C332B;
  border-color: #B5453A;
  background: rgba(181,69,58,.08);
}
.dialog-pay_body--tab-body .item--price { color: #7D766A; }
.dialog-pay_body--tab-body .item--btn i.item--icon,
.dialog-pay_body--tab-body .active.item--btn .item--icon { color: #B5453A; }

/* 其他金额输入框 */
.dialog-pay_body--tab-body .item--input {
  color: #2A2723;
  background: #FBFAF6;
  border: 1px solid rgba(42,39,35,.14);
  border-radius: 3px;
}
.dialog-pay_body--tab-body .item--input::-webkit-input-placeholder { color: #7D766A; }
.dialog-pay_body--tab-body .item--input-warning { color: #B5453A; }

/* 支付方式卡 */
.dialog-pay_body--tab-body .item--paytype-btn {
  color: #2A2723;
  background: #FBFAF6;
  border: 1px solid rgba(42,39,35,.14);
  border-radius: 3px;
  transition: border-color 160ms ease, background 160ms ease;
}
.dialog-pay_body--tab-body .item--paytype-btn:hover { border-color: #B5453A; }
.dialog-pay_body--tab-body .active.item--paytype-btn {
  color: #8C332B;
  border-color: #B5453A;
  background: rgba(181,69,58,.08);
}
.dialog-pay_body--tab-body .active.item--paytype-btn .item--icon { color: #B5453A; }

/* 应付金额 */
.j-pay-num, .pay_ext { color: #8C332B; }
.j-pay-warning { color: #B5453A; }
.j-go-gold { color: #8C332B; text-decoration: underline; }

/* 确认支付 */
.j-pay-btn {
  background: #2A2723; color: #FBFAF6;
  border-radius: 3px; border: 0;
  transition: background 160ms ease;
}
.j-pay-btn:hover { background: #B5453A; }
.j-pay-btn.disabled { opacity: .45; }

/* 页签：沿用 layui 结构，仅换选中色。
   注意别给 :after 设 background —— layui 默认页签的 :after 是一整块覆盖层，
   设背景会渲染成一个大色块（实测过）。官方用的是 border-bottom
   （common_user.css:2856 .layui-tab-mkz > .layui-tab-title .layui-this:after），照抄。 */
.dialog-pay_body--tab-title .layui-this { color: #B5453A; }
.dialog-pay_body--tab-title .layui-this::after {
  background: none; border-bottom: 2px solid #B5453A;
}

/* 窄屏收缩修正：vendor 给 .main-container 设了固定 width，
   max-width 压不住 width → 1024 视口下容器 1080px 溢出 66px。
   补 width:100% 让它在窄屏跟随父级，宽屏仍由 max-width 居中。 */
.header-user-wrapper .main-container,
.header-author-wrapper .main-container,
.p-user .main-container,
.p-author .main-container { width: 100%; }
/* 顶栏内唯一可让的弹性项：搜索框，允许其收缩，避免子项顶开父级 */
.header-user-wrapper .search-box,
.header-author-wrapper .search-box { flex: 0 1 auto; min-width: 0; }
.header-user-wrapper .search-box input,
.header-author-wrapper .search-box input { min-width: 0; }