/* ══════════════════════════════════════════════════════════════════
   "OYUN HAKKINDA" KÜNYESİ + MÜZİK DENETİMİ — v4.29
   Oyunun yüzey diline (24-surface.css) uyar: koyu cam yüzey, ince
   parıltı kenarı, --accent vurgusu.
   ══════════════════════════════════════════════════════════════════ */

.abt-overlay{
  position:fixed; inset:0; z-index:990;
  background:rgba(0,0,0,.78); backdrop-filter:blur(7px);
  display:flex; align-items:center; justify-content:center; padding:1rem;
  animation:abtIn .18s ease;
}
@keyframes abtIn{ from{ opacity:0 } to{ opacity:1 } }

.abt-card{
  position:relative;
  width:440px; max-width:100%; max-height:88vh; overflow-y:auto;
  background:linear-gradient(165deg, rgba(var(--surf2-rgb),.98) 0%, rgba(var(--surf-rgb),1) 100%);
  border:1px solid rgba(var(--shine-rgb),.09);
  border-radius:20px; padding:1.5rem 1.4rem 1.2rem;
  box-shadow:0 26px 70px rgba(0,0,0,.75), inset 0 1px 0 rgba(var(--shine-rgb),.08);
  display:flex; flex-direction:column; gap:1.05rem;
  animation:abtUp .22s cubic-bezier(.34,1.4,.64,1);
}
@keyframes abtUp{ from{ transform:translateY(14px) scale(.97) } to{ transform:none } }

.abt-close{
  position:absolute; top:.7rem; right:.7rem;
  background:none; border:none; color:var(--muted); cursor:pointer;
  width:30px; height:30px; border-radius:8px; display:flex;
  align-items:center; justify-content:center; transition:background .15s, color .15s;
}
.abt-close:hover{ background:rgba(var(--shine-rgb),.09); color:var(--txt); }

/* ── Başlık ── */
.abt-hero{ display:flex; align-items:center; gap:.85rem; padding-right:2rem; }
.abt-logo{
  width:52px; height:52px; flex-shrink:0; border-radius:14px;
  background:linear-gradient(135deg, rgba(var(--accent-rgb),.9), rgba(var(--accent-rgb),.45));
  display:flex; align-items:center; justify-content:center;
  box-shadow:0 6px 18px rgba(var(--accent-rgb),.28);
}
.abt-logo svg, .abt-logo img{ width:30px; height:30px; }
.abt-hero-txt{ min-width:0; }
.abt-title{
  font-family:var(--font-display); font-size:1.28rem; font-weight:800;
  letter-spacing:.01em; color:var(--txt); line-height:1.1;
}
.abt-sub{ font-size:.74rem; color:var(--muted); margin-top:.18rem; line-height:1.35; }
.abt-ver{
  display:inline-block; margin-top:.35rem; padding:.1rem .45rem;
  font-family:var(--font-mono); font-size:.58rem; font-weight:700;
  color:var(--accent); background:rgba(var(--accent-rgb),.13);
  border-radius:5px; letter-spacing:.04em;
}

/* ── Bölümler ── */
.abt-sec{ display:flex; flex-direction:column; gap:.5rem; }
.abt-sec-lbl{
  font-size:.56rem; font-weight:800; letter-spacing:.13em; text-transform:uppercase;
  color:var(--muted);
}
.abt-row{
  display:flex; align-items:center; gap:.7rem;
  background:rgba(var(--shine-rgb),.045);
  border:1px solid rgba(var(--shine-rgb),.06);
  border-radius:12px; padding:.65rem .75rem;
}
.abt-row-ic{
  width:34px; height:34px; flex-shrink:0; border-radius:10px;
  background:rgba(var(--accent-rgb),.14); color:var(--accent);
  display:flex; align-items:center; justify-content:center;
}
.abt-row-main{ flex:1; min-width:0; }
.abt-row-title{
  font-size:.84rem; font-weight:700; color:var(--txt);
  overflow:hidden; text-overflow:ellipsis; white-space:nowrap;
}
.abt-row-desc{ font-size:.68rem; color:var(--muted); margin-top:.12rem; }
.abt-row-desc b{ color:var(--txt); font-weight:700; }

/* Müzik aç/kapa */
.abt-mbtn{
  width:38px; height:38px; flex-shrink:0; border-radius:11px; cursor:pointer;
  background:rgba(var(--shine-rgb),.06); border:1px solid rgba(var(--shine-rgb),.09);
  color:var(--muted); display:flex; align-items:center; justify-content:center;
  transition:background .15s, color .15s, border-color .15s;
}
.abt-mbtn:hover{ background:rgba(var(--shine-rgb),.12); color:var(--txt); }
.abt-mbtn.on{
  background:rgba(var(--accent-rgb),.18); border-color:rgba(var(--accent-rgb),.4);
  color:var(--accent);
}

/* Ses kaydırağı */
.abt-vol{
  display:flex; align-items:center; gap:.6rem;
  font-size:.66rem; color:var(--muted); padding:0 .2rem;
}
.abt-vol input[type=range]{
  flex:1; height:4px; border-radius:3px; appearance:none; cursor:pointer;
  background:rgba(var(--shine-rgb),.14);
}
.abt-vol input[type=range]::-webkit-slider-thumb{
  appearance:none; width:14px; height:14px; border-radius:50%;
  background:var(--accent); border:none; cursor:pointer;
  box-shadow:0 1px 5px rgba(0,0,0,.4);
}
.abt-vol input[type=range]::-moz-range-thumb{
  width:14px; height:14px; border-radius:50%; background:var(--accent);
  border:none; cursor:pointer;
}

.abt-note{
  font-size:.73rem; color:var(--muted); line-height:1.6;
  background:rgba(var(--shine-rgb),.04);
  border-left:2px solid rgba(var(--accent-rgb),.5);
  border-radius:0 8px 8px 0; padding:.6rem .75rem;
}
.abt-foot{
  text-align:center; font-size:.66rem; color:var(--muted); opacity:.7;
  padding-top:.2rem;
}

@media (max-width: 768px){
  .abt-card{ width:100%; padding:1.25rem 1.1rem 1rem; border-radius:16px; }
  .abt-title{ font-size:1.12rem; }
  .abt-logo{ width:46px; height:46px; }
}

/* Discord bağlantısı (künye) */
.abt-discord{
  display:flex; align-items:center; gap:.7rem; text-decoration:none;
  background:rgba(88,101,242,.12);
  border:1px solid rgba(88,101,242,.32);
  border-radius:12px; padding:.65rem .75rem; color:var(--txt);
  transition:background .15s ease, border-color .15s ease, transform .12s ease;
}
.abt-discord:hover{
  background:rgba(88,101,242,.22); border-color:rgba(88,101,242,.55);
  transform:translateY(-1px);
}
.abt-discord .abt-row-ic{ background:rgba(88,101,242,.22); color:#aeb8ff; }
.abt-discord .abt-row-main{ display:flex; flex-direction:column; flex:1; min-width:0; }
.abt-go{ color:var(--muted); flex-shrink:0; transform:rotate(45deg); display:flex; }