/* Personel sohbet — Oyunlar / Okey */
.pch-tabs{
  display:flex;gap:6px;padding:0 12px 10px;border-bottom:1px solid var(--line,#e2e8f0);
  background:linear-gradient(180deg,#fff,#f8fafc);
}
.pch-tabs .pch-tab{
  border:1px solid transparent;background:transparent;border-radius:10px;
  padding:8px 12px;font-weight:800;font-size:.8rem;cursor:pointer;color:#64748b;font-family:inherit;
}
.pch-tabs .pch-tab:hover{background:#f1f5f9;color:#0f172a}
.pch-tabs .pch-tab.active{background:#eff6ff;border-color:#bfdbfe;color:#1d4ed8}
.pch-body.pch-view-oyun{
  display:flex!important;
  flex-direction:column;
  grid-template-columns:unset!important;
}
.pch-body.pch-view-oyun .pch-side,
.pch-body.pch-view-oyun .pch-main{display:none!important}
.pch-oyun-panel{display:none;flex:1;min-height:0;flex-direction:column;overflow:auto;background:#0b3d2e;width:100%}
.pch-body.pch-view-oyun .pch-oyun-panel{display:flex}
.pch-oyun-panel *{box-sizing:border-box}

.pog-wrap{padding:12px 14px 16px;color:#ecfdf5;font-family:inherit;min-height:100%}
.pog-hero{
  display:flex;align-items:flex-start;justify-content:space-between;gap:12px;flex-wrap:wrap;
  margin-bottom:12px;padding:12px 14px;border-radius:14px;
  background:linear-gradient(125deg,#14532d,#166534 50%,#15803d);
  border:1px solid rgba(255,255,255,.12);
}
.pog-hero h4{margin:0 0 4px;font-size:1rem;font-weight:800}
.pog-hero p{margin:0;font-size:.75rem;opacity:.9;font-weight:500;max-width:440px;line-height:1.4}
.pog-badge{
  display:inline-flex;align-items:center;gap:6px;padding:6px 10px;border-radius:999px;
  font-size:11px;font-weight:800;background:rgba(255,255,255,.14);border:1px solid rgba(255,255,255,.2);
}
.pog-badge.warn{background:#fef3c7;color:#92400e;border-color:#fcd34d}
.pog-badge.ok{background:#dcfce7;color:#166534;border-color:#86efac}
.pog-badge.bad{background:#fee2e2;color:#991b1b;border-color:#fca5a5}

.pog-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.15fr);gap:12px}
@media (max-width:820px){.pog-grid{grid-template-columns:1fr}}
.pog-card{
  background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.12);
  border-radius:14px;padding:12px;backdrop-filter:blur(4px);
}
.pog-card h5{margin:0 0 8px;font-size:.82rem;font-weight:800;letter-spacing:.02em}
.pog-muted{font-size:.72rem;opacity:.8;font-weight:500;line-height:1.35}
.pog-actions{display:flex;flex-wrap:wrap;gap:8px;margin-top:10px}
.pog-btn{
  border:0;border-radius:10px;padding:8px 12px;font-weight:800;font-size:12px;cursor:pointer;
  font-family:inherit;background:#f8fafc;color:#0f172a;
}
.pog-btn:hover{filter:brightness(1.05)}
.pog-btn:disabled{opacity:.45;cursor:not-allowed}
.pog-btn.primary{background:linear-gradient(135deg,#fbbf24,#f59e0b);color:#422006}
.pog-btn.ghost{background:rgba(255,255,255,.1);color:#fff;border:1px solid rgba(255,255,255,.18)}
.pog-btn.danger{background:#ef4444;color:#fff}
.pog-btn.ok{background:#22c55e;color:#052e16}

.pog-list{display:flex;flex-direction:column;gap:8px;max-height:280px;overflow:auto}
.pog-row{
  display:flex;align-items:center;justify-content:space-between;gap:8px;flex-wrap:wrap;
  padding:10px;border-radius:12px;background:rgba(0,0,0,.18);border:1px solid rgba(255,255,255,.08);
}
.pog-row .nm{font-weight:800;font-size:.8rem}
.pog-row .sm{font-size:.7rem;opacity:.8}

/* Okey board */
.okey-board{margin-top:12px}
.okey-table{
  position:relative;border-radius:18px;padding:14px 12px 10px;
  background:
    radial-gradient(ellipse at 50% 40%, rgba(255,255,255,.08), transparent 55%),
    linear-gradient(160deg,#166534,#0f3d2a 60%,#0a2e20);
  border:2px solid rgba(251,191,36,.35);
  min-height:320px;
}
.okey-seats{display:grid;grid-template-columns:1fr 1fr 1fr;gap:8px;margin-bottom:10px}
.okey-seat{
  text-align:center;padding:8px;border-radius:12px;background:rgba(0,0,0,.22);
  border:1px solid rgba(255,255,255,.1);font-size:.72rem;
}
.okey-seat.active{border-color:#fbbf24;box-shadow:0 0 0 2px rgba(251,191,36,.25)}
.okey-seat.bot .who::after{content:' 🤖';font-size:.65em}
.okey-seat .who{font-weight:800;font-size:.78rem}
.okey-seat .cnt{opacity:.85;margin-top:2px}
.okey-seat .backs{display:flex;justify-content:center;gap:2px;margin-top:6px;flex-wrap:wrap;max-width:120px;margin-left:auto;margin-right:auto}
.okey-center{
  display:flex;align-items:center;justify-content:center;gap:16px;flex-wrap:wrap;
  padding:10px 0 14px;
}
.okey-pile{
  width:48px;height:66px;border-radius:8px;display:grid;place-items:center;
  font-weight:800;font-size:10px;border:2px dashed rgba(255,255,255,.25);background:rgba(0,0,0,.2);
  cursor:pointer;user-select:none;text-align:center;line-height:1.2;color:#ecfdf5;
  transition:.15s;
}
.okey-pile.stock{
  background:
    repeating-linear-gradient(135deg, #1e3a8a 0 6px, #1d4ed8 6px 12px);
  border:2px solid #93c5fd;color:#fff;box-shadow:0 4px 12px rgba(0,0,0,.35);
}
.okey-pile.drop-ok{outline:2px dashed #fbbf24;outline-offset:3px;filter:brightness(1.15)}
.okey-pile:hover{filter:brightness(1.08);transform:translateY(-1px)}
.okey-meta{text-align:center;font-size:.7rem;opacity:.9;max-width:90px}
.okey-discard-zone{
  min-width:56px;min-height:72px;display:flex;align-items:center;justify-content:center;
  border-radius:10px;padding:4px;
}
.okey-discard-zone.drop-ok{background:rgba(251,191,36,.2);box-shadow:inset 0 0 0 2px #fbbf24}
.okey-hand{
  display:flex;flex-wrap:wrap;gap:5px;justify-content:center;align-items:flex-end;
  padding:12px 8px;background:rgba(0,0,0,.32);border-radius:14px;min-height:96px;
  border:1px dashed rgba(255,255,255,.12);
}
.okey-hand.drop-ok{border-color:#fbbf24;background:rgba(251,191,36,.08)}
.okey-hint{text-align:center;font-size:.68rem;opacity:.75;margin-top:6px;font-weight:600}

/* Gerçekçi okey taşı */
.okey-tile{
  width:42px;height:60px;border-radius:7px;position:relative;
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;
  cursor:grab;user-select:none;touch-action:none;
  font-family:Georgia,'Times New Roman',serif;
  background:
    linear-gradient(155deg,#fffef8 0%,#f7f1e3 40%,#ebe3d0 100%);
  border:1px solid #c9bc9a;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.9),
    inset 0 -2px 3px rgba(120,100,60,.12),
    0 2px 3px rgba(0,0,0,.25),
    0 6px 10px rgba(0,0,0,.18);
  color:#111;transition:transform .12s,box-shadow .12s;
}
.okey-tile:active,.okey-tile.dragging{cursor:grabbing;opacity:.92;transform:scale(1.06) rotate(-2deg);z-index:20}
.okey-tile.sel{
  transform:translateY(-8px);
  box-shadow:0 0 0 2px #2563eb,0 8px 16px rgba(0,0,0,.35);
}
.okey-tile .num{
  font-size:22px;font-weight:800;line-height:1;letter-spacing:-.02em;
  text-shadow:0 1px 0 rgba(255,255,255,.5);
}
.okey-tile .pip{
  width:10px;height:10px;border-radius:2px;transform:rotate(45deg);
  box-shadow:inset 0 1px 1px rgba(255,255,255,.35),0 1px 1px rgba(0,0,0,.2);
}
.okey-tile.c-R .num{color:#c41e3a}.okey-tile.c-R .pip{background:#c41e3a}
.okey-tile.c-S .num{color:#111}.okey-tile.c-S .pip{background:#1a1a1a}
.okey-tile.c-M .num{color:#1d4ed8}.okey-tile.c-M .pip{background:#2563eb}
.okey-tile.c-Y .num{color:#b45309}.okey-tile.c-Y .pip{background:#eab308}
.okey-tile.c-J{
  background:linear-gradient(160deg,#faf5ff,#ede9fe 50%,#ddd6fe);
  border-color:#a78bfa;color:#6d28d9;
}
.okey-tile.c-J .num{font-size:11px;font-weight:900;color:#6d28d9;letter-spacing:.02em}
.okey-tile.c-J .pip{background:conic-gradient(from 45deg,#a855f7,#7c3aed,#c084fc,#a855f7);border-radius:50%;transform:none}
.okey-tile.okey-mark{
  box-shadow:0 0 0 2px #f59e0b,0 0 12px rgba(245,158,11,.45),0 4px 8px rgba(0,0,0,.25);
}
.okey-tile.okey-mark::after{
  content:'★';position:absolute;top:2px;right:3px;font-size:9px;color:#f59e0b;line-height:1;
}
.okey-tile.face-down{
  background:
    repeating-linear-gradient(45deg, #1e3a5f 0 4px, #243b55 4px 8px);
  border-color:#0f172a;cursor:default;
}
.okey-tile.face-down .num,.okey-tile.face-down .pip{display:none}
.okey-tile.face-down::before{
  content:'';width:18px;height:18px;border:2px solid rgba(251,191,36,.5);border-radius:4px;transform:rotate(45deg);
}
.okey-tile.sm{width:18px;height:26px;border-radius:3px;box-shadow:0 1px 2px rgba(0,0,0,.3);cursor:default}
.okey-toolbar{display:flex;flex-wrap:wrap;gap:8px;justify-content:center;margin-top:10px}
.pog-alert{
  margin-top:8px;padding:8px 10px;border-radius:10px;font-size:.75rem;font-weight:700;
  background:rgba(0,0,0,.25);border:1px solid rgba(255,255,255,.12);
}
.pog-alert.err{background:rgba(127,29,29,.45);border-color:#fca5a5}
.pog-alert.ok{background:rgba(20,83,45,.5);border-color:#86efac}

[data-theme='dark'] .pch-tabs{background:linear-gradient(180deg,#0f172a,#111827);border-color:#1e293b}
[data-theme='dark'] .pch-tabs .pch-tab{color:#94a3b8}
[data-theme='dark'] .pch-tabs .pch-tab.active{background:#1e3a8a;border-color:#3b82f6;color:#dbeafe}

/* —— Balon Şov —— */
.pog-pick{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin-top:12px}
@media (max-width:720px){.pog-pick{grid-template-columns:1fr}}
.pog-pick-card{
  background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.14);border-radius:16px;
  padding:16px;cursor:pointer;transition:.15s;text-align:left;color:inherit;font-family:inherit;width:100%;
}
.pog-pick-card:hover{transform:translateY(-2px);border-color:#fbbf24;background:rgba(251,191,36,.1)}
.pog-pick-card h5{margin:0 0 6px;font-size:1rem}
.pog-pick-card p{margin:0;font-size:.75rem;opacity:.85;line-height:1.4}

.bb-wrap{padding:4px 2px 12px;color:#fdf2f8}
.bb-top{display:flex;gap:12px;align-items:flex-start;flex-wrap:wrap;margin-bottom:12px}
.bb-top h4{margin:0 0 4px;font-size:1.05rem;font-weight:800}
.bb-top p{margin:0;font-size:.75rem;opacity:.9;max-width:420px}
.bb-roster,.bb-stage{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:8px}
@media (max-width:900px){.bb-roster,.bb-stage{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (max-width:560px){.bb-roster,.bb-stage{grid-template-columns:repeat(2,minmax(0,1fr))}}
.bb-char{
  position:relative;background:linear-gradient(180deg,rgba(255,255,255,.1),rgba(0,0,0,.25));
  border:1px solid rgba(255,255,255,.14);border-radius:16px;padding:10px 6px 8px;min-height:188px;
  display:flex;flex-direction:column;align-items:center;justify-content:flex-end;
  overflow:visible;
}
.bb-body{position:relative;width:86px;height:128px;margin-bottom:6px}
.bb-head{position:absolute;left:50%;top:0;transform:translateX(-50%);width:42px;height:42px;z-index:3}
.bb-hair{
  position:absolute;inset:-6px -10px auto -10px;height:30px;border-radius:20px 20px 8px 8px;
  background:var(--hair);box-shadow:0 6px 0 -2px color-mix(in srgb, var(--hair) 80%, #000);
}
.bb-face{
  position:absolute;left:50%;top:8px;transform:translateX(-50%);width:34px;height:34px;border-radius:50%;
  background:var(--skin);box-shadow:inset 0 -3px 0 rgba(0,0,0,.06);
}
.bb-face .e{position:absolute;top:12px;width:5px;height:5px;border-radius:50%;background:#111}
.bb-face .e1{left:8px}.bb-face .e2{right:8px}
.bb-face .m{position:absolute;left:50%;bottom:7px;transform:translateX(-50%);width:10px;height:4px;border-radius:0 0 8px 8px;background:var(--lip)}
.bb-torso{
  position:absolute;left:50%;top:40px;transform:translateX(-50%);
  width:48px;height:46px;border-radius:16px 16px 12px 12px;background:var(--top);
  box-shadow:inset 0 -10px 0 rgba(0,0,0,.1);
}
.bb-hips{
  position:absolute;left:50%;top:82px;transform:translateX(-50%);
  width:56px;height:36px;border-radius:14px 14px 18px 18px;
  background:color-mix(in srgb, var(--top) 55%, #1e1b4b);
}
/* Giysili çizgi film — belirgin / dikkat çekici göğüs silueti */
.bb-bust{
  position:absolute;left:50%;top:44px;transform:translateX(-50%);width:78px;height:46px;z-index:4;pointer-events:none;
}
.bb-bust-l,.bb-bust-r{
  position:absolute;top:0;width:40px;height:40px;border-radius:50%;
  background:
    radial-gradient(circle at 32% 28%, rgba(255,255,255,.5), transparent 40%),
    radial-gradient(circle at 50% 65%, color-mix(in srgb, var(--skin) 55%, var(--top)), transparent 55%),
    color-mix(in srgb, var(--skin) 28%, var(--top));
  box-shadow:
    0 6px 10px rgba(0,0,0,.28),
    inset 0 -6px 0 rgba(0,0,0,.1),
    inset 0 4px 6px rgba(255,255,255,.15);
  border:2px solid color-mix(in srgb, var(--top) 65%, #000);
}
.bb-bust-l{left:-2px;transform:rotate(-6deg)}.bb-bust-r{right:-2px;transform:rotate(6deg)}
.bb-name{text-align:center;z-index:2}
.bb-name b{display:block;font-size:.78rem;font-weight:800;color:#fff}
.bb-name small{display:block;font-size:.62rem;opacity:.8;font-weight:600}
.bb-say{
  position:absolute;top:6px;right:4px;left:4px;z-index:6;
  background:#fff;color:#831843;font-size:.62rem;font-weight:800;padding:4px 6px;border-radius:8px;
  box-shadow:0 4px 10px rgba(0,0,0,.2);text-align:center;
}
.bb-actions{display:flex;flex-wrap:wrap;gap:8px;margin:12px 0;align-items:center}
.bb-howto{font-size:.7rem;opacity:.8;font-weight:600;margin-top:6px}
.bb-hud{
  display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin-bottom:8px;
}
.bb-stat{
  background:rgba(0,0,0,.28);border:1px solid rgba(255,255,255,.14);border-radius:999px;
  padding:6px 10px;font-weight:800;font-size:.75rem;
}
.bb-board{
  position:relative;border-radius:16px;overflow:hidden;min-height:300px;cursor:none;
  background:
    radial-gradient(800px 200px at 50% 0%, rgba(244,114,182,.25), transparent 60%),
    linear-gradient(180deg,#4c1d95,#831843 55%,#9d174d);
  border:1px solid rgba(255,255,255,.15);
  padding:10px;
}
.bb-board .bb-stage{position:relative;z-index:1;pointer-events:none}
.bb-board .bb-char{pointer-events:none;min-height:168px;background:rgba(0,0,0,.18)}
.bb-needle{
  position:absolute;z-index:20;width:28px;height:28px;margin:-4px 0 0 -4px;
  font-size:22px;pointer-events:none;opacity:0;transform:rotate(-25deg);filter:drop-shadow(0 2px 2px rgba(0,0,0,.4));
}
.bb-balloon{
  position:absolute;z-index:10;border:0;padding:0;cursor:none;
  border-radius:50% 50% 50% 50% / 45% 45% 55% 55%;
  background:
    radial-gradient(circle at 30% 28%, rgba(255,255,255,.55), transparent 35%),
    var(--b);
  box-shadow:0 6px 12px rgba(0,0,0,.25), inset -4px -6px 0 rgba(0,0,0,.08);
  animation:bbFloat .9s ease-in-out infinite alternate;
}
.bb-balloon .bb-shine{
  position:absolute;left:22%;top:18%;width:28%;height:18%;border-radius:50%;background:rgba(255,255,255,.45);
}
.bb-balloon .bb-string{
  position:absolute;left:50%;bottom:-14px;width:2px;height:16px;background:rgba(255,255,255,.55);transform:translateX(-50%);
}
@keyframes bbFloat{from{transform:translateY(0)}to{transform:translateY(-5px)}}
.bb-pop{
  position:absolute;z-index:15;transform:translate(-50%,-50%);
  font-weight:900;font-size:14px;color:#fff;text-shadow:0 2px 6px #000;pointer-events:none;
  animation:bbPop .45s ease-out forwards;
}
@keyframes bbPop{from{opacity:1;transform:translate(-50%,-50%) scale(.6)}to{opacity:0;transform:translate(-50%,-90%) scale(1.3)}}
.bb-scores{margin-top:14px;background:rgba(0,0,0,.2);border-radius:12px;padding:10px 12px}
.bb-scores h5{margin:0 0 8px;font-size:.8rem}
.bb-score-list{display:flex;flex-direction:column;gap:6px}
.bb-score-row{display:flex;justify-content:space-between;gap:8px;font-size:.78rem;font-weight:700}
.bb-wrap.play .bb-howto{text-align:center}