body.oyunSayfa{background:#0b1630}
.oAlan:has(>.kfKap){overflow:hidden}
html,body{overscroll-behavior:none}
.kfKap{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;background:radial-gradient(ellipse at 50% 35%,#1d3566,#070d1f 75%);touch-action:none;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none;-webkit-tap-highlight-color:transparent;overscroll-behavior:none;overflow:hidden}
.kfKap.dikey{align-items:flex-start}
.kfSaha{position:relative;line-height:0;flex:none}
#kfCanvas{display:block;touch-action:none;border-radius:8px;box-shadow:0 10px 40px #0009}
.kfKap.dikey #kfCanvas{border-radius:0}
.kfDur{position:absolute;top:8px;right:8px;width:40px;height:40px;border-radius:12px;border:2px solid #ffffff44;background:#0008;color:#fff;font-size:17px;line-height:1;cursor:pointer;z-index:2}
.kfDur:active{transform:scale(.94)}
/* dokunmatik düğmeler */
.kfDugmeler{position:absolute;left:0;right:0;bottom:0;display:none;justify-content:space-between;align-items:flex-end;padding:0 12px calc(12px + env(safe-area-inset-bottom));pointer-events:none;z-index:3}
.kfKap.dokun .kfDugmeler{display:flex}
.kfGrup{display:flex;gap:12px;pointer-events:auto}
.kfDugmeler button{width:76px;height:76px;border-radius:50%;border:3px solid #ffffff66;background:#0b163099;color:#fff;font:800 28px/1 Nunito,sans-serif;cursor:pointer;touch-action:none;-webkit-tap-highlight-color:transparent;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;padding:0;backdrop-filter:blur(2px)}
.kfDugmeler button small{font-size:11px;letter-spacing:.5px}
.kfDugmeler button span{font-size:24px;line-height:1}
.kfDugmeler button.bas{background:#ffffff55;transform:scale(.93)}
.kfDugmeler .kfZipla{border-color:#5ad1ff}
.kfDugmeler .kfSut{border-color:#ffb02e}
.kfIpucu{display:none}
/* dikey telefon: saha üstte, düğmeler altta kendi panelinde */
.kfKap.dikey .kfDugmeler{flex-wrap:wrap;align-content:space-between;background:linear-gradient(#123a22,#0b2416 40%,#081a10);border-top:3px solid #ffffff22;padding-bottom:calc(22px + env(safe-area-inset-bottom))}
.kfKap.dikey .kfIpucu{display:block;flex:1 1 100%;text-align:center;color:#cfe8d6;font:700 13px/1.4 Nunito,sans-serif;padding:12px 8px 0;opacity:.8}
.kfKap.dikey .kfDugmeler button{width:88px;height:88px}
.kfKap.dikey .kfSut{transform:translateY(-22px)}
.kfKap.dikey .kfSut.bas{transform:translateY(-22px) scale(.93)}
@media (max-height:430px){.kfDugmeler button{width:62px;height:62px;font-size:22px}.kfDugmeler button span{font-size:19px}.kfDugmeler button small{font-size:9px}.kfGrup{gap:8px}.kfDugmeler{padding:0 8px 8px}}
/* kurulum */
.kfBaslik{font-weight:800;font-size:12px;color:#ffd23f;letter-spacing:1px;margin:8px 0 4px;text-align:center}
.kfKarlar{display:grid;grid-template-columns:repeat(3,1fr);gap:7px;margin:4px 0 6px}
.kfKarlar button{border:2px solid var(--cizgi,#2e3a6b);background:#16204a;color:#fff;border-radius:12px;padding:6px 2px 6px;font:800 14px Nunito,sans-serif;cursor:pointer;display:flex;flex-direction:column;align-items:center;line-height:1.15}
.kfKarlar button canvas{width:62px;height:62px;display:block;margin-bottom:2px}
.kfKarlar button small{font-weight:600;font-size:11px;color:#aab3d6}
.kfKarlar button.aktif{border-color:#ffd23f;background:#3a3214;box-shadow:0 0 0 2px #ffd23f55}
.kfNot{text-align:center;font-size:13px;color:#aab3d6;margin:4px 0 8px}
.kfSonSkor{display:flex;align-items:center;justify-content:center;gap:12px;margin:6px 0 12px;font-weight:800}
.kfSonSkor b{font:800 40px/1 'Baloo 2',Nunito,sans-serif;color:#ffd23f;min-width:96px;text-align:center}
.kfSonSkor div{display:flex;align-items:center;gap:6px;min-width:70px}
.kfSonSkor div:first-child{justify-content:flex-end}
.kfRozet{width:14px;height:14px;border-radius:50%;display:inline-block;border:2px solid #fff8}
/* online */
.oAlan>.onMasa{flex:1;min-width:0;width:100%}
.onOyun>.kfKap{position:absolute;inset:0}
.kfBag{position:absolute;top:8px;left:8px;z-index:2;display:flex;align-items:center;gap:5px;background:#0b1630d9;border:2px solid #ffffff33;border-radius:999px;padding:3px 10px;font:800 12px/1.3 Nunito,sans-serif;color:#fff;pointer-events:none;white-space:nowrap}
.kfBag.p2p{border-color:#22c55e99}
.kfBag.role{border-color:#f59e0b99}
.kfBag i{font-style:normal;color:#cfd8ff;font-weight:700}
.kfBag i.kotu{color:#ff8a8a}
.kfBag.gizli{display:none}
.kfOnSonuc{display:flex;align-items:center;justify-content:center;gap:10px;font-weight:800;margin:4px 0}
.kfOnSonuc b{font:800 30px/1 'Baloo 2',Nunito,sans-serif;color:#ffd23f}
@media (max-width:560px){.kfBag{font-size:11px;padding:2px 8px;top:6px;left:6px}.kfBag span{display:none}}
.kfPes{position:absolute;top:8px;right:8px;z-index:2;min-width:44px;height:40px;border-radius:12px;border:2px solid #ffffff44;background:#0b1630cc;color:#fff;font:800 16px/1 Nunito,sans-serif;cursor:pointer;display:flex;align-items:center;gap:4px;padding:0 9px}
.kfPes small{font-size:12px}
.kfPes:active{transform:scale(.94)}
.kfPes.gizli{display:none}
@media (max-width:560px){.kfPes{height:34px;top:6px;right:6px;padding:0 7px;font-size:14px}.kfPes small{display:none}}