/* FoMyPay v5 — exact mobile geometry, richer violet light and deterministic game motion */
:root{
  --f-bg:#030107;
  --f-bg-elevated:#08030f;
  --f-surface:#10051c;
  --f-surface-raised:#18082a;
  --f-surface-strong:#21103a;
  --f-border:rgba(191,126,255,.22);
  --f-border-strong:rgba(203,146,255,.38);
  --f-primary:#9550ff;
  --f-primary-bright:#cf91ff;
  --f-primary-deep:#6422dc;
  --f-shadow-card:0 18px 46px rgba(42,4,87,.30);
  --f-shadow-action:0 12px 34px rgba(137,51,255,.38);
}

html,body{background:#030107!important}
.v2-shell{position:relative;background:linear-gradient(180deg,#07010e 0,#030107 100%)!important;overflow:hidden}
.v2-shell::before,.v2-shell::after{content:"";position:fixed;z-index:0;inset:-20% calc(50% - 240px);width:480px;pointer-events:none;background-image:radial-gradient(circle,rgba(215,172,255,.76) 0 1px,transparent 1.5px),radial-gradient(circle,rgba(151,69,255,.64) 0 1px,transparent 1.7px),radial-gradient(circle,rgba(189,118,255,.42) 0 1.5px,transparent 2px);background-size:83px 97px,137px 151px,191px 213px;background-position:7px 11px,41px 73px,98px 29px;opacity:.19;animation:fomyStars 34s ease-in-out infinite alternate;will-change:translate;contain:strict}
.v2-shell::after{opacity:.10;transform:scale(1.2);animation-duration:55s;animation-direction:alternate-reverse}
.v2-shell>.topbar,.v2-shell>.content{position:relative;z-index:2}
.v2-shell>.bottom-nav{position:fixed;z-index:40}
@keyframes fomyStars{from{translate:0 -24px}to{translate:0 24px}}

.page-stack:not(.immersive-page)>*{animation:surfaceEnter .42s cubic-bezier(.2,.72,.2,1) both}
.page-stack:not(.immersive-page)>*:nth-child(2){animation-delay:.035s}.page-stack:not(.immersive-page)>*:nth-child(3){animation-delay:.07s}.page-stack:not(.immersive-page)>*:nth-child(4){animation-delay:.105s}.page-stack:not(.immersive-page)>*:nth-child(5){animation-delay:.14s}.page-stack:not(.immersive-page)>*:nth-child(n+6){animation-delay:.175s}
@keyframes surfaceEnter{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}

@keyframes violetFlow{0%{background-position:8% 50%}100%{background-position:92% 50%}}
.primary,.glow-cta,.profile-wide em,.wheel-hero-v3 em{background-image:linear-gradient(105deg,#5f20d5 0%,#9145ff 26%,#d291ff 50%,#8d42fc 74%,#5f20d5 100%)!important;background-size:260% 100%!important;animation:violetFlow 3.8s ease-in-out infinite alternate!important}

/* Home hero and four clear quick actions */
.v3-hero{height:270px!important;padding:22px!important;background:linear-gradient(145deg,#210a39 0,#090311 74%)!important;overflow:hidden;isolation:isolate}
.v3-hero::before{content:""!important;display:block!important;position:absolute!important;z-index:0!important;width:270px!important;height:250px!important;right:-18px!important;top:10px!important;background:radial-gradient(circle,rgba(177,83,255,.38) 0,rgba(116,38,219,.15) 44%,transparent 72%)!important;animation:none!important;pointer-events:none}
.v3-hero::after{content:""!important;display:block!important;position:absolute!important;z-index:1!important;top:-30%!important;bottom:-30%!important;left:-50%!important;width:45%!important;background:linear-gradient(90deg,transparent 0,rgba(255,255,255,.035) 28%,rgba(226,195,255,.18) 50%,rgba(255,255,255,.035) 72%,transparent 100%)!important;filter:blur(9px);transform:translateX(0) skewX(-18deg);animation:heroMetalSheen 5.2s cubic-bezier(.32,.02,.24,1) infinite!important;pointer-events:none}
@keyframes heroMetalSheen{0%,16%{opacity:0;transform:translateX(0) skewX(-18deg)}22%{opacity:.62}58%{opacity:.62;transform:translateX(360%) skewX(-18deg)}64%,100%{opacity:0;transform:translateX(360%) skewX(-18deg)}}
.hero-copy{position:relative;z-index:4}.hero-copy>*{max-width:170px!important}.hero-copy>small{margin-top:34px!important}.hero-copy>strong{font-size:40px!important}.hero-copy .primary{width:166px!important}
.hero-robot{width:272px!important;height:272px!important;right:-8px!important;bottom:-58px!important;object-fit:contain!important;object-position:center!important;mix-blend-mode:normal!important;filter:drop-shadow(0 0 26px rgba(164,75,255,.40)) drop-shadow(0 20px 34px rgba(45,4,88,.52))!important}
.home-shortcuts{gap:8px!important;align-items:start}
.home-shortcut{min-height:104px!important;justify-content:flex-start!important;gap:8px!important}
.home-shortcut span{width:clamp(64px,18vw,74px)!important;height:clamp(64px,18vw,74px)!important;border-radius:22px!important;background:radial-gradient(circle at 50% 0,rgba(194,119,255,.22),transparent 62%),linear-gradient(145deg,#24103d,#10061c)!important;border:1px solid rgba(197,132,255,.30)!important;box-shadow:inset 0 1px rgba(255,255,255,.06),0 13px 30px rgba(58,9,111,.34)!important}
.home-shortcut svg{width:26px!important;height:26px!important}.home-shortcut b{font-size:10px!important;text-align:center}

/* Image assets are the cards: no second plate or outline under them */
.bonus-image-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:12px!important;align-items:start!important}
.bonus-image-grid .asset-banner,.game-banner-list button{min-height:0!important;height:auto!important;border:0!important;border-radius:0!important;background:none!important;box-shadow:none!important;padding:0!important;overflow:visible!important}
.bonus-image-grid .asset-banner{aspect-ratio:4/3!important}
.bonus-image-grid .asset-banner img{width:100%!important;height:100%!important;object-fit:contain!important;display:block!important}
.game-banner-list{gap:12px!important}
.game-banner-list button{aspect-ratio:auto!important}
.game-banner-list img{width:100%!important;height:auto!important;max-height:none!important;object-fit:contain!important;border-radius:20px;display:block!important}
.bonus-image-grid .asset-banner,.game-banner-list button{content-visibility:auto;contain-intrinsic-size:auto 160px}

/* Wheel banner: readable left column, half wheel clipped on the right */
.wheel-hero-v3{height:168px!important;padding:20px 22px!important;grid-template-columns:1fr!important;position:relative;background:radial-gradient(circle at 85% 45%,rgba(155,61,255,.23),transparent 42%),linear-gradient(145deg,#210b39,#090311)!important;overflow:hidden!important}
.wheel-hero-v3>div:first-child{width:68%;position:relative;z-index:2}
.wheel-hero-v3 small{font-size:8px!important}.wheel-hero-v3 b{font-size:19px!important;margin-top:8px!important}.wheel-hero-v3 span{font-size:9px!important;margin-top:5px!important}
.wheel-hero-v3 div>i{width:min(100%,176px)!important;margin-top:13px!important}
.wheel-hero-v3 em{width:94px;min-height:38px!important;margin-top:12px!important;justify-content:center;padding:0!important}
.wheel-hero-v3 .mini-wheel{position:absolute!important;width:146px!important;height:146px!important;right:-55px!important;top:11px!important;border-width:9px!important;box-shadow:0 0 42px rgba(156,66,255,.44)!important}
.mini-wheel img{inset:43px!important;width:42px!important;height:42px!important;padding:7px!important;border-radius:50%!important;background:#0a0311!important}

/* Compact promo banner */
.bonuses-v3 .bonus-promo{height:96px!important;min-height:96px!important;padding:14px!important;display:grid!important;grid-template-columns:46px minmax(0,1fr) 40px!important;grid-template-rows:1fr!important;gap:12px!important;align-items:center!important;border-radius:20px!important;background:radial-gradient(circle at 78% 30%,rgba(175,72,255,.25),transparent 40%),linear-gradient(145deg,#240b3e,#0c0416)!important}
.bonuses-v3 .bonus-promo .bonus-visual{width:46px!important;height:46px!important;border-radius:14px!important;display:grid!important;place-items:center!important;background:rgba(158,75,255,.14)!important}
.bonuses-v3 .bonus-promo .bonus-visual svg{width:22px!important}.bonuses-v3 .bonus-promo .bonus-copy{align-self:center!important;min-width:0}.bonuses-v3 .bonus-promo .bonus-copy small{font-size:7px!important;line-height:1.1}.bonuses-v3 .bonus-promo .bonus-copy b{font-size:14px!important;line-height:1.15!important;margin-top:4px!important}.bonuses-v3 .bonus-promo .bonus-copy em{font-size:8px!important;line-height:1.35!important;margin-top:3px!important;white-space:normal!important}.bonuses-v3 .bonus-promo .banner-arrow{position:static!important;width:40px!important;height:40px!important;border-radius:13px!important;display:grid!important;place-items:center!important}.bonuses-v3 .bonus-promo .banner-arrow svg{width:18px!important;height:18px!important}

/* Exact reward wheel landing and center mark */
.wheel-stage-v3{min-height:430px!important;padding:32px 14px 20px!important;justify-content:flex-start!important;background:radial-gradient(circle at 50% 34%,rgba(155,74,255,.20),transparent 52%),#08030e!important}
.wheel-stage-v3 .reward-wheel{width:280px!important;height:280px!important;margin:0 auto 2px!important;background:conic-gradient(from 0deg,#7d44df 0 20%,#9f63f2 20% 40%,#4b2b68 40% 60%,#6b3dc4 60% 80%,#2b2039 80% 100%)!important;border:10px solid #1b1028!important;box-shadow:inset 0 0 0 2px rgba(255,255,255,.08),0 0 48px rgba(143,57,255,.30)!important}
.reward-wheel.spinning{transition:transform 5s cubic-bezier(.08,.68,.04,1)!important}
.reward-wheel>span{left:calc(50% - 31px)!important;top:5px!important;width:62px!important;height:130px!important;transform-origin:31px 135px!important;transform:rotate(var(--label-angle))!important;padding-top:19px!important}
.reward-wheel>span b{font-size:11px!important;line-height:1!important;white-space:nowrap!important;transform:rotate(var(--label-upright))!important}
.wheel-stage-v3 .reward-wheel>i{inset:94px!important;border-radius:50%!important;border:7px solid #1c1029!important;background:#08030e!important;display:grid!important;place-items:center!important;box-shadow:0 0 24px rgba(153,66,255,.32)!important}
.wheel-stage-v3 .reward-wheel>i img{width:58px!important;height:58px!important;padding:8px!important;background:transparent!important;border-radius:0!important}
.wheel-stage-v3>.wheel-pointer{position:absolute!important;z-index:8!important;left:50%!important;top:23px!important;transform:translateX(-50%)!important;width:0!important;height:0!important;border-left:12px solid transparent!important;border-right:12px solid transparent!important;border-top:23px solid #fff!important;border-bottom:0!important;filter:drop-shadow(0 0 9px rgba(205,139,255,.68))!important}
.wheel-stage-v3>strong{font-size:13px!important;margin-top:14px!important}.wheel-stage-v3>small{font-size:9px!important;margin-top:5px!important}

/* Crash curve remains visible over the moving space field */
.space-crash{overflow:hidden}.crash-flight-graph{position:absolute;z-index:2;inset:92px 10px 20px;width:calc(100% - 20px);height:calc(100% - 112px);opacity:.88;pointer-events:none}.crash-v3-area{fill:url(#v3CrashFill)}.crash-v3-line{fill:none;stroke:url(#v3CrashStroke);stroke-width:3;stroke-linecap:round;filter:drop-shadow(0 0 7px rgba(170,94,255,.66))}.crash-v3-dot{fill:#f1dcff;filter:drop-shadow(0 0 8px #ae63ff)}.space-crash.crashed{animation:crashShake .42s ease}.space-crash.crashed .crash-v3-line{stroke:#f06a7d}.space-crash.crashed .crash-v3-dot{fill:#f06a7d}@keyframes crashShake{25%{transform:translateX(-3px)}50%{transform:translateX(3px)}75%{transform:translateX(-1px)}}

/* Server reel uses its exact target index under the fixed center pointer */
.roulette-reel{transform:translateX(0)!important}
.roulette-reel.rolling{transform:translateX(calc(var(--target-index) * -57px))!important;transition:transform 5s cubic-bezier(.08,.72,.04,1)!important}
.roulette-reel.settled{transform:translateX(calc(var(--target-index) * -57px))!important}

/* Multi-ball Plinko */
.v3-plinko .plinko-canvas-wrap{position:relative}.plinko-active{position:absolute;z-index:4;left:12px;top:12px;min-height:28px;padding:0 10px;border:1px solid rgba(192,129,255,.24);border-radius:10px;background:rgba(13,5,24,.82);display:flex;align-items:center;font-size:8px;color:#d2b4ff;backdrop-filter:blur(10px)}
.plinko-recent{height:38px;display:flex;gap:7px;overflow-x:auto;scrollbar-width:none}.plinko-recent::-webkit-scrollbar{display:none}.plinko-recent span{height:32px;min-width:max-content;padding:0 10px;border-radius:10px;display:flex;align-items:center;font-size:8px;border:1px solid var(--f-border);background:rgba(149,80,255,.08);color:#cab0ed}.plinko-recent span.win{color:#7ee4ad;border-color:rgba(99,217,154,.25);background:rgba(99,217,154,.07)}
.v3-plinko .plinko-payouts span.hit{animation:bucketHit .5s ease both}@keyframes bucketHit{35%{transform:translateY(-5px) scale(1.08);box-shadow:0 0 26px rgba(185,112,255,.72)}100%{transform:none}}

/* FAQ cards never overlap and chance FAQ entries are removed in markup */
.faq-list{display:grid!important;gap:8px!important;overflow:visible!important;background:transparent!important;border:0!important;box-shadow:none!important}
.faq-list details{display:block!important;position:relative!important;margin:0!important;border:1px solid var(--f-border)!important;border-radius:16px!important;overflow:hidden!important;background:linear-gradient(145deg,rgba(31,12,52,.96),rgba(12,5,21,.98))!important;box-shadow:none!important}
.faq-list summary{min-height:62px!important;padding:10px 12px!important;grid-template-columns:38px minmax(0,1fr) 18px!important;gap:11px!important}.faq-list summary>b{font-size:11px!important;line-height:1.3!important}.faq-list p{position:static!important;margin:0!important;padding:0 14px 15px 61px!important;font-size:10px!important;line-height:1.55!important}

@media(max-width:385px){
  .v3-hero{height:258px!important;padding:19px!important}.hero-copy>*{max-width:158px!important}.hero-copy>strong{font-size:36px!important}.hero-robot{width:248px!important;height:248px!important;right:-13px!important;bottom:-52px!important}
  .home-shortcut{min-height:95px!important}.home-shortcut span{width:64px!important;height:64px!important;border-radius:19px!important}.home-shortcut b{font-size:9px!important}
  .bonus-image-grid{gap:8px!important}.game-banner-list{gap:9px!important}.game-banner-list img{border-radius:17px}
  .wheel-hero-v3{padding-left:18px!important}.wheel-hero-v3>div:first-child{width:72%}.wheel-hero-v3 .mini-wheel{right:-66px!important}
  .wheel-stage-v3 .reward-wheel{width:260px!important;height:260px!important}.reward-wheel>span{height:120px!important;transform-origin:31px 125px!important}.wheel-stage-v3 .reward-wheel>i{inset:87px!important}
}

@media(prefers-reduced-motion:reduce){
  .v2-shell::before,.v2-shell::after,.v3-hero::after,.page-stack:not(.immersive-page)>*,.primary,.glow-cta,.profile-wide em,.wheel-hero-v3 em{animation:none!important}
  .reward-wheel.spinning,.roulette-reel.rolling{transition-duration:.01ms!important}
}

/* v6: exact banner rhythm and server-game rebuild */
.bonus-image-grid{gap:10px!important}
.bonus-image-grid .asset-banner{aspect-ratio:7/4!important;overflow:hidden!important;border-radius:18px!important}
.bonus-image-grid .asset-banner img{object-fit:contain!important}
.game-banner-list{gap:10px!important}
.game-banner-list button{aspect-ratio:2056/765!important;overflow:hidden!important;border-radius:20px!important}
.game-banner-list img{width:100%!important;height:100%!important;object-fit:contain!important;border-radius:20px!important}

.space-crash{height:340px;background:#08050f!important;border-color:rgba(163,103,255,.38)!important;box-shadow:inset 0 0 0 1px rgba(255,255,255,.024),0 18px 50px rgba(28,4,67,.34)!important}
#crash-live-canvas{position:absolute;inset:0;width:100%;height:100%;display:block}
.space-crash .crash-center{top:22px;pointer-events:none}
.space-crash .crash-center strong{font-variant-numeric:tabular-nums;font-size:42px;text-shadow:0 0 20px rgba(158,90,255,.28)}
.space-crash.crashed .crash-center strong{font-size:32px;letter-spacing:-1px}
.active-game-bet,.active-color-bet{border:1px solid rgba(158,104,255,.24);border-radius:17px;background:rgba(119,70,213,.08);padding:12px;display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-bottom:10px}
.active-game-bet>div,.active-color-bet>span{min-width:0;display:flex;flex-direction:column;gap:5px}
.active-game-bet>div:last-child,.active-color-bet>span:last-child{text-align:right;align-items:flex-end}
.active-game-bet span,.active-color-bet small{font-size:8px;color:#8f889f}
.active-game-bet b,.active-color-bet b{font-size:12px;font-variant-numeric:tabular-nums}
.active-game-bet.active{border-color:rgba(161,108,255,.48);box-shadow:0 0 24px rgba(116,55,225,.12)}
.active-game-bet.cashed_out{border-color:rgba(89,217,148,.35)}
.active-game-bet.lost{border-color:rgba(240,89,117,.28);background:rgba(136,26,49,.08)}
.v3-crash .cashout{background:linear-gradient(135deg,#9d62ff,#6f39dc)!important;box-shadow:0 10px 26px rgba(116,54,224,.25)!important}
.live-bet.cashed_out>i,.live-bet.cashed_out small{color:#60d995}
.live-bet.lost>i,.live-bet.lost small{color:#f06a79}

.roulette-reel{transform:translateX(0)!important}
.roulette-reel.rolling{transform:translateX(calc(var(--target-index) * -57px))!important;transition:transform 5.15s cubic-bezier(.075,.66,.035,1)!important}
.roulette-reel.settled{transform:translateX(calc(var(--target-index) * -57px))!important}
.active-color-bet{margin:0;border-color:rgba(159,108,255,.3);background:linear-gradient(145deg,rgba(107,57,196,.13),rgba(255,255,255,.018))}
.active-color-bet b{display:flex;align-items:center;gap:7px}
.active-color-bet b i{width:10px;height:10px;border-radius:50%;flex:none}
.active-color-bet b i.red{background:#d83a50}.active-color-bet b i.black{background:#393d48}.active-color-bet b i.green{background:#32c978}
.roulette-controls>.primary:disabled{margin-top:0}

.result-modal.loss .result-icon{background:rgba(240,83,112,.08);color:#ff758c}
.result-modal.loss>strong{color:#f4eefb}.result-modal.win>strong{color:#fff}
.result-breakdown{display:grid;gap:0;margin:4px 0 18px;border:1px solid rgba(158,107,255,.14);border-radius:17px;padding:4px 12px;background:rgba(255,255,255,.018)}
.result-breakdown>div{min-height:34px;display:flex;align-items:center;justify-content:space-between;gap:12px;border-bottom:1px solid rgba(255,255,255,.045)}
.result-breakdown>div:last-child{border-bottom:0}
.result-breakdown span{font-size:9px;color:#8d8799;text-align:left}.result-breakdown b{font-size:10px;text-align:right;font-variant-numeric:tabular-nums}
.v3-game-title .fair-button{width:46px!important;height:46px!important;min-width:46px!important;min-height:46px!important}
.v3-game-topbar>.round-btn,.v3-game-topbar>.deposit-pill.compact{height:46px!important;min-height:46px!important}.v3-game-topbar>.round-btn{width:46px!important;min-width:46px!important}

@media(max-width:385px){
  .bonus-image-grid,.game-banner-list{gap:10px!important}
  .bonus-image-grid .asset-banner{border-radius:16px!important}
  .game-banner-list button,.game-banner-list img{border-radius:17px!important}
  .space-crash{height:324px}
  .active-game-bet,.active-color-bet{padding:10px;gap:8px}
}

@media(prefers-reduced-motion:reduce){
  .roulette-reel.rolling{transition-duration:.01ms!important}
}
