/* Fruit Wagers right rail: the wager menu replaces the Community panel on this page.
   Wide screens only; below 1400px the tab bar at the top of the page does the same job. */
.wager-rail { display: none; }
@media (min-width: 1400px) {
  .wager-rail { display: flex; flex-direction: column; gap: 14px; min-width: 0; align-self: start; position: sticky; top: 16px; }
  body.page-wagers #fruit-wagers .bp-tabs { display: none; }
}
.wager-rail .bp-ico { width: 20px; height: 20px; flex: none; }
.wager-rail .box { padding: 16px; }
.wager-rail h2 { margin: 0 0 12px; text-align: center; font: 400 1.6rem/1 var(--display); color: #fff; text-shadow: 0 3px 0 #2a0640, 0 0 18px rgba(255, 203, 92, .5); text-transform: uppercase; }
.wager-rail .sc-h { display: flex; align-items: center; gap: 8px; margin: 0 0 8px; font-size: .86rem; letter-spacing: .1em; color: #ffd982; text-transform: uppercase; }
.wr-me { display: flex; align-items: center; gap: 10px; }
.wr-me .bp-avatar { display: grid; place-items: center; width: 40px; height: 40px; border-radius: 50%; font-weight: 900; color: #2a1200; background: linear-gradient(180deg, #ffe39a, #ffb43a); }
.wr-who { display: flex; flex-direction: column; min-width: 0; flex: 1; } .wr-who b { font-size: 1rem; color: #fff; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .wr-who small { font-size: .82rem; color: #cdbde6; }
.wr-streak { display: inline-flex; align-items: center; gap: 4px; padding: 4px 9px; border-radius: 99px; font-weight: 900; font-size: .84rem; color: #2a1200; background: #ffb43a; }
.wr-streak .bp-ico { width: 14px; height: 14px; }
.wr-limit { display: flex; align-items: center; justify-content: space-between; margin-top: 12px; padding: 9px 12px; border-radius: 10px; font-size: .86rem; color: #cdbde6; background: rgba(255, 203, 92, .09); box-shadow: inset 0 0 0 1px rgba(255, 203, 92, .35); }
.wr-limit b { font: 400 1.25rem/1 var(--display); color: #ffcb5c; }
.wr-note { margin: 0 0 10px; font-size: .86rem; color: #cdbde6; text-align: center; }
.wr-nav { display: flex; flex-direction: column; gap: 6px; }
.wr-item { position: relative; display: flex; align-items: center; gap: 12px; width: 100%; padding: 12px 14px; border-radius: 12px; font-size: .92rem; font-weight: 900; letter-spacing: .04em; text-align: left; cursor: pointer;
  color: #e8dcf7; background: rgba(255, 255, 255, .05); box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .1); transition: background .15s, box-shadow .15s, color .15s; }
.wr-item span { flex: 1; }
.wr-item:hover { color: #fff; background: rgba(255, 203, 92, .14); box-shadow: inset 0 0 0 1px rgba(255, 203, 92, .6); }
.wr-item[aria-current="page"] { color: #2a1200; background: linear-gradient(180deg, #ffe39a, #ffb43a); box-shadow: 0 0 22px -6px rgba(255, 203, 92, .9), inset 0 1px 0 #fff8; }
.wr-item.primary:not([aria-current="page"]) { color: #fff; background: linear-gradient(180deg, #8d3cf0, #5a1fb0); box-shadow: inset 0 0 0 1px rgba(255, 203, 92, .6), 0 0 18px -6px #b04dff; }
.wr-item .bp-count { min-width: 22px; padding: 2px 7px; border-radius: 99px; font-style: normal; font-size: .8rem; text-align: center; color: #fff; background: #ff4d4d; animation: bpw-beat 1.3s ease-in-out infinite; }
.wr-stats ul { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin: 0; padding: 0; list-style: none; }
.wr-stats li { display: flex; flex-direction: column; gap: 2px; padding: 8px 10px; border-radius: 10px; font-size: .8rem; color: #b9a6d0; background: rgba(255, 255, 255, .05); }
.wr-stats li b { font-size: 1.15rem; color: #fff; }
.wr-safe p { margin: 0; font-size: .86rem; line-height: 1.45; color: #cdbde6; }
.wr-safe .bp-ico, .wr-stats .bp-ico { width: 16px; height: 16px; color: #ffcb5c; }
@media (prefers-reduced-motion: reduce) { .wr-item .bp-count { animation: none; } }

.wr-cur { display: flex; flex-direction: column; gap: 2px; padding: 10px 12px; border-radius: 12px; background: rgba(255, 203, 92, .09); box-shadow: inset 0 0 0 1px rgba(255, 203, 92, .4); }
.wr-cur small, .wr-next small { font-size: .78rem; color: #b9a6d0; letter-spacing: .06em; text-transform: uppercase; }

.wr-cur em { font-style: normal; font-size: .82rem; color: #ff9a9a; }
.wr-next { display: flex; align-items: baseline; justify-content: space-between; margin: 14px 0 8px; }
.wr-req { display: grid; grid-template-columns: 1fr auto; gap: 4px 8px; margin-bottom: 10px; font-size: .86rem; color: #e0d3f2; }
.wr-req span { display: inline-flex; align-items: center; gap: 6px; font-weight: 800; } .wr-req span .bp-ico { width: 15px; height: 15px; color: #ffcb5c; }
.wr-req b { color: #fff; } .wr-req b em { font-style: normal; color: #a794c2; font-weight: 700; }
.wr-req.ok span .bp-ico { color: #3ddc84; }
.wr-bar { grid-column: 1 / -1; display: block; height: 8px; border-radius: 99px; overflow: hidden; background: rgba(255, 255, 255, .12); }
.wr-bar u { display: block; height: 100%; border-radius: 99px; text-decoration: none; background: linear-gradient(90deg, #b04dff, #ffcb5c); transition: width .4s; }
.wr-req.ok .wr-bar u { background: linear-gradient(90deg, #2bbf6f, #7dffb0); }
.wr-hint { margin: 0 0 10px; font-size: .84rem; line-height: 1.4; color: #cdbde6; }
.wr-lim .bp-button { width: 100%; justify-content: center; }

/* the header limit chip, reused in the rail so the numbers match */
#wager-rail{--bp-gold:#ffcb5c;--bp-sub:#cdbde6;--bp-font:var(--display)}
#wager-rail .bp-chip[data-t="0"],#wager-rail .bp-chipsvg[data-t="0"]{--k1:#3a3d4a;--k2:#e4e7f0;--k3:#f4f5fa;--k4:#1d2030;--k5:#9ba0b4;--k6:#fff}
#wager-rail .bp-chip[data-t="1"],#wager-rail .bp-chipsvg[data-t="1"]{--k1:#0a2350;--k2:#8cc6ff;--k3:#2f7de0;--k4:#fff;--k5:#1a4ea3;--k6:#0a2350}
#wager-rail .bp-chip[data-t="2"],#wager-rail .bp-chipsvg[data-t="2"]{--k1:#053a20;--k2:#7af0b4;--k3:#14b863;--k4:#fff;--k5:#0b7a43;--k6:#053a20}
#wager-rail .bp-chip[data-t="3"],#wager-rail .bp-chipsvg[data-t="3"]{--k1:#2e064a;--k2:#d59aff;--k3:#9224e0;--k4:#fff;--k5:#610f9b;--k6:#2e064a}
#wager-rail .bp-chip[data-t="4"],#wager-rail .bp-chipsvg[data-t="4"]{--k1:#5f3a00;--k2:#fff0b0;--k3:#f7bd2a;--k4:#2a1600;--k5:#c88512;--k6:#fff3c4}
#wager-rail .bp-chip[data-t="5"],#wager-rail .bp-chipsvg[data-t="5"]{--k1:#22094a;--k2:#d4b8ff;--k3:#8a4dff;--k4:#fff;--k5:#5a27b8;--k6:#22094a}
#wager-rail .bp-chipsvg .cs-d{fill:var(--k1)}
#wager-rail .bp-chipsvg .cs-i{fill:var(--k2);stroke:var(--k1);stroke-width:.8}
#wager-rail .bp-chipsvg .cs-ih{fill:#fff;opacity:.55}
#wager-rail .bp-chipsvg .cs-r{fill:var(--k5)}
#wager-rail .bp-chipsvg .cs-f{fill:var(--k3)}
#wager-rail .bp-chipsvg .cs-bevel{fill:none;stroke:var(--k1);stroke-opacity:.55;stroke-width:1.6}
#wager-rail .bp-chipsvg .cs-dash{fill:none;stroke:var(--k2);stroke-width:2;stroke-dasharray:4 3.2;opacity:.8}
#wager-rail .bp-chipsvg .cs-gloss{fill:#fff;opacity:.3}
#wager-rail .bp-chipsvg .cs-rim{fill:none;stroke:#fff;stroke-opacity:.7;stroke-width:2.6;stroke-linecap:round}
#wager-rail .bp-chipsvg .cs-spec{fill:#fff;opacity:.95}
#wager-rail .bp-chipsvg{display:block;filter:drop-shadow(0 4px 3px rgba(0,0,0,.5))}
#wager-rail .bp-balance{display:inline-flex;align-items:center;gap:6px;padding:4px 10px 4px 6px;border:1px solid rgba(255,205,74,.4);background:linear-gradient(90deg,rgba(255,205,74,.16),transparent);font-size:12px;color:var(--bp-sub)}
#wager-rail .bp-balance b{color:var(--bp-gold);font:400 15px/1 var(--bp-font)}
#wager-rail .bp-balance .bp-chipsvg{width:24px;height:24px;animation:bp-coinspin 4s linear infinite}
@keyframes bp-coinspin{to{transform:rotateY(360deg)}}
#wager-rail .bp-balance{border-radius:99px;font-size:.86rem;white-space:nowrap}
#wager-rail .bp-balance b{font-size:1.15rem}
#wager-rail .wr-cur .bp-balance,#wager-rail .wr-next .bp-balance{align-self:flex-start}
@media (prefers-reduced-motion:reduce){#wager-rail .bp-balance .bp-chipsvg{animation:none}}
[data-t="3"],#wager-rail .bp-chipsvg[data-t="3"]{--k1:#4a0a10;--k2:#ffa3aa;--k3:#e0303f;--k4:#fff;--k5:#9b1020;--k6:#4a0a10}
[data-t="6"],#wager-rail .bp-chipsvg[data-t="6"]{--k1:#4a0a3a;--k2:#ffb3ea;--k3:#e03fb5;--k4:#fff;--k5:#9b1078;--k6:#4a0a3a}