/* AAL Gaming uygulamasi - site ile ayni dil: duz krem zemin, 1px cizgi, tek vurgu. */
:root {
  --paper:#fbfaf8; --panel:#fff; --ink:#14110f; --ink-2:#57514b; --ink-3:#8b847d;
  --rule:#e3dfd9; --rule-2:#cfc9c1; --accent:#a8401c;
  --serif:"Newsreader",Georgia,serif;
  --sans:"Inter",-apple-system,BlinkMacSystemFont,"Segoe UI",system-ui,sans-serif;
}
*,*::before,*::after { box-sizing:border-box; }
[hidden] { display:none !important; }
body { margin:0; background:var(--paper); color:var(--ink); font-family:var(--sans);
       font-size:15.5px; line-height:1.6; -webkit-font-smoothing:antialiased; }
h1,h2,h3 { font-family:var(--serif); font-weight:400; letter-spacing:-.01em; margin:0 0 .4em; }
h1 { font-size:2rem; line-height:1.1; }
h2 { font-size:1.3rem; }
a { color:var(--ink); text-underline-offset:3px; text-decoration-color:var(--rule-2); }
a:hover { color:var(--accent); }
:focus-visible { outline:2px solid var(--accent); outline-offset:3px; border-radius:1px; }

.eyebrow { font-size:.7rem; font-weight:600; letter-spacing:.16em; text-transform:uppercase;
           color:var(--ink-3); margin:0 0 1.2em; }
.note { font-size:.82rem; color:var(--ink-3); line-height:1.55; }
.hata { color:var(--accent); font-size:.88rem; min-height:1.3em; margin:.6em 0 0; }

/* ---- form ---- */
.giris-sayfa { max-width:420px; margin:0 auto; padding:72px 24px 96px; }
label { display:block; font-size:.82rem; color:var(--ink-2); margin:16px 0 5px; }
input[type=text], input[type=password] {
  width:100%; padding:10px 12px; font:inherit; font-size:.95rem; color:var(--ink);
  background:var(--panel); border:1px solid var(--rule-2); border-radius:2px;
}
input::placeholder { color:var(--ink-3); }
button {
  font:inherit; font-size:.92rem; font-weight:500; padding:10px 18px; cursor:pointer;
  background:var(--ink); color:var(--paper); border:1px solid var(--ink); border-radius:2px;
}
button:hover { background:var(--accent); border-color:var(--accent); }
button.ikincil { background:transparent; color:var(--ink); border-color:var(--rule-2); }
button.ikincil:hover { color:var(--accent); border-color:var(--accent); background:transparent; }
button:disabled { opacity:.45; cursor:default; }
.sekmeler { display:flex; gap:20px; border-bottom:1px solid var(--rule); margin-bottom:28px; }
.sekmeler button { background:none; border:none; border-bottom:2px solid transparent;
                   color:var(--ink-3); padding:8px 0; border-radius:0; }
.sekmeler button:hover { background:none; color:var(--ink); }
.sekmeler button[aria-selected=true] { color:var(--ink); border-bottom-color:var(--accent); }
.oyun-sec { display:grid; grid-template-columns:repeat(auto-fit,minmax(150px,1fr)); gap:2px 16px; }
.oyun-sec label { display:flex; align-items:center; gap:8px; margin:6px 0; color:var(--ink);
                  font-size:.92rem; cursor:pointer; }

/* ---- uygulama duzeni ---- */
.ust { border-bottom:1px solid var(--rule); padding:12px 20px; display:flex;
       align-items:baseline; gap:16px; }
.ust .marka { font-family:var(--serif); font-size:1.1rem; }
.ust .sag { margin-left:auto; display:flex; align-items:center; gap:14px;
            font-size:.85rem; color:var(--ink-3); }

.duzen { display:grid; grid-template-columns:230px 1fr 250px; height:calc(100vh - 49px); }
.yan { border-right:1px solid var(--rule); overflow-y:auto; padding:20px 16px; }
.yan.sag { border-right:none; border-left:1px solid var(--rule); }
.yan h3 { font-family:var(--sans); font-size:.7rem; font-weight:600; letter-spacing:.14em;
          text-transform:uppercase; color:var(--ink-3); margin:0 0 10px; }
.yan section { margin-bottom:28px; }
.liste { list-style:none; margin:0; padding:0; }
.liste li { margin:1px 0; }
.liste button { display:flex; align-items:center; gap:8px; width:100%; text-align:left;
  background:none; border:none; border-radius:2px; color:var(--ink-2); padding:5px 8px;
  font-size:.9rem; font-weight:400; }
.liste button:hover { background:#f2efea; color:var(--ink); }
.liste button[aria-current=true] { background:#f2efea; color:var(--ink); font-weight:500;
  box-shadow:inset 2px 0 0 var(--accent); }
.rozet { margin-left:auto; font-size:.72rem; color:var(--ink-3); }
.nokta { width:6px; height:6px; border-radius:50%; background:var(--accent); flex:none; }

/* ---- sohbet ---- */
.orta { display:flex; flex-direction:column; min-width:0; }
.oda-baslik { border-bottom:1px solid var(--rule); padding:14px 24px; display:flex;
              align-items:center; gap:12px; }
.oda-baslik h2 { margin:0; }
.akis { flex:1; overflow-y:auto; padding:20px 24px; }
.msj { padding:5px 0; display:flex; gap:10px; align-items:baseline; }
.msj .kim { font-weight:600; font-size:.88rem; flex:none; }
.msj .ne { min-width:0; overflow-wrap:anywhere; }
.msj .saat { margin-left:auto; font-size:.72rem; color:var(--ink-3); flex:none; opacity:0; }
.msj:hover .saat { opacity:1; }
.msj .sik { border:none; background:none; color:var(--ink-3); font-size:.72rem; padding:0 4px;
            opacity:0; flex:none; }
.msj:hover .sik { opacity:1; }
.msj .sik:hover { color:var(--accent); background:none; }
.yazma { border-top:1px solid var(--rule); padding:14px 24px; display:flex; gap:10px; }
.yazma input { flex:1; }

/* ---- cagrilar ---- */
.cagri { border:1px solid var(--rule); border-radius:2px; padding:12px; margin-bottom:10px;
         background:var(--panel); }
.cagri .st { font-size:.8rem; color:var(--ink-3); margin-bottom:4px; }
.cagri .kim { font-weight:600; font-size:.9rem; }
.cagri .not { font-size:.86rem; color:var(--ink-2); margin:4px 0 8px; }
.cagri button { padding:6px 12px; font-size:.84rem; }
.cagri.dolu { opacity:.55; }
.bos { font-size:.85rem; color:var(--ink-3); }

@media (max-width:900px) {
  .duzen { grid-template-columns:1fr; height:auto; }
  .yan, .yan.sag { border:none; border-bottom:1px solid var(--rule); }
  .akis { min-height:50vh; }
}

/* ---- oyun secici (kayit) ---- */
.oyun-kutu { max-height:280px; overflow-y:auto; border:1px solid var(--rule);
             border-radius:2px; padding:10px 14px; margin-top:10px; background:var(--panel); }
.oyun-kutu h4 { font-family:var(--sans); font-size:.68rem; font-weight:600; letter-spacing:.14em;
                text-transform:uppercase; color:var(--ink-3); margin:14px 0 4px; }
.oyun-kutu h4:first-child { margin-top:2px; }
.secilenler { display:flex; flex-wrap:wrap; gap:6px; margin-top:10px; }
.rozet-oyun { font-size:.78rem; color:var(--ink-2); border:1px solid var(--rule-2);
              border-radius:2px; padding:2px 8px; }
.ekle-satir { display:flex; gap:8px; margin-top:12px; }
.ekle-satir input { flex:1; }
.ekle-satir button { white-space:nowrap; }

/* ---- sesli sohbet ---- */
.ses-serit { display:flex; align-items:center; gap:10px; flex-wrap:wrap;
             border-bottom:1px solid var(--rule); padding:9px 24px; background:var(--panel); }
.ses-etiket { font-size:.68rem; font-weight:600; letter-spacing:.14em; text-transform:uppercase;
              color:var(--ink-3); }
.ses-kisiler { display:flex; gap:6px; flex-wrap:wrap; flex:1; }
.ses-kisi { display:inline-flex; align-items:center; gap:6px; font-size:.84rem;
            border:1px solid var(--rule-2); border-radius:2px; padding:2px 9px; }
.ses-kisi.konusuyor { border-color:var(--accent); color:var(--accent); }
.ses-kisi.susturulmus { color:var(--ink-3); }
.ses-doluluk { font-size:.72rem; color:var(--ink-3); margin-left:auto; }

/* ---- onay kutulari ---- */
.onay { margin-top:22px; border-top:1px solid var(--rule); padding-top:16px; }
.onay label { display:flex; gap:9px; align-items:flex-start; margin:0 0 10px;
              font-size:.88rem; color:var(--ink-2); cursor:pointer; }
.onay input { margin-top:4px; flex:none; }
.onay a { color:var(--ink); }

/* ---- kurtarma kodu ---- */
.kod { font-family:var(--mono, ui-monospace, Menlo, monospace); font-size:1.25rem;
       letter-spacing:.08em; background:var(--panel); border:1px solid var(--rule-2);
       border-radius:2px; padding:14px 16px; margin:18px 0; user-select:all; }

/* ---- forum ---- */
.forum { max-width:760px; margin:0 auto; padding:44px 24px 80px; }
.forum h1 { font-family:var(--serif); font-weight:400; font-size:2rem; margin:0 0 .3em; }
.forum-baslik { display:flex; align-items:baseline; gap:16px; margin-bottom:26px; }
.forum-baslik button { margin-left:auto; }

.kategoriler { display:flex; gap:6px; flex-wrap:wrap; border-bottom:1px solid var(--rule);
               padding-bottom:12px; margin-bottom:6px; }
.kat { background:none; border:1px solid transparent; color:var(--ink-3); border-radius:2px;
       padding:5px 11px; font-size:.86rem; font-weight:400; }
.kat:hover { background:#f2efea; color:var(--ink); border-color:transparent; }
.kat[aria-current=true] { color:var(--ink); border-color:var(--rule-2); background:var(--panel); }

.konu-satir { display:flex; align-items:center; gap:16px; padding:15px 4px;
              border-bottom:1px solid var(--rule); text-decoration:none; color:inherit; }
.konu-satir:hover { background:#f6f3ee; color:inherit; }
.konu-ad { font-size:1rem; margin-bottom:2px; }
.konu-alt { font-size:.8rem; color:var(--ink-3); }
.konu-sayi { margin-left:auto; font-size:.82rem; color:var(--ink-3); flex:none; }

.geri { margin:0 0 18px; font-size:.86rem; }
.konu-ust { font-size:.82rem; color:var(--ink-3); margin:-.2em 0 26px; }
.gonderi { border-top:1px solid var(--rule); padding:18px 0; }
.gonderi-ust { display:flex; align-items:center; gap:10px; font-size:.8rem;
               color:var(--ink-3); margin-bottom:7px; }
.gonderi-govde { white-space:pre-wrap; overflow-wrap:anywhere; color:var(--ink); }
.mini { background:none; border:none; color:var(--ink-3); font-size:.76rem; padding:0 4px;
        margin-left:auto; }
.mini:hover { background:none; color:var(--accent); }
.yonet { display:flex; gap:10px; border-top:1px solid var(--rule); padding-top:12px; }
.yonet .mini { margin-left:0; border:1px solid var(--rule-2); border-radius:2px; padding:3px 9px; }

.forum textarea, .forum select {
  width:100%; padding:10px 12px; font:inherit; font-size:.95rem; color:var(--ink);
  background:var(--panel); border:1px solid var(--rule-2); border-radius:2px; resize:vertical;
}
#cevap-form { margin-top:26px; border-top:1px solid var(--rule); padding-top:20px; }
#cevap-form button { margin-top:10px; }
#yeni-form button { margin-top:14px; }

/* ---- amblem ---- */
.ust .marka { display:inline-flex; align-items:center; gap:9px; text-decoration:none;
              color:var(--ink); font-family:var(--serif); font-size:1.1rem; }
/* Site ile ayni oran: amblem harfleri yazinin buyuk harfi kadar. */
.ust .marka svg { width:29.5px; height:auto; color:var(--ink); display:block; flex:none; }
.marka-giris { width:190px; height:auto; color:var(--ink); display:block; margin:0 0 6px -4px; }

/* ---- giristen cikis yolu ---- */
.marka-bag { display:inline-block; text-decoration:none; }
.cikis-yolu { margin-top:30px; padding-top:18px; border-top:1px solid var(--rule);
              font-size:.85rem; color:var(--ink-3); line-height:1.6; }
.cikis-yolu a { color:var(--ink-2); }
.cikis-yolu a:hover { color:var(--accent); }

/* ---- istege bagli davet kodu ---- */
.kod-alani { margin-top:16px; }
.kod-alani summary { font-size:.85rem; color:var(--ink-3); cursor:pointer; list-style:none; }
.kod-alani summary::-webkit-details-marker { display:none; }
.kod-alani summary::before { content:"+ "; }
.kod-alani[open] summary::before { content:"- "; }
.kod-alani summary:hover { color:var(--ink); }
.kod-alani input { margin-top:8px; }

/* ---- oda listesi ---- */
.kur { width:100%; margin-bottom:22px; }
.kur-form { border:1px solid var(--rule-2); border-radius:2px; padding:14px;
            margin-bottom:22px; background:var(--panel); }
.kur-form label { margin:0 0 5px; }
.kur-form label + input, .kur-form label + select { margin-bottom:10px; }
.kur-form select { width:100%; padding:9px 10px; font:inherit; font-size:.9rem;
                   border:1px solid var(--rule-2); border-radius:2px; background:var(--panel); }
.kur-dugmeler { display:flex; gap:8px; margin-top:4px; }
.kur-dugmeler button { padding:7px 14px; font-size:.86rem; }
.bas-sayi { color:var(--ink-3); font-weight:400; letter-spacing:0; }

.odalar li { margin:0 0 2px; }
.odalar button { flex-direction:column; align-items:flex-start; gap:2px; padding:7px 8px; }
.oda-ust { display:flex; align-items:center; gap:8px; width:100%; }
.oda-ad { font-weight:500; color:var(--ink); }
.oda-durum { margin-left:auto; font-size:.72rem; color:var(--ink-3); white-space:nowrap; }
.oda-kisiler { font-size:.76rem; color:var(--ink-3); line-height:1.45;
               overflow:hidden; text-overflow:ellipsis; white-space:nowrap; max-width:100%; }
.oda-bos { font-size:.76rem; color:var(--rule-2); }
.tum-odalar { background:none; border:none; color:var(--ink-3); font-size:.8rem;
              padding:8px 8px 0; }
.tum-odalar:hover { background:none; color:var(--accent); }

/* ---- baglanti durumu ---- */
.durum { padding:7px 24px; font-size:.82rem; background:#f3ece7; color:var(--accent);
         border-bottom:1px solid var(--rule); }

/* ---- kayit acilir listesi ---- */
.giris-sayfa select { width:100%; padding:10px 12px; font:inherit; font-size:.95rem;
  color:var(--ink); background:var(--panel); border:1px solid var(--rule-2); border-radius:2px; }

/* ---- Google ile giris ---- */
.google-dugme { display:flex; align-items:center; justify-content:center; gap:10px;
  width:100%; padding:11px 16px; margin-bottom:18px; font-size:.92rem; font-weight:500;
  color:var(--ink); background:var(--panel); border:1px solid var(--rule-2);
  border-radius:2px; text-decoration:none; }
.google-dugme:hover { border-color:var(--ink-3); color:var(--ink); }
.ayirici { display:flex; align-items:center; gap:12px; margin:0 0 18px;
           font-size:.8rem; color:var(--ink-3); }
.ayirici::before, .ayirici::after { content:""; flex:1; height:1px; background:var(--rule); }
.google-not { border-left:2px solid var(--accent); padding-left:14px; margin:0 0 6px; }