.yTplBzA{position:relative;width:100%;height:100%;border-radius:12px;overflow:hidden;display:flex;background:var(--color-background-secondary);cursor:pointer;video{width:100%;height:100%;object-fit:cover}}.yTplBzA1{background:rgba(255,255,255,.1);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border:none;padding:10px;cursor:pointer;color:white;display:flex;align-items:center;justify-content:center;border-radius:8px;transition:all .2s ease;&:hover{background:rgba(255,255,255,.15)}&:active{transform:scale(.95)}}.yTplBzA2{position:relative;height:5px;background:rgba(255,255,255,.2);-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);border-radius:8px;cursor:pointer;transition:all .2s ease;&:hover{height:7px}}.yTplBzA3{position:absolute;height:100%;background:var(--color-accent-primary);border-radius:8px;width:0;transition:var(--yTplBzA4);&:after{content:"";position:absolute;right:-7px;top:50%;transform:translateY(-50%);width:14px;height:14px;background:white;border-radius:50%;opacity:0;transition:opacity .2s}.yTplBzA2:hover &:after{opacity:1}}.yTplBzA5{position:absolute;bottom:0;left:0;right:0;border-radius:10px 10px 0 0;background:linear-gradient(0deg,rgba(0,0,0,.85) 0,rgba(0,0,0,.6) 50%,transparent);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);padding:15px;display:flex;flex-direction:column;gap:12px;opacity:0;transition:opacity .3s cubic-bezier(.4,0,.2,1);pointer-events:none;&.visible{opacity:1;pointer-events:all}}.yTplBzA6{display:flex;align-items:center;gap:8px}.yTplBzA7{color:white;font-size:var(--fs-sm);min-width:110px;margin-right:auto;margin-left:6px;font-weight:500;text-shadow:0 2px 4px rgba(0,0,0,.3);letter-spacing:.5px}.yTplBzA8{display:flex;align-items:center;gap:8px;margin-right:4px}.yTplBzA9{width:80px}.yTplBzAA{cursor:pointer;position:absolute;right:16px;top:16px;padding:8px 12px;border-radius:8px;border:none;background:rgba(0,0,0,.7);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);color:white;text-align:center;z-index:100;font-weight:600;font-size:var(--fs-sm);transition:all .2s ease;&:hover{background:rgba(0,0,0,.8)}&:active{transform:scale(.95)}}.yTplBzAB{position:absolute;top:50%;left:50%;translate:-50% -50%;width:50px;height:50px;border:4px solid rgba(255,255,255,.2);border-top:4px solid var(--color-accent-primary);border-radius:50%;animation:spin .8s linear infinite;z-index:10;@keyframes spin{to{transform:rotate(1turn)}}}