/* player_r2.css — o player PRÓPRIO do curso (vídeo do Cloudflare R2).
 *
 * Regras do dono (2026-08-27): só play/pause, velocidade 1× fixa, o aluno só avança o que já
 * assistiu, mais expandir (tela cheia) e o "modo teatro". Nada de barra arrastável — o trilho
 * aqui é INDICADOR, por isso `cursor:not-allowed`.
 *
 * ⚠️ O que vai a tela cheia / teatro é o PALCO (o container), nunca o <video>: com o vídeo
 * sozinho em tela cheia o navegador desenha os controles DELE, e a regra do "não avança"
 * morreria junto (a barra nativa é arrastável).
 */
.pl-palco{ position:relative; background:#000; border-radius:8px; overflow:hidden; }
.pl-palco video{ display:block; width:100%; max-height:70vh; background:#000; }

/* Modo teatro: CSS puro, sem Fullscreen API. É o único que funciona quando o sistema bloqueia
 * tela cheia de janela (caso do Qubes, na estação do dono). */
.pl-palco.pl-teatro{ position:fixed; inset:0; z-index:9999; border-radius:0;
                     display:flex; flex-direction:column; justify-content:center; }
.pl-palco.pl-teatro video{ max-height:calc(100vh - 54px); height:calc(100vh - 54px); object-fit:contain; }
.pl-palco:fullscreen{ display:flex; flex-direction:column; justify-content:center; }
.pl-palco:fullscreen video{ max-height:calc(100vh - 54px); height:calc(100vh - 54px); object-fit:contain; }

.pl-capa{ position:absolute; inset:0; display:flex; align-items:center; justify-content:center;
          background:rgba(0,0,0,.5); cursor:pointer; }
.pl-capa b{ background:#00d94f; color:#04170c; border-radius:50%; width:72px; height:72px;
            display:flex; align-items:center; justify-content:center; font-size:29px; }
.pl-capa.pl-oculto{ display:none; }

.pl-controles{ display:flex; gap:12px; align-items:center; height:54px; padding:8px 12px;
               background:#121a14; border-top:1px solid #1f2c23; }
.pl-controles button{ background:transparent; color:#d7e5dc; border:0; font-size:17px;
                      cursor:pointer; padding:4px 6px; line-height:1; }
.pl-controles button:hover{ color:#00d94f; }
.pl-tempo{ font-variant-numeric:tabular-nums; color:#7d9488; font-size:12px; white-space:nowrap; }
.pl-trilho{ position:relative; flex:1; height:10px; background:#0a120d; border:1px solid #1f2c23;
            border-radius:5px; overflow:hidden; cursor:not-allowed; }
.pl-trilho i{ position:absolute; top:0; bottom:0; background:#00d94f; opacity:.7; }
.pl-teto{ position:absolute; top:0; bottom:0; width:2px; background:#ffb64d; opacity:.9; }
.pl-agulha{ position:absolute; top:-3px; width:3px; height:16px; background:#fff; border-radius:2px; }
.pl-vol{ width:78px; accent-color:#00d94f; }
.pl-aviso{ font-size:12px; color:#ffb64d; padding:6px 12px; background:#1a1410; border-top:1px solid #4a3a22; }
.pl-aviso.pl-oculto{ display:none; }