/* KOUANDA Documentary Runtime — visual layer */
@view-transition { navigation: auto; }
:root { --k-player-h: 82px; }
body { padding-bottom: var(--k-player-h); }
.k-player{
  position:fixed;z-index:950;left:14px;right:14px;bottom:12px;min-height:70px;
  display:grid;grid-template-columns:minmax(230px,1.2fr) auto auto auto minmax(250px,1fr) auto auto auto;
  align-items:center;gap:10px;padding:11px 14px;border:1px solid rgba(226,191,121,.28);
  border-radius:18px;background:linear-gradient(135deg,rgba(8,7,6,.96),rgba(20,15,10,.94));
  backdrop-filter:blur(22px);box-shadow:0 24px 90px rgba(0,0,0,.58);
  color:var(--ink,#f4ead8)
}
.k-player[data-state="closed"]{transform:translateY(calc(100% + 24px))}
.k-player__identity{display:grid;min-width:0}
.k-player__eyebrow,.k-drawer__eyebrow{font-size:9px;letter-spacing:.18em;text-transform:uppercase;color:var(--gold2,#e2bf79)}
.k-player__identity strong{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-family:var(--serif,Georgia,serif);font-weight:500;font-size:16px}
.k-player__identity span:last-child{font-size:10px;color:var(--muted,#b9ab94);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.k-play,.k-icon,.k-pill,.k-speed select{
  border:1px solid rgba(226,191,121,.26);background:#17130f;color:var(--ink,#f4ead8);border-radius:999px
}
.k-play{width:42px;height:42px;cursor:pointer}.k-icon{min-width:38px;height:38px;cursor:pointer}
.k-pill{padding:9px 12px;cursor:pointer}.k-player button:disabled,.k-player select:disabled,.k-player input:disabled{opacity:.42;cursor:not-allowed}
.k-player__timeline{display:grid;grid-template-columns:auto 1fr auto;gap:8px;align-items:center;font-size:10px;color:var(--muted,#b9ab94)}
.k-player__timeline input{width:100%;accent-color:var(--gold2,#e2bf79)}
.k-speed{display:flex;gap:6px;align-items:center;font-size:9px;text-transform:uppercase;letter-spacing:.08em;color:var(--muted,#b9ab94)}
.k-speed select{padding:8px}
.k-drawer{
 position:fixed;z-index:960;top:0;right:0;bottom:0;width:min(520px,94vw);padding:76px 28px 28px;
 background:linear-gradient(160deg,#17130f,#080706 72%);border-left:1px solid rgba(226,191,121,.26);
 box-shadow:-30px 0 90px rgba(0,0,0,.52);transform:translateX(105%);transition:transform .35s ease;overflow:auto
}
.k-drawer.open{transform:translateX(0)}
.k-drawer__close{position:absolute;top:20px;right:20px;width:42px;height:42px;border-radius:999px;border:1px solid rgba(226,191,121,.26);background:#17130f;color:var(--ink,#f4ead8);cursor:pointer}
.k-drawer h2{font-family:var(--serif,Georgia,serif);font-weight:500;font-size:42px;line-height:1;margin:10px 0 26px}
.k-drawer__body{color:#d3c6ae;line-height:1.75;margin-bottom:24px}
.k-drawer__row{display:grid;grid-template-columns:130px 1fr;gap:14px;padding:14px 0;border-top:1px solid rgba(255,255,255,.08)}
.k-drawer__row span{font-size:9px;letter-spacing:.12em;text-transform:uppercase;color:var(--gold2,#e2bf79)}
.k-drawer__row strong{font-size:12px;font-weight:500;color:#d9ccb6}
.k-source-link{display:inline-flex;margin-top:24px;padding:12px 15px;border-radius:999px;background:var(--gold2,#e2bf79);color:#17120c!important;font-size:10px;letter-spacing:.1em;text-transform:uppercase}
.k-sr{position:fixed!important;width:1px;height:1px;overflow:hidden;clip:rect(1px,1px,1px,1px)}
.k-reveal{opacity:0;transform:translateY(26px);transition:opacity .7s ease,transform .8s cubic-bezier(.2,.7,.2,1)}
.k-revealed{opacity:1;transform:none}
[data-source-url]{cursor:pointer}
:focus-visible{outline:2px solid var(--gold2,#e2bf79);outline-offset:4px}
@media(max-width:900px){
  :root{--k-player-h:132px}
  .k-player{grid-template-columns:1fr auto auto auto;grid-template-areas:"id prev play next" "timeline timeline timeline timeline" "speed transcript close close"}
  .k-player__identity{grid-area:id}.k-player__timeline{grid-area:timeline}.k-speed{grid-area:speed}
  #k-player-transcript{grid-area:transcript}#k-player-close{grid-area:close;justify-self:end}
}
@media(max-width:560px){
  :root{--k-player-h:150px}
  .k-player{left:8px;right:8px;bottom:8px;padding:10px}
  .k-player__identity strong{font-size:14px}.k-player__identity span:last-child{display:none}
  .k-speed{display:none}
  .k-drawer{padding:68px 20px 22px}
  .k-drawer h2{font-size:34px}
}
@media(prefers-reduced-motion:reduce){
  .k-reveal,.k-revealed,.k-drawer,.k-player{transition:none!important;transform:none}
  .k-reveal{opacity:1}
  @view-transition{navigation:none}
}
