/* Pyramid Solitaire - oyuna özel stiller (ortak kart.css'in üstüne) - ver 1.0 (2026-11-04) */
.ik.piramit{ background-image: url('tema/ikon-piramit.svg'); }

/* üstü kapalı (henüz alınamayan) piramit kartı hafif koyu: hangi kartların oynanabildiği bir bakışta görünsün */
.kart.ortulu .on{ filter: brightness(.74) saturate(.8); }

/* seçilen kart: turkuaz çerçeve + hafif yukarı kalkma (ikinci kart seçilince çift kalkar) */
.kart.secili .ic{
	box-shadow: 0 0 0 max(3px, calc(var(--kg) * .05)) #2fe3d0, 0 0 max(10px, calc(var(--kg) * .28)) rgba(47,227,208,.75);
	transform: translateY(calc(var(--kg) * -.08));
}
.kart.secili .ic{ transition: transform .12s ease-out, box-shadow .12s ease-out; }

/* deste yuvası: boşken desteyi yeniden çevirme (↻) ya da tur bitti (✕) */
.yuva.devir span{ font-size: calc(var(--kg) * .62); color: rgba(255,255,255,.55); line-height: 1; }
.yuva.devir.bitti span{ color: rgba(255,120,120,.45); }
.yuva.devir.isaret{ animation: isaret-nabiz 1s ease-in-out infinite; }
/* çıkan kartlar yığını (sağ üst / sağ alt): dokunulmaz */
.yuva.cikan{ cursor: default; }

/* ---------- eğitim penceresi (2026-11-04): toplam 13 örneği ---------- */
.py-egitim .kk-icerik{ text-align: center; }
.py-egitim .kk-icerik p{ margin: .6em 0 .2em; line-height: 1.45; }
.py-egitim .kk-icerik small{ opacity: .8; }
.py-ornek{ --kg: clamp(38px, 10vmin, 66px); display: flex; align-items: center; justify-content: center; gap: calc(var(--kg) * .18); min-height: calc(var(--kg) * 1.55); }
.py-ornek .kk-ornek{ --kg: inherit; }
.py-ok{ flex: none; }
.py-isaret{ font-family: 'Bebas Neue', sans-serif; font-size: calc(var(--kg) * .7); color: #f2d77a; line-height: 1; }
.py-on3{ font-family: 'Bebas Neue', sans-serif; font-size: calc(var(--kg) * .62); line-height: 1; color: #3a1d00; width: calc(var(--kg) * 1.05); height: calc(var(--kg) * 1.05);
	display: flex; align-items: center; justify-content: center; border-radius: 50%; padding-top: .08em; box-sizing: border-box;
	background: radial-gradient(circle at 40% 35%, #ffe27a 0%, #ffbf1f 55%, #e07f00 100%); box-shadow: 0 0 0 2px #6b3000, 0 0 0 4px rgba(255,232,150,.5); }
/* 6 seçilir (turkuaz), 7 seçilir, ikisi ortada buluşup kaybolur, baştan */
.py-cift .py-a{ animation: py-a 3.2s ease-in-out infinite; }
.py-cift .py-b{ animation: py-b 3.2s ease-in-out infinite; }
.py-cift .py-a .kart .ic{ animation: py-sec1 3.2s infinite; }
.py-cift .py-b .kart .ic{ animation: py-sec2 3.2s infinite; }
.py-cift .py-on3{ animation: py-nabiz 3.2s infinite; }
@keyframes py-a{ 0%, 45%{ transform: none; opacity: 1; } 62%{ transform: translateX(calc(var(--kg) * .75)) scale(.92); opacity: 1; } 78%, 92%{ transform: translateX(calc(var(--kg) * .75)) scale(.6); opacity: 0; } 100%{ transform: none; opacity: 1; } }
@keyframes py-b{ 0%, 45%{ transform: none; opacity: 1; } 62%{ transform: translateX(calc(var(--kg) * -.75)) scale(.92); opacity: 1; } 78%, 92%{ transform: translateX(calc(var(--kg) * -.75)) scale(.6); opacity: 0; } 100%{ transform: none; opacity: 1; } }
@keyframes py-sec1{ 0%, 12%{ box-shadow: none; } 16%, 62%{ box-shadow: 0 0 0 3px #2fe3d0, 0 0 14px rgba(47,227,208,.8); } 63%, 100%{ box-shadow: none; } }
@keyframes py-sec2{ 0%, 32%{ box-shadow: none; } 36%, 62%{ box-shadow: 0 0 0 3px #2fe3d0, 0 0 14px rgba(47,227,208,.8); } 63%, 100%{ box-shadow: none; } }
@keyframes py-nabiz{ 0%, 55%{ transform: none; } 66%{ transform: scale(1.25); } 78%, 100%{ transform: none; } }
.py-tek .py-k .kart .ic{ animation: py-sec1 2.4s infinite; }
/* mini piramit: üstteki kart örtülü (koyu), alttaki iki kart açık */
.py-mini{ position: relative; display: block; width: calc(var(--kg) * 2.2); height: calc(var(--kg) * 2.15); margin: 0 auto; }
.py-mini .py-ok{ position: absolute; }
.py-mini .py-ust{ left: calc(var(--kg) * .6); top: 0; }
.py-mini .py-ust .on{ filter: brightness(.72) saturate(.8); }
.py-mini .py-sol{ left: 0; top: calc(var(--kg) * .75); }
.py-mini .py-sag{ left: calc(var(--kg) * 1.2); top: calc(var(--kg) * .75); }
.py-noktalar{ display: flex; justify-content: center; gap: 6px; margin-top: .5em; }
.py-noktalar i{ width: 7px; height: 7px; border-radius: 50%; background: rgba(255,255,255,.25); }
.py-noktalar i.sec{ background: #ffc83a; }
@media (prefers-reduced-motion: reduce){ .py-cift .py-a, .py-cift .py-b, .py-cift .py-on3, .py-ornek .kart .ic{ animation: none; } }
