/* ortak.css — Kelle lobi ortak stili. Değerler client/index.html estetiğinden
   (plan: PLAN_LOBI_EKONOMI.md 'Lobi UI'); index.html'e DOKUNULMAZ. */
:root{
  --bg:#0b0e13; --overlay:#070a0e; --panel:#141922; --panel-2:#0e141b; --panel-3:#1b222c;
  --cizgi:#ffffff14; --cizgi-2:#ffffff18;
  --metin:#e7ecf3; --metin-2:#cfd8e3;
  --vurgu:#ffd34d; --vurgu-metin:#1a1200;
  --bilgi:#6fd3ff; --tehlike:#ff6b5c; --basari:#4ec9b0;
  --r:13px; --r-kucuk:7px;
  --mono:ui-monospace,monospace;
}
*{margin:0;padding:0;box-sizing:border-box}
[hidden]{display:none !important}
html,body{min-height:100%;background:var(--bg);color:var(--metin);
  font:14px/1.4 system-ui,'Segoe UI',sans-serif}
h1,h2,h3{text-transform:uppercase}
h1{font-size:34px;letter-spacing:4px}
h2{font-size:19px;letter-spacing:2px}
h3{font-size:14px;letter-spacing:1.5px;opacity:.85;margin-bottom:10px}
.mono{font-family:var(--mono)}
.soluk{opacity:.65}
.mini{font-size:12px}
.buyuk{font-size:20px;font-weight:600}
button{font:inherit;cursor:pointer}
button:disabled{opacity:.5;cursor:default}
input[type=text],input[type=password],input[type=number],input:not([type]){
  width:100%;padding:10px 13px;border-radius:var(--r-kucuk);border:1px solid #3a4756;
  background:#0d1218ee;color:var(--metin);font:14px/1.3 inherit;outline:none}
input:focus{border-color:var(--bilgi)}

/* buton dili */
.birincil{background:var(--vurgu);color:var(--vurgu-metin);border:0;
  padding:12px 26px;border-radius:9px;font-weight:700;font-size:15px}
.ikincil{background:var(--panel-3);border:1px solid var(--cizgi-2);color:var(--metin-2);
  padding:9px 16px;border-radius:var(--r-kucuk)}
.ikincil:hover:not(:disabled){background:#242d39}
.tehlike-dis{background:transparent;border:1px solid #b0434388;color:var(--tehlike);
  padding:9px 16px;border-radius:var(--r-kucuk)}
.tehlike-dis:hover:not(:disabled){background:#2a1512}
.baglanti{background:none;border:0;color:var(--bilgi);text-decoration:underline;font-size:13px}
#girisEski #btnGiris{margin-top:10px} #girisEski #lnkKod{display:block;margin:10px auto 0}
.blok{display:block;width:100%}
.mini-btn{padding:4px 10px;font-size:12px}

/* kart + yerleşim */
.kart{background:var(--panel);border:1px solid var(--cizgi);border-radius:var(--r);
  padding:24px 28px;margin-bottom:16px}
.orta{text-align:center}
.dar{max-width:420px;width:100%}
.tam-orta{min-height:100vh;display:grid;place-items:center;background:var(--overlay);padding:20px}
.tam-orta .kart>*{margin-bottom:14px}
.tam-orta .kart>:last-child{margin-bottom:0}
main{max-width:980px;margin:0 auto;padding:22px 18px}
.dar-govde{max-width:560px}

/* üst bar */
.ustbar{display:flex;align-items:center;gap:14px;background:#0f151c;
  border-bottom:1px solid var(--cizgi);padding:10px 18px;flex-wrap:wrap}
.logo{font-weight:700;letter-spacing:3px;font-size:16px}
.esnek{flex:1}
.sayac{font-size:15px;background:#0007;padding:5px 11px;border-radius:6px}
.sayac.kirmizi{color:var(--tehlike)}

/* bildirim bandı */
#bant{position:fixed;top:12px;left:50%;transform:translateX(-50%);z-index:50;
  max-width:min(620px,92vw);padding:10px 18px;border-radius:var(--r-kucuk);
  font-size:13px;text-align:center;border:1px solid}
#bant.tehlike{background:#2a1512;border-color:#b0434388;color:#ff9b90}
#bant.basari{background:#12251f;border-color:#4ec9b088;color:var(--basari)}
#bant.bilgi{background:#122029;border-color:#6fd3ff55;color:#dff2ff}

/* oda kartları */
#odaListe{display:flex;gap:14px;flex-wrap:wrap;margin-top:16px}
.oda{width:240px;background:var(--panel);border:2px solid var(--cizgi);border-radius:var(--r);
  padding:16px;transition:border-color .12s,transform .12s}
.oda:hover:not(.dolu){border-color:var(--vurgu);transform:translateY(-3px)}
.oda.dolu{opacity:.45}
.oda h3{margin-bottom:12px;opacity:1}
.oda .doluluk{display:flex;align-items:center;gap:8px;margin-bottom:14px}
.cubuk{flex:1;height:10px;background:#0007;border-radius:5px;overflow:hidden}
.cubuk i{display:block;height:100%;width:0;background:linear-gradient(90deg,#ffd34d,#ff9b3d);
  transition:width .3s}
.cubuk.tam i{background:#e23b3b}
.oda .kisi{font-family:var(--mono);font-size:12px}
.iskelet{border-style:dashed;opacity:.4}

/* sekmeler */
.sekmeler{display:flex;gap:8px;margin-bottom:16px}
.sekme{background:var(--panel-3);border:1px solid var(--cizgi-2);color:var(--metin-2);
  padding:9px 20px;border-radius:var(--r-kucuk);letter-spacing:1px}
.sekme.aktif{background:var(--vurgu);color:var(--vurgu-metin);border-color:var(--vurgu);font-weight:700}

/* satırlar */
.satir{display:flex;align-items:center;gap:10px;margin-bottom:12px}
.satir>.etiket{min-width:86px;opacity:.65;font-size:13px}
.kisalt{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:260px;
  user-select:text;-webkit-user-select:text}
.dugmeler{gap:12px;flex-wrap:wrap}
.adet.aktif,.ethAdet.aktif,.ethAdet.aktif:hover:not(:disabled){background:var(--vurgu);color:var(--vurgu-metin);border-color:var(--vurgu);font-weight:700}

/* durum satırı */
.durum{font-family:var(--mono);font-size:13px;min-height:18px;margin-top:10px}
.durum.bilgi{color:var(--bilgi)}
.durum.basari{color:var(--basari)}
.durum.tehlike{color:var(--tehlike)}
.durum a{color:var(--bilgi)}

/* uyarı + kod kutuları */
.uyari{border:1px solid #b0434388;background:#2a1512;color:#ff9b90;
  border-radius:var(--r-kucuk);padding:10px 12px;font-size:12px;margin-bottom:12px}
.kod{font-family:var(--mono);font-size:17px;letter-spacing:2px;background:var(--panel-2);
  border:1px dashed var(--cizgi-2);border-radius:var(--r-kucuk);padding:12px;
  word-break:break-all;user-select:text;-webkit-user-select:text}

/* modal */
.modal{position:fixed;inset:0;display:grid;place-items:center;background:#070a0ecc;
  backdrop-filter:blur(3px);z-index:30;padding:20px}
.orta-hiza{justify-content:center}

/* kopuk oturum: devam kartı */
.devam-kutu{display:flex;align-items:center;gap:16px;border-color:#ffd34d55;background:#1d1a10}
.devam-kutu b{color:var(--vurgu);font-size:15px}
.devam-kutu p{margin:4px 0 0}
.devam-kutu button{flex:none}

/* X ile giriş */
.x-btn{display:flex;align-items:center;justify-content:center;gap:10px;text-decoration:none;
  background:#000;color:#fff;border:1px solid #ffffff2a;font-size:15px;letter-spacing:.04em}
.x-btn:hover{background:#15181c}
.hata-kutu{margin-top:12px;padding:9px 12px;border-radius:8px;border:1px solid #b0434388;background:#2a1512;color:#ffb1a6;font-size:13px}
/* sağ üst cüzdan bakiyesi */
.cuzdanYer .bak{display:flex;flex-direction:column;align-items:flex-end;line-height:1.15;font:600 12px var(--mono)}
.cuzdanYer .bak b{color:var(--vurgu);font-size:13px}
.cuzdanYer .bak span{color:var(--metin-2);opacity:.75;font-size:11px}
.cuzdanYer .oto{border-color:#3a4756;background:#141922;color:var(--metin-2)}

.anahtar-kutu{margin-top:10px;padding:11px 12px;border-radius:9px;border:1px solid #b0434388;background:#2a1512}
.anahtar-kutu p{margin:0 0 8px;font-size:12px;color:#ffd9d2;line-height:1.5}
.anahtar-kutu .kir{word-break:break-all;font-size:11px;color:#ffb1a6;flex:1}

/* DİL SEÇİCİ (TR | EN) */
.dil-secici{display:inline-flex;border:1px solid #ffffff2a;border-radius:8px;overflow:hidden}
.dil-secici button{min-height:32px;padding:6px 11px;border:0;border-radius:0;background:transparent;color:#bdc8d5;font:700 12px/1 ui-monospace,monospace;letter-spacing:.08em;cursor:pointer}
.dil-secici button+button{border-left:1px solid #ffffff2a}
.dil-secici button.secili{background:var(--vurgu,#ff9548);color:#1a1200}
.dil-secici button:focus-visible{outline:2px solid #fff;outline-offset:-2px}
.dil-giris{display:flex;justify-content:flex-end;margin:-4px -4px 10px}
/* REHBER */
.rehber{display:grid;gap:14px;padding-bottom:40px}
.rehber h3{margin:0 0 10px;letter-spacing:.12em}
.rehber p{margin:8px 0;line-height:1.6;color:#c9d2dd}
.rehber ul{margin:6px 0;padding-left:20px;line-height:1.65;color:#c9d2dd}
.rehber li{margin:3px 0}
.rehber b{color:#fff}
.rehber-tus{width:100%;border-collapse:collapse;font-size:14px}
.rehber-tus td{padding:6px 4px;border-bottom:1px solid #ffffff12;color:#c9d2dd;vertical-align:top}
.rehber-tus td:first-child{white-space:nowrap;width:1%;padding-right:14px}
kbd{display:inline-block;min-width:22px;padding:2px 7px;border:1px solid #ffffff33;border-bottom-width:2px;border-radius:5px;background:#0e141b;color:#fff;font:600 12px/1.5 ui-monospace,monospace;text-align:center}

/* TEST ETH MUSLUĞU */
.musluk-kutu{margin-top:12px;padding:12px 14px;border:1px dashed #4ec9b0aa;border-radius:10px;background:#0f2019;display:grid;gap:10px}
.musluk-kutu p{margin:0;line-height:1.5;color:#c9e9dc}

/* lobi başlığı ETH bakiyesi */
.eth-sayac{color:#9de6c8;white-space:nowrap}

/* LOGO (17 Eki, oyuncunun tasarımı) — Silkscreen (OFL) piksel yazı */
@font-face{font-family:Silkscreen;src:url(/assets/fonts/logo/silkscreen-400.ttf) format("truetype");font-weight:400;font-display:swap}
@font-face{font-family:Silkscreen;src:url(/assets/fonts/logo/silkscreen-700.ttf) format("truetype");font-weight:700;font-display:swap}
.logo-tam{display:grid;justify-items:center;gap:10px;margin:2px 0 6px}
.logo-amblem{width:min(330px,82%);height:auto;image-rendering:pixelated}
.logo-yazi{font:700 clamp(22px,4vw,30px)/1 Silkscreen,monospace;letter-spacing:.12em;color:#f1ead9;text-indent:.12em;white-space:nowrap}
.logo-slogan{font:400 clamp(10px,1.6vw,12px)/1 Silkscreen,monospace;letter-spacing:.32em;color:#ff8c3a;text-indent:.32em}
.logo-yatay{display:inline-flex;align-items:stretch;gap:12px}
.logo-kafa{width:auto;height:40px;align-self:center;image-rendering:pixelated;filter:drop-shadow(0 2px 6px #0008)}
.logo-metin{display:flex;flex-direction:column;align-items:flex-start;justify-content:space-between;height:40px;align-self:center}
.logo-metin b{font:700 24px/1 Silkscreen,monospace;letter-spacing:0;color:#f1ead9;white-space:nowrap}
.logo-metin small{display:block;font:400 10px/1 Silkscreen,monospace;letter-spacing:.2em;color:#ff8c3a;white-space:nowrap}
@media (max-width:600px){.logo-kafa{height:30px}.logo-metin{height:30px;justify-content:center}.logo-metin b{font-size:19px}.logo-metin small{display:none}}
/* İKİ FONT (19 Eki, oyuncu "Press Start 2P + Chakra Petch"): başlık, buton = Press Start 2P (boyut 8'in katı),
   geri kalan her şey = Chakra Petch. Logo Silkscreen kalır (oyuncunun tasarımı). */
:root{--f-piksel:'Press Start 2P',Silkscreen,monospace;--f-yazi:'Chakra Petch','Segoe UI',sans-serif}
*,*::before,*::after,input,button,select,textarea{font-family:var(--f-yazi)!important}
h1,h2,.lobi-odalar .oda h3,.lobi-menu button,#lobiOyna{font-family:var(--f-piksel)!important;font-weight:400!important;letter-spacing:0!important}
h1{font-size:32px!important}h2,.lobi-odalar .oda h3,.lobi-menu button{font-size:16px!important}.lobi-odalar h2,.lobi-salonlar h2{font-size:8px!important;letter-spacing:1px!important}#lobiOyna{font-size:24px!important}
.logo-yazi,.logo-slogan,.logo-metin b,.logo-metin small{font-family:Silkscreen,monospace!important}
/* fontta küçük 'ı' yok -> her şey BÜYÜK harf (lang=tr: ı->I, i->İ; EN'de dil.js lang=en) */
body *:not(input):not(textarea):not(.mono):not(.mono *){text-transform:uppercase}
/* SIRALAMA (17 Eki) */
.siralama{display:grid;grid-template-columns:minmax(0,1fr);gap:14px;padding-bottom:40px;min-width:0;max-width:100%}
.siralama>*{min-width:0}
.sr-ust{display:flex;align-items:center;gap:14px;flex-wrap:wrap}
.sr-donem{display:flex;gap:8px;flex-wrap:wrap}
.sr-sayac{margin-left:auto;font-size:11px;color:#9fadbd;letter-spacing:1px}
.sr-tablo-kap{overflow-x:auto}
.sr-tablo{width:100%;border-collapse:collapse;font-size:13px;font-variant-numeric:tabular-nums}
.sr-tablo th{font-size:10px;letter-spacing:1px;color:#8b97a6;text-align:left;padding:8px 10px;border-bottom:1px solid #ffffff1a;white-space:nowrap}
.sr-tablo td{padding:9px 10px;border-bottom:1px solid #ffffff0d;color:#d6dde6;white-space:nowrap}
.sr-tablo .sy{text-align:right}
.sr-tablo .sr-no{width:1%;color:#8b97a6}
.sr-tablo .sr-ad{max-width:240px;overflow:hidden;text-overflow:ellipsis;color:#f3f3ee}
.sr-tablo .sr-kelle{color:#ff9548;font-weight:700}
.sr-tablo tr.sr-ilk1 td{background:#ffc83d14}.sr-tablo tr.sr-ilk1 .sr-no{color:#ffc83d}
.sr-tablo tr.sr-ilk2 td{background:#cfd8e30f}.sr-tablo tr.sr-ilk2 .sr-no{color:#cfd8e3}
.sr-tablo tr.sr-ilk3 td{background:#d9905a10}.sr-tablo tr.sr-ilk3 .sr-no{color:#d9905a}
.sr-tablo tr.sr-benim td{background:#ff954824;color:#fff}
.sr-tablo tfoot tr td{border-top:2px dashed #ff954866}
.sr-bos{color:#9fadbd;text-align:center;padding:24px 0;margin:0}
.sr-not{font-size:10px;color:#7d8896;line-height:1.7;margin:12px 0 0}
@media (max-width:600px){.sr-gizli-m{display:none}.sr-sayac{margin-left:0;width:100%}.sr-tablo td,.sr-tablo th{padding:8px 6px}}
/* X girişi + misafir arasında "veya" (17 Eki) */
.giris-veya{display:flex;align-items:center;gap:10px;margin:16px 0 12px;color:#7d8896;font-size:11px}
.giris-veya::before,.giris-veya::after{content:'';flex:1;height:1px;background:#ffffff1a}
/* X butonu: logo zaten "X" — Türkçe "[X] İLE BAĞLAN", İngilizce "SIGN IN WITH [X]" (17 Eki) */
html[lang="en"] .x-btn svg{order:2}
.x-btn svg{width:19px;height:19px}
/* GİRİŞSİZ VİTRİN (17 Eki): oturum yokken lobi görünür, sağ üstte X ile bağlan; giriş kartı pencere olarak açılır */
body.vitrin #canSayac,body.vitrin #kelleSayac,body.vitrin #ethSayac,body.vitrin .lobi-hesap{display:none!important}
.ust-giris{display:inline-flex;align-items:center;gap:9px;padding:9px 16px;border-radius:7px;border:0;cursor:pointer;
  background:#f4f4ef;color:#151b23;font-weight:700;font-size:13px;letter-spacing:1px;white-space:nowrap}
.ust-giris:hover{background:#fff}
.ust-giris:focus-visible{outline:2px solid var(--vurgu,#ff9548);outline-offset:2px}
.ust-giris svg{width:17px;height:17px;flex:none}
html[lang="en"] .ust-giris svg{order:2}
.ust-giris[hidden]{display:none}
#e-giris.giris-pencere{position:fixed;inset:0;z-index:200;min-height:0;background:#07090dcc;backdrop-filter:blur(3px);overflow:auto}
#e-giris .kart{position:relative}
.giris-kapat{position:absolute;top:14px;left:14px;width:34px;height:34px;border-radius:7px;border:1px solid #ffffff22;
  background:#ffffff0a;color:#c9d0db;cursor:pointer;font-size:14px;line-height:1;margin:0!important}
.giris-kapat:hover{background:#ffffff1a;color:#fff}
.giris-kapat[hidden]{display:none}
@media (max-width:600px){.ust-giris{padding:8px 11px;font-size:11px}}
/* QA 17 Eki: telefonda market/profil yana taşıyordu — satırlar sarar, uzun adresler kırılır, içerik ekranı aşmaz */
main.lobi-icerik{min-width:0;max-width:100%;box-sizing:border-box}
main.lobi-icerik>*,main.lobi-icerik .kart{min-width:0;max-width:100%;box-sizing:border-box}
@media (max-width:600px){
  main.lobi-icerik .satir{flex-wrap:wrap}
  main.lobi-icerik .mono,main.lobi-icerik .kisalt{overflow-wrap:anywhere;word-break:break-all;min-width:0}
  main.lobi-icerik input{min-width:0;max-width:100%}
}

/* X profil resmi (18 Eki): adın yanında minik yuvarlak */
img.pfp{width:20px;height:20px;border-radius:50%;object-fit:cover;vertical-align:middle;margin-right:7px;background:#0006;flex:0 0 auto}
img.pfp.buyuk{width:36px;height:36px;margin-right:10px}
#ustAd{display:inline-flex;align-items:center}

/* kelle satış onayı + kutlama (27 Eki) */
.sat-onay h2{text-align:center}
.sat-onay-ozet{display:flex;align-items:center;justify-content:center;gap:14px;margin:16px 0 8px;font-size:20px}
.sat-onay-ozet .ok{color:var(--metin-2)}
.sat-onay-ozet .dolar{color:var(--basari);font-weight:700;font-size:26px;font-variant-numeric:tabular-nums}
#satOnayDetay{text-align:center;margin-bottom:16px;font-size:12px}
#satKutlama{position:fixed;inset:0;z-index:60;display:grid;place-items:center;pointer-events:auto;cursor:pointer}
#konfetiTuval{position:absolute;inset:0;width:100%;height:100%}
.kutlama-kart{position:relative;display:grid;justify-items:center;gap:6px;padding:26px 40px;border-radius:var(--r);
  background:radial-gradient(circle at 50% 30%,#1f3a2e,#0e1a15);border:2px solid #4ec9b0aa;
  box-shadow:0 0 60px #4ec9b055,0 20px 50px #000a;animation:kutlamaGir .55s cubic-bezier(.2,1.6,.4,1) both}
.kutlama-para{width:84px;height:84px;border-radius:50%;display:grid;place-items:center;font-size:48px;font-weight:800;
  color:#1a1200;background:radial-gradient(circle at 35% 30%,#fff3b0,#ffd34d 45%,#b88a00);
  box-shadow:inset 0 -5px 0 #8a6400,0 0 30px #ffd34d88;animation:paraDon 1.2s ease-out both}
#kutlamaTutar{font-size:44px;font-weight:800;color:#7dffb8;text-shadow:0 0 18px #4ec9b0aa;font-variant-numeric:tabular-nums}
.kutlama-alt{color:var(--metin-2);font-size:13px;letter-spacing:.5px}
@keyframes kutlamaGir{from{transform:scale(.4);opacity:0}to{transform:scale(1);opacity:1}}
@keyframes paraDon{from{transform:rotateY(0) scale(.6)}to{transform:rotateY(720deg) scale(1)}}
@media (prefers-reduced-motion: reduce){.kutlama-kart,.kutlama-para{animation:none}}
