@charset "UTF-8";
/* ============================================================
   一号模板 · 现代卡片风
   设计语言：浅灰底 + 白色圆角卡片 + 橙红强调 + 大留白
   ============================================================ */
:root {
  --s-bg: #F4F5F7;
  --s-bg-elev: #FFFFFF;
  --s-surface: #FFFFFF;
  --s-surface-2: #F8F9FB;
  --s-glass: rgba(255,255,255,.86);
  --s-side: #FFFFFF;
  --s-top: #FFFFFF;
  --s-sunken: #F1F3F6;
  --s-text: #17181C;
  --s-text-2: #5A616E;
  --s-text-3: #6E7583;      /* [2026-11-02] 加深：原 #8E95A3 白底仅 2.6，太浅看不清 */
  --s-text-3-ink: #565D6B;  /* [2026-11-02] 加深：原 #6B7280 */
  --s-text-4: #8A909C;      /* [2026-11-02] 加深：原 #A8AEBB（占位/极弱文字） */
  --s-line: #ECEEF2;
  --s-line-2: #F1F3F6;
  --s-line-3: #E2E5EB;
  --s-hover: #F5F6F8;
  --s-active: #EEF0F4;
  --s-sel: rgba(240,68,31,.08);
  --s-accent: #F0441F;
  --s-accent-h: #D93A16;
  --s-accent-d: #BF3413;
  --s-accent-fill: #F0441F;
  --s-accent-bg: #FFF1ED;
  --s-accent-bg-2: rgba(240,68,31,.06);
  --s-accent-line: rgba(240,68,31,.22);
  --s-accent-ring: 0 0 0 3px rgba(240,68,31,.12);
  --s-accent-ink: #C93A19;
  --s-accent-ink-h: #A82F13;
  --s-fill: #17181C;
  --s-fill-h: #2A2C33;
  --s-fill-t: #FFFFFF;
  --s-danger: #F04438;
  --s-danger-ink: #B42318;
  --s-ok: #12B981;
  --s-r: 16px;
  --s-r-s: 12px;
  --s-r-xs: 8px;
  --s-sh-1: 0 1px 2px rgba(16,24,40,.04), 0 6px 16px rgba(16,24,40,.05);
  --s-sh-2: 0 2px 4px rgba(16,24,40,.04), 0 12px 28px rgba(16,24,40,.07);
  --s-sh-3: 0 20px 48px rgba(16,24,40,.14);
  --s-h-header: 64px;
  --s-w-aside: 232px;
  --s-gap: 18px;
  --s-pad: 22px;
}

/* ---------------- 基础 ---------------- */
.tpl-two, .tpl-two body, body.tw-body {
  background: var(--s-bg) !important;
  color: var(--s-text);
  font-family: "HarmonyOS Sans SC", "HarmonyOS Sans", -apple-system, BlinkMacSystemFont, "PingFang SC", "Microsoft YaHei", sans-serif;
  -webkit-font-smoothing: antialiased;
}
.tw-body { margin: 0; padding: 0; }

/* ---------------- 顶栏 ---------------- */
.tw-header {
  position: fixed; top: 0; left: 0; right: 0; height: 64px; z-index: 1000;
  display: flex; align-items: center; justify-content: space-between;
  padding: 0 22px; background: rgba(255,255,255,.92);
  backdrop-filter: blur(18px) saturate(160%);
  border-bottom: 1px solid var(--s-line);
}
.tw-brand { display: flex; align-items: center; gap: 10px; text-decoration: none !important; }
.tw-brand-mark {
  width: 34px; height: 34px; border-radius: 11px; display: inline-flex; align-items: center; justify-content: center;
  background: linear-gradient(135deg, #FF6A3D, #F0441F); color: #fff; font-size: 16px;
  box-shadow: 0 6px 16px rgba(240,68,31,.28);
}
.tw-brand-text { font-size: 16px; font-weight: 700; color: var(--s-text); letter-spacing: -.01em; }
.tw-head-right { display: flex; align-items: center; gap: 14px; }
.tw-pill {
  display: inline-flex; align-items: center; gap: 6px; height: 34px; padding: 0 14px;
  border-radius: 999px; background: var(--s-accent-bg); color: var(--s-accent-ink) !important;
  font-size: 13px; font-weight: 600; text-decoration: none !important;
}
.tw-icon-btn {
  width: 34px; height: 34px; border-radius: 10px; display: inline-flex; align-items: center; justify-content: center;
  color: var(--s-text-2) !important; position: relative; text-decoration: none !important;
}
.tw-icon-btn:hover { background: var(--s-hover); color: var(--s-text) !important; }
.tw-dot { position: absolute; top: 3px; right: 2px; min-width: 16px; height: 16px; line-height: 16px; padding: 0 4px;
  border-radius: 999px; background: var(--s-accent); color: #fff; font-size: 10px; text-align: center; }
.tw-user { display: flex; align-items: center; gap: 8px; }
.tw-avatar { width: 30px; height: 30px; border-radius: 50%; object-fit: cover; border: 1px solid var(--s-line); }
.tw-uname { font-size: 13px; color: var(--s-text-2); max-width: 120px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.tw-menu-btn { display: none; width: 36px; height: 36px; border: 0; background: transparent; color: var(--s-text); font-size: 18px; }

/* ---------------- 侧栏 ---------------- */
.tw-aside {
  position: fixed !important; top: 64px; bottom: 0; left: 0; width: 232px !important; max-width: 82vw !important;
  background: #fff; border-right: 1px solid var(--s-line); overflow-y: auto; z-index: 900;
  padding: 14px 12px 28px; min-height: 0 !important;
}
.tw-nav { display: flex; flex-direction: column; gap: 2px; }
.tw-nav-label {
  font-size: 11px; font-weight: 700; letter-spacing: .08em; color: var(--s-text-4);
  padding: 16px 12px 6px; text-transform: uppercase;
}
.tw-nav-item {
  display: flex; align-items: center; gap: 11px; height: 42px; padding: 0 12px; border-radius: 12px;
  color: var(--s-text-2) !important; font-size: 14px; text-decoration: none !important; position: relative;
}
.tw-nav-item i { width: 18px; text-align: center; font-size: 15px; color: var(--s-text-3); }
.tw-nav-item:hover { background: var(--s-hover); color: var(--s-text) !important; }
.tw-nav-item.is-active { background: var(--s-accent-bg); color: var(--s-accent-ink) !important; font-weight: 600; }
.tw-nav-item.is-active i { color: var(--s-accent); }
.tw-nav-dot {
  margin-left: auto; min-width: 18px; height: 18px; line-height: 18px; padding: 0 5px; border-radius: 999px;
  background: var(--s-accent); color: #fff; font-size: 10px; font-weight: 700; text-align: center;
}
.tw-aside-mask { display: none; }

/* ---------------- 内容区 ---------------- */
.tw-app { min-height: 100vh; padding-top: 64px; box-sizing: border-box; }
.tw-content { margin-left: 232px !important; padding: 0 !important; background: transparent !important; }
.tw-content-body {
  width: 100% !important; max-width: none !important; margin: 0 !important;
  padding: 22px 28px 48px !important; box-sizing: border-box;
}
.tw-body .app-aside, .tw-body #aside { float: none; }

/* 让内容区里常见的旧容器自动变成卡片 */
.tpl-two .tw-content-body > div:not([class*="modal"]):not([class*="layer"]):not([class*="mask"]):not([class*="toast"]),
.tpl-two .tw-content-body > section,
.tpl-two .tw-content-body > form { }
.tpl-two .up-page { background: transparent !important; padding: 0 !important; }
.tpl-two .up-hero,
.tpl-two .card,
.tpl-two .panel,
.tpl-two .box { background: var(--s-surface); border: 1px solid var(--s-line); border-radius: var(--s-r);
  box-shadow: var(--s-sh-1); }
.tpl-two .up-hero { padding: 22px 24px !important; display: flex; align-items: center; gap: 16px; }
.tpl-two .up-hero-ico { width: 46px; height: 46px; border-radius: 14px; background: var(--s-accent-bg) !important;
  color: #0B7C57!important; display: inline-flex; align-items: center; justify-content: center; font-size: 19px; }
.tpl-two .up-hero-t { font-size: 19px; font-weight: 700; color: var(--s-text); margin: 0 0 4px; }
.tpl-two .up-hero-d { font-size: 13px; color: var(--s-text-3); margin: 0; }

/* 按钮 */
.tpl-two .btn { border-radius: 10px; font-weight: 600; border: 1px solid var(--s-line-3); box-shadow: none; }
.tpl-two .btn-primary, .tpl-two .btn-accent, .tpl-two .btn-success {
  background: var(--s-accent) !important; border-color: var(--s-accent) !important; color: #fff !important;
  box-shadow: 0 6px 16px rgba(240,68,31,.22);
}
.tpl-two .btn-primary:hover { background: var(--s-accent-h) !important; }
.tpl-two .btn-default { background: #fff; color: var(--s-text-2); }
.tpl-two .btn-default:hover { background: var(--s-hover); }
.tpl-two .btn-danger { background: var(--s-danger) !important; border-color: var(--s-danger) !important; }

/* 表单 */
.tpl-two .form-control, .tpl-two input[type=text], .tpl-two input[type=password], .tpl-two input[type=number],
.tpl-two input[type=email], .tpl-two select, .tpl-two textarea {
  border: 1px solid var(--s-line-3) !important; border-radius: 10px !important; box-shadow: none !important;
  background: #fff !important; color: var(--s-text) !important; height: auto; padding: 9px 12px;
}
.tpl-two .form-control:focus, .tpl-two input:focus, .tpl-two select:focus, .tpl-two textarea:focus {
  border-color: var(--s-accent) !important; box-shadow: var(--s-accent-ring) !important;
}

/* 表格 */
.tpl-two .table { background: #fff; border-radius: var(--s-r); overflow: hidden; margin-bottom: 0; }
.tpl-two .table > thead > tr > th { background: var(--s-surface-2); border-bottom: 1px solid var(--s-line);
  color: #6B6B70; font-weight: 600; font-size: 12.5px; padding: 12px 14px; }
.tpl-two .table > tbody > tr > td { border-top: 1px solid var(--s-line-2); padding: 13px 14px; vertical-align: middle; }
.tpl-two .table > tbody > tr:hover > td { background: var(--s-surface-2); }

/* 标签 / 徽章 */
.tpl-two .label { border-radius: 8px; font-weight: 600; padding: .28em .6em; }
.tpl-two .label-success, .tpl-two .label-primary { background: var(--s-accent-bg) !important; color: var(--s-accent-ink) !important; }

/* 分页 */
.tpl-two .pagination > li > a, .tpl-two .pagination > li > span { border-radius: 10px !important; margin: 0 3px;
  border: 1px solid var(--s-line-3); color: var(--s-text-2); }
.tpl-two .pagination > .active > a { background: var(--s-accent) !important; border-color: var(--s-accent) !important; color: #fff !important; }

/* 弹窗 */
.tpl-two .modal-content { border: 0; border-radius: var(--s-r); box-shadow: var(--s-sh-3); }
.tpl-two .modal-header { border-bottom: 1px solid var(--s-line-2); }
.tpl-two .modal-footer { border-top: 1px solid var(--s-line-2); }

/* 现代卡片辅助类（页面可直接用） */
.tw-card { background: #fff; border: 1px solid var(--s-line); border-radius: var(--s-r); box-shadow: var(--s-sh-1); }
.tw-card-pad { padding: 22px 24px; }
.tw-page-head { display: flex; align-items: flex-end; justify-content: space-between; gap: 16px; margin-bottom: 18px; }
.tw-page-title { font-size: 22px; font-weight: 700; letter-spacing: -.02em; margin: 0; color: var(--s-text); }
.tw-page-sub { font-size: 13px; color: var(--s-text-3); margin: 6px 0 0; }
.tw-grid { display: grid; gap: 16px; }
.tw-grid-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.tw-grid-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.tw-grid-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.tw-stat { background: #fff; border: 1px solid var(--s-line); border-radius: var(--s-r); padding: 18px 20px;
  box-shadow: var(--s-sh-1); }
.tw-stat-k { font-size: 12.5px; color: var(--s-text-3); margin-bottom: 8px; }
.tw-stat-v { font-size: 24px; font-weight: 700; letter-spacing: -.02em; color: var(--s-text); }
.tw-stat-v small { font-size: 13px; color: var(--s-text-3); font-weight: 500; margin-left: 4px; }
.tw-list { display: flex; flex-direction: column; }
.tw-list-item { display: flex; align-items: center; gap: 14px; padding: 14px 4px; border-bottom: 1px solid var(--s-line-2); }
.tw-list-item:last-child { border-bottom: 0; }
.tw-muted { color: var(--s-text-3); }
.tw-accent { color: var(--s-accent); }
.tw-empty { text-align: center; padding: 56px 20px; color: var(--s-text-3); }
.tw-empty i { font-size: 34px; color: var(--s-line-3); display: block; margin-bottom: 12px; }

/* 底部 tabbar（仅手机端显示） */
.tw-tabbar { display: none; }

/* ---------------- 手机端 ---------------- */
@media (max-width: 991px) {
  .tw-header { height: 56px; padding: 0 14px; }
  .tw-brand-text, .tw-uname { display: none; }
  .tw-menu-btn { display: inline-flex; align-items: center; justify-content: center; }
  .tw-app { padding-top: 56px; padding-bottom: 66px; }
  .tw-aside {
    top: 0 !important; bottom: 0; width: 268px !important;
    padding-top: calc(8px + env(safe-area-inset-top));
    transform: translateX(-104%); transition: transform .26s cubic-bezier(.32,.72,0,1); box-shadow: 0 0 40px rgba(16,24,40,.18);
  }
  .tw-aside.is-open { transform: translateX(0); }
  .tw-aside-mask { display: block; position: fixed; inset: 0; background: rgba(16,24,40,.42); z-index: 899;
    opacity: 0; pointer-events: none; transition: opacity .2s; }
  .tw-aside-mask.is-show { opacity: 1; pointer-events: auto; }
  .tw-content { margin-left: 0 !important; }
  .tw-content-body { padding: 14px 14px 24px !important; }
  .tw-page-title { font-size: 19px; }
  .tw-grid-4, .tw-grid-3 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .tw-tabbar {
    display: flex; position: fixed; left: 0; right: 0; bottom: 0; z-index: 950; height: 58px;
    padding-bottom: env(safe-area-inset-bottom); background: rgba(255,255,255,.96);
    backdrop-filter: blur(18px); border-top: 1px solid var(--s-line);
  }
  .tw-tab { flex: 1; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 2px;
    color: var(--s-text-3) !important; font-size: 11px; text-decoration: none !important; }
  .tw-tab i { font-size: 18px; }
  /* 统一图标：线性 SVG（与首页一致），用于公共底部导航 _tabbar.php */
  .tw-tab svg { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 1.8;
    stroke-linecap: round; stroke-linejoin: round; }
  .tw-tab.is-active { color: var(--s-accent) !important; font-weight: 600; }

  /* 正文底部留出底栏高度：滚动到底时最后一条内容不被底部导航遮住。
     整屏固定布局（下单/客服）的页面自己扣过高度，用 .tw-fixed-shell 排除，避免双层留白。 */
  body.tw-body:not(.tw-fixed-shell) { padding-bottom: calc(58px + env(safe-area-inset-bottom, 0px)); }
}

/* 维护页 */
.tw-maint { display: flex; align-items: center; justify-content: center; min-height: 100vh; background: var(--s-bg); }
.tw-maint-card { background: #fff; border-radius: 20px; padding: 44px 40px; text-align: center; box-shadow: var(--s-sh-2); max-width: 420px; }
.tw-maint-ico { font-size: 34px; margin-bottom: 14px; }
.tw-maint-card h1 { font-size: 20px; margin: 0 0 10px; color: var(--s-text); }
.tw-maint-card p { font-size: 14px; color: var(--s-text-3); line-height: 1.8; margin: 0; }

/* ============================================================
   页面级适配：把旧页面里写死的深色块改成二号的浅色语言
   ============================================================ */
.tpl-two .uc-hero {
  background: linear-gradient(135deg, #FFF3EE 0%, #FFE4D9 100%) !important;
  color: var(--s-text) !important;
  border: 1px solid rgba(240,68,31,.10);
  box-shadow: var(--s-sh-1) !important;
}
.tpl-two .uc-hero .uc-user-info h2,
.tpl-two .uc-hero .uc-hero-stat .label,
.tpl-two .uc-hero .uc-hero-stat .value,
.tpl-two .uc-hero .uc-hero-top,
.tpl-two .uc-hero .uc-hero-left { color: var(--s-text) !important; }
.tpl-two .uc-hero .uc-hero-stat .label { color: var(--s-text-3) !important; font-weight: 500 !important; }
.tpl-two .uc-hero .uc-hero-stats { border-top: 1px solid rgba(240,68,31,.14) !important; }
.tpl-two .uc-hero .uc-hero-stat { border-left-color: rgba(240,68,31,.14) !important; }
.tpl-two .uc-hero .uc-level-tip { color: var(--s-text-3) !important; }
.tpl-two .uc-hero .uc-avatar { background: #fff !important; border-color: rgba(240,68,31,.18) !important; }
.tpl-two .uc-hero .uc-btn-primary,
.tpl-two .uc-hero a.btn,
.tpl-two .uc-hero .uc-btn {
  background: #fff !important; color: var(--s-text) !important; border: 1px solid rgba(240,68,31,.18) !important;
  box-shadow: var(--s-sh-1);
}
.tpl-two .uc-hero .uc-btn-primary:hover,
.tpl-two .uc-hero a.btn:hover { background: var(--s-accent-bg) !important; color: var(--s-accent-ink) !important; }
.tpl-two .uc-hero .user-level-tag { background: rgba(240,68,31,.12) !important; color: var(--s-accent-ink) !important; }

/* 首页快捷入口 */
.tpl-two .uc-quick-item { border: 1px solid var(--s-line); border-radius: 14px; box-shadow: none; }
.tpl-two .uc-quick-item:hover { box-shadow: var(--s-sh-2); border-color: rgba(240,68,31,.18); }
.tpl-two .uc-quick-icon { border-radius: 13px; background: var(--s-accent-bg) !important; color: #0B7C57!important; }

/* 通用：页面上常见的白底面板统一圆角与描边 */
.tpl-two .uc-section .uc-site-card,
.tpl-two .uc-security-tip,
.tpl-two .uc-announce,
.tpl-two .uc-card { border: 1px solid var(--s-line) !important; border-radius: var(--s-r) !important; box-shadow: var(--s-sh-1) !important; }

/* 内容区最大宽度收敛，避免大屏过散 */
@media (min-width: 1200px) {
  .tpl-two .tw-content-body > .uc-container { max-width: 1120px; }
}
/* 账号信息、公告文字对比度修正 */
.tpl-two .uc-hero .uc-hero-meta,
.tpl-two .uc-hero .uc-hero-meta * { color: var(--s-text-3) !important; }
.tpl-two .uc-notice-text { color: #3D4451 !important; font-size: 13.5px !important; line-height: 1.85 !important; opacity: 1 !important; }
/* [2026-11-02] 公告卡固定为完全不透明、不做入场淡入：原来继承 ucNoticeIn 的 opacity 动画，
   某些情况下会停在半透明状态，正文看着发灰发虚 */
.tpl-two .uc-notice-card { filter: none !important; opacity: 1 !important; animation: none !important; }
.tpl-two .uc-notice-text * { color: #3D4451 !important; }
.tpl-two .uc-notice-title { color: #17181C !important; }
/* ---- 下单页（独立整页）配色对齐二号 ---- */
.tpl-two .bp-item-buy { background: var(--s-accent-bg) !important; color: var(--s-accent-ink) !important; }
.tpl-two .bp-item-buy:hover { background: var(--s-accent) !important; color: #fff !important; }
.tpl-two .bp-badge.api { background: var(--s-accent-bg) !important; color: var(--s-accent-ink) !important; }
.tpl-two .bp-srcitem.active { background: var(--s-accent) !important; color: #fff !important; }
.tpl-two .bp-srcitem.active * { color: #fff !important; }
.tpl-two .bp-cat-item.active { background: var(--s-accent-bg) !important; color: var(--s-accent-ink) !important; }
.tpl-two .bp-search-btn,
.tpl-two .bp-search-submit { background: var(--s-accent) !important; color: #fff !important; border-color: var(--s-accent) !important; }
/* 大屏铺满：内容区不再限宽 */
@media (min-width: 1200px) {
  .tw-content-body { padding: 22px 32px 56px !important; }
}
.tpl-two .tw-content-body > * { max-width: none !important; }
/* ---- 佣金转结页：避免与后台通用 .input-wrap（搜索框）类名冲突 ---- */
.tpl-two .tm-field-row {
  display: flex; align-items: center; width: 100%; border: 1px solid var(--s-line) !important;
  border-radius: 10px; background: #F8FAFC; overflow: hidden;
}
.tpl-two .tm-field-row:focus-within { border-color: var(--s-accent-line) !important; background: #fff; box-shadow: var(--s-sh-1); }
.tpl-two .tm-field-row input {
  flex: 1 1 auto; min-width: 0; border: 0 !important; background: transparent !important;
  box-shadow: none !important; border-radius: 0 !important; height: 46px !important;
  padding: 0 16px !important; font-size: 15px; color: var(--s-text) !important;
}
.tpl-two .tm-field-row .suffix { padding: 0 16px; height: 46px; line-height: 46px; color: var(--s-text-2); font-size: 14px; background: var(--s-surface-2); }
/* ---- 首页账号卡：三个统计字段（去掉 Bootstrap .label 的灰底，字号/颜色统一） ---- */
.tpl-two .uc-hero-stat .label {
  display: inline !important;
  background: transparent !important;
  background-color: transparent !important;
  padding: 0 !important;
  margin: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  font-size: 15px !important;
  line-height: 1.5 !important;
  font-weight: 500 !important;
  color: var(--s-text) !important;
}
.tpl-two .uc-hero-stat .value {
  font-size: 15px !important;
  line-height: 1.5 !important;
  font-weight: 700 !important;
  color: var(--s-text) !important;
}
.tpl-two .uc-hero-stats { border-top-color: rgba(240,68,31,.14) !important; }
.tpl-two .uc-hero-stat { border-left-color: rgba(240,68,31,.14) !important; }

/* ============================================================
   2026-10-21 · 左侧菜单：去掉滚动条 + 一屏自适应
   原来 .tw-aside 是 overflow-y:auto，18 个菜单项在 768~900 高的屏幕上
   必然溢出 200px 以上，右侧永远挂一条滚动条。
   这里改成「行高/字号按视口高度收缩 + 隐藏滚动条」，一屏就能全部显示；
   极端矮屏（<600）仍保留滚动能力，只是不再显示滚动条。
   ============================================================ */
@media (min-width: 992px) {
  .tw-aside {
    display: flex; flex-direction: column;
    padding: 12px 10px 14px;
    overflow-y: auto; overflow-x: hidden;
    scrollbar-width: none; -ms-overflow-style: none;
  }
  .tw-aside::-webkit-scrollbar { width: 0 !important; height: 0 !important; display: none !important; }
  .tw-nav { flex: 1 1 auto; min-height: 0; gap: 0; justify-content: flex-start; }
  .tw-nav-label {
    padding: clamp(3px, .7vh, 12px) 16px clamp(1px, .3vh, 4px) 22px;
    font-size: clamp(9px, 1.1vh, 11px); line-height: 1.2;
  }
  .tw-nav-item {
    height: clamp(26px, 4.2vh, 42px);
    font-size: clamp(13px, 1.9vh, 14px);
    border-radius: clamp(8px, 1.1vh, 12px);
    gap: clamp(7px, 1.2vh, 11px);
    padding-left: 22px;
    padding-right: 16px;
  }
  .tw-nav-item i { font-size: clamp(13px, 1.75vh, 15px); }
  .tw-nav-dot { min-width: 16px; height: 16px; line-height: 16px; font-size: 10px; }
}

/* ============================================================
   2026-10-21 · 手机端「宽屏化」
   手机上原来 .tw-content 10 + .tw-content-body 14 + .uc-bare 6 + .col-sm-12 15
   = 每侧 45px，390 屏可用内容只有 308。这里收成最外层 8px 一层，
   其余页面级留白置 0；卡片自身内边距不动。
   ============================================================ */
@media (max-width: 991px) {
  .tpl-two .tw-content { padding: 0 !important; }
  .tpl-two .tw-content-body { padding: 10px 8px 24px !important; }
  .tpl-two .uc-bare { padding: 0 !important; margin: 0 !important; }
}
/* 只在真正的手机宽度把栅格列还原成整列（≥768 保留 Bootstrap 的并排行为） */
@media (max-width: 767px) {
  .tpl-two .uc-bare > [class*="col-"] {
    float: none !important; width: 100% !important;
    padding-left: 0 !important; padding-right: 0 !important;
  }
}

/* 充值页「支付方式」两列在窄屏会撑破容器（grid-template-columns:1fr 1fr 的 1fr
   最小宽度=内容不可断行宽度，USDT-BEP20 这类长名字直接把容器顶宽 → 右侧被裁）。
   改成 minmax(0,1fr)，列宽可收缩、文字已带省略号，就不会再撑破。 */
@media (max-width: 575px) {
  .tpl-two .rc-pays { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
}
@media (max-width: 991px) {
  .tpl-two .rc-pay-txt,
  .tpl-two .rc-pay-name,
  .tpl-two .rc-pay-meta { min-width: 0 !important; }
}

/* =====余额充值页：金额输入框外壳统一（2026-10-30）=====
外层 .rc-amt负责唯一的描边，内部 input必须完全透明无框。
all:unset一次性清空浏览器默认与上方 .tpl-two input[type=text]的 !important边框，
避免逐项覆盖时漏属性导致「框套框」。 */
html body .rc-amt,
html body .rc-amt:focus-within {
 border:1.5px solid var(--s-line) !important;
 background: #FAFBFE !important;
 box-shadow: none !important;
 border-radius:14px !important;
}
html body .rc-amt:focus-within {
 background: #FFFFFF !important;
}
html body .rc-amt #rcValue,
html body .rc-amt #rcValue:hover,
html body .rc-amt #rcValue:focus,
html body .rc-amt #rcValue:focus-visible {
 all: unset !important;
 box-sizing: border-box !important;
 display: block !important;
 border:0 !important;
 outline:0 !important;
 box-shadow: none !important;
 background: transparent !important;
 border-radius:0 !important;
 height: auto !important;
 flex:1 1 auto !important;
 width:100% !important;
 font-family: inherit !important;
 font-size:30px !important;
 font-weight:800 !important;
 color: var(--rc-ink) !important;
 padding:13px 10px !important;
 letter-spacing: -.5px !important;
 -webkit-appearance: none !important;
 appearance: none !important;
}

/* ===== 2026-11-07 恢复：商品时效分页条 ===== */
.tl-pg{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:6px;padding:16px 0 6px}
.tl-pg-link,.tl-pg-cur,.tl-pg-gap{display:inline-flex;align-items:center;justify-content:center;min-width:34px;height:34px;padding:0 10px;font-size:12.5px;border-radius:10px;text-decoration:none}
.tl-pg-link{color:var(--s-text-2);background:var(--s-surface);border:1px solid var(--s-line-2);transition:var(--s-t-fast)}
.tl-pg-link:hover{border-color:var(--s-accent-line);color:var(--s-accent-ink);background:var(--s-accent-bg)}
.tl-pg-cur{background:var(--s-accent-fill);border:1px solid var(--s-accent-fill);color:#fff;font-weight:600}
.tl-pg-gap{color:var(--s-text-4)}
.tl-pg-info{font-size:12px;color:var(--s-text-3-ink);margin-left:4px}
@media (max-width:768px){
  .tl-pg{flex-wrap:nowrap;overflow-x:auto;justify-content:flex-start;scrollbar-width:none}
  .tl-pg::-webkit-scrollbar{display:none}
  .tl-pg-link,.tl-pg-cur{min-width:32px;height:32px;padding:0 9px}
  .tl-pg-info{display:none}
}

/* ============================================================
   [2026-11-08] 内容区贴合四角（去缝 + 直角）
   现状：内容区是一张白卡片，左/右 18+18=36px、上 22px、下 48px 都是灰缝，
         且卡片 16px 圆角，看着像浮在灰底上的一块板。
   改成：白色版面满宽满高，四边直接贴住顶栏 / 侧栏 / 屏幕边，四角直角。
   说明：卡片内部的 .uc-hero / .uc-notice-card 等自身间距不动，只处理最外层。
   ============================================================ */
/* 1) 先清掉外层两层留白（#content 的左右 18px + 内容区的 22/18/48） */
.tpl-two #content,
.tpl-two #content.app-content,
.tpl-two .tw-content {
  padding: 0 !important;
  margin-bottom: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  min-width: 0 !important;
}
.tpl-two .tw-content-body {
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 0 !important;
  background: var(--s-surface) !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  min-height: calc(100vh - 64px);
  box-sizing: border-box;
}
/* 2) 页面最外层白卡片：去圆角 / 去边框 / 去阴影 / 去内缩，铺满内容区 */
.tpl-two .uc-container,
.tpl-two .uc-container.tw-card,
.tpl-two .uc-container.uc-orders {
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}
/* 3) 顶在内容区最上面的那个区块，上两个角必须是直角 */
.tpl-two .uc-container > .uc-hero:first-child,
.tpl-two .uc-container > .uc-security-tip:first-child,
.tpl-two .uc-container > .uo-notice:first-child,
.tpl-two .tw-content-body > .up-page > .up-hero:first-child,
.tpl-two .tw-content-body > .up-page > .up-card:first-child {
  border-radius: 0 !important;
}
/* 4) 手机端：同样满宽贴边；底部留出 58px 底部导航 + 安全区 */
@media (max-width: 991px) {
  .tpl-two .tw-content-body {
    padding: 0 !important;
    min-height: calc(100vh - 56px - 66px);
  }
  .tpl-two .uc-container,
  .tpl-two .uc-container.tw-card,
  .tpl-two .uc-container.uc-orders {
    padding: 0 !important;
  }
}

/* ============================================================
   [2026-11-08] 下单页：去掉分类栏与右侧内容之间的 14px 竖缝
   原来 .bp-main 是 grid(186px 1fr) + gap:14px，两张浮起的小卡片中间留缝。
   内容区改成满版后这条缝就露白了，这里把两栏并成一栏：
   gap 归零，圆角/阴影去掉，改用 1px 分隔线区分左右两区。
   ============================================================ */
.tpl-two .bp-main { gap: 0 !important; }
.tpl-two .bp-main.bp-detail-mode { gap: 0 !important; }

.tpl-two .bp-cats {
  border-radius: 0 !important;
  box-shadow: none !important;
  border-right: 1px solid var(--s-line) !important;
}
.tpl-two .bp-panel {
  border-radius: 0 !important;
  box-shadow: none !important;
  border: 0 !important;
}
/* 手机端：分类栏仍在左侧（按窄屏规则 108px），缝同样去掉 */
@media (max-width: 991px) {
  .tpl-two .bp-main { gap: 0 !important; }
  .tpl-two .bp-cats { border-radius: 0 !important; }
}
/* 单栏（分类折叠/详情模式）时不需要分隔线 */
.tpl-two .bp-main.bp-detail-mode .bp-cats { border-right: 0 !important; }

/* ============================================================
   [2026-11-08] 余额充值 / 佣金转结：去掉四边缝隙
   这两页是老式 Bootstrap 外壳：wrapper(padding 6px 3px)
   > .col-sm-12(padding 0 15px) > .rc-wrap / .transfer-wrap，
   三层叠起来左右各 36px、上下 6px，四边都是缝。
   这里把三层留白清零，卡片改成贴边直角。
   ============================================================ */
.tpl-two .tw-content-body > .wrapper {
  padding: 0 !important;
  margin: 0 !important;
}
.tpl-two .tw-content-body > .wrapper > [class*="col-"] {
  float: none !important;
  width: 100% !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
  margin: 0 !important;
}
.tpl-two .tw-content-body > .wrapper > [class*="col-"] > * {
  width: 100% !important;
  max-width: none !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
}

/* 充值页 */
.tpl-two .rc-hero {
  border-radius: 0 !important;
  box-shadow: none !important;
  margin: 0 !important;
}
.tpl-two .rc-card {
  border-radius: 0 !important;
  box-shadow: none !important;
  margin: 0 !important;
  border-left: 0 !important;
  border-right: 0 !important;
}
/* 佣金转结页 */
.tpl-two .transfer-card {
  border-radius: 0 !important;
  box-shadow: none !important;
  margin: 0 0 0 0 !important;
  border-left: 0 !important;
  border-right: 0 !important;
}
/* 两页最下面的白卡贴到底部，别再留 18px 空档 */
.tpl-two .rc-grid { margin-top: 0 !important; }
.tpl-two .rc-grid > .rc-card:last-child { margin-bottom: 0 !important; }

@media (max-width: 991px) {
  .tpl-two .tw-content-body > .wrapper { padding: 0 !important; }
  .tpl-two .rc-hero,
  .tpl-two .rc-card,
  .tpl-two .transfer-card { border-radius: 0 !important; }
}


/* ==========================================================================
   2026-11-08 mobile drawer fix
   原因：sup-ui/sup-layout.css 的 :root .app-aside{top:var(--s-h-header);overflow:hidden!important}
   权重高于 .tw-aside，导致抽屉顶部留白缝、且 overflow:hidden 无法上下滑动。
   ========================================================================== */
@media (max-width: 991px) {
  :root .tw-body #aside.app-aside,
  :root .tw-body .app-aside.tw-aside {
    top: 56px !important;
    padding-top: 0 !important;
    padding-bottom: calc(74px + env(safe-area-inset-bottom)) !important;
    height: auto !important;
    bottom: 0 !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
    -webkit-overflow-scrolling: touch;
    overscroll-behavior: contain;
    touch-action: pan-y;
  }
  :root .tw-body .tw-tabbar { display: flex !important; }
}