/* COINFLIP rebuild: .cfx-* classes only (legacy .cf-* rules in games.css never apply) */
.cfx-pick{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.cfx-pick button{position:relative;display:flex;align-items:center;gap:10px;height:62px;padding:0 12px;border-radius:var(--r-sm);border:1px solid var(--border);
  background:var(--inset);color:var(--muted);font-size:16px;font-weight:700;cursor:pointer;transition:border-color .15s,background .15s,color .15s}
.cfx-pick button img{width:40px;height:40px;flex:none;border-radius:50%;box-shadow:0 2px 6px #0008}
.cfx-pick button:hover:not(:disabled){color:var(--text);border-color:#35609c}
.cfx-pick button.on{border-color:var(--accent);background:#4285ff1f;color:#fff;box-shadow:inset 0 0 0 1px var(--accent)}
.cfx-pick .cfx-tick{position:absolute;top:6px;right:6px;width:18px;height:18px;border-radius:50%;background:var(--accent);display:none;place-items:center}
.cfx-pick .cfx-tick .ic{width:12px;height:12px;color:#fff;stroke-width:3}
.cfx-pick button.on .cfx-tick{display:grid}
.cfx-pick button:disabled{cursor:not-allowed}
.cfx-pick button:disabled:not(.on){opacity:.45}
.cfx-ctrl .stats b{font-variant-numeric:tabular-nums}

.cfx-stage{background:radial-gradient(ellipse 75% 65% at 50% 62%,#1b3a70 0,#11254d 48%,#091430 100%)}
.cfx-scene{position:absolute;inset:0;perspective:1100px;perspective-origin:50% 28%;pointer-events:none}
.cfx-world{position:absolute;left:50%;top:60%;width:0;height:0;transform-style:preserve-3d;transform:rotateX(42deg)}
.cfx-world:before{content:"";position:absolute;width:calc(var(--d) * 2.5);height:calc(var(--d) * 2.5);left:calc(var(--d) * -1.25);top:calc(var(--d) * -1.25);border-radius:50%;
  background:radial-gradient(circle,#4285ff14 0 40%,#4285ff0a 41% 60%,transparent 61%);box-shadow:inset 0 0 0 2px #65c7ff1c,inset 0 0 0 calc(var(--d) * .2) #ffffff04}
.cfx-shadow{position:absolute;width:var(--d);height:var(--d);left:calc(var(--d) / -2);top:calc(var(--d) / -2);border-radius:50%;
  background:radial-gradient(closest-side,#000000d0 0,#000000a0 55%,#0000 100%);filter:blur(5px);transform-origin:50% 50%}
.cfx-lift{position:absolute;width:var(--d);height:var(--d);left:calc(var(--d) / -2);top:calc(var(--d) / -2);transform-style:preserve-3d}
.cfx-coin{position:absolute;inset:0;transform-style:preserve-3d}
.cfx-face{position:absolute;inset:0;border-radius:50%;backface-visibility:hidden;-webkit-backface-visibility:hidden;background:center/100% 100% no-repeat}
.cfx-face.a{transform:translateZ(calc(var(--t) / 2))}
.cfx-face.b{transform:rotateX(180deg) translateZ(calc(var(--t) / 2))}
.cfx-rim{position:absolute;inset:0;transform-style:preserve-3d}
.cfx-rim i{position:absolute;left:50%;top:50%;width:var(--seg);height:var(--t);margin-left:calc(var(--seg) / -2);margin-top:calc(var(--t) / -2);
  transform:rotateZ(var(--a)) translateY(calc(var(--d) / -2 + 1.5px)) rotateX(90deg);backface-visibility:hidden;-webkit-backface-visibility:hidden;
  background:linear-gradient(180deg,#7f9fd6 0,#4f73b3 46%,#2a3f66 50%,#b77d24 54%,#e9ad4c 100%)}
.cfx-rim i{box-shadow:inset 0 0 0 99px rgba(2,8,26,var(--k,.3))}

/* your call (top left), recent results (top right) */
.cfx-call{position:absolute;top:16px;left:16px;z-index:3;display:grid;grid-template-columns:auto auto;grid-template-rows:auto auto;column-gap:10px;align-items:center;
  padding:7px 16px 7px 8px;border-radius:14px;background:#0a1631e0;border:1px solid #4285ff88;box-shadow:0 0 0 1px #4285ff33,0 10px 24px -14px #000}
.cfx-call img{grid-row:span 2;width:38px;height:38px;border-radius:50%;box-shadow:0 2px 6px #0008}
.cfx-call span{font-size:11.5px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);line-height:1.2}
.cfx-call b{font-size:18px;line-height:1.15;color:#fff}
.cfx-stage.flipping .cfx-call{border-color:var(--accent);box-shadow:0 0 0 2px #4285ff55,0 0 24px -6px #4285ff}
.cfx-hist{position:absolute;top:20px;right:16px;z-index:3;display:flex;gap:6px;padding:3px;max-width:calc(100% - 220px);overflow:hidden;justify-content:flex-end}
.cfx-h{flex:none;width:30px;height:30px;border-radius:50%;padding:2px;animation:fade .25s}
.cfx-h img{width:100%;height:100%;display:block;border-radius:50%}
.cfx-h.w{box-shadow:0 0 0 2px var(--win)}.cfx-h.l{box-shadow:0 0 0 2px #ff547099;opacity:.8}

.cfx-landed{position:absolute;left:50%;bottom:84px;transform:translate(-50%,6px);z-index:3;font-size:16px;font-weight:700;color:#d6e2ff;opacity:0;transition:opacity .25s,transform .25s;white-space:nowrap}
.cfx-landed.on{opacity:1;transform:translate(-50%,0)}
.cfx-landed b{font-size:20px;margin-right:2px}
.cfx-landed b.donut{color:#ffc94a}.cfx-landed b.star{color:#8fb8ff}
.cfx-stage .outcome{bottom:20px}

@media (max-width:900px){
  .cfx-call{top:10px;left:10px;padding:5px 12px 5px 6px}
  .cfx-call img{width:30px;height:30px}
  .cfx-call b{font-size:16px}
  .cfx-hist{top:14px;right:10px;max-width:calc(100% - 170px)}
  .cfx-h{width:24px;height:24px}
  .cfx-landed{bottom:74px;font-size:15px}
  .cfx-landed b{font-size:18px}
  .cfx-pick button{height:56px}
  .cfx-world{top:55%}
}

@media (max-width:900px){ .cfx-stage .outcome{max-width:calc(100% - 20px);gap:8px;padding:8px 14px 8px 10px;font-size:16px} .cfx-stage .outcome .det{overflow:hidden;text-overflow:ellipsis;min-width:0;font-size:13px} }
.cfx-game { --stage-h:570px; }
.cfx-ctrl { padding:22px; }
.cfx-odds { color:var(--dim); font-size:11px; letter-spacing:.05em; }
.cfx-ctrl .lbl { display:flex; justify-content:space-between; align-items:center; }
.cfx-pick button { height:98px!important; flex-direction:column; justify-content:center; gap:7px!important; background:#0a1930; }
.cfx-pick button img { width:46px!important; height:46px!important; box-shadow:none!important; }
.cfx-pick button.on { border-color:#71b8ef!important; background:#183553!important; box-shadow:inset 0 0 0 1px #71b8ef33!important; }
.cfx-pick .cfx-tick { background:#77c8ec!important; }
.cfx-pick .cfx-tick .ic { color:#10223c!important; }
.cfx-stage { background:radial-gradient(ellipse at 50% 58%,#1d3856 0,#122842 45%,#0b1b32 90%)!important; }
.cfx-stage:before { content:''; position:absolute; inset:15px; border:1px solid #8bc5e21a; border-radius:9px; pointer-events:none; }
.cfx-table-mark { position:absolute; top:34px; left:20px; right:20px; text-align:center; pointer-events:none; }
.cfx-table-mark>span { font-size:10px; letter-spacing:.22em; font-weight:800; color:#7d9bb5; }
.cfx-table-mark h2 { margin:10px 0 6px; font-size:27px; letter-spacing:-.045em; color:#edf5ff; }
.cfx-table-mark p { margin:0; font-size:13px; color:#93adc4; }
.cfx-table-mark p b { color:#dbeaf6; }
.cfx-world { top:57%!important; }
.cfx-world:before { background:radial-gradient(circle,#83c6e608 0 49%,transparent 50%)!important; box-shadow:inset 0 0 0 1px #9ac9e325,inset 0 0 0 calc(var(--d) * .16) #87cae605!important; width:calc(var(--d) * 1.85)!important; height:calc(var(--d) * 1.85)!important; left:calc(var(--d) * -.925)!important; top:calc(var(--d) * -.925)!important; }
.cfx-call { top:145px!important; left:22px!important; border:1px solid #6ca2c033!important; background:#09192ba8!important; box-shadow:none!important; border-radius:9px!important; }
.cfx-call img { width:27px!important; height:27px!important; box-shadow:none!important; }
.cfx-call span { font-size:9px!important; }
.cfx-call b { font-size:14px!important; }
.cfx-hist { top:154px!important; right:24px!important; }
.cfx-landed { bottom:105px!important; font-size:13px!important; }
.cfx-landed b { font-size:15px!important; }
.cfx-stage .outcome { bottom:54px!important; }
.cfx-table-footer { position:absolute; bottom:22px; left:0; right:0; display:flex; align-items:center; justify-content:center; gap:13px; color:#6c8aa4; font-size:9px; letter-spacing:.2em; font-weight:800; }
.cfx-table-footer i { width:3px; height:3px; background:#6c8aa4; border-radius:50%; }
@media(max-width:900px) { .cfx-game { --stage-h:470px; } .cfx-ctrl { padding:16px; } .cfx-table-mark { top:24px; } .cfx-table-mark h2 { font-size:23px; } .cfx-call { top:125px!important; left:16px!important; } .cfx-hist { top:134px!important; right:18px!important; } .cfx-world { top:60%!important; } }