☰

YouTube - Non-Rounded Design

This script disables YouTube's new rounded corners (reverts back to the previous layout from 2021.)

当前为 2024-08-09 提交的版本，查看 最新版本。

  1. // ==UserScript==
  2. // @name         YouTube - Non-Rounded Design
  3. // @version      5.2.8
  4. // @description  This script disables YouTube's new rounded corners (reverts back to the previous layout from 2021.)
  5. // @author       Magma_Craft
  6. // @license MIT
  7. // @match        https://www.youtube.com/*
  8. // @namespace    https://gf.qytechs.cn/en/users/933798
  9. // @icon         https://www.youtube.com/favicon.ico
  10. // @run-at       document-start
  11. // @grant        none
  12. // ==/UserScript==
  13. // Enable strict mode to catch common coding mistakes
  14. "use strict";
  15.  
  16. // Define the flags to assign to the EXPERIMENT_FLAGS object
  17. const flagsToAssign = {
  18.   kevlar_refresh_on_theme_change: false,
  19.   kevlar_watch_cinematics: false,
  20.   kevlar_watch_grid: false,
  21.   kevlar_watch_grid_hide_chips: false,
  22.   kevlar_watch_metadata_refresh_no_old_secondary_data: false,
  23.   enable_channel_page_header_profile_section: false,
  24.   kevlar_modern_sd_v2: false,
  25.   smartimation_background: false,
  26.   web_animated_actions: false,
  27.   web_animated_like: false,
  28.   web_animated_like_lazy_load: false,
  29.   web_modern_collections_v2: false,
  30.   web_modern_tabs: false,
  31.   web_modern_typography: false,
  32.   web_enable_youtab: false,
  33.   web_rounded_containers: false,
  34.   web_rounded_thumbnails: false,
  35.   web_watch_rounded_player_large: false,
  36.   // Extra additions to remove the watch grid UI
  37.   web_player_enable_featured_product_banner_exclusives_on_desktop: false,
  38.   kevlar_watch_comments_panel_button: false,
  39.   fill_view_models_on_web_vod: true,
  40.   kevlar_watch_flexy_metadata_height: 136,
  41.   kevlar_watch_max_player_width: 1280,
  42.   live_chat_over_engagement_panels: false,
  43.   live_chat_scaled_height: false,
  44.   live_chat_smaller_min_height: false,
  45.   main_app_controller_extraction_batch_18: false,
  46.   main_app_controller_extraction_batch_19: false,
  47.   no_iframe_for_web_stickiness: false,
  48.   optimal_reading_width_comments_ep: false,
  49.   remove_masthead_channel_banner_on_refresh: false,
  50.   small_avatars_for_comments: false,
  51.   small_avatars_for_comments_ep: false,
  52.   web_watch_compact_comments: false,
  53.   web_watch_compact_comments_header: false,
  54.   web_watch_log_theater_mode: false,
  55.   web_watch_theater_chat: false,
  56.   web_watch_theater_fixed_chat: false,
  57.   wn_grid_max_item_width: 0,
  58.   wn_grid_min_item_width: 0
  59. };
  60.  
  61. const updateFlags = () => {
  62.   // Check if the EXPERIMENT_FLAGS object exists in the window.yt.config_ property chain
  63.   const expFlags = window?.yt?.config_?.EXPERIMENT_FLAGS;
  64.  
  65.   // If EXPERIMENT_FLAGS is not found, exit the function
  66.   if (!expFlags) return;
  67.  
  68.   // Assign the defined flags to the EXPERIMENT_FLAGS object
  69.   Object.assign(expFlags, flagsToAssign);
  70. };
  71.  
  72. // Create a MutationObserver that calls the updateFlags function when changes occur in the document's subtree
  73. const mutationObserver = new MutationObserver(updateFlags);
  74. mutationObserver.observe(document, { subtree: true, childList: true });
  75.  
  76. document.getElementsByTagName("html")[0].removeAttribute("darker-dark-theme");
  77. document.getElementsByTagName("html")[0].removeAttribute("darker-dark-theme-deprecate");
  78.  
  79. var styles = document.createElement("style");
  80. styles.innerHTML=`
  81. /* Revert old background color and buttons */
  82. html[dark] { --yt-spec-general-background-a: #181818 !important; --yt-spec-general-background-b: #0f0f0f !important; --yt-spec-brand-background-primary: rgba(33, 33, 33, 0.98) !important; --yt-spec-10-percent-layer: rgba(255, 255, 255, 0.1) !important }
  83. html:not([dark]) { --yt-spec-general-background-a: #f9f9f9 !important; --yt-spec-general-background-b: #f1f1f1 !important; --yt-spec-brand-background-primary: rgba(255, 255, 255, 0.98) !important; --yt-spec-10-percent-layer: rgba(0, 0, 0, 0.1) !important }
  84. ytd-masthead { background: var(--yt-spec-brand-background-solid) !important }
  85. ytd-app { background: var(--yt-spec-general-background-a) !important }
  86. ytd-browse[page-subtype="channels"] { background: var(--yt-spec-general-background-b) !important }
  87. ytd-c4-tabbed-header-renderer { --yt-lightsource-section1-color: var(--yt-spec-general-background-a) !important }
  88. #page-header.ytd-tabbed-page-header, #tabs-inner-container.ytd-tabbed-page-header { background: var(--yt-spec-general-background-a) !important }
  89. #tabs-divider.ytd-c4-tabbed-header-renderer, #tabs-divider.ytd-tabbed-page-header { border-bottom: 0px !important }
  90. ytd-mini-guide-renderer, ytd-mini-guide-entry-renderer { background-color: var(--yt-spec-brand-background-solid) !important }
  91. #cinematics.ytd-watch-flexy { display: none !important }
  92. #header.ytd-rich-grid-renderer { width: 100% !important }
  93. [page-subtype="home"] #chips-wrapper.ytd-feed-filter-chip-bar-renderer { background-color: var(--yt-spec-brand-background-primary) !important; border-top: 1px solid var(--yt-spec-10-percent-layer) !important; border-bottom: 1px solid var(--yt-spec-10-percent-layer) !important }
  94. ytd-feed-filter-chip-bar-renderer[is-dark-theme] #left-arrow.ytd-feed-filter-chip-bar-renderer::after { background: linear-gradient(to right, var(--yt-spec-brand-background-primary) 20%, rgba(33, 33, 33, 0) 80%) !important }
  95. ytd-feed-filter-chip-bar-renderer[is-dark-theme] #right-arrow.ytd-feed-filter-chip-bar-renderer::before { background: linear-gradient(to left, var(--yt-spec-brand-background-primary) 20%, rgba(33, 33, 33, 0) 80%) !important }
  96. ytd-feed-filter-chip-bar-renderer #left-arrow-button.ytd-feed-filter-chip-bar-renderer, ytd-feed-filter-chip-bar-renderer #right-arrow-button.ytd-feed-filter-chip-bar-renderer { background-color: var(--yt-spec-brand-background-primary) !important }
  97. yt-chip-cloud-renderer[is-dark-theme] #right-arrow.yt-chip-cloud-renderer::before { background: linear-gradient(to left, var(--ytd-chip-cloud-background, var(--yt-spec-general-background-a)) 10%, rgba(24, 24, 24, 0) 90%) !important }
  98. yt-chip-cloud-renderer #left-arrow-button.yt-chip-cloud-renderer, yt-chip-cloud-renderer #right-arrow-button.yt-chip-cloud-renderer { background: var(--ytd-chip-cloud-background, var(--yt-spec-general-background-a)) !important }
  99. yt-chip-cloud-renderer[is-dark-theme] #left-arrow.yt-chip-cloud-renderer::after { background: linear-gradient(to right, var(--ytd-chip-cloud-background, var(--yt-spec-general-background-a)) 10%, rgba(24, 24, 24, 0) 90%) !important }
  100. yt-chip-cloud-renderer #left-arrow.yt-chip-cloud-renderer::after { background: linear-gradient(to right, var(--ytd-chip-cloud-background, var(--yt-spec-general-background-a)) 10%, rgba(249, 249, 249, 0) 90%) !important }
  101. yt-chip-cloud-renderer #right-arrow.yt-chip-cloud-renderer::before { background: linear-gradient(to left, var(--ytd-chip-cloud-background, var(--yt-spec-general-background-a)) 10%, rgba(249, 249, 249, 0) 90%) !important }
  102. ytd-feed-filter-chip-bar-renderer[component-style="FEED_FILTER_CHIP_BAR_STYLE_TYPE_HASHTAG_LANDING_PAGE"] #chips-wrapper.ytd-feed-filter-chip-bar-renderer, ytd-feed-filter-chip-bar-renderer[component-style="FEED_FILTER_CHIP_BAR_STYLE_TYPE_CHANNEL_PAGE_GRID"] #chips-wrapper.ytd-feed-filter-chip-bar-renderer { background-color: var(--yt-spec-general-background-b) !important }
  103. yt-chip-cloud-chip-renderer { height: 32px !important; border: 1px solid var(--yt-spec-10-percent-layer) !important; border-radius: 16px !important; box-sizing: border-box !important }
  104. /* Remove rounded corners on buttons and boxes */
  105. #container.ytd-searchbox { background-color: var(--ytd-searchbox-background) !important; border-radius: 2px 0 0 2px !important; box-shadow: inset 0 1px 2px var(--ytd-searchbox-legacy-border-shadow-color) !important; color: var(--ytd-searchbox-text-color) !important; padding: 2px 6px !important }
  106. ytd-searchbox[desktop-searchbar-style="rounded_corner_dark_btn"] #searchbox-button.ytd-searchbox { display: none !important }
  107. ytd-searchbox[desktop-searchbar-style="rounded_corner_light_btn"] #searchbox-button.ytd-searchbox { display: none !important }
  108. #search[has-focus] #search-input { margin-left: 32px !important }
  109. #search-icon-legacy.ytd-searchbox { display: block !important; border-radius: 0px 2px 2px 0px !important }
  110. .sbsb_a { border-radius: 2px !important }
  111. .sbsb_c { padding-left: 10px !important }
  112. div.sbqs_c::before { margin-right: 10px !important }
  113. ytd-searchbox[has-focus] #search-icon.ytd-searchbox { padding-left: 10px !important; padding-right: 10px !important }
  114. #voice-search-button.ytd-masthead { background-color: var(--yt-spec-general-background-a) !important; margin-left: 4px !important }
  115. #guide-content.ytd-app { background: var(--yt-spec-brand-background-solid) !important }
  116. yt-interaction.ytd-guide-entry-renderer, ytd-guide-entry-renderer, ytd-guide-entry-renderer[guide-refresh], ytd-mini-guide-entry-renderer, ytd-guide-entry-renderer[active], .style-scope.ytd-guide-entry-renderer:hover, tp-yt-paper-item.style-scope.ytd-guide-entry-renderer { border-radius: 0px !important }
  117. ytd-guide-entry-renderer[guide-refresh] { width: 100% !important }
  118. ytd-mini-guide-renderer[guide-refresh] { padding: 0 !important }
  119. a#endpoint.yt-simple-endpoint.style-scope.ytd-mini-guide-entry-renderer { margin: 0px !important }
  120. tp-yt-paper-item.ytd-guide-entry-renderer { --paper-item-focused-before-border-radius: 0px !important }
  121. ytd-guide-section-renderer.style-scope.ytd-guide-renderer { padding-left: 0px !important }
  122. tp-yt-paper-item.style-scope.ytd-guide-entry-renderer { padding-left: 24px !important }
  123. #guide-section-title.ytd-guide-section-renderer { color: var(--yt-spec-text-secondary) !important; padding: 8px 24px !important; font-size: var(--ytd-tab-system-font-size) !important; font-weight: var(--ytd-tab-system-font-weight) !important; letter-spacing: var(--ytd-tab-system-letter-spacing) !important; text-transform: var(--ytd-tab-system-text-transform) !important }
  124. .style-scope.ytd-rich-item-renderer { border-radius: 2px !important }
  125. .style-scope.ytd-item-section-renderer { border-radius: 0px !important }
  126. #tooltip.tp-yt-paper-tooltip { border-radius: 2px !important }
  127. div.style-scope.yt-tooltip-renderer { border-radius: 0px !important }
  128. .style-scope.ytd-topic-link-renderer { border-radius: 2px !important }
  129. .style-scope.yt-formatted-string, .bold.style-scope.yt-formatted-string { font-family: Roboto !important }
  130. #bar { border-radius: 2px !important }
  131. ytd-multi-page-menu-renderer { border-radius: 0px !important; border: 1px solid var(--yt-spec-10-percent-layer) !important; border-top: none !important; box-shadow: none !important }
  132. yt-dropdown-menu { --paper-menu-button-content-border-radius: 2px !important }
  133. ytd-menu-popup-renderer { border-radius: 2px !important }
  134. .style-scope.ytd-shared-post-renderer, div#repost-context.style-scope.ytd-shared-post-renderer, ytd-post-renderer.style-scope.ytd-shared-post-renderer { border-radius: 0px !important }
  135. div#dismissed.style-scope.ytd-compact-video-renderer { border-radius: 0px !important }
  136. .style-scope.ytd-feed-nudge-renderer, .style-scope.ytd-inline-survey-renderer { border-radius: 2px !important }
  137. .style-scope.ytd-brand-video-shelf-renderer, div#dismissible.style-scope.ytd-brand-video-singleton-renderer, #inline-survey-compact-video-renderer { border-radius: 0px !important }
  138. tp-yt-paper-button#button.style-scope.ytd-button-renderer.style-inactive-outline.size-default { border-radius: 2px !important }
  139. div#dismissed.style-scope.ytd-rich-grid-media { border-radius: 0px !important }
  140. ytd-thumbnail[size="large"] a.ytd-thumbnail, ytd-thumbnail[size="large"]::before, ytd-thumbnail[size="medium"] a.ytd-thumbnail, ytd-thumbnail[size="medium"]::before { border-radius: 0 !important }
  141. ytd-playlist-thumbnail[size="medium"] a.ytd-playlist-thumbnail, ytd-playlist-thumbnail[size="medium"]::before, ytd-playlist-thumbnail[size="large"] a.ytd-playlist-thumbnail, ytd-playlist-thumbnail[size="large"]::before { border-radius: 0 !important }
  142. ytd-playlist-panel-renderer[modern-panels]:not([within-miniplayer]) #container.ytd-playlist-panel-renderer { border-radius: 0 !important }
  143. ytd-thumbnail-overlay-toggle-button-renderer.style-scope.ytd-thumbnail { border-radius: 2px !important }
  144. #title.ytd-settings-sidebar-renderer { font-family: Roboto !important; font-weight: 400 !important; }
  145. ytd-compact-link-renderer.ytd-settings-sidebar-renderer { margin: 0px !important; border-radius: 0 !important }
  146. ytd-compact-link-renderer[compact-link-style=compact-link-style-type-settings-sidebar][active] { border-radius: 0 !important }
  147. tp-yt-paper-item.style-scope.ytd-compact-link-renderer::before { border-radius: 0 !important }
  148. ytd-compact-link-renderer[compact-link-style=compact-link-style-type-settings-sidebar] tp-yt-paper-item.ytd-compact-link-renderer { padding-left: 24px !important; padding-right: 24px !important }
  149. img#img.style-scope.yt-image-shadow { border-radius: 50px !important }
  150. #title.style-scope.ytd-feed-nudge-renderer { font-family: Roboto !important }
  151. yt-chip-cloud-chip-renderer.style-scope.ytd-feed-nudge-renderer { border-radius: 50px !important }
  152. div#label-container.style-scope.ytd-thumbnail-overlay-toggle-button-renderer { border: 2px !important; text-transform: uppercase !important }
  153. ytd-thumbnail-overlay-time-status-renderer.style-scope.ytd-thumbnail { border-radius: 2px !important }
  154. ytd-backstage-post-dialog-renderer { border-radius: 2px !important }
  155. yt-bubble-hint-renderer { border-radius: 2px !important }
  156. ytd-watch-metadata[modern-metapanel] #description.ytd-watch-metadata, #description.ytd-watch-metadata { background-color: transparent !important; border-radius: 0px !important }
  157. ytd-watch-metadata[modern-metapanel] #description-inner.ytd-watch-metadata, #description-inner.ytd-watch-metadata { margin: 0px !important }
  158. ytd-watch-metadata[modern-metapanel-order] #comment-teaser.ytd-watch-metadata, #comment-teaser.ytd-watch-metadata { border: 1px solid var(--yt-spec-10-percent-layer) !important; border-radius: 4px !important }
  159. ytd-comments-entry-point-header-renderer[modern-metapanel], #comment-teaser.ytd-watch-metadata { background-color: transparent !important }
  160. div#title.text-shell.skeleton-bg-color, div#count.text-shell.skeleton-bg-color, div#owner-name.text-shell.skeleton-bg-color, div#published-date.text-shell.skeleton-bg-color, div.rich-video-title.text-shell.skeleton-bg-color, div.rich-video-meta.text-shell.skeleton-bg-color { border-radius: 2px !important }
  161. div#subscribe-button.skeleton-bg-color { border-radius: 4px !important }
  162. div.rich-thumbnail.skeleton-bg-color { border-radius: 0px !important }
  163. button.yt-spec-button-shape-next.yt-spec-button-shape-next--text.yt-spec-button-shape-next--mono.yt-spec-button-shape-next--size-m.yt-spec-button-shape-next--icon-only-default[aria-label="Clear search query"] > div.yt-spec-button-shape-next__icon > yt-icon { width: 20px !important; height: 20px !important; margin-top: 2px !important; margin-left: 2px !important }
  164. .yt-spec-button-shape-next--icon-only-default {background-color: transparent !important }
  165. .yt-spec-button-shape-next--size-m.yt-spec-button-shape-next--segmented-start::after { width: 0px !important; margin-left: 8px !important }
  166. ytd-watch-metadata ytd-video-owner-renderer ytd-button-renderer a, ytd-watch-metadata ytd-video-owner-renderer ytd-button-renderer button, #channel-header-container #meta ~ #buttons ytd-button-renderer a, #channel-header-container #meta ~ #buttons ytd-button-renderer button { height: 37px !important; border-radius: 2px !important; text-transform: uppercase !important; letter-spacing: 0.5px; background: var(--yt-spec-call-to-action) !important; border: 1px solid #075cd3 !important; color: #fff !important }
  167. [dark] #subscribe-button ytd-button-renderer a, [dark] ytd-watch-metadata ytd-video-owner-renderer ytd-button-renderer a, [dark] ytd-watch-metadata ytd-video-owner-renderer ytd-button-renderer button, [dark] #channel-header-container #meta ~ #buttons ytd-button-renderer a, [dark] #channel-header-container #meta ~ #buttons ytd-button-renderer button { height: 37px !important; background: var(--yt-spec-call-to-action) !important; border: 1px solid #3ea6ff !important; color: #fff !important }
  168. #subscribe-button ytd-button-renderer a, ytd-watch-metadata ytd-video-owner-renderer ytd-button-renderer a, ytd-watch-metadata ytd-video-owner-renderer ytd-button-renderer button, #channel-header-container #meta ~ #buttons ytd-button-renderer a, #channel-header-container #meta ~ #buttons ytd-button-renderer button { height: 37px !important; border-radius: 2px !important; text-transform: uppercase !important; letter-spacing: 0.5px; background: var(--yt-spec-call-to-action) !important; border: 0px !important; color: #fff !important }
  169. #edit-buttons ytd-button-renderer a, #edit-buttons ytd-button-renderer button { height: 37px !important; letter-spacing: 0.5px; background: var(--yt-spec-call-to-action) !important; border: 1px solid #075cd3 !important; color: #fff !important }
  170. [dark] #edit-buttons ytd-button-renderer a, [dark] #edit-buttons ytd-button-renderer button { height: 37px !important; background: var(--yt-spec-call-to-action) !important; border: 1px solid #3ea6ff !important; color: #fff !important }
  171. #sponsor-button ytd-button-renderer button { height: 37px !important; border-radius: 2px !important; text-transform: uppercase !important }
  172. yt-button-shape.style-scope.ytd-subscribe-button-renderer { display: flex !important }
  173. #subscribe-button ytd-subscribe-button-renderer button { height: 37px !important; letter-spacing: 0.5px !important; border-radius: 2px !important; text-transform: uppercase !important }
  174. .yt-spec-button-shape-next--mono.yt-spec-button-shape-next--filled { color: #fff !important; background: var(--yt-spec-brand-button-background) !important; border-radius: 2px !important; text-transform: uppercase !important; letter-spacing: 0.5px !important }
  175. button.yt-spec-button-shape-next.yt-spec-button-shape-next--tonal.yt-spec-button-shape-next--mono.yt-spec-button-shape-next--size-m { height: 37px !important; letter-spacing: 0.5px !important; border-radius: 2px !important; text-transform: uppercase !important }
  176. #subscribe-button ytd-subscribe-button-renderer button.yt-spec-button-shape-next--tonal { background-color: var(--yt-spec-badge-chip-background) !important; color: var(--yt-spec-text-secondary) !important }
  177. button.yt-spec-button-shape-next.yt-spec-button-shape-next--tonal.yt-spec-button-shape-next--mono.yt-spec-button-shape-next--size-s { background-color: var(--yt-spec-badge-chip-background) !important; color: var(--yt-spec-text-secondary) !important; height: 25px !important; letter-spacing: 0.5px !important; border-radius: 2px !important; text-transform: uppercase !important }
  178. div#notification-preference-button.style-scope.ytd-subscribe-button-renderer > ytd-subscription-notification-toggle-button-renderer-next.style-scope.ytd-subscribe-button-renderer > yt-button-shape > .yt-spec-button-shape-next--size-m { background-color: transparent !important; border-radius: 16px !important; padding-left: 14px !important; padding-right: 2px !important; margin-left: 4px !important }
  179. #subscribe-button.ytd-channel-renderer a.yt-spec-button-shape-next.yt-spec-button-shape-next--filled.yt-spec-button-shape-next--mono.yt-spec-button-shape-next--size-m { background: var(--yt-spec-brand-button-background) !important }
  180. #channel-header-container #meta ~ #buttons ytd-button-renderer button[aria-label="Subscribe"],
  181. #channel-header-container #meta ~ #buttons ytd-button-renderer button[aria-label="ติดตาม"],
  182. #channel-header-container #meta ~ #buttons ytd-button-renderer button[aria-label="Pratite kanal"],
  183. #channel-header-container #meta ~ #buttons ytd-button-renderer button[aria-label="Teken in"],
  184. #channel-header-container #meta ~ #buttons ytd-button-renderer button[aria-label="kanalına abunə olun"],
  185. #channel-header-container #meta ~ #buttons ytd-button-renderer button[aria-label="Langgan"],
  186. #channel-header-container #meta ~ #buttons ytd-button-renderer button[aria-label="Pretplatite se na kanal"],
  187. #channel-header-container #meta ~ #buttons ytd-button-renderer button[aria-label="Subscriu-te al canal"],
  188. #channel-header-container #meta ~ #buttons ytd-button-renderer button[aria-label="se k"],
  189. #channel-header-container #meta ~ #buttons ytd-button-renderer button[aria-label="Abonner på"],
  190. #channel-header-container #meta ~ #buttons ytd-button-renderer button[aria-label="abonnieren."],
  191. #channel-header-container #meta ~ #buttons ytd-button-renderer button[aria-label="Telli"],
  192. #channel-header-container #meta ~ #buttons ytd-button-renderer button[aria-label="Suscribirse"],
  193. #channel-header-container #meta ~ #buttons ytd-button-renderer button[aria-label="Suscribirme"],
  194. #channel-header-container #meta ~ #buttons ytd-button-renderer button[aria-label="Harpidetu"],
  195. #channel-header-container #meta ~ #buttons ytd-button-renderer button[aria-label="Mag-subscribe sa"],
  196. #channel-header-container #meta ~ #buttons ytd-button-renderer button[aria-label="S'abonner à"],
  197. #channel-header-container #meta ~ #buttons ytd-button-renderer button[aria-label="Subscribirse"],
  198. #channel-header-container #meta ~ #buttons ytd-button-renderer button[aria-label="Bhalisesla"],
  199. #channel-header-container #meta ~ #buttons ytd-button-renderer button[aria-label="Prihlásiť sa na odber kanála"],
  200. #channel-header-container #meta ~ #buttons ytd-button-renderer button[aria-label="Hefja áskrift að"],
  201. #channel-header-container #meta ~ #buttons ytd-button-renderer button[aria-label="Iscriviti"],
  202. #channel-header-container #meta ~ #buttons ytd-button-renderer button[aria-label="Fuatilia"],
  203. #channel-header-container #meta ~ #buttons ytd-button-renderer button[aria-label="Abonēt kanālu"],
  204. #channel-header-container #meta ~ #buttons ytd-button-renderer button[aria-label="Prenumeruoti"],
  205. #channel-header-container #meta ~ #buttons ytd-button-renderer button[aria-label="Feliratkozás"],
  206. #channel-header-container #meta ~ #buttons ytd-button-renderer button[aria-label="Abonneren op"],
  207. #channel-header-container #meta ~ #buttons ytd-button-renderer button[aria-label="Obuna qiling"],
  208. #channel-header-container #meta ~ #buttons ytd-button-renderer button[aria-label="Abonohu në"],
  209. #channel-header-container #meta ~ #buttons ytd-button-renderer button[aria-label="Đăng ký"],
  210. #channel-header-container #meta ~ #buttons ytd-button-renderer button[aria-label="alına abone ol."],
  211. #channel-header-container #meta ~ #buttons ytd-button-renderer button[aria-label="Падпісацца на канал"],
  212. #channel-header-container #meta ~ #buttons ytd-button-renderer button[aria-label="Абониране"],
  213. #channel-header-container #meta ~ #buttons ytd-button-renderer button[aria-label="каналына жазылыңыз."],
  214. #channel-header-container #meta ~ #buttons ytd-button-renderer button[aria-label="арнасына жазылу"],
  215. #channel-header-container #meta ~ #buttons ytd-button-renderer button[aria-label="Претплатете се на"],
  216. #channel-header-container #meta ~ #buttons ytd-button-renderer button[aria-label="захиалах."],
  217. #channel-header-container #meta ~ #buttons ytd-button-renderer button[aria-label="Оформить подписку на канал"],
  218. #channel-header-container #meta ~ #buttons ytd-button-renderer button[aria-label="Пратите канал"],
  219. #channel-header-container #meta ~ #buttons ytd-button-renderer button[aria-label="Підписатися на канал"],
  220. #channel-header-container #meta ~ #buttons ytd-button-renderer button[aria-label="Subscrever"],
  221. #channel-header-container #meta ~ #buttons ytd-button-renderer button[aria-label="Inscreva-se em"],
  222. #channel-header-container #meta ~ #buttons ytd-button-renderer button[aria-label="Abonează-te la"],
  223. #channel-header-container #meta ~ #buttons ytd-button-renderer button[aria-label="Prenumerera på"],
  224. #channel-header-container #meta ~ #buttons ytd-button-renderer button[aria-label="Հետևել"],
  225. #channel-header-container #meta ~ #buttons ytd-button-renderer button[aria-label="הרשמה למינוי לערוץ"],
  226. #channel-header-container #meta ~ #buttons ytd-button-renderer button[aria-label="کو سبسکرائب کریں۔"],
  227. #channel-header-container #meta ~ #buttons ytd-button-renderer button[aria-label="يمكنك الاشتراك في قناة"],
  228. #channel-header-container #meta ~ #buttons ytd-button-renderer button[aria-label="مشترک شدن در"],
  229. #channel-header-container #meta ~ #buttons ytd-button-renderer button[aria-label="को सदस्यता लिनुहोस्।"],
  230. #channel-header-container #meta ~ #buttons ytd-button-renderer button[aria-label="चे सदस्यत्व घ्या."],
  231. #channel-header-container #meta ~ #buttons ytd-button-renderer button[aria-label="के सदस्य बनें."],
  232. #channel-header-container #meta ~ #buttons ytd-button-renderer button[aria-label="ৰ সদস্য হওক।"],
  233. #channel-header-container #meta ~ #buttons ytd-button-renderer button[aria-label="এ সাবস্ক্রাইব করুন।"],
  234. #channel-header-container #meta ~ #buttons ytd-button-renderer button[aria-label="ਨੂੰ ਸਬਸਕ੍ਰਾਈਬ ਕਰੋ।"],
  235. #channel-header-container #meta ~ #buttons ytd-button-renderer button[aria-label="પર સબ્સ્ક્રાઇબ કરો."],
  236. #channel-header-container #meta ~ #buttons ytd-button-renderer button[aria-label="ସବ୍‍ସ୍କ୍ରାଇବ୍‍ କରିବେ।"],
  237. #channel-header-container #meta ~ #buttons ytd-button-renderer button[aria-label="சேனலில் குழுசேர்க."],
  238. #channel-header-container #meta ~ #buttons ytd-button-renderer button[aria-label="సబ్‌స్క్రయిబ్ చేయండి."],
  239. #channel-header-container #meta ~ #buttons ytd-button-renderer button[aria-label="ಗೆ ಸಬ್‌ಸ್ಕ್ರೈಬ್ ಮಾಡಿ."],
  240. #channel-header-container #meta ~ #buttons ytd-button-renderer button[aria-label="എന്ന ചാനലിന്‍റെ വരിക്കാരാവുക."],
  241. #channel-header-container #meta ~ #buttons ytd-button-renderer button[aria-label="වෙත දායක වන්න."],
  242. #channel-header-container #meta ~ #buttons ytd-button-renderer button[aria-label="ຕິດຕາມ"],
  243. #channel-header-container #meta ~ #buttons ytd-button-renderer button[aria-label="တွင် စာရင်းသွင်းရန်။"],
  244. #channel-header-container #meta ~ #buttons ytd-button-renderer button[aria-label="გამოწერა."],
  245. #channel-header-container #meta ~ #buttons ytd-button-renderer button[aria-label="订阅"],
  246. #channel-header-container #meta ~ #buttons ytd-button-renderer button[aria-label="訂閱"],
  247. #channel-header-container #meta ~ #buttons ytd-button-renderer button[aria-label="ይመዝገቡ።"],
  248. #channel-header-container #meta ~ #buttons ytd-button-renderer button[aria-label="をチャンネル登録"],
  249. #channel-header-container #meta ~ #buttons ytd-button-renderer button[aria-label="을(를) 구독합니다."],
  250. #channel-header-container #meta ~ #buttons ytd-button-renderer button[aria-label="Tilaa"],
  251. #channel-header-container #meta ~ #buttons ytd-button-renderer button[aria-label="Subskrybuj kanał"] { border-color: var(--yt-spec-brand-button-background) !important; background: var(--yt-spec-brand-button-background) !important; color: #ffffff !important}
  252. div#notification-preference-button.style-scope.ytd-subscribe-button-renderer > ytd-subscription-notification-toggle-button-renderer-next.style-scope.ytd-subscribe-button-renderer > yt-button-shape > .yt-spec-button-shape-next--size-m > div.cbox.yt-spec-button-shape-next--button-text-content, div#notification-preference-button.style-scope.ytd-subscribe-button-renderer > ytd-subscription-notification-toggle-button-renderer-next.style-scope.ytd-subscribe-button-renderer > yt-button-shape > .yt-spec-button-shape-next--size-m > div.yt-spec-button-shape-next__secondary-icon, button.yt-spec-button-shape-next.yt-spec-button-shape-next--tonal.yt-spec-button-shape-next--mono.yt-spec-button-shape-next--size-m.yt-spec-button-shape-next--icon-leading-trailing > div.yt-spec-button-shape-next__button-text-content { display: none !important }
  253. #notification-preference-toggle-button:not([hidden]) + yt-animated-action #notification-preference-button.ytd-subscribe-button-renderer[invisible], #subscribe-button-shape.ytd-subscribe-button-renderer[invisible] { pointer-events: auto !important; visibility: visible !important; position: static !important }
  254. yt-smartimation.ytd-subscribe-button-renderer, .smartimation__content > __slot-el { display: flex !important }
  255. /*join/joined button */
  256. #sponsor-button ytd-button-renderer button.yt-spec-button-shape-next--mono.yt-spec-button-shape-next--tonal, #channel-header-container #meta ~ #buttons ytd-button-renderer button[aria-label="Join this channel"], button.yt-spec-button-shape-next.yt-spec-button-shape-next--outline.yt-spec-button-shape-next--mono.yt-spec-button-shape-next--size-m[aria-label="Join this channel"] { background: /*rgb(7,92,211,0.1)*/ transparent !important; color: var(--yt-spec-call-to-action) !important; border: 1px solid var(--yt-spec-call-to-action) !important; padding-left: 18px !important; padding-right: 18px !important }
  257. #channel-header-container #meta ~ #buttons ytd-button-renderer button[aria-label="Join this channel"], button.yt-spec-button-shape-next.yt-spec-button-shape-next--outline.yt-spec-button-shape-next--mono.yt-spec-button-shape-next--size-m[aria-label="Join this channel"] { padding-left: 18px !important; padding-right: 18px !important }
  258. div#sponsor-button.channel-action.style-scope.ytd-c4-tabbed-header-renderer { margin-left: 0px !important; margin-right: 8px !important }
  259.  
  260. .yt-spec-button-shape-next--size-m { border-radius: 2px !important }
  261.  
  262. ytd-watch-metadata ytd-video-owner-renderer #sponsor-button ytd-button-renderer a.yt-spec-button-shape-next--tonal,
  263. #channel-header-container #meta ~ #buttons #sponsor-button ytd-button-renderer a.yt-spec-button-shape-next--tonal
  264. { background: rgba(0,0,0,0.1) !important; color: #000 !important; border: none !important }
  265.  
  266. [dark] ytd-watch-metadata ytd-video-owner-renderer #sponsor-button ytd-button-renderer a.yt-spec-button-shape-next--tonal,
  267. [dark] #channel-header-container #meta ~ #buttons #sponsor-button ytd-button-renderer a.yt-spec-button-shape-next--tonal
  268. { background: rgba(255,255,255,0.1) !important; color: #aaa !important; border: none !important }
  269.  
  270. /**/
  271.  
  272. /**/
  273. ytd-watch-metadata .yt-spec-button-shape-next--mono.yt-spec-button-shape-next--tonal { background: transparent !important; color: var(--yt-spec-icon-inactive) !important }
  274. ytd-watch-metadata .yt-spec-button-shape-next--mono.yt-spec-button-shape-next--tonal:hover, #info .yt-spec-button-shape-next--mono.yt-spec-button-shape-next--tonal:hover { /*background: rgba(0,0,0,0.1) !important;*/ }
  275. [dark] ytd-watch-metadata .yt-spec-button-shape-next--mono.yt-spec-button-shape-next--tonal:hover, [dark] #info .yt-spec-button-shape-next--mono.yt-spec-button-shape-next--tonal:hover { /*background: rgba(255,255,255,0.1) !important;*/ }
  276. /**/
  277. ytd-watch-metadata ytd-menu-renderer button, ytd-button-renderer yt-button-shape button { border-radius: 0 !important }
  278. ytd-watch-metadata ytd-toggle-button-renderer tp-yt-paper-tooltip #tooltip, #info ytd-button-renderer tp-yt-paper-tooltip #tooltip { width: max-content }
  279. ytd-watch-metadata #top-level-buttons-computed  button { padding: 0 12px; text-transform: uppercase }
  280. ytd-watch-metadata #top-level-buttons-computed ytd-button-renderer button { padding: 0 8px; text-transform: uppercase }
  281. ytd-watch-metadata #top-level-buttons-computed > *:not(:first-child) { margin: 0 0 0 8px }
  282. ytd-watch-metadata #flexible-item-buttons > * { margin-left: 8px}
  283. ytd-watch-metadata #flexible-item-buttons  button { padding: 0 8px; text-transform: uppercase }
  284. ytd-segmented-like-dislike-button-renderer button { padding: 0 12px !important }
  285. ytd-watch-metadata ytd-menu-renderer > #button-shape { margin-left: 8px !important }
  286. .yt-spec-button-shape-next--call-to-action.yt-spec-button-shape-next--outline { height: 37px !important; padding: 0 11px 0 11px !important; background: transparent !important; border-color: var(--yt-spec-call-to-action) !important; border-radius: 2px !important; text-transform: uppercase !important; letter-spacing: 0.5px !important }
  287. .yt-spec-button-shape-next--call-to-action.yt-spec-button-shape-next--outline .yt-spec-button-shape-next__icon { margin-left: 0 !important; margin-right: 0 !important }
  288. .yt-spec-button-shape-next--call-to-action.yt-spec-button-shape-next--outline div.yt-spec-button-shape-next__button-text-content { height: 34px !important; margin-left: 8px !important }
  289. .yt-spec-button-shape-next--overlay.yt-spec-button-shape-next--outline { height: 37px !important; border-color: var(--yt-spec-call-to-action) !important; border-radius: 2px !important; text-transform: uppercase !important; letter-spacing: 0.5px !important }
  290. .yt-spec-button-shape-next--mono.yt-spec-button-shape-next--filled { height: 37px !important; color: #fff; background: var(--yt-spec-brand-button-background) !important; border-radius: 2px !important; text-transform: uppercase !important; letter-spacing: 0.5px !important }
  291. .yt-spec-button-shape-next--call-to-action.yt-spec-button-shape-next--filled { border-radius: 2px !important; text-transform: uppercase !important }
  292. .yt-spec-button-shape-next--size-s.yt-spec-button-shape-next--icon-button > div.yt-spec-button-shape-next__icon, .yt-spec-button-shape-next--size-s.yt-spec-button-shape-next--icon-button > div.yt-spec-button-shape-next__icon > yt-icon { width: 18px !important; height: 18px !important; color: var(--yt-spec-icon-inactive) !important }
  293. .yt-spec-button-shape-next--mono.yt-spec-button-shape-next--tonal { background: var(--yt-spec-badge-chip-background) !important; text-transform: uppercase !important }
  294. ytd-comments .yt-core-attributed-string--white-space-no-wrap, ytd-comments yt-dropdown-menu[modern-buttons] #label.yt-dropdown-menu, ytd-comments yt-dropdown-menu[modern-buttons] #icon-label.yt-dropdown-menu { letter-spacing: 0.5px !important; text-transform: uppercase !important }
  295. ytd-comments#comments #replies #expander .more-button button > .yt-spec-button-shape-next__button-text-content > span.yt-core-attributed-string.yt-core-attributed-string--white-space-no-wrap, ytd-comments#comments #replies #expander .less-button button > .yt-spec-button-shape-next__button-text-content > span.yt-core-attributed-string.yt-core-attributed-string--white-space-no-wrap { text-transform: none !important }
  296. #channel-name.ytd-video-owner-renderer { font-size: 1.4rem !important; line-height: 2rem !important }
  297. #info.ytd-video-primary-info-renderer { height: 40px !important }
  298. ytd-merch-shelf-renderer { background-color: transparent !important }
  299. div#clarify-box.attached-message.style-scope.ytd-watch-flexy, ytd-watch-metadata.watch-active-metadata.style-scope.ytd-watch-flexy.style-scope.ytd-watch-flexy { margin-top: 0px !important }
  300. ytd-clarification-renderer.style-scope.ytd-item-section-renderer, ytd-clarification-renderer.style-scope.ytd-watch-flexy { border: 1px solid !important; border-color: #0000001a !important; border-radius: 0px !important }
  301. yt-formatted-string.description.style-scope.ytd-clarification-renderer { font-size: 1.4rem !important }
  302. div.content-title.style-scope.ytd-clarification-renderer { padding-bottom: 4px !important }
  303. ytd-watch-flexy[rounded-player-large]:not([fullscreen]):not([theater]) #ytd-player.ytd-watch-flexy { border-radius: 0px !important }
  304. ytd-rich-metadata-renderer[rounded] { border-radius: 0px !important }
  305. ytd-live-chat-frame[rounded-container], ytd-live-chat-frame[rounded-container] #show-hide-button.ytd-live-chat-frame ytd-toggle-button-renderer.ytd-live-chat-frame, iframe.style-scope.ytd-live-chat-frame { border-radius: 0px !important }
  306. ytd-toggle-button-renderer.style-scope.ytd-live-chat-frame, yt-live-chat-header-renderer.style-scope.yt-live-chat-renderer { background: var(--yt-spec-brand-background-solid) !important }
  307. ytd-toggle-button-renderer.style-scope.ytd-live-chat-frame > a.yt-simple-endpoint.style-scope.ytd-toggle-button-renderer > tp-yt-paper-button.style-scope.ytd-toggle-button-renderer { padding-top: 4px !important; padding-bottom: 4px !important }
  308. ytd-live-chat-frame #show-hide-button.ytd-live-chat-frame>ytd-button-renderer.ytd-live-chat-frame { margin: 0 !important }
  309. ytd-live-chat-frame button { height: 31px !important }
  310. ytd-live-chat-frame .yt-spec-button-shape-next--size-m { color: var(--yt-live-chat-secondary-text-color) !important; font-size: 11px !important }
  311. ytd-playlist-panel-renderer[modern-panels]:not([within-miniplayer]) #container.ytd-playlist-panel-renderer, ytd-tvfilm-offer-module-renderer[modern-panels], ytd-donation-shelf-renderer.style-scope.ytd-watch-flexy, ytd-engagement-panel-section-list-renderer[modern-panels]:not([live-chat-engagement-panel]) { border-radius: 0px !important }
  312. ytd-playlist-panel-renderer[modern-panels]:not([hide-header-text]) .title.ytd-playlist-panel-renderer { font-family: Roboto !important; font-size: 1.4rem !important; line-height: 2rem !important; font-weight: 500 !important }
  313. ytd-tvfilm-offer-module-renderer[modern-panels] #header.ytd-tvfilm-offer-module-renderer, ytd-engagement-panel-title-header-renderer[modern-panels]:not([ads-semantic-text]) #title-text.ytd-engagement-panel-title-header-renderer { border-radius: 0px !important; font-family: Roboto !important; font-size: 1.6rem !important; line-height: 2.2rem !important; font-weight: 400 !important }
  314. ytd-donation-shelf-renderer[modern-panels] #header-text.ytd-donation-shelf-renderer { font-family: Roboto !important; font-size: 1.6rem !important; font-weight: 500 !important }
  315. ytd-universal-watch-card-renderer[rounded] #header.ytd-universal-watch-card-renderer, ytd-universal-watch-card-renderer[rounded] #hero.ytd-universal-watch-card-renderer { border-radius: 0px !important }
  316. ytd-video-view-count-renderer { font-size: 1.4rem !important }
  317. #upload-info.ytd-video-owner-renderer { margin-left: 4px !important }
  318. ytd-text-inline-expander.style-scope.ytd-watch-metadata { margin-left: 64px !important }
  319. div#actions.item.style-scope.ytd-watch-metadata { height: 40px !important }
  320. ytd-segmented-like-dislike-button-renderer { height: 36px !important }
  321. /* Remove rounded corners from the video player (Thanks to oldbutgoldyt for the code) */
  322. .ytp-ad-player-overlay-flyout-cta-rounded { border-radius: 2px !important }
  323. .ytp-flyout-cta .ytp-flyout-cta-action-button.ytp-flyout-cta-action-button-rounded { font-family: Arial !important; background: #167ac6 !important; border: solid 1px transparent !important; border-color: #167ac6 !important; border-radius: 2px !important; box-shadow: 0 1px 0 rgba(0,0,0,.05) !important; font-size: 11px !important; font-weight: 500 !important; height: 28px !important; margin: 0 8px 0 0 !important; max-width: 140px !important; padding: 0 10px !important }
  324. .ytp-ad-action-interstitial-action-button.ytp-ad-action-interstitial-action-button-rounded { background-color: #167ac6 !important; border: none !important; border-radius: 2px; font-family: Roboto !important; font-size: 23px !important; height: 46px !important; line-height: 46px !important; min-width: 164px !important; padding: 0 20px !important }
  325. .ytp-settings-menu { border-radius: 2px !important }
  326. .ytp-sb-subscribe { border-radius: 2px !important; background-color: #f00 !important; color: #fff !important; text-transform: uppercase !important }
  327. .ytp-sb-unsubscribe { border-radius: 2px !important; background-color: #eee !important; color: #606060 !important; text-transform: uppercase !important }
  328. .ytp-sb-subscribe.ytp-sb-disabled { background-color: #f3908b !important }
  329. .branding-context-container-inner.ytp-rounded-branding-context { border-radius: 2px !important }
  330. .ytp-tooltip.ytp-rounded-tooltip:not(.ytp-preview) .ytp-tooltip-text { border-radius: 2px !important }
  331. .ytp-autonav-endscreen-upnext-button.ytp-autonav-endscreen-upnext-button-rounded { border-radius: 2px !important }
  332. .ytp-ad-overlay-container.ytp-rounded-overlay-ad .ytp-ad-overlay-image img, .ytp-ad-overlay-container.ytp-rounded-overlay-ad .ytp-ad-text-overlay, .ytp-ad-overlay-container.ytp-rounded-overlay-ad .ytp-ad-enhanced-overlay { border-radius: 0 !important }
  333. .ytp-videowall-still-image { border-radius: 0 !important }
  334. div.iv-card.iv-card-video.ytp-rounded-info { border-radius: 0 !important }
  335. div.iv-card.iv-card-playlist.ytp-rounded-info { border-radius: 0 !important }
  336. div.iv-card.iv-card-channel.ytp-rounded-info { border-radius: 0 !important }
  337. div.iv-card.ytp-rounded-info { border-radius: 0 !important }
  338. .ytp-tooltip.ytp-rounded-tooltip.ytp-text-detail.ytp-preview, .ytp-tooltip.ytp-rounded-tooltip.ytp-text-detail.ytp-preview .ytp-tooltip-bg { border-radius: 2px !important }
  339. .ytp-ce-video.ytp-ce-medium-round, .ytp-ce-playlist.ytp-ce-medium-round, .ytp-ce-medium-round .ytp-ce-expanding-overlay-background { border-radius: 0 !important }
  340. .ytp-autonav-endscreen-upnext-thumbnail { border-radius: 0 !important }
  341. @font-face { font-family: no-parens; src: url("data:application/x-font-woff;base64,d09GRk9UVE8AABuoAAoAAAAASrAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAABDRkYgAAANJAAADlwAABk8NN4INERTSUcAABugAAAACAAAAAgAAAABT1MvMgAAAVAAAABRAAAAYABfsZtjbWFwAAAEQAAACM0AABnoJENu0WhlYWQAAAD0AAAAMwAAADYFl9tDaGhlYQAAASgAAAAeAAAAJAdaA+9obXR4AAAbgAAAAB8AABAGA+gAfG1heHAAAAFIAAAABgAAAAYIAVAAbmFtZQAAAaQAAAKbAAAF6yBNB5Jwb3N0AAANEAAAABMAAAAg/7gAMnjaY2BkYGBg5G6tPXx8azy/zVcGZuYXQBGGiz6un+F0zf8O5hzmAiCXmYEJJAoAkoQNcAB42mNgZGBgLvjfASRfMNQw1DDnMABFUAATAHAaBFEAAAAAUAAIAQAAeNpjYGZ+wTiBgZWBgamLKYKBgcEbQjPGMRgx3GFAAt//r/v/+/7///wPGOxBfEcXJ38GBwaG//+ZC/53MDAwFzBUJOgz/kfSosDAAAAMpBWaAAAAeNqdU9tu00AQPU6TcqmoRIV46YvFE5Vgm7ZOVDVPSS8iIkqquBTxhJzEuSiOHWwnwH8g/oHfgW9A/AZnx5smQZWg2MrumZ0z47MzEwCP8R0W9GNhS1b95HCPVoY3sIsdg/MrnAJO8NLgTTzEgEwr/4DWF3ww2MJTq2BwDtvWrsEbKFt7BudXOAWk1nuDN/HE+mHwfTjWL4O34OQWeR7lvuZaBm/Dyf+s9qKOb9cCLxy3/cEs8OIDVXRKlepZrVURp/hot2rn136cjKLQziiXrgHDKO1G4Vxb6viwMvHGfpT2VTDqHKqSKh85xfIyE04RYYrPiDFiCYZIYeMbf4co4gBHeHGDS0RV9MjvwCd2GZWQ72PC3UYdIbr0xsynV098PXqeS96U5yfY5/tRXkXGIpuSyAl9e8SrX6khIC/EGG3aA8zEjqlHUZVDVRXyz8hrCVpELuMyf4sn57imJ6baEVkhs69mueSN1k+GZKWiLMT8xqdwzIpUqNZjdl84fZ4GzNqhRzFWoczaOWSXb9X0P3X89xqmzDjlyT6uGDWSrBdyi1S+F1FvymhdR60gY2j9XdohraxvM+KeVMwmf2jU1tHg3pIvhGuZG2sZ9OTcVm/9s++krCd7KjPaoarFXGU5PVmfsaauVM8l1nNTFa2u6HhLdIVXVP2Gu7arnKc21ybtOifDlTu1uZ5yb3Ji6uLROPNdyPw38Y77a3o0R+f2qSqrTizWJ1ZGq09EeySnI/ZlKhXWypXc1Zcb3r2uNmsUrfUkkZguWX1h2mbO9L/F45r1YioKJ1LLRUcSU7+e6f9E7qInbukfEM0lNuSpzmpzviLmjmVGMk26c5miv3VV/THJCRXrzk55ltCrtQXc9R0H9OvKN34D31P2fwB42i3YLfAsS2GG8X9Pf3dP97QjqOBAUAUOHDhwxAUHLnHgwIEDBw4cOHDgEgeOuIsjLnHgAMU1tw7PnvNs1fT7zlfV7q9rd2bn7e0tv729RZYvsySWb76Ft9fr82wN77fHt/F+e3m73+8J74/8zPsxvdbqu3fvXjsYg2e/P/LTP33f367PfMj67sPZjXjsh/iU/V+If7W/Tvms/XPEF+xfJL5kf73lr9i/SnzN/nXiG/Z/I/7d/k3iW/ZvE/9h/0/iO/bvEt+zf5/4gf2HxI/sPyZ+Yn99xJ/Zf078wv5L4lf2XxO/sf+W+C/7fxO/s/+e+IP9f4iP7H8k/mT/f+LP9r8Qf7X/jfiH/WPik48+9E/Y8e4Tpvjv72cl6B/wD/oH/IP+Af+gf8A/6B/wD/oH/IP+Af+gf8A/6B/wD/oH/IP+Af+gf8A/6B/wD/oH/IP+Af+gf8A/6B/wD/oH/IP+Af+gf8A/6B/wD/oH/IP+Af+gf8A/6B/wD/oH/IP+4X8Z/8/OXATnIjAXwbkIkAfnIjAX4eVPv15fA/0v/C/9L/wv/S/8L/1fX5lL/wv/S/8L/0v/C/9L/wv/S/8L/0v/C/9L/wv/S/8L/0v/C/9L/wv/S/8L/0v/C/9L/wv/S/8L/0v/C/9L/wv/S/8L/0v/C/9L/wv/S/8L/0v/C/9L/wv/S/8L/0v/C/9L/wv/S/8L/0v/C/9L/9cvXNQ/4h/1j/hH/SP+Uf+If9Q/4h/1j/hH/SP+Uf+If9Q/4h/1j/hH/SP+Uf+If9Q/4h/1j/hH/SP+Uf+If9Q/4h/1j/hH/SP+Uf+If9Q/4h/1j/hH/SP+Uf+If9Q/4h/1j/hH/SP+Uf+If9Q/4h/1j/hH/SP+Uf/XlSXpn/BP+if8k/4J/6R/wj/pn/BP+if8k/4J/6R/wj/pn/BP+if8k/4J/6R/wj/pn/BP+if8k/4J/6R/wj/pn/BP+if8k/4J/6R/wj/pn/BP+if8k/4J/6R/wj/pn/BP+if8k/4J/6R/wj/pn/BP+if8k/4J/6T/6yqf9c/4Z/0z/ln/jH/WP+Of9c/4Z/0z/ln/jH/WP+Of9c/4Z/0z/ln/jH/WP+Of9c/4Z/0z/ln/jH/WP+Of9c/4Z/0z/ln/jH/WP+Of9c/4Z/0z/ln/jH/WP+Of9c/4Z/0z/ln/jH/WP+Of9c/4Z/0z/ln/jH/WvzAW/Qv+Rf+Cf9G/4F/0L/gX/Qv+Rf+Cf9G/4F/0L/gX/Qv+Rf+Cf9G/4F/0L/gX/Qv+Rf+Cf9G/4F/0L/gX/Qv+Rf+Cf9G/4F/0L/gX/Qv+Rf+Cf9G/4F/0L/gX/Qv+Rf+Cf9G/4F/0L/gX/Qv+Rf+Cf9G/4F/0r6/bT/0r/lX/in/Vv+Jf9a/4V/0r/lX/in/Vv+Jf9a/4V/0r/lX/in/Vv+Jf9a/4V/0r/lX/in/Vv+Jf9a/4V/0r/lX/in/Vv+Jf9a/4V/0r/lX/in/Vv+Jf9a/4V/0r/lX/in/Vv+Jf9a/4V/0r/lX/in/Vv378uuX/4P+65W/6N1aa/g3/pn/Dv+nf8G/6N/yb/g3/pn/Dv+nf8G/6N/yb/g3/pn/Dv+nf8G/6N/yb/g3/pn/Dv+nf8G/6N/yb/g3/pn/Dv+nf8G/6N/yb/g3/pn/Dv+nf8G/6N/yb/g3/pn/Dv+nf8G/6N/yb/g3/pn/Dv+nfGbv+Hf+uf8e/69/x7/p3/Lv+Hf+uf8e/69/x7/p3/Lv+Hf+uf8e/69/x7/p3/Lv+Hf+uf8e/69/x7/p3/Lv+Hf+uf8e/69/x7/p3/Lv+Hf+uf8e/69/x7/p3/Lv+Hf+uf8e/69/x7/p3/Lv+Hf+uf8e/69/x7/q//kEP/Qf+Q/+B/9B/4D/0H/gP/Qf+Q/+B/9B/4D/0H/gP/Qf+Q/+B/9B/4D/0H/gP/Qf+Q/+B/9B/4D/0H/gP/Qf+Q/+B/9B/4D/0H/gP/Qf+Q/+B/9B/4D/0H/gP/Qf+Q/+B/9B/4D/0H/gP/Qf+Q/+B/9B/4D/0n4xT/4n/1H/iP/Wf+E/9J/5T/4n/1H/iP/Wf+E/9J/5T/4n/1H/iP/Wf+E/9J/5T/4n/1H/iP/Wf+E/9J/5T/4n/1H/iP/Wf+E/9J/5T/4n/1H/iP/Wf+E/9J/5T/4n/1H/iP/Wf+E/9J/5T/4n/1H/iP/Wf+E/9X8+Dbv1v/G/9b/xv/W/8b/1v/G/9b/xv/W/8b/1v/G/9b/xv/W/8b/1v/G/9b/xv/W/8b/1v/G/9b/xv/W/8b/1v/G/9b/xv/W/8b/1v/G/9b/xv/W/8b/1v/G/9b/xv/W/8b/1v/G/9b/xv/W/8b/1v/G/9b/xv/W/8b/1v/G/9F+PSf+G/9F/4L/0X/kv/hf/Sf+G/9F/4L/0X/kv/hf/Sf+G/9F/4L/0X/kv/hf/Sf+G/9F/4L/0X/kv/hf/Sf+G/9F/4L/0X/kv/hf/Sf+G/9F/4L/0X/kv/hf/Sf+G/9F/4L/0X/kv/hf/Sf+G/9F/4L/0X/kv/zbj13/hv/Tf+W/+N/9Z/47/13/hv/Tf+W/+N/9Z/47/13/hv/Tf+W/+N/9Z/47/13/hv/Tf+W/+N/9Z/47/13/hv/Tf+W/+N/9Z/47/13/hv/Tf+W/+N/9Z/47/13/hv/Tf+W/+N/9Z/47/13/hv/Tf+W/+N/9b/eT1y1v/B/9H/wf/R/8H/0f/B/9H/wf/R/8H/0f/B/9H/wf/R/8H/0f/B/9H/wf/R/8H/0f/B/9H/wf/R/8H/0f/B/9H/wf/R/8H/0f/B/9H/wf/R/8H/0f/B/9H/wf/R/8H/0f/B/9H/wf/R/8H/0f/B/9H/wf/R/8H/0f/5+PWY/4P/6zH/0f/gf/Q/7Dj6H/yP/gf/o//B/+h/8D/6H/yP/gf/o//B/+h/8D/6H/yP/gf/o//B/+h/8D/6H/yP/gf/o//B/+h/8D/6H/yP/gf/o//B/+h/8D/6H/yP/gf/o//B/+h/8D/6H/yP/gf/o//B/+h/8D/6H/zPB/9/AsqUaXgAAAB42mNgZgCD/1sZjBiwAAAswgHqAHja7ZhVc5BNkIWn/QWCEzRAcHd3d3eX4J4Awd0luLu7e3B3d3d3h4RgC99e7I9YnoupOjXdXaempqamGxyjA4AoxVoENmtZvENAp/Z/ZdbwROF+IT5JwhNDeBIM+e4T4SJYkiTkJj5J/TzwSR5WK3pYs5hh9X1S+SVI6pPSCYBGqx0Q9F+Zci1adgpuG9yrRGBQry5tW7cJ9s+eNVuOjH/XXP7/RfjX6NU1uGXHrv7lOjUP7BIU2CUguGUL/7RtgoOD8mfJ0qNHj8wBf8MyNw/smCVd5v9N+c/c/9nMlD1rznzO/XFvv8mBc84DD/5IV8FVdJVcZVfFVXXVXHVXw9V0tVxtV8fVdfVcfdfANXSNXGPXxDV1Aa6Za+5auJaulWvt2ri2rp1r7zq4jq6TC3RBrrPr4rq6YNfNdXc9XE/Xy/V2fVxf18/1dwPcQDfIDXZD3FA3zA13I9xIN8qNdiFujBvrxrnxboKb6Ca5yW6Km+qmueluhpvpZrnZbo6b6+a5+W6BW+gWucVuiVvqlrnlboVb6Va51W6NW+vWufVug9voNrnNbovb6ra5ULfd7XA73S632+1xe90+t98dcAfdIXfYHXFH3TF33J1wJ90pd9qdcWfdOXfeXXAX3SV32V1xV901d93dcDfdLXfb3XF33T133z1wD90j99g9cU/dM/fcvXAv3Sv32r1xb9079959cB/dJ/fZfXFfXZgLd99chPvufrif7pf7DX+vCgIBg4CC/Tn/SBAZooAPRIVoEB1iQEyIBbEhDvhCXIgH8SEBJIRE4AeJIQkkBX9IBskhBaSEVJAa0kBaSAfpIQNkhEyQGbJAVsgG2SEH5IRckBvyQF7IB/mhABSEQlAYikBRKAbFoQSUhFJQGspAWSgH5aECVIRKUBmqQFWoBtWhBtSEWlAb6kBdqAf1oQE0hEbQGJpAUwiAZtAcWkBLaAWtoQ20hXbQHjpAR+gEgRAEnaELdIVg6AbdoQf0hF7QG/pAX+gH/WEADIRBMBiGwFAYBsNhBIyEUTAaQmAMjIVxMB4mwESYBJNhCkyFaTAdZsBMmAWzYQ7MhXkwHxbAQlgEi2EJLIVlsBxWwEpYBathDayFdbAeNsBG2ASbYQtshW0QCtthB+yEXbAb9sBe2Af74QAchENwGI7AUTgGx+EEnIRTcBrOwFk4B+fhAlyES3AZrsBVuAbX4QbchFtwG+7AXbgH9+EBPIRH8BiewFN4Bs/hBbyEV/Aa3sBbeAfv4QN8hE/wGb7AVwiDcPgGEfAdfsBP+AW/0SEgIiGjoKKhh5EwMkZBH4yK0TA6xsCYGAtjYxz0xbgYD+NjAkyIidAPE2MSTIr+mAyTYwpMiakwNabBtJgO02MGzIiZMDNmwayYDbNjDsyJuTA35sG8mA/zYwEsiIWwMBbBolgMi2MJLImlsDSWwbJYDstjBayIlbAyVsGqWA2rYw2sibWwNtbBulgP62MDbIiNsDE2waYYgM2wObbAltgKW2MbbIvtsD12wI7YCQMxCDtjF+yKwdgNu2MP7Im9sDf2wb7YD/vjAByIg3AwDsGhOAyH4wgciaNwNIbgGByL43A8TsCJOAkn4xScitNwOs7AmTgLZ+McnIvzcD4uwIW4CBfjElyKy3A5rsCVuApX4xpci+twPW7AjbgJN+MW3IrbMBS34w7cibtwN+7BvbgP9+MBPIiH8DAewaN4DI/jCTyJp/A0nsGzeA7P4wW8iJfwMl7Bq3gNr+MNvIm38Dbewbt4D+/jA3yIj/AxPsGn+Ayf4wt8ia/wNb7Bt/gO3+MH/Iif8DN+wa8YhuH4DSPwO/7An/gL/zy7BIRExCSkZORRJIpMUciHolI0ik4xKCbFotgUh3wpLsWj+JSAElIi8qPElISSkj8lo+SUglJSKkpNaSgtpaP0lIEyUibKTFkoK2Wj7JSDclIuyk15KC/lo/xUgApSISpMRagoFaPiVIJKUikqTWWoLJWj8lSBKlIlqkxVqCpVo+pUg2pSLapNdagu1aP61IAaUiNqTE2oKQVQM2pOLagltaLW1IbaUjtqTx2oI3WiQAqiztSFulIwdaPu1IN6Ui/qTX2oL/Wj/jSABtIgGkxDaCgNo+E0gkbSKBpNITSGxtI4Gk8TaCJNosk0habSNJpOM2gmzaLZNIfm0jyaTwtoIS2ixbSEltIyWk4raCWtotW0htbSOlpPG2gjbaLNtIW20jYKpe20g3bSLtpNe2gv7aP9dIAO0iE6TEfoKB2j43SCTtIpOk1n6Cydo/N0gS7SJbpMV+gqXaPrdINu0i26TXfoLt2j+/SAHtIjekxP6Ck9o+f0gl7SK3pNb+gtvaP39IE+0if6TF/oK4VROH2jCPpOP+gn/aLf7BgYmZhZWNnY40gcmaOwD0flaBydY3BMjsWxOQ77clyOx/E5ASfkROzHiTkJJ2V/TsbJOQWn5FScmtNwWk7H6TkDZ+RMnJmzcFbOxtk5B+fkXJyb83Bezsf5uQAX5EJcmItwUS7GxbkEl+RSXJrLcFkux+W5AlfkSlyZq3BVrsbVuQbX5Fpcm+twXa7H9bkBN+RG3JibcFMO4GbcnFtwS27FrbkNt+V23J47cEfuxIEcxJ25C3flYO7G3bkH9+Re3Jv7cF/ux/15AA/kQTyYh/BQHsbDeQSP5FE8mkN4DI/lcTyeJ/BEnsSTeQpP5Wk8nWfwTJ7Fs3kOz+V5PJ8X8EJexIt5CS/lZbycV/BKXsWreQ2v5XW8njfwRt7Em3kLb+VtHMrbeQfv5F28m/fwXt7H+/kAH+RDfJiP8FE+xsf5BJ/kU3yaz/BZPsfn+QJf5Et8ma/wVb7G1/kG3+RbfJvv8F2+x/f5AT/kR/yYn/BTfsbP+QW/5Ff8mt/wW37H7/kDf+RP/Jm/8FcO43D+xhH8nX/wT/7Fv+XPt09QSFhEVEw8iSSRJYr4SFSJJtElhsSUWBJb4oivxJV4El8SSEJJJH6SWJJIUvGXZJJcUkhKSSWpJY2klXSSXjJIRskkmSWLZJVskl1ySE7JJbklj+SVfJJfCkhBKSSFpYgUlWJSXEpISSklpaWMlJVyUl4qSEWpJJWlilSValJdakhNqSW1pY7UlXpSXxpIQ2kkjaWJNJUAaSbNpYW0lFbSWtpIW2kn7aWDdJROEihB0lm6SFcJlm7SXXpIT+klvaWP9JV+0l8GyEAZJINliAyVYTJcRshIGSWjJUTGyFgZJ+NlgkyUSTJZpshUmSbTZYbMlFkyW+bIXJkn82WBLJRFsliWyFJZJstlhayUVbJa1shaWSfrZYNslE2yWbbIVtkmobJddshO2SW7ZY/slX2yXw7IQTkkh+WIHJVjclxOyEk5JafljJyVc3JeLshFuSSX5YpclWtyXW7ITbklt+WO3JV7cl8eyEN5JI/liTyVZ/JcXshLeSWv5Y28lXfyXj7IR/kkn+WLfJUwCZdvEiHf5Yf8lF/yW52CopKyiqqaehpJI2sU9dGoGk2jawyNqbE0tsZRX42r8TS+JtCEmkj9NLEm0aTqr8k0uabQlJpKU2saTavpNL1m0IyaSTNrFs2q2TS75tCcmktzax7Nq/k0vxbQglpIC2sRLarFtLiW0JJaSktrGS2r5bS8VtCKWkkraxWtqtW0utbQmlpLa2sdrav1tL420IbaSBtrE22qAdpMm2sLbamttLW20bbaTttrB+2onTRQg7SzdtGuGqzdtLv20J7aS3trH+2r/bS/DtCBOkgH6xAdqsN0uI7QkTpKR2uIjtGxOk7H6wSdqJN0sk7RqTpNp+sMnamzdLbO0bk6T+frAl2oi3SxLtGlukyX6wpdqat0ta7RtbpO1+sG3aibdLNu0a26TUN1u+7QnbpLd+se3av7dL8e0IN6SA/rET2qx/S4ntCTekpP6xk9q+f0vF7Qi3pJL+sVvarX9Lre0Jt6S2/rHb2r9/S+PtCH+kgf6xN9qs/0ub7Ql/pKX+sbfavv9L1+0I/6ST/rF/2qYRqu3zRCv+sP/am/9Lc5A0MjYxNTM/MskkW2KOZjUS2aRbcYFtNiWWyLY74W1+JZfEtgCS2R+VliS2JJzd+SWXJLYSktlaW2NJbW0ll6y2AZLZNltiyW1bJZdsthOS2X5bY8ltfyWX4rYAWtkBW2IlbUillxK2ElrZSVtjJW1spZeatgFa2SVbYqVtWqWXWrYTWtltW2OlbX6ll9a2ANrZE1tibW1AKsmTW3FtbSWllra2NtrZ21tw7W0TpZoAVZZ+tiXS3Yull362E9rZf1tj7W1/pZfxtgA22QDbYhNtSG2XAbYSNtlI22EBtjY22cjbcJNtEm2WSbYlNtmk23GTbTZtlsm2NzbZ7NtwW20BbZYltiS22ZLbcVttJW2WpbY2ttna23DbbRNtlm22JbbZuF2nbbYTttl+22PbbX9tl+O2AH7ZAdtiN21I7ZcTthJ+2UnbYzdtbO2Xm7YBftkl22K3bVrtl1u2E37Zbdtjt21+7ZfXtgD+2RPbYn9tSe2XN7YS/tlb22N/bW3tl7+2Af7ZN9ti/21cIs3L5ZhH23H/bTftlv72/LjR557ImnnnmeF8mL7EXxfLyoXjQvuhfDi+nF8mJ7cTxfL64Xz4vvJfASeok8Py+xl8RL6vl7ybzkXgovpZfKS+2l8dJ66bz0XgYvo5fJy+xl8bJ62bzsXg4vp5fLy+3l8fJ6+bz8XgGvoFfIK+wV8Yp6xbziXgmvpFfKK+2V8cp65bzyXgX/7z6hESlDISxG6LeMoRQWI4J9f/X9NjSir/2s+yuN77eLFnbkRw5ZtsH3+5HwPBL+VZc18/150f6oHBLUyvfPbh758VWj/eMf//jHP/7xj/9//B1wRw5P6pN6ll+CTLG+jwvxk9IhuifynigRz3z/B+I69cx42u3BAQ0AAAgDoG/WNvBjGERgmg0AAADwwAGHXgFoAAAAAAEAAAAA"); unicode-range: U+0028, U+0029 }
  342. span.ytp-menu-label-secondary { font-family: "no-parens", "Roboto", sans-serif }
  343. .ytp-swatch-color-white { color: #f00 !important }
  344. .iv-card { border-radius: 0 !important }
  345. .iv-branding .branding-context-container-inner { border-radius: 2px !important }
  346. .ytp-offline-slate-bar { border-radius: 2px !important }
  347. .ytp-offline-slate-button { border-radius: 2px !important }
  348. .ytp-ce-video.ytp-ce-large-round, .ytp-ce-playlist.ytp-ce-large-round, .ytp-ce-large-round .ytp-ce-expanding-overlay-background { border-radius: 0 !important }
  349. .ytp-flyout-cta .ytp-flyout-cta-icon.ytp-flyout-cta-icon-rounded { border-radius: 0 !important }
  350. .ytp-player-minimized .html5-main-video, .ytp-player-minimized .ytp-miniplayer-scrim, .ytp-player-minimized.html5-video-player { border-radius: 0 !important }
  351. ytd-miniplayer #player-container.ytd-miniplayer, ytd-miniplayer #video-container.ytd-miniplayer .video.ytd-miniplayer, ytd-miniplayer #card.ytd-miniplayer, ytd-miniplayer { border-radius: 0 !important }
  352. ytd-channel-video-player-renderer[rounded] #player.ytd-channel-video-player-renderer { border-radius: 0 !important }
  353. .ytp-tooltip.ytp-rounded-tooltip.ytp-preview:not(.ytp-text-detail), .ytp-tooltip.ytp-rounded-tooltip.ytp-preview:not(.ytp-text-detail) .ytp-tooltip-bg { border-radius: 2px !important }
  354. #movie_player > div.ytp-promotooltip-wrapper > div.ytp-promotooltip-container { border-radius: 2px !important }
  355. .ytp-fine-scrubbing-container { display: none !important }
  356. .ytp-progress-bar, .ytp-heat-map-container, .ytp-fine-scrubbing-container { transform: translateY(0) !important }
  357. .ytp-chrome-bottom { height: auto !important }
  358. .ytp-tooltip-edu { display: none !important }
  359. /* Old compact channel header UI and non-amsterdam playlists */
  360. #buttons.ytd-c4-tabbed-header-renderer { flex-direction: row-reverse !important }
  361. ytd-channel-tagline-renderer { display: block !important; padding: 0 !important }
  362. #content.ytd-channel-tagline-renderer::before { content: "More about this channel"; font-weight: 500 !important }
  363. #content.ytd-channel-tagline-renderer { max-width: 162px !important }
  364. #avatar.ytd-c4-tabbed-header-renderer { width: 80px !important; height: 80px !important; margin: 0 24px 0 0 !important; flex: none !important; overflow: hidden !important }
  365. .yt-spec-avatar-shape__button--button-giant, .yt-spec-avatar-shape--avatar-size-giant { width: 128px !important; height: 128px !important }
  366. #avatar-editor.ytd-c4-tabbed-header-renderer { --ytd-channel-avatar-editor-size: 80px !important }
  367. #channel-name.ytd-c4-tabbed-header-renderer { margin-bottom: 0 !important }
  368. #channel-header-container.ytd-c4-tabbed-header-renderer { padding-top: 0 !important; align-items: center !important }
  369. #inner-header-container.ytd-c4-tabbed-header-renderer { margin-top: 0 !important; align-items: center !important }
  370. yt-formatted-string#channel-handle.style-scope.ytd-c4-tabbed-header-renderer, yt-formatted-string#channel-pronouns.style-scope.ytd-c4-tabbed-header-renderer, #videos-count { display: none !important }
  371. .meta-item.ytd-c4-tabbed-header-renderer { display: block !important }
  372. div#channel-header-links.style-scope.ytd-c4-tabbed-header-renderer, .page-header-view-model-wiz__page-header-attribution { display: none !important }
  373. ytd-c4-tabbed-header-renderer[use-page-header-style] #channel-name.ytd-c4-tabbed-header-renderer, [page-subtype="channels"] .page-header-view-model-wiz__page-header-title--page-header-title-large { font-size: 2.4em !important; font-weight: 400 !important; line-height: var(--yt-channel-title-line-height, 3rem) !important }
  374. span.delimiter.style-scope.ytd-c4-tabbed-header-renderer, .yt-content-metadata-view-model-wiz__delimiter { display: none !important }
  375. div#meta.style-scope.ytd-c4-tabbed-header-renderer { width: auto !important }
  376. ytd-c4-tabbed-header-renderer[use-page-header-style] #inner-header-container.ytd-c4-tabbed-header-renderer { flex-direction: row !important }
  377. div.page-header-banner.style-scope.ytd-c4-tabbed-header-renderer { margin-left: 0px !important; margin-right: 8px !important; border-radius: 0px !important }
  378. [has-inset-banner] #page-header-banner.ytd-tabbed-page-header { padding-left: 0 !important; padding-right: 0 !important }
  379. ytd-c4-tabbed-header-renderer[use-page-header-style] .page-header-banner.ytd-c4-tabbed-header-renderer, .yt-image-banner-view-model-wiz--inset { border-radius: 0px !important }
  380. ytd-browse[darker-dark-theme][page-subtype="playlist"], ytd-browse[darker-dark-theme][page-subtype="show"] { background-color: var(--yt-spec-general-background-b) !important; padding-top: 0 !important }
  381. ytd-two-column-browse-results-renderer.ytd-browse[background-refresh] { background-color: var(--yt-spec-general-background-b) !important }
  382. .yt-sans-20.yt-dynamic-sizing-formatted-string, .yt-sans-22.yt-dynamic-sizing-formatted-string, .yt-sans-24.yt-dynamic-sizing-formatted-string, .yt-sans-28.yt-dynamic-sizing-formatted-string, yt-text-input-form-field-renderer[component-style="INLINE_FORM_STYLE_TITLE"][amsterdam] tp-yt-paper-input.yt-text-input-form-field-renderer .input-content.tp-yt-paper-input-container > input { font-family: "Roboto", "Arial", sans-serif !important; font-size: 2.4rem !important; line-height: 3.2rem !important; font-weight: 400 !important }
  383. ytd-browse[page-subtype=playlist][amsterdam] { padding-top: 0 !important }
  384. ytd-browse[page-subtype=playlist] ytd-playlist-header-renderer.ytd-browse, ytd-browse[page-subtype=playlist] .page-header-sidebar.ytd-browse, ytd-browse[has-page-header-sidebar] ytd-playlist-header-renderer.ytd-browse, ytd-browse[has-page-header-sidebar] .page-header-sidebar.ytd-browse { margin-left: 0 !important; height: calc(100vh - var(--ytd-toolbar-height)) !important }
  385. .immersive-header-container.ytd-playlist-header-renderer { margin-bottom: 0 !important; border-radius: 0 !important }
  386. .image-wrapper.ytd-hero-playlist-thumbnail-renderer { border-radius: 0 !important }
  387. ytd-playlist-header-renderer, yt-formatted-string[has-link-only_]:not([force-default-style]) a.yt-simple-endpoint.yt-formatted-string:visited, .metadata-stats.ytd-playlist-byline-renderer, .yt-spec-button-shape-next--overlay.yt-spec-button-shape-next--text, ytd-text-inline-expander.ytd-playlist-header-renderer { color: var(--yt-spec-text-primary) !important; --ytd-text-inline-expander-button-color: var(--yt-spec-text-primary) !important }
  388. ytd-dropdown-renderer[no-underline] tp-yt-paper-dropdown-menu-light .tp-yt-paper-dropdown-menu-light[style-target=input], tp-yt-iron-icon.tp-yt-paper-dropdown-menu-light { color: var(--yt-spec-text-primary) !important }
  389. .yt-spec-button-shape-next--overlay.yt-spec-button-shape-next--tonal, .yt-spec-button-shape-next--overlay.yt-spec-button-shape-next--filled { background: transparent !important; color: var(--yt-spec-text-primary) !important; border-radius: 2px !important; text-transform: uppercase }
  390. .metadata-text-wrapper.ytd-playlist-header-renderer { --yt-endpoint-color: var(--yt-spec-text-primary) !important; --yt-endpoint-hover-color: var(--yt-spec-text-primary) !important }
  391. div.immersive-header-background-wrapper.style-scope.ytd-playlist-header-renderer > div { background: var(--yt-spec-general-background-a) !important }
  392. #contents > ytd-playlist-video-list-renderer { background: var(--yt-spec-general-background-b) !important; margin-right: 0px !important }
  393. ytd-browse[page-subtype=playlist] ytd-two-column-browse-results-renderer.ytd-browse, ytd-browse[has-page-header-sidebar] ytd-two-column-browse-results-renderer.ytd-browse, ytd-browse[page-subtype=playlist][amsterdam] #alerts.ytd-browse { padding-left: 360px !important; padding-right: 0px !important; margin-bottom: 0 !important }
  394. ytd-alert-with-button-renderer[type=INFO], ytd-alert-with-button-renderer[type=SUCCESS] { background: var(--yt-spec-general-background-a) !important }
  395. ytd-item-section-renderer.style-scope.ytd-section-list-renderer[page-subtype="playlist"] > #header.ytd-item-section-renderer > ytd-feed-filter-chip-bar-renderer { display: none !important }
  396. .yt-spec-button-shape-next--overlay.yt-spec-button-shape-next--tonal { background: var(--yt-spec-base-background) }
  397. iron-input.tp-yt-paper-input > input.tp-yt-paper-input, textarea.tp-yt-iron-autogrow-textarea { color: var(--yt-spec-text-primary) !important }
  398. #labelAndInputContainer.tp-yt-paper-input-container > label, #labelAndInputContainer.tp-yt-paper-input-container > .paper-input-label { color: var(--yt-spec-text-secondary) }
  399. .unfocused-line.tp-yt-paper-input-container, .focused-line.tp-yt-paper-input-container { border-bottom-color: var(--yt-spec-text-primary) !important }
  400. [page-subtype="history"] #page-header.ytd-tabbed-page-header { background-color: var(--yt-spec-general-background-a) !important; padding-top: 0 !important; padding-bottom: 0 !important }
  401. .page-header-view-model-wiz__page-header-title--page-header-title-large { margin-top: 24px !important; margin-bottom: 8px !important; color: var(--yt-spec-text-primary) !important; font-size: 1.6em !important; line-height: 1.4em !important; font-weight: 500 !important }
  402. .yt-content-metadata-view-model-wiz--medium-text .yt-content-metadata-view-model-wiz__metadata-text { margin-right: 8px !important }
  403. .yt-content-metadata-view-model-wiz__metadata-text, .truncated-text-wiz, .truncated-text-wiz__absolute-button { font-size: 1.4rem !important }
  404. /* Remove Shorts, Trending, Podcasts, Shopping and Playables in the guide menus + Other elements to be fixed, modified and removed */
  405. #endpoint.yt-simple-endpoint.ytd-guide-entry-renderer.style-scope[title="Shorts"],
  406. #endpoint.yt-simple-endpoint.ytd-mini-guide-entry-renderer.style-scope[title="Shorts"] { display: none !important }
  407. #endpoint.yt-simple-endpoint.ytd-guide-entry-renderer.style-scope[title="Your channel"] { display: none !important }
  408. ytd-guide-entry-renderer > a[href*="/feed/trending"] { display: none !important }
  409. #endpoint.yt-simple-endpoint.ytd-guide-entry-renderer.style-scope[title="Podcasts"], ytd-guide-entry-renderer > a[href*="/feed/podcasts"] { display: none !important }
  410. ytd-guide-entry-renderer > a[href*="/channel/UCkYQyvc_i9hXEo4xic9Hh2g"] { display: none !important }
  411. ytd-guide-entry-renderer > a[href*="/playables"] { display: none !important }
  412. .yt-tab-shape-wiz { padding: 0 32px !important; margin-right: 0 !important }
  413. .yt-tab-shape-wiz__tab { font-size: 14px !important; font-weight: 500 !important; letter-spacing: var(--ytd-tab-system-letter-spacing) !important; text-transform: uppercase !important }
  414. .yt-tab-group-shape-wiz__slider { display: none !important }
  415. yt-formatted-string.style-scope.yt-chip-cloud-chip-renderer, span.style-scope.ytd-rich-shelf-renderer { font-weight: 400 !important }
  416. span.style-scope.ytd-shelf-renderer, ytd-reel-shelf-renderer[modern-typography] #title.ytd-reel-shelf-renderer { font-size: 1.6rem !important; font-weight: 500 !important }
  417. .count-text.ytd-comments-header-renderer { font-size: 1.6rem !important; line-height: 2.2rem !important; font-weight: 400 !important }
  418. ytd-item-section-renderer.style-scope.ytd-watch-next-secondary-results-renderer > div#contents.style-scope.ytd-item-section-renderer > ytd-reel-shelf-renderer.style-scope.ytd-item-section-renderer, ytd-reel-shelf-renderer.ytd-structured-description-content-renderer { display: none !important }
  419. ytd-video-description-infocards-section-renderer.style-scope.ytd-structured-description-content-renderer > #header.ytd-video-description-infocards-section-renderer, ytd-video-description-infocards-section-renderer.style-scope.ytd-structured-description-content-renderer > #action-buttons.ytd-video-description-infocards-section-renderer, #social-links.ytd-video-description-infocards-section-renderer { display: none !important }
  420. ytd-video-description-infocards-section-renderer.style-scope.ytd-structured-description-content-renderer { border-top: 0px !important }
  421. button.ytp-button.ytp-jump-button.ytp-jump-button-enabled { display: none !important }
  422. ytd-player#ytd-player.style-scope.ytd-watch-flexy > div#container.style-scope.ytd-player > .html5-video-player > div.ytp-chrome-bottom > div.ytp-chrome-controls > div.ytp-left-controls > a.ytp-next-button.ytp-button { display: block !important }
  423. div#chip-bar.style-scope.ytd-search-header-renderer > yt-chip-cloud-renderer.style-scope.ytd-search-header-renderer > div#container.style-scope.yt-chip-cloud-renderer { display: none !important }
  424. #play.ytd-moving-thumbnail-renderer { color: #fff !important }
  425. ytd-button-renderer.style-scope.yt-chip-cloud-renderer div.yt-spec-button-shape-next__icon, ytd-button-renderer.style-scope.yt-chip-cloud-renderer yt-icon, ytd-button-renderer.ytd-feed-filter-chip-bar-renderer div.yt-spec-button-shape-next__icon, ytd-button-renderer.ytd-feed-filter-chip-bar-renderer yt-icon { width: 20px !important; height: 20px !important }
  426. lottie-component.smartimation__border-gradient.lottie-component, smartimation__background-lottie lottie-component { display: none !important }
  427. .smartimation--active-border .smartimation__overlay { opacity: 0; z-index: 0 }
  428. #return-youtube-dislike-bar, #ryd-bar, .yt-spec-touch-feedback-shape--touch-response .yt-spec-touch-feedback-shape__fill { background: var(--yt-spec-icon-inactive) !important }
  429. #ryd-bar-container { margin-top: 2px !important }
  430. ytd-watch-flexy #dismissible.ytd-rich-grid-media { flex-direction: row; }
  431. ytd-watch-flexy #attached-survey.ytd-rich-grid-media, ytd-watch-flexy #avatar-link.ytd-rich-grid-media { display: none; }
  432. ytd-watch-flexy ytd-thumbnail.ytd-rich-grid-media, ytd-watch-flexy ytd-playlist-thumbnail.ytd-rich-grid-media { margin-right: 8px; height: 94px; width: 168px; }
  433. ytd-thumbnail[size=large][large-margin] ytd-thumbnail-overlay-time-status-renderer.ytd-thumbnail, ytd-thumbnail[size=large][large-margin] ytd-thumbnail-overlay-button-renderer.ytd-thumbnail, ytd-thumbnail[size=large][large-margin] ytd-thumbnail-overlay-toggle-button-renderer.ytd-thumbnail, ytd-thumbnail[size=large] ytd-thumbnail-overlay-time-status-renderer.ytd-thumbnail, ytd-thumbnail[size=large] ytd-thumbnail-overlay-button-renderer.ytd-thumbnail, ytd-thumbnail[size=large] ytd-thumbnail-overlay-toggle-button-renderer.ytd-thumbnail { margin: 4px; }
  434. ytd-watch-flexy ytd-rich-item-renderer, ytd-watch-flexy ytd-rich-grid-row #contents.ytd-rich-grid-row { margin: 0; }
  435. ytd-watch-flexy ytd-rich-item-renderer[reduced-bottom-margin] { margin-top: 8px; margin-bottom: 0; }
  436. ytd-watch-flexy ytd-rich-grid-renderer[reduced-top-margin] #contents.ytd-rich-grid-renderer { padding-top: 0px; }
  437. ytd-watch-flexy ytd-rich-grid-media { margin-bottom: 8px; }
  438. ytd-watch-flexy #details.ytd-rich-grid-media { width: 100%; min-width: 0; }
  439. ytd-watch-flexy ytd-video-meta-block[rich-meta] #metadata-line.ytd-video-meta-block, ytd-watch-flexy #channel-name.ytd-video-meta-block { font-family: "Roboto", "Arial", sans-serif; font-size: 1.2rem; line-height: 1.8rem; font-weight: 400; }
  440. ytd-watch-flexy #video-title.ytd-rich-grid-media { margin: 0 0 4px 0; display: block; font-family: "Roboto", "Arial", sans-serif; font-size: 1.4rem; line-height: 2rem; font-weight: 500; overflow: hidden; display: block; max-height: 4rem; -webkit-line-clamp: 2; display: box; display: -webkit-box; -webkit-box-orient: vertical; text-overflow: ellipsis; white-space: normal; }
  441. ytd-watch-flexy h3.ytd-rich-grid-media { margin: 0; }
  442. ytd-watch-flexy .title-badge.ytd-rich-grid-media, ytd-watch-flexy .video-badge.ytd-rich-grid-media { margin-top: 0; }
  443. ytd-watch-flexy ytd-rich-section-renderer.style-scope.ytd-rich-grid-renderer { display: none; }
  444. ytd-watch-flexy ytd-rich-grid-renderer[hide-chips-bar] ytd-feed-filter-chip-bar-renderer.ytd-rich-grid-renderer, ytd-watch-flexy ytd-rich-grid-renderer[hide-chips-bar-on-watch] ytd-feed-filter-chip-bar-renderer.ytd-rich-grid-renderer, ytd-watch-flexy ytd-rich-grid-renderer[hide-chips-bar-on-home] #header.ytd-rich-grid-renderer ytd-feed-filter-chip-bar-renderer.ytd-rich-grid-renderer { display: flex; height: 51px; margin-bottom: 8px; } 
  445. ytd-watch-flexy #chips-wrapper.ytd-feed-filter-chip-bar-renderer, ytd-watch-flexy ytd-feed-filter-chip-bar-renderer #left-arrow-button.ytd-feed-filter-chip-bar-renderer, ytd-watch-flexy ytd-feed-filter-chip-bar-renderer #right-arrow-button.ytd-feed-filter-chip-bar-renderer { background: var(--yt-spec-general-background-a) !important; }
  446. ytd-watch-flexy #left-arrow.ytd-feed-filter-chip-bar-renderer:after { background: linear-gradient(to right, var(--ytd-chip-cloud-background, var(--yt-spec-general-background-a)) 10%, rgba(249, 249, 249, 0) 90%) !important; }
  447. ytd-watch-flexy #right-arrow.ytd-feed-filter-chip-bar-renderer:before { background: linear-gradient(to left, var(--ytd-chip-cloud-background, var(--yt-spec-general-background-a)) 10%, rgba(249, 249, 249, 0) 90%) !important; }
  448. ytd-watch-flexy ytd-feed-filter-chip-bar-renderer[is-dark-theme] #left-arrow.ytd-feed-filter-chip-bar-renderer:after { background: linear-gradient(to right, var(--ytd-chip-cloud-background, var(--yt-spec-general-background-a)) 10%, rgba(24, 24, 24, 0) 90%) !important; }
  449. ytd-watch-flexy ytd-feed-filter-chip-bar-renderer[is-dark-theme] #right-arrow.ytd-feed-filter-chip-bar-renderer:before { background: linear-gradient(to left, var(--ytd-chip-cloud-background, var(--yt-spec-general-background-a)) 10%, rgba(24, 24, 24, 0) 90%) !important; }
  450. ytd-watch-flexy #chips-wrapper.ytd-feed-filter-chip-bar-renderer { position: relative; top: 0; }
  451. ytd-watch-flexy ytd-feed-filter-chip-bar-renderer[fluid-width] #chips-content.ytd-feed-filter-chip-bar-renderer { padding: 0; }
  452. ytd-watch-flexy yt-chip-cloud-chip-renderer.ytd-feed-filter-chip-bar-renderer, ytd-watch-flexy yt-chip-cloud-chip-renderer.ytd-feed-filter-chip-bar-renderer:first-of-type { margin: 8px; margin-left: 0; }
  453. ytd-watch-flexy ytd-button-renderer.ytd-feed-filter-chip-bar-renderer { margin: 0; padding: 0 8px; }
  454. #meta #avatar { width: 48px; height: 48px; margin-right: 12px; }
  455. #meta #avatar img { width: 100%; }
  456. ytd-video-primary-info-renderer div#flexible-item-buttons.style-scope.ytd-menu-renderer > yt-button-view-model > button-view-model > button.yt-spec-button-shape-next.yt-spec-button-shape-next--tonal.yt-spec-button-shape-next--mono.yt-spec-button-shape-next--size-m.yt-spec-button-shape-next--icon-leading,
  457. ytd-video-primary-info-renderer div#top-level-buttons-computed.top-level-buttons.style-scope.ytd-menu-renderer > yt-button-view-model > button-view-model > button.yt-spec-button-shape-next.yt-spec-button-shape-next--tonal.yt-spec-button-shape-next--mono.yt-spec-button-shape-next--size-m.yt-spec-button-shape-next--icon-leading,
  458. ytd-video-primary-info-renderer button.yt-spec-button-shape-next.yt-spec-button-shape-next--tonal.yt-spec-button-shape-next--mono.yt-spec-button-shape-next--size-m.yt-spec-button-shape-next--segmented-end.yt-spec-button-shape-next--icon-leading { padding-left: 12px !important; padding-right: 6px !important; background-color: transparent !important }
  459. ytd-video-primary-info-renderer button.yt-spec-button-shape-next.yt-spec-button-shape-next--tonal.yt-spec-button-shape-next--mono.yt-spec-button-shape-next--size-m.yt-spec-button-shape-next--icon-leading, button.yt-spec-button-shape-next.yt-spec-button-shape-next--tonal.yt-spec-button-shape-next--mono.yt-spec-button-shape-next--size-m.yt-spec-button-shape-next--icon-leading.yt-spec-button-shape-next--segmented-start { padding-left: 12px !important; padding-right: 6px !important; background-color: transparent !important }
  460. ytd-video-primary-info-renderer button.yt-spec-button-shape-next.yt-spec-button-shape-next--tonal.yt-spec-button-shape-next--mono.yt-spec-button-shape-next--size-m.yt-spec-button-shape-next--icon-leading.yt-spec-button-shape-next--segmented-start { padding-right: 16px !important }
  461. ytd-video-primary-info-renderer dislike-button-view-model.YtDislikeButtonViewModelHost > toggle-button-view-model > button.yt-spec-button-shape-next.yt-spec-button-shape-next--tonal.yt-spec-button-shape-next--mono.yt-spec-button-shape-next--size-m, ytd-menu-renderer[has-items] yt-button-shape.ytd-menu-renderer > button.yt-spec-button-shape-next.yt-spec-button-shape-next--tonal.yt-spec-button-shape-next--mono.yt-spec-button-shape-next--size-m.yt-spec-button-shape-next--icon-button { background-color: transparent !important }
  462. ytd-video-primary-info-renderer .yt-spec-button-shape-next--size-m.yt-spec-button-shape-next--segmented-start::after { width: 0px !important }
  463. ytd-video-primary-info-renderer button.yt-spec-button-shape-next.yt-spec-button-shape-next--tonal.yt-spec-button-shape-next--mono.yt-spec-button-shape-next--size-m.yt-spec-button-shape-next--icon-button.yt-spec-button-shape-next--segmented-end { background: transparent !important }
  464. ytd-video-primary-info-renderer button.yt-spec-button-shape-next.yt-spec-button-shape-next--tonal.yt-spec-button-shape-next--mono.yt-spec-button-shape-next--size-m.yt-spec-button-shape-next--icon-button.yt-spec-button-shape-next--segmented-end[aria-label="Dislike this video"] { width: 92px !important }
  465. ytd-video-primary-info-renderer button.yt-spec-button-shape-next.yt-spec-button-shape-next--tonal.yt-spec-button-shape-next--mono.yt-spec-button-shape-next--size-m.yt-spec-button-shape-next--icon-button.yt-spec-button-shape-next--segmented-end[aria-label="Dislike this video"]::after { padding-left: 6px; content: "Dislike" }
  466. ytd-video-primary-info-renderer button.yt-spec-button-shape-next.yt-spec-button-shape-next--tonal.yt-spec-button-shape-next--mono.yt-spec-button-shape-next--size-m.yt-spec-button-shape-next--icon-button.yt-spec-button-shape-next--segmented-end[aria-label="Marcar “No me gusta” en el video"] { width: 134px !important }
  467. ytd-video-primary-info-renderer button.yt-spec-button-shape-next.yt-spec-button-shape-next--tonal.yt-spec-button-shape-next--mono.yt-spec-button-shape-next--size-m.yt-spec-button-shape-next--icon-button.yt-spec-button-shape-next--segmented-end[aria-label="Marcar “No me gusta” en el video"]::after { padding-left: 6px; content: "No me gusta" }
  468. ytd-video-primary-info-renderer button.yt-spec-button-shape-next.yt-spec-button-shape-next--tonal.yt-spec-button-shape-next--mono.yt-spec-button-shape-next--size-m.yt-spec-button-shape-next--icon-button.yt-spec-button-shape-next--segmented-end[aria-label="Je n'aime pas cette vidéo"] { width: 106px !important }
  469. ytd-video-primary-info-renderer button.yt-spec-button-shape-next.yt-spec-button-shape-next--tonal.yt-spec-button-shape-next--mono.yt-spec-button-shape-next--size-m.yt-spec-button-shape-next--icon-button.yt-spec-button-shape-next--segmented-end[aria-label="Je n'aime pas cette vidéo"]::after { padding-left: 6px; content: "Je n'aime" }
  470. ytd-watch-metadata[title-headline-m] h1.ytd-watch-metadata { font-size: 2rem !important; font-weight: 400 !important; line-height: 2.8rem !important }
  471. #less-replies > yt-button-shape > button > div.yt-spec-button-shape-next__icon [d*="M18.4 14.6 12 8.3l-6.4 6.3.8.8L12 9.7l5.6 5.7z"] { d: path("m7 14 5-5 5 5z") !important }
  472. #more-replies > yt-button-shape > button > div.yt-spec-button-shape-next__icon [d*="m18 9.28-6.35 6.35-6.37-6.35.72-.71 5.64 5.65 5.65-5.65z"] { d: path("m7 10 5 5 5-5z") !important }
  473. #less-replies-icon > yt-button-shape > button > div [d*="M18.4 14.6 12 8.3l-6.4 6.3.8.8L12 9.7l5.6 5.7z"] { d: path("m7 14 5-5 5 5z") !important }
  474. #more-replies-icon > yt-button-shape > button > div [d*="m18 9.28-6.35 6.35-6.37-6.35.72-.71 5.64 5.65 5.65-5.65z"] { d: path("m7 10 5 5 5-5z") !important }
  475. #pinned-comment-badge > ytd-pinned-comment-badge-renderer > yt-icon > yt-icon-shape { color: var(--yt-spec-text-primary) !important }
  476. [d*="M18 4v15.06l-5.42-3.87-.58-.42-.58.42L6 19.06V4h12m1-1H5v18l7-5 7 5V3z"] { d: path("M22 13h-4v4h-2v-4h-4v-2h4V7h2v4h4v2zm-8-6H2v1h12V7zM2 12h8v-1H2v1zm0 4h8v-1H2v1z") }
  477. [d*="M16.296 16.996a8 8 0 11.707-.708l3.909 3.91-.707.707-3.909-3.909zM18 11a7 7 0 00-14 0 7 7 0 1014 0z"] { d: path("m20.87 20.17-5.59-5.59C16.35 13.35 17 11.75 17 10c0-3.87-3.13-7-7-7s-7 3.13-7 7 3.13 7 7 7c1.75 0 3.35-.65 4.58-1.71l5.59 5.59.7-.71zM10 16c-3.31 0-6-2.69-6-6s2.69-6 6-6 6 2.69 6 6-2.69 6-6 6z") }
  478. [d*="m12.71 12 8.15 8.15-.71.71L12 12.71l-8.15 8.15-.71-.71L11.29 12 3.15 3.85l.71-.71L12 11.29l8.15-8.15.71.71L12.71 12z"] { d: path("M12.7,12l6.6,6.6l-0.7,0.7L12,12.7l-6.6,6.6l-0.7-0.7l6.6-6.6L4.6,5.4l0.7-0.7l6.6,6.6l6.6-6.6l0.7,0.7L12.7,12z") }
  479. /* Fix disappearing bar in masthead */
  480. #background.ytd-masthead { opacity: 1 !important }
  481. `;
  482. document.head.appendChild(styles);
  483.  
  484. // Re-add 'Explore' tab in sidebar (it also replaces the 'Shorts' tab)
  485. function waitForElm(selector) {
  486.     return new Promise(resolve => {
  487.         if (document.querySelector(selector)) {
  488.             return resolve(document.querySelector(selector));
  489.         }
  490.  
  491.         const observer = new MutationObserver(mutations => {
  492.             if (document.querySelector(selector)) {
  493.                 resolve(document.querySelector(selector));
  494.                 observer.disconnect();
  495.             }
  496.         });
  497.  
  498.         observer.observe(document.body, {
  499.             childList: true,
  500.             subtree: true
  501.         });
  502.     });
  503. }
  504.  
  505.     function restoreTrending() {
  506.  
  507.         var trendingData = {
  508.             "navigationEndpoint": {
  509.                 "clickTrackingParams": "CBwQtSwYASITCNqYh-qO_fACFcoRrQYdP44D9Q==",
  510.                 "commandMetadata": {
  511.                     "webCommandMetadata": {
  512.                         "url": "/feed/explore",
  513.                         "webPageType": "WEB_PAGE_TYPE_BROWSE",
  514.                         "rootVe": 6827,
  515.                         "apiUrl": "/youtubei/v1/browse"
  516.                     }
  517.                 },
  518.                 "browseEndpoint": {
  519.                     "browseId": "FEtrending"
  520.                 }
  521.             },
  522.             "icon": {
  523.                 "iconType": "EXPLORE"
  524.             },
  525.             "trackingParams": "CBwQtSwYASITCNqYh-qO_fACFcoRrQYdP44D9Q==",
  526.             "formattedTitle": {
  527.                 "simpleText": "Explore"
  528.             },
  529.             "accessibility": {
  530.                 "accessibilityData": {
  531.                     "label": "Explore"
  532.                 }
  533.             },
  534.             "isPrimary": true
  535.         };
  536.  
  537.         var guidetemplate = `<ytd-guide-entry-renderer class="style-scope ytd-guide-section-renderer" is-primary="" line-end-style="none"><!--css-build:shady--><a id="endpoint" class="yt-simple-endpoint style-scope ytd-guide-entry-renderer" tabindex="-1" role="tablist"><tp-yt-paper-item role="tab" class="style-scope ytd-guide-entry-renderer" tabindex="0" aria-disabled="false"><!--css-build:shady--><yt-icon class="guide-icon style-scope ytd-guide-entry-renderer" disable-upgrade=""></yt-icon><yt-img-shadow height="24" width="24" class="style-scope ytd-guide-entry-renderer" disable-upgrade=""></yt-img-shadow><yt-formatted-string class="title style-scope ytd-guide-entry-renderer"><!--css-build:shady--></yt-formatted-string><span class="guide-entry-count style-scope ytd-guide-entry-renderer"></span><yt-icon class="guide-entry-badge style-scope ytd-guide-entry-renderer" disable-upgrade=""></yt-icon><div id="newness-dot" class="style-scope ytd-guide-entry-renderer"></div></tp-yt-paper-item></a><yt-interaction class="style-scope ytd-guide-entry-renderer"><!--css-build:shady--><div class="stroke style-scope yt-interaction"></div><div class="fill style-scope yt-interaction"></div></yt-interaction></ytd-guide-entry-renderer>`;
  538.         document.querySelector(`#items > ytd-guide-entry-renderer:nth-child(2)`).data = trendingData;
  539.  
  540.         var miniguidetemplate = `<ytd-mini-guide-entry-renderer class="style-scope ytd-mini-guide-section-renderer" is-primary="" line-end-style="none"><!--css-build:shady--><a id="endpoint" class="yt-simple-endpoint style-scope ytd-guide-entry-renderer" tabindex="-1" role="tablist"><tp-yt-paper-item role="tab" class="style-scope ytd-guide-entry-renderer" tabindex="0" aria-disabled="false"><!--css-build:shady--><yt-icon class="guide-icon style-scope ytd-guide-entry-renderer" disable-upgrade=""></yt-icon><yt-img-shadow height="24" width="24" class="style-scope ytd-guide-entry-renderer" disable-upgrade=""></yt-img-shadow><yt-formatted-string class="title style-scope ytd-guide-entry-renderer"><!--css-build:shady--></yt-formatted-string><span class="guide-entry-count style-scope ytd-guide-entry-renderer"></span><yt-icon class="guide-entry-badge style-scope ytd-guide-entry-renderer" disable-upgrade=""></yt-icon><div id="newness-dot" class="style-scope ytd-guide-entry-renderer"></div></tp-yt-paper-item></a><yt-interaction class="style-scope ytd-guide-entry-renderer"><!--css-build:shady--><div class="stroke style-scope yt-interaction"></div><div class="fill style-scope yt-interaction"></div></yt-interaction></ytd-guide-entry-renderer>`;
  541.         document.querySelector(`#items > ytd-mini-guide-entry-renderer:nth-child(2)`).data = trendingData;
  542.  
  543.     }
  544.  
  545.  
  546. waitForElm("#items.ytd-guide-section-renderer").then((elm) => {
  547.     restoreTrending();
  548. });
  549.  
  550. waitForElm("#items.ytd-mini-guide-section-renderer").then((elm) => {
  551.     restoreTrending();
  552. });
  553.  
  554. // Restore old comment replies UI and more additions added (ft. YT Video Resize Fix (special thanks to CY Fung))
  555. var observingComments = false;
  556. var hl;
  557.  
  558. const cfconfig = {
  559.     unicodeEmojis: false
  560. };
  561.  
  562. const cfi18n = {
  563.     en: {
  564.         viewSingular: "View reply",
  565.         viewMulti: "View %s replies",
  566.         viewSingularOwner: "View reply from %s",
  567.         viewMultiOwner: "View %s replies from %s and others",
  568.         hideSingular: "Hide reply",
  569.         hideMulti: "Hide replies",
  570.         replyCountIsolator: /( REPLIES)|( REPLY)/
  571.     }
  572. }
  573.  
  574. /**
  575.  * Get a string from the localization strings.
  576.  *
  577.  * @param {string}   string  Name of string to get
  578.  * @param {string}   hl      Language to use.
  579.  * @param {...array} args    Strings.
  580.  * @returns {string}
  581.  */
  582.  function getString(string, hl = "en", ...args) {
  583.     if (!string) return;
  584.     var str;
  585.     if (cfi18n[hl]) {
  586.         if (cfi18n[hl][string]) {
  587.             str = cfi18n[hl][string];
  588.         } else if (cfi18n.en[string]) {
  589.             str = cfi18n.en[string];
  590.         } else {
  591.             return;
  592.         }
  593.     } else {
  594.         if (cfi18n.en[string]) str = cfi18n.en[string];
  595.     }
  596.  
  597.     for (var i = 0; i < args.length; i++) {
  598.         str = str.replace(/%s/, args[i]);
  599.     }
  600.  
  601.     return str;
  602. }
  603.  
  604. /**
  605.  * Wait for a selector to exist
  606.  *
  607.  * @param {string}       selector  CSS Selector
  608.  * @param {HTMLElement}  base      Element to search inside
  609.  * @returns {Node}
  610.  */
  611. async function waitForElm(selector, base = document) {
  612.     if (!selector) return null;
  613.     if (!base.querySelector) return null;
  614.     while (base.querySelector(selector) == null) {
  615.         await new Promise(r => requestAnimationFrame(r));
  616.     };
  617.     return base.querySelector(selector);
  618. };
  619.  
  620. /**
  621.  * Is a value in an array?
  622.  *
  623.  * @param {*}     needle    Value to search
  624.  * @param {Array} haystack  Array to search
  625.  * @returns {boolean}
  626.  */
  627.  function inArray(needle, haystack) {
  628.     for (var i = 0; i < haystack.length; i++) {
  629.         if (needle == haystack[i]) return true;
  630.     }
  631.     return false;
  632. }
  633.  
  634. /**
  635.  * Get text of an InnerTube string.
  636.  *
  637.  * @param {object} object  String container.
  638.  */
  639. function getSimpleString(object) {
  640.     if (object.simpleText) return object.simpleText;
  641.  
  642.     var str = "";
  643.     for (var i = 0; i < object.runs.length; i++) {
  644.         str += object.runs[i].text;
  645.     }
  646.     return str;
  647. }
  648.  
  649. /**
  650.  * Format a commentRenderer.
  651.  *
  652.  * @param {object} comment  commentRenderer from InnerTube.
  653.  */
  654. function formatComment(comment) {
  655.     if (cfconfig.unicodeEmojis) {
  656.         var runs;
  657.         try {
  658.             runs = comment.contentText.runs
  659.             for (var i = 0; i < runs.length; i++) {
  660.                 delete runs[i].emoji;
  661.                 delete runs[i].loggingDirectives;
  662.             }
  663.         } catch(err) {}
  664.     }
  665.  
  666.     return comment;
  667. }
  668.  
  669. /**
  670.  * Format a commentThreadRenderer.
  671.  *
  672.  * @param {object} thread  commentThreadRenderer from InnerTube.
  673.  */
  674. async function formatCommentThread(thread) {
  675.     if (thread.comment.commentRenderer) {
  676.         thread.comment.commentRenderer = formatComment(thread.comment.commentRenderer);
  677.     }
  678.  
  679.     var replies;
  680.     try {
  681.         replies = thread.replies.commentRepliesRenderer;
  682.         if (replies.viewRepliesIcon) {
  683.             replies.viewReplies.buttonRenderer.icon = replies.viewRepliesIcon.buttonRenderer.icon;
  684.             delete replies.viewRepliesIcon;
  685.         }
  686.  
  687.         if (replies.hideRepliesIcon) {
  688.             replies.hideReplies.buttonRenderer.icon = replies.hideRepliesIcon.buttonRenderer.icon;
  689.             delete replies.hideRepliesIcon;
  690.         }
  691.  
  692.         var creatorName;
  693.         try {
  694.             creatorName = replies.viewRepliesCreatorThumbnail.accessibility.accessibilityData.label;
  695.             delete replies.viewRepliesCreatorThumbnail;
  696.         } catch(err) {}
  697.  
  698.         var replyCount = getSimpleString(replies.viewReplies.buttonRenderer.text);
  699.         replyCount = +replyCount.replace(getString("replyCountIsolator", hl), "");
  700.  
  701.         var viewMultiString = creatorName ? "viewMultiOwner" : "viewMulti";
  702.         var viewSingleString = creatorName ? "viewSingularOwner" : "viewSingular";
  703.  
  704.         replies.viewReplies.buttonRenderer.text = {
  705.             runs: [
  706.                 {
  707.                     text: (replyCount > 1) ? getString(viewMultiString, hl, replyCount, creatorName) : getString(viewSingleString, hl, creatorName)
  708.                 }
  709.             ]
  710.         }
  711.  
  712.         replies.hideReplies.buttonRenderer.text = {
  713.             runs: [
  714.                 {
  715.                     text: (replyCount > 1) ? getString("hideMulti", hl) :  getString("hideSingular", hl)
  716.                 }
  717.             ]
  718.         };
  719.     } catch(err) {}
  720.  
  721.     return thread;
  722. }
  723.  
  724. /**
  725.  * Force Polymer to refresh data of an element.
  726.  *
  727.  * @param {Node} element  Element to refresh data of.
  728.  */
  729. function refreshData(element) {
  730.     var clone = element.cloneNode();
  731.     clone.data = element.data;
  732.     // Let the script know we left our mark
  733.     // in a way that doesn't rely on classes
  734.     // because Polymer likes to cast comments
  735.     // into the void for later reuse
  736.     clone.data.fixedByCF = true;
  737.     for (var i in element.properties) {
  738.         clone[i] = element[i];
  739.     }
  740.     element.insertAdjacentElement("afterend", clone);
  741.     element.remove();
  742. }
  743.  
  744. var commentObserver = new MutationObserver((list) => {
  745.     list.forEach(async (mutation) => {
  746.         if (mutation.addedNodes) {
  747.             for (var i = 0; i < mutation.addedNodes.length; i++) {
  748.                 var elm = mutation.addedNodes[i];
  749.                 if (elm.classList && elm.data && !elm.data.fixedByCF) {
  750.                     if (elm.tagName == "YTD-COMMENT-THREAD-RENDERER") {
  751.                         elm.data = await formatCommentThread(elm.data);
  752.                         refreshData(elm);
  753.                     } else if (elm.tagName == "YTD-COMMENT-RENDERER") {
  754.                         if (!elm.classList.contains("ytd-comment-thread-renderer")) {
  755.                             elm.data = formatComment(elm.data);
  756.                             refreshData(elm);
  757.                         }
  758.                     }
  759.                 }
  760.             }
  761.         }
  762.     });
  763. });
  764.  
  765. document.addEventListener("yt-page-data-updated", async (e) => {
  766.     hl = yt.config_.HL;
  767.     commentObserver.observe(document.querySelector("ytd-app"),  { childList: true, subtree: true });
  768. });
  769.  
  770. /* jshint esversion:8 */
  771.  
  772. ((__CONTEXT01__) => {
  773.   'use strict';
  774.  
  775.  
  776.   const win = this instanceof Window ? this : window;
  777.  
  778.   // Create a unique key for the script and check if it is already running
  779.   const hkey_script = 'ahceihvpbosz';
  780.   if (win[hkey_script]) throw new Error('Duplicated Userscript Calling'); // avoid duplicated scripting
  781.   win[hkey_script] = true;
  782.  
  783.   const insp = o => o ? (o.polymerController || o.inst || o || 0) : (o || 0);
  784.   const indr = o => insp(o).$ || o.$ || 0;
  785.  
  786.   /** @type {globalThis.PromiseConstructor} */
  787.   const Promise = (async () => { })().constructor; // YouTube hacks Promise in WaterFox Classic and "Promise.resolve(0)" nevers resolve.
  788.   const cleanContext = async (win) => {
  789.     const waitFn = requestAnimationFrame; // shall have been binded to window
  790.     try {
  791.       let mx = 16; // MAX TRIAL
  792.       const frameId = 'vanillajs-iframe-v1'
  793.       let frame = document.getElementById(frameId);
  794.       let removeIframeFn = null;
  795.       if (!frame) {
  796.         frame = document.createElement('iframe');
  797.         frame.id = frameId;
  798.         const blobURL = typeof webkitCancelAnimationFrame === 'function' && typeof kagi === 'undefined' ? (frame.src = URL.createObjectURL(new Blob([], { type: 'text/html' }))) : null; // avoid Brave Crash
  799.         frame.sandbox = 'allow-same-origin'; // script cannot be run inside iframe but API can be obtained from iframe
  800.         let n = document.createElement('noscript'); // wrap into NOSCRPIT to avoid reflow (layouting)
  801.         n.appendChild(frame);
  802.         while (!document.documentElement && mx-- > 0) await new Promise(waitFn); // requestAnimationFrame here could get modified by YouTube engine
  803.         const root = document.documentElement;
  804.         root.appendChild(n); // throw error if root is null due to exceeding MAX TRIAL
  805.         if (blobURL) Promise.resolve().then(() => URL.revokeObjectURL(blobURL));
  806.  
  807.         removeIframeFn = (setTimeout) => {
  808.           const removeIframeOnDocumentReady = (e) => {
  809.             e && win.removeEventListener("DOMContentLoaded", removeIframeOnDocumentReady, false);
  810.             e = n;
  811.             n = win = removeIframeFn = 0;
  812.             setTimeout ? setTimeout(() => e.remove(), 200) : e.remove();
  813.           }
  814.           if (!setTimeout || document.readyState !== 'loading') {
  815.             removeIframeOnDocumentReady();
  816.           } else {
  817.             win.addEventListener("DOMContentLoaded", removeIframeOnDocumentReady, false);
  818.           }
  819.         }
  820.       }
  821.       while (!frame.contentWindow && mx-- > 0) await new Promise(waitFn);
  822.       const fc = frame.contentWindow;
  823.       if (!fc) throw "window is not found."; // throw error if root is null due to exceeding MAX TRIAL
  824.       try {
  825.         const { requestAnimationFrame, setTimeout, clearTimeout } = fc;
  826.         const res = { requestAnimationFrame, setTimeout, clearTimeout };
  827.         for (let k in res) res[k] = res[k].bind(win); // necessary
  828.         if (removeIframeFn) Promise.resolve(res.setTimeout).then(removeIframeFn);
  829.         return res;
  830.       } catch (e) {
  831.         if (removeIframeFn) removeIframeFn();
  832.         return null;
  833.       }
  834.     } catch (e) {
  835.       console.warn(e);
  836.       return null;
  837.     }
  838.   };
  839.  
  840.   const isWatchPageURL = (url) => {
  841.     url = url || location;
  842.     return location.pathname === '/watch' || location.pathname.startsWith('/live/')
  843.   };
  844.  
  845.   cleanContext(win).then(__CONTEXT02__ => {
  846.     if (!__CONTEXT02__) return null;
  847.  
  848.     const { ResizeObserver } = __CONTEXT01__;
  849.     const { requestAnimationFrame, setTimeout, clearTimeout } = __CONTEXT02__;
  850.     const elements = {};
  851.     let rid1 = 0;
  852.     let rid2 = 0;
  853.     /** @type {MutationObserver | null} */
  854.     let attrObserver = null;
  855.     /** @type {ResizeObserver | null} */
  856.     let resizeObserver = null;
  857.     let isHTMLAttrApplied = false;
  858.     const core = {
  859.       begin() {
  860.         document.addEventListener('yt-player-updated', core.hanlder, true);
  861.         document.addEventListener('ytd-navigate-finish', core.hanlder, true);
  862.       },
  863.       hanlder: () => {
  864.         rid1++;
  865.         if (rid1 > 1e9) rid1 = 9;
  866.         const tid = rid1;
  867.         requestAnimationFrame(() => {
  868.           if (tid !== rid1) return;
  869.           core.runner();
  870.         })
  871.       },
  872.       async runner() {
  873.         if (!location.href.startsWith('https://www.youtube.com/')) return;
  874.         if (!isWatchPageURL()) return;
  875.  
  876.         elements.ytdFlexy = document.querySelector('ytd-watch-flexy');
  877.         elements.video = document.querySelector('ytd-watch-flexy #movie_player video, ytd-watch-flexy #movie_player audio.video-stream.html5-main-video');
  878.         if (elements.ytdFlexy && elements.video) { } else return;
  879.         elements.moviePlayer = elements.video.closest('#movie_player');
  880.         if (!elements.moviePlayer) return;
  881.  
  882.         // resize Video
  883.         let { ytdFlexy } = elements;
  884.         if (!ytdFlexy.ElYTL) {
  885.           ytdFlexy.ElYTL = 1;
  886.           const ytdFlexyCnt = insp(ytdFlexy);
  887.           if (typeof ytdFlexyCnt.calculateNormalPlayerSize_ === 'function') {
  888.             ytdFlexyCnt.calculateNormalPlayerSize_ = core.resizeFunc(ytdFlexyCnt.calculateNormalPlayerSize_, 1);
  889.           } else {
  890.             console.warn('ytdFlexyCnt.calculateNormalPlayerSize_ is not a function.')
  891.           }
  892.           if (typeof ytdFlexyCnt.calculateCurrentPlayerSize_ === 'function') {
  893.             ytdFlexyCnt.calculateCurrentPlayerSize_ = core.resizeFunc(ytdFlexyCnt.calculateCurrentPlayerSize_, 0);
  894.           } else {
  895.             console.warn('ytdFlexyCnt.calculateCurrentPlayerSize_ is not a function.')
  896.           }
  897.         }
  898.         ytdFlexy = null;
  899.  
  900.         // when video is fetched
  901.         elements.video.removeEventListener('canplay', core.triggerResizeDelayed, false);
  902.         elements.video.addEventListener('canplay', core.triggerResizeDelayed, false);
  903.  
  904.         // when video is resized
  905.         if (resizeObserver) {
  906.           resizeObserver.disconnect();
  907.           resizeObserver = null;
  908.         }
  909.         if (typeof ResizeObserver === 'function') {
  910.           resizeObserver = new ResizeObserver(core.triggerResizeDelayed);
  911.           resizeObserver.observe(elements.moviePlayer);
  912.         }
  913.  
  914.         // MutationObserver:[collapsed] @ ytd-live-chat-frame#chat
  915.         if (attrObserver) {
  916.           attrObserver.takeRecords();
  917.           attrObserver.disconnect();
  918.           attrObserver = null;
  919.         }
  920.         let chat = document.querySelector('ytd-watch-flexy ytd-live-chat-frame#chat');
  921.         if (chat) {
  922.           // resize due to DOM update
  923.           attrObserver = new MutationObserver(core.triggerResizeDelayed);
  924.           attrObserver.observe(chat, { attributes: true, attributeFilter: ["collapsed"] });
  925.           chat = null;
  926.         }
  927.  
  928.         // resize on idle
  929.         Promise.resolve().then(core.triggerResizeDelayed);
  930.       },
  931.       resizeFunc(originalFunc, kb) {
  932.         return function () {
  933.           rid2++;
  934.           if (!isHTMLAttrApplied) {
  935.             isHTMLAttrApplied = true;
  936.             Promise.resolve(0).then(() => {
  937.               document.documentElement.classList.add('youtube-video-resize-fix');
  938.             }).catch(console.warn);
  939.           }
  940.           if (document.fullscreenElement === null) {
  941.  
  942.             // calculateCurrentPlayerSize_ shall be always return NaN to make correct positioning of toolbars
  943.             if (!kb) return { width: NaN, height: NaN };
  944.  
  945.             let ret = core.calculateSize();
  946.             if (ret.height > 0 && ret.width > 0) {
  947.               return ret;
  948.             }
  949.           }
  950.           return originalFunc.apply(this, arguments);
  951.         }
  952.       },
  953.       calculateSize_() {
  954.         const { moviePlayer, video } = elements;
  955.         const rect1 = { width: video.videoWidth, height: video.videoHeight }; // native values independent of css rules
  956.         if (rect1.width > 0 && rect1.height > 0) {
  957.           const rect2 = moviePlayer.getBoundingClientRect();
  958.           const aspectRatio = rect1.width / rect1.height;
  959.           let h2 = rect2.width / aspectRatio;
  960.           let w2 = rect2.height * aspectRatio;
  961.           return { rect2, h2, w2 };
  962.         }
  963.         return null;
  964.       },
  965.       calculateSize() {
  966.         let rs = core.calculateSize_();
  967.         if (!rs) return { width: NaN, height: NaN };
  968.         const { rect2, h2, w2 } = rs;
  969.         if (h2 > rect2.height) {
  970.           return { width: w2, height: rect2.height };
  971.         } else {
  972.           return { width: rect2.width, height: h2 };
  973.         }
  974.       },
  975.       triggerResizeDelayed: () => {
  976.         rid2++;
  977.         if (rid2 > 1e9) rid2 = 9;
  978.         const tid = rid2;
  979.         requestAnimationFrame(() => {
  980.           if (tid !== rid2) return;
  981.           const { ytdFlexy } = elements;
  982.           let r = false;
  983.           const ytdFlexyCnt = insp(ytdFlexy);
  984.           const windowSize_ = ytdFlexyCnt.windowSize_;
  985.           if (windowSize_ && typeof ytdFlexyCnt.onWindowResized_ === 'function') {
  986.             try {
  987.               ytdFlexyCnt.onWindowResized_(windowSize_);
  988.               r = true;
  989.             } catch (e) { }
  990.           }
  991.           if (!r) window.dispatchEvent(new Event('resize'));
  992.         })
  993.       }
  994.     };
  995.     core.begin();
  996.  
  997.  
  998.  
  999.  
  1000.  
  1001.  
  1002.  
  1003.     // YouTube Watch Page Reflect (WPR)
  1004.  
  1005.  
  1006.  
  1007.     // This script enhances the functionality of YouTube pages by reflecting changes in the page state.
  1008.  
  1009.     (async function youTubeWPR() {
  1010.  
  1011.       let checkPageVisibilityChanged = false;
  1012.  
  1013.       // A WeakSet to keep track of elements being monitored for mutations.
  1014.       const monitorWeakSet = new WeakSet();
  1015.  
  1016.       /** @type {globalThis.PromiseConstructor} */
  1017.       const Promise = (async () => { })().constructor;
  1018.  
  1019.       // Function to reflect the current state of the YouTube page.
  1020.       async function _reflect() {
  1021.         await Promise.resolve();
  1022.  
  1023.         const youtubeWpr = document.documentElement.getAttribute("youtube-wpr");
  1024.         let s = '';
  1025.  
  1026.         // Check if the current page is the video watch page.
  1027.         if (isWatchPageURL()) {
  1028.           let watch = document.querySelector("ytd-watch-flexy");
  1029.           let chat = document.querySelector("ytd-live-chat-frame#chat");
  1030.  
  1031.           if (watch) {
  1032.             // Determine the state of the chat and video player on the watch page and generate a state string.
  1033.             s += !chat ? 'h0' : (chat.hasAttribute('collapsed') || !document.querySelector('iframe#chatframe')) ? 'h1' : 'h2';
  1034.             s += watch.hasAttribute('is-two-columns_') ? 's' : 'S';
  1035.             s += watch.hasAttribute('fullscreen') ? 'F' : 'f';
  1036.             s += watch.hasAttribute('theater') ? 'T' : 't';
  1037.           }
  1038.         }
  1039.  
  1040.         // Update the reflected state if it has changed.
  1041.         if (s !== youtubeWpr) {
  1042.           document.documentElement.setAttribute("youtube-wpr", s);
  1043.         }
  1044.  
  1045.       }
  1046.  
  1047.       // Function to reflect changes in specific attributes of monitored elements.
  1048.       async function reflect(nodeName, attrNames, forced) {
  1049.         await Promise.resolve();
  1050.  
  1051.         if (!forced) {
  1052.           let skip = true;
  1053.           for (const attrName of attrNames) {
  1054.             if (nodeName === 'ytd-live-chat-frame') {
  1055.               if (attrName === 'collapsed') skip = false;
  1056.             } else if (nodeName === 'ytd-watch-flexy') {
  1057.               if (attrName === 'is-two-columns_') skip = false;
  1058.               else if (attrName === 'fullscreen') skip = false;
  1059.               else if (attrName === 'theater') skip = false;
  1060.             }
  1061.           }
  1062.           if (skip) return;
  1063.         }
  1064.  
  1065.         // Log the mutated element and its attributes.
  1066.         // console.log(nodeName, attrNames);
  1067.  
  1068.         // Call _reflect() to update the reflected state.
  1069.         _reflect();
  1070.       }
  1071.  
  1072.       // Callback function for the MutationObserver that tracks mutations in monitored elements.
  1073.       function callback(mutationsList) {
  1074.         const attrNames = new Set();
  1075.         let nodeName = null;
  1076.         for (const mutation of mutationsList) {
  1077.           if (nodeName === null && mutation.target) nodeName = mutation.target.nodeName.toLowerCase();
  1078.           attrNames.add(mutation.attributeName);
  1079.         }
  1080.         reflect(nodeName, attrNames, false);
  1081.       }
  1082.  
  1083.       function getParent(element) {
  1084.         return element.__shady_native_parentNode || element.__shady_parentNode || element.parentNode;
  1085.       }
  1086.  
  1087.       let lastPageTypeChanged = 0;
  1088.       function chatContainerMutationHandler() {
  1089.         if (Date.now() - lastPageTypeChanged < 800) _reflect();
  1090.       }
  1091.  
  1092.       // Function to start monitoring an element for mutations.
  1093.       function monitor(element) {
  1094.         if (!element) return;
  1095.         if (monitorWeakSet.has(element)) {
  1096.           return;
  1097.         }
  1098.  
  1099.         monitorWeakSet.add(element);
  1100.  
  1101.         const observer = new MutationObserver(callback);
  1102.         observer.observe(element, { attributes: true });
  1103.  
  1104.         if (element.id === 'chat') {
  1105.           const parentNode = getParent(element);
  1106.           if (parentNode instanceof Element && parentNode.id === 'chat-container' && !monitorWeakSet.has(parentNode)) {
  1107.             monitorWeakSet.add(parentNode);
  1108.             const observer = new MutationObserver(chatContainerMutationHandler);
  1109.             observer.observe(parentNode, { childList: true, subtree: false });
  1110.           }
  1111.         }
  1112.  
  1113.         return 1;
  1114.       }
  1115.  
  1116.       let timeout = 0;
  1117.  
  1118.       // Function to monitor relevant elements and update the reflected state.
  1119.       let g = async (forced) => {
  1120.         await Promise.resolve();
  1121.         let b = 0;
  1122.         b = b | monitor(document.querySelector("ytd-watch-flexy"));
  1123.         b = b | monitor(document.querySelector("ytd-live-chat-frame#chat"));
  1124.         if (b || forced) {
  1125.           _reflect();
  1126.         }
  1127.       }
  1128.       // let renderId = 0;
  1129.       // Event handler function that triggers when the page finishes navigation or page data updates.
  1130.       let eventHandlerFunc = async (evt) => {
  1131.         checkPageVisibilityChanged = true;
  1132.         timeout = Date.now() + 800;
  1133.         g(1);
  1134.         if (evt.type === 'yt-navigate-finish') {
  1135.           // delay required when page type is changed for #chat (home -> watch).
  1136.           setTimeout(() => {
  1137.             g(1);
  1138.           }, 80);
  1139.         } else if (evt.type === 'yt-page-type-changed') {
  1140.           lastPageTypeChanged = Date.now();
  1141.           // setTimeout(() => {
  1142.           //   if (renderId > 1e9) renderId = 9;
  1143.           //   const t = ++renderId;
  1144.           //   requestAnimationFrame(() => {
  1145.           //     if (t !== renderId) return;
  1146.           //     g(1);
  1147.           //   });
  1148.           // }, 180);
  1149.           if (typeof requestIdleCallback === 'function') {
  1150.             requestIdleCallback(() => {
  1151.               g(1);
  1152.             });
  1153.           }
  1154.         }
  1155.       }
  1156.  
  1157.       let loadState = 0;
  1158.  
  1159.       // Function to initialize the script and start monitoring the page.
  1160.       async function actor() {
  1161.         if (loadState === 0) {
  1162.           if (!document.documentElement.hasAttribute("youtube-wpr")) {
  1163.             loadState = 1;
  1164.             document.documentElement.setAttribute("youtube-wpr", "");
  1165.             document.addEventListener("yt-navigate-finish", eventHandlerFunc, false);
  1166.             document.addEventListener("yt-page-data-updated", eventHandlerFunc, false);
  1167.             document.addEventListener("yt-page-type-changed", eventHandlerFunc, false);
  1168.           } else {
  1169.             loadState = -1;
  1170.             document.removeEventListener("yt-page-data-fetched", actor, false);
  1171.             return;
  1172.           }
  1173.         }
  1174.         if (loadState === 1) {
  1175.           timeout = Date.now() + 800;
  1176.           // Function to continuously monitor elements and update the reflected state.
  1177.           let pf = () => {
  1178.             g(0);
  1179.             if (Date.now() < timeout) requestAnimationFrame(pf);
  1180.           };
  1181.           pf();
  1182.         }
  1183.       }
  1184.  
  1185.       // Event listener that triggers when page data is fetched.
  1186.       document.addEventListener("yt-page-data-fetched", actor, false);
  1187.  
  1188.       // Update after visibility changed (looks like there are bugs due to inactive tab)
  1189.       document.addEventListener('visibilitychange', () => {
  1190.         if (document.visibilityState !== 'visible') return;
  1191.         if (checkPageVisibilityChanged) {
  1192.           checkPageVisibilityChanged = false;
  1193.           setTimeout(() => {
  1194.             g(1);
  1195.           }, 100);
  1196.           requestAnimationFrame(() => {
  1197.             g(1);
  1198.           });
  1199.         }
  1200.       }, false);
  1201.  
  1202.  
  1203.     })();
  1204.  
  1205.   });
  1206.  
  1207. })({ ResizeObserver });

欢迎访问Greasy Fork镜像

土豆服务器，请按需使用

镜像地址随时可能被墙，建议加群获取最新地址

加入Q群

QingJ © 2025

镜像随时可能失效，请加Q群300939539或关注我们的公众号极客氢云获取最新地址