/* rev_embed.css —— 分润部门挂进「我的」页时用的样式
 *
 * ★★★★ 所有类名一律 `rv-` 前缀 —— 跟「我的」页的 `v2-` 永不重名。
 *   20260830 拆 perp 部门的死教训：**共享文件会让两个部门互相卡住**。
 *   两边各改各的样式，谁也不会打到谁。
 *
 * ★★ 颜色变量【不自己定义】，直接用壳页面 :root 上那一套 —— 保证视觉一致；
 *   万一单独打开（没有壳）时用 var() 的兜底值，不会变成一片白。
 */

.rv-card {
  background: linear-gradient(180deg, var(--panel-a, #0c121b), var(--panel-b, #080b11));
  border: 1px solid var(--line, rgba(122, 156, 196, .10));
  border-radius: var(--r, 14px);
  padding: var(--pad, 16px);
  margin-bottom: var(--gap, 12px);
}
.rv-h {
  font: 700 15px var(--sans, -apple-system, sans-serif);
  color: var(--ink, #e8eef7);
  margin: 0 0 12px;
}

/* ── 分区 tab：★ 手机上一行放得下四个，且每个 ≥44px ── */
.rv-tabs {
  display: grid; grid-template-columns: repeat(4, 1fr);
  gap: 4px; margin-bottom: 12px;
  background: var(--panel-b, #080b11);
  border: 1px solid var(--line, rgba(122, 156, 196, .10));
  border-radius: 11px; padding: 4px;
}
.rv-tab {
  min-height: var(--tap, 48px);
  border: 0; border-radius: 8px; cursor: pointer;
  background: transparent; color: var(--dim, #8593a8);
  font: 600 12.5px var(--sans, -apple-system, sans-serif);
  padding: 0 4px;
  /* ★ 四个字放不下就缩，不许换行把 tab 撑高 */
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.rv-tab.on {
  background: var(--panel-a, #0c121b);
  color: var(--grn, #3ef2a3);
  box-shadow: inset 0 0 0 1px rgba(62, 242, 163, .22);
}

/* ── 数字组 ── */
.rv-nums {
  display: grid; grid-template-columns: repeat(3, 1fr);
  gap: 1px; background: var(--line, rgba(122, 156, 196, .10));
  border-radius: 11px; overflow: hidden;
}
.rv-nums:has(.rv-n:nth-child(2):last-child) { grid-template-columns: repeat(2, 1fr); }
.rv-n { background: var(--panel-b, #080b11); padding: 13px 10px; min-width: 0; }
.rv-n b {
  /* ★ 20260904：19px 固定字号在 375px 手机上放不下 8 位数（实测 48162.22 断行）。
     clamp 让它在窄屏自己缩，配合 big() 的紧凑写法，双保险。 */
  display: block; font: 700 clamp(15px, 4.6vw, 19px)/1.25 var(--mono, ui-monospace, monospace);
  color: var(--ink, #e8eef7);
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.rv-n span { min-height: 30px; }
.rv-n b.g { color: var(--grn, #3ef2a3); }
.rv-n b.a { color: var(--amb, #ffb64d); }
.rv-n span { display: block; margin-top: 5px; font-size: 11.5px; color: var(--dim, #8593a8); line-height: 1.35; }
.rv-n u { display: block; font: 10px var(--mono, monospace); color: var(--faint, #586274); text-decoration: none; }

/* ── 行 ── */
.rv-row {
  display: flex; align-items: center; gap: 10px;
  min-height: var(--tap, 48px); padding: 8px 0;
  border-top: 1px solid var(--line, rgba(122, 156, 196, .10));
}
.rv-row .k { color: var(--dim, #8593a8); font-size: 13.5px; flex: 0 0 auto; }
.rv-row .sp { flex: 1 1 auto; min-width: 8px; }
.rv-row .v { font: 14px var(--mono, monospace); color: var(--ink, #e8eef7); text-align: right; overflow-wrap: anywhere; }

/* ── 说明文字 ── */
.rv-note {
  margin-top: 10px; font-size: 12.5px; line-height: 1.6;
  color: var(--dim, #8593a8);
}
.rv-note.warn { color: var(--amb, #ffb64d); }
.rv-note.dim { color: var(--faint, #586274); font-size: 11.5px; }

/* ── 按钮：★ 一律 ≥48px ── */
.rv-btns { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin-top: 12px; }
.rv-btn {
  min-height: var(--tap, 48px); padding: 0 16px;
  border-radius: 11px; border: 1px solid var(--line2, rgba(122, 156, 196, .20));
  background: var(--panel-a, #0c121b); color: var(--ink, #e8eef7);
  font: 600 14px var(--sans, -apple-system, sans-serif); cursor: pointer;
}
.rv-btn.pri {
  background: linear-gradient(140deg, var(--grn, #3ef2a3), #1fae76);
  border-color: transparent; color: #04120c; font-weight: 700;
}

/* ── 徽章 ── */
.rv-tag {
  display: inline-flex; align-items: center; height: 22px; padding: 0 8px;
  border-radius: 999px; font: 600 11px var(--sans, -apple-system, sans-serif);
  border: 1px solid var(--line2, rgba(122, 156, 196, .20));
  color: var(--dim, #8593a8); background: var(--panel-b, #080b11);
  margin-left: 6px;
}
.rv-tag.ok { color: var(--grn, #3ef2a3); border-color: rgba(62, 242, 163, .3); }
.rv-tag.warn { color: var(--amb, #ffb64d); border-color: rgba(255, 182, 77, .3); }
.rv-tag.gold { color: var(--gold, #f4c869); border-color: rgba(244, 200, 105, .32); }

/* ── 「读不到」★ 跟「0」长得不一样 ── */
.rv-unknown { color: var(--faint, #586274); font-size: 13px; }
.rv-skel {
  display: inline-block; width: 52px; height: 15px; border-radius: 5px;
  background: linear-gradient(90deg, #131a25, #1a2331, #131a25);
  background-size: 200% 100%; animation: rvsk 1.1s linear infinite; vertical-align: -2px;
}
.rv-skel.wide { width: 100%; height: 64px; }
@keyframes rvsk { from { background-position: 200% 0 } to { background-position: -200% 0 } }

/* ── 明细表：★ 只有它允许横滑，而且是【它自己】滑，不是整页滑 ── */
.rv-tablewrap { overflow-x: auto; -webkit-overflow-scrolling: touch; margin-top: 4px; }
.rv-table { width: 100%; border-collapse: collapse; font-size: 12.5px; min-width: 340px; }
.rv-table th {
  text-align: left; color: var(--faint, #586274);
  font: 600 10.5px var(--mono, monospace); letter-spacing: .1em;
  text-transform: uppercase; padding: 8px 6px;
  border-bottom: 1px solid var(--line, rgba(122, 156, 196, .10));
}
.rv-table td {
  padding: 10px 6px; color: var(--ink, #e8eef7);
  border-bottom: 1px solid var(--line, rgba(122, 156, 196, .10));
  font: 12.5px var(--mono, monospace);
}
.rv-table .r { text-align: right; }

@media (min-width: 860px) {
  .rv-tabs { grid-template-columns: repeat(4, auto); justify-content: start; }
  .rv-tab { padding: 0 16px; }
}

/* ── 充值二维码（后端生成的 SVG 直接插进来）── */
.rv-qr {
  display: flex; flex-direction: column; align-items: center; gap: 8px;
  padding: 14px; margin-top: 10px;
  background: #fff; border-radius: 12px;
}
.rv-qr svg { display: block; width: 132px; height: 132px; }
.rv-qr span { font-size: 11.5px; color: #333; }

/* ── 「有效」小绿点 ── */
.rv-dot {
  display: inline-block; width: 6px; height: 6px; border-radius: 50%;
  background: var(--grn, #3ef2a3); vertical-align: 1px;
}

/* ══════════════════════════════════════════════════════════
   DSJ_REVASIDE_20260904 · 右栏：动作区（充值 + 提现）
   ★ 沿用壳页面 :root 那套变量，不自己定义颜色 —— 视觉才对得上。
   ★★ tab 网格原来写死 4 列；右栏形态下中栏只剩 3 个，
      所以改成按【实际个数】排，不然会空出一格。
   ══════════════════════════════════════════════════════════ */
.rv-tabs { grid-template-columns: repeat(auto-fit, minmax(0, 1fr)); }

.rv-aside { display: block; }
.rv-abox {
  background: var(--panel-b, #080b11);
  border: 1px solid var(--line, rgba(122, 156, 196, .10));
  border-radius: 12px;
  padding: 12px 13px;
}

/* 一个池子一块 */
.rv-pool {
  border: 1px solid var(--line, rgba(122, 156, 196, .10));
  border-radius: 10px;
  padding: 10px 11px;
  margin-bottom: 9px;
}
.rv-prow { display: flex; align-items: baseline; gap: 5px; }
.rv-prow b {
  font: 700 19px/1.1 var(--mono, ui-monospace, monospace);
  color: var(--ink, #e8eef7);
  overflow-wrap: anywhere;            /* ★ 长数字不许撑破格子 */
}
.rv-prow span { font: 600 10.5px var(--mono, ui-monospace, monospace); color: var(--faint, #586274); }
.rv-ptip { font: 500 11px var(--sans, sans-serif); color: var(--dim, #8593a8); margin-top: 3px; }

/* ★★★★ 佣金池：说的是「平台会自动发给你」，不是一排红叉。
   红叉读起来像「你不够格」，而事实是「这笔钱本来就会给你」。 */
.rv-auto {
  margin-top: 8px; padding: 7px 9px; border-radius: 8px;
  background: rgba(62, 242, 163, .08);
  border: 1px solid rgba(62, 242, 163, .25);
  font: 500 11.5px/1.55 var(--sans, sans-serif);
  color: var(--grn, #3ef2a3);
}

/* 风控四项：过 / 不过 / 读不到 —— 三态，不许合并成两态 */
.rv-chk {
  display: flex; justify-content: space-between; gap: 8px;
  font: 500 11.5px/1.6 var(--sans, sans-serif);
  color: var(--dim, #8593a8); margin-top: 5px;
}
.rv-chk::before { content: '•'; margin-right: 5px; }
.rv-chk.ok::before { content: '✓'; color: var(--grn, #3ef2a3); }
.rv-chk.no::before { content: '✕'; color: var(--red, #ff5c6c); }
.rv-chk.unk::before { content: '?'; color: var(--amb, #ffb64d); }
.rv-chk span { color: var(--faint, #586274); text-align: right; }

/* 提现表单：手机上 ≥44px 可点 */
.rv-wdform { display: flex; gap: 6px; margin-top: 9px; }
.rv-wdamt {
  flex: 1 1 auto; min-width: 0;       /* ★ grid/flex 子项要 min-width:0，否则撑破 */
  height: 40px; padding: 0 10px;
  background: var(--bg, #05070b);
  border: 1px solid var(--line2, rgba(122, 156, 196, .20));
  border-radius: 9px; color: var(--ink, #e8eef7);
  font: 600 13px var(--mono, ui-monospace, monospace);
}
.rv-wdmax, .rv-wdgo {
  height: 40px; min-width: 46px; padding: 0 12px;
  border-radius: 9px; cursor: pointer; white-space: nowrap;
  border: 1px solid var(--line2, rgba(122, 156, 196, .20));
  background: transparent; color: var(--dim, #8593a8);
  font: 700 12px var(--sans, sans-serif);
}
.rv-wdgo { background: rgba(62, 242, 163, .12); border-color: rgba(62, 242, 163, .35); color: var(--grn, #3ef2a3); }
/* ★★★ 上膛状态要一眼看得出来 —— 两步确认里第二次点是真的动钱 */
.rv-wdgo.armed { background: var(--grn, #3ef2a3); color: #04140d; border-color: var(--grn, #3ef2a3); }

.rv-pend {
  display: flex; align-items: center; justify-content: space-between; gap: 8px;
  margin-top: 8px; padding: 8px 10px; border-radius: 9px;
  background: rgba(255, 182, 77, .07);
  border: 1px solid rgba(255, 182, 77, .25);
  font: 500 11.5px var(--sans, sans-serif); color: var(--amb, #ffb64d);
}
.rv-wdcancel {
  height: 30px; padding: 0 10px; border-radius: 8px; cursor: pointer;
  border: 1px solid rgba(255, 182, 77, .35); background: transparent;
  color: var(--amb, #ffb64d); font: 700 11px var(--sans, sans-serif);
}
.rv-note.bad { color: var(--red, #ff5c6c); }

/* ★ 窄屏（右栏被压到底下时）表单换行，别横向溢出 */
@media (max-width: 560px) {
  .rv-wdform { flex-wrap: wrap; }
  .rv-wdamt { flex: 1 1 100%; }
}


/* ══════════════════════════════════════════════════════════
   DSJ_REVUI2_20260904 · DSJ 实测截图报的两条
   ① 「不要有白色轨道」—— .rv-tablewrap 是 overflow-x:auto 而
      【滚动条样式一次都没设过】（grep scrollbar 命中 0），
      浏览器就给了默认的浅色轨道，在深色页面上是一条白杠。
      ★ 两层一起治：先让表格【根本不需要横滚】，万一还要滚，轨道也是深的。
   ② 「那 8 道门闸太长了，文字写太多」—— 见下面 .rv-chk 那一段。
   ══════════════════════════════════════════════════════════ */

/* ★ 第一层：让它不溢出。两列的小表格本来就不该横滚。 */
.rv-tablewrap { overflow-x: auto; overscroll-behavior-x: contain; }
.rv-table { table-layout: fixed; width: 100%; }
.rv-table td, .rv-table th { overflow-wrap: anywhere; white-space: normal; }

/* ★★ 第二层：真要滚时，轨道跟着深色走 —— 不留白杠。
   两套写法都要：scrollbar-color 给 Firefox，::-webkit-* 给 Chrome/Safari。 */
.rv-tablewrap, .rv-abox, .rv-aside {
  scrollbar-width: thin;
  scrollbar-color: rgba(122,156,196,.28) transparent;
}
.rv-tablewrap::-webkit-scrollbar,
.rv-abox::-webkit-scrollbar,
.rv-aside::-webkit-scrollbar { height: 6px; width: 6px; }
.rv-tablewrap::-webkit-scrollbar-track,
.rv-abox::-webkit-scrollbar-track,
.rv-aside::-webkit-scrollbar-track { background: transparent; }
.rv-tablewrap::-webkit-scrollbar-thumb,
.rv-abox::-webkit-scrollbar-thumb,
.rv-aside::-webkit-scrollbar-thumb {
  background: rgba(122,156,196,.28); border-radius: 3px;
}
.rv-tablewrap::-webkit-scrollbar-corner { background: transparent; }

/* ══ ② 风控清单：从「八行长文」变成「一行汇总 + 只列拦住你的」══
   ★★★ 这张清单的作用是【告诉你为什么不能提】。
     过了的那几项没有信息量，却占了一半篇幅 —— 收起来。
   ★★ 名称列【固定宽度 + 不许收缩】：原来 space-between 会把
     「地址」挤成竖排的「地 址」，那是 flex 子项没有 min-width 的老毛病。 */
.rv-chk {
  display: flex; align-items: baseline; gap: 8px;
  font: 500 11.5px/1.55 var(--sans, sans-serif);
  color: var(--dim, #8593a8); margin-top: 4px;
}
.rv-chk .nm {
  flex: 0 0 4.6em;                 /* ★ 4 个中文字宽，固定，不参与收缩 */
  white-space: nowrap;
  color: var(--dim, #8593a8);
}
.rv-chk .ms {
  flex: 1 1 auto; min-width: 0;    /* ★ 长说明在这里换行，不去挤名称 */
  color: var(--faint, #586274); text-align: left;
  overflow-wrap: anywhere;
}
/* 一行汇总：「✓ 4 项通过」，点一下才展开全部 */
.rv-chksum {
  display: flex; align-items: center; gap: 6px; cursor: pointer;
  margin-top: 6px; padding: 5px 8px; border-radius: 7px;
  background: rgba(62,242,163,.06); border: 1px solid rgba(62,242,163,.18);
  font: 600 11.5px var(--sans, sans-serif); color: var(--grn, #3ef2a3);
  user-select: none;
}
.rv-chksum::after { content: '›'; margin-left: auto; opacity: .7; }
.rv-chksum.open::after { content: '⌄'; }

/* ══════════════════════════════════════════════════════════
   DSJ_REVB23_20260904 · 通知条（顶部）+ 管理台（只给主账号）
   ★ 通知是【打断类】：放最上面、有未读才出现、读了就消失。
     埋进 tab 里等于不存在。
   ★★ 管理台的按钮长得跟用户按钮【不一样】—— 那一按是「我确认这笔钱
     真的转出去了」，视觉上要和普通操作区分开。
   ══════════════════════════════════════════════════════════ */
.rv-nt {
  margin: 0 0 12px; padding: 10px 12px; border-radius: 10px;
  background: rgba(255, 182, 77, .07);
  border: 1px solid rgba(255, 182, 77, .28);
}
.rv-nth {
  display: flex; align-items: center; gap: 8px;
  font: 700 11.5px var(--sans, sans-serif); color: var(--amb, #ffb64d);
}
.rv-ntread {
  margin-left: auto; height: 26px; padding: 0 11px; cursor: pointer;
  border-radius: 7px; border: 1px solid rgba(255, 182, 77, .40);
  background: transparent; color: var(--amb, #ffb64d);
  font: 700 11px var(--sans, sans-serif);
}
.rv-ntrow {
  margin-top: 7px; font: 500 11.5px/1.6 var(--sans, sans-serif);
  color: var(--dim, #8593a8);
}
.rv-ntrow b { display: block; color: var(--ink, #e8eef7); font-weight: 600; }
.rv-ntrow span { color: var(--faint, #586274); overflow-wrap: anywhere; }

/* ── 管理台 ── */
.rv-adrow {
  border: 1px solid var(--line, rgba(122, 156, 196, .10));
  border-radius: 10px; padding: 10px 11px; margin-top: 8px;
}
.rv-adl b { font: 700 16px var(--mono, ui-monospace, monospace); color: var(--ink, #e8eef7); }
.rv-adl span { font: 600 10px var(--mono, ui-monospace, monospace); color: var(--faint, #586274); }
.rv-adsub {
  margin-top: 3px; font: 500 11px var(--sans, sans-serif);
  color: var(--dim, #8593a8); overflow-wrap: anywhere;
}
.rv-adf { display: flex; gap: 6px; margin-top: 9px; flex-wrap: wrap; }
.rv-adhash {
  flex: 1 1 150px; min-width: 0; height: 38px; padding: 0 10px;
  background: var(--bg, #05070b);
  border: 1px solid var(--line2, rgba(122, 156, 196, .20));
  border-radius: 9px; color: var(--ink, #e8eef7);
  font: 500 11.5px var(--mono, ui-monospace, monospace);
}
.rv-adgo, .rv-adno {
  height: 38px; padding: 0 13px; border-radius: 9px; cursor: pointer; white-space: nowrap;
  font: 700 12px var(--sans, sans-serif);
}
/* ★ 管理台的主按钮用金色 —— 跟用户区的绿色分开，一眼看得出「这是你在动别人的钱」 */
.rv-adgo {
  background: rgba(244, 200, 105, .12); border: 1px solid rgba(244, 200, 105, .38);
  color: var(--gold, #f4c869);
}
.rv-adgo.armed { background: var(--gold, #f4c869); color: #191203; border-color: var(--gold, #f4c869); }
.rv-adno {
  background: transparent; border: 1px solid rgba(255, 92, 108, .32); color: var(--red, #ff5c6c);
}
@media (max-width: 560px) { .rv-adhash { flex: 1 1 100%; } }

/* ══ DSJ_CD913_20260905 · 倒数卡 ══ */
.rv-cd{margin:10px 0 0;padding:0}
.rv-cd[hidden]{display:none!important}
.rv-cd-in{display:flex;align-items:center;justify-content:space-between;gap:12px;
 padding:10px 14px;border:1px solid rgba(245,196,81,.35);border-radius:10px;
 background:linear-gradient(180deg,rgba(242,201,107,.10),rgba(242,201,107,.03))}
.rv-cd-t{font-size:12.5px;color:#c9b27a;letter-spacing:.2px}
.rv-cd-n{font-family:ui-monospace,Menlo,Consolas,monospace;font-size:15px;
 font-weight:600;color:#f2c96b;white-space:nowrap}
@media(max-width:520px){.rv-cd-in{flex-direction:column;align-items:flex-start;gap:4px}}