/* Karakterler: yüz ifadeleri ve küçük hareketler. Yalnızca transform ve opacity oynar. */
.karakter { --boy: 44px; --kr-yuz: #0B1022; display: inline-grid; width: var(--boy); height: var(--boy); flex: none; }
.karakter svg { width: 100%; height: 100%; overflow: visible; display: block; }
.karakter svg * { transform-box: fill-box; transform-origin: center; }

.kr-govde, .kr-dolu { fill: var(--ses); }
.kr-hat { fill: none; stroke: var(--ses); stroke-width: 3.2; stroke-linecap: round; }
.kr-hat.kr-kalin { stroke-width: 3.8; }
.kr-maske { fill: rgb(11 16 34 / .2); stroke: rgb(11 16 34 / .45); stroke-width: 1.4; }
.kr-ic { fill: none; stroke: rgb(11 16 34 / .2); stroke-width: 1.4; }
.kr-serit rect { fill: rgb(11 16 34 / .62); }
.kr-duduk > * { fill: #FFFFFF; stroke: rgb(11 16 34 / .5); stroke-width: 1; }
.kr-kart { fill: #FFD23F; stroke: rgb(11 16 34 / .45); stroke-width: 1; opacity: 0; transform: translateY(8px) rotate(-14deg); transition: opacity 160ms ease-out, transform 260ms cubic-bezier(.16, 1, .3, 1); }
.kr-yanak { fill: #FFFFFF; opacity: .26; }
.kr-goz ellipse, .kr-agiz-o { fill: var(--kr-yuz); }
.kr-parilti { fill: #FFFFFF; }
.kr-cizgi { fill: none; stroke: var(--kr-yuz); stroke-width: 2.6; stroke-linecap: round; stroke-linejoin: round; }
.kr-sapka { opacity: 0; }
.kr-sapka path { fill: #FFFFFF; stroke: rgb(11 16 34 / .28); stroke-width: 1; }
.kr-sapka rect { fill: #DDE3F2; stroke: rgb(11 16 34 / .28); stroke-width: 1; }
.karakter.sef .kr-sapka { opacity: 1; }
.karakter.sef .kr-tepe { opacity: 0; }
.kr-dusunce circle { fill: var(--metin, #EEF2FB); }
.kr-pirilti { fill: #FFE27A; }
.kr-uyku { fill: none; stroke: var(--metin-2, #B2BCD6); stroke-width: 2.2; stroke-linecap: round; stroke-linejoin: round; }

/* varsayılan: açık göz, hafif tebessüm */
.kr-goz-mutlu, .kr-goz-carpi, .kr-goz-kapali, .kr-agiz-gulen, .kr-agiz-o, .kr-agiz-dalga, .kr-dusunce, .kr-pirilti, .kr-uyku { opacity: 0; }
.kr-goz, .kr-gozler, .kr-agiz, .kr-dusunce, .kr-pirilti, .kr-uyku { transition: opacity 140ms ease-out, transform 220ms cubic-bezier(.16, 1, .3, 1); }
.kr-goz { animation: kr-kirp 5.2s infinite; }
.karakter[data-kim="gemini"] .kr-goz { animation-delay: -1.3s; }
.karakter[data-kim="deepseek"] .kr-goz { animation-delay: -2.6s; }
.karakter[data-kim="nvidia"] .kr-goz { animation-delay: -3.7s; }
@keyframes kr-kirp { 0%, 95%, 100% { transform: scaleY(1); } 97.5% { transform: scaleY(.08); } }

/* bağlanıyor: gözler sağa sola bakar */
.karakter[data-durum="baglaniyor"] .kr-gozler { animation: kr-bakin 1.4s ease-in-out infinite; }
@keyframes kr-bakin { 0%, 100% { transform: translateX(-2px); } 50% { transform: translateX(2px); } }

/* düşünüyor: yukarı bakar, ağız o olur, baloncuklar çıkar */
.karakter[data-durum="dusunuyor"] .kr-gozler { transform: translate(1.6px, -2.6px); }
.karakter[data-durum="dusunuyor"] .kr-agiz-duz { opacity: 0; }
.karakter[data-durum="dusunuyor"] .kr-agiz-o { opacity: 1; }
.karakter[data-durum="dusunuyor"] .kr-dusunce { opacity: 1; }
.karakter[data-durum="dusunuyor"] .kr-dusunce circle { animation: kr-balon 1.2s ease-in-out infinite; }
.karakter[data-durum="dusunuyor"] .kr-dusunce circle:nth-child(2) { animation-delay: .18s; }
.karakter[data-durum="dusunuyor"] .kr-dusunce circle:nth-child(3) { animation-delay: .36s; }
@keyframes kr-balon { 0%, 100% { transform: translateY(0); opacity: .55; } 50% { transform: translateY(-2.2px); opacity: 1; } }

/* yazıyor: aşağı bakar, gövde hafifçe zıplar */
.karakter[data-durum="yaziyor"] .kr-gozler { transform: translateY(2.2px); }
.karakter[data-durum="yaziyor"] svg { animation: kr-zipla .52s ease-in-out infinite alternate; }
@keyframes kr-zipla { from { transform: translateY(0); } to { transform: translateY(-2.5px); } }

/* puanlıyor: hakem kartı kaldırır */
.karakter[data-durum="puanliyor"] .kr-kart { opacity: 1; transform: translateY(0) rotate(8deg); }
.karakter[data-durum="puanliyor"] .kr-gozler { transform: translate(1.8px, -1.4px); }

/* bitti: gülen göz ve ağız, tek seferlik pırıltı */
.karakter[data-durum="bitti"] .kr-goz { opacity: 0; animation: none; }
.karakter[data-durum="bitti"] .kr-goz-mutlu, .karakter[data-durum="bitti"] .kr-agiz-gulen { opacity: 1; }
.karakter[data-durum="bitti"] .kr-agiz-duz { opacity: 0; }
.karakter[data-durum="bitti"] .kr-pirilti { animation: kr-pirilti .9s ease-out both; }
.karakter[data-durum="bitti"] svg { animation: kr-sevin .5s cubic-bezier(.16, 1, .3, 1) both; }
@keyframes kr-pirilti { 0% { opacity: 0; transform: scale(.3) rotate(-30deg); } 40% { opacity: 1; transform: scale(1.15) rotate(10deg); } 100% { opacity: 0; transform: scale(.7) rotate(30deg); } }
@keyframes kr-sevin { 0% { transform: translateY(0); } 40% { transform: translateY(-5px); } 100% { transform: translateY(0); } }

/* hata: çarpı göz, dalgalı ağız, tek seferlik sarsılma */
.karakter[data-durum="hata"] .kr-goz { opacity: 0; animation: none; }
.karakter[data-durum="hata"] .kr-goz-carpi, .karakter[data-durum="hata"] .kr-agiz-dalga { opacity: 1; }
.karakter[data-durum="hata"] .kr-agiz-duz { opacity: 0; }
.karakter[data-durum="hata"] svg { animation: kr-sars .4s ease-in-out both; }
@keyframes kr-sars { 0%, 100% { transform: translateX(0); } 25% { transform: translateX(-3px); } 75% { transform: translateX(3px); } }

/* durduruldu ve kapalı: gözler kapalı */
.karakter[data-durum="durdu"] .kr-goz, .karakter[data-durum="kapali"] .kr-goz { opacity: 0; animation: none; }
.karakter[data-durum="durdu"] .kr-goz-kapali, .karakter[data-durum="kapali"] .kr-goz-kapali { opacity: 1; }
.karakter[data-durum="kapali"] { filter: saturate(.25) brightness(.8); }
.karakter[data-durum="kapali"] .kr-uyku { opacity: .9; }

@media (prefers-reduced-motion: reduce) {
  .karakter svg, .karakter svg * { animation: none !important; transition: none !important; }
}

/* Yeni karakterlerin (karakterler-ek/) parçaları */
.kr-benek { fill: #FFFFFF; opacity: .55; }
.kr-isik { fill: #FFFFFF; opacity: .32; }
.kr-cicek { fill: #FF9EC6; stroke: rgb(11 16 34 / .35); stroke-width: 1; }
.kr-cicek-ic { fill: #FFE27A; }