body.oyunSayfa{background:#14112b}
.oAlan:has(>.s2Kap){overflow:hidden}
html,body{overscroll-behavior:none}
.s2Kap{position:absolute;inset:0;display:flex;flex-direction:column;background:radial-gradient(ellipse at 50% 0%,#2c2560 0%,#17133a 55%,#0d0b22 100%);user-select:none;-webkit-user-select:none;-webkit-touch-callout:none;-webkit-tap-highlight-color:transparent;overflow:hidden}

/* üst bilgi çubuğu */
.s2Ust{flex:0 0 auto;display:flex;align-items:center;gap:8px;padding:7px 10px;max-width:1240px;width:100%;margin:0 auto}
.s2Btn{flex:0 0 auto;height:40px;min-width:42px;border-radius:12px;border:2px solid #ffffff2a;background:#ffffff12;color:#fff;font:800 20px/1 Nunito,sans-serif;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:4px;padding:0 9px;transition:transform .08s}
.s2Btn small{font-size:13px}
.s2Btn:hover{background:#ffffff22}
.s2Btn:active{transform:scale(.94)}
.s2Ipucu,.s2Atla{background:linear-gradient(180deg,#8064ff,#5131d6);border-color:#a993ff;position:relative}
.s2Ipucu::after,.s2Atla::after{content:'▶';position:absolute;top:-7px;right:-5px;background:#ffd23f;color:#3a2600;font-size:9px;border-radius:8px;padding:2px 5px;line-height:1.2}
.s2Atla{background:linear-gradient(180deg,#ff6fae,#c92f75);border-color:#ffa3cb;animation:s2Nabiz 1.4s ease-in-out infinite}
@keyframes s2Nabiz{50%{transform:scale(1.07)}}
.s2Baslik{flex:1;min-width:0;display:flex;align-items:baseline;gap:8px;color:#fff;white-space:nowrap;overflow:hidden}
.s2Baslik b{font:800 22px/1.1 'Baloo 2',Nunito,sans-serif;color:#ffd23f}
.s2Baslik span{font:800 16px Nunito,sans-serif;color:#d8d2ff;overflow:hidden;text-overflow:ellipsis}
.s2Olum{flex:0 0 auto;display:flex;align-items:center;gap:5px;background:#00000038;border:2px solid #ffffff1c;border-radius:12px;height:40px;padding:0 11px;color:#fff}
.s2Olum b{font:800 21px/1 'Baloo 2',Nunito,sans-serif;min-width:16px;text-align:center}
.s2Olum b.zipla{animation:s2Bump .35s ease-out}
.s2Olum small{font:800 12px Nunito,sans-serif;color:#b9b1e8}
.s2Kafa{font-size:18px}
@keyframes s2Bump{0%{transform:scale(1.7);color:#ff6b6b}100%{transform:none}}

/* sahne */
.s2Sahne{flex:1;min-height:0;display:flex;align-items:center;justify-content:center;position:relative}
#s2Canvas{display:block;border-radius:14px;box-shadow:0 14px 50px #000a,0 0 0 2px #ffffff14;touch-action:none}

/* dokunmatik düğmeler */
.s2Dugmeler{display:none;flex:0 0 auto;justify-content:space-between;align-items:center;gap:14px;padding:10px 14px calc(14px + env(safe-area-inset-bottom));touch-action:none}
.s2Kap.dokun .s2Dugmeler{display:flex}
.s2Yon{display:flex;gap:12px}
.s2Dug{width:92px;height:92px;border-radius:24px;border:3px solid #ffffff40;background:linear-gradient(180deg,#ffffff1c,#ffffff08);color:#fff;display:flex;flex-direction:column;align-items:center;justify-content:center;font:800 32px/1 Nunito,sans-serif;touch-action:none;box-shadow:0 5px 0 #00000055;transition:transform .05s,background .05s}
.s2Dug small{font-size:12px;letter-spacing:1px;margin-top:3px}
.s2Dug.bas{background:#ffffff40;transform:translateY(3px);box-shadow:0 2px 0 #00000055}
.s2Zip{width:112px;height:112px;border-radius:50%;border-color:#ffd23f99;background:radial-gradient(circle at 50% 35%,#ffcf4a55,#ff8a1f22)}
.s2Zip span{font-size:38px}
/* dikey telefon: oyun alanı üstte, düğmeler altta */
.s2Kap.dikey .s2Sahne{flex:0 0 auto}
.s2Kap.dikey #s2Canvas{border-radius:0;box-shadow:0 0 0 1px #ffffff14}
.s2Kap.dikey .s2Dugmeler{flex:1;align-items:center;background:linear-gradient(#1b1745,#110e2c);border-top:2px solid #ffffff1a;min-height:150px}
.s2Kap.dikey .s2Ust{padding:6px 8px;gap:6px}
/* yatay telefon: düğmeler oyun alanının üstünde yarı saydam */
.s2Kap.dokun.yatay .s2Dugmeler{position:absolute;left:0;right:0;bottom:0;pointer-events:none}
.s2Kap.dokun.yatay .s2Dug{pointer-events:auto;width:76px;height:76px;background:#0b0a2299;opacity:.85}
.s2Kap.dokun.yatay .s2Zip{width:92px;height:92px}
@media (max-width:520px){
  .s2Btn{height:36px;min-width:36px;padding:0 6px;font-size:18px;border-radius:10px}
  .s2Btn small{display:none}
  .s2Baslik{flex-direction:column;gap:0;align-items:flex-start}
  .s2Baslik b{font-size:18px}
  .s2Baslik span{font-size:12px;max-width:100%}
  .s2Olum{height:36px;padding:0 8px;gap:3px}
  .s2Olum b{font-size:18px}
  .s2Olum small{font-size:11px}
  .s2Kafa{font-size:15px}
}
@media (max-width:370px){.s2Dug{width:78px;height:78px}.s2Zip{width:96px;height:96px}.s2Olum small{display:none}}

/* menü ve bölüm haritası */
.s2Ozet{display:flex;justify-content:center;gap:8px;flex-wrap:wrap;margin:4px 0 10px}
.s2Ozet span{background:#ffffff10;border:1px solid #ffffff1f;border-radius:10px;padding:4px 10px;font-weight:800;font-size:14px}
.s2Dunyalar{display:grid;grid-template-columns:repeat(5,1fr);gap:5px;margin-bottom:10px}
.s2Dunyalar button{border:2px solid #3a3180;background:#211b52;color:#fff;border-radius:12px;padding:6px 2px 5px;cursor:pointer;font:800 11.5px/1.15 Nunito,sans-serif;display:flex;flex-direction:column;align-items:center;gap:2px}
.s2Dunyalar button i{font-style:normal;font-size:22px;line-height:1.1}
.s2Dunyalar button.aktif{border-color:#ffd23f;background:#3d2f12;box-shadow:0 0 0 2px #ffd23f44}
.s2Dunyalar button:disabled{opacity:.4;cursor:not-allowed}
.s2Harita{display:grid;grid-template-columns:repeat(4,1fr);gap:7px}
.s2Harita button{display:flex;flex-direction:column;align-items:center;gap:1px;border-radius:14px;border:2px solid #3a3180;background:#231c5c;color:#fff;padding:7px 0 5px;cursor:pointer;font-family:inherit;position:relative}
.s2Harita button b{font:800 20px/1.1 'Baloo 2',Nunito,sans-serif}
.s2Harita button i{font-style:normal;font-size:12px;color:#ffd23f;letter-spacing:-1px;line-height:1.2;min-height:15px}
.s2Harita button i u{text-decoration:none;color:#ffffff30}
.s2Harita button.gecti{background:#2b2470;border-color:#7d6bff}
.s2Harita button.atlandi{border-style:dashed}
.s2Harita button.siradaki{background:#6a2350;border-color:#ff6fae;box-shadow:0 0 12px #ff6fae66}
.s2Harita button.sinir::after{content:'😈';position:absolute;top:-6px;right:-4px;font-size:14px}
.s2Harita button:disabled{opacity:.35;cursor:not-allowed}
.s2Yildizlar{display:flex;justify-content:center;gap:6px;margin:2px 0 4px}
.s2Y{font-size:52px;line-height:1;color:#ffffff22;animation:s2Yildiz .5s cubic-bezier(.2,1.6,.4,1) both}
.s2Y.dolu{color:#ffd23f;text-shadow:0 0 18px #ffb300aa}
.s2Y:nth-child(2){font-size:64px;margin-top:-10px;animation-delay:.12s}
.s2Y:nth-child(3){animation-delay:.24s}
@keyframes s2Yildiz{from{transform:scale(0) rotate(-40deg);opacity:0}to{transform:none;opacity:1}}
.s2Sonuc{font-size:17px;margin:4px 0}
.s2Sonuc b{color:#ffd23f}
.s2Puan{display:inline-block;margin-top:6px;background:#ffd23f22;border:1px solid #ffd23f66;color:#ffe48a;border-radius:10px;padding:4px 12px;font-weight:800}
.s2Kural{font-size:13px;color:#b9b1e8;margin-top:6px}
.s2Ikon{font-size:50px;line-height:1;margin-bottom:4px}
