/* 🎨 Ortak simge ailesi (ikon.js). Satır içi simge metnin boyuna uyar; kutucuk stilleri (.kp-ik, .t-*) duzen-plan.css'te. */
.ik { display:inline-grid; place-items:center; vertical-align:-.18em; line-height:1; }
.ik svg { width:1.15em; height:1.15em; display:block; }
.ik-sol { margin-right:.35em; } .ik-sag { margin-left:.35em; }
/* 💬 öneri şeridi (Riven 29 Eyl): ince, yalnız ana sayfada; kapatınca 7 gün görünmez */
.fb-banner { display:flex; align-items:center; gap:8px; margin:0 18px 6px; padding:6px 8px 6px 10px; border-radius:99px; font-size:12px; font-weight:700;
  background:color-mix(in srgb, var(--primary) 12%, transparent); border:1px solid color-mix(in srgb, var(--primary) 30%, transparent); color:var(--ink); cursor:pointer; }
.fb-banner .ik { color:var(--primary); flex:0 0 auto; }   /* yeni kullanıcı denetimi 15 Eki (KAYIT-13): style.css'teki ".fb-banner span { flex:1 }" simgeye de uyuyor, yazı 146 px'e sıkışıp kesiliyordu */
.fb-banner span.fb-yazi { flex:1; min-width:0; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.fb-banner button { border:0; background:none; color:var(--muted); width:26px; height:26px; border-radius:50%; display:grid; place-items:center; padding:0; cursor:pointer; }
.fb-banner button:hover { background:color-mix(in srgb, var(--ink) 8%, transparent); }
:root[data-theme="dark"] .fb-banner { background:color-mix(in srgb, var(--primary) 14%, transparent); border-color:color-mix(in srgb, var(--primary) 30%, transparent); color:var(--ink); }
/* Tüm bölümler kutuları (30 Eyl, emoji yerine simge kutucuğu) */
.bolum .ic .kp-ik { width:36px; height:36px; border-radius:11px; } .bolum .ic .kp-ik svg { width:19px; height:19px; }
.list .item b .ik { color:var(--primary); }
.ara-item .ara-ikon .ik svg { width:22px; height:22px; color:var(--primary); margin:0 auto; }

/* 🏟️ Arena (30 Eyl: emoji yerine SVG + kapaklı oyun kartları; Word Punch ve Nitro düzeni aynı) */
.hero-emoji .kp-ik { width:64px; height:64px; border-radius:20px; margin:0 auto; } .hero-emoji .kp-ik svg { width:32px; height:32px; }
.ah-ikon .kp-ik { width:48px; height:48px; border-radius:15px; } .ah-ikon .kp-ik svg { width:26px; height:26px; }
.ao-ikon .kp-ik { width:46px; height:46px; border-radius:14px; }
.arena-giris .ic .kp-ik { width:46px; height:46px; border-radius:14px; } .duel-card .ic .kp-ik { width:40px; height:40px; border-radius:12px; margin:0 auto; }
.arena-oyun.ao-yeni { padding:0; overflow:hidden; }
.ao-kapak { position:relative; aspect-ratio:16/8; display:flex; align-items:flex-end; overflow:hidden; background:linear-gradient(135deg, var(--primary), #1e1b2e); }
.ao-kapak.t-kirmizi { background:linear-gradient(135deg, #ff6b6b, #7a1020); } .ao-kapak.t-turuncu { background:linear-gradient(135deg, #ffa94d, #8a3b00); } .ao-kapak.t-turkuaz { background:linear-gradient(135deg, #3bc9db, #0b4f63); }
.ao-kapak.t-mor { background:linear-gradient(135deg, #9775fa, #2b1766); } .ao-kapak.t-mavi { background:linear-gradient(135deg, #4dabf7, #0b3a75); } .ao-kapak.t-yesil { background:linear-gradient(135deg, #51cf66, #0b5d25); }
.ao-kapak.t-pembe { background:linear-gradient(135deg, #f783ac, #7a1745); } .ao-kapak.t-sari { background:linear-gradient(135deg, #ffd43b, #8a5a00); } .ao-kapak.t-gri { background:linear-gradient(135deg, #868e96, #212529); }
.ao-kapak > img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.ao-kapak::after { content:""; position:absolute; inset:0; background:linear-gradient(180deg, rgba(0,0,0,0) 35%, rgba(0,0,0,.72)); }
.ao-kapak-ik { position:absolute; top:12px; left:12px; z-index:1; } .ao-kapak-ik .kp-ik { width:44px; height:44px; border-radius:14px; box-shadow:0 6px 16px rgba(0,0,0,.35); }
.ao-kapak-tx { position:relative; z-index:1; padding:12px 14px; color:#fff; } .ao-kapak-tx h2 { margin:0; font-size:21px; color:#fff; text-shadow:0 2px 10px rgba(0,0,0,.4); }
.ao-etiket { display:flex; gap:6px; flex-wrap:wrap; margin-top:6px; } .ao-etiket span { display:inline-flex; align-items:center; gap:4px; font-size:12px; font-weight:700; background:rgba(255,255,255,.18); backdrop-filter:blur(6px); border-radius:99px; padding:3px 9px; }
.ao-etiket svg { width:13px; height:13px; }
.ao-yeni .ao-ne, .ao-yeni .ao-dugme, .ao-yeni > p { margin-left:14px; margin-right:14px; } .ao-yeni .ao-dugme { margin-bottom:14px; }
.ar-mdl { display:inline-grid; place-items:center; width:22px; height:22px; border-radius:50%; font-style:normal; font-weight:900; font-size:12px; color:#3a2600; background:#ffd43b; box-shadow:inset 0 -2px 0 rgba(0,0,0,.15); }
.ar-mdl.m2 { background:#dee2e6; color:#343a40; } .ar-mdl.m3 { background:#e8a36b; color:#3f1d00; }
.bm .ik svg, .dr .ik svg { width:15px; height:15px; }

/* 🧭 Koçi Rehber (rehber.js) */
.rh-hizli { margin-bottom:8px; } .rh-hizli small { display:flex; align-items:center; font-size:12px; font-weight:800; color:var(--muted); margin-bottom:6px; }
.rh-hizli > div { display:flex; gap:6px; overflow-x:auto; scrollbar-width:none; padding-bottom:2px; }
.rh-hizli button { flex:none; border:1px solid var(--line); background:var(--card); color:var(--ink); border-radius:99px; padding:7px 12px; font:inherit; font-size:13.5px; font-weight:700; cursor:pointer; }
.rh-balon { max-width:92%; } .rh-etiket { display:inline-flex; align-items:center; font-size:11px; font-weight:900; letter-spacing:.06em; text-transform:uppercase; color:var(--primary); }
.rh-balon p { margin:4px 0 8px; } .rh-dug { display:flex; flex-wrap:wrap; gap:6px; }
.rh-git { display:inline-flex; align-items:center; border:0; background:var(--primary); color:var(--koci-on-primary, #fff); border-radius:12px; padding:8px 12px; font:inherit; font-size:13.5px; font-weight:800; cursor:pointer; }