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

/* deste yuvası: boşken ✕ (deste tek kez geçilir) */
.yuva.tp-deste span{ font-size: calc(var(--kg) * .55); color: rgba(255,120,120,.45); line-height: 1; }
.yuva.tp-deste.salla{ animation: tp-salla .4s; }
@keyframes tp-salla{ 0%, 100%{ transform: translateX(0); } 25%{ transform: translateX(-5px); } 75%{ transform: translateX(5px); } }

/* seri / zirve yazısı: açık kartın üstünde yükselip kaybolur */
.tp-yazi{ position: absolute; z-index: 99999; pointer-events: none; transform: translate(-50%, -30%); white-space: nowrap;
	font-family: 'Bebas Neue', sans-serif; letter-spacing: .03em; color: #fff; line-height: 1;
	-webkit-text-stroke: .08em #1a7a52; paint-order: stroke fill; text-shadow: 0 .08em 0 #0b3d29, 0 0 .5em rgba(47,227,160,.6);
	animation: tp-yazi 1.25s ease-out forwards; }
.tp-yazi.buyuk{ color: #ffe27a; -webkit-text-stroke-color: #a35a00; text-shadow: 0 .08em 0 #5a2c00, 0 0 .6em rgba(255,200,60,.8); }
.tp-yazi.zirve{ color: #ffe27a; -webkit-text-stroke-color: #b8325f; text-shadow: 0 .08em 0 #6b1734, 0 0 .6em rgba(255,120,170,.7); }
@keyframes tp-yazi{ 0%{ opacity: 0; transform: translate(-50%, -10%) scale(.6); } 18%{ opacity: 1; transform: translate(-50%, -60%) scale(1.12); }
	30%{ transform: translate(-50%, -70%) scale(1); } 75%{ opacity: 1; } 100%{ opacity: 0; transform: translate(-50%, -150%) scale(1); } }

/* ---------- eğitim penceresi (2026-11-05): bir üst / bir alt, seri, kapalı kart + deste ---------- */
.tp-egitim .kk-icerik{ text-align: center; }
.tp-egitim .kk-icerik p{ margin: .6em 0 .2em; line-height: 1.45; }
.tp-egitim .kk-icerik small{ opacity: .8; }
.tp-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); }
.tp-ornek .kk-ornek{ --kg: inherit; }
.tp-ok{ flex: none; }
.tp-ok-isaret{ font-size: calc(var(--kg) * .45); color: #f2d77a; line-height: 1; }
.tp-etiket{ display: block; margin-top: 4px; font-family: 'Bebas Neue', sans-serif; font-size: 13px; letter-spacing: .06em; color: #f2d77a; opacity: .85; }
.tp-hedef{ display: flex; flex-direction: column; align-items: center; }
.tp-rozet{ font-family: 'Bebas Neue', sans-serif; font-size: calc(var(--kg) * .5); line-height: 1; color: #3a1d00; min-width: calc(var(--kg) * .95); height: calc(var(--kg) * .95);
	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); }

/* 1) 8 seçilir (turkuaz), açık 7'nin üstüne kayar, baştan */
.tp-gec .tp-a{ animation: tp-git 3s ease-in-out infinite; position: relative; z-index: 2; }
.tp-gec .tp-a .kart .ic{ animation: tp-sec 3s infinite; }
.tp-gec .tp-ok-isaret{ animation: tp-ok 3s infinite; }
@keyframes tp-git{ 0%, 30%{ transform: none; } 58%, 88%{ transform: translateX(calc(var(--kg) * 1.62)) rotate(4deg); } 89%{ opacity: 0; } 92%{ opacity: 0; transform: none; } 100%{ opacity: 1; transform: none; } }
@keyframes tp-sec{ 0%, 10%{ box-shadow: none; } 14%, 58%{ box-shadow: 0 0 0 3px #2fe3d0, 0 0 14px rgba(47,227,208,.8); } 62%, 100%{ box-shadow: none; } }
@keyframes tp-ok{ 0%, 100%{ opacity: .9; } 50%, 88%{ opacity: 0; } }

/* 2) seri: kartlar sırayla açık kartın yerine gelir, ×4 rozeti nabız */
.tp-seri{ gap: 0; }
.tp-seri .tp-ok{ margin-left: calc(var(--kg) * -.2); opacity: 0; animation: tp-gel 4s infinite; }
.tp-seri .tp-s1{ margin-left: 0; }
.tp-seri .tp-s2{ animation-delay: .5s; }
.tp-seri .tp-s3{ animation-delay: 1s; }
.tp-seri .tp-s4{ animation-delay: 1.5s; }
.tp-seri .tp-rozet{ margin-left: calc(var(--kg) * .22); animation: tp-nabiz 4s infinite; }
@keyframes tp-gel{ 0%{ opacity: 0; transform: translateY(calc(var(--kg) * -.5)); } 8%, 82%{ opacity: 1; transform: none; } 92%, 100%{ opacity: 0; transform: none; } }
@keyframes tp-nabiz{ 0%, 44%{ transform: scale(.6); opacity: 0; } 52%{ transform: scale(1.25); opacity: 1; } 60%, 82%{ transform: none; opacity: 1; } 92%, 100%{ opacity: 0; } }

/* 3) mini zirve: üstte kapalı kart, altında iki açık kart; sağda deste */
.tp-mini{ position: relative; display: block; width: calc(var(--kg) * 3.7); height: calc(var(--kg) * 2.15); margin: 0 auto; }
.tp-mini .tp-ok{ position: absolute; }
.tp-mini .tp-ust{ left: calc(var(--kg) * .55); top: 0; }
.tp-mini .tp-sol{ left: 0; top: calc(var(--kg) * .75); }
.tp-mini .tp-sag{ left: calc(var(--kg) * 1.1); top: calc(var(--kg) * .75); }
.tp-mini-deste{ position: absolute; left: calc(var(--kg) * 2.65); top: calc(var(--kg) * .45); display: flex; flex-direction: column; align-items: center; }
.tp-mini-deste .tp-ok{ position: static; }
.tp-mini .tp-sol, .tp-mini .tp-sag{ animation: tp-cik 3.4s infinite; }
.tp-mini .tp-sag{ animation-delay: .3s; }
/* örtenler gidince üstteki kart açılır */
.tp-mini .tp-acilan{ animation: tp-acil 3.4s infinite; }
@keyframes tp-acil{ 0%, 48%{ opacity: 0; transform: scaleX(.1); } 58%, 85%{ opacity: 1; transform: none; } 100%{ opacity: 0; } }
@keyframes tp-cik{ 0%, 35%{ opacity: 1; transform: none; } 50%, 85%{ opacity: .15; transform: translateY(calc(var(--kg) * .25)) scale(.9); } 100%{ opacity: 1; transform: none; } }

.tp-noktalar{ display: flex; justify-content: center; gap: 6px; margin-top: .5em; }
.tp-noktalar i{ width: 7px; height: 7px; border-radius: 50%; background: rgba(255,255,255,.25); }
.tp-noktalar i.sec{ background: #ffc83a; }
@media (prefers-reduced-motion: reduce){ .tp-gec .tp-a, .tp-gec .tp-ok-isaret, .tp-seri .tp-ok, .tp-seri .tp-rozet, .tp-mini .tp-ok, .tp-mini .tp-acilan, .tp-ornek .kart .ic{ animation: none; opacity: 1; } }
