/* SAP Demo sayfası: site.css üzerine yalnızca oyun alanı düzeni */
html, body.demo-sayfa { height: 100%; }
body.demo-sayfa { background: var(--siyah); overflow: hidden; }
.demo-etiket { cursor: default; }
#demoAlan { position: relative; height: calc(100dvh - var(--header)); }
#oyunKutu { position: absolute; inset: 0; background: #262b44; }
#oyunKutu iframe { display: block; width: 100%; height: 100%; border: 0; }
#oyunKutu:fullscreen { width: 100vw; height: 100vh; }
.yatay-ipucu { display: none; }

@media (max-width: 900px) {
  .demo-sayfa .bar-sag { gap: 6px; }
}
@media (max-width: 640px) {
  .demo-sayfa .logo img { height: 30px; }
  .demo-sayfa .ust-btn { padding: 0 9px; }
  .demo-sayfa .ust-btn .yazi { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
}
@media (max-width: 380px) {
  .demo-sayfa .demo-etiket { display: none; }
}
/* Dikey telefonda oyun alanı yatay oranlı tutulur, altına yönlendirme notu çıkar */
@media (orientation: portrait) and (max-width: 1024px) {
  #oyunKutu { inset: 0 0 auto; height: auto; aspect-ratio: 16 / 10; }
  .yatay-ipucu { display: block; position: absolute; left: 16px; right: 16px; top: calc(100vw * .625 + 16px); margin: 0; padding: 10px 12px; color: var(--acik); border: 2px dashed var(--gri); font: 600 13px/1.5 'IBM Plex Mono', monospace; text-align: center; }
}
/* Kısa yatay ekran (telefon yatay): üst bar daralır, oyun alanı büyür */
@media (max-height: 500px) and (orientation: landscape) {
  .demo-sayfa { --header: 44px; }
  .demo-sayfa .logo img { height: 26px; }
  .demo-sayfa .ust-btn { height: 30px; }
}