/* BlueRabbit coinflip: canonical game presentation. Shared form/player primitives live in styles.css. */
.game-coin-stage { display:grid; place-items:center; perspective:900px; }
.game-coin { width:clamp(136px,16vw,180px); }
.game-coin .coin-symbol { font-size:clamp(48px,5vw,64px); font-weight:700; }
.game-coin .coin-caption { font-size:9px; }
.game-coin.is-from-tails { --coin-start-angle:180deg; }
.game-coin .auth-coin-front,.game-side[data-game-side="heads"] { --coin-color:var(--accent); --coin-edge:#247baf; --coin-ink:#052840; }
.game-coin .auth-coin-back,.game-side[data-game-side="tails"] { --coin-color:var(--lavender); --coin-edge:#31599a; --coin-ink:#10213f; }
.game-coin .auth-coin-inner,.game-coin:not(:disabled):hover .auth-coin-inner { transform:rotateY(0); }
.game-coin.is-tails:not(.is-flipping) .auth-coin-inner { transform:rotateY(180deg); }
.game-coin.is-flipping.is-heads .auth-coin-inner { animation:game-heads var(--coin-flip-duration, .75s) ease-out forwards; }
.game-coin.is-flipping.is-tails .auth-coin-inner { animation:game-tails var(--coin-flip-duration, .75s) ease-out forwards; }
@keyframes game-heads { 0% { transform:rotateY(var(--coin-start-angle,0deg)); } 50% { transform:translateY(-20px) rotateY(calc(var(--coin-start-angle,0deg) + 540deg)) scale(1.12); } 100% { transform:rotateY(1080deg); } }
@keyframes game-tails { 0% { transform:rotateY(var(--coin-start-angle,0deg)); } 50% { transform:translateY(-20px) rotateY(calc(var(--coin-start-angle,0deg) + 540deg)) scale(1.12); } 100% { transform:rotateY(900deg); } }
.game-side-choices { display:flex; gap:8px; margin-bottom:20px; }
.game-side { flex:1; padding:11px; border:1px solid var(--coin-edge); border-radius:12px; background:transparent; color:var(--coin-color); font-size:12px; }
.game-side.is-selected { color:var(--coin-ink); background:var(--coin-color); border-color:var(--coin-edge); }
.games-hub[data-active-game="coinflip"] .game-panel[hidden] { display:none!important; }
#coinflip-panel { display:grid; align-self:start; align-content:start; grid-template-columns:minmax(0,1fr) minmax(0,1fr); column-gap:28px; }
#coinflip-panel .game-heading,#coinflip-panel>.game-info,#coinflip-panel>.game-signup { grid-column:1/-1; }
#coinflip-panel .game-coin-stage { grid-column:1; grid-row:2/4; min-height:280px; padding:32px; border:1px solid var(--line); border-radius:16px; background:radial-gradient(ellipse at 50% 30%,color-mix(in srgb,var(--accent) 9%,transparent),transparent 70%),var(--paper); }
#coinflip-panel .game-form { grid-column:2; grid-row:2; align-self:center; min-width:0; }
#coinflip-panel .game-side-choices { gap:10px; margin-bottom:18px; }
#coinflip-panel .game-side { min-width:0; min-height:48px; padding:12px; font-size:14px; line-height:1.4; overflow-wrap:anywhere; }
#coinflip-panel .game-wager-row { flex-direction:column; align-items:stretch; gap:12px; }
#coinflip-panel .game-wager-row .button { width:100%; min-width:0; min-height:48px; font-size:14px; line-height:1.4; overflow-wrap:anywhere; }
#coinflip-panel .game-result { grid-column:2; grid-row:3; margin:14px 0 0; min-height:20px; overflow-wrap:anywhere; }
#coinflip-panel>.game-info { margin-top:0; }
@container ncb-games (max-width:680px) {
  #coinflip-panel { grid-template-columns:minmax(0,1fr); }
  #coinflip-panel .game-coin-stage { grid-row:auto; min-height:230px; margin-bottom:20px; padding:28px; }
  #coinflip-panel .game-form,#coinflip-panel .game-result { grid-column:1; grid-row:auto; }}
@media(max-width:960px) {
  .flip-page.is-guest .game-coin-stage { min-height:190px; }}
@media(max-width:600px) {
  #coinflip-panel .game-coin-stage { min-height:180px; padding:20px; margin-bottom:16px; }}
@media(prefers-reduced-motion:reduce) { .game-coin.is-tails .auth-coin-inner { transform:rotateY(180deg); }}
html[data-game-motion="on"] .game-coin.is-flipping.is-heads .auth-coin-inner { animation:game-heads var(--coin-flip-duration,.75s) ease-out forwards!important; }
html[data-game-motion="on"] .game-coin.is-flipping.is-tails .auth-coin-inner { animation:game-tails var(--coin-flip-duration,.75s) ease-out forwards!important; }
html[data-game-motion="off"] .game-coin .auth-coin-inner { animation:none!important; }
@media(max-width:600px),(max-width:960px) and (max-height:500px) {

  #games-hub #coinflip-panel .game-coin-stage { min-height:160px; margin-bottom:12px; padding:16px; }
  #games-hub #coinflip-panel .game-coin { width:124px; }
  #games-hub #coinflip-panel .game-side-choices { gap:8px; margin-bottom:12px; }
  #games-hub #coinflip-panel .game-side { min-height:44px; padding:10px; }
  #games-hub #coinflip-panel .game-wager-row { gap:8px; }}
#games-hub[data-game-loading="true"] .game-content > .game-panels > #coinflip-panel[aria-busy="true"] { display:grid!important; }
