/* Yapboz */
body.oyunSayfa{background:#101a2c}
.oAlan{overflow:hidden}
.ybKap{position:absolute;inset:0;display:flex;flex-direction:column}
.ybUst{flex:0 0 auto;display:flex;align-items:center;gap:8px;padding:6px 10px;background:linear-gradient(180deg,#1b2a47,#142036);border-bottom:1px solid #ffffff14;z-index:3}
.ybMenuBtn{display:inline-flex;align-items:center;gap:6px;font:800 15px 'Baloo 2',Nunito,sans-serif;color:#2a1a00;background:linear-gradient(180deg,#ffd166,#ffb703);border:0;border-radius:12px;padding:6px 12px;cursor:pointer;box-shadow:0 3px 0 #0006;white-space:nowrap}
.ybMenuBtn:active{transform:translateY(2px);box-shadow:0 1px 0 #0006}
.ybBilgi{display:flex;gap:6px;align-items:center}
.ybB{display:inline-flex;align-items:center;gap:4px;background:#ffffff10;border:1px solid #ffffff18;border-radius:10px;padding:3px 9px;font-size:13px;white-space:nowrap}
.ybB b{font:800 16px 'Baloo 2',Nunito,sans-serif;color:#fff;min-width:28px;text-align:center}
.ybAraclar{display:flex;gap:6px;margin-left:auto}
.ybArac{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:0;min-width:54px;height:46px;padding:2px 6px;background:#24365c;border:2px solid #36508a;border-radius:12px;color:#fff;font-size:19px;line-height:1.1;cursor:pointer;font-family:inherit}
.ybArac small{font:800 10.5px Nunito,sans-serif;color:#cfe0ff;white-space:nowrap}
.ybArac.aktif{background:#3a5a2a;border-color:#7fd36a}
.ybArac:active{transform:translateY(2px)}
.ybArac:disabled{opacity:.4;cursor:not-allowed}
.ybArac i{position:absolute;top:-6px;right:-5px;background:#ffd166;color:#3a2600;font:800 11px Nunito,sans-serif;border-radius:9px;padding:0 6px;line-height:17px;font-style:normal}
.ybArac i.reklam{background:linear-gradient(180deg,#9b85ff,#6a46e0);color:#fff}
.ybSahne{position:relative;flex:1;min-height:0;overflow:hidden;
  background:radial-gradient(ellipse at 50% 40%,#2c5a4c 0%,#1d4038 55%,#132a26 100%)}
.ybSahne::before{content:'';position:absolute;inset:0;pointer-events:none;opacity:.35;
  background-image:repeating-linear-gradient(45deg,#ffffff06 0 2px,transparent 2px 6px),repeating-linear-gradient(-45deg,#00000010 0 2px,transparent 2px 7px)}
.ybTuval{position:absolute;left:0;top:0;touch-action:none;display:block}
.ybZoom{position:absolute;right:10px;bottom:10px;display:flex;flex-direction:column;gap:6px;z-index:2}
.ybZoom button{width:40px;height:40px;border-radius:12px;border:2px solid #ffffff30;background:#0d1a2bcc;color:#fff;font:800 22px Nunito,sans-serif;cursor:pointer;line-height:1}
.ybOnizleme{position:absolute;left:10px;top:10px;z-index:4;background:#0d1a2b;border:3px solid #ffd166;border-radius:12px;padding:4px;box-shadow:0 10px 30px #000a;cursor:pointer;animation:ybBelir .2s}
.ybOnizleme canvas{display:block;width:min(46vw,360px);height:auto;border-radius:8px}
@keyframes ybBelir{from{opacity:0;transform:scale(.9)}to{opacity:1;transform:none}}
.ybYuk{position:absolute;inset:0;z-index:5;display:flex;align-items:center;justify-content:center;background:#0b1424cc}
.ybYukKutu{width:min(80%,320px);text-align:center;color:#dfe8ff;font-weight:800}
.ybYukCubuk{height:14px;border-radius:8px;background:#ffffff18;overflow:hidden;margin-bottom:10px;border:1px solid #ffffff22}
.ybYukCubuk i{display:block;height:100%;width:0;background:linear-gradient(90deg,#ffd166,#ff8a3d);transition:width .15s}
.ybIpucuYazi{position:absolute;left:50%;top:12px;transform:translateX(-50%);z-index:3;background:#000a;color:#fff;font-weight:800;font-size:14px;border-radius:20px;padding:6px 14px;pointer-events:none;white-space:nowrap}

/* galeri menüsü */
.ybMenu{position:absolute;inset:0;z-index:6;overflow-y:auto;overflow-x:hidden;background:radial-gradient(ellipse at 50% 0%,#24406a 0%,#14223a 60%,#0d1626 100%);-webkit-overflow-scrolling:touch}
.ybMenuIc{max-width:1100px;margin:0 auto;padding:14px 14px 40px}
.ybMenuBas{text-align:center;margin-bottom:10px}
.ybMenuBas h2{font-size:30px;color:#ffd166;margin:0}
.ybMenuBas p{margin:2px 0 0;color:#b9c6e6}
.ybKartlar{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:10px;margin-bottom:14px}
.ybKart{display:flex;gap:12px;align-items:center;background:#ffffff0d;border:2px solid #ffffff1c;border-radius:16px;padding:10px;cursor:pointer;color:#fff;text-align:left;min-height:96px;position:relative}
.ybKart:hover{border-color:#ffd16688}
.ybKart img,.ybKart canvas{width:112px;height:84px;object-fit:cover;border-radius:10px;flex:0 0 auto;box-shadow:0 4px 12px #0007}
.ybKart b{font:800 18px 'Baloo 2',Nunito,sans-serif;display:block;line-height:1.15}
.ybKart small{display:block;color:#b9c6e6;font-size:13px;line-height:1.35}
.ybKart .ybEtiket{position:absolute;top:-9px;left:12px;background:#ffd166;color:#3a2600;font:800 11px Nunito,sans-serif;border-radius:8px;padding:1px 8px}
.ybDevamKart{border-color:#7fd36a99;background:#2a4a2a55}
.ybGununKart{border-color:#ffd16699;background:linear-gradient(135deg,#4a3a1255,#2a1a4a55)}
.ybGununKart .ybSag{flex:1;min-width:0}
.ybGununKart .ybDugmeler{display:flex;gap:6px;margin-top:6px;flex-wrap:wrap}
.ybKendiKart{border-style:dashed;border-color:#7fb8ff88}
.ybKendiIkon{width:112px;height:84px;border-radius:10px;background:linear-gradient(135deg,#3a6ab0,#7a4ab0);display:flex;align-items:center;justify-content:center;font-size:40px;flex:0 0 auto}
.ybYer{color:#b9c6e6;padding:10px}
.ybCubukK{height:6px;border-radius:4px;background:#ffffff18;margin-top:6px;overflow:hidden}
.ybCubukK i{display:block;height:100%;background:#7fd36a}
.ybSekmeler{display:flex;gap:6px;overflow-x:auto;padding:4px 2px 10px;scrollbar-width:none}
.ybSekmeler::-webkit-scrollbar{display:none}
.ybSekmeler button{flex:0 0 auto;border:2px solid #36508a;background:#1c2c4c;color:#dbe6ff;font:800 14px Nunito,sans-serif;padding:6px 12px;border-radius:20px;cursor:pointer;white-space:nowrap}
.ybSekmeler button.aktif{background:#ffd166;border-color:#ffd166;color:#2a1a00}
.ybGaleri{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:10px}
.ybResim{position:relative;border-radius:12px;overflow:hidden;cursor:pointer;background:#0b1424;border:2px solid #ffffff14;aspect-ratio:4/3;padding:0}
.ybResim img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .2s}
.ybResim:hover img{transform:scale(1.05)}
.ybResim span{position:absolute;left:0;right:0;bottom:0;padding:14px 8px 5px;background:linear-gradient(transparent,#000c);color:#fff;font:800 12.5px Nunito,sans-serif;text-align:left;line-height:1.2}
.ybResim em{position:absolute;top:6px;right:6px;background:#7fd36a;color:#10300a;font:800 11px Nunito,sans-serif;border-radius:8px;padding:1px 6px;font-style:normal}

/* kurulum modalı */
.ybKurOn{width:100%;max-width:340px;aspect-ratio:4/3;object-fit:cover;border-radius:12px;display:block;margin:4px auto 10px;box-shadow:0 6px 20px #0008}
.ybParcalar{display:grid;grid-template-columns:repeat(4,1fr);gap:6px;margin:6px 0 10px}
.ybParcalar button{border:2px solid var(--cizgi);background:var(--panel2);color:#fff;font:800 16px 'Baloo 2',Nunito,sans-serif;padding:6px 0 4px;border-radius:10px;cursor:pointer;line-height:1.1}
.ybParcalar button small{display:block;font:700 10px Nunito,sans-serif;color:var(--soluk)}
.ybParcalar button.aktif{border-color:#ffd166;background:#4a3a12}
.ybAnahtar{display:flex;align-items:center;justify-content:space-between;gap:10px;background:#ffffff0c;border-radius:12px;padding:8px 12px;text-align:left;cursor:pointer;margin-bottom:6px}
.ybAnahtar small{display:block;color:var(--soluk);font-size:12px}
.ybAnahtar input{width:22px;height:22px;accent-color:#ffd166;flex:0 0 auto}
.ybSonucIst{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;margin:10px 0}
.ybSonucIst div{background:#ffffff0d;border-radius:12px;padding:6px 4px}
.ybSonucIst small{display:block;color:var(--soluk);font-size:12px}
.ybSonucIst b{font:800 20px 'Baloo 2',Nunito,sans-serif}
.ybSonucResim{width:100%;max-width:300px;border-radius:12px;box-shadow:0 6px 20px #0008}
.ybLiderSekme{display:flex;gap:6px;justify-content:center;margin:6px 0 8px}
.ybLiderSekme button{border:2px solid var(--cizgi);background:var(--panel2);color:#fff;font:800 13px Nunito,sans-serif;padding:6px 12px;border-radius:10px;cursor:pointer}
.ybLiderSekme button.aktif{border-color:#ffd166;background:#4a3a12}
table.lider tr.ben td{color:#ffd166;font-weight:800}

/* dar ekran (telefon dikey) */
@media (max-width:760px){
  .ybUst{flex-wrap:wrap;gap:6px;padding:5px 6px}
  .ybMenuBtn{font-size:14px;padding:5px 10px}
  .ybMenuBtn span{display:none}
  .ybBilgi{flex:1;justify-content:flex-end;gap:4px}
  .ybB{padding:2px 6px;font-size:12px}
  .ybB b{font-size:15px;min-width:22px}
  .ybAraclar{width:100%;margin:0;justify-content:space-between;gap:4px}
  .ybArac{flex:1;min-width:0;height:42px;font-size:17px;padding:1px 2px;border-radius:10px}
  .ybArac small{font-size:9.5px}
  .ybZoom{right:6px;bottom:6px}
  .ybZoom button{width:36px;height:36px}
  .ybGaleri{grid-template-columns:repeat(2,1fr);gap:8px}
  .ybKart{min-height:84px;padding:8px;gap:10px}
  .ybKart img,.ybKart canvas,.ybKendiIkon{width:96px;height:72px}
  .ybMenuBas h2{font-size:24px}
  .ybMenuIc{padding:10px 10px 30px}
}