/* Family Bingo - enhancements styling (matches app theme variables). */

/* server-waking banner */
.fb-wake{position:fixed;top:0;left:0;right:0;z-index:9998;background:linear-gradient(135deg,var(--acc,#8b7cff),var(--acc-2,#6d5cff));color:#fff;text-align:center;padding:9px 14px;font-size:13px;font-weight:600;transform:translateY(-100%);transition:transform .3s ease;box-shadow:0 6px 20px rgba(0,0,0,.3)}
.fb-wake.show{transform:translateY(0)}

/* live reactions */
.fb-react-bar{display:flex;gap:6px;justify-content:center;flex-wrap:wrap;margin:14px 0;padding:10px;background:var(--card2,rgba(38,42,78,.7));border:1px solid var(--line,rgba(255,255,255,.09));border-radius:16px}
.fb-react-btn{background:transparent;border:1px solid var(--line,rgba(255,255,255,.12));border-radius:12px;padding:8px 10px;font-size:20px;cursor:pointer;line-height:1;transition:transform .1s ease,background .2s ease}
.fb-react-btn:active{transform:scale(1.25)}
#fb-react-layer{position:fixed;inset:0;pointer-events:none;z-index:70;overflow:hidden}
.fb-float{position:absolute;bottom:80px;text-align:center;animation:fbrise 2.6s ease-out forwards}
.fb-float-e{font-size:34px;filter:drop-shadow(0 3px 8px rgba(0,0,0,.4))}
.fb-float-n{font-size:11px;color:var(--ink,#fff);opacity:.85;background:rgba(0,0,0,.4);border-radius:999px;padding:1px 7px;margin-top:2px;display:inline-block}
@keyframes fbrise{0%{transform:translateY(0) scale(.6);opacity:0}15%{transform:translateY(-20px) scale(1.1);opacity:1}100%{transform:translateY(-60vh) scale(1);opacity:0}}

/* caller banner */
.fb-call-banner{display:none;align-items:center;gap:10px;background:linear-gradient(135deg,var(--acc,#8b7cff),var(--acc-2,#6d5cff));color:#fff;border-radius:14px;padding:12px 14px;margin:0 0 14px;box-shadow:0 8px 24px -10px rgba(0,0,0,.5);animation:fbpop .3s ease}
.fb-call-banner.show{display:flex}
.fb-call-label{font-size:12px;opacity:.85;font-weight:700;text-transform:uppercase;letter-spacing:.5px}
.fb-call-text{font-size:17px;font-weight:800;flex:1}
.fb-call-count{font-size:12px;background:rgba(0,0,0,.25);border-radius:999px;padding:3px 9px;font-weight:700}
@keyframes fbpop{from{transform:scale(.92);opacity:0}to{transform:scale(1);opacity:1}}

/* win-pattern chips (host panel) */
.fb-goal-chips{display:flex;flex-wrap:wrap;gap:7px;margin-top:6px}
.fb-goal-chip{background:var(--card2,rgba(38,42,78,.7));border:1px solid var(--line,rgba(255,255,255,.12));color:var(--mut,#a6a8c6);border-radius:999px;padding:7px 12px;font-size:13px;cursor:pointer}
.fb-goal-chip.active{background:linear-gradient(135deg,var(--acc,#8b7cff),var(--acc-2,#6d5cff));color:#fff;border-color:transparent;font-weight:650}

/* podium recap */
.fb-podium{position:fixed;inset:0;z-index:75;display:none;align-items:center;justify-content:center;background:rgba(6,7,18,.7);padding:20px;backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px)}
.fb-podium.show{display:flex;animation:fbfade .25s ease}
@keyframes fbfade{from{opacity:0}to{opacity:1}}
.fb-podium-box{background:var(--card,#1c1f3c);border:1px solid var(--acc,#8b7cff);border-radius:22px;padding:22px;max-width:380px;width:100%;box-shadow:0 30px 80px #000c}
.fb-podium-title{font-size:20px;font-weight:800;text-align:center;margin-bottom:14px}
.fb-podium-row{display:flex;align-items:center;gap:10px;padding:9px 0;border-bottom:1px solid var(--line,rgba(255,255,255,.09))}
.fb-podium-row:last-of-type{border-bottom:0}
.fb-podium-rank{font-size:20px;width:32px;text-align:center}
.fb-podium-name{flex:1;font-weight:650;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.fb-podium-score{color:var(--mut,#a6a8c6);font-size:13px}
.fb-podium-close{width:100%;margin-top:16px;background:linear-gradient(135deg,var(--acc,#8b7cff),var(--acc-2,#6d5cff));color:#fff;border:0;border-radius:12px;padding:12px;font-weight:650;cursor:pointer}