/* 猜数干杯 · 酒桌秘局 — 神秘风格 */
:root{
  /* ===== 配色: 酒桌红 =====
     暖调中国红 + 琥珀金。刻意避开"深紫+渐变金"那套(太 AI 味):
     背景带暖棕底, 层次靠明暗而不是发光。 */
  --bg:#170a09;
  --bg2:#241110;
  --card:rgba(226,132,84,.09);
  --line:rgba(255,172,110,.20);
  --gold:#ffc857;            /* 高亮/标题(变量名沿用, 语义是"强调色") */
  --gold2:#c9762a;
  --violet:#e63946;          /* 次要强调(变量名沿用, 现在是"酒红") */
  --brand:#e63946;           /* 主按钮 */
  --brand2:#ff6b35;
  --red:#ff4d6d;
  --green:#4ade80;
  --text:#fff2ea;
  --dim:rgba(235,203,185,.62);
  /* 全站统一字体: 黑体(Gothic / sans)。不再混用宋体, 保证界面观感一致。
     按平台可用性排序: 苹果"H";  Windows"黑体/微软雅黑"; 安卓/鸿蒙"思源黑体" */
  --hei: "Heiti SC","Heiti TC","Hiragino Sans GB","PingFang SC","SimHei","Microsoft YaHei",
         "Noto Sans CJK SC","Source Han Sans SC","Noto Sans SC","HarmonyOS Sans SC",
         "WenQuanYi Micro Hei",sans-serif;
  --mystery-font: var(--hei);
}
*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}
/* 关键: 浏览器 UA 样式会给表单控件套自己的字体(Arial), 它们默认**不继承**页面字体,
   于是按钮/输入框与标题正文不一致。统一强制继承。 */
button,input,select,textarea,optgroup{font-family:inherit;font-size:inherit;line-height:inherit;color:inherit}
button{cursor:pointer}
html,body{margin:0;padding:0;height:100%}
body{
  background:
    /* 只留极淡的暖色渐层做明暗层次; 内容背后的"光球"是 AI 生成 UI 的典型特征, 去掉 */
    radial-gradient(1300px 760px at 50% -38%, rgba(230,70,55,.085), transparent 72%),
    radial-gradient(820px 520px at 90% 118%, rgba(255,150,60,.055), transparent 70%),
    linear-gradient(180deg, var(--bg) 0%, var(--bg2) 55%, #180b0a 100%);
  color:var(--text);
  font-family:var(--hei);
  min-height:100vh;
  overflow-x:hidden;
  position:relative;
}
#star-canvas{
  position:fixed;inset:0;z-index:0;pointer-events:none;opacity:.8;
}
#app{position:relative;z-index:1;max-width:560px;margin:0 auto;padding:env(safe-area-inset-top) 16px calc(16px + env(safe-area-inset-bottom))}
.view{padding-top:20px}
.hidden{display:none !important}

/* ---------- 入场页 ---------- */
.entry-card{
  text-align:center;padding:36px 20px;
  background:linear-gradient(160deg, rgba(255,255,255,.06), rgba(230,90,70,.08));
  border:1px solid var(--line);border-radius:24px;
  box-shadow:0 0 44px rgba(230,90,70,.10) inset;
}
.logo{
  /* 圆形徽章: 实心淡底 + 细圆环 —— 是"图标"不是"发光球"。
     用边框定形, 不用模糊光晕(那玩意看着就没设计感)。 */
  width:84px;height:84px;margin:6px auto 14px;border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  background:rgba(255,200,87,.055);
  border:1.5px solid rgba(255,200,87,.34);
  box-shadow:0 2px 12px rgba(0,0,0,.3), inset 0 1px 0 rgba(255,255,255,.05);
}
.logo-svg{width:66%;height:66%;display:block}
h1{
  /* 实色而非渐变填充: 渐变字+强发光是"AI 生成感"的典型来源, 换成暖琥珀实色更稳 */
  font-size:34px;margin:10px 0 8px;letter-spacing:7px;font-family:var(--mystery-font);font-weight:700;
  color:var(--gold);
  text-shadow:0 2px 0 rgba(0,0,0,.35);
}
.sub{color:var(--dim);font-size:13px;line-height:1.8;margin:0 0 24px;letter-spacing:1px}
input[type=text]{
  width:100%;padding:16px;border-radius:14px;border:1px solid var(--line);
  background:rgba(230,90,70,.10);color:var(--text);font-size:17px;text-align:center;
  outline:none;margin-bottom:14px;transition:.2s;letter-spacing:2px
}
input[type=text]:focus{border-color:var(--gold);box-shadow:0 0 0 2px rgba(255,200,87,.25)}
.btn{
  width:100%;padding:15px;border-radius:14px;border:1px solid var(--line);
  background:rgba(255,255,255,.06);color:var(--text);font-size:17px;font-weight:600;letter-spacing:2px;
  margin-bottom:12px;cursor:pointer;transition:.15s;backdrop-filter:blur(8px)
}
.btn:active{transform:scale(.97)}
.btn:disabled{opacity:.35}
.btn.primary{
  background:linear-gradient(135deg, var(--brand), var(--brand2));
  border:none;color:#fff5ef;box-shadow:0 6px 20px rgba(230,57,70,.32);font-weight:800
}
.btn.big{padding:17px;font-size:18px}
.divider{display:flex;align-items:center;gap:12px;margin:18px 0;color:var(--dim);font-size:12px;letter-spacing:4px}
.divider::before,.divider::after{content:"";flex:1;height:1px;background:var(--line)}
.tips{color:var(--dim);font-size:12px;line-height:1.8;margin-top:14px}

/* ---------- 分享页 ---------- */
.share-card{
  text-align:center;padding:24px 16px;
  background:linear-gradient(160deg, rgba(255,255,255,.05), rgba(230,90,70,.10));
  border:1px solid var(--line);border-radius:24px
}
.share-card h2{font-size:22px;margin:0 0 14px;font-family:var(--mystery-font);letter-spacing:4px}
.roomcode{
  font-size:46px;font-weight:800;letter-spacing:10px;color:var(--gold);
  font-family:var(--hei);font-variant-numeric:tabular-nums;font-feature-settings:"tnum" 1;
  margin:10px 0 16px;
  text-shadow:0 0 30px rgba(255,200,87,.7), 0 0 60px rgba(255,200,87,.3)
}
.qr{width:min(220px,58vw);height:auto;border-radius:16px;background:#fff;padding:10px;display:block;margin:0 auto 14px;box-shadow:0 0 0 2px var(--gold), 0 0 40px rgba(255,200,87,.35)}

/* ---------- 解锁面板 ---------- */
.unlock-panel{
  margin:16px 0;padding:16px;text-align:left;
  background:linear-gradient(135deg, rgba(255,200,87,.12), rgba(230,90,70,.12));
  border:1px solid rgba(255,200,87,.4);border-radius:16px
}
.unlock-title{font-size:15px;font-weight:800;color:var(--gold);letter-spacing:2px;margin-bottom:8px}
.unlock-card p{font-size:13px;color:var(--dim);line-height:1.7;margin:6px 0}
.unlock-ref{color:var(--green);font-size:12px}
.unlock-owner{color:var(--gold) !important;font-size:12px}
.unlock-hint{font-size:11px;color:var(--dim);margin-top:4px}
#unlock-panel-game{margin:0 0 16px}

/* ---------- 游戏 HUD ---------- */
.hud{display:flex;gap:8px;margin-bottom:12px}
.hud-item{
  flex:1;background:var(--card);border:1px solid var(--line);border-radius:12px;
  padding:8px 6px;text-align:center;overflow:hidden
}
.hud-item .label{display:block;font-size:10px;color:var(--dim);margin-bottom:2px}
.hud-item span:last-child{font-size:14px;font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;display:block}
.host-name{color:var(--gold)}
.music-btn,.finish-btn{
  flex:0 0 44px;background:var(--card);border:1px solid var(--line);border-radius:12px;
  color:var(--text);font-size:18px;cursor:pointer
}
.music-btn:active,.finish-btn:active{transform:scale(.94)}

/* ---------- 玩家条 ---------- */
.player-strip{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:14px}
.player-chip{
  display:flex;align-items:center;gap:6px;padding:8px 12px;border-radius:999px;
  background:rgba(255,255,255,.06);border:1px solid var(--line);font-size:13px;transition:.2s
}
.player-chip.host{border-color:var(--gold);background:rgba(255,200,87,.14);box-shadow:0 0 12px rgba(255,200,87,.2)}
.player-chip.turn{
  border-color:var(--red);background:rgba(255,77,109,.18);
  animation:pulse-turn 1.2s infinite
}
@keyframes pulse-turn{0%,100%{box-shadow:0 0 0 0 rgba(255,77,109,.5)}50%{box-shadow:0 0 0 8px rgba(255,77,109,0)}}
.player-chip.offline{opacity:.72;border-style:dashed;border-color:rgba(255,255,255,.22)}
.player-chip .pc-name{white-space:nowrap}
/* 掉线徽章: 比名字轻, 但一眼看得见 */
.player-chip .pc-off{
  font-size:10px;padding:2px 6px;border-radius:99px;white-space:nowrap;
  background:rgba(255,255,255,.10);color:var(--dim);border:1px solid rgba(255,255,255,.16)
}
.player-chip.offline .pc-name{color:var(--dim)}
.player-chip .pc-tag{font-size:12px;line-height:1}
.player-chip .drinks{color:var(--gold);font-weight:700}

/* ---------- 回合提示 ---------- */
.turn-banner{
  text-align:center;font-size:16px;font-weight:600;padding:16px 12px;margin-bottom:14px;
  border-radius:14px;background:var(--card);border:1px solid var(--line);line-height:1.6;
  min-height:64px;display:flex;flex-direction:column;align-items:center;justify-content:center;position:relative
}
.turn-banner small{display:block;font-size:12px;font-weight:400;color:var(--dim);margin-top:4px}
.turn-banner.mine{
  background:linear-gradient(135deg, rgba(255,77,109,.28), rgba(255,200,87,.18));
  border-color:var(--red);
  animation:banner-glow 1.4s ease-in-out infinite
}
@keyframes banner-glow{0%,100%{box-shadow:0 0 0 0 rgba(255,77,109,.4)}50%{box-shadow:0 0 24px 2px rgba(255,77,109,.45)}}
.countdown{
  display:inline-block;min-width:34px;font-size:26px;font-weight:900;color:var(--gold);
  margin-left:8px;text-shadow:0 0 12px rgba(255,200,87,.7);font-family:var(--hei);
  font-variant-numeric:tabular-nums;font-feature-settings:"tnum" 1
}

/* ---------- 数字盘 ---------- */
.number-pad{display:grid;grid-template-columns:repeat(auto-fill,minmax(64px,1fr));gap:10px;margin-bottom:16px}
.num-btn{
  aspect-ratio:1;border-radius:18px;border:1px solid var(--line);
  background:linear-gradient(160deg,rgba(230,90,70,.16),rgba(20,10,40,.6));
  color:var(--text);font-size:24px;font-weight:800;cursor:pointer;transition:.15s;
  display:flex;align-items:center;justify-content:center;position:relative;
  font-family:var(--mystery-font);letter-spacing:2px
}
.num-btn:active{transform:scale(.94)}
.num-btn.used{
  opacity:.3;pointer-events:none;text-decoration:line-through;
  background:rgba(255,255,255,.03);filter:grayscale(.6)
}
.num-btn.used::after{
  content:attr(data-who);position:absolute;bottom:2px;font-size:9px;font-weight:400;
  text-decoration:none;color:var(--dim);max-width:90%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-family:inherit
}
.num-btn.mine{border-color:var(--gold);box-shadow:0 0 0 2px rgba(255,200,87,.25) inset, 0 0 18px rgba(255,200,87,.25)}
.num-btn:disabled{opacity:.4}

/* ---------- 指定面板 ---------- */
.assign-panel{
  background:linear-gradient(135deg, rgba(255,200,87,.10), rgba(230,90,70,.10));
  border:1px solid var(--gold);border-radius:14px;padding:12px;margin-bottom:14px
}
.assign-panel p{margin:0 0 10px;font-size:13px;color:var(--gold);letter-spacing:1px}
#assign-list{display:flex;flex-wrap:wrap;gap:8px}
.assign-btn{
  padding:10px 14px;border-radius:999px;border:1px solid var(--line);
  background:rgba(255,255,255,.08);color:var(--text);font-size:14px;cursor:pointer
}
.assign-btn:active{background:rgba(255,200,87,.25)}
.assign-btn[disabled]{opacity:.35}

/* ---------- 操作区 ---------- */
#view-game{display:flex;flex-direction:column;min-height:calc(100dvh - 40px);padding-bottom:96px}
.actions{
  position:fixed;left:0;right:0;bottom:0;z-index:50;
  display:flex;gap:10px;max-width:560px;margin:0 auto;
  padding:10px 16px calc(14px + env(safe-area-inset-bottom));
  background:linear-gradient(180deg,rgba(23,10,9,0),rgba(23,10,9,.92) 30%,rgba(23,10,9,.98));
}
.actions .btn{margin-bottom:0}
.actions .btn.leave{
  /* 麦克风下线后, 退出按钮独占这一行。
     改成中性样式: 它是个"偶尔用一次"的次要动作, 不该做成醒目的红色主按钮。 */
  flex:1;width:auto;padding:15px 16px;font-size:15px;
  background:rgba(255,255,255,.05);border-color:rgba(255,255,255,.15);
  color:var(--dim);letter-spacing:3px
}
.actions .btn.leave:active{background:rgba(255,77,109,.14);border-color:rgba(255,77,109,.4)}


/* ---------- 结果弹层 ---------- */
.result-overlay{
  position:fixed;inset:0;background:rgba(5,2,12,.82);backdrop-filter:blur(6px);
  display:flex;align-items:center;justify-content:center;z-index:100;padding:24px
}
.result-card{
  text-align:center;padding:36px 24px;border-radius:24px;max-width:400px;width:100%;
  background:linear-gradient(160deg,#2a1412,#180b0a);
  border:2px solid var(--gold);
  box-shadow:0 0 60px rgba(255,200,87,.35), 0 0 120px rgba(230,90,70,.25);
  animation:pop .4s cubic-bezier(.2,1.6,.4,1)
}
@keyframes pop{0%{transform:scale(.6);opacity:0}100%{transform:scale(1);opacity:1}}
.result-card .big-emoji{font-size:72px;line-height:1;margin-bottom:12px}
.result-card .title{font-size:26px;font-weight:800;margin-bottom:10px;color:var(--gold);letter-spacing:2px;font-family:var(--mystery-font)}
.result-card .desc{font-size:15px;color:var(--dim);line-height:1.8}
.result-card .halved{color:var(--green);font-weight:700}

/* ---------- 猜中: 两个碰杯的酒杯, 从全屏缩小到屏幕中央 ---------- */
.cheers-card{position:relative;border-color:var(--gold);overflow:visible}
.cheers-pair{
  display:flex;align-items:flex-end;justify-content:center;gap:0;
  line-height:1;margin:0 auto 6px;transform-origin:50% 50%;
  will-change:transform,opacity
}
.cheers-pair .glass{font-size:86px;display:block;transform-origin:60% 80%}
.cheers-card.cheers-anim .cheers-pair{animation:cheers-shrink 1.05s cubic-bezier(.18,1.25,.32,1) both}
.cheers-card.cheers-anim .glass.left{animation:clink-left 1.05s cubic-bezier(.3,1.4,.4,1) both}
.cheers-card.cheers-anim .glass.right{animation:clink-right 1.05s cubic-bezier(.3,1.4,.4,1) both}
/* 从 5 倍(铺满手机屏)缩到 1 倍(屏幕中央) */
@keyframes cheers-shrink{
  0%   {transform:scale(5);  opacity:0; filter:blur(10px)}
  14%  {transform:scale(4.4);opacity:1; filter:blur(3px)}
  62%  {transform:scale(1.16);filter:blur(0)}
  78%  {transform:scale(.94)}
  100% {transform:scale(1)}
}
@keyframes clink-left{
  0%,52%{transform:rotate(0deg)}
  68%{transform:rotate(15deg) translateX(6px)}
  82%{transform:rotate(8deg) translateX(2px)}
  100%{transform:rotate(9deg) translateX(3px)}
}
@keyframes clink-right{
  0%,52%{transform:rotate(0deg)}
  68%{transform:rotate(-15deg) translateX(-6px)}
  82%{transform:rotate(-8deg) translateX(-2px)}
  100%{transform:rotate(-9deg) translateX(-3px)}
}
/* 碰杯瞬间的光晕 */
.clink-flash{
  position:absolute;left:50%;top:34%;width:10px;height:10px;margin:-5px 0 0 -5px;
  border-radius:50%;background:radial-gradient(circle,rgba(255,255,255,.95),rgba(255,200,87,.7) 35%,transparent 70%);
  opacity:0;pointer-events:none
}
.cheers-card.cheers-anim .clink-flash{animation:clink-burst .55s ease-out .62s both}
@keyframes clink-burst{
  0%{opacity:0;transform:scale(1)}
  35%{opacity:1;transform:scale(16)}
  100%{opacity:0;transform:scale(26)}
}
.cheers-title{animation:fade-up .4s ease-out .72s both}
.cheers-desc{animation:fade-up .4s ease-out .86s both}
@keyframes fade-up{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}

/* ---------- 散场战绩 ---------- */
.finish-btn{flex:0 0 46px}
.summary-card{
  text-align:center;padding:24px 12px;
  background:linear-gradient(160deg, rgba(255,255,255,.05), rgba(230,90,70,.10));
  border:1px solid var(--line);border-radius:24px
}
.summary-card h1{font-size:28px;margin:8px 0;font-family:var(--mystery-font);letter-spacing:6px}
.rank-list{margin:18px 0;text-align:left}
.rank-row{
  display:flex;align-items:center;gap:12px;padding:14px 16px;margin-bottom:10px;
  border-radius:14px;background:var(--card);border:1px solid var(--line)
}
.rank-row.top{border-color:var(--gold);background:rgba(255,200,87,.14);box-shadow:0 0 24px rgba(255,200,87,.2)}
.rank-row .medal{font-size:22px;width:30px;text-align:center}
.rank-row .rname{flex:1;font-weight:600}
.rank-row .rtag{font-size:12px;color:var(--dim);margin-right:6px}
.rank-row .rcups{font-weight:800;color:var(--gold)}

/* ---------- 历史战绩 ---------- */
.btn.ghost{background:transparent;border:1px dashed var(--line);font-size:15px}
.btn.wx-nick{
  background:linear-gradient(135deg, rgba(7,193,96,.85), rgba(7,150,80,.75));
  border:none;color:#fff;font-size:15px;letter-spacing:1px
}
.btn.small{width:auto;padding:8px 14px;font-size:13px;margin:0}
.history-card{
  padding:20px 14px;
  background:linear-gradient(160deg, rgba(255,255,255,.05), rgba(230,90,70,.10));
  border:1px solid var(--line);border-radius:24px
}
.hud-row{display:flex;align-items:center;gap:12px;margin-bottom:14px}
.hud-row h2{font-size:18px;margin:0;letter-spacing:3px;font-family:var(--mystery-font);flex:1;text-align:right}
.history-stats{display:flex;gap:8px;margin-bottom:16px}
.history-stats .stat{
  flex:1;text-align:center;padding:12px 6px;border-radius:14px;
  background:var(--card);border:1px solid var(--line)
}
.history-stats .stat b{display:block;font-size:22px;color:var(--gold);font-family:var(--mystery-font)}
.history-stats .stat span{font-size:11px;color:var(--dim)}
.history-list{text-align:left}
.history-item{
  padding:12px 14px;margin-bottom:10px;border-radius:14px;
  background:var(--card);border:1px solid var(--line)
}
.history-item .h-top{display:flex;justify-content:space-between;align-items:baseline;gap:8px;margin-bottom:6px}
.history-item .h-date{font-size:12px;color:var(--dim)}
.history-item .h-mine{font-size:14px;font-weight:800;color:var(--gold)}
.history-item .h-people{font-size:12px;color:var(--text);opacity:.85;line-height:1.7;word-break:break-all}
.history-item .h-top-drinker{font-size:12px;color:var(--green);margin-top:4px}
.history-empty{text-align:center;color:var(--dim);font-size:13px;padding:30px 10px;line-height:2}

/* ---------- 钱包 / 提现 ---------- */
.wallet-withdraw{
  margin:6px 0 16px;padding:16px;border-radius:16px;
  background:linear-gradient(135deg, rgba(255,200,87,.12), rgba(230,90,70,.12));
  border:1px solid rgba(255,200,87,.4)
}
.wallet-withdraw .row{display:flex;gap:8px;align-items:center;margin-bottom:10px}
.wallet-withdraw input{
  flex:1;padding:11px 12px;border-radius:10px;border:1px solid var(--line);
  background:rgba(13,6,32,.7);color:var(--text);font-size:14px;text-align:left;margin:0
}
.wallet-withdraw .hint{font-size:12px;color:var(--dim);line-height:1.7;margin:8px 0 0}
.wallet-withdraw .hint.warn{color:#ffb3c1}
.wallet-list{margin-top:6px}
.wallet-item{
  display:flex;justify-content:space-between;align-items:center;gap:8px;
  padding:12px 14px;margin-bottom:8px;border-radius:12px;
  background:var(--card);border:1px solid var(--line);font-size:13px
}
.wallet-item .w-amt{font-weight:800;color:var(--gold)}
.wallet-item .w-time{font-size:11px;color:var(--dim)}
.wallet-tag{padding:2px 9px;border-radius:99px;font-size:11px;white-space:nowrap}
.wallet-tag.pending{background:rgba(255,200,87,.18);color:var(--gold)}
.wallet-tag.paid{background:rgba(74,222,128,.16);color:var(--green)}
.wallet-tag.rejected{background:rgba(255,77,109,.16);color:#ffb3c1}

/* ---------- 特效层 ---------- */
#fx-layer{position:fixed;inset:0;pointer-events:none;z-index:200}
.flash{position:absolute;inset:0;animation:flash-out .5s ease-out forwards}
@keyframes flash-out{0%{opacity:.85}100%{opacity:0}}
.flash.red{background:radial-gradient(circle,rgba(255,77,109,.9),transparent 70%)}
.flash.gold{background:radial-gradient(circle,rgba(255,200,87,.9),transparent 70%)}
.confetti{position:absolute;width:10px;height:10px;border-radius:2px;animation:fall linear forwards}
@keyframes fall{0%{transform:translateY(-10vh) rotate(0);opacity:1}100%{transform:translateY(110vh) rotate(720deg);opacity:0}}
.shake{animation:shake .5s}
@keyframes shake{0%,100%{transform:translateX(0)}20%{transform:translateX(-8px)}40%{transform:translateX(8px)}60%{transform:translateX(-5px)}80%{transform:translateX(5px)}}
.toast{
  position:fixed;left:50%;bottom:calc(118px + env(safe-area-inset-bottom));transform:translateX(-50%);
  background:rgba(255,77,109,.95);color:#fff;padding:12px 20px;border-radius:999px;
  font-size:14px;z-index:300;animation:toast-in .25s;max-width:80vw;text-align:center;
  box-shadow:0 8px 24px rgba(0,0,0,.4)
}
@keyframes toast-in{from{opacity:0;transform:translate(-50%,10px)}to{opacity:1;transform:translate(-50%,0)}}

/* ---------- 微信提示 ---------- */


/* ---------- 捐赠模式 ---------- */
.donate-card{border-color:rgba(7,193,96,.5)}
.donate-amount{color:var(--gold);font-size:22px;font-family:var(--hei);font-variant-numeric:tabular-nums}
.donate-qr-wrap{
  margin:12px auto;width:min(210px,60vw);aspect-ratio:1;
  background:#fff;border-radius:14px;padding:8px;display:flex;align-items:center;justify-content:center;
  box-shadow:0 0 0 2px rgba(7,193,96,.55), 0 0 30px rgba(7,193,96,.25)
}
.donate-qr{width:100%;height:100%;object-fit:contain;border-radius:8px;display:block}
.donate-qr-missing{
  color:#666;font-size:12px;text-align:center;line-height:1.7;padding:10px
}
.donate-qr-missing small{color:#999}
.donate-tip{font-size:12px;color:var(--dim);text-align:center;margin:6px 0 12px !important}
.donate-pending{
  padding:12px;border-radius:12px;text-align:center;font-size:13px;line-height:1.7;
  background:rgba(255,200,87,.14);border:1px dashed rgba(255,200,87,.5);color:var(--gold)
}
.donate-pending small{color:var(--dim)}

/* 收起的捐赠入口(候场页默认) —— 避免和"进房二维码"并排出现两个码 */
.donate-folded{
  display:flex;align-items:center;gap:10px;cursor:pointer;
  padding:13px 15px !important;background:rgba(255,200,87,.07)
}
.donate-folded:active{transform:scale(.985)}
.donate-folded > span:first-child{flex:1;font-size:14px;color:var(--text)}
.donate-folded-amount{color:var(--gold);font-weight:700;font-variant-numeric:tabular-nums}
.donate-folded-more{font-size:12px;color:var(--dim);white-space:nowrap}
/* 让赞赏码图片别把整页撑得太满 */
.donate-qr-wrap{width:min(178px,50vw);aspect-ratio:auto;padding:6px}
.donate-qr{height:auto}

/* ---------- 右上角图标(战绩 / 钱包) ---------- */
.corner-actions{
  position:fixed;z-index:60;top:calc(10px + env(safe-area-inset-top,0px));right:12px;
  display:flex;gap:8px
}
.icon-btn{
  position:relative;width:42px;height:42px;border-radius:50%;cursor:pointer;
  border:1px solid rgba(255,200,87,.34);
  background:rgba(18,9,36,.74);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);
  color:var(--gold);font-size:19px;line-height:1;
  display:flex;align-items:center;justify-content:center;
  box-shadow:0 2px 14px rgba(0,0,0,.4)
}
.icon-btn:active{transform:scale(.92)}
.icon-btn .dot{
  position:absolute;top:1px;right:1px;width:10px;height:10px;border-radius:50%;
  background:#ff4d6d;box-shadow:0 0 9px #ff4d6d;border:1.5px solid #1e0f0e
}
/* 给顶部标题区留出图标的位置 */
#view-entry > .card, #view-entry{padding-top:6px}
#view-entry h1{margin-top:44px}

/* 副标题(口号): 比主标题轻, 但比规则说明重 */
.tagline{
  margin:-4px 0 12px;font-size:15px;letter-spacing:5px;color:var(--gold);
  opacity:.82;text-shadow:0 0 14px rgba(255,200,87,.35);
  /* letter-spacing 会在最后一个字后也留空, 居中时会偏左, 补回一半 */
  text-indent:2.5px
}

/* 候场页(截图转发)上的品牌署名 */
.brand-mini{
  font-size:11px;letter-spacing:2px;color:var(--dim);opacity:.75;margin-bottom:6px
}

/* ---------- 详细规则浮层 ---------- */
.rules-link{
  display:inline-block;margin:2px auto 12px;padding:7px 14px;border-radius:99px;cursor:pointer;
  background:rgba(255,200,87,.08);border:1px solid rgba(255,200,87,.3);
  color:var(--gold);font-size:12.5px;letter-spacing:1px
}
.rules-link:active{transform:scale(.96)}
.rules-overlay{
  position:fixed;inset:0;z-index:230;display:flex;align-items:flex-end;justify-content:center;
  background:rgba(10,4,3,.8);backdrop-filter:blur(5px);padding:0
}
.rules-sheet{
  width:100%;max-width:520px;max-height:88vh;display:flex;flex-direction:column;
  background:linear-gradient(180deg,#2a1412,#1b0d0b);
  border:1px solid rgba(255,200,87,.3);border-bottom:none;
  border-radius:20px 20px 0 0;padding:18px 18px calc(18px + env(safe-area-inset-bottom,0px))
}
.rules-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:12px}
.rules-head h3{margin:0;font-size:18px;color:var(--gold);letter-spacing:3px}
.rules-x{
  width:32px;height:32px;border-radius:50%;cursor:pointer;font-size:15px;
  background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.14);color:var(--text)
}
.rules-body{overflow-y:auto;-webkit-overflow-scrolling:touch;flex:1;padding-right:4px}
.rules-body h4{
  margin:20px 0 8px;font-size:14px;color:var(--gold);letter-spacing:2px;
  padding-left:9px;border-left:3px solid var(--brand)
}
.rules-body p{margin:8px 0;font-size:13.5px;line-height:1.85;color:var(--text)}
.rules-body ol,.rules-body ul{margin:8px 0;padding-left:22px;font-size:13.5px;line-height:2;color:var(--text)}
.rules-body li{margin-bottom:2px}
.rules-body b{color:var(--gold)}
.rules-hero{
  padding:14px;border-radius:12px;font-size:14px;line-height:1.9;text-align:center;
  background:rgba(230,57,70,.11);border:1px solid rgba(230,57,70,.3)
}
.rule-table{width:100%;border-collapse:collapse;margin:10px 0;font-size:13px}
.rule-table th{
  text-align:left;padding:8px 10px;font-size:12px;font-weight:600;color:var(--dim);
  border-bottom:1px solid rgba(255,200,87,.25)
}
.rule-table td{padding:9px 10px;border-bottom:1px solid rgba(255,255,255,.06);line-height:1.6}
.rule-table small{color:var(--dim);font-size:11px}
.rule-table tr.hl td{background:rgba(255,200,87,.09)}
/* 手机上三列会把字挤断行, 两列更好读 */
.rule-table.two th:first-child,.rule-table.two td:first-child{width:38%}
.rule-table.two td:last-child{color:var(--text)}
.rule-warn{
  padding:11px 13px;border-radius:10px;font-size:12.5px !important;line-height:1.85;
  background:rgba(255,200,87,.07);border-left:3px solid var(--gold);color:var(--text)
}
.rule-tip{font-size:12.5px !important;color:var(--dim) !important}
.rules-sheet .btn{margin-top:14px;margin-bottom:0;flex-shrink:0}

/* ---------- 入场页「回到房间」横幅 ---------- */
.rejoin-banner{margin:0 0 14px}
.rejoin-inner{
  display:flex;align-items:center;gap:12px;justify-content:space-between;
  padding:12px 14px;border-radius:14px;
  background:linear-gradient(135deg, rgba(230,57,70,.16), rgba(255,200,87,.10));
  border:1px solid rgba(255,200,87,.42)
}
.rejoin-text{display:flex;flex-direction:column;gap:3px;min-width:0}
.rejoin-text b{font-size:13.5px;color:var(--text)}
.rejoin-text span{font-size:12px;color:var(--gold);letter-spacing:1px;font-variant-numeric:tabular-nums}
.rejoin-btn{
  flex:0 0 auto;padding:9px 15px;border-radius:99px;border:none;cursor:pointer;
  background:linear-gradient(135deg,var(--brand),var(--brand2));color:#fff5ef;
  font-size:13px;font-weight:700;white-space:nowrap
}
.rejoin-btn:active{transform:scale(.95)}