/* 星汉宾果: 底栏 4 张卡(赔付表在规则里); 开奖时右上角「我的卡」实时打勾 */
.bg-board{width:100%;max-width:calc(var(--u)*900)}
.bg-cards{display:grid;grid-template-columns:repeat(4,1fr);gap:calc(var(--u)*10)}
.bg-card{position:relative;padding:calc(var(--u)*6);border-radius:calc(var(--u)*8);border:1px solid rgba(217,179,108,.5);background:linear-gradient(180deg,#24180f,#0f0a07);cursor:pointer;transition:box-shadow .15s}
.bg-card:hover{box-shadow:0 0 calc(var(--u)*12) rgba(246,220,154,.4)}
.bg-card.is-on{border-color:#ffe39a;box-shadow:0 0 0 calc(var(--u)*2) rgba(255,227,154,.6)}
.bg-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:calc(var(--u)*2)}
.bg-grid b{font:800 calc(var(--u)*13)/1.4 Georgia,serif;text-align:center;color:#2a1806;border-radius:calc(var(--u)*3)}
.bg-grid b:nth-child(1){background:#d42c45;color:#fff}.bg-grid b:nth-child(2){background:#e8a21a}.bg-grid b:nth-child(3){background:#18a878;color:#fff}.bg-grid b:nth-child(4){background:#2f6fe8;color:#fff}.bg-grid b:nth-child(5){background:#8b3fd8;color:#fff}
.bg-grid span{display:grid;place-items:center;height:calc(var(--u)*21);border-radius:calc(var(--u)*3);background:#f3ecdc;color:#1a120a;font:700 calc(var(--u)*11)/1 Georgia,serif}
.bg-grid span.is-free{background:#d9b36c;font-size:calc(var(--u)*9)}
.bg-grid span.is-hit{background:radial-gradient(circle,#ff5d73 0 55%,#f3ecdc 57%);color:#fff}
.bg-grid span.is-line{background:radial-gradient(circle,#ffd98a 0 60%,#d9a440 62%);color:#2a1806}
.bg-card__foot{display:flex;justify-content:space-between;align-items:center;margin-top:calc(var(--u)*5);font-size:calc(var(--u)*11);color:var(--tk-mute)}
.bg-card__foot button{padding:calc(var(--u)*2) calc(var(--u)*7);border:1px solid rgba(217,179,108,.5);border-radius:calc(var(--u)*4);background:none;color:#f6dc9a;font-size:calc(var(--u)*11);cursor:pointer}
.bg-card__foot button:disabled{opacity:.35;cursor:default}
.bg-card i[data-on]{position:absolute;right:calc(var(--u)*-6);top:calc(var(--u)*-8);padding:calc(var(--u)*2) calc(var(--u)*6);border-radius:calc(var(--u)*9);font:700 calc(var(--u)*11)/1.2 Georgia,serif;font-style:normal;color:#2a1a06;background:linear-gradient(180deg,#fff0c0,#e2b860)}
.bg-card i[data-on]:empty{display:none}
.bg-live{right:calc(var(--u)*16);top:calc(var(--u)*62);width:calc(var(--u)*360)}
.bg-live__cards{display:grid;grid-template-columns:1fr 1fr;gap:calc(var(--u)*8);padding:calc(var(--u)*10)}
.bg-live .bg-card{cursor:default}
.tk-bingo .tk-hist{left:calc(var(--u)*16);right:auto}
.bg-call{position:absolute;left:50%;top:44%;z-index:4;display:grid;place-items:center;width:calc(var(--u)*130);height:calc(var(--u)*130);border-radius:50%;transform:translate(-50%,-50%);
  background:radial-gradient(circle at 35% 30%,#fff,var(--c,#ffe08a) 45%,#3a2a10);color:#fff;font:800 calc(var(--u)*30)/1.1 Georgia,serif;text-align:center;text-shadow:0 2px 4px rgba(0,0,0,.6);box-shadow:0 0 calc(var(--u)*40) rgba(255,210,110,.7);animation:bg-pop .6s ease-out}
.bg-call b{display:block;font-size:calc(var(--u)*56)}
@keyframes bg-pop{from{transform:translate(-50%,-50%) scale(.3);opacity:0}to{transform:translate(-50%,-50%) scale(1);opacity:1}}
.bg-h{display:flex;flex-direction:column;gap:calc(var(--u)*6)}
.bg-h p{display:flex;flex-wrap:wrap;gap:calc(var(--u)*2);margin:0;padding-bottom:calc(var(--u)*5);border-bottom:1px solid rgba(217,179,108,.15)}
.bg-h i{display:inline-grid;place-items:center;width:calc(var(--u)*19);height:calc(var(--u)*19);border-radius:50%;font:700 calc(var(--u)*9)/1 Georgia,serif;font-style:normal;color:#fff}
/* ---------- 无边框(和龙虎一样, 公共 .tk-flat; 按钮清晰样式也在公共): 暖色深底, 卡片去边框, 押了注的卡 = 金色底 + 柔光 ---------- */
.tk-bingo .tk-bar{background:linear-gradient(180deg,rgba(28,20,16,.55),rgba(30,22,18,.9) 18%,rgba(24,17,14,.96))}
.tk-flat .bg-card{border:0;background:linear-gradient(180deg,rgba(255,240,210,.14),rgba(255,240,210,.06));transition:background .2s,box-shadow .2s}
.tk-flat .bg-card:hover{box-shadow:none;background:linear-gradient(180deg,rgba(255,226,160,.26),rgba(255,226,160,.1))}
.tk-flat .bg-card.is-on{background:linear-gradient(180deg,rgba(226,184,96,.45),rgba(226,184,96,.18));box-shadow:0 0 calc(var(--u)*14) rgba(255,214,120,.35)}
.tk-flat .bg-card__foot button{border:0;color:#fff6e2;background:linear-gradient(180deg,rgba(255,240,210,.22),rgba(255,240,210,.1));box-shadow:inset 0 1px 0 rgba(255,255,255,.16)}
.tk-flat .bg-card__foot button:not(:disabled):hover{background:linear-gradient(180deg,rgba(255,226,160,.42),rgba(255,226,160,.2))}
.tk-flat .bg-card__foot button:disabled{opacity:1;color:rgba(255,246,226,.3);background:rgba(255,255,255,.04);box-shadow:none;cursor:not-allowed}
/* 开奖记录的结果栏: B I N G O 五个球(点开看全部号码) */
.bg-res{display:inline-flex;align-items:center;gap:calc(var(--u)*3);padding:calc(var(--u)*2) calc(var(--u)*8) calc(var(--u)*2) calc(var(--u)*3);border:0;border-radius:999px;background:rgba(255,240,210,.1);color:var(--tk-mute);cursor:pointer}
.bg-res:hover{background:rgba(255,226,160,.25);color:#fff}
.bg-res i{display:inline-grid;place-items:center;width:calc(var(--u)*20);height:calc(var(--u)*20);border-radius:50%;font:800 calc(var(--u)*10)/1 Georgia,serif;font-style:normal;color:#fff}
.bg-res small{margin-left:calc(var(--u)*4);font-size:calc(var(--u)*11)}
.bg-detail{position:absolute;inset:0;z-index:80;display:grid;place-items:center;background:rgba(0,0,0,.45)}
.bg-detail[hidden]{display:none}
.bg-detail__box{width:min(92%,calc(var(--u)*560));padding:calc(var(--u)*14) calc(var(--u)*18);border-radius:calc(var(--u)*12);background:rgba(22,15,12,.97);box-shadow:0 calc(var(--u)*10) calc(var(--u)*40) rgba(0,0,0,.6)}
.bg-detail header{display:flex;justify-content:space-between;align-items:center;margin-bottom:calc(var(--u)*10);font-family:var(--tk-serif);color:#f6dc9a}
.bg-detail header button{width:calc(var(--u)*28);height:calc(var(--u)*28);border:0;border-radius:50%;background:rgba(255,255,255,.1);color:#fff;font-size:calc(var(--u)*18);cursor:pointer}
.bg-detail p{display:flex;flex-wrap:wrap;align-items:center;gap:calc(var(--u)*4);margin:0 0 calc(var(--u)*8)}
.bg-detail p b{display:inline-grid;place-items:center;width:calc(var(--u)*30);height:calc(var(--u)*30);margin-right:calc(var(--u)*6);border-radius:calc(var(--u)*6);font:800 calc(var(--u)*16)/1 Georgia,serif;color:#fff}
.bg-detail p i{display:inline-grid;place-items:center;width:calc(var(--u)*28);height:calc(var(--u)*28);border-radius:50%;font:700 calc(var(--u)*12)/1 Georgia,serif;font-style:normal;color:#fff;box-shadow:inset 0 calc(var(--u)*-2) calc(var(--u)*3) rgba(0,0,0,.3)}
