Various enhacements for chat.openai.com, including easier to use textarea styling, and less waste of screen real estate

ChatGPT.enhanced.bookmarklet.js

var el = document.querySelector("#__next > div.overflow-hidden.w-full.h-full.relative.flex.z-0 > div.relative.flex.h-full.max-w-full.flex-1.overflow-hidden > div > main > div.absolute.bottom-0.left-0.w-full.border-t.md\\:border-t-0.dark\\:border-white\\/20.md\\:border-transparent.md\\:dark\\:border-transparent.md\\:bg-vert-light-gradient.bg-white.dark\\:bg-gray-800.md\\:\\!bg-transparent.dark\\:md\\:bg-vert-dark-gradient.pt-2 > form > div > div.flex.flex-col.w-full.py-2.flex-grow.md\\:py-3.md\\:pl-4.relative.border.border-black\\/10.bg-white.dark\\:border-gray-900\\/50.dark\\:text-white.dark\\:bg-gray-700.rounded-md.shadow-\\[0_0_10px_rgba\\(0\\,0\\,0\\,0\\.10\\)\\].dark\\:shadow-\\[0_0_15px_rgba\\(0\\,0\\,0\\,0\\.10\\)\\]");
el.style.boxSizing='border-box';
el.style.backgroundColor='#fafafa';

var ta = document.querySelector("#__next > div.overflow-hidden.w-full.h-full.relative.flex.z-0 > div.relative.flex.h-full.max-w-full.flex-1.overflow-hidden > div > main > div.absolute.bottom-0.left-0.w-full.border-t.md\\:border-t-0.dark\\:border-white\\/20.md\\:border-transparent.md\\:dark\\:border-transparent.md\\:bg-vert-light-gradient.bg-white.dark\\:bg-gray-800.md\\:\\!bg-transparent.dark\\:md\\:bg-vert-dark-gradient.pt-2 > form > div > div.flex.flex-col.w-full.py-2.flex-grow.md\\:py-3.md\\:pl-4.relative.border.border-black\\/10.bg-white.dark\\:border-gray-900\\/50.dark\\:text-white.dark\\:bg-gray-700.rounded-md.shadow-\\[0_0_10px_rgba\\(0\\,0\\,0\\,0\\.10\\)\\].dark\\:shadow-\\[0_0_15px_rgba\\(0\\,0\\,0\\,0\\.10\\)\\] > textarea");
ta.addEventListener('mouseover',function(){
    if(document.activeElement != ta){
        el.style.boxShadow = '0 0 10px rgba(0,0,0,.22)';
    }
});
ta.addEventListener('mouseout',function(){
    if(document.activeElement != ta){
        el.style.boxShadow = '0 0 10px rgba(0,0,0,.1)';
    }
});

var style0 = document.createElement('style');
document.head.appendChild(style0);

document.querySelectorAll("textarea")[0].addEventListener('focus',function(){
    el.style.outline='1px solid #9c9c9c'; 
    el.style.backgroundColor='#ffffff';
    el.style.boxShadow = '0 0 10px rgba(0,0,0,.27)';
    style0.innerHTML = "textarea::placeholder { opacity: 0.4; }";
});  
document.querySelectorAll("textarea")[0].addEventListener('blur',function(){
    el.style.outline='0px';
    el.style.backgroundColor='#fafafa';
    el.style.boxShadow = '0 0 10px rgba(0,0,0,.1)';
    style0.innerHTML = "textarea::placeholder { opacity: 1.0; }";
});

var style1 = document.createElement('style');
style1.innerHTML = `
@media (min-width:1024px) {
    .lg\\:max-w-xl {
        max-width: 50rem !important;
    }
}
@media (min-width:1280px) {
    .lg\\:max-w-xl {
        max-width: 70rem !important;
    }
}
`;
document.head.appendChild(style1);