/* BUILD 237:邀请好友 —— 大厅横条 / 抽屉入口 / 弹窗 */
#app .refbar{width:100%;margin:0 0 12px;padding:11px 14px;border-radius:16px;border:1px solid rgba(255,120,160,.42);text-align:left;
  background:linear-gradient(110deg,rgba(255,120,160,.16),rgba(255,255,255,.03) 70%);display:flex;align-items:center;gap:12px;color:var(--ink);cursor:pointer}
#app .refbar.hide{display:none}
#app .refbar:active{transform:scale(.99)}
#app .refbar .rb-ic{flex:0 0 34px;height:34px;border-radius:50%;display:grid;place-items:center;font-size:17px;background:rgba(255,120,160,.22);color:#ff9fbf}
#app .refbar .rb-tx{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
#app .refbar .rb-tx b{font:800 15px var(--display)}
#app .refbar .rb-tx i{font-style:normal;font-size:11.5px;line-height:1.35;color:var(--muted)}
#app .refbar .rb-tx i b{font:inherit;font-weight:800;color:var(--money,#ffd166)}
#app .refbar .rb-go{font-size:22px;color:var(--muted)}
#app .refdrawer{display:block;width:100%;margin:0 0 12px;padding:9px 12px;border-radius:12px;border:1px dashed rgba(255,120,160,.5);background:rgba(255,120,160,.08);
  color:#ffb3cc;font:700 12.5px var(--display);text-align:left;cursor:pointer}
#app .refdrawer.hide{display:none}

#app .refcard{max-width:420px;padding:14px 16px 16px}
#app .ref-off{margin:0 0 10px;padding:8px 10px;border-radius:10px;background:rgba(255,120,120,.14);color:#ffb0b0;font-size:12.5px}
#app .ref-code{display:flex;align-items:center;gap:10px;padding:12px 14px;border-radius:14px;background:rgba(255,255,255,.05);border:1px solid rgba(255,200,87,.35);margin-bottom:10px}
#app .ref-code span,#app .ref-link span{flex:0 0 auto;font-size:11px;color:var(--muted);text-transform:uppercase;letter-spacing:.05em}
#app .ref-code b{flex:1;font:900 26px/1 var(--num,ui-monospace,monospace);letter-spacing:.14em;color:var(--money,#ffd166);text-align:center}
#app .ref-copy{flex:0 0 auto;padding:7px 12px;border-radius:999px;border:1px solid rgba(255,255,255,.18);background:rgba(255,255,255,.06);color:var(--ink);font:700 12px var(--display);cursor:pointer}
#app .ref-copy:active{background:rgba(255,255,255,.14)}
#app .ref-link{display:flex;align-items:center;gap:8px;margin-bottom:10px}
#app .ref-link input{flex:1;min-width:0;padding:8px 10px;border-radius:10px;border:1px solid rgba(255,255,255,.12);background:rgba(0,0,0,.3);color:var(--ink);font:600 12px ui-monospace,monospace}
#app .ref-acts{display:flex;gap:8px;margin-bottom:10px}
#app .ref-wa{flex:1;display:flex;align-items:center;justify-content:center;gap:8px;padding:11px;border-radius:12px;background:#25d366;color:#06301a;font:800 13.5px var(--display);text-decoration:none}
#app .ref-wa svg{width:20px;height:20px;fill:currentColor}
#app .ref-qrbtn{flex:0 0 auto;padding:11px 14px;border-radius:12px;border:1px solid rgba(255,255,255,.18);background:rgba(255,255,255,.06);color:var(--ink);font:700 13px var(--display);cursor:pointer}
#app .ref-qr{display:grid;place-items:center;padding:10px;margin-bottom:10px;border-radius:14px;background:#fff}
#app .ref-qr.hide{display:none}
#app .ref-qr svg{width:min(220px,70vw);height:auto}
#app .ref-nums{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-bottom:12px}
#app .ref-nums div{display:flex;flex-direction:column;align-items:center;gap:2px;padding:10px 6px;border-radius:12px;background:rgba(255,255,255,.05)}
#app .ref-nums b{font:800 20px var(--num,var(--display));color:var(--money,#ffd166);font-variant-numeric:tabular-nums}
#app .ref-nums span{font-size:11px;color:var(--muted)}
#app .ref-sec{font-size:11px;color:var(--muted);text-transform:uppercase;letter-spacing:.06em;margin:4px 0 6px}
#app .ref-list{list-style:none;margin:0 0 12px;padding:0;max-height:180px;overflow-y:auto;border-radius:12px;background:rgba(255,255,255,.04)}
#app .ref-list li{display:grid;grid-template-columns:1fr auto auto auto;gap:8px;align-items:center;padding:8px 10px;border-bottom:1px solid rgba(255,255,255,.06);font-size:12.5px}
#app .ref-list li:last-child{border-bottom:0}
#app .ref-list .rf-n{font-weight:700}
#app .ref-list .rf-a,#app .ref-list .rf-d{color:var(--muted);font-size:11px}
#app .ref-list .rf-s{font-size:11px;padding:2px 7px;border-radius:999px;background:rgba(255,255,255,.08);color:var(--muted)}
#app .ref-list .rf-s.ok{background:rgba(95,245,177,.18);color:#5ff5b1}
#app .ref-none{margin:0 0 12px;padding:12px;border-radius:12px;background:rgba(255,255,255,.04);font-size:12.5px;color:var(--muted);text-align:center}
#app .ref-rules{margin:0;padding:0 0 0 18px;font-size:11.5px;line-height:1.5;color:var(--muted)}
#app .ref-rules li{margin-bottom:3px}
#app #regAgentHint{display:none}

/* BUILD 240:记录一行两行式 */
#app .mbhead{flex-wrap:wrap;row-gap:3px;padding:9px 10px}
#app .mbhead .mbtop{display:flex;align-items:center;gap:7px;width:100%;min-width:0}
#app .mbhead .mbgame{font:800 13px var(--display);color:var(--ink);white-space:nowrap}
#app .mbhead .mbtime{font-size:11px;color:var(--muted);font-variant-numeric:tabular-nums;white-space:nowrap}
#app .mbhead .mbres{font-size:10.5px;font-weight:800;padding:1px 7px;border-radius:999px;background:rgba(255,255,255,.08);color:var(--muted)}
#app .mbhead .mbres.p{background:rgba(95,245,177,.18);color:var(--win,#5ddc9a)}
#app .mbhead .mbres.n{background:rgba(255,107,122,.16);color:var(--lose,#ff6b7a)}
#app .mbhead .mbtop .netline{margin-left:auto;font-size:14px}
#app .mbhead .mbsum{display:block;width:100%;text-align:left;font-size:11.5px;line-height:1.35;color:var(--muted);white-space:normal}
#app .mbhead .mbsum i{font-style:normal;color:var(--money,#ffd166);margin:0 2px}

/* BUILD 245:记录展开后最上面「开出 …」一行 */
#app .bkout{margin:2px 0 6px;padding:7px 10px;border-radius:9px;background:rgba(255,209,102,.1);border:1px solid rgba(255,209,102,.28);color:var(--money,#ffd166);font-weight:700;font-size:12.5px;line-height:1.35}
