/* MCGO — kasa sayfası: açılış alanı, makaralar, sonuçlar, içerik ve oranlar */

.phead--case{padding-bottom:22px}
.casehead{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:16px 40px}
.casehead h1{margin:14px 0 8px}
.casehead__meta{display:flex;gap:4px}
.casehead__meta > span{display:grid;gap:8px;min-width:110px;padding:12px 16px;background:#090c10;box-shadow:inset 0 0 0 1px var(--line)}
.casehead__meta small{font:400 10px/1 var(--f-pix);letter-spacing:.07em;text-transform:uppercase;color:var(--dim)}
.casehead__meta b{font:700 15px/1 var(--f-pix)}

/* ---------- açılış alanı ---------- */
.arena{position:relative;height:clamp(340px,44vw,480px);overflow:hidden;isolation:isolate;background:radial-gradient(50% 60% at 50% 55%,color-mix(in srgb,var(--glow) 14%,transparent),transparent 70%),linear-gradient(180deg,rgba(6,8,11,.9),rgba(12,16,22,.92));box-shadow:inset 0 0 0 1px var(--line-2),inset 0 -3px 0 color-mix(in srgb,var(--glow) 70%,transparent),0 30px 60px rgba(0,0,0,.4)}
.arena::before{content:"";position:absolute;inset:0;z-index:-1;opacity:.35;background-image:linear-gradient(rgba(255,255,255,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.035) 1px,transparent 1px);background-size:32px 32px;-webkit-mask:radial-gradient(60% 70% at 50% 50%,#000,transparent);mask:radial-gradient(60% 70% at 50% 50%,#000,transparent)}
.arena__glow{position:absolute;left:50%;top:54%;width:min(560px,80%);aspect-ratio:1;translate:-50% -50%;border-radius:50%;background:radial-gradient(closest-side,color-mix(in srgb,var(--glow) 34%,transparent),transparent);filter:blur(16px);animation:apulse 4s ease-in-out infinite;z-index:-1}
@keyframes apulse{50%{opacity:.65;scale:.94}}
.arena__case{position:absolute;inset:0;display:grid;place-items:center;transition:opacity .45s ease,transform .6s cubic-bezier(.3,1.4,.5,1)}
.arena__canvas{position:absolute;inset:4% 0 0;width:100%;height:96%;cursor:grab;touch-action:pan-y}
.arena__canvas:active{cursor:grabbing}
.arena__img{position:relative;width:min(300px,56%);filter:drop-shadow(0 30px 40px rgba(0,0,0,.7));animation:bob 5s ease-in-out infinite}
.arena.has-3d .arena__img{display:none}
.arena.is-open .arena__case{opacity:0;transform:scale(1.25);pointer-events:none}
.arena.is-open .arena__glow{opacity:.5}

/* parlama */
.arena__burst{position:absolute;inset:0;pointer-events:none;z-index:3;opacity:0}
.arena__burst.is-on{animation:burst .9s ease-out}
.arena__burst::before{content:"";position:absolute;left:50%;top:52%;width:120%;aspect-ratio:1;translate:-50% -50%;background:radial-gradient(closest-side,rgba(255,255,255,.9),color-mix(in srgb,var(--glow) 60%,transparent) 30%,transparent 70%)}
.arena__burst::after{content:"";position:absolute;left:50%;top:52%;width:140%;aspect-ratio:1;translate:-50% -50%;background:repeating-conic-gradient(from 0deg,color-mix(in srgb,var(--glow) 40%,transparent) 0 6deg,transparent 6deg 22deg);-webkit-mask:radial-gradient(closest-side,#000 10%,transparent 70%);mask:radial-gradient(closest-side,#000 10%,transparent 70%);animation:rays .9s ease-out}
@keyframes burst{0%{opacity:0;transform:scale(.4)}25%{opacity:1}100%{opacity:0;transform:scale(1.15)}}
@keyframes rays{to{rotate:40deg}}

/* makaralar */
.arena__reels{position:absolute;inset:0;z-index:2;display:flex;flex-direction:column;justify-content:center;gap:8px;padding:18px 0;animation:reelsin .45s cubic-bezier(.2,1.2,.4,1)}
@keyframes reelsin{from{opacity:0;transform:scale(.96)}}
.reel{--h:200px;--tw:178px;position:relative;height:var(--h);overflow:hidden;background:rgba(0,0,0,.38);box-shadow:inset 0 0 0 1px var(--line),inset 0 12px 30px rgba(0,0,0,.45);-webkit-mask:linear-gradient(90deg,transparent,#000 14%,#000 86%,transparent);mask:linear-gradient(90deg,transparent,#000 14%,#000 86%,transparent)}
.arena__reels[data-n="2"] .reel{--h:150px;--tw:150px}
.arena__reels[data-n="3"] .reel{--h:116px;--tw:132px}
.arena__reels[data-n="4"] .reel{--h:90px;--tw:112px}
.arena__reels[data-n="5"] .reel{--h:74px;--tw:96px}
.reel__track{display:flex;gap:6px;height:100%;padding:8px 0;will-change:transform}
.rt{--rc:#888;position:relative;flex:none;width:var(--tw);height:100%;display:grid;grid-template-rows:1fr auto;padding:6px 8px 8px;background:linear-gradient(180deg,rgba(255,255,255,.03),color-mix(in srgb,var(--rc) 22%,rgba(10,13,18,.9)));box-shadow:inset 0 0 0 1px rgba(255,255,255,.05),inset 0 -3px 0 var(--rc);transition:opacity .35s,filter .35s,transform .35s cubic-bezier(.2,1.4,.4,1)}
.rt img{width:100%;height:100%;min-height:0;object-fit:contain;filter:drop-shadow(0 8px 10px rgba(0,0,0,.55));-webkit-user-drag:none}
.rt__n{display:block;font-size:12px;font-weight:600;line-height:1.2;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rt__n small{display:block;font-size:11px;font-weight:400;color:var(--muted)}
.arena__reels[data-n="3"] .rt__n,.arena__reels[data-n="4"] .rt__n,.arena__reels[data-n="5"] .rt__n{display:none}
.arena__reels[data-n="3"] .rt,.arena__reels[data-n="4"] .rt,.arena__reels[data-n="5"] .rt{grid-template-rows:1fr;padding:4px 6px 6px}
.reel.is-done .rt{opacity:.28;filter:grayscale(.6)}
.reel.is-done .rt--win{opacity:1;filter:none;transform:scale(1.04);z-index:1;box-shadow:inset 0 0 0 2px var(--rc),inset 0 -3px 0 var(--rc),0 0 30px color-mix(in srgb,var(--rc) 55%,transparent)}
.reels__marker{position:absolute;left:50%;top:6px;bottom:6px;width:3px;translate:-50% 0;background:var(--gold);box-shadow:0 0 14px var(--gold),0 0 2px #000;z-index:3;pointer-events:none}
.reels__marker::before,.reels__marker::after{content:"";position:absolute;left:50%;translate:-50% 0;border:9px solid transparent}
.reels__marker::before{top:-6px;border-top-color:var(--gold)}
.reels__marker::after{bottom:-6px;border-bottom-color:var(--gold)}

/* VGC bekleme */
.arena__wait{position:absolute;inset:0;z-index:4;display:grid;place-content:center;justify-items:center;gap:10px;text-align:center;padding:20px;background:rgba(4,6,9,.78);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}
.arena__wait b{font:700 16px/1.2 var(--f-pix);text-transform:uppercase}
.arena__wait small{color:var(--muted);max-width:44ch}
.arena__spinner{width:44px;height:44px;border:4px solid rgba(243,195,55,.25);border-top-color:var(--gold);animation:spin .9s linear infinite}

/* sonuçlar */
.arena__results{position:absolute;inset:0;z-index:5;display:grid;place-items:center;overflow:auto;padding:18px;background:rgba(4,6,9,.84);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);animation:fade .3s ease-out}
.results{display:grid;justify-items:center;gap:18px;width:100%}
.results h2{outline:0;text-shadow:0 0 30px color-mix(in srgb,var(--rc) 60%,transparent),0 .09em 0 rgba(0,0,0,.5)}
.results__grid{display:grid;grid-template-columns:repeat(var(--cols,5),minmax(0,190px));justify-content:center;gap:12px;width:100%}
.results__grid[data-n="1"]{--cols:1}.results__grid[data-n="2"]{--cols:2}.results__grid[data-n="3"]{--cols:3}.results__grid[data-n="4"]{--cols:4}
.rcard{--rc:#888;position:relative;display:grid;justify-items:center;gap:4px;padding:14px 12px 14px;text-align:center;background:linear-gradient(180deg,color-mix(in srgb,var(--rc) 10%,rgba(255,255,255,.02)),color-mix(in srgb,var(--rc) 28%,rgba(10,13,18,.9)));box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--rc) 45%,transparent),inset 0 -3px 0 var(--rc),0 0 40px color-mix(in srgb,var(--rc) 25%,transparent);animation:flip .55s cubic-bezier(.2,1.3,.4,1) backwards;animation-delay:calc(var(--i) * 90ms)}
@keyframes flip{from{opacity:0;transform:perspective(600px) rotateY(70deg) translateY(16px)}}
.rcard__img{width:100%;aspect-ratio:4/3;display:grid;place-items:center}
.rcard__img img{width:100%;height:100%;object-fit:contain;filter:drop-shadow(0 10px 14px rgba(0,0,0,.6)) drop-shadow(0 0 16px color-mix(in srgb,var(--rc) 40%,transparent))}
.rcard small{color:var(--muted);font-size:12px}
.rcard b{font-weight:600;font-size:15px;line-height:1.25}
.rcard .pill{margin:4px 0 6px}
.results__actions{display:flex;flex-wrap:wrap;justify-content:center;gap:10px}
.results__grid[data-n="1"] .rcard{padding:20px 22px}
.results__grid[data-n="1"]{grid-template-columns:minmax(0,300px)}
@media (max-width:760px){
  .results__grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .results__grid[data-n="1"]{grid-template-columns:minmax(0,260px)}
  .arena{height:auto;min-height:360px}
  .arena.has-results{min-height:620px}
  .reel{--tw:140px}
  .arena__reels[data-n="2"] .reel{--tw:120px}
}

/* ---------- denetimler ---------- */
.controls{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:14px 18px;padding:18px 0 6px}
.controls__count{display:flex;gap:3px;padding:4px;background:#05070a;box-shadow:inset 0 0 0 1px #20252b}
.countbtn{min-width:52px;height:46px;border:0;border-bottom:3px solid #0c0f13;background:#181d24;color:#c4ccd4;font:700 14px/1 var(--f-pix);cursor:pointer;transition:background .12s}
.countbtn:hover:not(:disabled){background:#222831;color:#fff}
.countbtn[aria-checked="true"]{background:var(--grass-btn);border-bottom-color:var(--grass-edge);color:#fff}
.countbtn:disabled{opacity:.35;cursor:not-allowed}
.controls__open{min-width:250px}
.controls__price{padding:6px 8px 5px;margin-left:4px;background:rgba(0,0,0,.18);font-size:12px}
.btn--gold .controls__price{background:rgba(70,40,0,.18)}
.btn.is-short{background:#3a3424;border-bottom-color:#1f1b10;color:#e8d9a8}
.controls__opts{display:flex;gap:6px}
.controls__opts .chip .ico{width:15px;height:15px}
.controls__note{max-width:760px;margin:12px auto 0}
.controls__note .link{font-size:inherit}
@media (max-width:640px){.controls__open{width:100%;order:3}.controls__count{order:1}.controls__opts{order:2}}

/* ---------- oranlar ---------- */
.odds{display:grid;gap:6px;max-width:760px}
.odds__row{display:grid;grid-template-columns:190px 1fr 74px;align-items:center;gap:14px}
.odds__label{display:flex;align-items:center;gap:10px;font-size:14px;color:#d6dce2}
.odds__label i{width:10px;height:10px;background:var(--rc);box-shadow:0 0 10px var(--rc);flex:none}
.odds__bar{height:8px;background:rgba(255,255,255,.05)}
.odds__bar b{display:block;height:100%;background:var(--rc);box-shadow:0 0 10px color-mix(in srgb,var(--rc) 60%,transparent)}
.odds__p{text-align:right;font:400 12px/1 var(--f-pix);color:#dfe5ea}
@media (max-width:560px){.odds__row{grid-template-columns:130px 1fr 64px;gap:8px}}

/* ---------- son düşenler ---------- */
.recent{list-style:none;display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:8px}
.recent li{display:grid;grid-template-columns:80px 1fr;align-items:center;gap:10px;padding:8px 12px 8px 6px;background:linear-gradient(90deg,color-mix(in srgb,var(--rc) 14%,transparent),rgba(255,255,255,.02)),#0b0f14;box-shadow:inset 3px 0 0 var(--rc),inset 0 0 0 1px var(--line)}
.recent li.is-new{animation:pop .4s cubic-bezier(.2,1.3,.4,1)}
.recent img{width:80px;height:60px;object-fit:contain}
.recent span{min-width:0;font-size:14px;line-height:1.3}
.recent b{display:block;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.recent small{color:var(--muted)}
.recent__empty{grid-column:1/-1;color:var(--muted);box-shadow:none!important;background:none!important;display:block!important;padding:0!important}
