/* ELLE SAYILAR: düğme48px (istenen>=44), kenar8px, ipucu azami300px,
 * z-index900; yazı28/14px, satır1/1.4, yuvarlatma12px, kenarlık1px,
 * genişlik payı16px, gölge0/2/8px, odak3px+2px; renkler mevcut koyu HUD/krem.
 * İhtiyaç gerçek viewport akışıdır,
 * içerik kesme tavanı yok. ?ekran=0 kaldırır. Telefon80MB ÖLÇMEDİM. */
:root[data-pk-ekran="1"], :root[data-pk-ekran="1"] body,
:root[data-pk-ekran="1"] body :is(button,a,[role="button"],[onclick],.key,.pill,.cocuk,.options>*) {
  touch-action: manipulation !important;
}
:root[data-pk-ekran="1"] body :is(canvas,#world,#joystick,#kk-oyun-kol,#kk-gaz,#dumen) {
  touch-action: none !important;
}
:root[data-pk-ekran="1"] .pk-tamekran,
:root[data-pk-ekran="1"] .pk-kapat {
  box-sizing:border-box; min-width:48px !important; min-height:48px !important;
  padding:0 !important; font:28px/1 system-ui !important; cursor:pointer;
  border:1px solid #aabbb7; border-radius:12px; background:#fffbed; color:#183d46;
}
:root[data-pk-ekran="1"] .pk-tamekran:not(.pk-hud) {
  position:fixed; right:max(8px,env(safe-area-inset-right)); top:max(8px,env(safe-area-inset-top)); z-index:900;
}
/* 28 Eki (müdür, birleşim kapısı): konu kartı açıkken sağ üstteki ⛶ kartın × düğmesinin üstüne biniyordu (dikeyde 853 px fark).
   Kart açıkken ⛶ ve ipucu gizlenir; kart kapanınca geri gelir. */
:root[data-pk-ekran="1"] body:has(.pk-acik) :is(.pk-tamekran:not(.pk-hud), .pk-ekran-ipucu) { display:none !important; }
:root[data-pk-ekran="1"] .pk-tamekran.pk-hud { flex-shrink:0; }
:root[data-pk-ekran="1"] .pk-ekran-ipucu {
  box-sizing:border-box; position:fixed; right:max(8px,env(safe-area-inset-right));
  top:max(8px,env(safe-area-inset-top)); z-index:900; display:flex; align-items:center;
  max-width:min(300px,calc(100% - 16px)); padding-left:8px; gap:8px;
  background:#183d46; color:#fffbed; border:1px solid #fffbed; border-radius:12px;
  font:14px/1.4 system-ui; box-shadow:0 2px 8px #0003;
}
:root[data-pk-ekran="1"] :is(.pk-tamekran,.pk-kapat):focus-visible { outline:3px solid #16776c; outline-offset:2px; }
/* 1 Kas: ders ekranının üst çubuğu ⛶ düğmesinin altına girmesin (390 px'te ders adı düğmeyle örtüşüyordu). Düğme 48 px + 8 px kenar. */
:root[data-pk-ekran="1"] #screen-game .topbar { padding-right:60px; box-sizing:border-box; }
/* 2 Kas (d228): soru ekranı kayınca sabit ⛶ soru metnini örtüyordu; kaymışken soru ekranında gizlenir, başa dönünce gelir. */
:root[data-pk-ekran="1"][data-pk-kaydi="1"] body:has(#screen-game.active) .pk-tamekran:not(.pk-hud) { opacity:0; pointer-events:none; }
@media (prefers-reduced-motion: no-preference) { :root[data-pk-ekran="1"] .pk-tamekran:not(.pk-hud) { transition:opacity .2s; } }
/* 2 Kas: Profilim haritada hep elde olsun. Harita açılışta çocuğun haftasına kaydığı için üst çubuk ekranın ~850 px üstünde kalıyordu,
   en üstte de düğme ⛶ altına giriyordu (375 px'te 40 px). Sağ alta sabitlenir, üst çubuk ⛶ payını alır, konu kartı açıkken gizlenir (28 Eki ⛶ ile aynı gerekçe). */
:root[data-pk-ekran="1"] #pr-dug {
  position:fixed; right:max(8px,env(safe-area-inset-right)); bottom:max(12px,env(safe-area-inset-bottom)); z-index:890;
  box-sizing:border-box; width:56px; height:56px; padding:4px; border-radius:50%; background:#fffbed; border:1px solid #aabbb7; box-shadow:0 2px 8px #0003;
}
:root[data-pk-ekran="1"] #screen-map .topbar { padding-right:60px; box-sizing:border-box; }
:root[data-pk-ekran="1"] body:has(.pk-acik) #pr-dug { display:none !important; }
/* `.screen` `both` dolgusu giriş bitince de birim dönüşüm bırakır; fixed düğme o yüzden ekrana değil haritaya bağlanıyordu. */
:root[data-pk-ekran="1"] #screen-map { animation-fill-mode:backwards; }
/* 2 Kas: Müzik düğmesi ⛶ altında kalıyordu (44 px örtüşme, "Müzik ka" görünüyordu). Satır içi `right` yüzünden !important.
   Dar ekranda yalnız ♫ kalır, yoksa giriş başlığının üstüne biner; kapalıyken soluk durur, adı aria'da kalır. */
/* 13 Kas (d248 ④): ⛶ güvenli alana inerken müzik düğmesi 12 px'te kalıyor, tam ekranda kamera deliği bandında ve ⛶ ile hizasız duruyordu.
   ⛶ ile aynı kuralla iner (⛶ + 4 px; güvenli alan 0 iken eskisi gibi 12 px). */
:root[data-pk-ekran="1"] #at-ders-muzik { right:64px !important; top:calc(max(8px,env(safe-area-inset-top)) + 4px) !important; }
@media (max-width:560px) {
  #at-ders-muzik { box-sizing:border-box; width:48px; min-height:48px; padding:0; font-size:0; display:flex; align-items:center; justify-content:center; }
  #at-ders-muzik::before { content:'♫'; font-size:20px; line-height:1; }
  #at-ders-muzik[aria-pressed="false"] { opacity:.65; }
}