/* Estados da area de video e as abas de quem estou assistindo. */

/* estados da area de video (1C), centrados sobre o palco */
.estadoPalco{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);z-index:4;
             width:min(460px,84%);border-radius:var(--rlg);padding:32px 24px;
             display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;
             text-align:center;background:radial-gradient(120% 100% at 50% 0,var(--palco1) 0,var(--palco2) 100%);
             box-shadow:0 0 0 1px var(--d500),var(--sombra2)}
.estadoPalco.erro{background:radial-gradient(120% 100% at 50% 0,var(--erroBg) 0,var(--palco2) 100%);
                  box-shadow:0 0 0 1px var(--ac8),var(--sombra2)}
.estadoPalco svg{color:var(--tx4)}
.estadoPalco.erro svg{color:var(--ac4)}
.estadoPalco .tt{font-size:14px;font-weight:500}
.estadoPalco p{margin:0;font-size:12px;color:var(--tx3);max-width:300px;text-wrap:pretty}
.estadoPalco .acs{display:flex;gap:8px;margin-top:2px}
.shimmerbar{width:220px;height:6px;border-radius:3px;
            background:linear-gradient(90deg,hsl(var(--acRaw)/.12) 0,hsl(var(--acRaw)/.45) 50%,hsl(var(--acRaw)/.12) 100%);
            background-size:240px 100%;animation:shimmer 1.4s linear infinite}

/* abas de quem estou assistindo, dentro da pilula */
.abas{display:flex;gap:4px;flex-wrap:nowrap;overflow:hidden}
.abas button{background:transparent;color:var(--tx2);font-size:12px;font-weight:500;padding:4px 9px;
             display:flex;align-items:center;gap:6px;border:0;border-radius:6px;white-space:nowrap}
.abas button:hover{background:var(--sup3);color:var(--tx)}
.abas button.at{background:hsl(var(--acRaw)/.18);color:var(--ac2)}
.abas .pt{width:5px;height:5px;border-radius:50%;background:var(--tx4)}
.abas button.viva .pt{background:var(--ac3);animation:livePulse 1.8s ease-in-out infinite}

.dados{font:12px/1.5 ui-monospace,Consolas,monospace;color:var(--tx3);margin:10px 0 0;
       font-variant-numeric:tabular-nums}