/* WALLET-V2-01 §2：这份表是 docs/design/trade-v2-prototypes/b-wallet.html 的 <style> 块
   剔掉 .demo 演示控制条之后的逐字搬运，由 tests/walletV2Styles.test.js 双向比对钉住。
   不能与 v2.css 合表：两份原型有三条同键异值（body|padding-bottom 96px/90px、
   .page|max-width 1120px/820px、.hero|margin-bottom 18px/14px），合表就要改值。
   body{padding-bottom:90px} 是原型给 .demo 底栏让的位，照 v2.css 保留 96px 的先例原样保留。 */

/* Sora 自托管：下面 html,body 的 font-family:Sora 依赖这两段，与 public/trade/v2.css 逐字同源。
   原型是从 fonts.googleapis.com 拿的；本站不引外部来源。@font-face 块体里没有 `{`，
   tests/walletV2Styles.test.js 的 parseCss 递归进去立刻返回空 Map ⇒ 它对逐字节门禁贡献 0 条声明。 */
@font-face{font-family:Sora;font-style:normal;font-weight:400 800;font-display:swap;
src:url("/public/trade/fonts/sora-latin-ext-v17.woff2") format("woff2");
unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF}
@font-face{font-family:Sora;font-style:normal;font-weight:400 800;font-display:swap;
src:url("/public/trade/fonts/sora-latin-v17.woff2") format("woff2");
unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
*{box-sizing:border-box;margin:0;padding:0}
:root{
  --bg:#0b0c11; --surface:#14161f; --card:#1b1d27; --edge:#282b39; --edge2:#343849;
  --fg:#eef0f7; --dim:#9096ab; --faint:#666c82;
  --up:#3ddc97; --down:#ff5d73; --gold:#ffc94d; --accent:#8b8fff;
}
html,body{background:var(--bg);color:var(--fg);font-family:Sora,system-ui,sans-serif;-webkit-font-smoothing:antialiased}
body{padding-bottom:90px}
button{font:inherit;color:inherit;cursor:pointer;border:0;background:none}
a{color:inherit;text-decoration:none}
/* 红跌绿涨。钱包页曾经是反的（.up 红 / .down 绿），UT-WALLET-01 已经改正，这里必须保住。
   活动流用同一套：出账红、入账绿。 */
.up{color:var(--up)} .down{color:var(--down)}

.top{position:sticky;top:0;z-index:60;display:flex;align-items:center;gap:20px;height:60px;padding:0 22px;
  background:rgba(11,12,17,.9);backdrop-filter:blur(16px);border-bottom:1px solid var(--edge)}
.brand{display:inline-flex;align-items:center;gap:7px;font-weight:800;font-size:17px}
.brand i{font-style:normal;display:grid;place-items:center;width:26px;height:26px;border-radius:8px;
  background:linear-gradient(135deg,var(--up),#7cf5c6);color:#04120e;font-size:13px;font-weight:800}
.nav{display:flex;gap:4px;margin-left:8px}
.nav a{padding:7px 14px;border-radius:999px;font-size:14px;font-weight:600;color:var(--dim);transition:.16s}
.nav a:hover{color:var(--fg)} .nav a.on{background:var(--surface);color:var(--fg)}
.mobilenav{display:none}

/* NAV-V2-03：三页统一的账户位。四态（未登录 / 已登录未绑 / 已绑 / loading·gated）由
   wallet-connect.js 的 walletConnectView() 决定，这里只管长相。
   🔴 一律用嵌套选择器：再写一条裸 .top{...} 就是第二条同名规则，NAV-10 那套层序判据
   按选择器全等取 .top，多一条只会让层序读数变得说不清。
   🔴 v2.css 没有全局 a{color:inherit;text-decoration:none}（另外两张表有），所以别处靠它
   兜住的 color / text-decoration 在这里一律显式写死——否则同一份 markup 在投注页渲染不一样。
   🔴 375px 的顶栏内容宽只有 331px（.top 三表逐字节相同、没有任何 media 覆写）。投注页那一格
   还并排着 17 条声明的余额胶囊（自然宽 88px），brand 103.34 + 两个 gap 40 + 胶囊 88 只剩 100px
   给入口——padding 用 14px 时入口自然宽恰好 100.00px，差 0.34px 就整行一起换行、胶囊被挤成两行。
   所以这里 padding 收到 13px（与 .wallet 同值）并写死 flex:none + white-space:nowrap：
   实测 329.34 ≤ 331，三页在 375px 都不换行。余量只有 1.66px，见报告里的越界登记。
 */
.top .acct{margin-left:auto;flex:none;display:flex;align-items:center;gap:9px}
.top .acct button{min-height:44px;padding:7px 13px;border-radius:999px;border:1px solid var(--edge2);font-size:14px;font-weight:600;color:var(--fg);text-decoration:none;white-space:nowrap;transition:.16s}
.top .acct button:hover{border-color:var(--accent);color:var(--accent)}
.top .acct button:disabled{opacity:.5;cursor:default}
.top .acct .addr{font-size:13px;font-weight:700;color:var(--dim);text-decoration:none;font-variant-numeric:tabular-nums}

/* NAV-V2-04：投注页顶栏有两个 auto 边距——.wallet{margin-left:auto}（v2.css 既有）与上面这条
   .top .acct{margin-left:auto}。flex 把剩余空间在两个 auto 之间**均分**，余额胶囊因此停在正中
   （1990px 实测 x=1055.67，右边空出一大片），而账户位修前修后一直贴右——它是最后一个 flex 项，
   后面没有 auto 边距。把 .acct 这一侧的 auto 收成 0，剩余空间就全归 .wallet，两者贴右相邻，
   间距＝.top 的 gap 20。
   🔴 用相邻兄弟选择器而不是动 .wallet：.wallet 只在投注页存在，这条在另外两页与三份原型里
   一次都不会命中，三张表因此仍能逐字节相同，.wallet 自己的声明一个字节都不用改。
   🔴 NAV-13 那条跨表比对按 ".top .acct" 前缀取规则，取不到这一条 ⇒ 它自己的守卫是 NAV-14/15。
   🔴 markup 里 .wallet 与 .acct 之间隔着一段注释：+ 只看元素兄弟，注释不算。哪天有元素插进
   这两者之间，这条会静默失效，而 NAV-14/15 钉的是规则文本、看不见——那件事只能在真浏览器里量。 */
.top .wallet + .acct{margin-left:0}

.page{max-width:820px;margin:0 auto;padding:26px 22px 0}
h1{font-size:30px;font-weight:800;letter-spacing:-.02em;margin-bottom:16px}

/* 提示条：三种状态各自成条，不合并 */
.note{display:flex;gap:9px;padding:11px 13px;border-radius:12px;margin-bottom:12px;font-size:12px;line-height:1.6}
.note .mk{flex:none;width:20px;height:20px;border-radius:6px;display:grid;place-items:center;font-size:11px;font-weight:800}
.note.amber{background:rgba(255,201,77,.09);border:1px solid rgba(255,201,77,.26);color:var(--gold)}
.note.amber .mk{background:var(--gold);color:#22180a}
.note.grey{background:#191b24;border:1px solid var(--edge);color:var(--dim)}
.note.grey .mk{background:#2a2d3a;color:var(--dim)}
.note[hidden]{display:none}
/* WALLET-V2-04：无 provider 时状态位里那两条并列的建议，以及手机那条的钱包 App 深链。
   v2.css 没有全局 a{}，另外两张表有 a{color:inherit;text-decoration:none} ⇒ 这里必须把
   color 与 text-decoration 都显式写死，否则同一份 markup 在三页上渲染成两个样子。
   类名刻意不以 .note 开头：navV2.test.js 的 NAV-13 断言每张表 .note 家族恰好 7 条。 */
.wpath{display:block;margin-top:6px}
.wlink{color:var(--gold);text-decoration:underline;margin-left:8px}
/* WALLET-V2-07：手机那条的深链从文字链接改成**真按钮**（owner 的反馈是「移动端体验还是太差」：
   深链本身能用，形态却是一大段灰字里埋两个 .wlink——amber 下划线、margin-left:8px，
   不像按钮，点击区只有一行文字那么高）。RECHARGE-WALLET-ONLY-01 之后充值抽屉也改用 .wbtn，
   .wlink 从此没有任何使用者；规则本身留着——删它要同时动六份样式、三份原型与两份 *Styles 的声明数。
   🔴 min-height:44px 是触控目标的通行下限；*{box-sizing:border-box} 下 border 计进这 44px。
   本仓一条读渲染几何的断言都没有 ⇒ 这个高度只能在真浏览器里量，是一次性证据不是守卫。
   🔴 v2.css 没有全局 a{}，另外两张表有 a{color:inherit;text-decoration:none} ⇒ color 与
   text-decoration 同样必须在这里显式写死，否则同一份 markup 在投注页渲染成另一个样子。
   类名同样不以 .note 开头：navV2.test.js 的 NAV-13 断言每张表 .note 家族恰好 7 条。 */
.wbtns{display:flex;flex-wrap:wrap;gap:8px;margin-top:9px}
.wbtn{display:inline-flex;align-items:center;justify-content:center;min-height:44px;padding:0 16px;
  border-radius:12px;background:var(--surface);border:1px solid var(--edge2);color:var(--fg);
  text-decoration:none;font-size:13px;font-weight:700}
.wbtn:hover{border-color:var(--accent);color:var(--accent)}

/* 总资产 */
.hero{border-radius:20px;border:1px solid var(--edge);background:var(--surface);padding:22px;margin-bottom:14px}
.hero .lab{font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--faint);font-weight:700}
.hero .total{font-size:46px;font-weight:800;letter-spacing:-.035em;line-height:1.05;margin:6px 0 4px;font-variant-numeric:tabular-nums}
.hero .sub{font-size:12px;color:var(--dim);font-weight:500}
.hero .acts{display:flex;gap:9px;margin-top:16px;flex-wrap:wrap}
.hero .acts a,.hero .acts button{padding:11px 18px;border-radius:12px;font-size:14px;font-weight:700;transition:.16s}
.hero .acts .primary{background:linear-gradient(180deg,#f4f6ff,#cfd6f0);color:#14161f}
.hero .acts .primary:hover{filter:brightness(1.06)}
.hero .acts .ghost{border:1px solid var(--edge2);color:var(--fg)}
.hero .acts .ghost:hover{border-color:var(--accent);color:var(--accent)}
/* :19 的 button{cursor:pointer} 盖掉了 UA 的 button:disabled 默认 ⇒ disabled 的按钮与旁边
   可用的 .ghost 逐像素相同，属性说禁用、样式说可点。补一条真规则，不靠内联 style。 */
.hero .acts button:disabled{opacity:.5;cursor:default}

/* 四格 + 通幅的第五格 */
.grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:1px;border-radius:16px;overflow:hidden;
  background:var(--edge);margin-bottom:14px}
.cell{display:flex;flex-direction:column;gap:6px;padding:15px 14px;background:var(--card);position:relative;transition:background .16s}
a.cell:hover{background:#20222c}
.cell .k{font-size:10px;letter-spacing:.1em;text-transform:uppercase;color:var(--dim);font-weight:700;display:flex;align-items:center;gap:6px}
.cell .k em{font-style:normal;font-size:10px;padding:1px 6px;border-radius:999px;background:#2a2d3a;color:var(--dim);letter-spacing:0}
.cell .v{font-size:22px;font-weight:800;font-variant-numeric:tabular-nums;line-height:1;letter-spacing:-.02em}
.cell .go{font-size:10px;color:var(--accent);font-weight:600}
/* POINTS-TOTAL-P3：积分总余额是第五格，而 .grid 是 4 列（断点以下 2 列）——
   不给它通幅的话，它会单独落在下一行最左，右边 3/4（断点以下 1/2）露出 .grid 的
   底色 var(--edge) 而不是 .cell 的 var(--card)，看上去像半块塌掉的卡片。
   🔴 只**新增**这一条键，四个既有格的宽度一个值都没改（owner 的硬约束）。 */
.cell.wide{grid-column:1/-1}
/* 待到账：它既不在可用余额里、也不再是持仓——是【路上】的钱。
   UT-WALLET-01 的红线：不得并入可用余额或总资产，必须自成一格。
   所以这里把「在路上」画出来：一条从左向右移动的光点。 */
.cell.transit{background:linear-gradient(180deg,rgba(255,201,77,.07),transparent)}
.cell.transit .k{color:var(--gold)} .cell.transit .v{color:var(--gold)}
.cell.transit::after{content:"";position:absolute;left:0;right:0;bottom:0;height:2px;background:#2a2d3a;overflow:hidden}
.cell.transit .rail{position:absolute;left:0;right:0;bottom:0;height:2px;overflow:hidden}
.cell.transit .rail i{position:absolute;top:0;bottom:0;width:34%;background:linear-gradient(90deg,transparent,var(--gold),transparent)}
@media(prefers-reduced-motion:no-preference){.cell.transit .rail i{animation:transit 1.9s linear infinite}}
@keyframes transit{from{transform:translateX(-120%)}to{transform:translateX(420%)}}
.cell.zero .v{color:var(--faint)}
/* P04-SILENT-REFRESH-01：数字真的变了才闪一下颜色。wallet.js 给 #total / #avail / #pos / #points
   加 live-v 与方向类，600ms 后只摘方向类，靠这条过渡走回常色（一去一回约 1 秒）。
   照 v2.css 的 .stat .v.live-v 写法，用裸类名。#pend 与 #pnl 不闪，理由写在 wallet.js 的 LIVE_IDS 旁。
   🔴 不加减弱动效的媒体查询门不是遗漏：颜色过渡不是 animation，v2.css 那两行的既有写法也没有这个门。 */
.live-v{transition:color .5s ease}
.live-v.up{color:var(--up)}
.live-v.down{color:var(--down)}

/* WALLET-BIND-01：绑定钱包入口（钱包页正文，四格与最近活动之间）。顶栏那颗按钮只做登录、
   三页逐字节相同（NAV-11），所以这一块自带全部样式，一条都不从顶栏借。
   🔴 类名不以 .note 开头、也不进 .top .acct 家族：navV2.test.js 的 NAV-13 断言三张表里
   这两个家族恰好 7 条 / 5 条且逐字节相同，沾上就当场把另外两页打红。
   🔴 .cell .k / .cell .v / .hero .acts .ghost 三条都带作用域，在这里一条都不命中 ⇒ 按钮照
   .hero .acts .ghost 的形态重写一遍（--edge2 边框、hover 转 --accent），不用 .primary：
   绑定不是资金动作，不该跟入金 / 提现抢视觉层级。
   🔴 padding / font-size 照抄 .hero .acts a,.hero .acts button 的 11px 18px / 14px，不是随手取值：
   375px 实测这样恰好 44px 高，与同页的「入金」「提现申请」逐像素同高，也压在 WALLET-V2-07
   给触控目标定的 44px 下限上。第一版写 9px 16px / 13px 时实测只有 38px。
   本仓一条读渲染几何的断言都没有 ⇒ 这个高度是一次性实测证据，不是每次跑的守卫。
   🔴 .bindwallet 上刻意一条 display 都不写。.note{display:flex} 是作者表、与 UA 的
   [hidden]{display:none} 特异度相同、作者表胜出，那边才不得不补一条 .note[hidden]{display:none}
   （positionV2Styles 的 P-STYLE-6 A 记着这个坑）。不声明 display，UA 的 [hidden]（0,1,0）
   压过 UA 的 section{display:block}（0,0,1），hidden 自然生效，也省掉那条补丁。 */
.bindwallet{border:1px solid var(--edge);border-radius:16px;background:var(--surface);padding:15px 18px;margin-bottom:14px}
.bindwallet .k{font-size:10px;letter-spacing:.1em;text-transform:uppercase;color:var(--dim);font-weight:700}
.bindwallet .bindrow{margin-top:8px}
.bindwallet .v{font-size:15px;font-weight:700;font-variant-numeric:tabular-nums}
.bindwallet .ghost{padding:11px 18px;border:1px solid var(--edge2);border-radius:12px;color:var(--fg);font-size:14px;font-weight:700}
.bindwallet .ghost:hover{border-color:var(--accent);color:var(--accent)}
.bindwallet .hint{margin-top:8px;font-size:12px;color:var(--faint);line-height:1.6}

/* EMAIL-BIND-02：正文那块「绑定邮箱」。.bindwallet 那一族每一条都带作用域，在 .mailbind 里
   一条都不命中 ⇒ 只能新写一份，不是重复。
   🔴 padding / font-size 照 .bindwallet .ghost 原样取 11px 18px / 14px：那是上一张卡在 375px
   实测出 44px 触控高度的取值，另取一组就是把那次实测作废。
   🔴 .mailbind 上同样一条 display 都不写，理由与上面 .bindwallet 那段逐字相同。
   🔴 .ghost:disabled 这一条不是装饰：全局 button{cursor:pointer}（:24）盖掉了 UA 的
   :disabled 默认，忙的时候按钮会「属性说禁用、样式说可点」——W-STYLE-6 记的就是同一个坑。
   🔴 输入框只能自己写一份：.sheet input 那一条作用域在抽屉里，本块在正文，一条都不命中。
   🔴 .mailform[hidden] 那一条是**必需的补丁**，不是冗余：本族里只有它声明了 display，而作者表
   的 display:flex 胜过 UA 的 [hidden]{display:none}（作者层压 UA 层，与特异度无关）⇒ 没有这条，
   表单收不起来，第一次进页面就是敞开的。.note[hidden]{display:none} 是同一个坑的同一条解药，
   上面 .bindwallet 那段注释写着它。本族其余选择器一条 display 都不写，所以只需要这一条。 */
.mailbind{border:1px solid var(--edge);border-radius:16px;background:var(--surface);padding:15px 18px;margin-bottom:14px}
.mailbind .k{font-size:10px;letter-spacing:.1em;text-transform:uppercase;color:var(--dim);font-weight:700}
.mailbind .mailrow{margin-top:8px}
.mailbind .v{font-size:15px;font-weight:700;word-break:break-all}
.mailbind .ghost{padding:11px 18px;border:1px solid var(--edge2);border-radius:12px;color:var(--fg);font-size:14px;font-weight:700}
.mailbind .ghost:hover{border-color:var(--accent);color:var(--accent)}
.mailbind .ghost:disabled{opacity:.5;cursor:default}
.mailbind .mailform{display:flex;flex-wrap:wrap;gap:8px;margin-top:8px}
.mailbind .mailform[hidden]{display:none}
.mailbind input{flex:1 1 180px;min-width:0;padding:11px 13px;border-radius:12px;border:1px solid var(--edge2);background:#12141d;color:var(--fg);font:inherit;font-size:14px;outline:none}
.mailbind input:focus{border-color:var(--accent)}
.mailbind .hint{margin-top:8px;font-size:12px;color:var(--faint);line-height:1.6}

/* 活动 */
.panel{border-radius:20px;border:1px solid var(--edge);background:var(--surface);overflow:hidden;margin-bottom:14px}
.phead{display:flex;align-items:center;padding:15px 18px 11px}
.phead span{font-size:14px;font-weight:700}
.phead button{margin-left:auto;font-size:12px;font-weight:600;color:var(--accent)}
.phead button:hover{text-decoration:underline}
.act{display:flex;align-items:center;gap:12px;padding:13px 18px;border-top:1px solid var(--edge)}
.act .ic{flex:none;width:32px;height:32px;border-radius:10px;display:grid;place-items:center;font-size:13px;font-weight:800;
  background:#242734;color:var(--dim)}
.act.in .ic{background:rgba(61,220,151,.14);color:var(--up)}
.act.out .ic{background:rgba(255,93,115,.14);color:var(--down)}
.act .tx{min-width:0}
.act .tx small{display:block;font-size:11px;color:var(--faint);font-weight:500}
.act .tx b{display:block;font-size:14px;font-weight:700;margin-top:2px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.act .amt{margin-left:auto;font-size:15px;font-weight:800;font-variant-numeric:tabular-nums;white-space:nowrap}
.empty{padding:34px 18px;text-align:center;color:var(--faint);font-size:13px;border-top:1px solid var(--edge)}

/* WALLET-LOGOUT-01：正文底部那块「退出登录」。会话 cookie 是 HttpOnly，前端清不掉 ⇒ 这颗按钮
   走的是 POST /api/auth/logout，不是本地清一清。
   🔴 .bindwallet / .mailbind 那两族每一条都带作用域，在 .logout 里一条都不命中 ⇒ 只能新写一份。
   🔴 padding / font-size 照 .mailbind .ghost 原样取 11px 18px / 14px：那是 WALLET-BIND-01 在
   375px 实测出 44px 触控高度的取值，另取一组就是把那次实测作废。
   🔴 本族**一条 display 都不写**，理由与上面两段逐字相同：不声明 display，UA 的 [hidden]（0,1,0）
   压过 UA 的 section{display:block}（0,0,1），hidden 自然生效，也省掉一条 [hidden] 补丁。
   ⚠️ 反例就在这张表里：.sacts{display:flex}（下面「抽屉」那段）声明了 display 又没配补丁 ⇒
   那个块加了 hidden 也关不掉。本族日后哪一条要加 display，必须同时补 .logout[hidden]{display:none}。
   类名同样不以 .note 开头、也不进 .top .acct 家族——NAV-13 断言那两家恰好 7 条 / 5 条。
   ⚠️ 同样只加进 b-wallet 与 wallet.css 这一对：这块只在钱包页存在，另外两页没有它的 markup。 */
.logout{border:1px solid var(--edge);border-radius:16px;background:var(--surface);padding:15px 18px;margin-bottom:14px}
.logout .k{font-size:10px;letter-spacing:.1em;text-transform:uppercase;color:var(--dim);font-weight:700}
.logout .logoutrow{margin-top:8px}
.logout .ghost{padding:11px 18px;border:1px solid var(--edge2);border-radius:12px;color:var(--fg);font-size:14px;font-weight:700}
.logout .ghost:hover{border-color:var(--accent);color:var(--accent)}
.logout .hint{margin-top:8px;font-size:12px;color:var(--faint);line-height:1.6}

/* WALLET-SUPPORT-01：正文底部那块「客服」，排在最近活动之后、退出登录之前，登录与否都显示。
   .bindwallet / .mailbind / .logout 三族每一条都带作用域，在 .support 里一条都不命中 ⇒ 只能新写一份。
   padding / font-size 照 .logout .ghost 取 11px 18px / 14px：那是 WALLET-BIND-01 在 375px 实测出 44px
   触控高度的取值。根级 .support 上一条 display 都不写（理由与上面三段逐字相同）；.supportrow 的
   display:flex 在子元素上，不碰 section 的 [hidden]。根级 .support 已对三页 CSS 与全部原型查重为 0。
   账号用 --fg 加粗、不用 --accent：它不是可点的东西，accent 只给可交互提示。
   .v 的 flex-basis 250px 是刻意的：412px 以下让按钮整颗换到第二行，而不是让文案折成两行挤在按钮旁。 */
.support{border:1px solid var(--edge);border-radius:16px;background:var(--surface);padding:15px 18px;margin-bottom:14px}
.support .k{font-size:10px;letter-spacing:.1em;text-transform:uppercase;color:var(--dim);font-weight:700}
.support .supportrow{display:flex;align-items:center;flex-wrap:wrap;gap:10px;margin-top:8px}
.support .v{flex:1 1 250px;min-width:0;font-size:15px;font-weight:600;line-height:1.5}
.support .v b{font-weight:800;white-space:nowrap}
.support .ghost{padding:11px 18px;border:1px solid var(--edge2);border-radius:12px;color:var(--fg);font-size:14px;font-weight:700;white-space:nowrap}
.support .ghost:hover{border-color:var(--accent);color:var(--accent)}
.support .hint{margin-top:8px;font-size:12px;color:var(--faint);line-height:1.6}

/* 抽屉 */
.mask{position:fixed;inset:0;background:rgba(4,5,8,.72);backdrop-filter:blur(4px);z-index:80;display:none}
.mask.on{display:block}
.sheet{position:fixed;left:50%;bottom:0;transform:translateX(-50%);width:min(560px,100%);z-index:81;
  background:var(--surface);border:1px solid var(--edge);border-bottom:0;border-radius:20px 20px 0 0;padding:20px 18px 26px;display:none}
.sheet.on{display:block}
@media(prefers-reduced-motion:no-preference){.sheet.on{animation:rise .3s cubic-bezier(.16,1,.3,1)}}
@keyframes rise{from{transform:translate(-50%,26px);opacity:0}to{transform:translate(-50%,0);opacity:1}}
.sheet h2{font-size:19px;font-weight:800;margin-bottom:5px}
.sheet p{font-size:12px;color:var(--dim);line-height:1.7;margin-bottom:14px}
.sheet label{display:block;font-size:12px;color:var(--dim);font-weight:600;margin-bottom:11px}
.sheet input{display:block;width:100%;margin-top:6px;padding:11px 13px;border-radius:11px;border:1px solid var(--edge2);
  background:#12141d;color:var(--fg);font:inherit;font-size:15px;font-weight:700;outline:none}
.sheet input:focus{border-color:var(--accent)}
.filters{display:flex;gap:5px;margin-bottom:12px}
.filters button{padding:7px 14px;border-radius:999px;font-size:12px;font-weight:700;color:var(--dim);border:1px solid var(--edge2)}
.filters button.on{background:var(--fg);color:#14161f;border-color:var(--fg)}
.sacts{display:flex;gap:9px;margin-top:16px}
.sacts button{flex:1;padding:12px 0;border-radius:12px;font-size:14px;font-weight:700;border:1px solid var(--edge2);color:var(--fg)}
.sacts .primary{background:linear-gradient(180deg,#f4f6ff,#cfd6f0);color:#14161f;border:0}
.list{max-height:52vh;overflow:auto;border-radius:14px;border:1px solid var(--edge)}
.list .act:first-child{border-top:0}

/* 充值抽屉（WALLET-V2-02）：抽屉里已有的类装不下的只有二维码与收款地址这两样。
   其余（标题、说明、金额/链/币的 chip、底部动作条）一律复用上面的 .sheet / .filters / .sacts，
   一个新的 z-index 都没有 —— NAV-10 的层序「顶栏 < 底栏 < 遮罩 ≤ 抽屉」原样保持。 */
.sheet .qr{display:block;width:180px;height:180px;margin:0 auto 12px;border-radius:12px}
.sheet .addr{display:block;padding:10px 12px;border-radius:11px;border:1px solid var(--edge2);background:#12141d;font-size:12px;line-height:1.6;word-break:break-all}
/* button{cursor:pointer} 同样盖掉了 UA 的 :disabled 默认——建单中的按钮不加这条就是
   「属性说禁用、样式说可点」，与 §2 给 .hero .acts 补的那条是同一个缺陷。 */
.sacts button:disabled{opacity:.5;cursor:default}

@media(max-width:720px){
  .page{padding:18px 13px 0}
  .grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .hero .total{font-size:38px}
  .nav{display:none}
  .mobilenav{position:fixed;left:0;right:0;bottom:0;z-index:70;display:grid;grid-auto-flow:column;grid-auto-columns:1fr;background:rgba(11,12,17,.9);backdrop-filter:blur(16px);border-top:1px solid var(--edge);padding-bottom:env(safe-area-inset-bottom,0px)}
  /* 逐字节相同 ≠ 渲染相同：三张表的层叠环境不一样。text-decoration:none 在 positions/wallet
     里本可由全局 a{} 兜住，v2.css 没有那条全局——不写死它，投注页的 tab 就是带下划线的。
     padding-bottom 那个 env(safe-area-inset-bottom) 今天恒取兜底 0px：三页的 viewport meta
     都没有 viewport-fit=cover。写法是对的，但它此刻没有在挡任何东西，别当它在承重。 */
  .mobilenav a{display:grid;place-items:center;height:64px;font-size:13px;font-weight:600;color:var(--dim);text-decoration:none}
  .mobilenav a.on{color:var(--fg)}
  .mobilenav a[hidden]{display:none}
}