/* 🧩 GÜNÜN BULMACASI (gunun-bulmacasi.js) + Arena yarışı (bulmaca-arena.js) — gb-* .
   Renk kuralı (Riven: "sabit zemin + temadan yazı KARIŞTIRMA"): kutular ve şerit SABİT çift (pastel zemin + koyu mürekkep; koyu
   temada koyu zemin + açık mürekkep), kart/klavye/liste/düğmeler TEMA çifti (--card/--ink/--muted/--line). Kontrast her temada ≥ 4.5.
   Koyu takım: :root[data-theme="dark"] (tema yok + koyu; Dinamik) ve Gece Laciverti. Öteki 4 renk teması açık takımı kullanır. */
.gb-kok {
  --gb-ink:#1B2233; --gb-ink-s:#1B2233; --gb-odak:#1B2233;
  --gb-a0:#FFD6C7; --gb-a1:#FFE7A8; --gb-a2:#D9F0B4; --gb-a3:#C3EEE2; --gb-a4:#CFE2FF; --gb-a5:#E0D5FF; --gb-a6:#FFD3E7; --gb-a7:#C4ECF6;
  --gb-s0:#FFB8A3; --gb-s1:#FFD677; --gb-s2:#BDE38C; --gb-s3:#94E0CD; --gb-s4:#AACBFF; --gb-s5:#C9BBFF; --gb-s6:#FFB3D6; --gb-s7:#98DCEC;
  --gb-c0:#E8603C; --gb-c1:#D99A06; --gb-c2:#6FA324; --gb-c3:#1E9C82; --gb-c4:#3D7BE0; --gb-c5:#7B5CE6; --gb-c6:#DB4A8C; --gb-c7:#1C98B8;
  --gb-ok:#15803D; --gb-ok-ink:#FFFFFF; --gb-kirmizi:#D93A40; --gb-kirmizi-ink:#FFFFFF;
  --gb-p1:#1F5FD1; --gb-p1-ink:#FFFFFF; --gb-p2:#B43C8A; --gb-p2-ink:#FFFFFF;   /* Arena yarışı: sen / rakip */
  --gb-golge:0 2px 0 rgba(27,34,51,.14), 0 4px 10px rgba(27,34,51,.06);
  display:flex; flex-direction:column; gap:12px;
}
:root[data-theme="dark"] .gb-kok, :root[data-koci-tema="gece-laciverti"] .gb-kok {
  /* koyu: seçili olmayan = canlı rengin laciverde karışmış tonu + açık mürekkep; seçili = canlı renk + koyu mürekkep */
  --gb-ink:#F7F9FF; --gb-ink-s:#0E1526; --gb-odak:#FFFFFF;
  --gb-a0:#694E53; --gb-a1:#696248; --gb-a2:#4B6852; --gb-a3:#34676D; --gb-a4:#3E5985; --gb-a5:#4F5184; --gb-a6:#694F6E; --gb-a7:#33637D;
  --gb-s0:#F28B6B; --gb-s1:#F2C14E; --gb-s2:#9ED36A; --gb-s3:#5FD0B5; --gb-s4:#7AA8F7; --gb-s5:#A993F5; --gb-s6:#F28DB8; --gb-s7:#5CC6E0;
  --gb-c0:#FF8A6B; --gb-c1:#F5C04A; --gb-c2:#A6D96A; --gb-c3:#5FD6BD; --gb-c4:#7FB0FF; --gb-c5:#B39DFF; --gb-c6:#FF8FC0; --gb-c7:#6FD3EA;
  --gb-ok:#34C77B; --gb-ok-ink:#07251A; --gb-kirmizi:#FF7A7F; --gb-kirmizi-ink:#2B0709;
  --gb-p1:#7FB0FF; --gb-p1-ink:#0B1A33; --gb-p2:#FF8FC0; --gb-p2-ink:#33061C;
  --gb-golge:0 2px 0 rgba(0,0,0,.35), 0 6px 14px rgba(0,0,0,.25);
}
.gb-kok [hidden] { display:none !important; }
.gb-kok .ik svg { width:1.1em; height:1.1em; }

/* ── mod seçici: Tek başına · Koçi'ye karşı · 2 kişilik (tema çifti; seçili = ters çift) */
.gb-mod { display:grid; grid-template-columns:repeat(3, 1fr); gap:4px; padding:4px; border-radius:18px; background:var(--card); border:1px solid var(--line); }
.gb-mod-d { display:flex; align-items:center; justify-content:center; gap:5px; border:0; border-radius:14px; padding:6px 4px; background:none; color:var(--muted); font:inherit; cursor:pointer; min-height:40px; }
.gb-mod-d b { font-size:13.5px; line-height:1.15; color:var(--ink); white-space:nowrap; }
.gb-mod-d .ik svg { width:17px; height:17px; }
.gb-mod-d.on { background:var(--ink); color:var(--card); box-shadow:var(--gb-golge); } .gb-mod-d.on b { color:var(--card); }
.gb-mod-d:focus-visible { outline:3px solid var(--primary); outline-offset:2px; }

/* ── oyun alanı */
.gb-oyun { display:flex; flex-direction:column; gap:10px; background:var(--card); color:var(--ink); border:1px solid var(--line); border-radius:var(--radius, 18px); padding:12px 10px; box-shadow:var(--gb-golge); }
.gb-ust { display:flex; align-items:center; gap:10px; font-size:14px; color:var(--ink); padding:0 4px; }
.gb-sayi { white-space:nowrap; } .gb-sayi b { font-size:17px; }
.gb-cubuk { flex:1; height:8px; border-radius:6px; background:var(--line); overflow:hidden; } .gb-cubuk i { display:block; height:100%; border-radius:6px; background:var(--gb-ok); transition:width .35s; }
.gb-odul { display:inline-flex; align-items:center; gap:4px; font-weight:800; font-size:13px; padding:4px 9px; border-radius:99px; border:1px solid var(--line); color:var(--ink); white-space:nowrap; }
.gb-serit-ic { display:flex; align-items:center; gap:8px; min-height:46px; padding:8px 12px; border-radius:14px; background:var(--ks); color:var(--gb-ink-s); box-shadow:inset 0 0 0 1px rgba(0,0,0,.06); }
.gb-serit-ic b { font-size:15px; white-space:nowrap; } .gb-serit-ic span { flex:1; font-size:16.5px; font-weight:700; line-height:1.25; min-width:0; }
.gb-serit-ic small { font-size:12.5px; font-weight:700; white-space:nowrap; opacity:.9; } .gb-serit-ic em { font-style:normal; font-weight:800; display:inline-flex; gap:3px; align-items:center; }

/* ── ızgara: kutular SABİT çift; iki kelimenin kesiştiği kutu iki rengin çaprazı */
.gb-tahta { display:flex; justify-content:center; }
.gb-izgara { --kmax:min(44px, calc((296px - (var(--r) - 1) * 4px) / var(--r))); display:grid; grid-template-columns:repeat(var(--c), minmax(0, 1fr)); gap:4px;
  width:min(100%, calc(var(--c) * var(--kmax) + (var(--c) - 1) * 4px)); margin:0 auto; }
.gb-izgara.kucuk { --kmax:min(36px, calc((280px - (var(--r) - 1) * 3px) / var(--r))); gap:3px; width:min(100%, calc(var(--c) * var(--kmax) + (var(--c) - 1) * 3px)); }
.gb-k { position:relative; aspect-ratio:1; border:0; padding:0; margin:0; border-radius:9px; display:grid; place-items:center; cursor:pointer; font:inherit;
  background:linear-gradient(135deg, var(--k1) 0 50%, var(--k2) 50% 100%); color:var(--gb-ink); box-shadow:0 2px 0 rgba(0,0,0,.12); transition:transform .12s, background-color .2s; -webkit-tap-highlight-color:transparent; }
.gb-k .gb-h { font-size:clamp(14px, 4.9vw, 21px); font-weight:800; line-height:1; text-transform:uppercase; }
.gb-izgara.kucuk .gb-k .gb-h { font-size:clamp(12px, 4vw, 16px); } .gb-izgara.kucuk .gb-k { border-radius:7px; cursor:default; }
.gb-k .gb-no { position:absolute; top:2px; left:3px; font-style:normal; font-size:9.5px; font-weight:800; line-height:1; color:inherit; }
.gb-k.sec { background:var(--ks); color:var(--gb-ink-s); } .gb-izgara.doygun .gb-k { color:var(--gb-ink-s); }
.gb-k.aktif { box-shadow:0 0 0 3px var(--gb-odak), 0 2px 0 rgba(0,0,0,.12); z-index:1; transform:scale(1.04); }
.gb-k.acik .gb-h { text-decoration:underline 2px; text-underline-offset:3px; }   /* "Harf aç" ile açılan kutu */
.gb-k.acik::after { content:""; position:absolute; right:3px; bottom:3px; width:6px; height:6px; border-radius:50%; background:currentColor; opacity:.7; }
.gb-k.ok { background:var(--gb-ok); color:var(--gb-ok-ink); cursor:default; }
.gb-k.p1 { background:var(--gb-p1); color:var(--gb-p1-ink); } .gb-k.p2 { background:var(--gb-p2); color:var(--gb-p2-ink); }
.gb-k:focus-visible { outline:3px solid var(--gb-odak); outline-offset:1px; }
/* animasyonlar: doğru = sırayla zıplayıp yeşile döner · yanlış = sallanır + kırmızı yanıp söner · açılan harf = parlama */
.gb-k.an-dogru { animation:gbDogru .5s ease-out both; animation-delay:var(--gec, 0ms); }
.gb-k.an-yanlis { animation:gbSalla .42s ease-in-out, gbKirmizi .7s ease-out; }
.gb-k.an-acil { animation:gbParla .6s ease-out; }
@keyframes gbDogru { 0% { transform:scale(1); } 45% { transform:scale(1.16) rotate(-3deg); } 100% { transform:scale(1); } }
@keyframes gbSalla { 0%, 100% { translate:0; } 20% { translate:-6px; } 40% { translate:6px; } 60% { translate:-4px; } 80% { translate:3px; } }
@keyframes gbKirmizi { 0%, 60% { background:var(--gb-kirmizi); color:var(--gb-kirmizi-ink); } 100% { } }
@keyframes gbParla { 0% { transform:scale(1); filter:brightness(1); } 40% { transform:scale(1.12); filter:brightness(1.18); } 100% { transform:scale(1); filter:brightness(1); } }

/* ── ipucu düğmeleri + ortak düğme (tema çifti) */
.gb-yardim { display:grid; grid-template-columns:1fr 1fr; gap:8px; padding:0 2px 2px; }
.gb-dug { display:inline-flex; align-items:center; justify-content:center; gap:6px; min-height:44px; padding:8px 12px; border-radius:14px; font:inherit; font-size:14.5px; font-weight:800; cursor:pointer;
  background:var(--card); color:var(--ink); border:2px solid var(--line); box-shadow:0 3px 0 var(--line); }
.gb-dug .ik { color:var(--primary); } .gb-dug:active { transform:translateY(2px); box-shadow:0 1px 0 var(--line); }
.gb-dug:disabled { opacity:.5; cursor:default; transform:none; }
.gb-dug.onay { border-color:var(--bad); } .gb-dug.onay .ik { color:var(--bad); }
.gb-dug.genis { width:100%; min-height:52px; font-size:16px; }
.gb-dug.kucuk { min-height:38px; padding:5px 10px; font-size:14px; border-radius:12px; border-width:1.5px; box-shadow:0 2px 0 var(--line); }
.gb-dug.birincil { background:var(--ink); color:var(--card); border-color:var(--ink); box-shadow:0 3px 0 color-mix(in srgb, var(--ink) 60%, transparent); } .gb-dug.birincil .ik { color:var(--card); }

/* ── ekran klavyesi (tema çifti) — kaydırırken altta kalır, ipucu listesi altından geçer */
.gb-klavye { position:sticky; bottom:0; z-index:3; display:flex; flex-direction:column; gap:6px; margin:0 -8px; padding:8px 6px 12px; background:var(--bg);
  border-top:1px solid var(--line); box-shadow:0 -6px 14px rgba(0,0,0,.06); }
.gb-ks { display:flex; justify-content:center; gap:5px; }
.gb-tus { flex:1 1 0; max-width:40px; min-width:0; height:43px; border-radius:10px; border:1px solid var(--line); border-bottom-width:3px; background:var(--card); color:var(--ink);
  font:inherit; font-size:17px; font-weight:800; padding:0; cursor:pointer; touch-action:manipulation; -webkit-tap-highlight-color:transparent; }
.gb-tus.genis { max-width:62px; flex-grow:1.6; display:grid; place-items:center; } .gb-tus.genis .ik svg { width:22px; height:22px; }
.gb-tus:active { transform:translateY(2px); border-bottom-width:1px; }

/* ── ipucu listesi (tema çifti; seçili satır sabit çift) */
.gb-liste h3 { margin:4px 0 6px; font-size:15px; display:flex; align-items:baseline; gap:6px; } .gb-liste h3 small { color:var(--muted); font-weight:700; }
.gb-liste ul, .gb-sozluk ul { list-style:none; margin:0 0 6px; padding:0; display:flex; flex-direction:column; gap:4px; }
.gb-ip { width:100%; display:flex; align-items:center; gap:8px; padding:9px 10px; border-radius:12px; border:0; background:none; color:var(--ink); font:inherit; font-size:15px; text-align:left; cursor:pointer; }
.gb-ip:hover { background:color-mix(in srgb, var(--ink) 6%, transparent); }
.gb-ip.sec { background:var(--ks); color:var(--gb-ink-s); }
.gb-ip.ok .gb-ip-tx { text-decoration:line-through; text-decoration-thickness:1.5px; }
.gb-nokta { flex:none; width:12px; height:12px; border-radius:50%; background:var(--kc); box-shadow:0 0 0 2px color-mix(in srgb, var(--kc) 30%, transparent); }
.gb-ip-no { min-width:18px; } .gb-ip-tx { flex:1; min-width:0; } .gb-ip-tx small { font-size:13px; font-weight:700; }
.gb-ip em { font-style:normal; font-weight:800; font-size:13.5px; display:inline-flex; align-items:center; gap:3px; }
.gb-klasik { text-align:center; margin:2px 0 8px; }
.gb-klasik button { display:inline-flex; align-items:center; gap:6px; border:0; background:none; font:inherit; font-size:14px; font-weight:700; color:var(--muted); text-decoration:underline; text-underline-offset:3px; cursor:pointer; padding:10px; }

/* ── nasıl oynanır: küçük örnek */
.gb-nasil .nasil-ic { gap:12px; }
.gb-ornek { display:flex; gap:14px; align-items:center; }
.gb-izgara.ornek { width:112px; flex:none; gap:3px; } .gb-izgara.ornek .gb-k { cursor:default; --k1:var(--gb-a4); --k2:var(--gb-a4); } .gb-izgara.ornek .gb-h { font-size:17px; }
.gb-ornek-ip { list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:6px; font-size:14.5px; color:var(--ink); }
.gb-ornek-ip li.gb-oi { display:flex; align-items:center; gap:6px; flex-wrap:wrap; } .gb-ornek-ip li { line-height:1.4; } .gb-ornek-ip u { text-decoration-thickness:2px; }
.gb-ornek-ip .gb-tik svg { width:16px; height:16px; }
.gb-kurallar { margin:0; padding-left:20px; display:flex; flex-direction:column; gap:6px; font-size:14.5px; line-height:1.4; color:var(--ink); }

/* ── bitiş: kutlama (sabit çift: koyu yeşil + beyaz), sözlük, istatistik, kalan süre */
.gb-kutlama { display:flex; align-items:center; gap:12px; padding:16px; border-radius:22px; color:#FFFFFF;
  background:radial-gradient(circle at 90% 10%, rgba(255,255,255,.16) 0, transparent 45%), linear-gradient(135deg, #15803D, #0E5E3C); box-shadow:0 10px 24px rgba(14,94,60,.28); }
.gb-kutlama .kp-ik { width:52px; height:52px; border-radius:16px; flex:none; } .gb-kutlama .kp-ik svg { width:28px; height:28px; }
.gb-kutlama div { flex:1; min-width:0; } .gb-kutlama h2 { margin:0; font-size:21px; color:#FFFFFF; } .gb-kutlama p { margin:3px 0 0; font-size:14px; line-height:1.35; color:#FFFFFF; }
.gb-xp { display:inline-block; margin-top:8px; font-weight:900; font-size:16px; padding:5px 11px; border-radius:12px; background:#FFFFFF; color:#0E5E3C; }
.gb-sozluk h3, .gb-ist h3 { margin:0 0 10px; font-size:16px; display:flex; align-items:center; gap:6px; } .gb-sozluk h3 .ik, .gb-ist h3 .ik { color:var(--primary); }
.gb-sozluk li { display:flex; align-items:center; gap:10px; padding:6px 2px; border-bottom:1px solid var(--line); } .gb-sozluk li:last-child { border-bottom:0; }
.gb-dinle { flex:none; width:40px; height:40px; border-radius:50%; border:2px solid var(--line); background:var(--card); color:var(--ink); display:grid; place-items:center; cursor:pointer; padding:0; }
.gb-dinle .ik svg { width:19px; height:19px; } .gb-dinle:active { transform:scale(.94); }
.gb-soz { flex:1; min-width:0; display:flex; flex-direction:column; } .gb-soz b { font-size:16px; letter-spacing:.04em; } .gb-soz small { font-size:14px; color:var(--muted); }
.gb-etiket { flex:none; font-style:normal; font-size:12px; font-weight:800; padding:3px 8px; border-radius:8px; border:1px solid var(--line); color:var(--muted); }
.gb-ist-s { display:grid; grid-template-columns:repeat(4, 1fr); gap:6px; text-align:center; }
.gb-ist-s div { display:flex; flex-direction:column; gap:2px; padding:8px 2px; border-radius:12px; border:1px solid var(--line); }
.gb-ist-s b { font-size:20px; display:inline-flex; justify-content:center; align-items:center; gap:2px; } .gb-ist-s b .ik { color:var(--primary); } .gb-ist-s small { font-size:11.5px; color:var(--muted); }
.gb-sonraki { display:flex; align-items:center; gap:10px; flex-wrap:wrap; } .gb-sonraki > .ik { color:var(--primary); } .gb-sonraki > .ik svg { width:24px; height:24px; }
.gb-sonraki span { display:flex; flex-direction:column; font-size:13px; color:var(--muted); } .gb-sonraki span b { font-size:19px; color:var(--ink); }
.gb-sonraki small { margin-left:auto; font-size:12.5px; color:var(--muted); }

/* ── 🧩 Bulmaca Yarışı (bulmaca-arena.js): sen = p1 (mavi), rakip = p2 (pembe) — sabit çiftler; skor ve liste tema çifti */
.gby-kart { display:flex; flex-direction:column; gap:10px; } .gby-kart h2 { margin:0; font-size:18px; display:flex; align-items:center; gap:8px; } .gby-kart h2 .ik { color:var(--primary); } .gby-kart p { margin:0; }
.gby-zorluk { display:grid; gap:8px; } .gby-z { flex-direction:column; align-items:flex-start; min-height:58px; } .gby-z b { font-size:16px; } .gby-z small { font-weight:600; color:var(--muted); font-size:13px; }
.gby-kodgir { display:flex; gap:8px; } .gby-kodgir input { flex:1; min-width:0; font-size:17px; padding:10px 12px; border-radius:12px; border:2px solid var(--line); background:var(--card); color:var(--ink); }
.gby-not { margin:0; text-align:center; font-size:14px; color:var(--ink); } .gby-ad { margin:0; text-align:center; }
.gby-renk { font-weight:800; padding:0 6px; border-radius:6px; } .gby-renk.p1, .gby-sahip.p1 { background:var(--gb-p1); color:var(--gb-p1-ink); } .gby-renk.p2, .gby-sahip.p2 { background:var(--gb-p2); color:var(--gb-p2-ink); }
.gby-sahip { font-style:normal; font-size:12.5px; font-weight:800; padding:3px 8px; border-radius:8px; }
.gby-skor { display:grid; grid-template-columns:1fr auto 1fr; gap:8px; align-items:stretch; }
.gby-skor.sonuc { grid-template-columns:1fr 1fr; }
.gby-oyuncu { display:flex; flex-direction:column; align-items:center; gap:1px; padding:7px 6px; border-radius:14px; text-align:center; min-width:0; }
.gby-oyuncu.p1 { background:var(--gb-p1); color:var(--gb-p1-ink); } .gby-oyuncu.p2 { background:var(--gb-p2); color:var(--gb-p2-ink); }
.gby-oyuncu .gby-ad { font-size:13px; font-weight:800; max-width:100%; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; } .gby-oyuncu b { font-size:24px; line-height:1.1; } .gby-oyuncu small { font-size:11.5px; font-weight:700; }
.gby-oyuncu .ar-engel { color:inherit; }
.gby-oyuncu .ar-auto-label { display:block; margin:0; padding:0; background:none; border:0; color:inherit; font-size:11px; font-weight:800; }   /* arena.js "Otomatik rakip" etiketi kartın kendi mürekkebiyle */
.gby-orta { display:flex; flex-direction:column; align-items:center; justify-content:center; padding:0 6px; color:var(--ink); } .gby-orta span { font-size:20px; font-weight:900; font-variant-numeric:tabular-nums; } .gby-orta small { color:var(--muted); font-weight:700; }
.gby-mesaj { margin:0; min-height:20px; text-align:center; font-size:14px; font-weight:700; color:var(--ink); }
.gby-kural { margin:0 0 2px; text-align:center; font-size:12.5px; font-weight:700; color:var(--muted); display:flex; align-items:center; justify-content:center; gap:5px; }
.gb-ip.kapali .gb-ip-tx { opacity:.7; }
.gby-dug { display:grid; grid-template-columns:1fr 1fr; gap:8px; }
.gb-kutlama.yenilgi, .gb-kutlama.berabere { background:linear-gradient(135deg, #3B4A63, #253046); box-shadow:0 10px 24px rgba(20,30,50,.25); }
.gby-engel { display:flex; gap:4px; margin-top:2px; }

@media (max-width:360px) { .gb-mod-d small { display:none; } .gb-ornek { flex-direction:column; align-items:flex-start; } .gb-ist-s { grid-template-columns:repeat(2, 1fr); } }
@media (prefers-reduced-motion:reduce) {
  .gb-k, .gb-k.an-dogru, .gb-k.an-yanlis, .gb-k.an-acil, .gb-cubuk i { animation:none !important; transition:none !important; }
  .gb-k.aktif { transform:none; }
}