/* Çengel Bulmaca */
body.oyunSayfa{background:radial-gradient(ellipse at 50% -10%,#1d4a66 0%,#0e2233 55%,#08141f 100%)}
.oAlan{display:flex;justify-content:center;overflow:hidden}
.cbKap{width:min(100%,1180px);height:100%;display:grid;grid-template-columns:minmax(0,1fr);grid-template-rows:auto minmax(0,1fr) auto;grid-template-areas:'ust' 'sol' 'sag';padding:6px 8px 10px;gap:6px;min-height:0}
.cbGovde{display:contents}
.cbUst{grid-area:ust}.cbSol{grid-area:sol}.cbSag{grid-area:sag}

/* üst satır */
.cbUst{display:flex;align-items:center;gap:6px;flex:0 0 auto}
.cbBolumBtn{display:flex;align-items:center;gap:7px;min-width:0;flex:1 1 auto;max-width:300px;background:linear-gradient(180deg,#1b4560,#143449);border:2px solid #2d6a8c;border-radius:12px;color:#fff;padding:3px 10px 3px 6px;cursor:pointer;text-align:left}
.cbHarita{font-size:22px}
.cbBolumYazi{display:flex;flex-direction:column;min-width:0;line-height:1.1}
.cbBolumYazi b{font:800 17px 'Baloo 2',Nunito,sans-serif;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cbBolumYazi small{font:800 11px Nunito,sans-serif;letter-spacing:.3px;text-transform:uppercase;color:#9fd0ea;white-space:nowrap}
.cbBolumYazi small.zk{color:#86efac}.cbBolumYazi small.zo{color:#fcd34d}.cbBolumYazi small.zb{color:#fca5a5}.cbBolumYazi small.zg{color:#c4b5fd}
.cbUstBtn{position:relative;display:flex;align-items:center;gap:4px;height:40px;padding:0 10px;border-radius:12px;border:2px solid #2d6a8c;background:#143449;color:#fff;font:800 14px Nunito,sans-serif;cursor:pointer;font-size:19px}
.cbUstYazi{font:800 13px Nunito,sans-serif;color:#cfe8f5}
.cbNokta{position:absolute;top:-4px;right:-4px;width:12px;height:12px;border-radius:50%;background:#f43f5e;box-shadow:0 0 0 2px #0e2233;animation:cbNabiz 1.6s infinite}
@keyframes cbNabiz{50%{transform:scale(1.3)}}
.cbSure{margin-left:auto;display:flex;flex-direction:column;align-items:flex-end;line-height:1.05;padding:0 2px}
.cbSure b{font:800 18px 'Baloo 2',Nunito,sans-serif;color:#fff;font-variant-numeric:tabular-nums}
.cbYildizOn{font-size:14px;letter-spacing:1px}
.yd{color:#fbbf24;text-shadow:0 0 6px #f59e0b88}.yb{color:#3a5568}

/* gövde */
.cbSol{flex:1;min-height:0;display:flex}
.cbSag{flex:0 0 auto;display:flex;flex-direction:column;gap:6px;min-width:0}
.cbSahne{flex:1;min-height:0;min-width:0;display:flex;align-items:center;justify-content:center;overflow:hidden;border-radius:12px;touch-action:manipulation}
.cbSahne.zoom{overflow:auto;align-items:flex-start;justify-content:flex-start;-webkit-overflow-scrolling:touch}
.cbSahne.zoom .cbIzgara{margin:auto}

/* ızgara */
.cbIzgara{--h:40px;display:grid;grid-template-columns:repeat(var(--C),var(--h));grid-auto-rows:var(--h);gap:1px;padding:3px;background:#0b2131;border-radius:8px;box-shadow:0 10px 30px #0008,0 0 0 2px #3b7ea3;flex:0 0 auto}
.hc{position:relative;overflow:hidden;cursor:pointer;-webkit-tap-highlight-color:transparent}
.hc.harf{background:linear-gradient(180deg,#fffdf7,#f6efe0);display:flex;align-items:center;justify-content:center;transition:background-color .15s}
.hc.harf .hl{font:800 calc(var(--h)*.6)/1 'Baloo 2',Nunito,sans-serif;color:#1e293b;position:relative;z-index:1;margin-top:calc(var(--h)*.06)}
.hc.harf.kelime{background:linear-gradient(180deg,#fff2c2,#ffe49a)}
.hc.harf.secili{background:linear-gradient(180deg,#ffcf5c,#f5a623);box-shadow:inset 0 0 0 2px #b45309}
.hc.harf.acik .hl{color:#1d4ed8}
.hc.harf.yanlis{background:linear-gradient(180deg,#fecaca,#fca5a5)}
.hc.harf.yanlis .hl{color:#b91c1c}
.hc.harf.sifreH::after{content:'';position:absolute;inset:0;border:2px dashed #e0a43a88;pointer-events:none}
.hc.harf .sn{position:absolute;right:1px;bottom:0;font:800 calc(var(--h)*.24)/1 Nunito,sans-serif;font-style:normal;color:#b45309;z-index:2}
.hc.harf.pat .hl{animation:cbPat .22s ease-out}
@keyframes cbPat{0%{transform:scale(.4)}70%{transform:scale(1.18)}100%{transform:scale(1)}}
.hc.soru{background:linear-gradient(160deg,#cfe5f3,#b4d3e8);display:flex;flex-direction:column}
.hc.soru.bos{background:repeating-linear-gradient(45deg,#1b4560 0 4px,#173c54 4px 8px)}
.hc.soru.soruAktif{background:linear-gradient(160deg,#fff4cc,#ffe08a)}
.hc.soru .ip{flex:1 1 0;min-height:0;display:flex;align-items:center;justify-content:center;text-align:center;padding:1px 2px;overflow:hidden}
.hc.soru.iki .ip.sag{border-bottom:1px solid #6c9ab8}
.hc.soru .ip.aktif{background:#ffd76e;color:#000}
.hc.soru .ipt{font:700 9px/1.02 Nunito,'Arial Narrow',sans-serif;color:#0f2b40;overflow-wrap:normal;word-break:normal;white-space:normal}
.hc.soru .ipt.kir{overflow-wrap:anywhere}
.cbIzgara.yaziyok .hc.soru .ipt{display:none}
.cbIzgara.yaziyok .hc.soru .ip::after{content:'?';font:800 calc(var(--h)*.42)/1 'Baloo 2',sans-serif;color:#4b7a99;opacity:.6}
.cbIzgara.yaziyok .hc.soru.iki .ip::after{font-size:calc(var(--h)*.3)}
.cbIzgara.yaziyok .hc.soru .ip.aktif::after{color:#b45309;opacity:1}
.cbIzgara.yaziyok .hc.soru .ip{position:absolute;inset:0}
.cbIzgara.yaziyok .hc.soru.iki .ip.sag{bottom:50%}.cbIzgara.yaziyok .hc.soru.iki .ip.alt{top:50%}
.cbIzgara.yaziyok .hc.soru .ip.aktif{background:#ffd76e55}
/* oklar (kelimenin ilk harf karesinde, soru karesine bakan kenarda) */
.ok{position:absolute;fill:#c2410c;stroke:#c2410c;z-index:2;pointer-events:none}
.okR{left:0;top:50%;width:calc(var(--h)*.2);height:calc(var(--h)*.26);transform:translateY(-50%)}
.okD{top:0;left:50%;width:calc(var(--h)*.26);height:calc(var(--h)*.2);transform:translateX(-50%)}
.okRD{left:0;top:0;width:calc(var(--h)*.3);height:calc(var(--h)*.3)}
.okDR{left:0;top:0;width:calc(var(--h)*.3);height:calc(var(--h)*.3)}
.cbIzgara.salla{animation:cbSalla .45s}
@keyframes cbSalla{20%,60%{transform:translateX(-7px)}40%,80%{transform:translateX(7px)}}
.cbIzgara.cozuldu .hc.harf{background:linear-gradient(180deg,#e8fbe9,#c9f2cf)}
.cbIzgara.cozuldu .hc.harf .hl{color:#14532d}
.hc.harf.dalga{animation:cbDalga .6s ease-out both}
@keyframes cbDalga{0%{transform:scale(1)}40%{transform:scale(1.18);filter:brightness(1.15)}100%{transform:scale(1)}}

/* şifre */
.cbSifre{display:flex;align-items:center;justify-content:center;gap:4px;cursor:pointer;padding:2px 4px;flex-wrap:nowrap}
.sfEt{font:800 13px Nunito,sans-serif;color:#fcd34d;margin-right:4px;white-space:nowrap}
.sfK{position:relative;width:28px;height:30px;border-radius:7px;background:#fff7e3;border:2px solid #e0a43a;display:flex;align-items:center;justify-content:center}
.sfK b{font:800 18px/1 'Baloo 2',sans-serif;color:#7c2d12;margin-top:2px}
.sfK i{position:absolute;top:-6px;left:-5px;font:800 10px/14px Nunito,sans-serif;font-style:normal;background:#e0a43a;color:#3b1d00;border-radius:7px;min-width:14px;text-align:center}
.cbSifre.bulundu .sfK{background:#dcfce7;border-color:#22c55e}.cbSifre.bulundu .sfK b{color:#14532d}.cbSifre.bulundu .sfK i{background:#22c55e;color:#052e16}

/* ipucu çubuğu */
.cbIpucuBar{display:flex;align-items:stretch;gap:6px;min-height:50px}
.cbOk{flex:0 0 44px;border-radius:12px;border:2px solid #2d6a8c;background:#143449;color:#fff;font:800 28px/1 sans-serif;cursor:pointer;padding:0 0 3px;touch-action:manipulation}
.cbOk:active{background:#2d6a8c}
.cbIpucuMetin{flex:1;min-width:0;display:flex;align-items:center;gap:8px;padding:4px 10px;border-radius:12px;background:linear-gradient(180deg,#fff9e8,#f7ebcd);color:#1e293b;box-shadow:inset 0 0 0 2px #e0a43a;cursor:pointer}
.ikOk{font-size:20px;color:#c2410c;flex:0 0 auto}
.ikYazi{flex:1;min-width:0;font:800 17px/1.15 Nunito,sans-serif;overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.ikBoy{flex:0 0 auto;font:800 13px Nunito,sans-serif;background:#1b4560;color:#fff;border-radius:99px;padding:2px 8px}

/* araçlar */
.cbAraclar{display:flex;justify-content:center;gap:8px}
.cbAraclar button{position:relative;flex:1;max-width:110px;display:flex;flex-direction:column;align-items:center;gap:0;font-size:20px;color:#fff;background:#143449;border:2px solid #2d6a8c;border-radius:12px;padding:3px 4px 2px;cursor:pointer;touch-action:manipulation}
.cbAraclar button small{font:800 11.5px Nunito,sans-serif;color:#cfe8f5;white-space:nowrap}
.cbAraclar button i{position:absolute;top:-7px;right:-6px;min-width:22px;height:20px;border-radius:10px;background:#22c55e;color:#052e16;font:800 12px/20px Nunito,sans-serif;font-style:normal;padding:0 5px}
.cbAraclar button i.reklam{background:#facc15;color:#3b2a00}
.cbAraclar button.aktif{background:#2d6a8c;border-color:#7dd3fc}
.cbAraclar button.kullanildi{border-color:#f59e0b}
.cbAraclar button:disabled{opacity:.4;cursor:default}

/* soru listesi (geniş ekran) */
.cbListe{display:none;flex:1;min-height:0;overflow:auto;background:#0b2131;border:2px solid #1f4b66;border-radius:12px;padding:6px 8px}
.cbListe h3{font:800 14px Nunito,sans-serif;color:#9fd0ea;margin:6px 4px 4px;text-transform:uppercase;letter-spacing:.5px}
.cbListe ul{list-style:none;margin:0;padding:0}
.cbListe li{display:flex;align-items:baseline;gap:6px;padding:4px 8px;border-radius:8px;color:#e2f1fa;font:700 14.5px/1.3 Nunito,sans-serif;cursor:pointer}
.cbListe li small{color:#7fa9c2}
.cbListe li .lOk{color:#fb923c;flex:0 0 auto;font-size:13px}
.cbListe li:hover{background:#143449}
.cbListe li.aktif{background:#f5b83d;color:#1e1300}.cbListe li.aktif small{color:#5b4300}
.cbListe li.dolu:not(.aktif){opacity:.5}

/* ekran klavyesi */
.cbKlavye{display:flex;flex-direction:column;gap:6px;padding:2px 0 8px;margin-bottom:max(4px,env(safe-area-inset-bottom))}
.kSatir{display:flex;justify-content:center;gap:4px}
.kTus{flex:1 1 0;max-width:46px;min-width:0;height:44px;border-radius:9px;border:0;background:linear-gradient(180deg,#f8fafc,#dbe4ec);color:#0f2b40;font:800 19px/1 'Baloo 2',Nunito,sans-serif;box-shadow:0 3px 0 #6b8396;cursor:pointer;padding:0;touch-action:manipulation;-webkit-tap-highlight-color:transparent;user-select:none;-webkit-user-select:none}
.kTus.kSil{flex:1.5 1 0;max-width:70px;background:linear-gradient(180deg,#fcd9a8,#f5b83d);color:#4a2c00}
.kTus.bas{animation:cbTus .15s}
@keyframes cbTus{50%{transform:translateY(3px);box-shadow:0 0 0 #6b8396;filter:brightness(.9)}}

/* konfeti */
.cbKonfeti{position:fixed;inset:0;width:100%;height:100%;pointer-events:none;z-index:60;display:none}

/* pencereler */
.hrGunluk{width:100%;display:flex;align-items:center;gap:10px;text-align:left;border-radius:14px;border:2px solid #8b5cf6;background:linear-gradient(135deg,#3b1f74,#2a1557);color:#fff;padding:8px 12px;cursor:pointer;margin:4px 0 10px}
.hrGunluk.bitti{border-color:#22c55e;background:linear-gradient(135deg,#14532d,#0f3b20)}
.hgIkon{font-size:30px}
.hgYazi{flex:1;display:flex;flex-direction:column;line-height:1.2}
.hgYazi b{font:800 17px Nunito,sans-serif}.hgYazi small{font:700 12.5px Nunito,sans-serif;color:#e9ddff}
.hgSeri{font:800 16px Nunito,sans-serif;white-space:nowrap}
.hrSekmeler{display:flex;gap:6px;margin-bottom:6px}
.hrSekme{flex:1;border-radius:10px;border:2px solid #2d6a8c;background:#143449;color:#cfe8f5;font:800 14px Nunito,sans-serif;padding:6px 4px;cursor:pointer;white-space:nowrap}
.hrSekme small{display:block;font-size:11px;color:#8fb8cf}
.hrSekme.aktif{background:#f5b83d;border-color:#ffd98a;color:#2a1a00}.hrSekme.aktif small{color:#5b4300}
.hrBilgi{margin:4px 0 8px;font-size:14px}
.hrIzgara{display:grid;grid-template-columns:repeat(auto-fill,minmax(58px,1fr));gap:7px;max-height:44vh;overflow:auto;padding:4px 2px}
.hrIzgara button{display:flex;flex-direction:column;align-items:center;justify-content:center;height:56px;border-radius:12px;border:2px solid #2d6a8c;background:#143449;color:#fff;cursor:pointer;padding:0}
.hrIzgara button b{font:800 18px/1 'Baloo 2',Nunito,sans-serif}
.hrIzgara button span{font-size:11.5px;letter-spacing:1px;line-height:1.2}
.hrIzgara button.gecti{background:linear-gradient(180deg,#1f6f43,#14532d);border-color:#4ade80}
.hrIzgara button.siradaki{background:linear-gradient(180deg,#9a4a12,#7c2d12);border-color:#fb923c}
.hrIzgara button.simdi{box-shadow:0 0 0 3px #fde68a}
.hrIzgara button:disabled{opacity:.45;cursor:default}
.bsOzet{display:grid;grid-template-columns:repeat(4,1fr);gap:6px;margin:6px 0}
.bsOzet span{display:flex;flex-direction:column;align-items:center;background:#143449;border-radius:12px;padding:6px 2px;font-size:18px}
.bsOzet b{font:800 18px 'Baloo 2',sans-serif}.bsOzet small{font-size:11px;color:#9fd0ea}
.bsSay{text-align:center;margin:2px 0 6px;font-weight:800;color:#fcd34d}
.bsListe{display:flex;flex-direction:column;gap:6px;max-height:46vh;overflow:auto}
.bsr{display:flex;align-items:center;gap:10px;padding:6px 10px;border-radius:12px;background:#0f2a3d;opacity:.55}
.bsr.var{opacity:1;background:linear-gradient(90deg,#1b4560,#143449);box-shadow:inset 0 0 0 2px #f5b83d88}
.bsIkon{font-size:26px;filter:grayscale(1)}.bsr.var .bsIkon{filter:none}
.bsr span:nth-child(2){display:flex;flex-direction:column;line-height:1.2;flex:1}
.bsr small{color:#9fc3d8;font-size:12.5px}.bsr i{font-style:normal;color:#4ade80;font-weight:800}
.bsYeni{margin:6px 0;padding:7px 10px;border-radius:12px;background:linear-gradient(90deg,#713f12,#422006);box-shadow:inset 0 0 0 2px #fbbf24;animation:cbPat .4s .8s both}
.bsYeni small{display:block;color:#fde68a}
.btUst{font-size:46px;line-height:1;text-align:center}
.btYildiz{display:flex;justify-content:center;gap:10px;font-size:50px;line-height:1;margin:4px 0 6px}
.btYildiz span{animation:cbYildiz .5s both}
@keyframes cbYildiz{0%{transform:scale(0) rotate(-90deg);opacity:0}70%{transform:scale(1.3)}100%{transform:scale(1);opacity:1}}
.btSatir{display:flex;justify-content:center;gap:14px;flex-wrap:wrap;font-size:16px}
.btNot{text-align:center;font-size:13.5px;color:#a9c6d8;margin:4px 0}
.btGeri{text-align:center;margin:6px 0}
.btToplam{text-align:center;margin:8px 0 4px}
.sfBuyuk{font:800 38px 'Baloo 2',sans-serif;letter-spacing:6px;text-align:center;color:#4ade80;margin:6px 0}
.sfGir{display:block;width:100%;max-width:280px;margin:8px auto;text-align:center;font:800 28px 'Baloo 2',sans-serif;letter-spacing:6px;text-transform:uppercase;padding:6px 10px;border-radius:12px;border:2px solid #e0a43a;background:#fff9e8;color:#1e293b}
.sfHak{text-align:center;font-size:14px}
.yrdOrnek{background:#143449;border-radius:12px;padding:8px 12px;margin-bottom:6px;font-size:14.5px}

/* ---------- yatay telefon / tablet: ızgara solda, kontroller sağda ---------- */
@media (orientation:landscape) and (min-aspect-ratio:5/4){
  .cbKap{grid-template-columns:minmax(0,1fr) min(48%,440px);grid-template-rows:auto minmax(0,1fr);grid-template-areas:'sol ust' 'sol sag';column-gap:10px}
  .cbSag{justify-content:flex-end;min-height:0}
}
@media (orientation:landscape) and (max-height:500px){
  .cbKap{padding:3px 6px 4px;gap:3px}
  .cbUst{gap:4px}
  .cbUstBtn{height:32px;padding:0 7px;font-size:16px}
  .cbUstYazi{display:none}
  .cbBolumBtn{padding:1px 8px 1px 4px}.cbHarita{font-size:18px}.cbBolumYazi b{font-size:15px}
  .cbSure b{font-size:15px}.cbYildizOn{font-size:12px}
  .cbSag{gap:4px}
  .cbIpucuBar{min-height:40px}.cbOk{flex-basis:36px;font-size:22px}.ikYazi{font-size:14.5px}.ikOk{font-size:16px}
  .sfK{width:22px;height:24px}.sfK b{font-size:14px}.sfEt{font-size:11px}
  .cbAraclar button{font-size:15px;padding:1px 3px}.cbAraclar button small{font-size:10px}
  .cbKlavye{gap:4px;padding-bottom:6px}
  .kTus{height:34px;font-size:16px;max-width:40px}
  .kTus.kSil{max-width:56px}
}
@media (orientation:landscape) and (max-height:360px){
  .cbAraclar button small{display:none}
  .kTus{height:31px}
}
/* geniş ekran (fare/klavye): soru listesi görünür, ekran klavyesi gizli */
@media (min-width:900px) and (min-height:560px) and (hover:hover) and (pointer:fine){
  .cbKlavye{display:none}
  .cbListe{display:block}
  .cbKap{grid-template-columns:minmax(0,1fr) 390px;grid-template-rows:auto minmax(0,1fr);grid-template-areas:'sol ust' 'sol sag';column-gap:14px;padding:8px 12px 12px}
  .cbSag{justify-content:flex-start;min-height:0}
}
/* dar dikey ekran */
@media (max-width:380px){
  .kTus{height:42px;font-size:17px}
  .kSatir{gap:3px}
  .cbAraclar{gap:5px}
  .cbUstYazi{display:none}
}
@media (orientation:portrait) and (max-height:700px){
  .kTus{height:38px}
  .cbIpucuBar{min-height:44px}
  .ikYazi{font-size:15.5px}
}