body.oyunSayfa{background:#134e4a}
.yMasa{--t:min(calc((100vw - 28px)/13),46px);height:100%;display:flex;flex-direction:column;align-items:center;padding:6px 6px 8px;gap:5px;background:radial-gradient(ellipse at 50% 35%,#1f7a6e,#145049 70%,#0d3a35)}
.ySatir{display:flex;align-items:center;justify-content:space-between;width:min(100%,900px);gap:6px;flex:0 0 auto}
.yRakipler{flex:1;display:flex;gap:5px;justify-content:center;min-width:0}
.yOyuncu{flex:1;max-width:170px;min-width:0;background:#0005;border:2px solid transparent;border-radius:12px;padding:3px 5px;text-align:center;font-weight:800;line-height:1.25}
.yOyuncu .ad{font-size:13px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.yOyuncu .bilgi{font-size:11px;color:#cfe8e2;white-space:nowrap}
.yOyuncu .acti{display:inline-block;font-size:10px;background:#e9c46a;color:#3b2a00;border-radius:6px;padding:0 4px;margin-left:2px}
.yOyuncu .acti.cift{background:#f4a3c4;color:#4a0a24}
.yOyuncu.sirada{border-color:#ffd166;box-shadow:0 0 14px #ffd16688}
/* masa (açılan perler) */
.yAcik{flex:1;min-height:0;width:min(100%,900px);overflow-y:auto;overflow-x:hidden;background:#0003;border-radius:12px;padding:6px;display:grid;grid-template-columns:1fr;gap:5px;align-content:start;border:1px solid #ffffff14}
.yBolum{background:#ffffff0a;border-radius:9px;padding:4px 6px;min-width:0}
.yBolum .yBaslik{font-size:12px;font-weight:800;color:#d8f3ec;display:flex;justify-content:space-between;gap:6px}
.yBolum .yBaslik i{font-style:normal;color:#ffd166}
.yBolum.bos .yBaslik{opacity:.6}
.yPerler{display:flex;flex-wrap:wrap;gap:5px;margin-top:3px}
.yPer{--t:21px;display:flex;gap:1px;padding:3px;border-radius:7px;background:#00000030;border:2px solid transparent;cursor:pointer;position:relative}
.yPer .okTas{cursor:pointer;box-shadow:0 1px 0 #b8a97c}
.yPer.uygun{border-color:#6fe39a;background:#6fe39a22}
.yPer.ustunde{border-color:#ffd166;background:#ffd16644}
.yPer.yeni{animation:yParla 1.2s ease-out}
@keyframes yParla{0%{background:#ffd16699}100%{background:#00000030}}
.yBos{font-size:11px;color:#cfe8e2aa;padding:2px 0}
/* alt satır */
.yOrta{display:flex;gap:8px;align-items:center;flex:0 0 auto}
.okKose{width:calc(var(--t)*1.25);height:calc(var(--t)*1.75);border:2px dashed #ffffff40;border-radius:8px;display:grid;place-items:center;position:relative;flex:0 0 auto}
.okKose.al.aktif{border-color:#ffd166;border-style:solid;cursor:pointer;box-shadow:0 0 12px #ffd16699}
.okKose.at span{color:#ffffff66;font-weight:800;font-size:13px}
.okKose.at.aktif{border-color:#ff8f6b;border-style:solid;background:#ff8f6b22;cursor:pointer}
.okKose.at.ustunde{background:#ff8f6b55}
.okKose .sayi{position:absolute;bottom:-15px;font-size:11px;color:#cfe8e2;font-weight:700}
.okKose .okTas{cursor:default}
.okDeste{position:relative;width:calc(var(--t)*1.1);height:calc(var(--t)*1.55);border-radius:7px;background:repeating-linear-gradient(45deg,#e9e1c8 0 4px,#ddd3b5 4px 8px);box-shadow:2px 2px 0 #c9bd98,4px 4px 0 #b3a67f,0 6px 12px #0007;display:grid;place-items:center}
.okDeste b{font:800 16px 'Baloo 2',Nunito;color:#5b4a1e}
.okDeste.aktif{cursor:pointer;outline:3px solid #ffd166;outline-offset:3px}
.okDeste.bitiyor b{color:#c0392b}
.okGosterge{text-align:center}
.okGosterge small{display:block;font-size:10px;color:#cfe8e2;font-weight:700;margin-bottom:1px}
.okGosterge .okTas{cursor:default}
.okKontrol{flex:1;display:flex;flex-direction:column;align-items:center;gap:4px;min-width:0}
.okDurum{font-weight:800;color:#ffe9a8;font-size:13px;text-align:center;min-height:19px;line-height:1.25}
.okButon{display:flex;gap:4px;flex-wrap:wrap;justify-content:center}
.okButon .btn{padding:5px 8px;font-size:13px}
#acBtn:not(:disabled){background:#e76f51;box-shadow:0 0 10px #e76f5199}
/* taşlar */
.okTas{width:var(--t);height:calc(var(--t)*1.42);border-radius:calc(var(--t)*.12);background:linear-gradient(180deg,#fffdf4,#efe6cc);box-shadow:0 2px 0 #b8a97c,0 3px 6px #0005;display:flex;flex-direction:column;align-items:center;justify-content:flex-start;padding-top:calc(var(--t)*.1);font:800 calc(var(--t)*.6)/1 'Baloo 2',Nunito,sans-serif;position:relative;user-select:none;touch-action:none;cursor:grab;flex:0 0 auto}
.okTas::after{content:'';width:calc(var(--t)*.22);height:calc(var(--t)*.2);border-radius:50%;background:currentColor;margin-top:calc(var(--t)*.14);opacity:.85}
.okTas.r0{color:#d99a00}.okTas.r1{color:#1c63c9}.okTas.r2{color:#1e1e1e}.okTas.r3{color:#d32424}
.okTas.sahte{color:#1f7a45;font-size:calc(var(--t)*.7)}
.okTas.sahte::after{display:none}
.okTas.joker{background:linear-gradient(180deg,#fff6cf,#f2d77c)}
.okTas.okey::before{content:'★';position:absolute;top:1px;right:2px;font-size:calc(var(--t)*.28);color:#e0a400;line-height:1}
.okTas.secili{transform:translateY(-6px);box-shadow:0 0 0 3px #ffd166,0 8px 12px #0007}
.okTas.yeni{box-shadow:0 0 0 3px #6fe39a,0 3px 6px #0005}
.okTas.surukle{position:fixed;z-index:60;pointer-events:none;transform:scale(1.1);opacity:.95}
.okTas.hayalet{opacity:.25}
/* ıstaka */
.istaka{flex:0 0 auto;display:grid;grid-template-columns:repeat(13,var(--t));grid-auto-rows:calc(var(--t)*1.42 + 6px);gap:2px 1px;padding:8px 6px 6px;background:linear-gradient(180deg,#8a5a2b,#6b4220);border-radius:10px;box-shadow:inset 0 -6px 0 #4f2f14,0 8px 18px #0008}
.slot{width:var(--t);height:calc(var(--t)*1.42);border-radius:5px;display:flex;align-items:flex-end}
.slot.bos{background:#00000018}
.slot.hedef{background:#ffd16655}
/* modallar */
.yOneri{max-height:min(46vh,340px);overflow-y:auto;display:flex;flex-direction:column;gap:5px;margin:6px 0;padding:2px}
.yOneri .satirPer{display:flex;align-items:center;justify-content:space-between;gap:8px;background:#ffffff0d;border-radius:8px;padding:4px 8px}
.yOneri .satirPer b{color:#ffd166;font-size:14px}
.miniGrup{display:flex;gap:1px;flex-wrap:wrap}
.miniGrup .okTas{--t:22px;cursor:default}
.yOzet{font-weight:800;text-align:center;margin:6px 0}
.yOzet.iyi{color:#7ee2a8}.yOzet.kotu{color:#ff9a7a}
.yTablo td,.yTablo th{font-size:13px;padding:4px 3px}
.yTablo .ben{color:#ffd166}
.yTablo tfoot td{font-weight:800;border-top:2px solid #ffffff33}
.yKalan{display:flex;gap:1px;flex-wrap:wrap;margin-top:2px}
.yKalan .okTas{--t:16px;height:22px;padding:0;justify-content:center;font-size:11px;line-height:1;cursor:default;box-shadow:none}
.yKalan .okTas::after{display:none}
.yNot{font-size:11px;color:#ffb199}
@media (min-width:700px){
  .yMasa{--t:min(calc((100vw - 28px)/13),46px,calc((100dvh - 150px)/10.5))}
  .yAcik{grid-template-columns:1fr 1fr}
  .yPer{--t:24px}
  .yOyuncu .ad{font-size:14px}
}

/* okey taşı belirgin: altın çerçeve + OKEY yazısı (yanlışlıkla atılmasın) */
.okTas.okey{background:linear-gradient(180deg,#fff7d1,#ffe38f);box-shadow:0 0 0 2px #e0a400,0 2px 0 #b8902a,0 3px 8px #e0a40088}
.okTas.okey::after{content:'OKEY';width:auto;height:auto;border-radius:0;background:none;color:#a86f00;font:800 calc(var(--t)*.2)/1 Nunito,sans-serif;letter-spacing:.5px;opacity:1;margin-top:calc(var(--t)*.1)}

/* English */
html[lang=en] .okTas.okey::after{content:'JOKER'}
html[lang=en] .okKose.at span{font-size:11px;letter-spacing:0}
