body.oyunSayfa{background:#0b0f22}
.oAlan{overflow:hidden}
.nbKap{position:absolute;inset:0;display:flex;flex-direction:row;justify-content:center;align-items:center;gap:26px;padding:12px 16px;
  background:radial-gradient(ellipse at 30% -10%,#1d2a5c 0%,#111737 45%,#0a0d1f 100%)}
.nbKap::before{content:'';position:absolute;inset:0;pointer-events:none;opacity:.5;
  background-image:radial-gradient(#ffffff14 1px,transparent 1.5px);background-size:22px 22px}
.nbPanel{position:relative;z-index:1;flex:0 0 236px;display:flex;flex-direction:column;gap:12px}
.nbUst{display:flex;gap:8px;align-items:stretch}
.nbBolum{flex:1;display:flex;align-items:center;gap:8px;font:800 18px 'Baloo 2',Nunito,sans-serif;color:#fff;cursor:pointer;
  background:linear-gradient(180deg,#2bd9b4,#169c86);border:0;border-radius:14px;padding:6px 12px;box-shadow:0 4px 0 #0007,0 0 18px #3df0c833;white-space:nowrap}
.nbBolum b{font-size:21px}
.nbBolum small{font:800 12px Nunito,sans-serif;background:#0003;border-radius:8px;padding:1px 7px;color:#e6fff9}
.nbBolum i{font-style:normal;font-size:13px;opacity:.85;margin-left:auto}
.nbBolum:active{transform:translateY(2px);box-shadow:0 2px 0 #0007}
.nbHarfBtn{flex:0 0 46px;font:800 16px 'Baloo 2',Nunito,sans-serif;color:#b9c3ec;background:#ffffff10;border:2px solid #ffffff22;border-radius:14px;cursor:pointer}
.nbHarfBtn.aktif{color:#0b0f22;background:#ffd23f;border-color:#ffd23f}
.nbIstat{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.nbIstat>div{display:flex;flex-direction:column;align-items:center;background:#ffffff0c;border:1px solid #ffffff1a;border-radius:14px;padding:6px 4px 4px}
.nbIstat small{color:#9fa9d6;font:800 11px Nunito,sans-serif;text-transform:uppercase;letter-spacing:.6px}
.nbIstat b{font:800 22px 'Baloo 2',Nunito,sans-serif;color:#fff;line-height:1.2}
#nbYildiz{color:#ffd23f;letter-spacing:1px;text-shadow:0 0 10px #ffd23f66}
#nbYildiz u{text-decoration:none;color:#ffffff26;text-shadow:none}
.nbAraclar{display:grid;grid-template-columns:repeat(2,1fr);gap:8px}
.nbAraclar button{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1px;font-size:22px;line-height:1.15;color:#fff;cursor:pointer;
  background:#1a2350;border:2px solid #34428a;border-radius:14px;padding:7px 2px 5px;font-family:inherit}
.nbAraclar button small{font:800 12px Nunito,sans-serif;color:#cdd5ff;white-space:nowrap}
.nbAraclar button.reklamli{background:linear-gradient(180deg,#7a5cff,#5233d6);border-color:#a993ff}
.nbAraclar button.reklamli::after{content:'▶';position:absolute;top:-7px;right:-5px;background:#ffd23f;color:#3a2600;font-size:9px;border-radius:8px;padding:1px 5px;line-height:1.4}
.nbAraclar button.ucretsiz::after{content:none}
.nbAraclar button i{position:absolute;top:-8px;left:-6px;background:#2bd9b4;color:#05211b;font:800 11px Nunito,sans-serif;font-style:normal;border-radius:9px;padding:1px 6px}
.nbAraclar button i:empty{display:none}
.nbAraclar button:disabled{opacity:.4;cursor:not-allowed}
.nbAraclar button:active:not(:disabled){transform:translateY(2px)}
.nbNot{margin:0 2px;color:#8f99c7;font-size:13px;line-height:1.5}
.nbSahne{position:relative;z-index:1;flex:0 1 auto;display:flex;align-items:center;justify-content:center;min-width:0;min-height:0;align-self:stretch}
#nbTahta{display:block;touch-action:none;cursor:pointer}
#nbEfekt{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;z-index:4}

/* dikey / telefon */
.nbKap.dikey{flex-direction:column;justify-content:flex-start;align-items:stretch;gap:8px;padding:8px 8px 10px}
.nbKap.dikey .nbPanel{display:contents}
.nbKap.dikey .nbUst{order:1}
.nbKap.dikey .nbIstat{order:2;grid-template-columns:repeat(4,1fr);gap:6px}
.nbKap.dikey .nbIstat>div{padding:3px 2px 2px;border-radius:11px}
.nbKap.dikey .nbIstat small{font-size:9.5px;letter-spacing:.3px}
.nbKap.dikey .nbIstat b{font-size:18px}
.nbKap.dikey .nbSahne{order:3;flex:1}
.nbKap.dikey .nbAraclar{order:4;display:flex;gap:8px;justify-content:center}
.nbKap.dikey .nbAraclar button{flex:1 1 0;max-width:96px;font-size:20px;padding:5px 2px 4px}
.nbKap.dikey .nbAraclar button small{font-size:11px}
.nbKap.dikey .nbNot{display:none}
.nbKap.dikey .nbBolum{font-size:16px;padding:5px 12px}
.nbKap.dikey .nbBolum b{font-size:19px}

/* bölüm haritası */
.nbSekmeler{display:flex;flex-wrap:wrap;gap:6px;justify-content:center;margin:6px 0 10px}
.nbSekmeler button{font:800 13px Nunito,sans-serif;color:#cfd6ff;background:#1a2350;border:2px solid #34428a;border-radius:11px;padding:4px 9px;cursor:pointer;line-height:1.2}
.nbSekmeler button small{display:block;font-size:10px;color:#ffd23f}
.nbSekmeler button.aktif{background:linear-gradient(180deg,#2bd9b4,#169c86);border-color:#7ff5dc;color:#fff}
.nbSekmeler button.aktif small{color:#fff6c9}
.nbSekmeler button:disabled{opacity:.4;cursor:not-allowed}
.nbHarita{display:grid;grid-template-columns:repeat(auto-fill,minmax(52px,1fr));gap:6px;max-height:46vh;overflow:auto;padding:4px}
.nbHarita button{display:flex;flex-direction:column;align-items:center;gap:0;font-family:inherit;border-radius:12px;border:2px solid #34428a;background:#161d45;color:#fff;padding:5px 0 3px;cursor:pointer}
.nbHarita button b{font:800 16px Nunito,sans-serif;line-height:1.2}
.nbHarita button i{font-style:normal;font-size:10px;color:#ffd23f;letter-spacing:-1px;line-height:1.2}
.nbHarita button i u{text-decoration:none;color:#ffffff30}
.nbHarita button.gecti{background:#163c46;border-color:#2bd9b4}
.nbHarita button.siradaki{background:#4a2d6e;border-color:#c48bff;box-shadow:0 0 12px #c48bff66}
.nbHarita button.simdiki{outline:2px solid #fff;outline-offset:1px}
.nbHarita button:disabled{opacity:.35;cursor:not-allowed}
.nbYildizlar{display:flex;justify-content:center;gap:6px;margin:0 0 4px}
.nbY{font-size:52px;line-height:1;color:#ffffff22;animation:nbYildiz .5s cubic-bezier(.2,1.6,.4,1) both}
.nbY.dolu{color:#ffd23f;text-shadow:0 0 18px #ffb300aa}
.nbY:nth-child(2){font-size:64px;margin-top:-10px}
@keyframes nbYildiz{from{transform:scale(0) rotate(-40deg);opacity:0}to{transform:none;opacity:1}}
.nbYardimOrnek{display:block;margin:6px auto 10px;max-width:100%}
.nbMukemmel{font:800 30px 'Baloo 2',Nunito,sans-serif;color:#7ff5dc;text-shadow:0 0 16px #2bd9b4aa;margin:-4px 0 2px}
@media (max-height:600px){.nbKap:not(.dikey) .nbNot{display:none}.nbKap:not(.dikey) .nbIstat b{font-size:19px}}
