/* Burcu Hoca — Kelimesiz Matematik Oyunu */
:root{
  --zemin:#fffdf8; --krem:#f7f1e6; --metin:#14223f; --soluk:#4a5370;
  --vurgu:#d4762f; --vurgu2:#d9ad5b; --mavi:#3d6fb6; --yesil:#3f8f7a; --kirmizi:#c84a3a;
  --cizgi:#e6dccb; --golge:0 10px 30px rgba(27,36,64,.10);
  --baslik:"Fraunces",Georgia,serif; --govde:"Inter",system-ui,sans-serif;
}
*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}
html,body{height:100%}
body{margin:0;background:var(--krem);color:var(--metin);font:500 17px/1.4 var(--govde);overflow:hidden;overscroll-behavior:none;user-select:none;-webkit-user-select:none}
button{font:inherit;color:inherit;cursor:pointer;touch-action:manipulation}
:focus-visible{outline:3px solid var(--mavi);outline-offset:2px}
.uygulama{height:100%;max-width:480px;margin:0 auto;display:flex;flex-direction:column;background:var(--zemin);position:relative}
@media (min-width:520px){.uygulama{box-shadow:var(--golge);border-inline:1px solid var(--cizgi)}}

/* Üst çubuk */
.ust-cubuk{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:8px 14px;border-bottom:1px solid var(--cizgi);background:rgba(255,253,248,.95);flex:0 0 auto;min-height:54px}
.ev{display:flex;align-items:center;gap:6px;text-decoration:none;color:var(--soluk);font-size:1.3rem}
.ev img{border-radius:50%}
.toplam{display:flex;align-items:center;gap:6px;font-family:var(--baslik);font-size:1.25rem}
.toplam span{color:var(--vurgu2)}
.mod{width:46px;height:46px;border-radius:50%;border:2px solid var(--cizgi);background:#fff;font-size:1.35rem;display:grid;place-items:center;transition:transform .2s,border-color .2s}
.mod:hover{transform:scale(1.06)}
.mod.rahat{border-color:var(--yesil);background:#eef6f3}
.mod.hiz{border-color:var(--vurgu2);background:#fff8ea}

.ekran{flex:1 1 auto;min-height:0;display:flex;flex-direction:column;position:relative}

/* ---------- Harita ---------- */
.harita{flex:1;overflow:auto;padding:12px 10px 24px}
.harita svg{width:100%;height:auto;display:block}
.dunya-dugum{cursor:pointer}
.dunya-dugum .halka{fill:#fff;stroke:var(--vurgu);stroke-width:3;transition:transform .25s;transform-box:fill-box;transform-origin:center}
.dunya-dugum:hover .halka,.dunya-dugum:focus-visible .halka{transform:scale(1.08)}
.dunya-dugum.kilitli{cursor:default}
.dunya-dugum.kilitli .halka{stroke:#bdb6a8;fill:#f1ece2}
.dunya-dugum.kilitli .sembol{fill:#a8a194}
.dunya-dugum .sembol{font-family:var(--baslik);font-weight:700;fill:var(--metin);text-anchor:middle;dominant-baseline:central}
.dunya-dugum .no{font-family:var(--govde);font-weight:600;font-size:12px;fill:#fff;text-anchor:middle;dominant-baseline:central}
.yol{fill:none;stroke:var(--cizgi);stroke-width:6;stroke-linecap:round;stroke-dasharray:1 14}
.harita-yildiz{fill:#e0d9ca}
.harita-yildiz.dolu{fill:var(--vurgu2)}

/* ---------- Dünya (seviye seçimi) ---------- */
.dunya{flex:1;display:flex;flex-direction:column;gap:18px;padding:18px 16px;overflow:auto}
.dunya-baslik{display:flex;align-items:center;gap:14px}
.dunya-baslik .buyuk-sembol{font-family:var(--baslik);font-size:2.2rem;font-weight:700;color:var(--vurgu);background:#fff;border:2px solid var(--vurgu2);border-radius:20px;width:76px;height:76px;display:grid;place-items:center}
.dunya-baslik .buyuk-sembol svg{width:52px;height:52px}
.geri{width:52px;height:52px;border-radius:50%;border:2px solid var(--cizgi);background:#fff;font-size:1.4rem;display:grid;place-items:center}
.seviyeler{display:grid;grid-template-columns:repeat(auto-fill,minmax(120px,1fr));gap:14px}
.seviye-dugme{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;min-height:104px;background:#fff;border:2px solid var(--cizgi);border-radius:22px;font-family:var(--baslik);font-size:2rem;font-weight:700;transition:transform .2s,box-shadow .2s,border-color .2s}
.seviye-dugme:hover:not(:disabled){transform:translateY(-3px);box-shadow:var(--golge);border-color:var(--vurgu2)}
.seviye-dugme:disabled{color:#b3ac9e;background:#f6f2ea;cursor:default}
.seviye-dugme .yildizlar{font-size:1rem;letter-spacing:2px;color:#d8d1c2}
.seviye-dugme .yildizlar b{color:var(--vurgu2);font-weight:400}
.kilit{width:28px;height:28px}

/* ---------- Oyun ekranı ---------- */
.oyun{flex:1;display:flex;flex-direction:column;min-height:0}
.ust-bilgi{display:flex;align-items:center;gap:10px;padding:8px 12px;font-family:var(--baslik);font-size:1.15rem}
.ust-bilgi .cik{width:44px;height:44px;border-radius:50%;border:2px solid var(--cizgi);background:#fff;font-size:1.1rem;display:grid;place-items:center;flex:0 0 auto}
.ust-bilgi .seviye-no{background:var(--metin);color:#fff;border-radius:999px;padding:2px 12px;font-size:1rem}
.canlar{color:var(--kirmizi);font-size:1.35rem;letter-spacing:2px;line-height:1}
.canlar .bos{color:#dcd5c8}
.puan{margin-left:auto;display:flex;align-items:center;gap:4px}
.puan span{color:var(--vurgu2)}
/* Seri göstergesi ●●○ */
.seri{display:inline-flex;gap:6px;align-items:center;padding:0 4px}
.seri i{width:14px;height:14px;border-radius:50%;border:2px solid var(--vurgu2);background:#fff;transition:background .25s,transform .25s}
.seri i.dolu{background:var(--vurgu2);transform:scale(1.15)}
.seri i.hizli{background:var(--vurgu);border-color:var(--vurgu)}

.alan{flex:1;position:relative;overflow:hidden;background:#fff;margin:6px 12px 0;border:1px solid var(--cizgi);border-radius:22px;min-height:160px}
.alan::after{content:"";position:absolute;left:0;right:0;bottom:0;height:10px;background:repeating-linear-gradient(90deg,var(--cizgi) 0 10px,transparent 10px 18px)}
.kart-dusen{position:absolute;left:50%;top:0;transform:translate(-50%,0);background:var(--krem);border:2px solid var(--vurgu2);border-radius:18px;padding:12px 22px;font-family:var(--baslik);font-size:2.3rem;font-weight:700;line-height:1.1;box-shadow:var(--golge);white-space:nowrap;will-change:transform;display:flex;align-items:center;gap:10px}
.kart-dusen .icerik{display:inline-flex;align-items:center;gap:6px}
.kart-dusen .grafik{width:118px;height:88px}
.kart-dusen.dogru{border-color:var(--yesil);background:#e9f5f0;animation:parla .55s ease-out}
.kart-dusen.yanlis{border-color:var(--kirmizi);background:#fbebe8}
@keyframes parla{0%{box-shadow:0 0 0 0 rgba(63,143,122,.6)}100%{box-shadow:0 0 0 26px rgba(63,143,122,0)}}
.sure{position:absolute;left:0;top:0;height:5px;background:var(--vurgu);border-radius:0 4px 4px 0;transition:width .1s linear}
.rahat .sure{display:none}

.secenekler{display:grid;grid-template-columns:1fr 1fr;gap:10px;padding:12px;flex:0 0 auto}
.secenek{position:relative;min-height:78px;background:#fff;border:2px solid var(--cizgi);border-radius:20px;font-family:var(--baslik);font-size:1.75rem;font-weight:700;display:grid;place-items:center;padding:8px 10px;transition:transform .15s,border-color .2s,background .2s,box-shadow .3s}
.secenek .icerik{display:inline-flex;align-items:center;gap:4px}
.secenek .grafik{width:112px;height:84px}
.secenek:hover{border-color:var(--vurgu2)}
.secenek:active{transform:scale(.96)}
.secenek .tus{position:absolute;left:8px;top:6px;font:600 .7rem var(--govde);color:#c2bbad}
.secenek.dogru{border-color:var(--yesil);background:#e9f5f0;box-shadow:0 0 0 4px rgba(63,143,122,.25);animation:parla .6s ease-out}
.secenek.yanlis{border-color:var(--kirmizi);background:#fbebe8;animation:salla .4s}
.secenek:disabled{cursor:default}
@keyframes salla{0%,100%{transform:none}25%{transform:translateX(-5px)}75%{transform:translateX(5px)}}
@media (max-width:360px){.secenek{font-size:1.5rem;min-height:70px}.kart-dusen{font-size:2rem}}
@media (min-height:760px){.secenek{min-height:92px}}

/* Matematik yazımı */
sup{font-size:.6em;vertical-align:.55em;line-height:0}
.kesir{display:inline-flex;flex-direction:column;align-items:center;vertical-align:middle;font-size:.68em;line-height:1.15;margin:0 2px}
.kesir>span:first-child{border-bottom:2px solid currentColor;padding:0 3px}
.kesir>span:last-child{padding:0 3px}
.kok{border-top:2px solid currentColor;padding:0 2px}
.ddx{display:inline-flex;flex-direction:column;align-items:center;font-size:.62em;line-height:1.15;margin-right:6px;color:var(--vurgu);font-style:italic}
.ddx>span:first-child{border-bottom:2px solid currentColor;padding:0 3px}
.grafik{display:block}
.grafik .eksen{stroke:#b9b2a4;stroke-width:1.2}
.grafik .tik{stroke:#c9c3b6;stroke-width:1}
.grafik .ddx-rozet{font:italic 700 14px var(--baslik);fill:var(--vurgu)}

/* ---------- Çözüm örtüsü ---------- */
.ortu{position:absolute;inset:0;background:rgba(255,253,248,.97);display:flex;flex-direction:column;align-items:center;padding:8px 10px;z-index:3;animation:belir .3s}
@keyframes belir{from{opacity:0}to{opacity:1}}
.cozum-baslik{font-family:var(--baslik);font-size:1.7rem;font-weight:700;min-height:2.2rem;text-align:center;line-height:1.3}
.cozum-baslik .sonuc{color:var(--yesil);opacity:0;transition:opacity .4s}
.cozum-baslik .sonuc.gorun{opacity:1}
.cozum-sahne{flex:1;width:100%;min-height:0;display:grid;place-items:center}
.cozum-sahne svg{width:100%;height:100%;max-height:100%}
.cozum-sahne text{font-family:var(--baslik);font-weight:700;fill:var(--metin)}
.cozum-sahne .kucuk{font-size:13px;font-weight:600;font-family:var(--govde);fill:var(--soluk)}
.cozum-sahne .buyuk{font-size:30px}
.cozum-sahne .yesil{fill:var(--yesil)}
.cozum-sahne .turuncu{fill:var(--vurgu)}
.cozum-sahne .mavi{fill:var(--mavi)}
.devam{width:68px;height:68px;border-radius:50%;border:none;background:var(--metin);color:#fff;font-size:1.6rem;display:grid;place-items:center;box-shadow:var(--golge);opacity:0;transform:scale(.6);transition:opacity .3s,transform .3s;margin:6px 0 2px}
.devam.gorun{opacity:1;transform:none}
.devam.gorun:hover{background:#243459}

/* ---------- Seviye sonu ---------- */
.son{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:18px;padding:24px}
.son .yildiz-buyuk{font-size:3.4rem;letter-spacing:6px;color:#dcd5c8;line-height:1}
.son .yildiz-buyuk b{color:var(--vurgu2);font-weight:400;display:inline-block;animation:zipla .6s cubic-bezier(.2,.8,.2,1) both}
.son .yildiz-buyuk b:nth-child(2){animation-delay:.2s}.son .yildiz-buyuk b:nth-child(3){animation-delay:.4s}
@keyframes zipla{from{transform:scale(0) rotate(-30deg)}to{transform:none}}
.son .son-puan{font-family:var(--baslik);font-size:2.4rem;display:flex;align-items:center;gap:8px}
.son .son-puan span{color:var(--vurgu2)}
.son .kalp-kirik{font-size:3.4rem;color:var(--kirmizi);position:relative}
.son .kalp-kirik::after{content:"✕";position:absolute;inset:0;display:grid;place-items:center;color:#fff;font-size:1.6rem;font-weight:700}
.son-dugmeler{display:flex;gap:16px}
.son-dugmeler button{width:72px;height:72px;border-radius:50%;border:2px solid var(--cizgi);background:#fff;font-size:1.7rem;display:grid;place-items:center;transition:transform .2s,box-shadow .2s}
.son-dugmeler button:hover{transform:translateY(-3px);box-shadow:var(--golge)}
.son-dugmeler button.ana{background:var(--metin);color:#fff;border-color:var(--metin)}

@media (prefers-reduced-motion:reduce){
  *{animation-duration:.01ms!important;transition-duration:.01ms!important}
  .kart-dusen{will-change:auto}
}

/* ---------- v2: zorluk seçimi ---------- */
.zorluk{display:flex;justify-content:center;gap:8px;padding:4px 0 10px}
.zorluk-dugme{min-width:62px;height:44px;border-radius:999px;border:2px solid var(--cizgi);background:#fff;font-size:.8rem;letter-spacing:1px;color:var(--soluk);display:grid;place-items:center;transition:background .2s,color .2s,border-color .2s,transform .2s}
.zorluk-dugme:hover{border-color:var(--vurgu2)}
.zorluk-dugme.secili{background:var(--metin);color:var(--vurgu2);border-color:var(--metin);transform:scale(1.06)}
.dunya-dugum.lisans .halka{stroke:var(--mavi)}
.dunya-dugum.lisans.kilitli .halka{stroke:#bdb6a8}

/* ---------- v2: seviye atlama / düşme ---------- */
.atlama{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;gap:14px;font-family:var(--baslik);font-weight:700;font-size:2.6rem;color:var(--metin);animation:belir .3s}
.atlama .yildiz{color:var(--vurgu2);font-size:3.4rem;animation:yuksel 1.1s cubic-bezier(.2,.8,.2,1) both}
.atlama .ok{color:var(--yesil);font-size:2rem;animation:zipla .6s .2s both}
.atlama .no{opacity:.45}
.atlama .no.yeni{opacity:1;color:var(--yesil);animation:zipla .6s .4s both}
.atlama.dusus .ok{color:var(--vurgu)}
.atlama.dusus .no.yeni{color:var(--vurgu)}
@keyframes yuksel{0%{transform:translateY(40px) scale(.5);opacity:0}60%{transform:translateY(-10px) scale(1.15);opacity:1}100%{transform:none}}

/* ---------- v2: matris, limit, toplam, integral yazımı ---------- */
.mat{display:inline-grid;grid-template-columns:auto auto;gap:2px 10px;padding:4px 8px;border-left:2.5px solid currentColor;border-right:2.5px solid currentColor;border-radius:8px;font-size:.78em;line-height:1.15;vertical-align:middle;margin:0 3px}
.mat.vek{grid-template-columns:auto}
.mat span{text-align:center;min-width:1.1em}
.lim{display:inline-flex;flex-direction:column;align-items:center;font-size:.6em;line-height:1.1;margin-right:8px;color:var(--vurgu)}
.lim>span:last-child{font-size:.8em;font-family:var(--govde)}
.sigma,.integral{display:inline-flex;flex-direction:column;align-items:center;font-size:1.05em;line-height:1;margin-right:6px}
.sigma sup,.sigma sub,.integral sup,.integral sub{font-size:.42em;vertical-align:baseline;line-height:1;font-family:var(--govde)}
.secenekler.ikili{grid-template-columns:1fr 1fr}
.secenekler.ikili .secenek{min-height:100px;font-size:2.4rem}
.dunya-tamam{display:flex;align-items:center;gap:10px;font-family:var(--baslik);font-size:1.6rem}
.dunya-tamam .toplam span{background:var(--metin);color:#fff;border-radius:999px;padding:2px 14px}
.dunya-tamam .tik{color:var(--yesil);font-size:2rem}

/* ---------- Skor tablosu ---------- */
.skor-dugmeler{display:flex;justify-content:center;gap:10px;padding:0 0 6px}
.skor-dugmeler[hidden]{display:none}
.skor-dugme{width:44px;height:44px;border-radius:50%;border:2px solid var(--cizgi);background:#fff;font-size:1.25rem;display:grid;place-items:center;transition:transform .2s,border-color .2s}
.skor-dugme:hover{transform:scale(1.06);border-color:var(--vurgu2)}
.skor-ortu{position:absolute;inset:0;z-index:50;background:rgba(20,34,63,.45);display:grid;place-items:center;padding:16px}
.skor-kutu{width:100%;max-width:360px;background:var(--zemin);border-radius:22px;box-shadow:var(--golge);padding:18px;display:flex;flex-direction:column;gap:14px;align-items:center;user-select:text}
.rumuz-satir{display:flex;align-items:center;gap:8px;width:100%}
.rumuz-simge{font-size:1.6rem}
#rumuz-girdi{flex:1;min-width:0;height:50px;border-radius:14px;border:2px solid var(--cizgi);background:#fff;font:600 1.15rem var(--govde);color:var(--metin);padding:0 12px;text-align:center}
#rumuz-girdi:focus{outline:none;border-color:var(--mavi)}
#rumuz-girdi.hatali{border-color:var(--kirmizi);animation:titre .35s}
@keyframes titre{25%{transform:translateX(-5px)}75%{transform:translateX(5px)}}
.rumuz-kilit{width:36px;height:36px;border-radius:50%;border:2px solid var(--cizgi);background:#fff;font-size:.95rem;display:grid;place-items:center;flex:0 0 auto}
.rumuz-uyari{font-size:.85rem;color:var(--soluk);background:var(--krem);border-radius:10px;padding:6px 10px;display:none;text-align:center}
.rumuz-uyari.gorun{display:block}
.rumuz-satir:has(.rumuz-kilit:hover) ~ .rumuz-uyari{display:block}
.skor-kutu .son-dugmeler button{width:60px;height:60px;font-size:1.4rem}
.tablo-bas{display:flex;align-items:center;gap:10px;width:100%}
.tablo-bas .kupa{font-size:1.6rem}
.tablo-mod{flex:1;color:var(--vurgu2);letter-spacing:2px;font-size:.9rem}
.tablo-kapat{width:38px;height:38px;border-radius:50%;border:2px solid var(--cizgi);background:#fff;display:grid;place-items:center}
.tablo-sekme{display:flex;gap:8px}
.tablo-sekme button{min-width:62px;height:40px;border-radius:999px;border:2px solid var(--cizgi);background:#fff;font-size:1.1rem}
.tablo-sekme button.secili{background:var(--metin);color:var(--vurgu2);border-color:var(--metin)}
.tablo-liste{list-style:none;margin:0;padding:0;width:100%;display:flex;flex-direction:column;gap:4px;max-height:52vh;overflow:auto}
.tablo-liste li{display:flex;align-items:center;gap:10px;padding:7px 10px;border-radius:12px;background:#fff;border:1px solid var(--cizgi)}
.tablo-liste li.bos{justify-content:center;color:var(--soluk)}
.tablo-liste li.ben{background:#fff8ea;border-color:var(--vurgu2);box-shadow:0 0 0 2px var(--vurgu2) inset}
.tablo-liste .sira{width:28px;text-align:center;font-family:var(--baslik);font-weight:700}
.tablo-liste .ad{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.tablo-liste .puan{font-family:var(--baslik);font-weight:700}
.tablo-liste .puan span{color:var(--vurgu2);margin-right:3px}
.son .skor-sira{font-family:var(--baslik);font-size:1.4rem;opacity:0;transition:opacity .4s;min-height:1.6rem}
.son .skor-sira.gorun{opacity:1}
.gizlilik-bag{position:absolute;right:10px;bottom:4px;font-size:.7rem;color:var(--soluk);opacity:.7}
/* ---------- v3 ---------- */
.vek{font-weight:700;font-style:italic;text-decoration:overline}
.kucuk-ifade{font-size:.62em;line-height:1.2;white-space:normal;max-width:300px;display:inline-block;text-align:center}
.secenek .grafik.sekil,.kart-dusen .grafik.sekil{width:120px;height:90px}
.kart-dusen .icerik>span:last-child{font-size:1.2em}

/* Netlify ücretsiz rozet şıkları örtmesin */
#nl-badge-frame{display:none!important}
.uygulama{padding-bottom:env(safe-area-inset-bottom)}
@supports (height:100dvh){.uygulama{height:100dvh}}