features.css

/* ── Always-on feature styles (independent of Liquid Glass Theme toggle) ── */

/* --- PREMIUM LOGO --- */
body.yt-pro-premium ytd-topbar-logo-renderer { margin-left: 16px !important; display: flex !important; align-items: center !important; }
body.yt-pro-premium ytd-topbar-logo-renderer a#logo { display: flex !important; align-items: center !important; text-decoration: none !important; }
body.yt-pro-premium ytd-topbar-logo-renderer a#logo > * { display: none !important; }
body.yt-pro-premium ytd-topbar-logo-renderer a#logo::before { content: ""; display: block !important; width: 34px !important; height: 24px !important; background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAxMDAgNzAiPjxwYXRoIGZpbGw9IiNGRjAwMDAiIGQ9Ik05Ny43LDExQzk2LjUsNi42LDkzLDMuMSw4OC42LDJDODAuOCwwLDUwLDAsNTAsMFMxOS4yLDAsMTEuNCwyQzcsMy4xLDMuNSw2LjYsMi4zLDExQzAsMTguOCwwLDM1LDAsMzVzMCwxNi4yLDIuMywyNGMxLjIsNC40LDQuNyw3LjksOS4xLDlDMTkuMiw3MCw1MCw3MCw1MCw3MHMzMC44LDAsMzguNi0yYzQuNC0xLjIsNy45LTQuNyw5LjEtOUMxMDAsNTEuMiwxMDAsMzUsMTAwLDM1UzEwMCwxOC44LDk3LjcsMTF6Ii8+PHBhdGggZmlsbD0iI0ZGRkZGRiIgZD0iTTQwLDUwbDI2LTE1TDQwLDIwVjUweiIvPjwvc3ZnPg==") !important; background-size: contain !important; background-repeat: no-repeat !important; background-position: center !important; margin-right: 2px !important; }
body.yt-pro-premium ytd-topbar-logo-renderer a#logo::after { content: "Premium"; display: block !important; font-family: "YouTube Sans", "Roboto", "Segoe UI", Arial, sans-serif !important; font-size: 22px !important; font-weight: 500 !important; color: #FFFFFF !important; margin-left: 2px !important; letter-spacing: -0.5px !important; line-height: 22px !important; }
body.yt-pro-premium ytd-topbar-logo-renderer #country-code { position: relative !important; display: block !important; margin-left: 2px !important; top: -8px !important; color: #aaaaaa !important; font-size: 11px !important; font-family: "Roboto", sans-serif !important; font-weight: 500 !important; }

/* --- SUPER AMBIENT MODE --- */
body.yt-pro-ambient #cinematics.ytd-watch-flexy { filter: saturate(250%) blur(10px) contrast(1.1) brightness(1.3); transform: scale(3); opacity: 1; mix-blend-mode: lighten; }
body.yt-pro-ambient { overflow-x: hidden !important; }
body.yt-pro-cinematic { overflow-x: hidden !important; }
body.yt-pro-ambient .style-scope.ytd-watch-flexy#player-container-inner { overflow: hidden; border-radius: 20px; box-shadow: 0px 16px 32px #00000054, 0px 0px 4px #00000038; }
@media (width: 1920px) { body.yt-pro-ambient #cinematics.ytd-watch-flexy { transform: scaleX(1.8) scaleY(1.7) translateX(130px) translateY(100px); } }
@media (width: 1280px) { body.yt-pro-ambient #cinematics.ytd-watch-flexy { transform: scaleX(2) scaleY(2.1) translateX(190px) translateY(100px) !important; } }

/* ── Fix: Cinematic Mode background transparency must not depend on Liquid Glass ── */
body.yt-pro-cinematic ytd-app,
body.yt-pro-cinematic ytd-masthead,
body.yt-pro-cinematic #page-manager.ytd-app,
body.yt-pro-cinematic #content.ytd-app { background: transparent !important; }
body.yt-pro-cinematic { background: transparent !important; }
html:has(body.yt-pro-cinematic)[dark] body { background-color: transparent !important; }

/* ── Fix: keep the real 3-dot / actions menu unscaled during Super Ambient ── */
body.yt-pro-ambient #cinematics.ytd-watch-flexy #actions,
body.yt-pro-ambient #cinematics.ytd-watch-flexy #menu,
body.yt-pro-ambient #cinematics.ytd-watch-flexy ytd-menu-renderer,
body.yt-pro-ambient #cinematics.ytd-watch-flexy #top-level-buttons-computed {
    transform: scale(0.3333) !important;
    transform-origin: right center !important;
}