/* 大老二 (Big Two): cards, hand, middle of the table. The room shell reuses the Lami styles (rm.css). */
.btc { position: relative; flex: none; width: 46px; height: 64px; border-radius: 6px; background: #fffdf8 center / 100% 100% no-repeat; border: 1px solid rgba(60,30,20,.25);
  box-shadow: 0 2px 5px rgba(0,0,0,.35); color: #161214; display: flex; flex-direction: column; align-items: center; justify-content: center; line-height: 1; user-select: none; -webkit-user-select: none; transition: transform .14s var(--ease), box-shadow .14s; }
.btc.red { color: #c4122f; }
.btc b { font-size: 17px; font-weight: 900; font-family: Georgia, serif; } .btc i { font-style: normal; font-size: 16px; }
.btc.back { background: radial-gradient(circle at 50% 50%, rgba(243,196,107,.55) 0 12%, transparent 13%), repeating-linear-gradient(45deg, transparent 0 4px, rgba(243,196,107,.22) 4px 5px), repeating-linear-gradient(-45deg, transparent 0 4px, rgba(243,196,107,.22) 4px 5px), linear-gradient(160deg, #9c2a3f, #5a1220); border: 2px solid #fbf7f0; }
.btc.xs { width: 22px; height: 31px; border-radius: 3px; box-shadow: 0 1px 2px rgba(0,0,0,.3); } .btc.xs b { font-size: 9px; } .btc.xs i { font-size: 8px; }
.btc.tb { width: 44px; height: 62px; } .btc.tb.sm { width: 32px; height: 45px; }
.btc.sel { transform: translateY(-14px); box-shadow: 0 0 0 2px var(--gold), 0 10px 16px rgba(0,0,0,.45); }
.btc.dragging { opacity: .25; }
.btc.ghost { position: fixed; z-index: 300; pointer-events: none; transform: scale(1.15) rotate(-4deg); box-shadow: 0 14px 24px rgba(0,0,0,.45); transition: none; }

/* lobby + enter */
.btr-fan { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); display: flex; }
.btr-fan .btc { margin-left: -9px; }
.btr-fan .btc:nth-child(1), .t-big2 .btc:nth-child(1) { transform: rotate(-14deg) translateY(3px); } .btr-fan .btc:nth-child(2), .t-big2 .btc:nth-child(2) { transform: rotate(-5deg); }
.btr-fan .btc:nth-child(3), .t-big2 .btc:nth-child(3) { transform: rotate(5deg); } .btr-fan .btc:nth-child(4), .t-big2 .btc:nth-child(4) { transform: rotate(14deg) translateY(3px); }
.btr-fan .btc:first-child { margin-left: 0; }
.bt-enter .rm-enter-tiles .btc { width: 54px; height: 76px; animation: rmIn .7s var(--ease) both; }
.bt-enter .rm-enter-tiles .e1 { animation-delay: .08s; } .bt-enter .rm-enter-tiles .e2 { animation-delay: .16s; } .bt-enter .rm-enter-tiles .e3 { animation-delay: .24s; }

/* table */
.bt-table { background: radial-gradient(ellipse at 50% 45%, #a3304a 0%, #7b1e2e 45%, #4a0f1a 85%, #2a0710 100%); }
.bt-table .rm-felt { border-color: rgba(243,196,107,.35); }
.bt-center { justify-content: center; gap: 4px; }
.bt-plays { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 6px; width: 100%; flex: 1; min-height: 0; }
.bt-play { display: flex; flex-direction: column; align-items: center; gap: 3px; }
.bt-play .bt-cards { display: flex; }
.bt-play .bt-cards .btc + .btc { margin-left: -16px; }
.bt-play.old { opacity: .55; filter: saturate(.6); } .bt-play.old .bt-cards .btc + .btc { margin-left: -12px; }
.bt-play.cur .btc { box-shadow: 0 0 0 2px var(--gold), 0 4px 12px rgba(0,0,0,.45); }
.bt-play.cur.big .btc { box-shadow: 0 0 0 2px #ffd34d, 0 0 18px rgba(255,211,77,.9); }
.bt-who { font-size: 11px; color: #fff; background: rgba(0,0,0,.38); border-radius: 999px; padding: 1px 8px; white-space: nowrap; max-width: 100%; overflow: hidden; text-overflow: ellipsis; }
.bt-play.old .bt-who { font-size: 10px; }
.bt-who .jp { color: var(--gold); }
.bt-new { display: flex; flex-direction: column; align-items: center; gap: 4px; color: #fff; text-align: center; font-size: 12px; background: rgba(0,0,0,.25); border-radius: 14px; padding: 8px 14px; }
.bt-new b { font-size: 16px; color: var(--gold); letter-spacing: 2px; }
.bt-lead { display: inline-flex; align-items: center; gap: 6px; }
.bt-backs { width: 50px; } .bt-backs i { width: 11px; height: 16px; } .bt-backs b { right: -4px; }
.bt-backs.one b, .l3.ntag .cnt.one { background: #e23a4c; color: #fff; animation: rmPulse 1s ease-in-out infinite; }
.rtag.bt-one { animation: rmPulse 1s ease-in-out infinite; }
.rm-seat.passed .sav { opacity: .55; }
.rm-seat.done .sav { box-shadow: 0 0 0 2px var(--gold); border-radius: 50%; }
.bt-spy { max-width: 130px; } .bt-spy .btc.xs { width: 14px; height: 20px; margin-left: 0; } .bt-spy .btc.xs b { font-size: 7px; } .bt-spy .btc.xs i { display: none; }

/* my hand: one row, cards overlap more when there are many (--ov set by fitRack) */
.bt-me { padding-top: 4px; }
.bt-rack { display: flex; flex-wrap: nowrap; justify-content: center; padding: 18px 6px 6px; min-height: 90px; border-radius: 12px; background: linear-gradient(#3a1a12, #2a120c); box-shadow: inset 0 2px 6px rgba(0,0,0,.5); touch-action: none; overflow: visible; }
.bt-rack .btc { width: 50px; height: 70px; cursor: pointer; }
.bt-rack .btc + .btc { margin-left: var(--ov, -14px); }
.bt-rack.myturn { box-shadow: inset 0 2px 6px rgba(0,0,0,.5), 0 0 0 2px var(--gold); }
.bt-rack.dead .btc { filter: grayscale(1); opacity: .5; }
.bt-sel { margin-left: 6px; font-size: 12px; font-weight: 800; padding: 1px 8px; border-radius: 999px; background: rgba(255,255,255,.08); }
.bt-sel.ok { background: rgba(60,170,100,.2); color: #57d08a; } .bt-sel.bad { background: rgba(220,60,80,.16); color: #ff8b98; }
.bt-hintline { text-align: center; font-size: 11.5px; min-height: 15px; margin: 3px 0 1px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.bt-me .ctl-row { gap: 5px; }
.bt-me .ctl-row .btn.sm { padding-left: 10px; padding-right: 10px; }
@media (max-width: 400px) { .bt-rack .btc { width: 44px; height: 62px; } .bt-rack { min-height: 82px; padding-top: 16px; } .bt-me .rm-rackbar .btn.sm { padding: 0 8px; font-size: 12px; } }

/* pops */
.bt-pop.gold { background: linear-gradient(160deg, rgba(120,84,10,.96), rgba(60,38,4,.96)); border-color: rgba(255,214,102,.6); }
.bt-pop.gold .no-t { color: #ffd966; } .bt-pop.gold .no-av { filter: none; }
.bt-pop.warn { background: linear-gradient(160deg, rgba(150,24,40,.96), rgba(80,10,20,.96)); }
.bt-pop.warn .no-t { color: #fff; font-size: 22px; } .bt-pop.warn .no-av { filter: none; }
.rv-inst { text-align: center; color: var(--gold); font-weight: 900; font-size: 18px; margin: -4px 0 8px; }

/* result / rules */
.bt-mini .btc.xs { width: 18px; height: 25px; }
.bt-mini .btc.xs + .btc.xs { margin-left: -4px; }
.bt-ex { display: flex; align-items: center; gap: 2px; margin: 6px 0 2px; flex-wrap: wrap; } .bt-ex span { margin: 0 6px; font-size: 12px; color: var(--muted); }

/* 3D */
.l3.ptag .bt3-who { font-size: 10.5px; color: #fff; background: rgba(0,0,0,.55); border-radius: 999px; padding: 1px 8px; }
.l3.ptag.cur .bt3-who { background: rgba(243,196,107,.92); color: #3b2200; font-weight: 800; }
.l3.ntag .st.gold { background: var(--gold); color: #3b2200; }
.bt3d-new { position: absolute; left: 50%; top: 44%; transform: translate(-50%, -50%); z-index: 4; pointer-events: none; color: #fff; font-size: 12px; text-align: center; background: rgba(0,0,0,.45); border-radius: 12px; padding: 0; }
.bt3d-new:not(:empty) { padding: 6px 12px; }
.bt3d-new b { color: var(--gold); } .bt3d-new b.red { color: #ff7a8a; }

/* games list card */
.game.bt.live .g-art { background: radial-gradient(circle at 50% 45%, #a8344b, #5a1220 70%, #2a0710); display: flex; align-items: center; justify-content: center; }
.t-big2 { display: flex; }
.t-big2 .btc { width: 40px; height: 56px; margin-left: -14px; }
.t-big2 { animation: tbob 2.6s ease-in-out infinite; }
.t-big2 .btc:first-child { margin-left: 0; }

/* keep the top player clear of the chat feed and the timer clear of everyone */
.bt-table .rm-seat.top { top: 13%; }
.bt-center { top: 23%; }
.bt-center .rm-timer { top: -2px; left: auto; right: -6%; transform: none; }
.bf-full { grid-column: 1 / -1; }

/* 守门员 fault */
.bt-pop.long { max-width: 300px; }
.bt-fault { border-color: rgba(255,120,120,.5); }
.bt-fault .bf-ic { font-size: 34px; line-height: 1; margin-bottom: 4px; }
.bt-fault .ov-t { color: #ffb3bf; }
.bt-fault .bf-msg { font-size: 13.5px; line-height: 1.55; margin: 6px 0 10px; }
.bt-fault .bf-msg b { color: var(--gold); }

/* games list: every game box has its own colour (the tables inside stay red) */
.games .game.ccd .g-art { background: radial-gradient(circle at 50% 40%, #b8324b, #5c1220 75%); }
.games .game.bj .g-art { background: radial-gradient(circle at 50% 45%, #2c4a7a, #0c1628 75%); }
.games .game.rm .g-art { background: radial-gradient(circle at 50% 45%, #1d8086, #062a2d 75%); }
.games .game.bt .g-art { background: radial-gradient(circle at 50% 45%, #23845a, #07301f 75%); }
.games .game.poker .g-art { background: radial-gradient(circle at 50% 45%, #6a3496, #1d0b30 75%); }
.games .game.tcp .g-art { background: radial-gradient(circle at 50% 45%, #b5561c, #3d1404 75%); }
.games .game.ngao .g-art { background: radial-gradient(circle at 50% 45%, #9a7a18, #2a2004 75%); }

/* sort buttons + groups in the hand */
.bt-sortbar { gap: 4px; }
.bt-sortbar .btn.sm { padding: 0 8px; height: 26px; font-size: 12px; }
.bt-rack .btc.gs { margin-left: calc(var(--ov, -14px) + 10px); }
@media (max-width: 400px) { .bt-sortbar .btn.sm { padding: 0 6px; font-size: 11.5px; } }
