/* Eşli Batak / Eşli Pişti. Masa, koltuk ve sohbet stilleri okey.css'ten gelir; burada yalnızca "k" önekli sınıflar vardır. */

/* ---------- iskambil kartı ---------- */
.kcard{--kw:54px;position:relative;display:block;width:var(--kw);height:calc(var(--kw)*1.42);flex:0 0 auto;border-radius:calc(var(--kw)*.13);background:linear-gradient(165deg,#ffffff 0%,#fbf6e6 70%,#f1e8cd 100%);color:#1b1b22;font-weight:800;line-height:1;user-select:none;touch-action:manipulation;
  box-shadow:0 0 0 1px rgba(60,40,10,.18),0 6px 12px -4px rgba(0,0,0,.55);transition:transform .16s,box-shadow .16s,opacity .16s,filter .16s;transform:rotate(var(--rot,0deg)) translateY(var(--ty,0))}
.kcard.ks1,.kcard.ks2{color:#d11f3f}
.kcorner{position:absolute;display:grid;justify-items:center;gap:0;line-height:.95}
.kcorner b{font-size:calc(var(--kw)*.3);letter-spacing:-.04em}
.kcorner i{font-style:normal;font-size:calc(var(--kw)*.26)}
.kcorner.tl{left:calc(var(--kw)*.09);top:calc(var(--kw)*.07)}
.kcorner.br{right:calc(var(--kw)*.09);bottom:calc(var(--kw)*.07);transform:rotate(180deg)}
.kpip{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-size:calc(var(--kw)*.62);padding-top:calc(var(--kw)*.04)}
.kpip.ace{font-size:calc(var(--kw)*.84)}
.kface{position:absolute;left:23%;right:23%;top:24%;bottom:24%;display:grid;place-items:center;align-content:center;border-radius:calc(var(--kw)*.09);background:linear-gradient(160deg,#fff4c9,#f3d98a);box-shadow:inset 0 0 0 2px currentColor;gap:0}
.kface b{font-size:calc(var(--kw)*.4);line-height:1}
.kface i{font-style:normal;font-size:calc(var(--kw)*.28);line-height:1}
.kcard.sm{--kw:36px}
.kcard.back{background:radial-gradient(circle at 50% 50%,#c42a62 0 18%,transparent 19%),repeating-linear-gradient(45deg,#a81f52 0 6px,#8a1740 6px 12px);box-shadow:0 0 0 3px #fff inset,0 0 0 1px rgba(0,0,0,.25),0 6px 12px -4px rgba(0,0,0,.55)}
.kcard.back b{position:absolute;inset:0;display:grid;place-items:center;color:#fff;font-size:calc(var(--kw)*.38);text-shadow:0 1px 3px rgba(0,0,0,.6)}
.kcard.empty{background:rgba(255,255,255,.07);box-shadow:0 0 0 2px rgba(255,255,255,.35) inset;color:rgba(255,255,255,.7);display:grid;place-items:center}

/* ---------- el: yelpaze ---------- */
.khandwrap{display:flex;justify-content:center;padding:18px 10px 18px;overflow:hidden}
.khand{--hw:clamp(48px,5.8vw,82px);display:flex;justify-content:center;align-items:flex-end;min-height:calc(var(--hw)*1.42 + 26px);max-width:100%}
.khand .kcard{--kw:var(--hw);margin-left:calc(var(--hw)*.1)}
.khand.dense .kcard{margin-left:calc(var(--hw)*-.5)}
.khand .kcard:first-child{margin-left:0}
.khand .kcard.ok{cursor:pointer}
.khand .kcard.ok:hover{transform:rotate(0deg) translateY(-12px);z-index:4}
.khand .kcard.sel{transform:rotate(0deg) translateY(-24px) scale(1.06);box-shadow:0 0 0 3px #f5b942,0 14px 22px -6px rgba(0,0,0,.65);z-index:6}
.khand .kcard.off{opacity:.55;filter:saturate(.45) brightness(.92)}
.khand .kcard.deal{animation:kdeal .45s cubic-bezier(.2,.8,.3,1) both;animation-delay:var(--d,0ms)}
@keyframes kdeal{from{transform:translateY(-190px) rotate(-20deg) scale(.7);opacity:0}to{transform:rotate(var(--rot,0deg)) translateY(var(--ty,0));opacity:1}}

/* ---------- masa temaları ---------- */
body.ostage .oboard.v-batak{background:radial-gradient(80% 70% at 50% 38%,rgba(255,255,255,.12),transparent 62%),radial-gradient(130% 110% at 50% 40%,#3d5fb0 0%,#26407f 48%,#0f1c46 100%)}
body.ostage .oboard.v-pisti{background:radial-gradient(80% 70% at 50% 38%,rgba(255,255,255,.12),transparent 62%),radial-gradient(130% 110% at 50% 40%,#2f9a69 0%,#1b6e4a 48%,#093624 100%)}
.kfelt::after{content:"";position:absolute;inset:14px;border-radius:22px;border:1px solid rgba(255,255,255,.1);pointer-events:none}

/* ---------- masa ortası ---------- */
.kcenter{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;width:100%;min-height:150px}
.kchips{display:flex;flex-wrap:wrap;justify-content:center;gap:6px}
.kchip{padding:4px 12px;border-radius:999px;background:rgba(0,0,0,.34);color:#fff;font-size:.8rem;font-weight:700;box-shadow:inset 0 0 0 1px rgba(255,255,255,.12)}
.kchip.red{color:#ffb0bc}
.kchip.on{background:#f5b942;color:#2a1a05}
.kpanel{display:grid;gap:8px;justify-items:center;text-align:center;max-width:440px;padding:12px 16px;border-radius:18px;background:rgba(0,0,0,.3);color:#fff;box-shadow:inset 0 0 0 1px rgba(255,255,255,.14)}
.kpanel small{opacity:.88;line-height:1.4}
.kbids{display:flex;flex-wrap:wrap;justify-content:center;gap:6px}
.ksuitbtn{background:#fff;color:#1b1b22;border:1px solid #e3dbc8;font-weight:800}
.ksuitbtn.red{color:#d11f3f}

/* el (batak): çapraz dizilim, ben altta */
.ktrick{--kw:50px;display:grid;grid-template-columns:repeat(3,calc(var(--kw) + 42px));justify-content:center;grid-template-areas:". t ." "l . r" ". b .";gap:4px 16px;align-items:center;justify-items:center;min-height:calc(var(--kw)*1.42*3 + 68px)}
.ktrick .kcard{--kw:50px}
.ktc{display:grid;justify-items:center;gap:3px}
.ktc small{font-size:.68rem;color:rgba(255,255,255,.88);max-width:84px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ktc.t{grid-area:t}.ktc.l{grid-area:l}.ktc.r{grid-area:r}.ktc.b{grid-area:b}
.ktc.win .kcard{box-shadow:0 0 0 3px #f5b942,0 0 22px rgba(245,185,66,.8)}
@keyframes kland{from{transform:scale(1.25);opacity:.4}to{transform:none;opacity:1}}
.kempty{grid-area:1/1/4/4;align-self:center;color:rgba(255,255,255,.85)}
.kwin{min-height:1.7em;line-height:1.5;font-size:.88rem;font-weight:800;color:#f5b942;text-shadow:0 1px 4px rgba(0,0,0,.5)}

/* pişti */
.kmid{display:flex;align-items:center;justify-content:center;gap:36px;flex-wrap:wrap}
.kpilebox,.kdeck{display:grid;justify-items:center;gap:6px;color:#fff}
.kpilebox{padding-top:10px}
.kpilebox small,.kdeck small{font-size:.75rem;opacity:.88}
.kpile{--kw:66px;position:relative;width:calc(var(--kw) + 16px);height:calc(var(--kw)*1.42 + 8px)}
.kpile .kcard{--kw:66px;position:absolute;left:0;top:0}
.kpile .kcard.b2{transform:translate(14px,-4px) rotate(8deg)}
.kpile .kcard.b1{transform:translate(7px,-2px) rotate(4deg)}
.kdeck .kcard{--kw:50px;position:relative;display:block}
.kcenter .ohint{margin:0}

/* ---------- alt alan, üst çubuk, tepkiler ---------- */
.kbottom{grid-template-columns:1fr;grid-template-areas:"me" "rack"}
.kscore{display:inline-flex;gap:6px;align-items:center;color:#2a1a3a;font-size:.82rem;padding:4px 12px;border-radius:999px;background:#fff;border:1px solid var(--line);white-space:nowrap}
.kscore b:first-child{color:#d11f3f}.kscore b:last-child{color:#2b4a9e}
.oseat.kmate .oinfo span:first-of-type{color:#f5b942;font-weight:700}
.obottom.kbottom .oseat.kmate .oinfo span{color:inherit}
.kreact{display:flex;align-items:center;justify-content:center;gap:6px;flex-wrap:wrap}
.kreact small{color:var(--muted);margin-right:4px}
.kemo{width:42px;height:42px;display:grid;place-items:center;border-radius:50%;border:1px solid var(--line);background:#fff;font-size:1.3rem;cursor:pointer;box-shadow:0 3px 8px -4px rgba(60,20,70,.4);transition:transform .12s}
.kemo:hover{transform:translateY(-3px) scale(1.1)}
.kemo:active{transform:scale(.92)}
.obubble.big{font-size:2.1rem;padding:2px 12px;background:#fff;animation:kpop .35s cubic-bezier(.2,1.4,.4,1)}
@keyframes kpop{from{transform:translateX(-50%) scale(.3);opacity:0}to{transform:translateX(-50%) scale(1);opacity:1}}
.kteamnote{font-size:.74rem;opacity:.85}

/* ---------- pişti afişi ve konfeti ---------- */
.kbanner{position:fixed;left:50%;top:36%;z-index:9999;display:grid;gap:4px;justify-items:center;padding:16px 30px;border-radius:22px;background:linear-gradient(135deg,#ff4f93,#e0357a 55%,#8b1c54);color:#fff;text-align:center;box-shadow:0 20px 50px -10px rgba(90,10,60,.7),0 0 0 3px rgba(255,255,255,.35);pointer-events:none;animation:kbanner 1.9s ease both}
.kbanner strong{font-size:clamp(1.5rem,5vw,2.4rem);letter-spacing:.02em;text-shadow:0 3px 10px rgba(0,0,0,.35)}
.kbanner small{font-size:.9rem;opacity:.92}
@keyframes kbanner{0%{transform:translate(-50%,10px) scale(.4);opacity:0}14%{transform:translate(-50%,0) scale(1.12);opacity:1}24%{transform:translate(-50%,0) scale(1)}84%{transform:translate(-50%,0) scale(1);opacity:1}100%{transform:translate(-50%,-14px) scale(.96);opacity:0}}
.kconfetti{position:fixed;inset:0;z-index:9997;pointer-events:none;overflow:hidden}
.kconfetti span{position:absolute;top:-30px;animation:kfall linear forwards}
@keyframes kfall{to{transform:translateY(110vh) rotate(540deg);opacity:.8}}

/* ---------- taşma ve küçük ekranlar ---------- */
.kboard .ohbtns{flex-wrap:wrap;justify-content:flex-end}
.kboard .oturnpill{white-space:normal;text-align:center}
.kfelt .ocenter,.kfelt .oseat{min-width:0}
@media (max-width:700px){
  .kfelt.otable.n4{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
  .kfelt .oseat{min-width:0}
  .kfelt .oinfo strong{max-width:80px}
  .khand{--hw:clamp(40px,11.5vw,56px)}
  .khand.dense .kcard{margin-left:calc(var(--hw)*-.5)}
  .ktrick,.ktrick .kcard{--kw:42px}
  .ktrick{gap:3px 8px;min-height:calc(var(--kw)*1.42*3 + 58px)}
  .kpile,.kpile .kcard{--kw:54px}
  .kmid{gap:18px}
  .kpanel{padding:8px 10px}
  .kemo{width:38px;height:38px;font-size:1.15rem}
}
@media (max-height:700px){
  .kpanel small{display:none}
  .ktrick,.ktrick .kcard{--kw:40px}
  .ktrick{min-height:calc(var(--kw)*1.42*3 + 60px)}
  .khand{--hw:clamp(38px,5vw,58px)}
}
@media (max-height:520px){
  .ktrick,.ktrick .kcard{--kw:32px}
  .ktrick{min-height:calc(var(--kw)*1.42*3 + 52px);gap:2px 6px}
  .khand{--hw:36px}
  .kpanel small,.kreact small{display:none}
}
@media (prefers-reduced-motion:reduce){.khand .kcard.deal,.ktc .kcard,.kpile .kcard.top,.obubble.big,.kbanner{animation:none}.kcard{transition:none}}
.btn.ksuitbtn{background:#fff;color:#1b1b22;border:1px solid #e3dbc8}
.btn.ksuitbtn.red{color:#d11f3f}
.kfelt .ostatus{min-height:44px}

/* dokunmatik/dar ekran düzeltmeleri */
.khand .kcard.off{opacity:1;filter:grayscale(.65) brightness(.8)}
@media (max-width:700px){
  .khand{--hw:clamp(36px,12vw,54px)}
  .khand.dense .kcard{margin-left:calc(var(--hw)*-.5)}
  .ktrick{display:flex;flex-wrap:nowrap;justify-content:flex-start;align-items:flex-start;gap:8px;min-height:calc(var(--kw)*1.42 + 24px);width:max-content;max-width:100%;min-width:calc(4*(var(--kw) + 14px) + 24px);margin:0 auto}
  .ktc{gap:2px;width:calc(var(--kw) + 14px)}
  .kempty{grid-area:auto}
  .kfelt .oseat .ogiftbtn{position:static;width:auto;height:auto;padding:3px 10px;border-radius:999px;font-size:.74rem}
  .kfelt .oseat .more{top:4px;right:4px}
  .kfelt .ostatus{min-height:36px}
  .kwin{min-height:1.3em;line-height:1.3}
}

@media (max-width:700px){.kfelt .ocenter{gap:4px;padding:4px}.kcenter{gap:6px;min-height:0}.kchip{padding:3px 9px;font-size:.74rem}.kfelt .oseat{padding:6px 8px}}

/* Batak/Pişti masası: durum çubuğu metni değişince genişliği oynamasın */
.kboard .oturnpill{min-width:min(22rem,94%);justify-content:center}
/* Durum çubuğu 1 ya da 2 satır olsa da yüksekliği değişmesin (masa ortası kaymasın) */
@media (min-width:600px){.kboard .ostatus{min-height:62px;display:flex;align-items:center;justify-content:center}}
