/* PLAYER-UI v2 — üç motorun ortak görsel dili (Hasan spec):
   [⧉] … [hız] [▶] [toplam] … [🎙]  ·  yuvarlak bölüm işaretli slider  ·  üstte katlanabilir şerit */
:root {
  --acc: #3ee08e; --acc2: #38bdf8;
  --pc-bg: rgba(8, 12, 10, .88); --pc-ink: #ecf2ee; --pc-mut: #93a89b;
  --pc-line: rgba(255, 255, 255, .10);
}

/* ---------- DOCK ---------- */
.pc-dock { position: fixed; left: 10px; right: 10px; bottom: calc(10px + env(safe-area-inset-bottom)); z-index: 30;
  background: var(--pc-bg); border: 1px solid var(--pc-line); border-radius: 20px;
  backdrop-filter: blur(22px); -webkit-backdrop-filter: blur(22px);
  padding: 0 12px 10px; max-width: 560px; margin: 0 auto; user-select: none; }

/* ŞERİT: sunum/harita = altyazı · rapor = transparan jest alanı — katlanabilir */
.pc-strip { position: relative; margin: 0 -4px; padding-top: 6px; }
.pc-strip .pc-grip { display: block; width: 44px; height: 5px; border-radius: 3px; margin: 0 auto 4px;
  background: rgba(255,255,255,.22); border: 0; cursor: pointer; padding: 0; }
.pc-strip .pc-strip-body { overflow: hidden; max-height: 6.2em; transition: max-height .3s ease, opacity .3s; touch-action: none; }
.pc-strip.collapsed .pc-strip-body { max-height: 0; opacity: 0; }

/* ---------- SLIDER: baştan sona zaman + yuvarlak basılabilir bölüm işaretleri + playhead ---------- */
.pc-prog { position: relative; height: 30px; cursor: pointer; touch-action: none; margin-top: 2px; }
.pc-track { position: absolute; left: 0; right: 0; top: 50%; height: 4px; margin-top: -2px; border-radius: 3px; background: rgba(255,255,255,.10); }
.pc-fill { position: absolute; left: 0; top: 50%; height: 4px; margin-top: -2px; border-radius: 3px; background: var(--acc); width: 0; }
.pc-knob { position: absolute; top: 50%; width: 14px; height: 14px; margin: -7px 0 0 -7px; border-radius: 50%;
  background: #fff; box-shadow: 0 1px 6px rgba(0,0,0,.55); pointer-events: none; z-index: 2; }
.pc-bubble { position: absolute; top: -20px; transform: translateX(-50%); background: #101815; border: 1px solid var(--pc-line);
  color: var(--pc-ink); border-radius: 8px; padding: 2px 8px; font-size: 11px; font-variant-numeric: tabular-nums; pointer-events: none; z-index: 3; }
.pc-mark { position: absolute; top: 50%; transform: translate(-50%, -50%); width: 17px; height: 17px; padding: 0;
  border-radius: 50%; border: 1.5px solid var(--acc2); background: #0d141b; color: var(--acc2);
  font-size: 9px; line-height: 1; display: grid; place-items: center; cursor: pointer; z-index: 1; }
.pc-mark:hover, .pc-mark:active { background: var(--acc2); color: #0a0e0c; box-shadow: 0 0 10px var(--acc2); }

/* ---------- KONTROL SATIRI: [⧉] … [hız][▶][toplam] … [🎙] ---------- */
.pc-ctr { display: flex; align-items: center; gap: 12px; margin-top: 2px; }
.pc-flex { flex: 1; }
.pc-big { width: 46px; height: 46px; border-radius: 50%; border: 1px solid var(--pc-line); background: rgba(255,255,255,.05);
  color: var(--pc-ink); cursor: pointer; display: grid; place-items: center; flex: none; }
.pc-big:active { background: rgba(255,255,255,.14); }
.pc-big-ph { width: 46px; flex: none; }
.pc-rec.recording { background: #3d1518; border-color: #ff5566; color: #ff8890; animation: pc-pulse 1.1s infinite; }
@keyframes pc-pulse { 50% { box-shadow: 0 0 0 7px rgba(255,85,102,.18); } }
.pc-ratebtn { min-width: 54px; height: 38px; border-radius: 999px; border: 1px solid var(--pc-line);
  background: rgba(255,255,255,.04); color: var(--pc-mut); font-size: 14px; font-weight: 800; cursor: pointer; flex: none; }
.pc-ratebtn.hot { color: var(--acc); border-color: var(--acc); }
.pc-play { width: 54px; height: 54px; border-radius: 50%; border: 0; background: #fff; color: #0a0e0c;
  font-size: 17px; cursor: pointer; box-shadow: 0 6px 22px rgba(0,0,0,.45); display: grid; place-items: center; flex: none; }
.pc-total { min-width: 54px; text-align: left; font-size: 13.5px; color: var(--pc-mut);
  font-variant-numeric: tabular-nums; font-weight: 700; flex: none; }

/* hız limit popup'ı (minimal) */
#pc-rate-pop { position: fixed; left: 50%; bottom: calc(120px + env(safe-area-inset-bottom)); transform: translateX(-50%);
  z-index: 80; background: rgba(14,18,15,.97); border: 1px solid var(--pc-line); border-radius: 14px;
  padding: 12px 16px; color: var(--pc-ink); font-size: 13px; min-width: 200px;
  backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px); }
#pc-rate-pop b { display: block; font-size: 12px; color: var(--pc-mut); margin-bottom: 8px; letter-spacing: .06em; }
#pc-rate-pop .pc-lrow { display: flex; align-items: center; gap: 10px; padding: 4px 0; }
#pc-rate-pop .pc-lrow span { width: 30px; color: var(--pc-mut); font-size: 12px; }
#pc-rate-pop .pc-lrow i { font-style: normal; font-weight: 800; color: var(--acc); min-width: 46px; text-align: center; }
#pc-rate-pop .pc-lrow button { width: 30px; height: 30px; border-radius: 50%; border: 1px solid var(--pc-line);
  background: rgba(255,255,255,.05); color: var(--pc-ink); font-size: 15px; cursor: pointer; }

/* ---------- ALTYAZI (şerit içinde) ---------- */
.pc-subwrap { display: flex; justify-content: center; }
.pc-subvp { max-width: 560px; width: 100%; padding: 4px 6px 8px; font-size: 15px; line-height: 1.55; text-align: center;
  overflow: hidden; touch-action: none; cursor: ew-resize; }
.pc-subwrap[data-lines="3"] .pc-subvp { height: 4.7em;   /* SABİT: içerikle büyüyüp zıplamasın */
  -webkit-mask-image: linear-gradient(180deg, transparent 0, #000 14%, #000 86%, transparent 100%);
  mask-image: linear-gradient(180deg, transparent 0, #000 14%, #000 86%, transparent 100%); }
.pc-subwrap[data-lines="1"] .pc-subvp { height: 1.7em; }
.pc-subtx { display: block; transition: transform .3s ease; will-change: transform; color: var(--pc-ink); }
/* SABİT font-weight: aktif kelime bold'a geçince genişlik/kırılım değişip metin oynuyordu */
.pc-sw { color: #b6c4ba; border-radius: 4px; padding: 0 1px; font-weight: 600; }
.pc-sw.on { color: #0a0e0c; background: var(--acc); }
.pc-sw.past { color: var(--pc-ink); }

/* rapor şeridi: transparan slide-to-scroll alanı + scroll konum başlığı */
.pc-rstrip { min-height: 34px; display: flex; align-items: center; justify-content: center;
  color: var(--pc-mut); font-size: 12.5px; text-align: center; padding: 2px 8px 6px; cursor: ew-resize; }
.pc-rstrip b { color: var(--pc-ink); font-weight: 700; max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

/* ---------- KAYIT OVERLAY ---------- */
#pc-rec-overlay { position: fixed; inset: 0; z-index: 60; background: rgba(5,8,6,.82);
  backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px);
  display: flex; align-items: center; justify-content: center; }
#pc-rec-overlay[hidden] { display: none; }
.pc-rec-card { width: min(330px, 86vw); border: 1px solid var(--pc-line); border-radius: 20px;
  padding: 18px; text-align: center; background: rgba(14,18,15,.96); }
#pc-wave { width: 100%; height: 64px; display: block; }
.pc-rec-row { display: flex; align-items: center; justify-content: center; gap: 8px; margin: 8px 0 4px; }
.pc-rec-dot { width: 10px; height: 10px; border-radius: 50%; background: #ff5566; animation: pc-pulse 1.1s infinite; }
#pc-rec-timer { font-size: 18px; color: var(--pc-ink); font-variant-numeric: tabular-nums; }
#pc-rec-where { font-size: 12px; color: var(--pc-mut); margin-top: 2px; }
.pc-rec-hint { font-size: 11px; color: var(--pc-mut); opacity: .75; margin-top: 10px; }

/* ---------- EMBED MODU ---------- */
.pc-embed .pc-dock, .pc-embed #bar, .pc-embed #gate, .pc-embed #dock, .pc-embed #subhint { display: none !important; }

/* ---------- TRANSKRİPT ÇEKMECESİ ---------- */
.pc-transcript { position: fixed; inset: 0; z-index: 50; background: rgba(5,8,6,.9);
  backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px); display: flex; flex-direction: column; }
.pc-transcript[hidden] { display: none; }
.pc-transcript .pc-tr-head { display: flex; align-items: center; justify-content: space-between; padding: 14px 18px;
  border-bottom: 1px solid var(--pc-line); }
.pc-transcript .pc-tr-head b { color: var(--pc-ink); font-size: 15px; }
.pc-transcript .pc-tr-head .pc-tr-actions { display: flex; gap: 8px; }
.pc-btn { background: rgba(255,255,255,.05); border: 1px solid var(--pc-line); color: var(--pc-ink); border-radius: 999px;
  padding: 7px 11px; font-size: 12.5px; font-weight: 700; cursor: pointer; line-height: 1; }
.pc-transcript .pc-tr-body { flex: 1; overflow-y: auto; padding: 18px; max-width: 680px; margin: 0 auto; width: 100%;
  color: var(--pc-ink); font-size: 15.5px; line-height: 1.75;
  -webkit-user-select: text; user-select: text; cursor: text; }
.pc-transcript .pc-tr-body h4 { color: var(--acc); font-size: 12px; letter-spacing: .14em; text-transform: uppercase; margin: 20px 0 6px; }
