/* ==========================================================================
   account.css — 账号体系（登录/注册/个人中心/充值/列表/提示页）
   PC 端专用；WAP 端样式在 darkm/app.css 内。
   ========================================================================== */

/* ---------------- 登录 / 注册 ---------------- */
.auth-page { min-height: calc(100vh - 200px); display: flex; align-items: center; }
.auth-wrap { max-width: 460px; margin-inline: auto; }

.auth-tabs {
  display: flex; gap: var(--sd-s1);
  padding: var(--sd-s1);
  margin-bottom: var(--sd-s6);
  border-radius: var(--sd-r-full);
  background: var(--surface);
  border: 1px solid var(--border);
}
.auth-tab {
  flex: 1; height: 38px;
  border-radius: var(--sd-r-full);
  font-size: var(--sd-fs-cap);
  color: var(--text-2);
  transition: all var(--sd-dur) var(--sd-ease);
}
.auth-tab:hover { color: var(--text); }
.auth-tab.is-on { background: var(--primary); color: var(--on-primary); font-weight: 700; }

.auth-panel { display: none; }
.auth-panel.is-on { display: block; animation: fade-in .3s var(--sd-ease); }

.auth-title {
  font-family: var(--font-display);
  font-size: 30px; font-weight: 700;
  margin-bottom: var(--sd-s1);
}
.auth-sub {
  font-size: var(--sd-fs-cap);
  color: var(--text-3);
  margin-bottom: var(--sd-s6);
}

.auth-field { margin-bottom: var(--sd-s4); }
.auth-label {
  display: block;
  font-size: var(--sd-fs-micro);
  color: var(--text-3);
  margin-bottom: var(--sd-s2);
}

.auth-input {
  width: 100%; height: 46px;
  padding: 0 var(--sd-s4);
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--sd-r-md);
  color: var(--text);
  font-size: var(--sd-fs-body);
  transition: border-color var(--sd-dur) var(--sd-ease);
}
.auth-input:focus {
  outline: none;
  border-color: var(--primary);
  background: var(--surface-2);
}
.auth-input::placeholder { color: var(--text-3); }

.auth-input-wrap { position: relative; display: flex; align-items: center; }
.auth-input-wrap .auth-input { padding-right: 68px; }

.auth-eye {
  position: absolute; right: var(--sd-s2);
  height: 32px; padding: 0 var(--sd-s3);
  border-radius: var(--sd-r-sm);
  font-size: var(--sd-fs-micro);
  color: var(--text-3);
  background: var(--surface-2);
}
.auth-eye:hover { color: var(--primary); }

.auth-code-btn {
  position: absolute; right: var(--sd-s2);
  height: 32px; padding: 0 var(--sd-s3);
  border-radius: var(--sd-r-sm);
  font-size: var(--sd-fs-micro);
  color: var(--primary);
  background: rgba(255, 177, 61, .12);
}
.auth-code-btn:disabled { color: var(--text-3); background: var(--surface-2); }

.auth-verify {
  position: absolute; right: var(--sd-s1);
  width: 96px; height: 38px;
  border-radius: var(--sd-r-sm);
  cursor: pointer;
  object-fit: cover;
}

.auth-row {
  display: flex; align-items: center; justify-content: space-between;
  margin-bottom: var(--sd-s5);
  font-size: var(--sd-fs-micro);
}
.auth-check { display: flex; align-items: center; gap: var(--sd-s2); color: var(--text-2); cursor: pointer; }

.auth-link { color: var(--primary); }
.auth-link:hover { text-decoration: underline; }

.auth-submit { width: 100%; height: 48px; }

.auth-alt {
  margin-top: var(--sd-s5);
  text-align: center;
  font-size: var(--sd-fs-cap);
  color: var(--text-3);
}

.auth-cards { margin-bottom: var(--sd-s4); }
.auth-card-empty {
  padding: var(--sd-s5);
  text-align: center;
  font-size: var(--sd-fs-micro);
  color: var(--text-3);
  background: var(--surface);
  border: 1px dashed var(--border);
  border-radius: var(--sd-r-md);
}

/* ---------------- 个人中心 ---------------- */
.uc-head {
  display: flex; align-items: center; gap: var(--sd-s5);
  padding: var(--sd-s6);
  margin-bottom: var(--sd-s6);
  border-radius: var(--sd-r-lg);
  background: linear-gradient(135deg, rgba(255,177,61,.10), var(--surface) 62%);
  border: 1px solid var(--border);
}

.uc-avatar {
  width: 64px; height: 64px;
  border-radius: 50%;
  background: linear-gradient(135deg, var(--sd-brand), var(--sd-gold-deep));
  color: var(--sd-on-brand);
  display: grid; place-items: center;
  font-family: var(--font-display);
  font-size: 24px; font-weight: 700;
  flex-shrink: 0;
}

.uc-id { flex: 1; min-width: 0; }
.uc-name {
  font-family: var(--font-display);
  font-size: var(--sd-fs-title); font-weight: 700;
  margin-bottom: var(--sd-s1);
}
.uc-meta { font-size: var(--sd-fs-micro); color: var(--text-3); }
.uc-vip {
  display: inline-block; padding: 1px 7px;
  border-radius: var(--sd-r-full);
  background: var(--primary); color: var(--on-primary);
  font-weight: 700;
}

.uc-points { text-align: right; }
.uc-points__num {
  display: block;
  font-family: var(--font-num);
  font-size: 36px; font-weight: 700; line-height: 1;
  color: var(--primary);
}
.uc-points__label { font-size: var(--sd-fs-micro); color: var(--text-3); }

/* 功能宫格 */
.uc-nav {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: var(--sd-s3);
}
.uc-nav__item {
  display: flex; flex-direction: column; align-items: center; gap: var(--sd-s2);
  padding: var(--sd-s5) var(--sd-s2);
  border-radius: var(--sd-r-md);
  background: var(--surface);
  border: 1px solid var(--border);
  font-size: var(--sd-fs-micro);
  color: var(--text-2);
  transition: all var(--sd-dur) var(--sd-ease);
}
.uc-nav__item:hover {
  border-color: var(--primary);
  color: var(--text);
  transform: translateY(-2px);
}
.uc-nav__item i { font-style: normal; font-size: var(--sd-fs-cap); }
.uc-nav__ico {
  width: 26px; height: 26px;
  border-radius: var(--sd-r-sm);
  background: var(--surface-2);
}

/* 我的页底部轮播广告（user_bottom · 与 WAP 同源 theater_banner 分部） */
.mth-banner { position: relative; border-radius: var(--sd-r-lg); overflow: hidden; }
.mth-banner-slide { display: none; position: relative; }
.mth-banner-slide.is-on { display: block; }
.mth-banner-slide img { display: block; width: 100%; height: 120px; object-fit: cover; }
.mth-ad-flag {
  position: absolute; top: 8px; right: 10px;
  padding: 2px 7px; border-radius: var(--sd-r-sm);
  background: rgba(0,0,0,.55); color: rgba(255,255,255,.8); font-size: 11px;
}
.mth-banner-dots {
  position: absolute; bottom: 10px; left: 50%; transform: translateX(-50%);
  display: flex; gap: 6px; z-index: 2;
}
.mth-banner-dots button {
  width: 22px; height: 5px; padding: 0; border: 0; border-radius: var(--sd-r-full);
  background: rgba(255,255,255,.5); cursor: pointer;
}
.mth-banner-dots button.is-on { background: var(--sd-gold); }
.mth-banner-dots button:focus-visible { outline: 2px solid var(--sd-gold); outline-offset: 2px; }

/* ---------------- 列表页 ---------------- */
.uc-rows { display: flex; flex-direction: column; gap: var(--sd-s3); }

.uc-rows__item {
  display: flex; align-items: center; gap: var(--sd-s4);
  padding: var(--sd-s3);
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--sd-r-md);
  transition: border-color var(--sd-dur) var(--sd-ease);
}
.uc-rows__item:hover { border-color: var(--sd-line); }

.uc-rows__link { display: flex; align-items: center; gap: var(--sd-s3); flex: 1; min-width: 0; }
.uc-rows__pic {
  width: 60px; height: 80px;
  border-radius: var(--sd-r-sm);
  overflow: hidden; flex-shrink: 0;
  background: var(--surface-2);
}
.uc-rows__pic img { width: 100%; height: 100%; object-fit: cover; }

.uc-rows__main { flex: 1; min-width: 0; }
.uc-rows__name {
  display: block;
  font-size: var(--sd-fs-cap);
  margin-bottom: var(--sd-s1);
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.uc-rows__sub { font-size: var(--sd-fs-micro); color: var(--text-3); }

.uc-rows__amt {
  font-family: var(--font-num);
  font-size: var(--sd-fs-title); font-weight: 700;
  color: var(--primary);
}
.uc-rows__amt.is-minus { color: var(--sd-bad); }

.btn-sm { height: 32px; padding: 0 var(--sd-s4); font-size: var(--sd-fs-micro); }

/* ---------------- 充值 ---------------- */
.buy-amounts {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: var(--sd-s3);
  margin-bottom: var(--sd-s6);
}
.buy-amount {
  display: flex; align-items: baseline; justify-content: center; gap: var(--sd-s1);
  height: 76px;
  border-radius: var(--sd-r-md);
  background: var(--surface);
  border: 1px solid var(--border);
  cursor: pointer;
  transition: all var(--sd-dur) var(--sd-ease);
}
.buy-amount input { position: absolute; opacity: 0; }
.buy-amount:has(input:checked) { border-color: var(--primary); background: rgba(255,177,61,.10); }
.buy-amount__num { font-family: var(--font-num); font-size: 28px; font-weight: 700; }
.buy-amount__unit { font-size: var(--sd-fs-micro); color: var(--text-3); }
.buy-amount--custom { flex-direction: column; gap: var(--sd-s2); padding: var(--sd-s2); }
.buy-amount--custom .auth-input { height: 30px; text-align: center; }

.buy-card {
  margin-top: var(--sd-s6);
  padding: var(--sd-s5);
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--sd-r-md);
}
.buy-card__title { font-size: var(--sd-fs-cap); font-weight: 700; margin-bottom: var(--sd-s4); }
.buy-row { display: grid; grid-template-columns: 1fr 1fr auto; gap: var(--sd-s3); }

/* ---------------- 跳转 / 提示 / 错误 ---------------- */
.jump-box, .msg-box {
  min-height: 60vh;
  display: flex; flex-direction: column;
  align-items: center; justify-content: center;
  text-align: center;
  gap: var(--sd-s3);
}
.jump-spinner {
  width: 34px; height: 34px;
  border: 3px solid var(--surface-2);
  border-top-color: var(--primary);
  border-radius: 50%;
  animation: spin .8s linear infinite;
}
.jump-text { color: var(--text-3); font-size: var(--sd-fs-cap); }

.msg-icon {
  width: 56px; height: 56px;
  border-radius: 50%;
  background: var(--primary);
  color: var(--on-primary);
  display: grid; place-items: center;
  font-size: 30px; font-weight: 700;
}
.msg-icon--err { background: var(--sd-bad); color: #fff; }
.msg-title { font-family: var(--font-display); font-size: var(--sd-fs-title); font-weight: 700; }
.msg-text { color: var(--text-3); font-size: var(--sd-fs-cap); max-width: 420px; }
.msg-act { margin-top: var(--sd-s4); }


/* ---------------- 分页（数据源 __PAGING__） ---------------- */
.pager {
  display: flex; align-items: center; justify-content: center;
  gap: var(--sd-s1);
  margin-top: var(--sd-s6);
  font-size: var(--sd-fs-cap);
}
.pager a, .pager span {
  min-width: 34px; height: 34px;
  padding-inline: var(--sd-s2);
  display: inline-flex; align-items: center; justify-content: center;
  border-radius: var(--sd-r-sm);
  background: var(--surface);
  color: var(--text-2);
}
.pager a:hover { background: var(--surface-2); color: var(--text); }
.pager .is-on { background: var(--primary); color: var(--on-primary); font-weight: 700; }
.pager .is-off { opacity: .4; cursor: not-allowed; }
.pager__total {
  margin-left: var(--sd-s3);
  background: none;
  color: var(--text-3);
  font-size: var(--sd-fs-micro);
}


/* ---------------- 支付方式选择（user/pay） ---------------- */
.pay-sum__row {
  display: flex; align-items: center; justify-content: space-between;
  padding: var(--sd-s2) 0;
  font-size: var(--sd-fs-cap);
  color: var(--text-3);
  border-bottom: 1px dashed var(--border);
}
.pay-sum__row:last-child { border-bottom: none; }
.pay-sum__row b { color: var(--text); }
.pay-sum__amt { color: var(--primary) !important; font-size: var(--sd-fs-title); }

.pay-methods {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: var(--sd-s3);
}
.pay-method {
  display: flex; align-items: center; justify-content: center;
  height: 60px;
  border-radius: var(--sd-r-md);
  background: var(--surface);
  border: 1px solid var(--border);
  cursor: pointer;
  transition: all var(--sd-dur) var(--sd-ease);
}
.pay-method input { position: absolute; opacity: 0; }
.pay-method:has(input:checked) { border-color: var(--primary); background: rgba(255,177,61,.10); }
.pay-method__name { font-size: var(--sd-fs-cap); }

/* 未开通能力的说明块 */
.cap-note {
  padding: var(--sd-s4) var(--sd-s5);
  border-radius: var(--sd-r-md);
  background: var(--surface-2);
  border: 1px dashed var(--border);
  font-size: var(--sd-fs-micro);
  line-height: 1.8;
  color: var(--text-3);
  margin-bottom: var(--sd-s4);
}


/* ==========================================================================
   榜单页（vod/rank）—— 目标站实测：H1 51.2px / nav 457x44 gap8 / 范围 184x38
   ========================================================================== */
.rank-page { margin-top: 0; padding-block: var(--sd-s3) var(--sd-s9); }  /* 顶部 12px：抵消 .section 首页用的 margin-top:56px，头部与页标题间距收紧 */

/* 用户中心各页（index/plays/favs/checkin/invite/plog 等）：同样是首屏 .section，统一抵消 margin-top:56px 收紧头部间距 */
.up-page { margin-top: 0; padding-top: var(--sd-s3); }

.rank-h1 {
  font-family: var(--font-display);
  font-size: var(--sd-fs-page-h1, 51.2px);
  font-weight: 700;
  line-height: 1.1;
  margin-bottom: var(--sd-s5);
}

.rank-nav {
  display: inline-flex;
  gap: 8px;
  margin-bottom: var(--sd-s3);
}
.rank-nav__item {
  display: inline-flex; align-items: center; justify-content: center;
  min-width: 86px; height: 44px;
  padding: 0 var(--sd-s4);
  border-radius: var(--sd-r-md);
  background: var(--surface);
  border: 1px solid var(--border);
  color: var(--text-2);
  font-size: var(--sd-fs-cap);
  transition: all var(--sd-dur) var(--sd-ease);
}
.rank-nav__item:hover { border-color: var(--primary); color: var(--text); }
.rank-nav__item.is-on {
  background: var(--primary); border-color: var(--primary);
  color: var(--on-primary); font-weight: 700;
}

.rank-periods { display: inline-flex; gap: 8px; margin-bottom: var(--sd-s5); }
.rank-period {
  display: inline-flex; align-items: center; justify-content: center;
  min-width: 56px; height: 38px;
  padding: 0 var(--sd-s3);
  border-radius: var(--sd-r-sm);
  background: var(--surface);
  border: 1px solid var(--border);
  color: var(--text-3);
  font-size: var(--sd-fs-cap);
  transition: all var(--sd-dur) var(--sd-ease);
}
.rank-period.is-on {
  background: rgba(255, 213, 61, .14);
  border-color: var(--primary);
  color: var(--primary);
  font-weight: 700;
}

.rank-note {
  padding: var(--sd-s3) var(--sd-s4);
  margin-bottom: var(--sd-s5);
  border-radius: var(--sd-r-md);
  background: var(--surface-2);
  border-left: 3px solid var(--primary);
  font-size: var(--sd-fs-micro);
  line-height: 1.7;
  color: var(--text-2);
}
.rank-note strong { color: var(--text); }

/* 前三名大卡 */
.rank-top {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: var(--sd-s4);
  margin-bottom: var(--sd-s7);
}
.rank-top__item {
  position: relative;
  display: block;
  border-radius: var(--sd-r-lg);
  overflow: hidden;
  background: var(--surface);
  border: 1px solid var(--border);
  transition: transform var(--sd-dur) var(--sd-ease);
}
.rank-top__item:hover { transform: translateY(-4px); }

.rank-top__pic { position: relative; display: block; aspect-ratio: 3 / 4; }
.rank-top__pic img { width: 100%; height: 100%; object-fit: cover; }
.rank-top__mask {
  position: absolute; inset: auto 0 0 0; height: 60%;
  background: linear-gradient(180deg, transparent, rgba(11, 12, 18, .92));
}
.rank-top__vip {
  position: absolute; top: 10px; left: 10px;
  padding: 2px 8px; border-radius: 10px;
  background: var(--primary); color: var(--on-primary);
  font-size: 11px; font-weight: 700;
}
.rank-top__no {
  position: absolute; left: 12px; bottom: 52px;
  font-family: var(--font-num);
  font-size: 42px; font-weight: 700; line-height: 1;
  color: var(--primary);
  text-shadow: 0 2px 8px rgba(0, 0, 0, .6);
}
.rank-top__item--1 .rank-top__no { color: #ffd53d; font-size: 52px; }
.rank-top__item--2 .rank-top__no { color: #d8dbe4; }
.rank-top__item--3 .rank-top__no { color: #d08b52; }

.rank-top__name {
  display: block;
  padding: var(--sd-s3) var(--sd-s4) 0;
  font-size: var(--sd-fs-cap);
  color: var(--text);
}
.rank-top__metric {
  display: block;
  padding: 2px var(--sd-s4) var(--sd-s3);
  font-size: var(--sd-fs-micro);
  color: var(--text-3);
}

/* 列表 */
.rank-list { display: flex; flex-direction: column; gap: var(--sd-s1); }
.rank-list__item { list-style: none; }
.rank-list__link {
  display: flex; align-items: center; gap: var(--sd-s4);
  padding: var(--sd-s3);
  border-radius: var(--sd-r-md);
  transition: background var(--sd-dur) var(--sd-ease);
}
.rank-list__link:hover { background: var(--surface); }

.rank-list__no {
  position: relative;
  width: 40px;
  flex-shrink: 0;
  font-family: var(--font-num);
  font-size: 22px; font-weight: 700;
  color: var(--text-3);
  text-align: center;
}
.rank-move {
  position: absolute; left: 50%; transform: translateX(-50%);
  top: -4px;
  font-size: 10px; font-style: normal; font-weight: 700;
}
.rank-move--up { color: #e5534b; }
.rank-move--down { color: #3fb950; }
.rank-move--flat { color: var(--text-3); }
.rank-move--new {
  background: var(--primary); color: var(--on-primary);
  padding: 0 5px; border-radius: 6px;
}

.rank-list__pic {
  position: relative;
  width: 60px; height: 80px;
  border-radius: var(--sd-r-sm);
  overflow: hidden; flex-shrink: 0;
  background: var(--surface-2);
}
.rank-list__pic img { width: 100%; height: 100%; object-fit: cover; }
/* 榜单 hover 预告视频：默认隐藏，鼠标移入（has-video）覆盖封面静音播放 */
.rank-card .rank-video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:none;z-index:2}
.rank-card.has-video .rank-video{display:block}
.rank-card .rank-top__pic img,.rank-card .rank-list__pic img{transition:opacity .18s ease}
.rank-card.has-video .rank-top__pic img,.rank-card.has-video .rank-list__pic img{opacity:0}
.rank-list__vip {
  position: absolute; top: 3px; left: 3px;
  padding: 0 5px; border-radius: 6px;
  background: var(--primary); color: var(--on-primary);
  font-size: 10px; font-weight: 700;
}

.rank-list__main { flex: 1; min-width: 0; }
.rank-list__name {
  display: block;
  font-size: var(--sd-fs-cap);
  margin-bottom: var(--sd-s1);
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.rank-list__sub { font-size: var(--sd-fs-micro); color: var(--text-3); }
.rank-list__metric {
  font-family: var(--font-num);
  font-size: var(--sd-fs-micro);
  color: var(--text-2);
  flex-shrink: 0;
}


/* ==========================================================================
   福利中心（user/welfare）—— 目标站实测 H1 51.84px / 分组 26px / 侧栏 24px
   ========================================================================== */
.welfare-page { padding-block: var(--sd-s6) var(--sd-s9); }

.welfare-h1 {
  font-family: var(--font-display);
  font-size: var(--sd-fs-page-h1, 51.2px);
  font-weight: 700;
  line-height: 1.1;
  margin-bottom: var(--sd-s5);
}

.welfare-h2 {
  font-family: var(--font-display);
  font-size: 26px;
  font-weight: 700;
  margin-bottom: var(--sd-s4);
}

.welfare-top {
  display: flex; gap: var(--sd-s7);
  padding: var(--sd-s5) var(--sd-s6);
  margin-bottom: var(--sd-s7);
  border-radius: var(--sd-r-lg);
  background: linear-gradient(135deg, rgba(255,177,61,.12), var(--surface) 60%);
  border: 1px solid var(--border);
}
.welfare-top__item { display: flex; flex-direction: column; gap: 4px; }
.welfare-top__label { font-size: var(--sd-fs-micro); color: var(--text-3); }
.welfare-top__num {
  font-family: var(--font-num);
  font-size: 30px; font-weight: 700; line-height: 1;
  color: var(--primary);
}

.welfare-block { margin-bottom: var(--sd-s8); }

/* 签到 */
.welfare-sign {
  display: flex; gap: var(--sd-s6); align-items: flex-start;
  padding: var(--sd-s5);
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--sd-r-lg);
}
.welfare-sign__cal {
  flex: 1;
  display: grid;
  grid-template-columns: repeat(10, 1fr);
  gap: 6px;
}
.welfare-cal__day {
  aspect-ratio: 1;
  display: grid; place-items: center;
  border-radius: var(--sd-r-sm);
  background: var(--surface-2);
  font-size: var(--sd-fs-micro);
  color: var(--text-3);
}
.welfare-cal__day.is-signed { background: var(--primary); color: var(--on-primary); font-weight: 700; }
.welfare-cal__day.is-today { outline: 2px solid var(--primary); outline-offset: -2px; }
.welfare-cal__day.is-future { opacity: .35; }

.welfare-sign__act { width: 180px; text-align: center; }
.welfare-sign__act .btn { width: 100%; }
.welfare-sign__hint { margin-top: 10px; font-size: var(--sd-fs-micro); color: var(--text-3); }

/* 里程碑 */
.welfare-mile { display: flex; flex-wrap: wrap; gap: var(--sd-s2); margin-top: var(--sd-s4); }
.welfare-mile__item {
  display: inline-flex; align-items: center; gap: var(--sd-s2);
  padding: var(--sd-s2) var(--sd-s3);
  border-radius: var(--sd-r-sm);
  background: var(--surface);
  border: 1px solid var(--border);
  font-size: var(--sd-fs-micro);
  color: var(--text-2);
}
.welfare-mile__item.is-done { border-color: var(--primary); color: var(--text); }
.welfare-mile__points { color: var(--primary); font-weight: 700; }
.welfare-mile__ok { color: var(--text-3); }

/* 任务 */
.welfare-tasks { display: flex; flex-direction: column; gap: var(--sd-s2); }
.welfare-task {
  display: flex; align-items: center; gap: var(--sd-s4);
  padding: var(--sd-s4);
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--sd-r-md);
}
.welfare-task.is-done { opacity: .68; }
.welfare-task__main { flex: 1; min-width: 0; }
.welfare-task__name { font-size: var(--sd-fs-cap); margin-bottom: 4px; }
.welfare-task__desc { font-size: var(--sd-fs-micro); color: var(--text-3); }
.welfare-task__bar {
  position: relative;
  height: 4px; margin-top: 8px;
  border-radius: 2px;
  background: var(--surface-2);
}
.welfare-task__bar i {
  display: block; height: 100%;
  border-radius: 2px;
  background: var(--primary);
}
.welfare-task__bar span {
  position: absolute; right: 0; top: -18px;
  font-size: 10px; color: var(--text-3);
}
.welfare-task__right { text-align: right; flex-shrink: 0; }
.welfare-task__points {
  font-family: var(--font-num);
  font-size: var(--sd-fs-title); font-weight: 700;
  color: var(--primary);
}
.welfare-task__btn {
  margin-top: 6px;
  height: 32px; padding: 0 var(--sd-s4);
  border-radius: var(--sd-r-sm);
  background: var(--surface-2);
  color: var(--text-2);
  font-size: var(--sd-fs-micro);
}
.welfare-task__btn:hover { border: 1px solid var(--primary); color: var(--primary); }
.welfare-task__done { display: block; margin-top: 6px; font-size: var(--sd-fs-micro); color: var(--text-3); }

/* 邀请 */
.welfare-invite {
  padding: var(--sd-s5);
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--sd-r-lg);
}
.welfare-invite__code {
  display: flex; align-items: center; justify-content: space-between;
  height: 48px; padding: 0 var(--sd-s5);
  margin-bottom: var(--sd-s4);
  border-radius: var(--sd-r-md);
  background: var(--surface-2);
  border: 1px solid var(--border);
}
.welfare-invite__label { font-size: var(--sd-fs-micro); color: var(--text-3); }
.welfare-invite__val {
  font-family: var(--font-num);
  font-size: var(--sd-fs-title); font-weight: 700;
  color: var(--primary);
  letter-spacing: .08em;
}
.welfare-invite__acts { display: flex; gap: var(--sd-s3); }
.welfare-invite__note { margin-top: var(--sd-s3); font-size: var(--sd-fs-micro); color: var(--text-3); line-height: 1.7; }
.welfare-invite__note strong { color: #d9534f; }

.welfare-skeleton { height: 74px; border-radius: var(--sd-r-md); background: var(--surface); border: 1px solid var(--border); }
.welfare-empty { padding: var(--sd-s5); text-align: center; color: var(--text-3); font-size: var(--sd-fs-micro); }


/* ---------------- 版权投诉 / 客服留言 ---------------- */
.cr-h1 {
  font-family: var(--font-display);
  font-size: var(--sd-fs-page-h1, 51.2px);
  font-weight: 700;
  line-height: 1.1;
  margin-bottom: var(--sd-s5);
  text-align: center;
}
.cr-form textarea.auth-input { line-height: 1.7; }
.vip-note__link { color: var(--primary); }


/* ==========================================================================
   AI 智能问答（index/ai_chat）—— 目标站实测 H1 51.84px / 分区 28px / 侧栏 24px
   ========================================================================== */
.ai-page { padding-block: var(--sd-s6) var(--sd-s9); }

.ai-h1 {
  font-family: var(--font-display);
  font-size: var(--sd-fs-page-h1, 51.2px);
  font-weight: 700;
  line-height: 1.1;
  margin-bottom: var(--sd-s6);
}
.ai-h2 {
  font-family: var(--font-display);
  font-size: 28px;
  font-weight: 700;
  margin-bottom: var(--sd-s2);
}
.ai-h3 {
  font-size: var(--sd-fs-title);
  font-weight: 700;
  margin-bottom: var(--sd-s3);
  color: var(--text);
}

.ai-layout { display: grid; grid-template-columns: 1fr 300px; gap: var(--sd-s7); }

.ai-intro { margin-bottom: var(--sd-s4); }
.ai-intro__text { font-size: var(--sd-fs-cap); color: var(--text-3); }

.ai-thread {
  min-height: 320px;
  max-height: 560px;
  overflow-y: auto;
  padding: var(--sd-s5);
  margin-bottom: var(--sd-s4);
  border-radius: var(--sd-r-lg);
  background: var(--surface);
  border: 1px solid var(--border);
}
.ai-thread::-webkit-scrollbar { width: 6px; }
.ai-thread::-webkit-scrollbar-thumb { background: var(--surface-2); border-radius: 3px; }

.ai-msg { display: flex; margin-bottom: var(--sd-s4); }
.ai-msg--me { justify-content: flex-end; }
.ai-msg__body {
  max-width: 78%;
  padding: var(--sd-s3) var(--sd-s4);
  border-radius: var(--sd-r-md);
  font-size: var(--sd-fs-cap);
  line-height: 1.8;
}
.ai-msg--bot .ai-msg__body {
  background: var(--surface-2);
  color: var(--text-2);
  border: 1px solid var(--border);
}
.ai-msg--me .ai-msg__body {
  background: var(--primary);
  color: var(--on-primary);
  border: 1px solid var(--primary);
}

.ai-answer { color: var(--text); font-weight: 600; margin-bottom: var(--sd-s2); }
.ai-content { white-space: pre-wrap; color: var(--text-2); }
.ai-sub {
  margin: var(--sd-s4) 0 var(--sd-s2);
  font-size: var(--sd-fs-micro);
  color: var(--text-3);
}
.ai-empty { color: var(--text-3); }
.ai-trace {
  margin-top: var(--sd-s3);
  font-size: 10px;
  color: var(--text-3);
  opacity: .6;
  word-break: break-all;
}
.ai-typing { color: var(--text-3); }

/* 结果卡 */
.ai-cards {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(96px, 1fr));
  gap: var(--sd-s3);
  margin-top: var(--sd-s3);
}
.ai-card { text-align: center; }
.ai-card__pic {
  display: block;
  aspect-ratio: 3 / 4;
  border-radius: var(--sd-r-sm);
  overflow: hidden;
  background: var(--surface);
  margin-bottom: 5px;
}
.ai-card__pic img { width: 100%; height: 100%; object-fit: cover; }
.ai-card__name {
  display: block;
  font-size: var(--sd-fs-micro);
  color: var(--text);
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.ai-card__actor {
  display: block;
  font-size: 10px;
  color: var(--text-3);
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}

.ai-list { list-style: none; margin-top: var(--sd-s2); }
.ai-list a {
  display: flex; align-items: center; gap: var(--sd-s3);
  padding: var(--sd-s2);
  border-radius: var(--sd-r-sm);
  transition: background var(--sd-dur) var(--sd-ease);
}
.ai-list a:hover { background: var(--surface-2); }
.ai-list img {
  width: 44px; height: 58px;
  border-radius: 4px; object-fit: cover;
  flex-shrink: 0;
}
.ai-list__main { min-width: 0; }
.ai-list__main b {
  display: block;
  font-size: var(--sd-fs-cap);
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.ai-list__main i {
  font-style: normal;
  font-size: var(--sd-fs-micro);
  color: var(--text-3);
}

/* 输入 */
.ai-input { display: flex; gap: var(--sd-s3); margin-bottom: var(--sd-s3); }
.ai-input__field {
  flex: 1; height: 48px;
  padding: 0 var(--sd-s5);
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--sd-r-full);
  color: var(--text);
  font-size: var(--sd-fs-body);
}
.ai-input__field:focus { outline: none; border-color: var(--primary); }
.ai-input__btn { height: 48px; padding-inline: var(--sd-s7); flex-shrink: 0; }

.ai-suggest { display: flex; flex-wrap: wrap; gap: var(--sd-s2); }
.ai-suggest__item {
  padding: 5px 12px;
  border-radius: var(--sd-r-full);
  background: var(--surface);
  border: 1px solid var(--border);
  font-size: var(--sd-fs-micro);
  color: var(--text-3);
}
.ai-suggest__item:hover { border-color: var(--primary); color: var(--primary); }

/* 右侧 */
.ai-side__nav { display: flex; flex-direction: column; gap: 2px; margin-bottom: var(--sd-s6); }
.ai-side__item {
  padding: var(--sd-s3) var(--sd-s4);
  border-radius: var(--sd-r-sm);
  font-size: var(--sd-fs-cap);
  color: var(--text-2);
}
.ai-side__item:hover { background: var(--surface); color: var(--text); }
.ai-side__item.is-on { background: rgba(255,213,61,.12); color: var(--primary); font-weight: 700; }

.ai-hot { list-style: none; }
.ai-hot button {
  width: 100%; text-align: left;
  padding: var(--sd-s2) 0;
  font-size: var(--sd-fs-micro);
  color: var(--text-3);
}
.ai-hot button:hover { color: var(--primary); }


/* AI：游客功能说明与额度提示 */
.ai-feats { list-style: none; margin-bottom: var(--sd-s6); }
.ai-feats li {
  position: relative;
  padding: var(--sd-s3) var(--sd-s4) var(--sd-s3) var(--sd-s6);
  margin-bottom: var(--sd-s2);
  border-radius: var(--sd-r-md);
  background: var(--surface);
  border: 1px solid var(--border);
  font-size: var(--sd-fs-cap);
  color: var(--text-2);
  line-height: 1.7;
}
.ai-feats li::before {
  content: "";
  position: absolute; left: 18px; top: 18px;
  width: 5px; height: 9px;
  border-right: 2px solid var(--primary);
  border-bottom: 2px solid var(--primary);
  transform: rotate(45deg);
}
.ai-feats b { color: var(--text); margin-right: 6px; }

.ai-quota {
  margin-top: var(--sd-s3);
  font-size: var(--sd-fs-micro);
  color: var(--text-3);
}

/* ===== 个人中心：统计 + 身份卡弹层（与 WAP 同源） ===== */
.uc-stat { display: flex; flex-direction: column; align-items: center; margin-left: 22px; }
.uc-stat b { font-size: 22px; font-weight: 800; color: #fff; }
.uc-stat span { font-size: 12px; color: rgba(255,255,255,.55); margin-top: 2px; }

.mme-idmask { position: fixed; inset: 0; z-index: 1500; background: rgba(0,0,0,.62); display: grid; place-items: center; padding: 24px; }
.mme-idmask[hidden] { display: none !important; }
.uc-iddlg {
  width: 380px; max-width: 92vw; background: #181a24;
  border: 1px solid rgba(255,255,255,.08); border-radius: 16px; padding: 20px 22px;
}
.mme-idsheet__head { display: flex; align-items: flex-start; justify-content: space-between; }
.mme-idsheet__head b { font-size: 17px; color: #fff; }
.mme-idsheet__head p { margin: 4px 0 0; font-size: 12px; color: rgba(255,255,255,.5); }
.mme-idsheet__x { border: 0; background: rgba(255,255,255,.08); color: rgba(255,255,255,.7); width: 30px; height: 30px; border-radius: 50%; font-size: 16px; cursor: pointer; }
.mme-idcard {
  margin-top: 14px; border: 1px solid rgba(247,201,72,.45); border-radius: 16px;
  background: linear-gradient(160deg, #1c1e2a, #12131b);
  padding: 16px 16px 14px; text-align: center;
}
.mme-idcard__tag { display: inline-flex; align-items: center; gap: 5px; font-size: 12px; color: #f7c948; }
.mme-idcard__idlabel { margin-top: 10px; font-size: 11px; letter-spacing: 2px; color: rgba(255,255,255,.45); }
.mme-idcard__id { margin-top: 2px; font-size: 34px; font-weight: 800; letter-spacing: 2px; color: #fff; }
.mme-idcard__qr { width: 168px; margin: 12px auto 0; border-radius: 10px; overflow: hidden; }
.mme-idcard__qr canvas { display: block; width: 100%; height: auto; }
.mme-idcard__hint { margin-top: 10px; font-size: 11px; color: rgba(255,255,255,.45); }
.mme-idsave {
  width: 100%; height: 44px; margin-top: 14px; border: 0; border-radius: 999px;
  background: linear-gradient(135deg, #f7c948, #f0a823); color: #14100a;
  font-size: 14px; font-weight: 700; cursor: pointer;
}
.mme-idfoot { margin-top: 10px; text-align: center; font-size: 11px; color: rgba(255,255,255,.4); }

/* ===== 福利中心：目标站两列布局（pc-welfare.png 实测） ===== */
.welfare-eyebrow { font-size: 11px; letter-spacing: 3px; color: var(--text-3, #6f7384); margin-bottom: 2px; }
.welfare-cols { display: grid; grid-template-columns: 1.35fr 1fr; gap: 22px; align-items: start; margin-top: 18px; }
.welfare-col-l, .welfare-col-r { min-width: 0; }
.welfare-col-l .welfare-block, .welfare-col-r .welfare-block { margin-bottom: 18px; }

/* 金币金卡 */
.welfare-coin {
  border-radius: 16px; padding: 26px 28px 22px; margin-bottom: 18px;
  background: linear-gradient(135deg, #ffd53d, #f5a623 60%, #e8890c);
  color: #2b1a06; position: relative; overflow: hidden;
}
.welfare-coin::after {
  content: ""; position: absolute; right: -50px; top: -70px;
  width: 240px; height: 240px; border-radius: 50%;
  background: rgba(255,255,255,.14);
}
.welfare-coin__label { font-size: 13px; font-weight: 600; opacity: .85; }
.welfare-coin__num { font-size: 52px; font-weight: 900; line-height: 1.1; margin-top: 2px; }
.welfare-coin__sub { margin-top: 8px; font-size: 12px; opacity: .8; }
.welfare-coin__sub b { font-weight: 800; }

/* 邀请卡 */
.welfare-invite { display: flex; gap: 22px; align-items: center; }
.welfare-invite__l { flex: 1; min-width: 0; }
.welfare-invite__desc { font-size: 13px; color: var(--text-2, #a9acb8); margin: 0 0 12px; }
.welfare-invite__coderow {
  display: flex; align-items: center; gap: 10px;
  background: var(--sd-bg-2, #15161f); border: 1px solid rgba(255,255,255,.08);
  border-radius: 10px; padding: 10px 14px; margin-bottom: 12px;
}
.welfare-invite__label { font-size: 12px; color: var(--text-3, #6f7384); }
.welfare-invite__val { font-size: 18px; font-weight: 800; color: var(--primary, #ffd53d); letter-spacing: 1px; }
.welfare-invite__coderow .btn { margin-left: auto; }
.welfare-invite__acts { display: flex; gap: 10px; flex-wrap: wrap; }
.welfare-invite__qr { flex: none; text-align: center; }
.welfare-invite__qrbox {
  width: 108px; height: 108px; border-radius: 10px; overflow: hidden;
  background: #fff; display: grid; place-items: center;
}
.welfare-invite__qrbox canvas { display: block; width: 100%; height: auto; }
.welfare-invite__qr span { display: block; margin-top: 6px; font-size: 11px; color: var(--text-3, #6f7384); }

/* 去充值入口 + 规则说明 */
.welfare-topup {
  display: flex; align-items: center; justify-content: space-between;
  padding: 14px 16px; border-radius: 12px; text-decoration: none;
  background: var(--sd-bg-2, #15161f); border: 1px solid rgba(255,255,255,.08);
  color: var(--text, #fff8e1); font-size: 13px; margin-bottom: 12px;
}
.welfare-topup span { color: var(--primary, #ffd53d); }
.welfare-note { font-size: 11px; line-height: 1.8; color: var(--text-3, #6f7384); }

.btn-sm { height: 28px; padding: 0 12px; font-size: 12px; }
.btn[disabled] { opacity: .45; cursor: not-allowed; }

/* 账户页筛选 tab（观看记录/金币明细） */
.uc-tabs { display: flex; gap: 8px; margin: 0 0 var(--sd-s4, 16px); flex-wrap: wrap; }
.uc-tab {
  display: inline-flex; align-items: center; height: 30px; padding: 0 14px;
  border-radius: 999px; font-size: 13px; color: var(--sd-t2, #a9acb8);
  background: var(--sd-bg2, #1b1d27); border: 1px solid transparent;
  text-decoration: none; transition: color .15s, border-color .15s;
}
.uc-tab:hover { color: var(--sd-t1, #fff8e1); }
.uc-tab.is-on { color: #2b1a06; background: var(--sd-gold, #ffd53d); font-weight: 600; }