/* ============================================================
   DEDEKTİF EMO — GÖRSEL DİL (10.10.2026)
   Yeni logodan gelir: lacivert kontur, turuncu + turkuaz, kabarık yazı.
   Tüm düğmeler aynı mimaride: 3px lacivert kontur, sert alt gölge,
   basınca aşağı iner. Renk yalnız düğmenin görevini söyler:
     turuncu = ana eylem · turkuaz = ikincil · krem = nötr
     yeşil = tamamlandı · gri-lila = geç.
   Bu dosya index.html'in ana stilinden SONRA yüklenir ve onu ezer.
   ============================================================ */
@font-face{font-family:'Baloo 2';font-style:normal;font-weight:500 800;font-display:swap;
  src:url('assets/font/baloo-2-normal-500-800-latin-ext.woff2') format('woff2');
  unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:'Baloo 2';font-style:normal;font-weight:500 800;font-display:swap;
  src:url('assets/font/baloo-2-normal-500-800-latin.woff2') format('woff2');
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}

:root{
  --emo-lacivert:#17204A;
  --emo-turuncu:#FF8A2A; --emo-turuncu-koyu:#EC5F05;
  --emo-turkuaz:#5CE3D2; --emo-turkuaz-koyu:#17AE9F;
  --emo-krem:#FFF8EC; --emo-krem-koyu:#F1E4CC;
  --emo-yesil:#6BD873; --emo-yesil-koyu:#2C9B3C;
  --emo-gri:#C4BEDB; --emo-gri-koyu:#8E85B0;
  --emo-font:'Baloo 2','Segoe UI',system-ui,sans-serif;
  --emo-golge:0 5px 0 var(--emo-lacivert),0 9px 18px rgba(10,8,40,.32);
  --emo-golge-bas:0 1px 0 var(--emo-lacivert),0 3px 8px rgba(10,8,40,.3);
}

/* ── ORTAK DÜĞME MİMARİSİ ─────────────────────────────────── */
.btn,.dd-acilis-btn,.dd-kutu button:not(.dd-ince):not(.dd-dil-btn),.oyun-mod-btn,.mod-btn,
.rakam-islev.onay,.avatar-secici-kapat,.coklu-ekle,.oyunu-bitir-btn,.tr-gec,.dd-dil-dugme{
  font-family:var(--emo-font);font-weight:800;letter-spacing:.2px;
  border:3px solid var(--emo-lacivert);border-radius:18px;cursor:pointer;
  box-shadow:var(--emo-golge);
  transition:transform .1s ease, box-shadow .1s ease, filter .15s ease;
}
.btn:active,.dd-acilis-btn:active,.dd-kutu button:not(.dd-ince):not(.dd-dil-btn):active,.oyun-mod-btn:active,
.mod-btn:active,.rakam-islev.onay:active,.avatar-secici-kapat:active,.coklu-ekle:active,.oyunu-bitir-btn:active,
.tr-gec:active,.dd-dil-dugme:active{transform:translateY(4px);box-shadow:var(--emo-golge-bas)}

/* Ana eylem: turuncu */
.btn{
  color:#fff;font-size:18px;line-height:1.15;padding:13px 28px;min-height:54px;
  background:linear-gradient(180deg,#FFA54F 0%,var(--emo-turuncu) 45%,var(--emo-turuncu-koyu) 100%);
  text-shadow:0 2px 0 rgba(23,32,74,.38);
  box-shadow:var(--emo-golge),inset 0 3px 0 rgba(255,255,255,.4),inset 0 -3px 0 rgba(0,0,0,.08);
}
.btn:active{box-shadow:var(--emo-golge-bas),inset 0 3px 0 rgba(255,255,255,.3)}
/* İkincil: turkuaz (logodaki "Emo" rengi) */
.btn.iki,.btn.ikincil{
  color:var(--emo-lacivert);text-shadow:0 1px 0 rgba(255,255,255,.45);
  background:linear-gradient(180deg,#8DF0E3 0%,var(--emo-turkuaz) 45%,var(--emo-turkuaz-koyu) 100%);
  box-shadow:var(--emo-golge),inset 0 3px 0 rgba(255,255,255,.5);
}
.btn.iki:active,.btn.ikincil:active{box-shadow:var(--emo-golge-bas),inset 0 3px 0 rgba(255,255,255,.35)}
/* Nötr: krem */
.btn.notr,.dd-acilis-btn{
  color:var(--emo-lacivert);text-shadow:none;
  background:linear-gradient(180deg,#fff 0%,var(--emo-krem) 55%,var(--emo-krem-koyu) 100%);
  box-shadow:var(--emo-golge),inset 0 3px 0 #fff;
}
/* Kartta: Tamam yeşil, Geç gri-lila — aynı kontur ve gölge */
.btn.tamam-btn{color:#fff;background:linear-gradient(180deg,#95EB98 0%,var(--emo-yesil) 45%,var(--emo-yesil-koyu) 100%);
  box-shadow:var(--emo-golge),inset 0 3px 0 rgba(255,255,255,.45)}
.btn.tamam-btn:active{box-shadow:var(--emo-golge-bas)}
.btn.gec-btn{color:var(--emo-lacivert);text-shadow:0 1px 0 rgba(255,255,255,.5);background:linear-gradient(180deg,#DAD5EC 0%,var(--emo-gri) 40%,var(--emo-gri-koyu) 100%);
  box-shadow:var(--emo-golge),inset 0 3px 0 rgba(255,255,255,.5)}
.btn.gec-btn:active{box-shadow:var(--emo-golge-bas)}
.btn.dd-ebeveyn-menu{color:#fff;background:linear-gradient(180deg,#9D8CF0 0%,#7B6AD0 45%,#4B3E8C 100%);
  box-shadow:var(--emo-golge),inset 0 3px 0 rgba(255,255,255,.35)}
.btn.dd-ebeveyn-menu:active{box-shadow:var(--emo-golge-bas)}
.btn.pasif{filter:grayscale(.75);opacity:.5}
.kart-eylem .btn{font-size:16px;padding:11px 8px;min-height:50px}

/* Açılış: Hadi Keşfet ve altındaki düğmeler aynı genişlik ve aralıkta */
#e-acilis .acilis-orta{flex-direction:column;gap:14px}
#e-acilis .acilis-orta > .btn,#e-acilis .acilis-orta > .dd-acilis-btn{width:min(300px,78vw)}
#e-acilis .acilis-orta > .btn:first-child{font-size:21px;min-height:60px}
.dd-acilis-btn{font-size:16px;padding:10px 14px;min-height:48px}

/* Açılır pencereler (ebeveyn, market, kurum, dil) */
.dd-kutu{border:3px solid var(--emo-lacivert);border-radius:24px;background:var(--emo-krem);
  box-shadow:0 8px 0 var(--emo-lacivert),0 24px 60px rgba(0,0,0,.4)}
.dd-kutu h2{font-family:var(--emo-font);font-weight:800;color:var(--emo-lacivert)}
.dd-kutu button:not(.dd-ince):not(.dd-dil-btn){background:linear-gradient(180deg,#fff,var(--emo-krem));color:var(--emo-lacivert);
  box-shadow:0 4px 0 var(--emo-lacivert)}
.dd-kutu button:not(.dd-ince):not(.dd-dil-btn):active{box-shadow:0 1px 0 var(--emo-lacivert)}
.dd-kutu button.dd-ana{color:#fff;text-shadow:0 2px 0 rgba(23,32,74,.35);
  background:linear-gradient(180deg,#FFA54F,var(--emo-turuncu) 50%,var(--emo-turuncu-koyu))}
.dd-kutu button.dd-dil-btn{font-family:var(--emo-font);font-weight:800;border:3px solid var(--emo-krem-koyu);border-radius:16px;
  background:#fff;color:var(--emo-lacivert)}
.dd-kutu button.dd-dil-btn.secili{border-color:var(--emo-lacivert);background:var(--emo-turkuaz);box-shadow:0 4px 0 var(--emo-lacivert)}
.dd-dil-dugme{border-radius:999px;background:var(--emo-krem);color:var(--emo-lacivert);box-shadow:0 3px 0 var(--emo-lacivert);padding:6px 12px}
.dd-dil-dugme:active{transform:translateY(2px);box-shadow:0 1px 0 var(--emo-lacivert)}

/* Paneller: krem kart, lacivert kontur */
.panel{border:3px solid var(--emo-lacivert);border-radius:24px;background:var(--emo-krem);
  box-shadow:0 8px 0 var(--emo-lacivert),0 22px 44px rgba(0,0,0,.38)}
.panel h2{font-family:var(--emo-font);font-weight:800;color:var(--emo-lacivert);font-size:24px;line-height:1.15}
.panel label{color:var(--emo-lacivert)}
.panel input[type=text]{border:2.5px solid var(--emo-krem-koyu);border-radius:14px}
.panel input[type=text]:focus{outline:none;border-color:var(--emo-turkuaz-koyu);box-shadow:0 0 0 3px rgba(92,227,210,.35)}
.yas-baslik{font-family:var(--emo-font);color:var(--emo-turuncu-koyu)}
.yas-kutu{border:3px solid var(--emo-lacivert);box-shadow:0 6px 0 var(--emo-lacivert),0 10px 20px rgba(0,0,0,.18),inset 0 2px 0 #fff}
.yas-kutu.dolu{border-color:var(--emo-lacivert);background:linear-gradient(180deg,#E6FCF8,#BFF3EC)}

/* Oyun modu kartları */
.oyun-mod-btn{background:linear-gradient(180deg,#fff,var(--emo-krem) 60%,var(--emo-krem-koyu));color:var(--emo-lacivert);
  border-radius:20px;padding:14px 16px}
.oyun-mod-btn b{font-family:var(--emo-font);font-size:21px;color:var(--emo-turuncu-koyu)}
.oyun-mod-btn.coklu b{color:var(--emo-turkuaz-koyu)}
.oyun-mod-btn small{color:#5d5876}

/* Kayıt ekranındaki küçük düğmeler */
.mod-btn{border-radius:14px;background:#fff;color:var(--emo-lacivert);box-shadow:0 4px 0 var(--emo-lacivert);border-width:2.5px}
.mod-btn.secili{border-color:var(--emo-lacivert);background:var(--emo-turkuaz);transform:none}
.mod-btn:active{box-shadow:0 1px 0 var(--emo-lacivert)}
.rakam-islev.onay{background:linear-gradient(180deg,#8DF0E3,var(--emo-turkuaz) 50%,var(--emo-turkuaz-koyu));color:var(--emo-lacivert);
  box-shadow:0 4px 0 var(--emo-lacivert)}
.rakam-islev.onay:disabled{background:#E7E1D6;color:#9b94a8;border-color:#b9b2c6;box-shadow:0 3px 0 #b9b2c6}
.avatar-secici-kapat{background:linear-gradient(180deg,#FFA54F,var(--emo-turuncu) 50%,var(--emo-turuncu-koyu));color:#fff;
  box-shadow:0 4px 0 var(--emo-lacivert);text-shadow:0 2px 0 rgba(23,32,74,.3)}
.avatar-secici-kapat:active{box-shadow:0 1px 0 var(--emo-lacivert)}
.coklu-ekle{border-style:dashed;background:transparent;color:var(--emo-lacivert);box-shadow:none}
.coklu-ekle:active{box-shadow:none}
.oyunu-bitir-btn{border-width:2.5px;border-radius:14px;box-shadow:0 3px 0 var(--emo-lacivert)}
.oyunu-bitir-btn:active{box-shadow:0 1px 0 var(--emo-lacivert)}
.tr-gec{background:var(--emo-krem);color:var(--emo-lacivert);border-radius:999px;box-shadow:0 3px 0 var(--emo-lacivert);
  border-width:2.5px;padding:7px 18px}

/* Kart ve masadaki yuvarlak simge düğmeleri */
.favori-dugme,.ipucu-dugme{border:2.5px solid var(--emo-lacivert);background:#fff;box-shadow:0 3px 0 var(--emo-lacivert)}
.ses-btn{border:2.5px solid var(--emo-lacivert)}

/* ── EMO LOGOSU ───────────────────────────────────────────────
   Karakter görseldir; ad metindir, böylece her dilde kendi adıyla yazılır.
   Yazı logodaki gibi: lacivert "Dedektif", turkuaz "Emo", krem + lacivert kontur. */
.emo-logo{display:flex;flex-direction:column;align-items:center;margin:0 auto;width:min(330px,74vw)}

.emo-logo .emo-karakter{width:82%;height:auto;display:block;position:relative;z-index:1;filter:drop-shadow(0 10px 18px rgba(0,0,0,.4));
  animation:emoBak 5s ease-in-out infinite}
@keyframes emoBak{0%,100%{transform:translateY(0) rotate(0)}45%{transform:translateY(-4px) rotate(-1.5deg)}60%{transform:translateY(-2px) rotate(1deg)}}
.emo-ad{display:flex;flex-direction:column;align-items:center;line-height:.86;font-family:var(--emo-font);font-weight:800;
  position:relative;z-index:2;margin-top:-2%;text-align:center}
.emo-ad span{display:block;paint-order:stroke fill;-webkit-text-stroke:0}
.emo-ad-1{font-size:clamp(34px,11vw,54px);color:var(--emo-lacivert);
  text-shadow:0 0 0 #fff,3px 0 0 #fff,-3px 0 0 #fff,0 3px 0 #fff,0 -3px 0 #fff,2px 2px 0 #fff,-2px 2px 0 #fff,2px -2px 0 #fff,-2px -2px 0 #fff,
    0 7px 0 var(--emo-lacivert)}
.emo-ad-2{font-size:clamp(58px,19vw,92px);color:var(--emo-turkuaz);margin-top:-2px;
  -webkit-text-stroke:3px var(--emo-lacivert);
  text-shadow:4px 0 0 var(--emo-krem),-4px 0 0 var(--emo-krem),0 4px 0 var(--emo-krem),0 -4px 0 var(--emo-krem),3px 3px 0 var(--emo-krem),-3px 3px 0 var(--emo-krem),3px -3px 0 var(--emo-krem),-3px -3px 0 var(--emo-krem),
    0 9px 0 var(--emo-lacivert)}
.emo-ad-giris .emo-ad-1{font-size:clamp(30px,9vw,46px)}
.emo-ad-giris .emo-ad-2{font-size:clamp(50px,16vw,78px)}
#tr-yazi .emo-ad{margin-top:-46px}
/* Açılışta logo + slogan + düğmeler birlikte sığsın */
#e-acilis{padding-top:max(46px,6vh)}
#e-acilis .slogan{font-family:var(--emo-font);font-size:clamp(18px,5.2vw,23px);margin-top:10px}
@media (max-height:700px){ .emo-logo{width:min(250px,60vw)} #e-acilis .slogan{font-size:17px;margin-top:4px} }

/* ── DESTE KAPAKLARI ──────────────────────────────────────────
   Kapak her kutuda 1063:709 oranında durur; kutunun kalanı kapağın zemin
   rengindedir. Deste adı seçili dilde, kapaktaki eski yazının yerinde. */
.kapak-kap{container-type:size;display:grid;place-items:center;overflow:hidden;background-image:none !important}
.kapak{position:relative;width:min(100cqw,calc(100cqh * 1063 / 709));aspect-ratio:1063/709;
  background-size:100% 100%;background-repeat:no-repeat;container-type:inline-size}
.kapak-baslik{position:absolute;left:6.4cqw;top:9.5cqw;max-width:44cqw;
  font-family:'Baloo 2','Arial Black',system-ui,sans-serif;font-weight:800;font-size:6.1cqw;line-height:1.13;
  color:#111;letter-spacing:.02em;overflow-wrap:anywhere;hyphens:auto}
.kart-arka.kapak-kap{background-color:#263238}
.ucan-kart.kapak-kap{background-color:var(--dr)}
.deste3 .d-ust.kapak-kap{border-radius:10px}

/* ── KART ÇEVİRME ────────────────────────────────────────────
   İki aşamalı (index.html → kartCevir): yalnız görünen yüz çizilir. */
.kart-ic{transform-style:flat;transition:none;will-change:transform}
.kart-ic.donuk{transform:none}
.kart-yuz{backface-visibility:visible;-webkit-backface-visibility:visible}
.kart-on{transform:none;visibility:hidden}
.kart-ic.on-yuz .kart-on{visibility:visible}
.kart-ic.on-yuz .kart-arka{visibility:hidden}
.kart-arka{border:3px solid var(--emo-lacivert)}
.kart-on{border:3px solid var(--emo-lacivert)}

/* ── NASIL OYNANIR? (rehber.js) ───────────────────────────── */
.rehber-perde{position:fixed;inset:0;z-index:8500;display:flex;align-items:center;justify-content:center;padding:16px;
  background:rgba(14,12,40,.72);opacity:0;transition:opacity .22s ease}
.rehber-perde.acik{opacity:1}
.rehber-perde[hidden]{display:none}
.rh-kutu{position:relative;width:min(440px,100%);max-height:calc(100vh - 32px);overflow:auto;text-align:center;
  background:var(--emo-krem);color:var(--emo-lacivert);border:3px solid var(--emo-lacivert);border-radius:26px;
  padding:18px 20px 20px;box-shadow:0 8px 0 var(--emo-lacivert),0 26px 60px rgba(0,0,0,.45);
  transform:translateY(14px) scale(.97);transition:transform .25s cubic-bezier(.2,.9,.3,1.2)}
.rehber-perde.acik .rh-kutu{transform:none}
.rh-kapat{position:absolute;top:10px;right:10px;width:38px;height:38px;border-radius:50%;border:2.5px solid var(--emo-lacivert);
  background:#fff;color:var(--emo-lacivert);font-size:17px;font-weight:800;cursor:pointer;box-shadow:0 3px 0 var(--emo-lacivert);z-index:2}
.rh-kapat:active{transform:translateY(2px);box-shadow:0 1px 0 var(--emo-lacivert)}
.rh-sahne{height:min(190px,26vh);display:flex;align-items:center;justify-content:center;margin:6px 0 6px}
.rh-adim-etiket{font-size:12.5px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:var(--emo-turkuaz-koyu)}
.rh-kutu h2{font-family:var(--emo-font);font-weight:800;font-size:clamp(22px,6.2vw,27px);line-height:1.15;margin:2px 0 6px}
.rh-kutu p{font-size:15.5px;line-height:1.5;color:#3b3858;min-height:4.5em}
.rh-noktalar{display:flex;justify-content:center;gap:7px;margin:12px 0 14px}
.rh-noktalar span{width:9px;height:9px;border-radius:50%;background:#d9cfbb;border:1.5px solid transparent;transition:all .2s}
.rh-noktalar span.gecti{background:var(--emo-turkuaz)}
.rh-noktalar span.aktif{width:26px;border-radius:6px;background:var(--emo-turuncu);border-color:var(--emo-lacivert)}
.rh-dugmeler{display:flex;gap:12px}
.rh-dugmeler .btn{flex:1;min-width:0;font-size:16px;padding:10px 10px;min-height:50px}
.rh-dugmeler .rh-ileri{flex:1.35}
/* Adım çizimleri */
.rh-emo{height:100%;width:auto;max-width:100%;filter:drop-shadow(0 8px 14px rgba(0,0,0,.25));animation:emoBak 4s ease-in-out infinite}
.rh-mod{display:flex;gap:18px}
.rh-mod-k{width:96px;height:96px;border-radius:24px;display:flex;align-items:center;justify-content:center;font-size:52px;
  background:linear-gradient(180deg,#fff,var(--emo-krem-koyu));border:3px solid var(--emo-lacivert);box-shadow:0 5px 0 var(--emo-lacivert);
  animation:rhZipla 1.8s ease-in-out infinite}
.rh-mod-k.coklu{background:linear-gradient(180deg,#B6F6EE,var(--emo-turkuaz));animation-delay:.25s}
@keyframes rhZipla{0%,100%{transform:translateY(0)}50%{transform:translateY(-8px)}}
.rh-zar{display:flex;flex-direction:column;align-items:center;gap:12px}
.rh-zar-kup{font-size:58px;line-height:1;animation:rhYuvarla 2.2s cubic-bezier(.3,.1,.3,1) infinite}
@keyframes rhYuvarla{0%{transform:rotate(0) translateY(0)}25%{transform:rotate(200deg) translateY(-18px)}45%{transform:rotate(340deg) translateY(0)}55%,100%{transform:rotate(360deg)}}
.rh-desteler{display:grid;grid-template-columns:repeat(6,1fr);gap:6px;width:min(330px,82vw)}
.rh-deste{aspect-ratio:1063/709;border-radius:6px;background:var(--r) center/100% 100% no-repeat;border:2px solid var(--emo-lacivert);
  animation:rhSec 6s infinite;animation-delay:calc(var(--i) * 1s)}
@keyframes rhSec{0%,14%{transform:translateY(-8px) scale(1.14);box-shadow:0 0 0 3px #fff,0 0 16px 4px rgba(255,255,255,.8)}17%,100%{transform:none;box-shadow:none}}
.rh-kart{width:min(250px,64vw);border-radius:16px;background:#FCF8EF;border:3px solid var(--emo-lacivert);overflow:hidden;
  box-shadow:0 6px 0 var(--emo-lacivert);animation:rhKartCevir 3.4s ease-in-out infinite}
@keyframes rhKartCevir{0%,8%{transform:perspective(600px) rotateY(90deg)}22%,100%{transform:perspective(600px) rotateY(0)}}
.rh-kart-serit{display:flex;align-items:center;gap:6px;padding:8px 10px;background:#3296F2;color:#fff;font-size:18px}
.rh-kart-serit i{flex:1}
.rh-kart-serit b{width:30px;height:30px;border-radius:50%;background:#fff;display:flex;align-items:center;justify-content:center;font-size:15px;border:2px solid var(--emo-lacivert)}
.rh-kart-govde{padding:14px 16px 16px;display:flex;flex-direction:column;gap:8px}
.rh-kart-govde span{height:10px;border-radius:5px;background:#e3d9c6}
.rh-kart-govde span.kisa{width:60%}
.rh-cark{position:relative;height:100%;aspect-ratio:1}
.rh-cark img{width:100%;height:100%;animation:rhCark 4s cubic-bezier(.15,.8,.2,1) infinite}
@keyframes rhCark{0%{transform:rotate(0)}70%,100%{transform:rotate(750deg)}}
.rh-ibre{position:absolute;top:-6px;left:50%;transform:translateX(-50%);z-index:2;width:0;height:0;
  border-left:12px solid transparent;border-right:12px solid transparent;border-top:22px solid #E8483C;filter:drop-shadow(0 2px 0 var(--emo-lacivert))}
.rh-rozet{height:88%;width:auto;animation:rhRozet 2.4s ease-in-out infinite;filter:drop-shadow(0 10px 16px rgba(0,0,0,.25))}
@keyframes rhRozet{0%,100%{transform:scale(1) rotate(0)}30%{transform:scale(1.1) rotate(-8deg)}60%{transform:scale(1.04) rotate(6deg)}}
.rh-kupa{position:relative;display:flex;align-items:flex-end;gap:2px}
.rh-kupa span{font-size:96px;line-height:1;animation:rhZipla 2s ease-in-out infinite}
.rh-kupa img{width:44px;height:44px;animation:rhZipla 2s ease-in-out infinite}
.rh-kupa img:nth-of-type(2){animation-delay:.2s}.rh-kupa img:nth-of-type(3){animation-delay:.4s}
@media (prefers-reduced-motion:reduce){ .rehber-perde *{animation:none !important} }

/* ── AÇILIŞ: yayıncı imzası akışın içinde (11.10.2026) ──────
   İmza eskiden ekranın dibine sabitlenmişti; düğme sayısı artınca son düğmenin
   üstüne biniyor, düğmeye basılamıyordu. Artık düğmelerden sonra gelir; ekran
   kısaysa logo ve düğmeler küçülür, yine sığmazsa açılış ekranı kaydırılır. */
#e-acilis{overflow-y:auto;overflow-x:hidden;padding-top:max(24px,3.5vh);padding-bottom:max(16px,env(safe-area-inset-bottom,0px))}
#e-acilis .acilis-ust{flex:none}
#e-acilis .acilis-orta{flex:1 0 auto;padding:16px 0 14px;gap:12px}
#e-acilis .yayinci-imza{position:static;flex:none}
#e-acilis .yayinci-imza img{width:min(78px,19vw)}
@media (max-height:860px){
  .emo-logo{width:min(270px,64vw)}
  #e-acilis .slogan{font-size:clamp(17px,4.8vw,20px);margin-top:6px}
  #e-acilis .acilis-orta > .btn{min-height:50px;padding-top:9px;padding-bottom:9px}
  #e-acilis .acilis-orta > .btn:first-child{font-size:19px;min-height:54px}
  #e-acilis .acilis-orta > .dd-acilis-btn{min-height:44px;padding-top:8px;padding-bottom:8px}
}
@media (max-height:700px){
  .emo-logo{width:min(220px,54vw)}
  #e-acilis .slogan{font-size:16px;margin-top:4px}
  #e-acilis .acilis-orta{gap:10px;padding:12px 0 10px}
  #e-acilis .yayinci-imza img{width:min(62px,16vw)}
}

/* ── İLK OYUN REHBERİ (tur.js) ────────────────────────────── */
.tur-kok{position:fixed;inset:0;z-index:8400;pointer-events:none}
.tur-kok[hidden]{display:none}
.tur-engel{position:fixed;pointer-events:auto}
.tur-delik{position:fixed;border-radius:18px;pointer-events:none;
  box-shadow:0 0 0 200vmax rgba(12,10,44,.72),0 0 0 4px var(--emo-turuncu),0 0 24px 8px rgba(255,138,42,.8);
  transition:top .28s ease,left .28s ease,width .28s ease,height .28s ease}
.tur-kok.aydinlik .tur-delik{box-shadow:0 0 0 4px var(--emo-turuncu),0 0 24px 8px rgba(255,138,42,.8)}
.tur-delik::after{content:"";position:absolute;inset:-7px;border-radius:22px;border:3px solid #fff;opacity:0;
  animation:turNabiz 1.4s ease-out infinite}
@keyframes turNabiz{0%{inset:-4px;opacity:.9}100%{inset:-18px;opacity:0}}
.tur-balon{position:fixed;pointer-events:auto;width:min(340px,calc(100vw - 24px));
  background:var(--emo-krem);color:var(--emo-lacivert);font-family:var(--emo-font);
  border:3px solid var(--emo-lacivert);border-radius:20px;padding:12px 14px 10px;box-shadow:var(--emo-golge);
  transition:top .28s ease,left .28s ease;animation:turBalon .3s ease-out}
@keyframes turBalon{from{opacity:0;transform:scale(.94)}to{opacity:1;transform:none}}
.tur-ust{display:flex;gap:10px;align-items:center}
.tur-ust img{width:54px;height:auto;flex:none;filter:drop-shadow(0 3px 5px rgba(0,0,0,.25))}
.tur-ust p{margin:0;font-size:15.5px;font-weight:700;line-height:1.36;text-align:left}
.tur-alt{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:8px}
.tur-atla{background:none;border:none;font:inherit;font-size:13.5px;font-weight:700;color:#6a648c;
  text-decoration:underline;padding:10px 4px;cursor:pointer}
.btn.tur-ileri{font-size:16px;min-height:44px;padding:7px 20px}
.tur-dokun{font-size:26px;line-height:1;margin-right:6px;animation:turDokun 1s ease-in-out infinite}
@keyframes turDokun{0%,100%{transform:translateY(0)}50%{transform:translateY(-7px)}}
@media (prefers-reduced-motion:reduce){ .tur-kok *,.tur-delik::after{animation:none !important;transition:none !important} }
/* ── TAM EKRAN: GÜVENLİ ALAN (11.10.2026) ────────────────────
   viewport-fit=cover ile sayfa ekranın tamamına yayılır. Her ekranın zemini
   kamera çentiğinin ve gezinme çubuğunun altına kadar uzanır (kenarlık saydam,
   zemin kenarlığın altını da boyar); içerik kenarlığın içinde kalır. Ekranların
   kendi iç boşlukları (padding) bu yüzden değişmez. Tarayıcıda değerler 0'dır. */
.ekran{
  border-style:solid;border-color:transparent;
  border-width:env(safe-area-inset-top,0px) env(safe-area-inset-right,0px) env(safe-area-inset-bottom,0px) env(safe-area-inset-left,0px);
}
.tr-gec{bottom:calc(16px + env(safe-area-inset-bottom,0px))}
.kart-perde,.cark-perde{padding-top:env(safe-area-inset-top,0px);padding-bottom:env(safe-area-inset-bottom,0px)}
.rehber-perde{padding-top:calc(16px + env(safe-area-inset-top,0px));padding-bottom:calc(16px + env(safe-area-inset-bottom,0px))}