/* 全局重置、屏幕切换、顶栏（一行）、会员卡面、账本 / 会员卡弹窗内容、选桌行
   token 在 css/tokens.css，公共组件在 css/components.css；大厅楼面 + 底部入口在 css/floor.css，牌桌 HUD 在 css/table-hud.css。
   整页 zoom = k（js/core/scale.js）：这里的 px 都是 dp；视口单位用 var(--vh) / var(--vw)。 */
*{margin:0;padding:0;box-sizing:border-box;user-select:none;}
html,body{height:100%;}
body{
  background:var(--ink-950);color:var(--cream-100);
  font-family:var(--sans);font-size:14px;line-height:1.5;
  overflow:hidden;-webkit-font-smoothing:antialiased;
  /* 数字一律等高（ui-system.md §3）：Georgia 默认是旧式数字，「$0」「B01」会像字母 o */
  font-variant-numeric:lining-nums;
  /* 各 css 里的断点写成 @container vp (…)：body 的尺寸 = 布局视口（dp），不会跟 zoom 叠两次 */
  container:vp / size;
}
button{font-family:inherit;}
small{opacity:.8;}
input,select{font-family:inherit;}

/* ============ 屏幕切换 ============ */
.screen{position:fixed;inset:0;display:none;flex-direction:column;}
.screen.active{display:flex;}
.screen > .content{margin-top:48px;flex:1;overflow-y:auto;padding:28px 40px;min-height:0;}

/* ============ 顶栏：游戏名 · 时间 · 现金 · 迷你会员卡 · 声音 · 设置（一行，所有非 HUD 画面共用） ============ */
#topbar{position:fixed;top:0;left:0;right:0;z-index:30;height:48px;padding:0 14px 0 20px;gap:18px;}
#topbar .logo{font-family:var(--serif);letter-spacing:.42em;font-size:18px;color:var(--brass-300);line-height:1;white-space:nowrap;padding-right:2px;}
#topbar .hitem{display:flex;align-items:baseline;gap:8px;font-size:12px;color:var(--tx-3);letter-spacing:.06em;white-space:nowrap;}
#topbar .hitem b{font-family:var(--serif);font-weight:400;font-size:18px;color:var(--brass-100);letter-spacing:.03em;}
#topbar .hcash{display:flex;align-items:baseline;gap:8px;height:36px;padding:0 10px;border:0;border-radius:var(--r-1);background:transparent;cursor:pointer;
  color:inherit;transition:background var(--t-fast);}
#topbar .hcash:hover{background:rgba(201,160,82,.08);}
#topbar .hcash small{font-size:12px;color:var(--tx-3);letter-spacing:.1em;opacity:1;}
#topbar .hcash b{font-family:var(--serif);font-weight:400;font-size:20px;color:var(--brass-100);font-variant-numeric:tabular-nums lining-nums;}
#topbar .hcash.zero b{color:var(--cream-500);}
#topbar .ibtn{width:32px;height:32px;border:0;border-radius:var(--r-1);background:transparent;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;
  color:var(--cream-500);transition:color var(--t-fast),background var(--t-fast);flex:none;}
#topbar .ibtn:hover,#topbar .ibtn.on{color:var(--brass-300);background:rgba(201,160,82,.08);}
#topbar .ibtn .ic{width:18px;height:18px;}
/* 迷你会员卡：卡面按等级换渐变（Diamond 是黑卡），右边等级 + 积分 + 一根进度线 */
.mcard{display:flex;align-items:center;gap:10px;height:40px;padding:0 10px 0 6px;border:0;border-radius:var(--r-1);background:transparent;cursor:pointer;color:inherit;
  transition:background var(--t-fast);}
.mcard:hover{background:rgba(201,160,82,.08);}
.mcard .face{width:44px;height:28px;border-radius:4px;position:relative;flex:none;box-shadow:0 0 0 1px rgba(0,0,0,.6),var(--shadow-1);
  background:radial-gradient(ellipse at 80% -20%,rgba(255,255,255,.3),transparent 50%),linear-gradient(135deg,#c79a63 0%,#9c6f3e 45%,#6e4a24 70%,#b08655 100%);}
.mcard .face::after{content:"";position:absolute;right:5px;top:5px;width:10px;height:8px;border-radius:2px;background:linear-gradient(135deg,#fff3cf,#b58e3a);}
.mcard[data-tier=Silver] .face{background:radial-gradient(ellipse at 80% -20%,rgba(255,255,255,.4),transparent 50%),linear-gradient(135deg,#f0f0f0,#b9b9b9 45%,#8f8f8f 70%,#d6d6d6);}
.mcard[data-tier=Gold] .face{background:radial-gradient(ellipse at 80% -20%,rgba(255,255,255,.3),transparent 50%),linear-gradient(135deg,#d9b25f,#b28a35 45%,#8c661f 70%,#c9a052);}
.mcard[data-tier=Platinum] .face{background:radial-gradient(ellipse at 80% -20%,rgba(255,255,255,.4),transparent 50%),linear-gradient(135deg,#e8eef5,#b5c3d2 45%,#8fa3b8 70%,#d3dde8);}
.mcard[data-tier=Diamond] .face{background:radial-gradient(ellipse at 80% -20%,rgba(255,255,255,.18),transparent 50%),linear-gradient(135deg,#2a2a2e,#0c0c0e 60%,#1d1d22);box-shadow:0 0 0 1px #3a3a40,var(--shadow-1);}
.mcard .tx{display:flex;flex-direction:column;line-height:1.15;text-align:left;min-width:64px;}
.mcard .tx b{font-family:var(--serif);font-weight:400;font-size:14px;color:var(--tx-1);letter-spacing:.06em;white-space:nowrap;}
.mcard .tx small{font-family:var(--serif);font-size:12px;color:var(--tx-3);opacity:1;white-space:nowrap;font-variant-numeric:tabular-nums lining-nums;}
.mcard .bar{display:block;width:100%;height:2px;margin-top:3px;background:rgba(201,160,82,.18);border-radius:0;}
.mcard .bar>i{display:block;height:100%;background:var(--brass-500);border-radius:0;transition:width .5s;}
/* 设置小菜单（齿轮）：夜间柔和 · 界面大小 · 钱包 / 真钱模式 · 镜子 · 帮助 */
.ui-menu{position:fixed;z-index:65;top:44px;right:12px;display:none;min-width:236px;padding:6px 0;border:1px solid var(--brass-700);border-radius:var(--r-2);
  background:linear-gradient(180deg,#221913,#120d0a);box-shadow:var(--shadow-2);}
.ui-menu.on{display:block;}
.ui-menu .row{display:flex;align-items:center;gap:10px;padding:9px 14px;font-size:13px;color:var(--cream-300);cursor:pointer;white-space:nowrap;}
.ui-menu .row:hover{background:rgba(201,160,82,.08);color:var(--brass-100);}
.ui-menu .row em{margin-left:auto;padding-left:18px;font-style:normal;color:var(--brass-300);font-size:12px;}
.ui-menu .row .ic{fill:var(--brass-500);}
.ui-menu .sep{height:1px;margin:5px 0;background:var(--hairline);}
/* 带 HUD 的牌桌画面自己有顶栏（Z0），全站顶栏收起来 */
html.th-on #topbar{display:none;}

/* ============ 会员卡面（会员弹窗里的大卡） ============ */
.clubcard{position:relative;height:164px;border-radius:12px;padding:16px 18px 14px;overflow:hidden;
  display:flex;flex-direction:column;color:#2a1d07;flex:none;
  background:radial-gradient(ellipse at 80% -20%,rgba(255,255,255,.28),transparent 45%),
    repeating-linear-gradient(115deg,rgba(255,255,255,.05) 0 1px,transparent 1px 6px),
    linear-gradient(135deg,#c79a63 0%,#9c6f3e 45%,#6e4a24 70%,#b08655 100%);
  box-shadow:var(--shadow-2),0 0 0 1px rgba(0,0,0,.5);}
.clubcard[data-tier=Silver]{color:#1e1e1e;background:radial-gradient(ellipse at 80% -20%,rgba(255,255,255,.4),transparent 45%),repeating-linear-gradient(115deg,rgba(255,255,255,.06) 0 1px,transparent 1px 6px),linear-gradient(135deg,#f0f0f0 0%,#b9b9b9 45%,#8f8f8f 70%,#d6d6d6 100%);}
.clubcard[data-tier=Gold]{color:#2a1d07;background:radial-gradient(ellipse at 80% -20%,rgba(255,255,255,.28),transparent 45%),repeating-linear-gradient(115deg,rgba(255,255,255,.05) 0 1px,transparent 1px 6px),linear-gradient(135deg,#d9b25f 0%,#b28a35 45%,#8c661f 70%,#c9a052 100%);}
.clubcard[data-tier=Platinum]{color:#16202b;background:radial-gradient(ellipse at 80% -20%,rgba(255,255,255,.4),transparent 45%),repeating-linear-gradient(115deg,rgba(255,255,255,.06) 0 1px,transparent 1px 6px),linear-gradient(135deg,#e8eef5 0%,#b5c3d2 45%,#8fa3b8 70%,#d3dde8 100%);}
/* Diamond：黑卡（邀请制） */
.clubcard[data-tier=Diamond]{color:#d9cfb8;background:radial-gradient(ellipse at 80% -20%,rgba(255,255,255,.16),transparent 45%),repeating-linear-gradient(115deg,rgba(255,255,255,.035) 0 1px,transparent 1px 6px),linear-gradient(135deg,#2a2a2e 0%,#0c0c0e 55%,#1d1d22 100%);box-shadow:var(--shadow-2),0 0 0 1px #3a3a40;}
.clubcard .tier{font-family:var(--serif);letter-spacing:.34em;font-size:12px;text-transform:uppercase;}
.clubcard .nm{font-family:var(--serif);font-size:24px;margin-top:6px;letter-spacing:.04em;}
.clubcard .chipic{position:absolute;right:18px;top:16px;width:34px;height:26px;border-radius:5px;background:linear-gradient(135deg,#fff3cf,#b58e3a);box-shadow:0 1px 2px rgba(0,0,0,.4) inset;}
.clubcard .pts{position:absolute;right:18px;top:54px;text-align:right;font-family:var(--serif);}
.clubcard .pts b{display:block;font-size:24px;font-weight:400;}
.clubcard .pts small{font-size:12px;letter-spacing:.14em;text-transform:uppercase;opacity:.85;}
.clubcard .no{position:absolute;left:18px;top:74px;font-family:var(--mono);font-size:12px;letter-spacing:.18em;opacity:.8;}
.clubcard .bar{margin-top:auto;background:rgba(0,0,0,.18);}
.clubcard .bar>div{background:rgba(42,29,7,.7);}
.clubcard[data-tier=Diamond] .bar>div{background:var(--brass-500);}
.clubcard .next{font-size:12px;margin-top:6px;letter-spacing:.04em;opacity:.85;}

/* ============ 账本弹窗内容 ============ */
.lg-head{text-align:center;margin-bottom:12px;}
.lg-big{font-family:var(--serif);font-size:32px;font-variant-numeric:tabular-nums lining-nums;line-height:1.1;}
.lg-sub{font-size:12px;color:var(--cream-500);margin:4px 0 10px;}
.lg-split{display:flex;gap:22px;justify-content:center;font-size:12px;color:var(--cream-500);margin-top:5px;}
.lg-split b{font-family:var(--serif);font-weight:400;font-size:15px;}
.lg-rows{max-height:280px;overflow-y:auto;border-top:1px solid var(--hairline);padding-top:6px;}
.lg-row{display:flex;gap:14px;align-items:baseline;font-size:12.5px;padding:5px 4px;color:var(--cream-300);border-bottom:1px solid rgba(201,160,82,.1);}
.lg-date{min-width:88px;color:var(--cream-500);}
.lg-won{color:#8fbf9b;min-width:90px;} .lg-lost{color:#c99a96;min-width:90px;}
.lg-net{margin-left:auto;font-family:var(--serif);font-size:15px;}
.lg-empty{text-align:center;color:var(--cream-700);font-size:13px;padding:18px 0;}
.lg-note{font-size:12px;color:var(--cream-700);margin-top:10px;text-align:center;}

/* ============ 会员弹窗内容 ============ */
.cm-next{font-size:12.5px;color:var(--cream-500);text-align:center;margin:10px 0 4px;}
.cm-next b{color:var(--brass-100);font-family:var(--serif);font-weight:400;}
.cm-perks{display:grid;grid-template-columns:auto 1fr;gap:6px 14px;font-size:12.5px;color:var(--cream-300);border-top:1px solid var(--hairline);padding-top:12px;margin-top:12px;}
.cm-perks span{color:var(--cream-500);white-space:nowrap;}
.cm-perks b{color:var(--cream-100);font-weight:400;}
.cm-rules{font-size:12px;color:var(--cream-500);line-height:1.9;border-top:1px solid var(--hairline);padding-top:10px;}
.cm-rules b{color:var(--cream-100);font-weight:400;}

/* ============ 选桌行（轮盘 / 百家乐选桌弹窗） ============ */
.pick-row{display:flex;flex-direction:column;gap:4px;padding:12px 14px;cursor:pointer;border:1px solid var(--brass-900);border-radius:var(--r-1);
  background:linear-gradient(180deg,#1b1410,#120d0a);transition:border-color .15s,background .15s;}
.pick-row+.pick-row{margin-top:8px;}
.pick-row:hover{border-color:var(--brass-500);background:linear-gradient(180deg,#241a12,#160f0a);}
.pick-row b{color:var(--cream-100);font-family:var(--serif);font-weight:400;font-size:15px;letter-spacing:.04em;}
.pick-row span{color:var(--cream-500);font-size:12px;line-height:1.5;}

/* ============ 帮助 · 关于（原来大厅右栏的积分规则、楼面图出处都收到这里） ============ */
.help-body{font-size:13px;color:var(--cream-300);line-height:1.85;}
.help-body h4{font-family:var(--serif);font-weight:400;font-size:15px;color:var(--brass-300);letter-spacing:.08em;margin:12px 0 4px;}
.help-body h4:first-child{margin-top:0;}
.help-body b{color:var(--cream-100);font-weight:400;}
.help-body small{color:var(--cream-500);}