@font-face{font-family:Anton;src:url('/v2/assets/Anton-Regular.ttf')}
/* Event effects use opacity/transform only and never displace the cabinet. */
#stage .cell.winning .symbol{filter:drop-shadow(0 0 10px var(--gold)) brightness(1.15)}
#stage .wild-tower{animation:rottoWildReveal .42s cubic-bezier(.2,.8,.3,1)}
#stage .wild-tower:after{content:'';position:absolute;inset:0;background:linear-gradient(120deg,transparent 20%,#fff5 48%,transparent 70%);animation:rottoWildGleam 1.8s ease-in-out infinite;pointer-events:none}
#stage #environment:after{content:'';position:absolute;inset:0;background:radial-gradient(ellipse at 18% 24%,color-mix(in srgb,var(--accent),transparent 65%),transparent 45%),radial-gradient(ellipse at 88% 72%,#ffe6a332,transparent 34%);animation:rottoAmbient 7s ease-in-out infinite alternate;pointer-events:none}
@keyframes rottoWildReveal{from{transform:scaleY(.15);opacity:0}to{transform:scaleY(1);opacity:1}}
@keyframes rottoWildGleam{0%,25%{opacity:0;transform:translateY(-70%)}60%{opacity:.7}100%{opacity:0;transform:translateY(70%)}}
@keyframes rottoAmbient{from{opacity:.2}to{opacity:.85}}
#stage{--accent:#49e7cd;--gold:#ffe29a;--rows:3;--cols:5;background:#08191d}#environment{position:absolute;inset:0;z-index:-2;opacity:.7;overflow:hidden}#environment>svg,#environment>img{width:100%;height:100%;object-fit:cover}#stage::before{content:'';position:absolute;inset:0;z-index:-1;background:linear-gradient(#00101833,transparent 30%,#020c17c9)}#lobby{position:absolute;left:1%;top:1%;z-index:5;color:#fff;text-decoration:none;font-size:12px;padding:7px 12px;border:1px solid #fff5;border-radius:30px;background:#07151a70}.brand h1{font-size:3.5cqw;color:var(--gold);letter-spacing:-.04em;text-shadow:0 2px #312006,0 -1px #fff7c0,0 4px 12px #000}.rule-pill{border-color:var(--gold);background:#05131bb8}.line-badge{background:#05151bc9;border-color:var(--gold);box-shadow:0 0 16px color-mix(in srgb,var(--accent),transparent 65%)}#cabinet{border-color:var(--gold);background:#080e18;box-shadow:0 0 0 2px #17141c,0 0 0 5px color-mix(in srgb,var(--gold),transparent 45%),0 10px 30px #0009;border-radius:18px}.reel{background:#080e18;border-color:#cfb77244;border-radius:9px}.cell{height:calc(100% / var(--rows))}.cell .symbol{width:97%;height:98%;filter:drop-shadow(0 3px 2px #0006)}#reels{grid-template-columns:repeat(var(--cols),1fr);gap:3px}.scatter .symbol{animation:scatterShine 2.4s ease-in-out infinite;filter:drop-shadow(0 0 8px var(--accent))}.scatter:after{content:'SCATTER';position:absolute;bottom:3%;font-family:Anton;font-size:.8cqw;color:#fff3b3;text-shadow:0 2px #020408,0 0 5px #000}#stage[data-family=cascade] #cabinet{width:77%}#stage[data-family=cascade] .line-badge{width:7%}#stage[data-family=cascade] .line-badge strong{font-size:2.4cqw}#stage[data-family=cascade] .controls{width:12%}#featureHUD{position:absolute;right:1%;top:15%;width:11%;text-align:center;color:#fff;text-shadow:0 2px 5px #000;pointer-events:none}#featureHUD span{display:block;font: .7cqw Anton;letter-spacing:.08em;color:#ffe69f}#remaining{display:block;font:3.3cqw Anton}#featureWin{display:block;font-size:1.3cqw;margin:.5cqw 0}#multiplier{display:block;font:2.7cqw Anton;color:var(--accent);filter:drop-shadow(0 0 7px #23caff)}#stage.free #environment{filter:hue-rotate(35deg) saturate(1.2)}#stage.free #cabinet{box-shadow:0 0 0 2px #0c2247,0 0 0 5px #77deed,0 0 40px #238dff88}#stage.free .controls{padding-top:15cqw}.wild-tower{background:radial-gradient(ellipse,color-mix(in srgb,var(--accent),#000 55%),#071321);border-color:var(--gold)}.wild-tower b{color:var(--gold)}.wild-tower small{font-size:.55cqw}#bigWin{background:radial-gradient(ellipse,#092538ed,#020817db)}#bigWin strong{font-size:5.7cqw}#bigWin span{font-size:4cqw}.cell.winning{z-index:2}.cell.vanish .symbol{animation:burst .35s ease-in forwards}#panel{background:#06141cf5;border-color:var(--gold);backdrop-filter:none}#panel h2{color:var(--gold)}#panel button[data-bet],#panel button[data-auto]{background:#15353b}.legal{color:#eee8df}.meter span{color:#ffe5a4}.rays{opacity:.13}footer{background:linear-gradient(transparent,#02070a90)}@keyframes scatterShine{50%{transform:rotateY(18deg) scale(1.04);filter:drop-shadow(0 0 16px #f8dc7b) brightness(1.14)}}@keyframes burst{to{transform:scale(1.4);opacity:0}}
/* Tablet-only adaptation; accepted CeldiceRoll CSS remains untouched. */
@media(min-width:651px) and (max-width:1200px) and (orientation:portrait){body{align-items:center}#stage{aspect-ratio:auto;min-height:100dvh;display:flex;flex-direction:column;padding-top:5dvh}header{height:13dvh;padding:0 3%}.brand{min-width:60%}.brand small{font-size:2cqw}.brand h1{font-size:9.8cqw}.rule-pill{padding:1cqw 2cqw}.rule-pill b{font-size:3cqw}.rule-pill span{display:none}#playfield{height:auto;display:grid;grid-template-columns:1fr;gap:0;padding:0 2%}.line-badge{display:none}#cabinet{width:100%;height:auto;aspect-ratio:1.5;border-width:2px}#reels{gap:2px;padding:2px}.controls{width:100%;height:21cqw;flex-direction:row;gap:4cqw;order:2;margin-top:10cqw}.small{width:12cqw;height:12cqw;font-size:7cqw}.small small{font-size:1.5cqw}.spin{width:20cqw;height:20cqw;order:1}.spin svg{width:16cqw}.spin span{font-size:4cqw}#speed{order:2;width:10cqw;font-size:5cqw}#betMenu{order:3}#auto{order:0}#message{position:absolute;top:calc(18dvh + 64cqw);left:0;right:0;font-size:3.6cqw;height:8cqw}.wild-tower b{font-size:6cqw}.wild-tower small{font-size:1.2cqw}footer{height:auto;min-height:25cqw;flex-wrap:wrap;gap:4cqw;padding:5cqw 2cqw 1cqw}.meter{min-width:30%;order:0}.meter span{font-size:2.4cqw}.meter strong{font-size:5.6cqw}.meter small{font-size:2cqw}#stakes{order:2;width:100%;justify-content:center;gap:1.5cqw}#stakes button{font-size:4cqw;min-width:15cqw;padding:1cqw}#stakes button small{font-size:1.5cqw}#stakes button em{font-size:1.7cqw}.tools{order:0;gap:1cqw}.tools button,#fullscreen{width:7cqw;height:7cqw;font-size:4cqw}#fullscreen{display:none}.legal{margin-top:auto;padding:5cqw 3cqw 2cqw;font-size:1.8cqw;min-height:5cqw}#panel{width:94%;right:3%;top:15%;bottom:8%;padding:7%}#bigWin span{font-size:9cqw}#bigWin strong{font-size:12cqw}#bigWin small{font-size:2cqw}}

@media(max-width:1200px) and (orientation:portrait){#stage{padding-top:2dvh}header{height:13dvh}.brand h1{font-size:8cqw}.brand small{font-size:1.7cqw}#stage[data-family=cascade] #cabinet{width:100%;aspect-ratio:1.23}#stage[data-family=cascade] .controls{width:100%}#cabinet{border-radius:12px}#message{position:static;height:auto;min-height:7cqw;order:3;font-size:3.4cqw;padding:1cqw 3cqw;text-align:center}#playfield{display:flex;flex-direction:column;position:relative}.controls{height:22cqw;margin-top:3cqw;padding-top:0!important;gap:5cqw}#featureHUD{position:static;width:100%;display:flex;align-items:center;justify-content:center;gap:3cqw;padding:1cqw;order:2;background:#04365388}#featureHUD span{font-size:1.9cqw;max-width:17%}#remaining{font-size:6cqw}#featureWin{font-size:3.3cqw}#multiplier{font-size:5cqw}footer{order:4;padding-top:2cqw}.legal{order:5;font-size:1.6cqw;padding-top:3cqw}#environment{opacity:.8}#environment>img{object-position:80% center}.scatter:after{font-size:2cqw}#bigWin span{font-size:7cqw}#bigWin strong{font-size:10cqw}#lobby{font-size:10px;padding:4px 8px}.wild-tower small{font-size:1.3cqw}}
/* Win light belongs to the retained game scene, not a separate flat card. */
/* jp100 fire: animated flame tongues along the bottom and the sides of the stage (hot-fruit family), under the cabinet */
.jpfire{position:absolute;inset:0;z-index:-1;pointer-events:none;overflow:hidden;mix-blend-mode:screen}.jpfire i{position:absolute;bottom:-4%;width:11%;height:44%;border-radius:50% 50% 30% 30%/60% 60% 20% 20%;background:radial-gradient(ellipse 55% 70% at 50% 100%,#fff6c0 0%,#ffd040 18%,#ff7a00 40%,#ff2a00bb 62%,#60100055 78%,transparent 88%);filter:blur(7px);opacity:.9;transform-origin:50% 100%;animation:jpflame 1.4s ease-in-out infinite alternate}.jpfire i:nth-child(1){left:-3%;height:52%;animation-delay:-.3s}.jpfire i:nth-child(2){left:6%;height:38%;animation-delay:-.9s;animation-duration:1.7s}.jpfire i:nth-child(3){left:14%;height:30%;opacity:.7;animation-delay:-1.2s;animation-duration:1.2s}.jpfire i:nth-child(4){right:14%;height:30%;opacity:.7;animation-delay:-.6s;animation-duration:1.3s}.jpfire i:nth-child(5){right:6%;height:38%;animation-delay:-1.5s;animation-duration:1.6s}.jpfire i:nth-child(6){right:-3%;height:52%;animation-delay:-.1s}@keyframes jpflame{0%{transform:scaleY(.85) scaleX(1.05) translateY(2%) skewX(-3deg)}30%{transform:scaleY(1.1) scaleX(.9) translateY(-2%) skewX(2deg)}60%{transform:scaleY(.95) scaleX(1) translateY(0) skewX(-1deg)}100%{transform:scaleY(1.18) scaleX(.88) translateY(-4%) skewX(3deg)}}@media(orientation:portrait){.jpfire i{width:22%;height:22%}.jpfire i:nth-child(1),.jpfire i:nth-child(6){height:28%}.jpfire i:nth-child(3),.jpfire i:nth-child(4){display:none}}#stage[data-fire] #cabinet{box-shadow:0 0 0 2px #17141c,0 0 0 5px color-mix(in srgb,var(--gold),transparent 45%),0 0 60px #ff6a0066,0 10px 30px #0009}
/* jp100: per-theme reel/cabinet colours and 3x3 / 4x4 cabinets */
#stage{--reel:#080e18;--cab:#080e18}#stage[data-grid] .reel{background:var(--reel)}#stage[data-grid] #cabinet{background:var(--cab)}body #stage[data-grid="3x3"] #cabinet,body #stage[data-grid="4x4"] #cabinet{width:51%!important}#stage[data-grid="3x3"] #playfield,#stage[data-grid="4x4"] #playfield{justify-content:center}#stage[data-grid] .cell.scatter:after{content:none}#stage .meter{display:grid!important;grid-template-columns:auto auto;justify-content:center;align-items:baseline;column-gap:.3em}#stage .meter>span{grid-column:1/-1;text-align:center}#stage .meter>small{font-size:clamp(15px,1.55cqw,22px)!important;font-weight:700;color:var(--gold);line-height:1;opacity:.95}#stage .bet-current small{font-size:clamp(14px,1.25cqw,18px)!important;font-weight:700;color:var(--gold);vertical-align:baseline;margin-left:1px}/* owner: '₺ simgesi aşırı ufak, yeri ve boyutu hatalı' -> inline after the amount, sized with it */#stage #speed{display:none!important}#stage .jpspin{display:flex;flex-direction:column;align-items:center;gap:6px}#stage .jpspin #spin{order:0}#stage .jpspin .jppill{order:1}#stage #spin{position:relative}#stage #spin>svg:not(.jparc){width:46%!important;height:auto;margin:12% auto 0;justify-self:center;align-self:center}#stage #spin .jparc{position:absolute;inset:0;width:100%!important;height:100%!important;margin:0;pointer-events:none;overflow:visible}#stage .jparc text{font:700 9px Arial,Helvetica,sans-serif;fill:#fff;letter-spacing:.3px;dominant-baseline:central}#stage #spin.jphold{box-shadow:0 0 0 3px var(--gold),0 0 26px var(--gold)}#stage .jppill{display:flex;border-radius:20px;overflow:hidden;border:1.5px solid color-mix(in srgb,var(--gold),transparent 25%);background:#00000059;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);box-shadow:0 2px 8px #0006}#stage .jppill button{all:unset;box-sizing:border-box;cursor:pointer;display:flex;align-items:center;justify-content:center;height:clamp(24px,2.3cqw,34px);padding:0 clamp(9px,1cqw,15px);color:#fff;touch-action:manipulation}#stage .jpspd{gap:1px;border-right:1.5px solid color-mix(in srgb,var(--gold),transparent 25%)!important}#stage .jpspd i{display:flex;opacity:.3}#stage .jpspd i svg{width:clamp(8.5px,.75cqw,11px);height:auto;fill:#fff;filter:drop-shadow(0 1px 1px #0008)}#stage .jpspd i.on{opacity:1}#stage .jpq svg{width:clamp(14px,1.35cqw,20px);height:auto;fill:#fff;opacity:.35}#stage .jpq.on svg{opacity:1;fill:var(--gold)}#stage #message{width:max-content;max-width:96%;height:auto;min-height:0;margin:5px auto;padding:3px 20px;border-radius:30px;background:#0000008c;border:1px solid color-mix(in srgb,var(--gold),transparent 55%);letter-spacing:.11em;line-height:1.25;white-space:nowrap;font-size:clamp(12px,1.08cqw,16px);color:#fff4d0;text-shadow:0 1px 2px #000}/* owner: 'bahislerinizi koyun yazısı çok sıkışmış' (web + phone) */#stage[data-grid] #environment{opacity:.96}#stage[data-grid]::before{background:linear-gradient(#00000026,transparent 28%,#0000008c)}
@media(max-width:1200px) and (orientation:portrait){body #stage[data-grid="3x3"] #cabinet,body #stage[data-grid="4x4"] #cabinet{width:100%!important;aspect-ratio:1;margin:0 auto}}
/* jpfam2: short landscape (phones) - compact pill */
@media(orientation:landscape) and (max-height:520px){#stage .jppill button{height:20px;padding:0 6px}#stage .jpspd i svg{width:7px}#stage .jpq svg{width:12px}#stage .jpspin{gap:4px}}
/* jpfam: family portrait, the controls row grows for the spin pill (all Celdice games) */
@media(max-width:1200px) and (orientation:portrait){#stage .controls{height:auto!important;align-items:center}#stage .controls .jpspin{order:1}#stage #message{font-size:3.25cqw;padding:2px 16px;margin:2px auto}}
/* jp100 phone portrait (owner: 'mobil hali facia'): the board, controls and message spread over the space between the header and the footer; the footer with the bet rail sits at the bottom instead of a dead band above the legal line */
@media(max-width:650px) and (orientation:portrait){#stage[data-grid] #playfield{flex:1 1 auto;display:flex;flex-direction:column;justify-content:space-evenly;padding:0 2%}#stage[data-grid] .controls{margin-top:0;height:auto;gap:6cqw;align-items:center}#stage[data-grid] .controls .jpspin{order:1}#stage[data-grid] .spin{width:27cqw;height:27cqw}#stage[data-grid] .small{width:15cqw;height:15cqw;font-size:8cqw}#stage[data-grid] #speed{width:13cqw;font-size:6cqw}#stage[data-grid] #message{order:3;font-size:3.25cqw;padding:2px 16px;margin:2px auto}#stage[data-grid] footer{margin-top:auto;padding-bottom:6px}#stage[data-grid] .legal{margin-top:0;padding-top:2cqw}#stage[data-grid="5x3"] #cabinet{width:100%;aspect-ratio:1.5}}
#bigWin{isolation:isolate;background:radial-gradient(ellipse,#351335d9,#10091fd9 65%,#10091f55);overflow:hidden;border-radius:inherit}
#bigWin:before{content:'';position:absolute;inset:-70%;z-index:-1;background:repeating-conic-gradient(from 0deg,transparent 0deg 16deg,color-mix(in srgb,var(--gold) 22%,transparent) 17deg 23deg,transparent 24deg 36deg);animation:award-rays 18s linear infinite}
#bigWin span{font-size:clamp(25px,4cqw,68px);color:var(--gold);text-shadow:0 3px #482048,0 0 28px var(--accent);animation:award-title .7s cubic-bezier(.16,.8,.3,1) both}
#bigWin strong{font-size:clamp(34px,6cqw,100px);text-shadow:0 4px #492441,0 0 35px var(--accent);font-variant-numeric:tabular-nums}
#stage.free #environment:after{opacity:.65;animation-duration:3.5s}
@keyframes award-rays{to{transform:rotate(360deg)}}
@keyframes award-title{from{transform:scale(.5);opacity:0}to{transform:scale(1);opacity:1}}
@media(prefers-reduced-motion:reduce){#bigWin:before,#bigWin span{animation:none}}
