/* Page shell: cream page with a solid dark top bar (same as the shop) */
.bonus-page::before{display:none;content:none}
.bonus-page{background:#eee5d5;color:#15251d;color-scheme:light}
.bonus-page .topbar{position:relative;background:#0e2019;height:auto;min-height:80px;padding-block:18px}
.bonus-page .footer{background:#0e2019}
.bonus-page .nav-links a[aria-current=page]{color:var(--gold-light)}
.bonus-main{padding-top:56px;padding-bottom:72px;position:relative}
.bonus-main [hidden]{display:none!important}
.bonus-heading{display:grid;grid-template-columns:1.5fr 1fr;gap:64px;align-items:center;margin-bottom:32px}
.bonus-heading h1{font-family:"Playfair Display",serif;font-size:clamp(40px,4.6vw,70px);line-height:1.08;margin:16px 0 20px;letter-spacing:-2px}
.bonus-heading h1 em,.bonus-block h2 em,.wheel-card h2 em{color:#456647}
.bonus-heading>div>p:last-child{max-width:560px;line-height:1.8;color:#58635b;font-size:16px}
.bonus-account{background:#122d22;color:#f6f2e7;padding:28px;border-radius:6px;border-top:4px solid #cbb16c;box-shadow:0 12px 30px #122d2212}
.bonus-account h2{font-size:26px;overflow-wrap:anywhere;margin:14px 0 6px}
.bonus-account p{color:#d0d9d2;line-height:1.7;margin:0}
.bonus-account .button{margin-top:14px}
.bonus-small{font-size:12px;line-height:1.7;letter-spacing:.6px}
.bonus-notice{padding:15px 20px;background:#ede9db;border-left:3px solid #b99b58;line-height:1.6;min-height:54px;margin:0}
.bonus-notice.is-success{background:#e0eee1;border-color:#3b7548}
.bonus-block{padding-top:48px}
.bonus-block .section-heading{margin-bottom:22px}
.bonus-block h2,.wheel-card h2{font-family:"Playfair Display",serif;font-size:clamp(30px,3.6vw,44px);margin:8px 0 0;letter-spacing:-1px}
/* daily: rummy-tile days */
.daily-row{display:grid;grid-template-columns:repeat(5,minmax(0,132px));gap:16px;justify-content:start;padding:10px 2px 18px}
.day-tile{position:relative;display:flex;flex-direction:column;align-items:center;gap:2px;padding:14px 8px 14px;border-radius:12px;text-align:center;background:radial-gradient(120% 80% at 50% 0%,#fffdf6,#f7efdc 55%,#eee2c6);box-shadow:inset 0 2px 0 #fff,0 6px 0 #cdb98c,0 7px 0 #b9a273,0 14px 22px rgba(18,45,34,.16)}
.day-tile::before{content:"";position:absolute;inset:6px;border-radius:8px;border:1px solid rgba(155,125,64,.3);pointer-events:none}
.day-tile img{width:60px;height:auto;margin:4px 0;filter:drop-shadow(0 5px 5px rgba(80,50,0,.28))}
.day-tile b{font:800 20px/1.1 "Playfair Display",serif;color:#1b2d24}
.day-tile small{font-size:10.5px;color:#6d6653;font-weight:700}
.day-joker{display:inline-flex;align-items:center;gap:4px;margin-top:4px;padding:2px 10px 2px 9px;border-radius:999px;background:#efe3ff;color:#4a2385;font:900 13px "DM Sans",sans-serif}
.day-joker img{width:24px;height:31px;object-fit:contain}
.day-label{font-size:10px;font-weight:800;letter-spacing:1px;text-transform:uppercase;color:#8a6a2a}
.day-tile.is-today{box-shadow:inset 0 2px 0 #fff,0 0 0 2px #e8c46a,0 6px 0 #d9b35a,0 7px 0 #b58d35,0 16px 28px rgba(190,140,30,.3);transform:translateY(-4px)}
.day-tile.is-today:not(.is-done) img{animation:dayBob 2.4s ease-in-out infinite}
.day-tile.is-done{opacity:.85}
.day-tile i{position:absolute;top:8px;right:10px;width:22px;height:22px;display:grid;place-items:center;border-radius:50%;background:#2f7a4f;color:#fff;font-style:normal;font-size:13px;font-weight:900}
@keyframes dayBob{0%,100%{transform:translateY(0)}50%{transform:translateY(-5px)}}
.bonus-actions{display:flex;flex-wrap:wrap;align-items:center;gap:12px;margin-top:10px}
.bonus-btn{min-height:44px;padding:10px 20px;border:0;border-radius:10px;cursor:pointer;font:800 14px "DM Sans",sans-serif;color:#fff;background:linear-gradient(180deg,#24553d,#153626);box-shadow:0 3px 0 #0c2118,0 6px 14px rgba(12,33,24,.2);transition:transform .15s,filter .15s}
.bonus-btn:hover:not(:disabled){filter:brightness(1.12)}
.bonus-btn:active:not(:disabled){transform:translateY(2px)}
.bonus-btn:disabled{background:#e4e0d0;color:#6a6a5c;box-shadow:none;cursor:default}
.bonus-btn-gold{color:#3a2600;background:linear-gradient(90deg,#f5c85a,#ffe7a0,#f5c85a);background-size:200% 100%;box-shadow:0 3px 0 #a77a22,0 6px 14px rgba(240,190,70,.3);animation:gShine 3s linear infinite}
@keyframes gShine{to{background-position:-200% 0}}
.bonus-meta{font-size:13px;color:#5f6a60;margin:8px 0 0}
/* wheels: the same stage as the game (WheelStage): felt-green gradient, gold title, odds card, big wheel */
.wheels{display:grid;grid-template-columns:1fr;gap:26px;position:relative}
.wheel-card{position:relative;overflow:hidden;display:grid;grid-template-columns:minmax(240px,340px) 1fr;gap:24px;align-items:center;padding:26px 30px;border-radius:18px;background:linear-gradient(160deg,#1C382B,#0E2019 55%,#07120D);color:#F3EAD9;box-shadow:0 18px 40px rgba(8,24,17,.3)}
.wheel-info{display:flex;flex-direction:column;gap:12px}
.wheel-card .wheel-title{margin:0;font:900 26px "DM Sans",sans-serif;letter-spacing:1px;color:#E8B940;text-shadow:0 0 12px rgba(255,190,70,.5)}
.wheel-box{padding:14px;border-radius:16px;border:1.5px solid rgba(201,164,92,.53);background:rgba(0,0,0,.33);display:grid;gap:5px}
.wheel-box b{font-size:15px;font-weight:900;color:#F3EAD9}
.wheel-box .bonus-meta{margin:0;color:#DCE6DE;font-size:13px;line-height:1.45}
.wheel-box hr{border:0;height:1px;background:rgba(201,164,92,.27);margin:6px 0}
.wheel-odds{list-style:none;padding:0;margin:0;display:grid;gap:2px;font-size:13px;color:#DCE6DE}
.wheel-odds li{display:flex;justify-content:space-between;gap:12px}
.wheel-odds-lucky{grid-template-columns:1fr 1fr;column-gap:18px}
.wheel-odds li.is-jackpot{color:#FFD54A;font-weight:900}
.wheel-host{position:relative;width:min(420px,100%);margin:0 auto}
.sound-toggle{justify-self:end;border:1px solid #cbb16c;background:#fffdf7;color:#234331;border-radius:999px;padding:6px 14px;font:700 12px "DM Sans",sans-serif;cursor:pointer}
/* the wheel itself (wheel.js) */
.ra-wheel{position:relative;isolation:isolate}
.ra-svg{position:relative;z-index:1;display:block;width:100%;height:auto;overflow:visible}
.ra-glow{position:absolute;z-index:0;left:-2%;top:4%;width:104%;aspect-ratio:1;border-radius:50%;background:#FFC24A;opacity:.18;box-shadow:0 0 30px rgba(255,194,74,.55)}
.ra-wheel::before{content:"";position:absolute;z-index:-1;left:-25%;top:-22%;width:150%;aspect-ratio:1;border-radius:50%;background:rgba(255,170,60,.07);box-shadow:0 0 80px 30px rgba(255,160,60,.10)}
.ra-bulb{fill:#FFF8D6;filter:drop-shadow(0 0 3px rgba(255,236,150,.95))}
.ra-bulb.b-on{animation:bulbA .9s linear infinite}.ra-bulb.b-off{animation:bulbB .9s linear infinite}
.is-spinning .ra-bulb{animation-duration:.26s}
@keyframes bulbA{0%,100%{opacity:1}50%{opacity:.35}}@keyframes bulbB{0%,100%{opacity:.35}50%{opacity:1}}
.ra-hub{transform-box:view-box}
.is-available .ra-hub{animation:hubPulse 1.4s ease-in-out infinite}
@keyframes hubPulse{0%,100%{transform:scale(1)}50%{transform:scale(1.1)}}
.ra-hit{position:absolute;z-index:2;left:8%;top:12%;width:84%;aspect-ratio:1;border-radius:50%;border:0;background:transparent;cursor:pointer}
.ra-hit:disabled{cursor:default}
.ra-hit:focus-visible{outline:3px solid #f0cf7a;outline-offset:4px}
.ra-smoke{position:absolute;z-index:3;inset:-25%;pointer-events:none;opacity:0;transition:opacity 1.2s}
.is-spinning .ra-smoke{opacity:1;transition:opacity .25s}
.ra-smoke i{position:absolute;left:50%;top:50%;width:34%;aspect-ratio:1;margin:-17% 0 0 -17%;border-radius:50%;background:radial-gradient(circle,rgba(244,238,246,.6),rgba(217,208,222,.32) 45%,rgba(184,174,192,0) 70%);opacity:0}
.is-spinning .ra-smoke i{animation:puff 1.8s cubic-bezier(.33,1,.68,1) infinite;animation-delay:var(--d)}
@keyframes puff{0%{opacity:0;transform:translate(var(--x0),var(--y0)) scale(.45)}20%{opacity:.9}60%{opacity:.55}100%{opacity:0;transform:translate(var(--x1),var(--y1)) rotate(var(--t)) scale(var(--g))}}
/* prize pop-up (PrizePopup in the game) */
.ra-pop{position:fixed;inset:0;z-index:200;display:grid;place-items:center;background:rgba(8,4,2,.8);animation:popFade .2s ease;overflow:hidden}
.ra-pop.is-out{opacity:0;transition:opacity .2s}
@keyframes popFade{from{opacity:0}}
.ra-pop-fx{position:absolute;inset:0;pointer-events:none}
.ra-pop-glow{position:absolute;left:50%;top:50%;width:95vmin;height:95vmin;margin:-47.5vmin 0 0 -47.5vmin;border-radius:50%;background:radial-gradient(circle,rgba(255,224,138,.55),rgba(255,158,44,.22) 45%,rgba(255,122,0,0) 70%);animation:glowPulse 2.2s ease-in-out infinite}
@keyframes glowPulse{0%,100%{opacity:.55;transform:scale(.92)}50%{opacity:.9;transform:scale(1.06)}}
.ra-pop-burst{position:absolute;left:50%;top:50%;width:150vmax;height:150vmax;margin:-75vmax 0 0 -75vmax;animation:burstSpin 16s linear infinite}
.ra-pop-burst svg{width:100%;height:100%}
.ra-pop-burst.ra-rev{animation-direction:reverse}
@keyframes burstSpin{to{transform:rotate(360deg)}}
.ra-pop-sparks i{position:absolute;left:50%;top:50%;width:var(--s);height:var(--s);transform:translate(var(--x),var(--y)) rotate(45deg);background:#FFF6D0;clip-path:polygon(50% 0,58% 42%,100% 50%,58% 58%,50% 100%,42% 58%,0 50%,42% 42%);opacity:0;animation:spark 1.3s ease-in-out infinite;animation-delay:var(--d)}
@keyframes spark{0%,100%{opacity:0;scale:.3}50%{opacity:1;scale:1.2}}
.ra-confetti i{position:absolute;top:-4vh;left:var(--x);width:9px;height:14px;background:var(--c);border-radius:2px;animation:fall 2.2s cubic-bezier(.55,0,1,.45) forwards;animation-delay:var(--d)}
@keyframes fall{to{transform:translateY(110vh) rotate(var(--r))}}
.ra-pop-card{position:relative;z-index:1;min-width:280px;max-width:min(440px,92vw);display:flex;flex-direction:column;align-items:center;gap:8px;padding:18px 28px;border-radius:20px;border:3px solid #E8B940;background:linear-gradient(180deg,#1F4A34,#12301F 55%,#0A1D13);box-shadow:0 0 40px rgba(255,190,70,.45),0 10px 30px rgba(0,0,0,.6);text-align:center;animation:popIn .5s cubic-bezier(.3,1.6,.5,1)}
@keyframes popIn{from{transform:scale(.3)}}
.ra-pop-title{color:#E8B940;font:900 22px "DM Sans",sans-serif;letter-spacing:2px}
.ra-pop-prize{color:#F3EAD9;font:900 24px "DM Sans",sans-serif}
.ra-pop-note{color:#CFE0D3;font-size:12px;margin:0 0 4px}
.ra-pop-art{display:flex;align-items:flex-end;gap:6px}
.ra-pop-joker{width:66px;height:84px;object-fit:contain}
.ra-pop-coins{width:92px;height:82px;object-fit:contain;filter:drop-shadow(0 6px 8px rgba(0,0,0,.35))}
.ra-coins{display:flex;align-items:center;height:70px}
.ra-coins i{width:52px;height:52px;border-radius:50%;background:#F2C25B;border:3px solid #A57A22;display:grid;place-items:center;color:#A57A22;font:900 24px/1 "DM Sans",sans-serif;font-style:normal}
.ra-coins i+i{margin-left:-22px}.ra-coins i:nth-child(2){margin-top:-10px}
.ra-pop-actions{display:flex;gap:10px;flex-wrap:wrap;justify-content:center}
.ra-btn{min-height:44px;padding:10px 20px;border-radius:12px;font:900 15px "DM Sans",sans-serif;cursor:pointer}
.ra-gold{border:0;color:#3a2600;background:linear-gradient(180deg,#F6DC92,#D9A93F);box-shadow:0 3px 0 #8C5A12}
.ra-second{border:1.5px solid #C9A45C;color:#F3EAD9;background:#5B3A22}
@media(max-width:760px){.wheel-card{grid-template-columns:1fr;padding:22px 16px}.wheel-host{width:min(360px,100%)}.wheel-info{order:2}}
@media(prefers-reduced-motion:reduce){.ra-bulb,.ra-hub,.ra-smoke i,.ra-pop-burst,.ra-pop-glow,.ra-pop-sparks i,.ra-confetti,.ra-pop-card{animation:none!important}.ra-smoke{display:none}}
.bonus-foot{margin-top:34px;color:#6a7468}
body.is-jackpot .wheel-lucky{animation:jackpot 1s ease-in-out 3}
@keyframes jackpot{50%{box-shadow:0 0 0 6px #f2c85a,0 0 60px #f2c85a}}
@media(max-width:900px){.wheels{grid-template-columns:1fr}.bonus-heading{grid-template-columns:1fr;gap:22px}}
@media(max-width:640px){.bonus-main{padding-top:30px}.daily-row{grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}.daily-row>.day-tile:nth-child(n+4){display:none}.bonus-block .section-heading{display:block}.bonus-block .section-heading>p{margin-top:12px}.wheel-card{padding:22px 16px 20px}.bonus-actions{justify-content:center}.bonus-btn{flex:1 1 100%}.wheel-odds ul{grid-template-columns:1fr}}
@media(prefers-reduced-motion:reduce){.day-tile img,.bonus-btn-gold,body.is-jackpot .wheel-lucky{animation:none!important}}

.ra-notice-icon{display:grid;place-items:center;width:52px;height:52px;border-radius:50%;border:3px solid #E8B940;background:#E8B94026;color:#FFE9A8;font:900 26px "DM Sans",sans-serif}.ra-notice .ra-pop-title{font-size:19px}.ra-notice-text{max-width:360px;font-size:15px;line-height:1.55}