/* [29.10 v2] Mobil uygulama — onaylı taslak (canlı renkler, yatay). Renkler panelden: sayfa başındaki değişkenler (--zemin1 … --menu).
   Normal mobil uygulama davranışı: tam ekran, kaydırma yok, yakınlaştırma / yazı seçme / dokunma parlaması / çekip yenileme yok. Simgeler PNG dosyası. */
@font-face { font-family: 'Lilita One'; font-style: normal; font-weight: 400; font-display: swap; src: url(/static/fonts/lilita-latinext.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: 'Lilita One'; font-style: normal; font-weight: 400; font-display: swap; src: url(/static/fonts/lilita-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; }
@font-face { font-family: 'Nunito'; font-style: normal; font-weight: 600 900; font-display: swap; src: url(/static/fonts/nunito-latinext.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: 'Nunito'; font-style: normal; font-weight: 600 900; font-display: swap; src: url(/static/fonts/nunito-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 { --cizgi: rgba(255,255,255,.14); --mavi: #2bb8ff; --yesil: #29e39a; --kirmizi: #ff4d6d; --mor: #a76bff;
  --baslik: 'Lilita One', 'Nunito', system-ui, sans-serif; --govde: 'Nunito', system-ui, -apple-system, 'Segoe UI', sans-serif; color-scheme: dark; }
* { box-sizing: border-box; }
html, body { margin: 0; height: 100%; height: 100dvh; overflow: hidden; overscroll-behavior: none; }
body { background: var(--zemin2); color: var(--yazi); font-family: var(--govde); -webkit-tap-highlight-color: transparent; -webkit-touch-callout: none; user-select: none; -webkit-user-select: none; touch-action: manipulation; -webkit-text-size-adjust: 100%; }
input, textarea { user-select: text; -webkit-user-select: text; }
a { color: inherit; text-decoration: none; }
button, input, select, textarea { font: inherit; color: inherit; }
button { cursor: pointer; }
:focus-visible { outline: 3px solid var(--vurgu1); outline-offset: 2px; }
.sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
img.ik { display: block; flex: none; }

.app { position: fixed; inset: 0; display: flex; flex-direction: column; background: radial-gradient(ellipse 90% 80% at 50% 0%, var(--zemin1), var(--zemin2));
  padding: env(safe-area-inset-top, 0px) env(safe-area-inset-right, 0px) 0 env(safe-area-inset-left, 0px); }
.app::before { content: ""; position: absolute; inset: 0; pointer-events: none; opacity: .07;
  background-image: radial-gradient(circle at 20% 30%, #fff 1.5px, transparent 2px), radial-gradient(circle at 70% 60%, #fff 1px, transparent 1.5px), radial-gradient(circle at 40% 85%, #fff 1.2px, transparent 2px);
  background-size: 120px 90px, 90px 110px, 150px 130px; }

/* Üst çubuk: geri + başlık her zaman üstte */
.ust-cubuk { position: relative; z-index: 3; height: 54px; flex: none; display: flex; align-items: center; gap: 10px; padding: 0 14px; background: linear-gradient(rgba(10,6,40,.55), rgba(10,6,40,0)); }
.geri { width: 40px; height: 40px; flex: none; border: 0; border-radius: 14px; background: linear-gradient(#5b4bd6, #3a2da8); display: grid; place-items: center; box-shadow: 0 3px 0 #22196b; }
.sayfa-baslik { margin: 0; font: 400 21px var(--baslik); letter-spacing: .4px; text-shadow: 0 2px 0 rgba(0,0,0,.35); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; min-width: 0; }
.sayfa-baslik small { font: 800 12px var(--govde); color: var(--soluk); margin-left: 6px; text-shadow: none; }
.bosluk { flex: 1; }
.cip-hap { display: flex; align-items: center; gap: 6px; height: 36px; padding: 0 4px 0 6px; border-radius: 18px; background: rgba(8,4,36,.55); border: 1px solid var(--cizgi); font-weight: 900; font-size: 14px; flex: none; }
.cip-hap.yalin { padding-right: 12px; }
.cip-hap .arti { width: 28px; height: 28px; border-radius: 50%; display: grid; place-items: center; background: linear-gradient(#5df0a8, #18b873); box-shadow: 0 2px 0 #0b7a49; }
.kim-kutu { display: flex; align-items: center; gap: 8px; background: rgba(8,4,36,.55); border: 1px solid var(--cizgi); border-radius: 26px; padding: 3px 12px 3px 3px; flex: none; min-width: 0; }
.kim-kutu .ad { font-weight: 900; font-size: 13px; max-width: 110px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; display: block; }
.sev { position: absolute; bottom: -4px; left: 50%; transform: translateX(-50%); background: linear-gradient(var(--vurgu1), var(--vurgu2)); color: var(--vurguYazi); font-size: 9px; font-weight: 900; padding: 0 5px; border-radius: 6px; }

/* Düğmeler */
.btn { border: 0; border-radius: 14px; height: 40px; padding: 0 16px; font-weight: 900; font-size: 14px; display: inline-flex; align-items: center; justify-content: center; gap: 7px; color: #fff; white-space: nowrap; }
.btn.altin { background: linear-gradient(var(--vurgu1), var(--vurgu2)); color: var(--vurguYazi); box-shadow: 0 3px 0 rgba(120,60,0,.75); }
.btn.mavi { background: linear-gradient(#58ccff, #1a8ff0); box-shadow: 0 3px 0 #0d5ea8; }
.btn.yesil { background: linear-gradient(#5df0a8, #18b873); color: #063b23; box-shadow: 0 3px 0 #0b7a49; }
.btn.kirmizi { background: linear-gradient(#ff7a90, #e8304f); box-shadow: 0 3px 0 #9e1a33; }
.btn.mor { background: linear-gradient(#b98bff, #7a45f0); box-shadow: 0 3px 0 #4e23ad; }
.btn.cam { background: rgba(255,255,255,.12); border: 1px solid var(--cizgi); }
.btn.kucuk { height: 30px; padding: 0 11px; font-size: 12px; border-radius: 10px; }
.yuv { width: 40px; height: 40px; border-radius: 50%; border: 0; display: grid; place-items: center; flex: none; position: relative; }
.yuv.cam { background: rgba(255,255,255,.12); border: 1px solid var(--cizgi); }
.roz { position: absolute; top: -4px; right: -4px; min-width: 18px; height: 18px; padding: 0 4px; border-radius: 9px; background: var(--kirmizi); color: #fff; font-size: 10px; font-weight: 900; display: grid; place-items: center; border: 2px solid #1d1460; line-height: 1; }

/* İçerik ve paneller */
.icerik { position: relative; z-index: 1; flex: 1; min-height: 0; padding: 4px 14px 10px; display: flex; gap: 12px; }
.pano { background: linear-gradient(var(--kart2), var(--kart)); border: 1px solid var(--cizgi); border-radius: 18px; box-shadow: 0 6px 18px rgba(0,0,0,.25); }
.av { width: 40px; height: 40px; border-radius: 50%; display: grid; place-items: center; font-weight: 900; color: #2a1a00; font-size: 14px; flex: none; position: relative; box-shadow: inset 0 -3px 0 rgba(0,0,0,.18); overflow: visible; }
.av img { width: 100%; height: 100%; border-radius: 50%; object-fit: cover; }
.av .nokta { position: absolute; right: -1px; bottom: -1px; width: 11px; height: 11px; border-radius: 50%; border: 2px solid var(--kart); }
.n-yesil { background: var(--yesil); } .n-sari { background: var(--vurgu1); } .n-gri { background: #8d88b8; } .n-kirmizi { background: var(--kirmizi); }
.satir { display: flex; align-items: center; gap: 10px; padding: 8px 10px; border-radius: 14px; min-width: 0; }
.satir .yazilar { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 1px; }
.satir .ad { font-weight: 900; font-size: 14px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.satir .alt { font-size: 12px; font-weight: 700; color: var(--soluk); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.satir.yeni { background: rgba(255,219,77,.08); }
.liste2 { flex: 1; padding: 6px; display: grid; grid-template-columns: 1fr 1fr; align-content: start; column-gap: 6px; row-gap: 2px; min-height: 0; overflow: hidden; }
.etiket { font-size: 11px; font-weight: 900; color: var(--soluk); letter-spacing: .5px; text-transform: uppercase; }
.bos-durum { grid-column: 1 / -1; padding: 30px 10px; text-align: center; font-weight: 800; color: var(--soluk); }

/* Alt menü (ana sayfalar) */
.alt-menu { position: relative; z-index: 3; height: calc(58px + env(safe-area-inset-bottom, 0px)); padding-bottom: env(safe-area-inset-bottom, 0px); flex: none; display: flex; align-items: center; justify-content: center; gap: 4px;
  background: linear-gradient(rgba(10,6,40,.15), var(--menu)); border-top: 1px solid var(--cizgi); padding-left: 14px; padding-right: 14px; }
.sekme { position: relative; height: 46px; min-width: 100px; border: 0; border-radius: 14px; background: none; color: var(--soluk); display: flex; align-items: center; justify-content: center; gap: 7px; font-weight: 900; font-size: 13px; padding: 0 10px; }
.sekme.on { background: linear-gradient(var(--vurgu1), var(--vurgu2)); color: var(--vurguYazi); box-shadow: 0 3px 0 rgba(120,60,0,.75); }
.sekme .roz { top: 2px; right: 8px; border-color: #160f4a; }
.sekme.izle { color: #fff; background: linear-gradient(#b98bff, #7a45f0); box-shadow: 0 3px 0 #4e23ad; }
.sekme img.koyu { display: none; } .sekme.on img.acik { display: none; } .sekme.on img.koyu { display: block; }

/* Ana ekran */
.oyun-serit { flex: 1; min-width: 0; display: flex; gap: 10px; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; padding-bottom: 6px; }
.oyun-serit::-webkit-scrollbar { display: none; }
.okart2 { flex: 0 0 150px; scroll-snap-align: start; border-radius: 20px; box-shadow: 0 6px 0 rgba(0,0,0,.3), inset 0 2px 0 rgba(255,255,255,.35); display: flex; flex-direction: column; overflow: hidden; }
.okart2 .res { flex: 1; min-height: 0; padding: 8px 6px 0; display: grid; place-items: center; }
.okart2 .res svg, .okart2 .res img { width: 100%; height: 100%; object-fit: contain; }
.okart2 .alt { background: rgba(0,0,0,.28); padding: 7px 6px 8px; display: flex; flex-direction: column; align-items: center; gap: 1px; }
.okart2 .alt b { font: 400 19px var(--baslik); letter-spacing: .4px; text-shadow: 0 2px 0 rgba(0,0,0,.35); white-space: nowrap; }
.okart2 .alt span { font-size: 11px; font-weight: 800; opacity: .92; }
.sag-sutun { width: 170px; flex: none; display: flex; flex-direction: column; gap: 9px; }
.bolum { position: relative; flex: 1; min-height: 0; border-radius: 20px; overflow: hidden; display: flex; flex-direction: column; justify-content: flex-end; align-items: flex-start; gap: 2px; padding: 10px 12px; box-shadow: 0 6px 0 rgba(0,0,0,.3), inset 0 2px 0 rgba(255,255,255,.35); background-size: cover; background-position: center; }
.bolum .ust-ik { position: absolute; top: 9px; right: 10px; width: 34px; height: 34px; border-radius: 50%; background: rgba(255,255,255,.25); display: grid; place-items: center; }
.bolum b { font: 400 17px var(--baslik); letter-spacing: .3px; text-shadow: 0 2px 0 rgba(0,0,0,.3); line-height: 1.05; }
.bolum .y { font-size: 11px; font-weight: 800; line-height: 1.25; text-shadow: 0 1px 0 rgba(0,0,0,.3); }
.bolum .etk { position: absolute; top: 9px; left: 10px; background: rgba(0,0,0,.3); border-radius: 8px; padding: 1px 8px; font-size: 10px; font-weight: 900; letter-spacing: .5px; }
.cevrimici { text-align: center; font-size: 11px; font-weight: 800; color: var(--soluk); flex: none; }

/* Pencere (onay, masa aç, çip yolla) */
.ortu { position: fixed; inset: 0; z-index: 50; background: rgba(6,3,28,.62); display: grid; place-items: center; }
.ortu[hidden] { display: none; }
.pencere { position: relative; border-radius: 24px; background: linear-gradient(#3d32a6, #261d7a); border: 2px solid rgba(255,219,77,.75); box-shadow: 0 18px 50px rgba(0,0,0,.55), inset 0 1px 0 rgba(255,255,255,.2); padding: 28px 24px 46px; text-align: center; }
.pencere-baslik { position: absolute; left: 50%; top: -20px; transform: translateX(-50%); padding: 6px 26px; border-radius: 16px; background: linear-gradient(var(--vurgu1), var(--vurgu2)); color: var(--vurguYazi); font: 400 22px var(--baslik); letter-spacing: .5px; box-shadow: 0 4px 0 rgba(120,60,0,.75); white-space: nowrap; }
.alt-dugmeler { position: absolute; left: 50%; bottom: -31px; transform: translateX(-50%); display: flex; gap: 22px; }
.yuvarlak-d { width: 62px; height: 62px; border-radius: 50%; border: 3px solid rgba(255,255,255,.85); display: grid; place-items: center; box-shadow: 0 5px 0 rgba(0,0,0,.35); }
.yuvarlak-d.onay { background: linear-gradient(#5df0a8, #15b06c); }
.yuvarlak-d.ret { background: linear-gradient(#ff7a90, #e2294a); }

/* Form */
.giris-kutu { width: 100%; height: 42px; border-radius: 12px; border: 1px solid var(--cizgi); background: rgba(6,3,30,.45); color: var(--yazi); padding: 0 14px; font-weight: 800; font-size: 14px; }
.giris-kutu::placeholder { color: var(--soluk); opacity: .75; }

/* Mesajlaşma */
.sohbet-akis { flex: 1; min-height: 0; overflow-y: auto; display: flex; flex-direction: column; gap: 6px; scrollbar-width: none; padding: 2px; }
.sohbet-akis::-webkit-scrollbar { display: none; }
.sohbet-akis > :first-child { margin-top: auto; }
.balon { max-width: 62%; padding: 8px 13px; font-weight: 800; font-size: 14px; box-shadow: 0 2px 0 rgba(0,0,0,.2); overflow-wrap: anywhere; user-select: text; -webkit-user-select: text; }
.balon.ben { align-self: flex-end; border-radius: 18px 18px 4px 18px; background: linear-gradient(var(--balon1), var(--balon2)); color: var(--vurguYazi); }
.balon.o { align-self: flex-start; border-radius: 18px 18px 18px 4px; background: rgba(255,255,255,.14); }
.balon img.sm { width: 26px; height: 26px; vertical-align: middle; }
.balon .zaman { display: block; font-size: 10px; font-weight: 800; opacity: .6; margin-top: 2px; text-align: right; }
.gun-ayrac { align-self: center; font-size: 11px; font-weight: 900; color: var(--soluk); background: rgba(0,0,0,.25); border-radius: 8px; padding: 2px 10px; }
.sistem-satir { align-self: center; font-size: 12px; font-weight: 900; color: var(--vurgu1); }
.emoji-sira { display: flex; gap: 5px; flex: none; overflow-x: auto; scrollbar-width: none; }
.emoji-sira button { width: 42px; height: 36px; flex: none; border: 0; border-radius: 12px; background: rgba(255,255,255,.1); display: grid; place-items: center; }
.emoji-sira img { width: 26px; height: 26px; object-fit: contain; }
.yaz-satir { display: flex; gap: 8px; flex: none; }
@keyframes titre { 0%,100% { transform: translateX(0) } 20% { transform: translateX(-7px) } 40% { transform: translateX(7px) } 60% { transform: translateX(-5px) } 80% { transform: translateX(5px) } }
.titre { animation: titre .5s; }

/* Bildirim balonu */
.bilgi-balon { position: fixed; z-index: 60; left: 50%; top: calc(62px + env(safe-area-inset-top, 0px)); transform: translateX(-50%); display: flex; align-items: center; gap: 10px; padding: 9px 16px 9px 12px; border-radius: 16px; background: rgba(12,8,44,.94); border: 1px solid var(--cizgi); font-weight: 800; font-size: 13px; box-shadow: 0 10px 26px rgba(0,0,0,.45); white-space: nowrap; }
.bilgi-balon.kotu { border-color: rgba(255,77,109,.7); }
.cubuk { height: 8px; border-radius: 4px; background: rgba(0,0,0,.3); overflow: hidden; }
.cubuk i { display: block; height: 100%; border-radius: 4px; background: linear-gradient(90deg, var(--vurgu1), var(--vurgu2)); }

/* Yan çevir uyarısı (uygulama hep yatay) */
.cevir { display: none; }
@media (orientation: portrait) and (max-width: 700px) {
  .cevir { display: flex; position: fixed; inset: 0; z-index: 100; flex-direction: column; align-items: center; justify-content: center; gap: 10px; background: var(--zemin2); text-align: center; padding: 20px; }
  .cevir b { font: 400 24px var(--baslik); }
}
@media (max-height: 350px) { .ust-cubuk { height: 48px; } .alt-menu { height: calc(52px + env(safe-area-inset-bottom, 0px)); } .sekme { height: 40px; } .okart2 .alt b { font-size: 17px; } }
@media (prefers-reduced-motion: reduce) { .titre { animation: none; } }
/* Yuvarlak resim boyutları ve renkleri (satır içi stil yok) */
.av28 { width: 28px; height: 28px; font-size: 10px; } .av34 { width: 34px; height: 34px; font-size: 12px; } .av40 { width: 40px; height: 40px; font-size: 14px; }
.av60 { width: 60px; height: 60px; font-size: 22px; } .av86 { width: 86px; height: 86px; font-size: 30px; } .av100 { width: 100px; height: 100px; font-size: 34px; }
.avr0 { background: #ffd34d; } .avr1 { background: #7fe0c4; } .avr2 { background: #ffb0a0; } .avr3 { background: #9db4ff; } .avr4 { background: #d3b6ff; } .avr5 { background: #ff9ccf; } .avr6 { background: #8ff07a; }
.av img { background: #2a2178; }

/* ── Sayfa parçaları (mesajlar, bildirimler, izle, turnuva, duyurular, hediye, mağaza, sıralama, profil) ── */
.roz.roz-satir { position: static; border-color: transparent; }
.satir .ad.ad-uzun { white-space: normal; font-size: 13px; line-height: 1.25; }
.satir form { margin: 0; flex: none; }
.arti-cip { color: var(--yesil); font-weight: 900; flex: none; }
.etiket { flex: none; }
.dikey { flex-direction: column; }
.ortala { text-align: center; }
.orta-icerik { flex-direction: column; align-items: center; justify-content: center; gap: 12px; text-align: center; }
.buyuk-ikon { width: 112px; height: 112px; border-radius: 30px; display: grid; place-items: center; box-shadow: 0 6px 0 rgba(0,0,0,.35), inset 0 2px 0 rgba(255,255,255,.35); }
.mor-zemin { background: linear-gradient(160deg, #b98bff, #7a45f0); }
.buyuk-yazi { font: 400 26px var(--baslik); letter-spacing: .3px; }
.soluk-yazi { font-weight: 800; color: var(--soluk); font-size: 13px; line-height: 1.45; max-width: 560px; margin: 0; }
.buyuk-d { height: 46px; padding: 0 30px; font-size: 16px; }
.soluk-d { opacity: .8; }
.sabit-genis { flex: 0 0 330px; cursor: default; }
.ust-ik.ust-ik-buyuk { width: 52px; height: 52px; }
.b-buyuk { font-size: 26px !important; }
.bilgi-tablo { flex: 1; padding: 14px; display: flex; flex-direction: column; gap: 8px; min-width: 0; }
.bilgi-satir { display: flex; justify-content: space-between; gap: 10px; font-size: 14px; font-weight: 800; padding: 3px 0; border-bottom: 1px solid rgba(255,255,255,.07); }
.bilgi-satir span:first-child { color: var(--soluk); }
.duyuru-izgara { flex: 1; padding: 8px; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; align-content: start; overflow: hidden; }
.duyuru { border-radius: 16px; overflow: hidden; background: rgba(0,0,0,.2); display: flex; flex-direction: column; min-width: 0; }
.duyuru-res { height: 92px; display: grid; place-items: center; }
.duyuru-yazi { padding: 8px 10px; display: flex; flex-direction: column; gap: 3px; }
.duyuru-yazi b { font: 400 16px var(--baslik); }
.duyuru-yazi span { font-size: 12px; font-weight: 700; color: var(--soluk); line-height: 1.35; }
.duyuru-yazi small { font-size: 11px; font-weight: 800; opacity: .7; }
.hediye-sira { display: flex; gap: 10px; }
.hediye-gun { width: 92px; height: 120px; border-radius: 18px; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 6px; background: linear-gradient(var(--kart2), var(--kart)); border: 1px solid var(--cizgi); box-shadow: 0 5px 0 rgba(0,0,0,.3); }
.hediye-gun b:first-child { font: 400 15px var(--baslik); }
.hediye-gun.bugun { background: linear-gradient(160deg, var(--vurgu1), var(--vurgu2)); color: var(--vurguYazi); border: 3px solid #fff3b0; transform: scale(1.08); }
.magaza-izgara { flex: 1; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; min-height: 0; }
.paket { border-radius: 20px; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 8px; box-shadow: 0 6px 0 rgba(0,0,0,.3), inset 0 2px 0 rgba(255,255,255,.35); }
.paket b { font: 400 22px var(--baslik); }
.m1 { background: linear-gradient(160deg, #5bb0ff, #2a4fd6); } .m2 { background: linear-gradient(160deg, #43d6a6, #0c8263); } .m3 { background: linear-gradient(160deg, #c08bff, #6a2fc9); } .m4 { background: linear-gradient(160deg, #ff9a3c, #e3412a); }
.kursu { width: 330px; flex: none; padding: 10px; display: flex; align-items: flex-end; justify-content: center; gap: 10px; }
.kursu-kisi { display: flex; flex-direction: column; align-items: center; gap: 5px; min-width: 0; }
.kursu-kisi b { font-size: 12px; max-width: 90px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.kursu-blok { width: 88px; border-radius: 14px 14px 4px 4px; display: grid; place-items: center; font: 400 30px var(--baslik); color: #2a1a00; }
.k1 { height: 130px; background: linear-gradient(#ffd34d, rgba(0,0,0,.25)); } .k2 { height: 96px; background: linear-gradient(#c9d4ff, rgba(0,0,0,.25)); } .k3 { height: 76px; background: linear-gradient(#ffb07a, rgba(0,0,0,.25)); }
.sira-liste { flex: 1; padding: 6px; display: flex; flex-direction: column; min-width: 0; }
.sira-no { width: 34px; text-align: center; color: var(--soluk); flex: none; }
.puan { color: var(--vurgu1); flex: none; }
.sen-satir { margin-top: auto; }
.sohbet-ic { flex-direction: column; gap: 6px; padding-bottom: calc(8px + env(safe-area-inset-bottom, 0px)); }
.gonder-d { width: 50px; height: 44px; padding: 0; }
.yaz-satir .giris-kutu { height: 44px; flex: 1; }
.ad { display: block; }
/* Profil */
.profil-sol { width: 430px; flex: none; display: flex; flex-direction: column; gap: 9px; min-height: 0; }
.kimlik-kart { padding: 12px; display: flex; gap: 12px; }
.kimlik-av { display: flex; flex-direction: column; align-items: center; gap: 6px; width: 112px; flex: none; }
.kimlik-bilgi { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 7px; justify-content: center; }
.kimlik-ad { font: 400 22px var(--baslik); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.soluk-yazi.kisa { font-size: 12px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.iki-kutu { display: flex; gap: 8px; }
.btn.sabit { flex: 1; height: 34px; font-size: 14px; cursor: default; }
.yesil-yazi { color: var(--yesil); } .mavi-yazi { color: #9db4ff; } .altin-yazi { color: var(--vurgu1); }
.islem-izgara { padding: 8px; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 6px; }
.islem-izgara form { margin: 0; display: flex; }
.btn.tam { width: 100%; }
.islem-izgara .btn { height: 34px; }
.ist-kart { padding: 8px 10px; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); text-align: center; }
.ist-kart > div + div { border-left: 1px solid var(--cizgi); }
.ist-sayi { display: block; font: 400 26px var(--baslik); }
.profil-sag { flex: 1; min-width: 0; padding: 12px; display: flex; flex-direction: column; gap: 8px; }
.kutu-baslik { font: 400 18px var(--baslik); }
.oyun-ist { display: grid; grid-template-columns: 86px 1fr 92px; align-items: center; gap: 8px; font-size: 13px; font-weight: 800; }
.oyun-ist .soluk-yazi { text-align: right; font-size: 12px; }
.oyun-ist .cubuk { height: 10px; }
/* Pencere içi */
.pencere-480 { width: min(480px, calc(100vw - 32px)); }
.pencere-400 { width: min(400px, calc(100vw - 32px)); display: flex; flex-direction: column; gap: 8px; align-items: center; }
.pencere-kisi { display: flex; align-items: center; gap: 10px; justify-content: center; margin-bottom: 10px; }
.pencere-kisi b, .pencere-soru { font: 400 19px var(--baslik); }
.miktar-satir { display: flex; align-items: center; gap: 10px; justify-content: center; }
.yuv.mor-d { background: linear-gradient(#6a5ae0, #4334b8); box-shadow: 0 3px 0 #2a1f80; }
.miktar-kutu { display: flex; align-items: center; gap: 10px; background: rgba(6,3,30,.5); border: 2px solid rgba(255,219,77,.6); border-radius: 16px; padding: 6px 10px 6px 8px; min-width: 230px; }
.miktar-kutu b { flex: 1; text-align: center; font: 400 28px var(--baslik); color: var(--vurgu1); }
.hizli-sira { display: flex; gap: 6px; justify-content: center; margin: 12px 0 6px; flex-wrap: wrap; }
.secim-izgara { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; width: 100%; }
.secim { display: flex; align-items: center; gap: 8px; background: rgba(0,0,0,.2); border: 1px solid var(--cizgi); border-radius: 12px; padding: 8px 10px; font-weight: 800; font-size: 13px; cursor: pointer; }
.secim:has(input:checked) { background: linear-gradient(var(--vurgu1), var(--vurgu2)); color: var(--vurguYazi); }
.secim input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.kucuk-not { padding: 10px; font-size: 12px; }
/* Arkadaşlar, ayarlar */
.ark-sol { width: 330px; flex: none; padding: 10px; display: flex; flex-direction: column; gap: 8px; min-height: 0; }
.ekle-satir { display: flex; gap: 8px; }
.ekle-satir .giris-kutu { flex: 1; min-width: 0; }
.istek-liste { flex: 1; min-height: 0; overflow-y: auto; scrollbar-width: none; display: flex; flex-direction: column; gap: 2px; }
.ark-sag { overflow-y: auto; scrollbar-width: none; }
.yuv.yuv-kucuk { width: 34px; height: 34px; }
.ayar-sol, .ayar-sag { flex: 1; padding: 10px; display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.anahtar-satir { cursor: pointer; }
.anahtar-kutu { position: absolute; opacity: 0; width: 1px; height: 1px; }
.anahtar { width: 46px; height: 26px; border-radius: 13px; background: rgba(255,255,255,.18); position: relative; flex: none; }
.anahtar::after { content: ""; position: absolute; left: 3px; top: 3px; width: 20px; height: 20px; border-radius: 50%; background: #fff; transition: left .15s; }
.anahtar-kutu:checked + .anahtar { background: linear-gradient(#5df0a8, #18b873); }
.anahtar-kutu:checked + .anahtar::after { left: 23px; }
.anahtar-kutu:focus-visible + .anahtar { outline: 3px solid var(--vurgu1); outline-offset: 2px; }
.ayar-sag form { margin: 0; }
/* Salon seç */
.salon-izgara { flex: 1; display: grid; gap: 12px; min-height: 0; }
.salon-kart { border-radius: 20px; box-shadow: 0 6px 0 rgba(0,0,0,.3), inset 0 2px 0 rgba(255,255,255,.35); display: flex; flex-direction: column; overflow: hidden; min-width: 0; }
.salon-kart.kilitli { filter: grayscale(.6) brightness(.8); }
.salon-ic { flex: 1; min-height: 0; padding: 12px; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 6px; text-align: center; }
.salon-ic b { font: 400 22px var(--baslik); text-shadow: 0 2px 0 rgba(0,0,0,.25); }
.salon-simge { width: 54px; height: 54px; border-radius: 50%; background: rgba(255,255,255,.25); display: grid; place-items: center; overflow: hidden; }
.salon-simge img { width: 100%; height: 100%; object-fit: cover; }
.salon-alt { font-size: 12px; font-weight: 800; opacity: .95; }
.salon-cip { display: flex; align-items: center; gap: 5px; background: rgba(0,0,0,.22); border-radius: 12px; padding: 3px 10px; font-weight: 900; }
.salon-gir { height: 46px; flex: none; display: grid; place-items: center; background: rgba(0,0,0,.25); font: 400 20px var(--baslik); letter-spacing: .5px; }
/* Hesap formları */
.foto-kart { width: 220px; flex: none; padding: 14px; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 10px; }
.form-kart { flex: 1; min-width: 0; padding: 12px 14px; display: flex; flex-direction: column; gap: 8px; }
.form-kart.dar { flex: 0 0 280px; }
.form-izgara { display: grid; grid-template-columns: 1fr 1fr; gap: 8px 10px; }
.alan { display: flex; flex-direction: column; gap: 3px; min-width: 0; }
.alan.genis { grid-column: 1 / -1; }
.alan .giris-kutu { height: 38px; }
select.giris-kutu { appearance: none; -webkit-appearance: none; }
.kirmizi-yazi { color: var(--kirmizi); }
.kaydir-liste { overflow-y: auto; scrollbar-width: none; }
/* Giriş, kayıt */
.giris2 { position: relative; z-index: 1; flex: 1; display: flex; align-items: center; gap: 30px; padding: 10px max(30px, env(safe-area-inset-right, 0px)) 10px max(30px, env(safe-area-inset-left, 0px)); }
.tanit2 { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 10px; }
.logo2 { max-width: 160px; max-height: 80px; object-fit: contain; }
.marka { margin: 0; font: 400 40px var(--baslik); letter-spacing: 1px; text-shadow: 0 4px 0 rgba(20,10,80,.8); line-height: 1; }
.tas-sira { display: flex; gap: 8px; margin-top: 6px; }
.tas2 { width: 30px; height: 44px; border-radius: 8px; background: #fffaf0; display: grid; place-items: center; font: 900 18px var(--govde); box-shadow: 0 4px 0 rgba(0,0,0,.3); }
.t0 { color: #ff9a3c; transform: rotate(-12deg); } .t1 { color: #5bb0ff; transform: rotate(-6deg); } .t2 { color: #43d6a6; } .t3 { color: #c08bff; transform: rotate(6deg); } .t4 { color: #f0b45e; transform: rotate(10deg); } .t5 { color: #ff86bd; transform: rotate(14deg); }
.giris-kart { width: 340px; flex: none; padding: 16px; display: flex; flex-direction: column; gap: 9px; }
.giris-form { display: flex; flex-direction: column; gap: 9px; margin: 0; }
.giris-form .btn { height: 44px; }
.esit { flex: 1; margin: 0; display: flex; }
.giris-alt { display: flex; justify-content: space-between; align-items: center; gap: 10px; font-size: 13px; font-weight: 800; }
.kotu-satir { background: rgba(255,77,109,.15); border-radius: 10px; padding: 6px 10px; border: 0; color: #ffd0d8; }
.ic-form { padding: 0; box-shadow: none; background: none; border: 0; flex: 1; }
.form-izgara.uclu { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.tek-kart { flex: 0 1 460px; width: 460px; }
/* Bağlantı yok */
.baglanti-yok { z-index: 90; background: rgba(6,3,28,.85); }
.baglanti-ic { display: flex; flex-direction: column; align-items: center; gap: 12px; text-align: center; padding: 20px; }
.donen { width: 46px; height: 46px; border-radius: 50%; border: 5px solid rgba(255,255,255,.18); border-top-color: var(--vurgu1); animation: don .9s linear infinite; }
@keyframes don { to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) { .donen { animation: none; } }
/* Alt menü (yalnız ana sayfa) ve çan */
.sekme.simge-sekme { min-width: 56px; padding: 0 14px; }
.zil-kap { position: relative; flex: none; }
.zil-pencere { position: absolute; right: 0; top: 46px; z-index: 40; width: 320px; max-height: min(300px, calc(100vh - 70px)); display: flex; flex-direction: column; padding: 8px; gap: 4px; background: linear-gradient(var(--kart2), var(--kart)); box-shadow: 0 16px 40px rgba(0,0,0,.5); }
.zil-pencere[hidden] { display: none; }
.zil-ust { display: flex; justify-content: space-between; align-items: center; padding: 2px 6px 6px; border-bottom: 1px solid var(--cizgi); }
.zil-ust b { font: 400 16px var(--baslik); }
.zil-liste { overflow-y: auto; scrollbar-width: none; display: flex; flex-direction: column; gap: 2px; min-height: 0; padding-top: 4px; }
.zil-liste .soluk-yazi { padding: 10px 6px; }
.zil-satir { padding: 6px 8px; }
.zil-satir:hover { background: rgba(255,255,255,.06); }
/* Mesaj silme */
.mesaj-islem { position: fixed; z-index: 55; }
.mesaj-islem[hidden] { display: none; }
.balon.secili { outline: 3px solid var(--kirmizi); outline-offset: 2px; }
/* [29.10 v2] Profil sıkı düzen (Mustafa: üst üste binmesin, küçültüp yukarı al) */
.profil-sol { gap: 7px; }
.kimlik-kart { padding: 10px 12px; gap: 10px; align-items: center; }
.kimlik-av { width: 84px; gap: 4px; }
.kimlik-ad { font-size: 20px; }
.kimlik-bilgi { gap: 5px; }
.btn.sabit { height: 30px; font-size: 13px; }
.islem-izgara { padding: 7px; gap: 5px; }
.islem-izgara .btn { height: 32px; }
.ist-kart { padding: 6px 10px; }
.ist-sayi { font-size: 22px; }
@media (max-height: 360px) {
  .profil-sol { gap: 5px; }
  .kimlik-kart { padding: 7px 10px; }
  .kimlik-av { width: 70px; }
  .kimlik-av .av60 { width: 48px; height: 48px; font-size: 18px; }
  .kimlik-av .etiket { display: none; }
  .kimlik-ad { font-size: 18px; }
  .islem-izgara { padding: 5px; gap: 4px; }
  .islem-izgara .btn { height: 29px; }
  .ist-sayi { font-size: 19px; }
  .ist-kart { padding: 4px 10px; }
}
@media (max-height: 360px) { .kimlik-av .btn { height: 26px; padding: 0 8px; font-size: 11px; } .kimlik-av .btn img { width: 13px; height: 13px; } }
/* [29.10] Günlük hediye: alınan günler soluk, düğme alındıysa pasif */
.hediye-gun.alindi { opacity: .5; }
.hediye-gun.bugun.alindi { opacity: 1; filter: saturate(.6); }
.btn[disabled] { opacity: .6; cursor: default; }
/* [29.10 gece] Salon seç penceresi (Mustafa'nın örneği): ortada salon kutusu, solda ✕, sağda ✓; ‹ › ve parmakla salonlar arası geçiş */
.sp-ic { display: flex; align-items: center; justify-content: center; }
.sp-sahne { display: flex; align-items: center; justify-content: center; gap: 18px; width: 100%; }
.sp-yuv { width: 76px; height: 76px; border-radius: 50%; display: grid; place-items: center; flex: none; box-shadow: 0 6px 0 rgba(0,0,0,.35); }
.sp-kirmizi { background: linear-gradient(#ff7a90, #e8304f); border: 4px solid #ffc2cd; }
.sp-yesil { background: linear-gradient(#7df07a, #2fae2c); border: 4px solid #c9f7b8; }
.sp-yesil.kilitli { filter: grayscale(.85) brightness(.75); }
.sp-yuv:active { transform: translateY(3px); box-shadow: 0 3px 0 rgba(0,0,0,.35); }
.sp-kutu { width: min(430px, 100%); background: linear-gradient(var(--kart2), var(--kart)); border: 3px solid var(--vurgu1); border-radius: 24px; padding: 12px 14px 10px; box-shadow: 0 10px 30px rgba(0,0,0,.45); touch-action: pan-y; }
.sp-ust { display: flex; align-items: center; gap: 8px; background: #fbf1d9; border-radius: 16px; padding: 6px; border-bottom: 4px solid var(--sr, #2ecc71); }
.sp-ok { width: 40px; height: 40px; border: 0; border-radius: 12px; background: linear-gradient(#58ccff, #1a8ff0); box-shadow: 0 3px 0 #0d5ea8; display: grid; place-items: center; flex: none; }
.sp-ad { flex: 1; min-width: 0; text-align: center; display: flex; flex-direction: column; }
.sp-ad b { font: 400 24px var(--baslik); color: #3a2200; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.sp-ad span { font-size: 12px; font-weight: 900; color: #8a5a10; }
.sp-satirlar { display: grid; grid-template-columns: auto 1fr; gap: 7px 12px; align-items: center; margin-top: 12px; font-size: 14px; }
.sp-satirlar > span { font-weight: 900; color: var(--soluk); }
.sp-satirlar > b { background: rgba(0,0,0,.35); border-radius: 10px; padding: 5px 10px; text-align: center; display: flex; align-items: center; justify-content: center; gap: 6px; }
.sp-altin { color: var(--vurgu1); }
.sp-uyari { margin-top: 10px; display: flex; align-items: center; gap: 8px; background: rgba(255,77,109,.18); border: 1px solid rgba(255,77,109,.5); border-radius: 12px; padding: 6px 10px; font-size: 12px; font-weight: 900; }
.sp-noktalar { display: flex; justify-content: center; gap: 7px; margin-top: 10px; }
.sp-noktalar span { width: 9px; height: 9px; border-radius: 50%; background: rgba(255,255,255,.28); }
.sp-noktalar span.on { background: var(--vurgu1); }
@media (max-height: 360px) { .sp-yuv { width: 62px; height: 62px; } .sp-satirlar { margin-top: 8px; gap: 5px 10px; } .sp-ad b { font-size: 21px; } .sp-noktalar { margin-top: 6px; } }

/* [29.10 gece] tam ekran kabuğu: sayfalar bu çerçevede değişir, tam ekran düşmez */
.od-kabuk { position: fixed; inset: 0; width: 100%; height: 100%; border: 0; z-index: 2147483000; background: #1d1660; display: block; }

/* [29.10 gece] tam ekranda üst çubuk tarayıcının sol üstteki "tam ekrandan çık ✕" düğmesinin yanından başlar */
html.tam-ekranda .ust-cubuk { padding-left: 64px; }
/* [29.10 gece] Yasal metin sayfası (metin kutu içinde kayar, yazı seçilebilir) ve Kurallar ve gizlilik listesi */
.metin-sayfa { flex: 1; min-height: 0; overflow-y: auto; scrollbar-width: thin; padding: 14px 18px; font-size: 14px; font-weight: 700; line-height: 1.6; user-select: text; -webkit-user-select: text; }
.metin-sayfa h1, .metin-sayfa h2 { font: 400 20px var(--baslik); margin: 12px 0 6px; }
.metin-sayfa h3, .metin-sayfa h4 { font-size: 16px; font-weight: 900; margin: 10px 0 4px; }
.metin-sayfa p, .metin-sayfa ul, .metin-sayfa ol { margin: 0 0 10px; }
.metin-sayfa ul, .metin-sayfa ol { padding-left: 20px; }
.metin-sayfa a { color: var(--vurgu1); text-decoration: underline; }
.metin-sayfa table { width: 100%; border-collapse: collapse; font-size: 13px; }
.metin-sayfa td, .metin-sayfa th { border: 1px solid var(--cizgi); padding: 4px 6px; }
.yasal-liste { flex: 1; min-height: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; align-content: start; }

/* [29.10 gece] kayıtta ayrı onay satırları (sıkı) */
.onay-satir { min-height: 0; padding-top: 4px; padding-bottom: 4px; }
.onay-satir .ad-uzun { font-size: 12px; }
.onay-izgara { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 6px 10px; }
.onay-izgara .onay-satir { padding: 2px 0; }
/* [29.10 gece] Yasa dışı içerik bildir formu */
.bildir-form { flex: 1; min-height: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px 14px; align-content: start; overflow-y: auto; scrollbar-width: none; }
.bildir-form .alan-genis { grid-row: span 2; }
.bildir-metin { height: 100%; min-height: 70px; resize: none; padding-top: 8px; }
.bildir-form .onay-satir, .bildir-form .btn { grid-column: 1 / -1; }
.bildir-tamam { flex: 1; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 10px; text-align: center; }
/* [29.10 gece] Verilerim ve hesabım: iki kutu yan yana (indir / sil) */
.hesap-izgara { flex: 1; min-height: 0; padding: 12px 14px; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; }
.hesap-kutu { min-width: 0; display: flex; flex-direction: column; gap: 8px; }
.hesap-kutu .soluk-yazi { font-size: 13px; line-height: 1.4; }
/* [29.10 gece] 18+ yaş etiketi (oyun kartı köşesi) */
.okart2 { position: relative; }
.yas-etk { position: absolute; top: 6px; right: 6px; z-index: 2; min-width: 30px; padding: 2px 6px; border-radius: 10px; background: #e3412a; color: #fff; font-size: 12px; font-weight: 800; text-align: center; box-shadow: 0 2px 0 rgba(0,0,0,.3); }
/* [29.10 gece] Doğum yılı ekranı */
.bildir-form .dy-bilgi { grid-column: 1 / -1; }
.dy-link { align-self: end; padding-bottom: 10px; text-decoration: underline; }
.yas-buyuk { font-size: 34px; font-weight: 900; color: #fff; background: #e3412a; border-radius: 50%; width: 72px; height: 72px; display: grid; place-items: center; }
.sira-dugme { display: flex; gap: 10px; flex-wrap: wrap; justify-content: center; }
/* [29.10 gece] Üye No */
.uye-no { font-weight: 700; opacity: .75; font-size: .85em; }
/* [29.10 gece] Sıralama: tek liste, 1. en üstte; ilk üç renkli, kendi satırın vurgulu */
.sira-kaydir { flex: 1; min-height: 0; overflow-y: auto; scrollbar-width: none; display: flex; flex-direction: column; }
.sira-liste .sr1 .sira-no { color: #f5c542; font-weight: 900; font-size: 18px; }
.sira-liste .sr2 .sira-no { color: #d7dce3; font-weight: 900; font-size: 17px; }
.sira-liste .sr3 .sira-no { color: #e09a5b; font-weight: 900; font-size: 16px; }
.sira-liste .sr1 { background: rgba(245, 197, 66, .12); border-radius: 12px; }
.sira-liste .ben-satir { outline: 2px solid var(--vurgu1); outline-offset: -2px; border-radius: 12px; }
.sira-liste .sen-satir[hidden] { display: none; }
/* [29.10 gece] Şikayet penceresi — oyunlardaki "Ş" penceresiyle aynı */
.od-s-pen { width: min(420px, 100%); max-height: 100%; overflow: auto; background: #2b2350; color: #fff; border-radius: 16px; padding: 14px 16px; font: 14px/1.4 Nunito, system-ui, sans-serif; box-shadow: 0 10px 30px rgba(0,0,0,.5); text-align: left; }
.od-s-pen h3 { margin: 0 0 8px; font-size: 17px; }
.od-s-pen label { display: block; margin: 6px 0 4px; font-weight: 700; font-size: 12px; opacity: .85; }
.od-s-pen input[type=text], .od-s-pen textarea { width: 100%; box-sizing: border-box; border: 1px solid rgba(255,255,255,.25); border-radius: 10px; background: rgba(0,0,0,.25); color: #fff; padding: 7px 9px; font: inherit; }
.od-s-pen input[readonly] { opacity: .85; }
.od-s-pen textarea { height: 52px; resize: none; }
.od-s-seb { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 6px; }
.od-s-seb label { margin: 0; display: flex; align-items: center; gap: 5px; background: rgba(255,255,255,.1); border-radius: 10px; padding: 6px; font-size: 12px; opacity: 1; cursor: pointer; }
.od-s-alt { display: flex; gap: 8px; justify-content: flex-end; margin-top: 10px; }
.od-s-alt button { border: none; border-radius: 10px; padding: 8px 14px; font: inherit; font-weight: 800; cursor: pointer; }
.od-s-gon { background: #e74c3c; color: #fff; } .od-s-vaz { background: rgba(255,255,255,.15); color: #fff; }
.od-s-not { font-size: 11px; opacity: .75; margin-top: 6px; }