/* 积分场 lobby: the hero, the ticker, room cards with live previews, the daily card and the leaderboard; the BEM tiers keep p2p.css */
.dfont { font-family:'ZCOOL QingKe HuangYou','PingFang SC',sans-serif; font-weight:400; letter-spacing:1px; }
.numf { font-family:'Barlow Condensed',-apple-system,sans-serif; font-weight:800; font-variant-numeric:tabular-nums; }
.modes { display:flex; gap:4px; padding:4px; border-radius:999px; background:var(--panel2); border:1px solid var(--line); }
.mode { border:0; border-radius:999px; padding:7px 16px; font-weight:800; font-size:13px; cursor:pointer; min-height:34px; background:transparent; color:var(--muted); font-family:inherit; }
.mode.on.points { background:linear-gradient(180deg,#9aeccd,#5fd0a8); color:#04130d; }
.mode.on.chain { background:linear-gradient(180deg,var(--gold2),var(--gold)); color:#1a1200; }
.pill.pts { gap:8px; padding:4px 8px 4px 4px; background:rgba(95,208,168,.1); border-color:rgba(95,208,168,.45); color:#7fe0bd; }
.coin { width:22px; height:22px; border-radius:50%; background:radial-gradient(circle at 35% 30%,#9aeccd,#2f9a76); border:2px dashed #eafff6; box-sizing:border-box; flex:none; }
.pill.pts b { font-family:'Barlow Condensed',sans-serif; font-size:17px; color:var(--text); }
.phero { position:relative; min-height:330px; border-radius:22px; overflow:hidden; border:1px solid var(--rim); background:radial-gradient(700px 320px at 72% 55%,var(--felt1) 0%,var(--felt2) 55%,var(--felt3) 100%); box-shadow:0 20px 60px #0008, inset 0 0 0 1px rgba(245,215,122,.12); display:flex; margin-bottom:16px; }
.phero::before { content:""; position:absolute; inset:0; z-index:1; pointer-events:none; background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='220' height='160' viewBox='0 0 220 160'%3E%3Cdefs%3E%3Cg id='p'%3E%3Cellipse cx='5.2' cy='10.2' rx='2.3' ry='2.9' transform='rotate(-20 5.2 10.2)'/%3E%3Cellipse cx='9.3' cy='6.3' rx='2.4' ry='3.1' transform='rotate(-7 9.3 6.3)'/%3E%3Cellipse cx='14.7' cy='6.3' rx='2.4' ry='3.1' transform='rotate(7 14.7 6.3)'/%3E%3Cellipse cx='18.8' cy='10.2' rx='2.3' ry='2.9' transform='rotate(20 18.8 10.2)'/%3E%3Cpath d='M12 11c-3.2 0-6.8 2.9-6.8 6.1 0 2.1 1.7 3.3 3.7 3 1.2-.2 2-.7 3.1-.7s1.9.5 3.1.7c2 .3 3.7-.9 3.7-3 0-3.2-3.6-6.1-6.8-6.1z'/%3E%3C/g%3E%3C/defs%3E%3Cg fill='%23ffffff' fill-opacity='.07'%3E%3Cuse href='%23p' transform='translate(20 110) rotate(-25) scale(1.2)'/%3E%3Cuse href='%23p' transform='translate(70 70) rotate(-10) scale(1.2)'/%3E%3Cuse href='%23p' transform='translate(125 90) rotate(-30) scale(1.2)'/%3E%3Cuse href='%23p' transform='translate(175 45) rotate(-15) scale(1.2)'/%3E%3C/g%3E%3C/svg%3E") 0 0/220px 160px repeat; } /* 喵喵德州俱乐部: a trail of paw prints */
.phero .copy { position:relative; z-index:2; width:600px; max-width:100%; padding:30px 40px; box-sizing:border-box; display:flex; flex-direction:column; gap:14px; }
.badge-live { align-self:flex-start; display:inline-flex; align-items:center; gap:8px; padding:4px 12px; border-radius:999px; background:#0000005a; border:1px solid rgba(245,215,122,.35); font-size:12px; color:var(--gold2); font-weight:700; }
.badge-live i { width:8px; height:8px; border-radius:50%; background:var(--green); box-shadow:0 0 10px var(--green); }
.phero h1 { margin:0; font-size:52px; line-height:1.05; letter-spacing:2px; color:#fff6dc; text-shadow:0 3px 0 #0a2a1b, 0 10px 30px #0008; }
.phero h1 em { font-style:normal; color:var(--gold2); }
.phero p { margin:0; font-size:15px; color:#cfe3d6; max-width:460px; }
.phero .cta { display:flex; gap:12px; align-items:center; margin-top:4px; flex-wrap:wrap; }
.btn.big { padding:14px 26px; font-size:17px; border-radius:12px; min-height:52px; display:inline-flex; align-items:center; gap:10px; text-decoration:none; }
.btn.dark { background:#0000004d; color:var(--text); border:1px solid #ffffff2e; box-shadow:none; }
.btn.mint { background:linear-gradient(180deg,#9aeccd,#5fd0a8); color:#04130d; box-shadow:0 2px 0 #2c7a60; }
.art { position:absolute; right:40px; top:48px; width:640px; height:234px; pointer-events:none; }
.art .rim { position:absolute; left:40px; top:16px; width:560px; height:200px; border-radius:999px; background:var(--rim); box-shadow:0 24px 50px #0009, inset 0 2px 0 #ffffff1f; }
.art .felt { position:absolute; left:56px; top:30px; width:528px; height:172px; border-radius:999px; background:radial-gradient(ellipse at 50% 40%,#2a8a5a,var(--felt1) 45%,var(--felt2) 100%); box-shadow:inset 0 0 0 2px rgba(245,215,122,.35), inset 0 8px 30px #0006; }
.art .line { position:absolute; left:90px; top:58px; width:460px; height:116px; border-radius:999px; border:1.5px dashed rgba(245,215,122,.25); }
.art .potl { position:absolute; left:0; right:0; top:50px; text-align:center; } .art .potl span { padding:2px 12px; border-radius:999px; background:#00000073; color:var(--gold2); font-size:16px; }
.art .brd { position:absolute; left:0; right:0; top:82px; display:flex; justify-content:center; gap:8px; }
.bcard { width:50px; height:70px; border-radius:7px; background:#fbf8ef; box-shadow:0 6px 14px #0006; color:#16181d; display:flex; flex-direction:column; align-items:center; justify-content:center; font-size:26px; line-height:1; }
.bcard.red { color:#c8322f; } .bcard small { font-size:22px; }
.bcard.back { background:repeating-linear-gradient(45deg,#8a2323 0 6px,#a32b2b 6px 12px); border:3px solid #fbf8ef; box-sizing:border-box; }
.art .av { position:absolute; width:44px; height:44px; border-radius:50%; border:3px solid var(--bg); display:flex; align-items:center; justify-content:center; font-weight:800; color:#fff; }
.art .av.you { background:#00000059; border:2px dashed var(--gold2); color:var(--gold2); font-size:12px; box-sizing:border-box; }
.stack3 { position:absolute; display:flex; flex-direction:column-reverse; } .stack3 i { width:34px; height:9px; border-radius:50%; border:2px dashed #fff3c8; margin-top:-4px; box-sizing:border-box; background:var(--gold); } .stack3 i.r { background:#c8322f; border-color:#ffd9d6; } .stack3 i.b { background:#2c6fd1; border-color:#d8e6ff; } .stack3 i.k { background:#16181d; border-color:#9aa3b0; }
.ticker { display:flex; align-items:center; gap:14px; padding:10px 16px; border-radius:12px; background:#10161e; border:1px solid var(--line); font-size:13px; color:#a9b3c1; overflow:hidden; white-space:nowrap; margin-bottom:16px; }
.ticker .lbl { flex:none; font-weight:800; color:var(--gold2); font-size:12px; letter-spacing:1px; }
.ticker .row { display:flex; flex-wrap:nowrap; gap:22px; overflow:hidden; margin:0; min-width:0; flex:1; } /* p2p.css's .row wraps; a ticker is one line */ .ticker b { color:var(--text); } .ticker .amt { color:#7fe0bd; font-family:'Barlow Condensed',sans-serif; font-size:15px; margin-left:6px; font-weight:800; }
.ptsgrid { display:flex; gap:20px; align-items:flex-start; }
.roomsCol { flex:1; min-width:0; display:flex; flex-direction:column; gap:12px; }
.rhead { display:flex; align-items:center; gap:10px; flex-wrap:wrap; } .rhead h2 { margin:0; font-size:28px; }
.lvchips { display:flex; gap:6px; flex-wrap:wrap; } .chip { border-radius:999px; padding:6px 14px; font-weight:700; font-size:13px; cursor:pointer; min-height:34px; background:#ffffff0a; color:#a9b3c1; border:1px solid var(--line); font-family:inherit; } .chip.on { background:var(--text); color:var(--bg); border-color:var(--text); }
.prooms .empty { grid-column:1 / -1; display:flex; align-items:center; gap:10px; flex-wrap:wrap; }
.prooms { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:14px; }
.proom { display:flex; flex-direction:column; gap:10px; padding:12px 12px 14px; border-radius:16px; border:1px solid var(--line); background:linear-gradient(180deg,#161d27,#121820); box-shadow:0 10px 30px #0005; text-decoration:none; color:var(--text); transition:transform .15s,border-color .15s; }
.proom:hover { border-color:var(--gold); transform:translateY(-2px); }
.proom .info { display:flex; flex-direction:column; gap:10px; min-width:0; }
.mini { position:relative; height:164px; border-radius:12px; background:radial-gradient(ellipse at 50% 50%,#13241d,#0c1512); overflow:hidden; }
.mini .rim { position:absolute; left:34px; right:34px; top:28px; bottom:28px; border-radius:999px; background:var(--rim); box-shadow:0 8px 20px #0008; }
.mini .felt { position:absolute; left:40px; right:40px; top:34px; bottom:34px; border-radius:999px; background:radial-gradient(ellipse at 50% 40%,#2a8a5a,var(--felt1) 50%,var(--felt2) 100%); box-shadow:inset 0 0 0 1.5px rgba(245,215,122,.3); }
.mini .potl { position:absolute; left:0; right:0; top:44px; text-align:center; } .mini .potl span { padding:0 8px; border-radius:999px; background:#00000073; color:var(--gold2); font-size:13px; }
.mini .brd { position:absolute; left:0; right:0; top:68px; display:flex; justify-content:center; gap:4px; }
.mcard { width:22px; height:31px; border-radius:4px; background:#fbf8ef; box-shadow:0 2px 5px #0006; color:#16181d; display:flex; flex-direction:column; align-items:center; justify-content:center; font-size:13px; line-height:1; } .mcard.red { color:#c8322f; } .mcard small { font-size:11px; } .mcard.mslot { background:transparent; box-shadow:none; border:1px dashed rgba(245,215,122,.3); box-sizing:border-box; }
.mini .mseat { position:absolute; width:30px; height:30px; border-radius:50%; box-sizing:border-box; display:flex; align-items:center; justify-content:center; font-weight:800; font-size:12px; color:#fff; border:2px solid var(--bg); transform:translate(-50%,-50%); }
.mini .mseat.free { background:#00000059; border:1.5px dashed rgba(245,215,122,.55); color:var(--gold2); }
.mini .mseat.off { opacity:.4; filter:grayscale(.8); } /* seated, page closed */
.mini .mseat.gone { background:#00000040; border:1.5px solid #ffffff1a; color:#ffffff38; font-weight:600; } /* the chair of one who left, held until settled */
.mini .mseat.act { box-shadow:0 0 0 2px var(--gold2), 0 0 14px rgba(245,215,122,.7); }
.mini .mstage { position:absolute; left:8px; top:8px; display:inline-flex; align-items:center; gap:5px; padding:1px 8px; border-radius:999px; background:#0000008c; font-size:11px; } .mini .mstage i { width:6px; height:6px; border-radius:50%; background:currentColor; }
.mini .hot { position:absolute; right:8px; top:8px; padding:1px 8px; border-radius:999px; background:#c8322f; font-size:11px; font-weight:800; color:#fff; }
.proom { min-width:0; } .proom .nm { display:flex; align-items:center; gap:8px; min-width:0; } .proom .nm .title { min-width:0; /* flex items do not shrink below their text unless told */ font-size:21px; line-height:1.1; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; } .proom .nm .id { font-size:11px; color:#6f7a8a; font-family:ui-monospace,Menlo,monospace; }
.lv { padding:1px 8px; border-radius:6px; font-size:11px; font-weight:800; margin-left:auto; flex:none; } .lv.easy { background:rgba(95,208,168,.15); color:#7fe0bd; } .lv.mid { background:rgba(91,111,214,.2); color:#aab7ff; } .lv.pro { background:rgba(200,50,47,.2); color:#ff8e8b; }
.proom .meta { display:flex; align-items:center; gap:12px; font-size:12px; color:var(--muted); } .proom .meta b { color:var(--text); font-family:'Barlow Condensed',sans-serif; font-size:15px; }
.mstate { display:none; font-size:12px; } /* phones: the table's state as a line, the badge on the mini table is hidden there */
.proom .foot { display:flex; align-items:center; gap:10px; font-size:13px; color:#a9b3c1; } .proom .foot b { color:var(--text); }
.cta { padding:8px 16px; border-radius:10px; font-weight:800; font-size:13px; white-space:nowrap; } .cta.sit { background:linear-gradient(180deg,var(--gold2),var(--gold)); color:#1a1200; box-shadow:0 2px 0 #8a6a1a; } .cta.watch { border:1px solid var(--line); color:#a9b3c1; font-weight:700; }
.side2 { width:328px; flex:none; display:flex; flex-direction:column; gap:14px; padding-top:50px; }
.card.daily { border-color:rgba(95,208,168,.35); background:linear-gradient(160deg,#15302a,#111a1f 70%); display:flex; flex-direction:column; gap:12px; }
.daily .top { display:flex; align-items:center; gap:12px; } .daily .top .coin { width:46px; height:46px; border-width:3px; box-shadow:0 4px 12px #0006; }
.daily .bal { font-size:38px; line-height:1; color:#eafff6; } .daily .lbl { font-size:12px; color:#9fb8ad; }
.daily .box { display:flex; flex-direction:column; gap:8px; padding:12px; border-radius:12px; background:#00000040; }
.streak { display:grid; grid-template-columns:repeat(7,minmax(0,1fr)); gap:4px; } .streak span { height:34px; border-radius:8px; display:flex; align-items:center; justify-content:center; font-size:11px; font-weight:800; box-sizing:border-box; background:#ffffff0d; color:#6f7a8a; }
.streak span.done { background:#5fd0a8; color:#04130d; } .streak span.today { background:rgba(245,215,122,.15); border:1.5px solid var(--gold2); color:var(--gold2); } .streak span.big { background:rgba(200,50,47,.2); border:1px solid rgba(255,142,139,.5); color:#ff8e8b; }
.btn.claim { width:100%; padding:10px; font-size:15px; min-height:44px; }
.btn.claimed { background:#ffffff0f; color:#9fb8ad; border:1px solid rgba(95,208,168,.3); box-shadow:none; }
.namerow { display:flex; gap:6px; } .namerow input { flex:1; min-width:0; padding:8px 10px; border-radius:8px; border:1px solid var(--line); background:#0b0e13; color:var(--text); font-size:16px; }
.card.board { display:flex; flex-direction:column; gap:10px; } .board .bhead { display:flex; align-items:baseline; } .board .bhead .dfont { font-size:22px; }
.card.board #board { flex-direction:column; justify-content:flex-start; gap:10px; min-height:0; } /* the leaderboard shares its id with the table's five community cards (p2p.css #board: one centred row), and the lobby loads p2p.css too */
.board .p { display:flex; align-items:center; gap:10px; } .board .p .rk { width:22px; text-align:center; font-size:18px; color:#6f7a8a; } .board .p:nth-child(1) .rk { color:var(--gold2); } .board .p:nth-child(2) .rk { color:#d8dde6; } .board .p:nth-child(3) .rk { color:#d49a6a; }
.board .p .av { width:30px; height:30px; border-radius:50%; display:flex; align-items:center; justify-content:center; font-weight:800; font-size:13px; color:#fff; flex:none; } .board .p .who { flex:1; font-size:14px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; } .board .p .sc { font-family:'Barlow Condensed',sans-serif; font-size:17px; color:#7fe0bd; font-weight:800; }
.myrank { display:flex; align-items:center; gap:10px; padding:8px 10px; border-radius:10px; background:rgba(226,177,60,.08); border:1px dashed rgba(226,177,60,.4); font-size:13px; } .myrank b { color:var(--gold); }
.note { color:var(--muted); font-size:12px; margin:8px 0 0; }
.peek { display:none; position:absolute; right:-6px; top:70px; width:150px; height:120px; pointer-events:none; }
.peek .bcard { position:absolute; width:60px; height:84px; font-size:30px; box-shadow:0 8px 18px #0008; } .peek .bcard small { font-size:26px; }
/* 链上场: the same cards, gold where the points tables are mint */
.pill.pts.gold { background:rgba(226,177,60,.1); border-color:rgba(226,177,60,.45); color:var(--gold2); }
.coin.gold { background:radial-gradient(circle at 35% 30%,#f5d77a,#9a6d14); border-color:#fff3c8; }
.side2 > .card { margin-bottom:0; }
.card.walletc { border-color:rgba(226,177,60,.35); background:linear-gradient(160deg,#2b2413,#141a22 70%); display:flex; flex-direction:column; gap:12px; }
.walletc .top { display:flex; align-items:center; gap:12px; } .walletc .top .coin { width:46px; height:46px; border-width:3px; box-shadow:0 4px 12px #0006; }
.walletc .bal { font-size:38px; line-height:1; color:#fff6dc; } .walletc .lbl { font-size:12px; color:#c9b88a; }
.mytables { display:flex; flex-direction:column; gap:6px; } .mytables:empty { display:none; }
.mytables a { display:flex; align-items:center; gap:8px; padding:8px 10px; border-radius:10px; background:#00000040; text-decoration:none; color:var(--text); font-size:13px; } .mytables a:hover { outline:1px solid var(--gold); } .mytables a b { font-family:'Barlow Condensed',sans-serif; font-size:15px; } .mytables a .st { margin-left:auto; color:var(--muted); font-size:12px; }
.tierrow { display:flex; align-items:center; gap:10px; padding:8px 0; border-bottom:1px dashed #ffffff12; } .tierrow:last-child { border-bottom:0; }
.tierrow .tn { flex:1; min-width:0; } .tierrow .tn b { font-size:15px; } .tierrow .tn .numf { color:var(--gold); font-size:16px; margin-left:8px; } .tierrow .tn .muted { font-size:12px; }
.card.board details { margin-top:4px; } .card.board .form input[type=number] { width:64px; }
.mini .mseat.idn { background:var(--bg); overflow:hidden; padding:0; } .mini .mseat.idn svg { width:100%; height:100%; display:block; image-rendering:pixelated; }
@media (max-width:1100px) { .prooms { grid-template-columns:repeat(2,minmax(0,1fr)); } .art { display:none; } .side2 { width:280px; } .rhead .lvchips { flex-basis:100%; } }
@media (max-width:900px) { .topbar { flex-wrap:wrap; row-gap:8px; } .modes { order:10; width:100%; } .modes .mode { flex:1; } } /* the tab switch takes its own row once the bar is crowded */
@media (max-width:760px) {
  .ptsgrid { flex-direction:column; align-items:stretch; } .side2 { display:contents; } .side2 > :first-child { order:-1; } .prooms { grid-template-columns:minmax(0,1fr); } /* phones: the balance card above the tables, the rest below them */
  .phero { min-height:250px; border-radius:18px; } .phero .copy { padding:20px; width:100%; } .phero h1 { font-size:38px; } .phero p { font-size:13px; max-width:220px; } .rhead h2 { font-size:24px; }
  .peek { display:block; }
  .proom { flex-direction:row; padding:10px; gap:12px; } .mini { width:140px; height:120px; flex:none; } .mini .rim { left:16px; right:16px; top:22px; bottom:22px; } .mini .felt { left:20px; right:20px; top:26px; bottom:26px; } .mini .potl, .mini .mstage, .mini .hot { display:none; } .mini .brd { top:48px; gap:2px; } .mcard { width:14px; height:20px; font-size:7px; border-radius:3px; } .mcard small { display:none; } .mini .mseat { width:22px; height:22px; font-size:10px; }
  .mstate { display:block; }
  .proom .info { flex:1; gap:4px; } .proom .nm .title { font-size:19px; } .proom .meta { flex-wrap:wrap; gap:6px 10px; } .proom .foot { margin-top:auto; }
  .ticker { font-size:12px; }
}
.card.lottocard { display:block; text-decoration:none; color:var(--text); border-color:#f07c9c59; background:linear-gradient(135deg,#2a1620,#141a22 70%); } .card.lottocard:hover { border-color:#ffa8bf; } /* 喵喵彩票 */
.lottocard .lt { display:flex; align-items:center; gap:8px; font-size:17px; } .lottocard .tk { font-size:20px; } .lottocard .go { color:#ffc2d1; font-size:13px; font-weight:700; } .lottocard .ld { margin-top:6px; color:var(--muted); font-size:13px; line-height:1.5; }