/* Telefon düzeni (genişlik ≤ 760 px): ince üst çubuk, kaydırılabilir meydan, alt menü, tam ekran pencereler, açılır sohbet.
   body.telefon sınıfını web/telefon.js ekler. Masaüstü düzenine dokunmaz. */
body.telefon { --b: 14px; --ust-h: 2.5rem; --alt-h: 3.6rem; }
body.telefon #ust label.ayar { display: none; }
body.telefon #ust { top: calc(var(--ust-h) + 4px); left: 4px; z-index: 11; }
body.telefon #ust #geri { font-size: 13px; padding: 3px 8px; }

/* Üst çubuk: sadece göstergeler, tek satır */
body.telefon #hud { top: 0; left: 0; right: 0; height: var(--ust-h); padding: 0 .4em; gap: .3em; flex-wrap: nowrap; justify-content: space-between; background: #1d1712; border-bottom: .12em solid #6b4a2c; font-size: 13px; }
body.telefon #hud button { display: none; }
body.telefon #hud .bilgi { padding: .2em .4em; gap: .25em; white-space: nowrap; }
body.telefon #hud .xpcubuk { width: 2.8em; }
body.telefon #hud .simge { width: 1.1em; height: 1.1em; }

/* Meydan: yüksekliği doldurur, yatay kaydırılır */
body.telefon #sahne { top: var(--ust-h) !important; bottom: var(--alt-h) !important; justify-content: flex-start !important; align-items: stretch !important; overflow-x: auto; overflow-y: hidden; -webkit-overflow-scrolling: touch; scrollbar-width: none; }
body.telefon #sahne::-webkit-scrollbar { display: none; }

/* Alt menü */
#altmenu { display: none; }
body.telefon #altmenu { display: grid; grid-template-columns: repeat(5, 1fr); position: fixed; left: 0; right: 0; bottom: 0; height: var(--alt-h); z-index: 30; background: #2b1a12; border-top: .15em solid #c98a2e; }
#altmenu button { all: unset; display: grid; place-items: center; align-content: center; gap: .1em; color: #f5e8c8; font: 12px Georgia, serif; cursor: pointer; position: relative; }
#altmenu button b { font-size: 1.45em; line-height: 1; font-weight: normal; }
#altmenu button.acik { background: #4a3020; }
#altmenu button .sayi { position: absolute; top: .3em; right: 22%; min-width: 1.3em; padding: 0 .25em; border-radius: .7em; background: #c0463a; color: #fff; font-size: 10px; line-height: 1.3em; text-align: center; }

/* Sohbet: kapalıyken gizli, alt menüden açılır (tam ekran) */
body.telefon #sohbet { display: none; bottom: var(--alt-h) !important; top: var(--ust-h); height: auto !important; z-index: 29; }
body.telefon.sohbet-acik #sohbet { display: flex; }
body.telefon.sohbet-acik #sohbet .govde, body.telefon.sohbet-acik #sohbet .alt { display: flex !important; }

/* Pencereler: üst çubuk ile alt menü arasında tam ekran, tek sütun */
body.telefon .ui-katman { top: var(--ust-h) !important; bottom: var(--alt-h) !important; align-items: stretch !important; }
body.telefon .ui-katman .pencere { width: 100% !important; max-width: 100% !important; max-height: none !important; height: 100%; box-sizing: border-box; overflow-y: auto; border-width: calc(var(--b) * .8); }
body.telefon .ui-katman .pencere > div { width: auto !important; max-width: 100%; }
body.telefon .pencere [style*="grid-template-columns"] { grid-template-columns: 1fr !important; }
body.telefon .pencere h2 { flex-wrap: wrap; font-size: 1.15em; }
body.telefon .dukkan, body.telefon .envanter, body.telefon .profil { grid-template-columns: 1fr !important; width: auto !important; }
body.telefon .dukkan .sol { display: flex; gap: .6em; align-items: center; }
body.telefon .dukkan .sol img.portre { width: 4em; height: 4em; }
body.telefon .sekmeler { flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; }
body.telefon .sekmeler .sekme { flex: none; }
body.telefon .ui-katman .pencere .kapat { position: sticky; top: 0; float: right; z-index: 2; }
body.telefon .diyalog { width: 96vw !important; bottom: calc(var(--alt-h) + .6em) !important; font-size: 14px; }
body.telefon #sayac { top: var(--ust-h) !important; bottom: var(--alt-h) !important; }
body.telefon #sayac .panel { bottom: 1em !important; width: 94vw; }
body.telefon #sayac .zaman { font-size: 2.2em; }
body.telefon .oyun-uyari { top: calc(var(--ust-h) + .4em); right: .4em; left: .4em; max-width: none; }
body.telefon .toren-ic { width: 94vw; }
body.telefon .duello-kahraman { width: 5.5em; height: 5.5em; }
body.telefon .duello-ust { grid-template-columns: 1fr auto 1fr; gap: .3em; }
body.telefon .kuyu-sahne { height: 10em; }
body.telefon .ipucu-kutu { left: .5em !important; right: .5em; top: auto !important; bottom: calc(var(--alt-h) + .5em); max-width: none; font-size: 13px; }
body.telefon #hud .kese-sinir { display: none; }
body.telefon .envanter > *, body.telefon .dukkan > *, body.telefon .profil > *, body.telefon .pencere [style*="grid-template-columns"] > * { min-width: 0; }
body.telefon .ui-katman .pencere { overflow-x: hidden; padding: .7em .45em .5em; }
body.telefon .kusam { max-width: 24em; margin: 0 auto; }

/* Mahzen canlı izleme (telefon): üst çubuk ile alt menü arası; zaman şeridi üstte, sahne ortada, günlük altta tam genişlik */
body.telefon #mahzenCanli { top: var(--ust-h) !important; bottom: var(--alt-h) !important; }
body.telefon #mahzenCanli > canvas { top: 4.2em !important; bottom: auto !important; width: 100% !important; height: auto !important; }
body.telefon #mahzenCanli #mc-zaman { font-size: .72em !important; }
body.telefon #mahzenCanli #mc-gunluk { left: .3em !important; right: .3em !important; width: auto !important; bottom: 3em !important; max-height: 38% !important; font-size: 13px !important; }
body.telefon #mahzenCanli > div:last-child { left: .3em !important; bottom: .3em !important; }
body.telefon #mahzenCanli #mc-ozet { width: 94vw !important; max-height: 80% !important; }