/* Challenge page: arena, steps, deal check. Readable sizes only (nothing under .74rem). No hover tilt or scale. */
#fruit-wagers .bpo-steps { display: flex; gap: 8px; margin: 0 0 14px; padding: 0; list-style: none; }
#fruit-wagers .bpo-steps li { flex: 1; display: flex; align-items: center; gap: 9px; padding: 9px 12px; border-radius: 12px; font: 800 .82rem/1.2 var(--label); letter-spacing: .04em; color: #cdbde6; background: rgba(255, 255, 255, .04); box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .1); }
#fruit-wagers .bpo-steps i { display: grid; place-items: center; flex: none; width: 24px; height: 24px; border-radius: 50%; font: 900 .8rem/1 var(--label); font-style: normal; color: #cdbde6; box-shadow: inset 0 0 0 2px rgba(255, 255, 255, .25); }
#fruit-wagers .bpo-steps li.done { color: #fff; box-shadow: inset 0 0 0 1px #3ddc84; }
#fruit-wagers .bpo-steps li.done i { color: #04210f; background: #3ddc84; box-shadow: none; }
#fruit-wagers .bpo-steps i .bp-ico { width: 14px; height: 14px; }

#fruit-wagers .bpo-arena { position: relative; display: grid; grid-template-columns: minmax(0, 1fr) minmax(190px, 240px) minmax(0, 1fr); gap: 14px; align-items: stretch; padding: 22px 18px 14px; margin-bottom: 16px; border-radius: 18px; overflow: hidden;
  background: radial-gradient(ellipse at 50% 0%, rgba(176, 77, 255, .28), transparent 62%), linear-gradient(180deg, #1a0d2b, #0d0716); box-shadow: inset 0 0 0 1px rgba(255, 203, 92, .4), 0 18px 40px -20px #000; }
#fruit-wagers .bpo-arena > .bpx-flags { position: absolute; top: 8px; left: 50%; display: flex; gap: 6px; z-index: 2; translate: -50% 0; }
#fruit-wagers .bpo-side { display: flex; flex-direction: column; align-items: center; gap: 10px; padding: 12px; border-radius: 14px; background: rgba(8, 3, 16, .55); box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .1); }
#fruit-wagers .bpo-side.you { box-shadow: inset 0 0 0 1px rgba(61, 220, 132, .55); }
#fruit-wagers .bpo-side.them { box-shadow: inset 0 0 0 1px rgba(255, 203, 92, .6); }
#fruit-wagers .bpo-who { display: flex; align-items: center; gap: 10px; align-self: flex-start; }
#fruit-wagers .bpo-who strong { display: block; font-size: 1rem; color: #fff; }
#fruit-wagers .bpo-who em { font-style: normal; color: #7dffb0; font-size: .82rem; }
#fruit-wagers .bpo-slot { display: flex; align-items: center; justify-content: center; flex-wrap: wrap; gap: 4px; width: 100%; min-height: 120px; border-radius: 12px; }
#fruit-wagers .bpo-slot.empty { border: 2px dashed rgba(255, 255, 255, .28); color: #cdbde6; font-weight: 800; font-size: .9rem; text-align: center; padding: 10px; animation: bpo-pulse 2s ease-in-out infinite; }
@keyframes bpo-pulse { 50% { border-color: #ffcb5c; color: #ffe39a; } }
#fruit-wagers .bpo-slot .bp-glyph { width: 92px; height: 92px; border: 0; background-color: transparent; font-size: 0; filter: drop-shadow(0 10px 10px rgba(0, 0, 0, .65)) drop-shadow(0 0 14px rgba(176, 77, 255, .5)); animation: hsx-bob 4.4s ease-in-out infinite; }
#fruit-wagers .bpo-slot .bp-plus { color: #ffcb5c; font-weight: 900; }
#fruit-wagers .bpo-val { font: 400 1.7rem/1 var(--display); color: #ffcb5c; text-shadow: 0 2px 0 #3a1200, 0 0 16px rgba(255, 203, 92, .5); }
#fruit-wagers .bpo-mid { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 6px; }
#fruit-wagers .bpo-vs { font: 400 2.6rem/1 var(--display); color: #fff; text-shadow: 0 3px 0 #2a0640, 0 0 22px rgba(255, 47, 209, .7); }
#fruit-wagers .bpo-foe { grid-column: 1 / -1; display: flex; flex-wrap: wrap; align-items: center; gap: 10px 16px; font-size: .86rem; color: #e0d3f2; }
#fruit-wagers .bpo-note { font-style: italic; color: #ffd982; }
#fruit-wagers .bpo-arena > .bp-trust { grid-column: 1 / -1; }

#fruit-wagers .bpo-grid { display: grid; grid-template-columns: minmax(0, 1.5fr) minmax(300px, 1fr); gap: 16px; align-items: start; }
#fruit-wagers .bpo-deal { position: sticky; top: 12px; }
#fruit-wagers .bpo-n { display: inline-grid; place-items: center; width: 24px; height: 24px; margin-right: 8px; border-radius: 50%; font: 900 .85rem/1 var(--label); font-style: normal; color: #2a1200; background: #ffcb5c; }
#fruit-wagers .bpo-use { display: flex; align-items: center; gap: 8px; width: 100%; margin: 0 0 10px; padding: 10px 12px; border-radius: 12px; border: 1px dashed #ffcb5c; background: rgba(255, 203, 92, .09); color: #fff; font-weight: 700; font-size: .86rem; line-height: 1.3; font-family: inherit; text-align: left; cursor: pointer; }
#fruit-wagers .bpo-use:hover { background: rgba(255, 203, 92, .2); }
#fruit-wagers .bpo-use b { color: #ffcb5c; }
#fruit-wagers .bpo-use .bp-ico { width: 18px; height: 18px; flex: none; color: #ffcb5c; }

#fruit-wagers .bpo-verdict { display: flex; flex-direction: column; gap: 3px; margin: 8px 0 12px; padding: 10px 12px; border-radius: 12px; font-size: .88rem; color: #e0d3f2; background: rgba(255, 255, 255, .05); box-shadow: inset 4px 0 0 #8b7aa8; }
#fruit-wagers .bpo-verdict b { font-size: 1rem; color: #fff; }
#fruit-wagers .bpo-verdict[data-v="good"] { box-shadow: inset 4px 0 0 #3ddc84; }
#fruit-wagers .bpo-verdict[data-v="good"] b { color: #7dffb0; }
#fruit-wagers .bpo-verdict[data-v="warn"] { box-shadow: inset 4px 0 0 #ffcb5c; }
#fruit-wagers .bpo-verdict[data-v="warn"] b { color: #ffd982; }
#fruit-wagers .bpo-verdict[data-v="bad"] { box-shadow: inset 4px 0 0 #ff5a5a; }
#fruit-wagers .bpo-verdict[data-v="bad"] b { color: #ff9a9a; }

#fruit-wagers .bpo-outcomes { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin-bottom: 14px; }
#fruit-wagers .bpo-outcomes div { display: flex; flex-direction: column; gap: 2px; padding: 10px; border-radius: 12px; min-width: 0; }
#fruit-wagers .bpo-outcomes small { font: 800 .76rem/1.2 var(--label); letter-spacing: .08em; text-transform: uppercase; }
#fruit-wagers .bpo-outcomes b { font-size: .92rem; color: #fff; overflow-wrap: anywhere; }
#fruit-wagers .bpo-outcomes em { font-style: normal; font-weight: 900; }
#fruit-wagers .bpo-outcomes .win { background: rgba(61, 220, 132, .12); box-shadow: inset 0 0 0 1px rgba(61, 220, 132, .5); }
#fruit-wagers .bpo-outcomes .win small, #fruit-wagers .bpo-outcomes .win em { color: #7dffb0; }
#fruit-wagers .bpo-outcomes .lose { background: rgba(255, 90, 90, .1); box-shadow: inset 0 0 0 1px rgba(255, 90, 90, .45); }
#fruit-wagers .bpo-outcomes .lose small, #fruit-wagers .bpo-outcomes .lose em { color: #ff9a9a; }

#fruit-wagers .bpo-confirm { display: flex; align-items: center; gap: 12px; padding: 12px; border-radius: 12px; cursor: pointer; background: rgba(255, 255, 255, .05); box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .18); transition: box-shadow .15s, background .15s; }
#fruit-wagers .bpo-confirm:hover { background: rgba(255, 203, 92, .1); }
#fruit-wagers .bpo-confirm.on { background: rgba(61, 220, 132, .12); box-shadow: inset 0 0 0 2px #3ddc84; }
#fruit-wagers .bpo-confirm input { width: 22px; height: 22px; flex: none; accent-color: #3ddc84; }
#fruit-wagers .bpo-confirm span { display: flex; flex-direction: column; gap: 2px; }
#fruit-wagers .bpo-confirm b { font-size: .95rem; color: #fff; }
#fruit-wagers .bpo-confirm small { font-size: .84rem; color: #cdbde6; }

#fruit-wagers .bpo-next { margin: 14px 0 0; padding: 0; list-style: none; counter-reset: bpo; display: flex; flex-direction: column; gap: 8px; }
#fruit-wagers .bpo-next li { counter-increment: bpo; display: grid; grid-template-columns: 24px 1fr; column-gap: 10px; font-size: .86rem; color: #e0d3f2; }
#fruit-wagers .bpo-next li::before { content: counter(bpo); grid-row: span 2; display: grid; place-items: center; width: 24px; height: 24px; border-radius: 50%; font: 900 .8rem/1 var(--label); color: #cdbde6; box-shadow: inset 0 0 0 2px rgba(255, 255, 255, .25); }
#fruit-wagers .bpo-next b { color: #fff; }
#fruit-wagers .bpo-next small { font-size: .82rem; color: #b9a6d0; }

@media (max-width: 900px) {
  #fruit-wagers .bpo-arena, #fruit-wagers .bpo-grid { grid-template-columns: 1fr; }
  #fruit-wagers .bpo-deal { position: static; }
  #fruit-wagers .bpo-steps li span { display: none; }
  #fruit-wagers .bpo-steps li { justify-content: center; }
}
@media (prefers-reduced-motion: reduce) { #fruit-wagers .bpo-slot, #fruit-wagers .bpo-slot .bp-glyph { animation: none; } }

/* ---- anti-scam UI: risk, deadline, proof, timeline, strikes, lookup ---- */
#fruit-wagers .bpx-risk { display: flex; flex-direction: column; gap: 3px; margin: 10px 0; padding: 10px 12px; border-radius: 12px; font-size: .86rem; color: #e0d3f2; background: rgba(255, 255, 255, .05); box-shadow: inset 4px 0 0 #3ddc84; }
#fruit-wagers .bpx-risk b { font-size: .95rem; color: #7dffb0; }
#fruit-wagers .bpx-risk.medium { box-shadow: inset 4px 0 0 #ffcb5c; } #fruit-wagers .bpx-risk.medium b { color: #ffd982; }
#fruit-wagers .bpx-risk.high { box-shadow: inset 4px 0 0 #ff5a5a; background: rgba(255, 90, 90, .1); } #fruit-wagers .bpx-risk.high b { color: #ff9a9a; }
#fruit-wagers .bpx-due { display: flex; align-items: center; gap: 6px; margin: 8px 0; font-weight: 800; font-size: .88rem; color: #ffd982; }
#fruit-wagers .bpx-due .bp-ico, #fruit-wagers .bpx-safe .bp-ico { width: 16px; height: 16px; flex: none; }
#fruit-wagers .bpx-safe { display: flex; align-items: flex-start; gap: 8px; margin: 10px 0; padding: 9px 11px; border-radius: 10px; font-size: .82rem; line-height: 1.4; color: #cdbde6; background: rgba(61, 220, 132, .08); box-shadow: inset 0 0 0 1px rgba(61, 220, 132, .3); }
#fruit-wagers .bpx-safe .bp-ico { color: #3ddc84; }
#fruit-wagers .bpx-proofs { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin: 10px 0; font-size: .86rem; }
#fruit-wagers .bpx-proofs img { width: 64px; height: 64px; object-fit: cover; border-radius: 8px; box-shadow: 0 0 0 1px rgba(255, 203, 92, .5); }
#fruit-wagers .bpx-up { position: relative; overflow: hidden; cursor: pointer; }
#fruit-wagers .bpx-up input { position: absolute; inset: 0; opacity: 0; cursor: pointer; }
#fruit-wagers .bpx-tl { margin: 8px 0; font-size: .84rem; color: #cdbde6; } #fruit-wagers .bpx-tl summary { cursor: pointer; font-weight: 800; color: #ffd982; }
#fruit-wagers .bpx-tl ol { margin: 8px 0 0; padding-left: 18px; display: flex; flex-direction: column; gap: 5px; } #fruit-wagers .bpx-tl time { color: #a794c2; font-size: .78rem; } #fruit-wagers .bpx-tl small { color: #a794c2; }
#fruit-wagers .bpx-strike { color: #ff9a9a !important; font-weight: 800; } #fruit-wagers .bpx-clean { color: #7dffb0 !important; }
#fruit-wagers .bpx-strike .bp-ico { width: 13px; height: 13px; vertical-align: -2px; }
#fruit-wagers .bpx-lres { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 10px; } #fruit-wagers .bpx-lres small { opacity: .8; margin-left: 6px; }
#fruit-wagers .bpx-prof { margin-top: 14px; }
#fruit-wagers .bpx-pstats { display: grid; grid-template-columns: repeat(auto-fit, minmax(110px, 1fr)); gap: 8px; margin: 12px 0; }
#fruit-wagers .bpx-pstats span { display: flex; flex-direction: column; gap: 2px; padding: 9px 10px; border-radius: 10px; font-size: .78rem; color: #b9a6d0; background: rgba(255, 255, 255, .05); }
#fruit-wagers .bpx-pstats b { font-size: 1.15rem; color: #fff; }
#fruit-wagers .bpx-lrow { margin: 6px 0; font-size: .86rem; } #fruit-wagers .bpx-lrow b { padding: 1px 7px; border-radius: 99px; font-size: .78rem; color: #04210f; background: #3ddc84; } #fruit-wagers .bpx-lrow b.l { color: #2a0606; background: #ff9a9a; }

/* Create a wager, step 2: "What should your opponent offer?" */
#fruit-wagers .bpx-ask { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; margin: 12px 0 14px; }
#fruit-wagers .bpx-askb { display: grid; grid-template-columns: auto 1fr; column-gap: 12px; align-items: center; padding: 14px 16px; text-align: left; border-radius: 14px; border: 2px solid rgba(255, 255, 255, .16); background: rgba(12, 6, 22, .8); color: #e8dcf7; cursor: pointer; }
#fruit-wagers .bpx-askb .bp-ico { grid-row: 1 / 3; width: 30px; height: 30px; color: #ffcb5c; }
#fruit-wagers .bpx-askb b { font: 900 1rem/1.2 var(--label); letter-spacing: .06em; text-transform: uppercase; color: #fff; }
#fruit-wagers .bpx-askb small { font-size: .84rem; line-height: 1.3; color: #cdbde6; }
#fruit-wagers .bpx-askb[aria-checked="true"] { border-color: #ffcb5c; background: linear-gradient(135deg, rgba(255, 203, 92, .22), rgba(176, 77, 255, .18)); box-shadow: 0 0 22px -6px #ffcb5c; }
#fruit-wagers .bpx-askhint { margin: 0 0 8px; padding: 12px 14px; border-radius: 12px; border: 1px dashed rgba(255, 203, 92, .55); color: #ffe39a; font-weight: 700; }
@media (max-width: 600px) { #fruit-wagers .bpx-ask { grid-template-columns: 1fr; } }