/*
  EXPERIMENTAL Vivaldi VH Addon - Zen Mode
  Target Vivaldi VH version: 1.4.2
  Target Vivaldi Browser versions: 6.5

  This addon for Vivaldi VH adds a Command Chain Flag "vvh-enable-zen-mode", which hides the Pillar and panel until the sides of the browser window are hovered.

  For instructions on how to enable this Command Chain Flag, refer to the documentation for Vivaldi VH.

  Copyright (c) 2024 HKayn <https://hkayn.com>
*/
/*
  For ideal conditions, make the following adjustments to your browser theme:
  - Set panel transparency to 0%.
  - Disable "Transparent Tab Bar".
*/
/*
  Known issues with this addon:
  - On the VivalArc edition, parts of the Pillar may lack a background.
  - On the VivalArc edition, the webpage is not padded correctly.
  - The title bar cannot be used to drag the window unless title-bar-full-width is enabled.
  - During the fade-out delay, the panel and tab bar background will lose their blur effects if set.
  - During the fade-out delay, a transparent tab bar may change its background color.
  - When the mouse exits the browser window while crossing the zen mode hover area, elements within the toolbars may wrongfully think they're still being hovered.
  - When the tab bar is not present, the Pillar does not disappear while the panel is open. (It should)
*/
:root {
  /* Set custom parameters for the zen mode fade animation. Proceed with caution: */
  --vvh-zen-mode-animation-duration: 0.1s;
  --vvh-zen-mode-animation-timing-function: ease-out;
  --vvh-zen-mode-fade-in-animation-delay: 0s;
  --vvh-zen-mode-fade-out-animation-delay: 0.5s;
  --vvh-zen-mode-animation-translate-length: 10px;
  --vvh-zen-mode-hover-left-width: 25px;
  --vvh-zen-mode-hover-right-width: 25px;
}

:root:has(#browser:is(.tabs-left, .tabs-right):not(.fullscreen, .minimal-ui), #browser.tabs-off:not(.fullscreen, .minimal-ui) #panels-container:not(.switcher)) :has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-enable-panel-in-pillar]):not(:has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-disable-panel-in-pillar])) #browser.tabs-left:has(#panels-container.left) #main > .inner > .tabbar-wrapper::after, :root:has(#browser:is(.tabs-left, .tabs-right):not(.fullscreen, .minimal-ui), #browser.tabs-off:not(.fullscreen, .minimal-ui) #panels-container:not(.switcher)) :has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-enable-panel-in-pillar]):not(:has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-disable-panel-in-pillar])) #browser.tabs-right:has(#panels-container.right) #main > .inner > .tabbar-wrapper::after {
  content: unset !important;
}
:root:has(#browser:is(.tabs-left, .tabs-right):not(.fullscreen, .minimal-ui), #browser.tabs-off:not(.fullscreen, .minimal-ui) #panels-container:not(.switcher)) :has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-enable-panel-in-pillar]):not(:has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-disable-panel-in-pillar])) #browser.tabs-left:has(#panels-container.left) #panels-container::after, :root:has(#browser:is(.tabs-left, .tabs-right):not(.fullscreen, .minimal-ui), #browser.tabs-off:not(.fullscreen, .minimal-ui) #panels-container:not(.switcher)) :has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-enable-panel-in-pillar]):not(:has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-disable-panel-in-pillar])) #browser.tabs-right:has(#panels-container.right) #panels-container::after {
  content: "" !important;
}

:root:has(#browser:is(.tabs-left, .tabs-right):not(.fullscreen, .minimal-ui), #browser.tabs-off:not(.fullscreen, .minimal-ui) #panels-container:not(.switcher)) :has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-enable-titlebar-full-width]):not(:has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-disable-titlebar-full-width])) #browser:not(.disable-titlebar) #titlebar,
:root:has(#browser:is(.tabs-left, .tabs-right):not(.fullscreen, .minimal-ui), #browser.tabs-off:not(.fullscreen, .minimal-ui) #panels-container:not(.switcher)) :has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-enable-titlebar-full-width]):not(:has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-disable-titlebar-full-width])) #browser:not(.disable-titlebar) #header .topmenu {
  z-index: 9999 !important;
  /*
  // override properties set in zen-mode mixin
  translate: 0 !important;
  opacity: 1 !important;
  animation: none !important;
  transition: none !important;
  visibility: visible !important;
  z-index: 9999 !important; // prevents pseudo-elements from the zen-mode mixin from blocking this
  */
}

:root:has(#browser:is(.tabs-left, .tabs-right):not(.fullscreen, .minimal-ui), #browser.tabs-off:not(.fullscreen, .minimal-ui) #panels-container:not(.switcher)) :has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-enable-zen-mode]):not(:has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-disable-zen-mode])) #browser #titlebar,
:root:has(#browser:is(.tabs-left, .tabs-right):not(.fullscreen, .minimal-ui), #browser.tabs-off:not(.fullscreen, .minimal-ui) #panels-container:not(.switcher)) :has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-enable-zen-mode]):not(:has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-disable-zen-mode])) #browser #titlebar #pagetitle {
  pointer-events: all;
}
:root:has(#browser:is(.tabs-left, .tabs-right):not(.fullscreen, .minimal-ui), #browser.tabs-off:not(.fullscreen, .minimal-ui) #panels-container:not(.switcher)) :has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-enable-zen-mode]):not(:has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-disable-zen-mode])) #browser #webview-container {
  grid-column: 1/9999;
}
:root:has(#browser:is(.tabs-left, .tabs-right):not(.fullscreen, .minimal-ui), #browser.tabs-off:not(.fullscreen, .minimal-ui) #panels-container:not(.switcher)) :has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-enable-zen-mode]):not(:has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-disable-zen-mode])) #browser #main > .inner > .tabbar-wrapper,
:root:has(#browser:is(.tabs-left, .tabs-right):not(.fullscreen, .minimal-ui), #browser.tabs-off:not(.fullscreen, .minimal-ui) #panels-container:not(.switcher)) :has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-enable-zen-mode]):not(:has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-disable-zen-mode])) #browser #panels-container {
  position: relative;
}
:root:has(#browser:is(.tabs-left, .tabs-right):not(.fullscreen, .minimal-ui), #browser.tabs-off:not(.fullscreen, .minimal-ui) #panels-container:not(.switcher)) :has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-enable-zen-mode]):not(:has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-disable-zen-mode])) #browser #main > .inner > .tabbar-wrapper::after,
:root:has(#browser:is(.tabs-left, .tabs-right):not(.fullscreen, .minimal-ui), #browser.tabs-off:not(.fullscreen, .minimal-ui) #panels-container:not(.switcher)) :has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-enable-zen-mode]):not(:has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-disable-zen-mode])) #browser #panels-container::after {
  position: absolute;
  top: -100vh;
  height: 200vh;
  pointer-events: auto;
  z-index: 0;
}
:root:has(#browser:is(.tabs-left, .tabs-right):not(.fullscreen, .minimal-ui), #browser.tabs-off:not(.fullscreen, .minimal-ui) #panels-container:not(.switcher)) :has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-enable-zen-mode]):not(:has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-disable-zen-mode])) #browser #main > .inner > .tabbar-wrapper > *,
:root:has(#browser:is(.tabs-left, .tabs-right):not(.fullscreen, .minimal-ui), #browser.tabs-off:not(.fullscreen, .minimal-ui) #panels-container:not(.switcher)) :has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-enable-zen-mode]):not(:has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-disable-zen-mode])) #browser #panels-container > * {
  z-index: 1;
}
:root:has(#browser:is(.tabs-left, .tabs-right):not(.fullscreen, .minimal-ui), #browser.tabs-off:not(.fullscreen, .minimal-ui) #panels-container:not(.switcher)) :has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-enable-zen-mode]):not(:has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-disable-zen-mode])) #browser.tabs-left #main > .inner > .tabbar-wrapper::after,
:root:has(#browser:is(.tabs-left, .tabs-right):not(.fullscreen, .minimal-ui), #browser.tabs-off:not(.fullscreen, .minimal-ui) #panels-container:not(.switcher)) :has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-enable-zen-mode]):not(:has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-disable-zen-mode])) #browser #panels-container.left::after {
  left: 0;
  width: var(--vvh-zen-mode-hover-left-width);
  translate: var(--vvh-zen-mode-animation-translate-length);
  content: "";
}
:root:has(#browser:is(.tabs-left, .tabs-right):not(.fullscreen, .minimal-ui), #browser.tabs-off:not(.fullscreen, .minimal-ui) #panels-container:not(.switcher)) :has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-enable-zen-mode]):not(:has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-disable-zen-mode])) #browser.tabs-right #main > .inner > .tabbar-wrapper::after,
:root:has(#browser:is(.tabs-left, .tabs-right):not(.fullscreen, .minimal-ui), #browser.tabs-off:not(.fullscreen, .minimal-ui) #panels-container:not(.switcher)) :has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-enable-zen-mode]):not(:has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-disable-zen-mode])) #browser #panels-container.right::after {
  right: 0;
  width: var(--vvh-zen-mode-hover-right-width);
  translate: calc(-1 * var(--vvh-zen-mode-animation-translate-length));
  content: "";
}
:root:has(#browser:is(.tabs-left, .tabs-right):not(.fullscreen, .minimal-ui), #browser.tabs-off:not(.fullscreen, .minimal-ui) #panels-container:not(.switcher)) :has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-enable-zen-mode]):not(:has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-disable-zen-mode])) #browser.tabs-left #panels-container.left::after, :root:has(#browser:is(.tabs-left, .tabs-right):not(.fullscreen, .minimal-ui), #browser.tabs-off:not(.fullscreen, .minimal-ui) #panels-container:not(.switcher)) :has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-enable-zen-mode]):not(:has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-disable-zen-mode])) #browser.tabs-right #panels-container.right::after {
  content: unset;
}
:root:has(#browser:is(.tabs-left, .tabs-right):not(.fullscreen, .minimal-ui), #browser.tabs-off:not(.fullscreen, .minimal-ui) #panels-container:not(.switcher)) :has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-enable-zen-mode]):not(:has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-disable-zen-mode])) #browser #tabs-container .resize .tab-strip,
:root:has(#browser:is(.tabs-left, .tabs-right):not(.fullscreen, .minimal-ui), #browser.tabs-off:not(.fullscreen, .minimal-ui) #panels-container:not(.switcher)) :has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-enable-zen-mode]):not(:has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-disable-zen-mode])) #browser #tabs-container .resize .tab-position,
:root:has(#browser:is(.tabs-left, .tabs-right):not(.fullscreen, .minimal-ui), #browser.tabs-off:not(.fullscreen, .minimal-ui) #panels-container:not(.switcher)) :has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-enable-zen-mode]):not(:has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-disable-zen-mode])) #browser #tabs-container .resize .toolbar-tabbar {
  pointer-events: none;
}
:root:has(#browser:is(.tabs-left, .tabs-right):not(.fullscreen, .minimal-ui), #browser.tabs-off:not(.fullscreen, .minimal-ui) #panels-container:not(.switcher)) :has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-enable-zen-mode]):not(:has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-disable-zen-mode])) #browser #main .toolbar-mainbar,
:root:has(#browser:is(.tabs-left, .tabs-right):not(.fullscreen, .minimal-ui), #browser.tabs-off:not(.fullscreen, .minimal-ui) #panels-container:not(.switcher)) :has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-enable-zen-mode]):not(:has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-disable-zen-mode])) #browser #main .mainbar::before,
:root:has(#browser:is(.tabs-left, .tabs-right):not(.fullscreen, .minimal-ui), #browser.tabs-off:not(.fullscreen, .minimal-ui) #panels-container:not(.switcher)) :has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-enable-zen-mode]):not(:has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-disable-zen-mode])) #browser #main .bookmark-bar,
:root:has(#browser:is(.tabs-left, .tabs-right):not(.fullscreen, .minimal-ui), #browser.tabs-off:not(.fullscreen, .minimal-ui) #panels-container:not(.switcher)) :has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-enable-zen-mode]):not(:has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-disable-zen-mode])) #browser #main > .inner > .tabbar-wrapper,
:root:has(#browser:is(.tabs-left, .tabs-right):not(.fullscreen, .minimal-ui), #browser.tabs-off:not(.fullscreen, .minimal-ui) #panels-container:not(.switcher)) :has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-enable-zen-mode]):not(:has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-disable-zen-mode])) #browser footer:has(.toolbar-statusbar), :root:has(#browser:is(.tabs-left, .tabs-right):not(.fullscreen, .minimal-ui), #browser.tabs-off:not(.fullscreen, .minimal-ui) #panels-container:not(.switcher)) :has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-enable-zen-mode]):not(:has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-disable-zen-mode])) #browser.tabs-off #panels-container, :root:has(#browser:is(.tabs-left, .tabs-right):not(.fullscreen, .minimal-ui), #browser.tabs-off:not(.fullscreen, .minimal-ui) #panels-container:not(.switcher)) :has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-enable-zen-mode]):not(:has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-disable-zen-mode])) #browser:not(:has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-enable-titlebar-full-width]):not(:has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-disable-titlebar-full-width]))) #titlebar, :root:has(#browser:is(.tabs-left, .tabs-right):not(.fullscreen, .minimal-ui), #browser.tabs-off:not(.fullscreen, .minimal-ui) #panels-container:not(.switcher)) :has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-enable-zen-mode]):not(:has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-disable-zen-mode])) #browser:not(:has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-enable-titlebar-full-width]):not(:has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-disable-titlebar-full-width]))) #header .topmenu {
  translate: calc(var(--vvh-grid-pillar-left, 0) * -1 * var(--vvh-zen-mode-animation-translate-length) + var(--vvh-grid-pillar-right, 0) * var(--vvh-zen-mode-animation-translate-length));
  opacity: 0;
  z-index: 1;
  transition: translate var(--vvh-zen-mode-animation-duration) var(--vvh-zen-mode-animation-timing-function) var(--vvh-zen-mode-fade-out-animation-delay), opacity var(--vvh-zen-mode-animation-duration) var(--vvh-zen-mode-animation-timing-function) var(--vvh-zen-mode-fade-out-animation-delay);
  animation: 0s var(--vvh-zen-mode-animation-timing-function) calc(var(--vvh-zen-mode-animation-duration) + var(--vvh-zen-mode-fade-out-animation-delay)) disable-pointer-events;
  animation-fill-mode: forwards;
}
:root:has(#browser:is(.tabs-left, .tabs-right):not(.fullscreen, .minimal-ui), #browser.tabs-off:not(.fullscreen, .minimal-ui) #panels-container:not(.switcher)) :has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-enable-zen-mode]):not(:has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-disable-zen-mode])) #browser:not(:has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-disable-addressfield-extend-on-focus])) #main .toolbar-mainbar:has(.UrlBar-AddressField #urlFieldInput),
:root:has(#browser:is(.tabs-left, .tabs-right):not(.fullscreen, .minimal-ui), #browser.tabs-off:not(.fullscreen, .minimal-ui) #panels-container:not(.switcher)) :has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-enable-zen-mode]):not(:has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-disable-zen-mode])) #browser:not(:has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-disable-addressfield-extend-on-focus])) footer:has(.toolbar-statusbar):has(.UrlBar-AddressField #urlFieldInput) {
  transition: translate var(--vvh-zen-mode-animation-duration) var(--vvh-zen-mode-animation-timing-function) var(--vvh-zen-mode-fade-out-animation-delay), opacity var(--vvh-zen-mode-animation-duration) var(--vvh-zen-mode-animation-timing-function) var(--vvh-zen-mode-fade-out-animation-delay), z-index 0s 0.2s;
}
:root:has(#browser:is(.tabs-left, .tabs-right):not(.fullscreen, .minimal-ui), #browser.tabs-off:not(.fullscreen, .minimal-ui) #panels-container:not(.switcher)) :has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-enable-zen-mode]):not(:has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-disable-zen-mode])) #browser:not(:has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-disable-addressfield-extend-on-focus])) #main .toolbar-mainbar:has(.UrlBar-AddressField #urlFieldInput:focus),
:root:has(#browser:is(.tabs-left, .tabs-right):not(.fullscreen, .minimal-ui), #browser.tabs-off:not(.fullscreen, .minimal-ui) #panels-container:not(.switcher)) :has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-enable-zen-mode]):not(:has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-disable-zen-mode])) #browser:not(:has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-disable-addressfield-extend-on-focus])) footer:has(.toolbar-statusbar):has(.UrlBar-AddressField #urlFieldInput:focus) {
  transition: translate var(--vvh-zen-mode-animation-duration) var(--vvh-zen-mode-animation-timing-function) var(--vvh-zen-mode-fade-out-animation-delay), opacity var(--vvh-zen-mode-animation-duration) var(--vvh-zen-mode-animation-timing-function) var(--vvh-zen-mode-fade-out-animation-delay), z-index 0s 0s;
}
:root:has(#browser:is(.tabs-left, .tabs-right):not(.fullscreen, .minimal-ui), #browser.tabs-off:not(.fullscreen, .minimal-ui) #panels-container:not(.switcher)) :has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-enable-zen-mode]):not(:has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-disable-zen-mode])) #browser:has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-enable-searchfield-extend-on-focus]):not(:has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-disable-searchfield-extend-on-focus])) #main .toolbar-mainbar:has(.UrlBar-SearchField .searchfield-input),
:root:has(#browser:is(.tabs-left, .tabs-right):not(.fullscreen, .minimal-ui), #browser.tabs-off:not(.fullscreen, .minimal-ui) #panels-container:not(.switcher)) :has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-enable-zen-mode]):not(:has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-disable-zen-mode])) #browser:has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-enable-searchfield-extend-on-focus]):not(:has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-disable-searchfield-extend-on-focus])) footer:has(.toolbar-statusbar):has(.UrlBar-SearchField .searchfield-input) {
  transition: translate var(--vvh-zen-mode-animation-duration) var(--vvh-zen-mode-animation-timing-function) var(--vvh-zen-mode-fade-out-animation-delay), opacity var(--vvh-zen-mode-animation-duration) var(--vvh-zen-mode-animation-timing-function) var(--vvh-zen-mode-fade-out-animation-delay), z-index 0s 0.2s;
}
:root:has(#browser:is(.tabs-left, .tabs-right):not(.fullscreen, .minimal-ui), #browser.tabs-off:not(.fullscreen, .minimal-ui) #panels-container:not(.switcher)) :has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-enable-zen-mode]):not(:has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-disable-zen-mode])) #browser:has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-enable-searchfield-extend-on-focus]):not(:has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-disable-searchfield-extend-on-focus])) #main .toolbar-mainbar:has(.UrlBar-SearchField .searchfield-input:focus),
:root:has(#browser:is(.tabs-left, .tabs-right):not(.fullscreen, .minimal-ui), #browser.tabs-off:not(.fullscreen, .minimal-ui) #panels-container:not(.switcher)) :has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-enable-zen-mode]):not(:has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-disable-zen-mode])) #browser:has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-enable-searchfield-extend-on-focus]):not(:has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-disable-searchfield-extend-on-focus])) footer:has(.toolbar-statusbar):has(.UrlBar-SearchField .searchfield-input:focus) {
  transition: translate var(--vvh-zen-mode-animation-duration) var(--vvh-zen-mode-animation-timing-function) var(--vvh-zen-mode-fade-out-animation-delay), opacity var(--vvh-zen-mode-animation-duration) var(--vvh-zen-mode-animation-timing-function) var(--vvh-zen-mode-fade-out-animation-delay), z-index 0s 0s;
}
:root:has(#browser:is(.tabs-left, .tabs-right):not(.fullscreen, .minimal-ui), #browser.tabs-off:not(.fullscreen, .minimal-ui) #panels-container:not(.switcher)) :has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-enable-zen-mode]):not(:has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-disable-zen-mode])) #browser #panels-container {
  transition: width var(--duration) ease-out, translate var(--vvh-zen-mode-animation-duration) var(--vvh-zen-mode-animation-timing-function) var(--vvh-zen-mode-fade-out-animation-delay), opacity var(--vvh-zen-mode-animation-duration) var(--vvh-zen-mode-animation-timing-function) var(--vvh-zen-mode-fade-out-animation-delay) !important;
}
:root:has(#browser:is(.tabs-left, .tabs-right):not(.fullscreen, .minimal-ui), #browser.tabs-off:not(.fullscreen, .minimal-ui) #panels-container:not(.switcher)) :has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-enable-zen-mode]):not(:has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-disable-zen-mode])) #browser:not(:has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-enable-titlebar-full-width]):not(:has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-disable-titlebar-full-width]))) #titlebar, :root:has(#browser:is(.tabs-left, .tabs-right):not(.fullscreen, .minimal-ui), #browser.tabs-off:not(.fullscreen, .minimal-ui) #panels-container:not(.switcher)) :has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-enable-zen-mode]):not(:has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-disable-zen-mode])) #browser:not(:has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-enable-titlebar-full-width]):not(:has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-disable-titlebar-full-width]))) #header .topmenu {
  z-index: 2;
}
:root:has(#browser:is(.tabs-left, .tabs-right):not(.fullscreen, .minimal-ui), #browser.tabs-off:not(.fullscreen, .minimal-ui) #panels-container:not(.switcher)) :has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-enable-zen-mode]):not(:has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-disable-zen-mode])) #browser #panels-container {
  z-index: 2 !important;
}
:root:has(#browser:is(.tabs-left, .tabs-right):not(.fullscreen, .minimal-ui), #browser.tabs-off:not(.fullscreen, .minimal-ui) #panels-container:not(.switcher)) :has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-enable-zen-mode]):not(:has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-disable-zen-mode])) #browser #main .toolbar-mainbar,
:root:has(#browser:is(.tabs-left, .tabs-right):not(.fullscreen, .minimal-ui), #browser.tabs-off:not(.fullscreen, .minimal-ui) #panels-container:not(.switcher)) :has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-enable-zen-mode]):not(:has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-disable-zen-mode])) #browser footer:has(.toolbar-statusbar) {
  z-index: 3 !important;
}
:root:has(#browser:is(.tabs-left, .tabs-right):not(.fullscreen, .minimal-ui), #browser.tabs-off:not(.fullscreen, .minimal-ui) #panels-container:not(.switcher)) :has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-enable-zen-mode]):not(:has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-disable-zen-mode])) #browser.tabs-left:has(#panels-container.right) #panels-container, :root:has(#browser:is(.tabs-left, .tabs-right):not(.fullscreen, .minimal-ui), #browser.tabs-off:not(.fullscreen, .minimal-ui) #panels-container:not(.switcher)) :has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-enable-zen-mode]):not(:has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-disable-zen-mode])) #browser.tabs-right:has(#panels-container.left) #panels-container {
  z-index: 4 !important;
}
:root:has(#browser:is(.tabs-left, .tabs-right):not(.fullscreen, .minimal-ui), #browser.tabs-off:not(.fullscreen, .minimal-ui) #panels-container:not(.switcher)) :has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-enable-zen-mode]):not(:has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-disable-zen-mode])) #browser:not(.tabs-off) #panels-container {
  translate: calc(var(--vvh-grid-panel-left, 0) * -1 * var(--vvh-zen-mode-animation-translate-length) + var(--vvh-grid-panel-right, 0) * var(--vvh-zen-mode-animation-translate-length));
  opacity: 0;
  z-index: 1;
  transition: translate var(--vvh-zen-mode-animation-duration) var(--vvh-zen-mode-animation-timing-function) var(--vvh-zen-mode-fade-out-animation-delay), opacity var(--vvh-zen-mode-animation-duration) var(--vvh-zen-mode-animation-timing-function) var(--vvh-zen-mode-fade-out-animation-delay);
  animation: 0s var(--vvh-zen-mode-animation-timing-function) calc(var(--vvh-zen-mode-animation-duration) + var(--vvh-zen-mode-fade-out-animation-delay)) disable-pointer-events;
  animation-fill-mode: forwards;
}
@keyframes disable-pointer-events {
  0%, 99% {
    pointer-events: auto;
  }
  100% {
    pointer-events: none;
  }
}
@keyframes enable-pointer-events {
  0%, 99% {
    pointer-events: none;
  }
  100% {
    pointer-events: auto;
  }
}
:root:has(#browser:is(.tabs-left, .tabs-right):not(.fullscreen, .minimal-ui), #browser.tabs-off:not(.fullscreen, .minimal-ui) #panels-container:not(.switcher)) :has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-enable-zen-mode]):not(:has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-disable-zen-mode])) #browser.toolbar-edit-mode #main > .inner > .tabbar-wrapper::after,
:root:has(#browser:is(.tabs-left, .tabs-right):not(.fullscreen, .minimal-ui), #browser.tabs-off:not(.fullscreen, .minimal-ui) #panels-container:not(.switcher)) :has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-enable-zen-mode]):not(:has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-disable-zen-mode])) #browser.toolbar-edit-mode #panels-container::after,
:root:has(#browser:is(.tabs-left, .tabs-right):not(.fullscreen, .minimal-ui), #browser.tabs-off:not(.fullscreen, .minimal-ui) #panels-container:not(.switcher)) :has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-enable-zen-mode]):not(:has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-disable-zen-mode])) #browser:has(#main > .inner > .tabbar-wrapper:hover,
#panels-container:hover,
> .button-popup,
> #vivaldi-tooltip:not(:empty),
#main .toolbar-mainbar > :hover, #main .toolbar-mainbar:focus-within,
#main .bookmark-bar > :hover, #main .bookmark-bar:focus-within,
#main > .inner > .tabbar-wrapper > :hover, #main > .inner > .tabbar-wrapper:focus-within,
footer:hover .toolbar-statusbar, footer:focus-within .toolbar-statusbar,
#panels-container > :hover, #panels-container:focus-within,
#panels-container:not(.icons, .switcher)) #main > .inner > .tabbar-wrapper::after,
:root:has(#browser:is(.tabs-left, .tabs-right):not(.fullscreen, .minimal-ui), #browser.tabs-off:not(.fullscreen, .minimal-ui) #panels-container:not(.switcher)) :has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-enable-zen-mode]):not(:has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-disable-zen-mode])) #browser:has(#main > .inner > .tabbar-wrapper:hover,
#panels-container:hover,
> .button-popup,
> #vivaldi-tooltip:not(:empty),
#main .toolbar-mainbar > :hover, #main .toolbar-mainbar:focus-within,
#main .bookmark-bar > :hover, #main .bookmark-bar:focus-within,
#main > .inner > .tabbar-wrapper > :hover, #main > .inner > .tabbar-wrapper:focus-within,
footer:hover .toolbar-statusbar, footer:focus-within .toolbar-statusbar,
#panels-container > :hover, #panels-container:focus-within,
#panels-container:not(.icons, .switcher)) #panels-container::after,
:root:has(#browser:is(.tabs-left, .tabs-right):not(.fullscreen, .minimal-ui), #browser.tabs-off:not(.fullscreen, .minimal-ui) #panels-container:not(.switcher)) :has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-enable-zen-mode]):not(:has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-disable-zen-mode])) #browser:not(:has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-enable-titlebar-full-width]):not(:has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-disable-titlebar-full-width]))):has(#titlebar > :hover, #titlebar:focus-within,
#header .topmenu > :hover, #header .topmenu:focus-within) #main > .inner > .tabbar-wrapper::after,
:root:has(#browser:is(.tabs-left, .tabs-right):not(.fullscreen, .minimal-ui), #browser.tabs-off:not(.fullscreen, .minimal-ui) #panels-container:not(.switcher)) :has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-enable-zen-mode]):not(:has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-disable-zen-mode])) #browser:not(:has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-enable-titlebar-full-width]):not(:has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-disable-titlebar-full-width]))):has(#titlebar > :hover, #titlebar:focus-within,
#header .topmenu > :hover, #header .topmenu:focus-within) #panels-container::after {
  content: unset;
}
:root:has(#browser:is(.tabs-left, .tabs-right):not(.fullscreen, .minimal-ui), #browser.tabs-off:not(.fullscreen, .minimal-ui) #panels-container:not(.switcher)) :has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-enable-zen-mode]):not(:has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-disable-zen-mode])) #browser.toolbar-edit-mode #tabs-container .resize .tab-strip,
:root:has(#browser:is(.tabs-left, .tabs-right):not(.fullscreen, .minimal-ui), #browser.tabs-off:not(.fullscreen, .minimal-ui) #panels-container:not(.switcher)) :has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-enable-zen-mode]):not(:has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-disable-zen-mode])) #browser.toolbar-edit-mode #tabs-container .resize .tab-position,
:root:has(#browser:is(.tabs-left, .tabs-right):not(.fullscreen, .minimal-ui), #browser.tabs-off:not(.fullscreen, .minimal-ui) #panels-container:not(.switcher)) :has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-enable-zen-mode]):not(:has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-disable-zen-mode])) #browser.toolbar-edit-mode #tabs-container .resize .toolbar-tabbar,
:root:has(#browser:is(.tabs-left, .tabs-right):not(.fullscreen, .minimal-ui), #browser.tabs-off:not(.fullscreen, .minimal-ui) #panels-container:not(.switcher)) :has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-enable-zen-mode]):not(:has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-disable-zen-mode])) #browser:has(#main > .inner > .tabbar-wrapper:hover,
#panels-container:hover,
> .button-popup,
> #vivaldi-tooltip:not(:empty),
#main .toolbar-mainbar > :hover, #main .toolbar-mainbar:focus-within,
#main .bookmark-bar > :hover, #main .bookmark-bar:focus-within,
#main > .inner > .tabbar-wrapper > :hover, #main > .inner > .tabbar-wrapper:focus-within,
footer:hover .toolbar-statusbar, footer:focus-within .toolbar-statusbar,
#panels-container > :hover, #panels-container:focus-within,
#panels-container:not(.icons, .switcher)) #tabs-container .resize .tab-strip,
:root:has(#browser:is(.tabs-left, .tabs-right):not(.fullscreen, .minimal-ui), #browser.tabs-off:not(.fullscreen, .minimal-ui) #panels-container:not(.switcher)) :has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-enable-zen-mode]):not(:has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-disable-zen-mode])) #browser:has(#main > .inner > .tabbar-wrapper:hover,
#panels-container:hover,
> .button-popup,
> #vivaldi-tooltip:not(:empty),
#main .toolbar-mainbar > :hover, #main .toolbar-mainbar:focus-within,
#main .bookmark-bar > :hover, #main .bookmark-bar:focus-within,
#main > .inner > .tabbar-wrapper > :hover, #main > .inner > .tabbar-wrapper:focus-within,
footer:hover .toolbar-statusbar, footer:focus-within .toolbar-statusbar,
#panels-container > :hover, #panels-container:focus-within,
#panels-container:not(.icons, .switcher)) #tabs-container .resize .tab-position,
:root:has(#browser:is(.tabs-left, .tabs-right):not(.fullscreen, .minimal-ui), #browser.tabs-off:not(.fullscreen, .minimal-ui) #panels-container:not(.switcher)) :has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-enable-zen-mode]):not(:has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-disable-zen-mode])) #browser:has(#main > .inner > .tabbar-wrapper:hover,
#panels-container:hover,
> .button-popup,
> #vivaldi-tooltip:not(:empty),
#main .toolbar-mainbar > :hover, #main .toolbar-mainbar:focus-within,
#main .bookmark-bar > :hover, #main .bookmark-bar:focus-within,
#main > .inner > .tabbar-wrapper > :hover, #main > .inner > .tabbar-wrapper:focus-within,
footer:hover .toolbar-statusbar, footer:focus-within .toolbar-statusbar,
#panels-container > :hover, #panels-container:focus-within,
#panels-container:not(.icons, .switcher)) #tabs-container .resize .toolbar-tabbar,
:root:has(#browser:is(.tabs-left, .tabs-right):not(.fullscreen, .minimal-ui), #browser.tabs-off:not(.fullscreen, .minimal-ui) #panels-container:not(.switcher)) :has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-enable-zen-mode]):not(:has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-disable-zen-mode])) #browser:not(:has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-enable-titlebar-full-width]):not(:has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-disable-titlebar-full-width]))):has(#titlebar > :hover, #titlebar:focus-within,
#header .topmenu > :hover, #header .topmenu:focus-within) #tabs-container .resize .tab-strip,
:root:has(#browser:is(.tabs-left, .tabs-right):not(.fullscreen, .minimal-ui), #browser.tabs-off:not(.fullscreen, .minimal-ui) #panels-container:not(.switcher)) :has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-enable-zen-mode]):not(:has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-disable-zen-mode])) #browser:not(:has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-enable-titlebar-full-width]):not(:has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-disable-titlebar-full-width]))):has(#titlebar > :hover, #titlebar:focus-within,
#header .topmenu > :hover, #header .topmenu:focus-within) #tabs-container .resize .tab-position,
:root:has(#browser:is(.tabs-left, .tabs-right):not(.fullscreen, .minimal-ui), #browser.tabs-off:not(.fullscreen, .minimal-ui) #panels-container:not(.switcher)) :has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-enable-zen-mode]):not(:has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-disable-zen-mode])) #browser:not(:has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-enable-titlebar-full-width]):not(:has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-disable-titlebar-full-width]))):has(#titlebar > :hover, #titlebar:focus-within,
#header .topmenu > :hover, #header .topmenu:focus-within) #tabs-container .resize .toolbar-tabbar {
  animation: 0s linear var(--vvh-zen-mode-fade-in-animation-delay) enable-pointer-events;
  animation-fill-mode: forwards;
}
:root:has(#browser:is(.tabs-left, .tabs-right):not(.fullscreen, .minimal-ui), #browser.tabs-off:not(.fullscreen, .minimal-ui) #panels-container:not(.switcher)) :has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-enable-zen-mode]):not(:has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-disable-zen-mode])) #browser.toolbar-edit-mode:not(:has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-enable-titlebar-full-width]):not(:has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-disable-titlebar-full-width]))) #titlebar, :root:has(#browser:is(.tabs-left, .tabs-right):not(.fullscreen, .minimal-ui), #browser.tabs-off:not(.fullscreen, .minimal-ui) #panels-container:not(.switcher)) :has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-enable-zen-mode]):not(:has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-disable-zen-mode])) #browser.toolbar-edit-mode:not(:has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-enable-titlebar-full-width]):not(:has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-disable-titlebar-full-width]))) #header .topmenu,
:root:has(#browser:is(.tabs-left, .tabs-right):not(.fullscreen, .minimal-ui), #browser.tabs-off:not(.fullscreen, .minimal-ui) #panels-container:not(.switcher)) :has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-enable-zen-mode]):not(:has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-disable-zen-mode])) #browser.toolbar-edit-mode #main .toolbar-mainbar,
:root:has(#browser:is(.tabs-left, .tabs-right):not(.fullscreen, .minimal-ui), #browser.tabs-off:not(.fullscreen, .minimal-ui) #panels-container:not(.switcher)) :has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-enable-zen-mode]):not(:has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-disable-zen-mode])) #browser.toolbar-edit-mode #main .mainbar::before,
:root:has(#browser:is(.tabs-left, .tabs-right):not(.fullscreen, .minimal-ui), #browser.tabs-off:not(.fullscreen, .minimal-ui) #panels-container:not(.switcher)) :has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-enable-zen-mode]):not(:has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-disable-zen-mode])) #browser.toolbar-edit-mode #main .bookmark-bar,
:root:has(#browser:is(.tabs-left, .tabs-right):not(.fullscreen, .minimal-ui), #browser.tabs-off:not(.fullscreen, .minimal-ui) #panels-container:not(.switcher)) :has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-enable-zen-mode]):not(:has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-disable-zen-mode])) #browser.toolbar-edit-mode #main > .inner > .tabbar-wrapper,
:root:has(#browser:is(.tabs-left, .tabs-right):not(.fullscreen, .minimal-ui), #browser.tabs-off:not(.fullscreen, .minimal-ui) #panels-container:not(.switcher)) :has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-enable-zen-mode]):not(:has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-disable-zen-mode])) #browser.toolbar-edit-mode footer:has(.toolbar-statusbar), :root:has(#browser:is(.tabs-left, .tabs-right):not(.fullscreen, .minimal-ui), #browser.tabs-off:not(.fullscreen, .minimal-ui) #panels-container:not(.switcher)) :has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-enable-zen-mode]):not(:has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-disable-zen-mode])) #browser.toolbar-edit-mode.tabs-off #panels-container,
:root:has(#browser:is(.tabs-left, .tabs-right):not(.fullscreen, .minimal-ui), #browser.tabs-off:not(.fullscreen, .minimal-ui) #panels-container:not(.switcher)) :has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-enable-zen-mode]):not(:has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-disable-zen-mode])) #browser:has(#main > .inner > .tabbar-wrapper:hover,
#panels-container:hover,
> .button-popup,
> #vivaldi-tooltip:not(:empty),
#main .toolbar-mainbar > :hover, #main .toolbar-mainbar:focus-within,
#main .bookmark-bar > :hover, #main .bookmark-bar:focus-within,
#main > .inner > .tabbar-wrapper > :hover, #main > .inner > .tabbar-wrapper:focus-within,
footer:hover .toolbar-statusbar, footer:focus-within .toolbar-statusbar,
#panels-container > :hover, #panels-container:focus-within,
#panels-container:not(.icons, .switcher)):not(:has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-enable-titlebar-full-width]):not(:has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-disable-titlebar-full-width]))) #titlebar,
:root:has(#browser:is(.tabs-left, .tabs-right):not(.fullscreen, .minimal-ui), #browser.tabs-off:not(.fullscreen, .minimal-ui) #panels-container:not(.switcher)) :has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-enable-zen-mode]):not(:has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-disable-zen-mode])) #browser:has(#main > .inner > .tabbar-wrapper:hover,
#panels-container:hover,
> .button-popup,
> #vivaldi-tooltip:not(:empty),
#main .toolbar-mainbar > :hover, #main .toolbar-mainbar:focus-within,
#main .bookmark-bar > :hover, #main .bookmark-bar:focus-within,
#main > .inner > .tabbar-wrapper > :hover, #main > .inner > .tabbar-wrapper:focus-within,
footer:hover .toolbar-statusbar, footer:focus-within .toolbar-statusbar,
#panels-container > :hover, #panels-container:focus-within,
#panels-container:not(.icons, .switcher)):not(:has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-enable-titlebar-full-width]):not(:has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-disable-titlebar-full-width]))) #header .topmenu,
:root:has(#browser:is(.tabs-left, .tabs-right):not(.fullscreen, .minimal-ui), #browser.tabs-off:not(.fullscreen, .minimal-ui) #panels-container:not(.switcher)) :has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-enable-zen-mode]):not(:has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-disable-zen-mode])) #browser:has(#main > .inner > .tabbar-wrapper:hover,
#panels-container:hover,
> .button-popup,
> #vivaldi-tooltip:not(:empty),
#main .toolbar-mainbar > :hover, #main .toolbar-mainbar:focus-within,
#main .bookmark-bar > :hover, #main .bookmark-bar:focus-within,
#main > .inner > .tabbar-wrapper > :hover, #main > .inner > .tabbar-wrapper:focus-within,
footer:hover .toolbar-statusbar, footer:focus-within .toolbar-statusbar,
#panels-container > :hover, #panels-container:focus-within,
#panels-container:not(.icons, .switcher)) #main .toolbar-mainbar,
:root:has(#browser:is(.tabs-left, .tabs-right):not(.fullscreen, .minimal-ui), #browser.tabs-off:not(.fullscreen, .minimal-ui) #panels-container:not(.switcher)) :has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-enable-zen-mode]):not(:has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-disable-zen-mode])) #browser:has(#main > .inner > .tabbar-wrapper:hover,
#panels-container:hover,
> .button-popup,
> #vivaldi-tooltip:not(:empty),
#main .toolbar-mainbar > :hover, #main .toolbar-mainbar:focus-within,
#main .bookmark-bar > :hover, #main .bookmark-bar:focus-within,
#main > .inner > .tabbar-wrapper > :hover, #main > .inner > .tabbar-wrapper:focus-within,
footer:hover .toolbar-statusbar, footer:focus-within .toolbar-statusbar,
#panels-container > :hover, #panels-container:focus-within,
#panels-container:not(.icons, .switcher)) #main .mainbar::before,
:root:has(#browser:is(.tabs-left, .tabs-right):not(.fullscreen, .minimal-ui), #browser.tabs-off:not(.fullscreen, .minimal-ui) #panels-container:not(.switcher)) :has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-enable-zen-mode]):not(:has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-disable-zen-mode])) #browser:has(#main > .inner > .tabbar-wrapper:hover,
#panels-container:hover,
> .button-popup,
> #vivaldi-tooltip:not(:empty),
#main .toolbar-mainbar > :hover, #main .toolbar-mainbar:focus-within,
#main .bookmark-bar > :hover, #main .bookmark-bar:focus-within,
#main > .inner > .tabbar-wrapper > :hover, #main > .inner > .tabbar-wrapper:focus-within,
footer:hover .toolbar-statusbar, footer:focus-within .toolbar-statusbar,
#panels-container > :hover, #panels-container:focus-within,
#panels-container:not(.icons, .switcher)) #main .bookmark-bar,
:root:has(#browser:is(.tabs-left, .tabs-right):not(.fullscreen, .minimal-ui), #browser.tabs-off:not(.fullscreen, .minimal-ui) #panels-container:not(.switcher)) :has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-enable-zen-mode]):not(:has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-disable-zen-mode])) #browser:has(#main > .inner > .tabbar-wrapper:hover,
#panels-container:hover,
> .button-popup,
> #vivaldi-tooltip:not(:empty),
#main .toolbar-mainbar > :hover, #main .toolbar-mainbar:focus-within,
#main .bookmark-bar > :hover, #main .bookmark-bar:focus-within,
#main > .inner > .tabbar-wrapper > :hover, #main > .inner > .tabbar-wrapper:focus-within,
footer:hover .toolbar-statusbar, footer:focus-within .toolbar-statusbar,
#panels-container > :hover, #panels-container:focus-within,
#panels-container:not(.icons, .switcher)) #main > .inner > .tabbar-wrapper,
:root:has(#browser:is(.tabs-left, .tabs-right):not(.fullscreen, .minimal-ui), #browser.tabs-off:not(.fullscreen, .minimal-ui) #panels-container:not(.switcher)) :has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-enable-zen-mode]):not(:has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-disable-zen-mode])) #browser:has(#main > .inner > .tabbar-wrapper:hover,
#panels-container:hover,
> .button-popup,
> #vivaldi-tooltip:not(:empty),
#main .toolbar-mainbar > :hover, #main .toolbar-mainbar:focus-within,
#main .bookmark-bar > :hover, #main .bookmark-bar:focus-within,
#main > .inner > .tabbar-wrapper > :hover, #main > .inner > .tabbar-wrapper:focus-within,
footer:hover .toolbar-statusbar, footer:focus-within .toolbar-statusbar,
#panels-container > :hover, #panels-container:focus-within,
#panels-container:not(.icons, .switcher)) footer:has(.toolbar-statusbar),
:root:has(#browser:is(.tabs-left, .tabs-right):not(.fullscreen, .minimal-ui), #browser.tabs-off:not(.fullscreen, .minimal-ui) #panels-container:not(.switcher)) :has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-enable-zen-mode]):not(:has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-disable-zen-mode])) #browser:has(#main > .inner > .tabbar-wrapper:hover,
#panels-container:hover,
> .button-popup,
> #vivaldi-tooltip:not(:empty),
#main .toolbar-mainbar > :hover, #main .toolbar-mainbar:focus-within,
#main .bookmark-bar > :hover, #main .bookmark-bar:focus-within,
#main > .inner > .tabbar-wrapper > :hover, #main > .inner > .tabbar-wrapper:focus-within,
footer:hover .toolbar-statusbar, footer:focus-within .toolbar-statusbar,
#panels-container > :hover, #panels-container:focus-within,
#panels-container:not(.icons, .switcher)).tabs-off #panels-container,
:root:has(#browser:is(.tabs-left, .tabs-right):not(.fullscreen, .minimal-ui), #browser.tabs-off:not(.fullscreen, .minimal-ui) #panels-container:not(.switcher)) :has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-enable-zen-mode]):not(:has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-disable-zen-mode])) #browser:not(:has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-enable-titlebar-full-width]):not(:has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-disable-titlebar-full-width]))):has(#titlebar > :hover, #titlebar:focus-within,
#header .topmenu > :hover, #header .topmenu:focus-within):not(:has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-enable-titlebar-full-width]):not(:has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-disable-titlebar-full-width]))) #titlebar,
:root:has(#browser:is(.tabs-left, .tabs-right):not(.fullscreen, .minimal-ui), #browser.tabs-off:not(.fullscreen, .minimal-ui) #panels-container:not(.switcher)) :has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-enable-zen-mode]):not(:has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-disable-zen-mode])) #browser:not(:has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-enable-titlebar-full-width]):not(:has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-disable-titlebar-full-width]))):has(#titlebar > :hover, #titlebar:focus-within,
#header .topmenu > :hover, #header .topmenu:focus-within):not(:has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-enable-titlebar-full-width]):not(:has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-disable-titlebar-full-width]))) #header .topmenu,
:root:has(#browser:is(.tabs-left, .tabs-right):not(.fullscreen, .minimal-ui), #browser.tabs-off:not(.fullscreen, .minimal-ui) #panels-container:not(.switcher)) :has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-enable-zen-mode]):not(:has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-disable-zen-mode])) #browser:not(:has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-enable-titlebar-full-width]):not(:has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-disable-titlebar-full-width]))):has(#titlebar > :hover, #titlebar:focus-within,
#header .topmenu > :hover, #header .topmenu:focus-within) #main .toolbar-mainbar,
:root:has(#browser:is(.tabs-left, .tabs-right):not(.fullscreen, .minimal-ui), #browser.tabs-off:not(.fullscreen, .minimal-ui) #panels-container:not(.switcher)) :has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-enable-zen-mode]):not(:has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-disable-zen-mode])) #browser:not(:has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-enable-titlebar-full-width]):not(:has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-disable-titlebar-full-width]))):has(#titlebar > :hover, #titlebar:focus-within,
#header .topmenu > :hover, #header .topmenu:focus-within) #main .mainbar::before,
:root:has(#browser:is(.tabs-left, .tabs-right):not(.fullscreen, .minimal-ui), #browser.tabs-off:not(.fullscreen, .minimal-ui) #panels-container:not(.switcher)) :has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-enable-zen-mode]):not(:has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-disable-zen-mode])) #browser:not(:has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-enable-titlebar-full-width]):not(:has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-disable-titlebar-full-width]))):has(#titlebar > :hover, #titlebar:focus-within,
#header .topmenu > :hover, #header .topmenu:focus-within) #main .bookmark-bar,
:root:has(#browser:is(.tabs-left, .tabs-right):not(.fullscreen, .minimal-ui), #browser.tabs-off:not(.fullscreen, .minimal-ui) #panels-container:not(.switcher)) :has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-enable-zen-mode]):not(:has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-disable-zen-mode])) #browser:not(:has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-enable-titlebar-full-width]):not(:has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-disable-titlebar-full-width]))):has(#titlebar > :hover, #titlebar:focus-within,
#header .topmenu > :hover, #header .topmenu:focus-within) #main > .inner > .tabbar-wrapper,
:root:has(#browser:is(.tabs-left, .tabs-right):not(.fullscreen, .minimal-ui), #browser.tabs-off:not(.fullscreen, .minimal-ui) #panels-container:not(.switcher)) :has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-enable-zen-mode]):not(:has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-disable-zen-mode])) #browser:not(:has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-enable-titlebar-full-width]):not(:has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-disable-titlebar-full-width]))):has(#titlebar > :hover, #titlebar:focus-within,
#header .topmenu > :hover, #header .topmenu:focus-within) footer:has(.toolbar-statusbar),
:root:has(#browser:is(.tabs-left, .tabs-right):not(.fullscreen, .minimal-ui), #browser.tabs-off:not(.fullscreen, .minimal-ui) #panels-container:not(.switcher)) :has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-enable-zen-mode]):not(:has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-disable-zen-mode])) #browser:not(:has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-enable-titlebar-full-width]):not(:has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-disable-titlebar-full-width]))):has(#titlebar > :hover, #titlebar:focus-within,
#header .topmenu > :hover, #header .topmenu:focus-within).tabs-off #panels-container {
  translate: 0;
  opacity: 1;
  transition: translate var(--vvh-zen-mode-animation-duration) var(--vvh-zen-mode-animation-timing-function) var(--vvh-zen-mode-fade-in-animation-delay), opacity var(--vvh-zen-mode-animation-duration) var(--vvh-zen-mode-animation-timing-function) var(--vvh-zen-mode-fade-in-animation-delay);
  animation: 0s linear var(--vvh-zen-mode-fade-in-animation-delay) enable-pointer-events;
  animation-fill-mode: forwards;
}
:root:has(#browser:is(.tabs-left, .tabs-right):not(.fullscreen, .minimal-ui), #browser.tabs-off:not(.fullscreen, .minimal-ui) #panels-container:not(.switcher)) :has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-enable-zen-mode]):not(:has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-disable-zen-mode])) #browser.toolbar-edit-mode:not(:has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-disable-addressfield-extend-on-focus])) #main .toolbar-mainbar:has(.UrlBar-AddressField #urlFieldInput),
:root:has(#browser:is(.tabs-left, .tabs-right):not(.fullscreen, .minimal-ui), #browser.tabs-off:not(.fullscreen, .minimal-ui) #panels-container:not(.switcher)) :has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-enable-zen-mode]):not(:has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-disable-zen-mode])) #browser.toolbar-edit-mode:not(:has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-disable-addressfield-extend-on-focus])) footer:has(.toolbar-statusbar):has(.UrlBar-AddressField #urlFieldInput),
:root:has(#browser:is(.tabs-left, .tabs-right):not(.fullscreen, .minimal-ui), #browser.tabs-off:not(.fullscreen, .minimal-ui) #panels-container:not(.switcher)) :has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-enable-zen-mode]):not(:has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-disable-zen-mode])) #browser:has(#main > .inner > .tabbar-wrapper:hover,
#panels-container:hover,
> .button-popup,
> #vivaldi-tooltip:not(:empty),
#main .toolbar-mainbar > :hover, #main .toolbar-mainbar:focus-within,
#main .bookmark-bar > :hover, #main .bookmark-bar:focus-within,
#main > .inner > .tabbar-wrapper > :hover, #main > .inner > .tabbar-wrapper:focus-within,
footer:hover .toolbar-statusbar, footer:focus-within .toolbar-statusbar,
#panels-container > :hover, #panels-container:focus-within,
#panels-container:not(.icons, .switcher)):not(:has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-disable-addressfield-extend-on-focus])) #main .toolbar-mainbar:has(.UrlBar-AddressField #urlFieldInput),
:root:has(#browser:is(.tabs-left, .tabs-right):not(.fullscreen, .minimal-ui), #browser.tabs-off:not(.fullscreen, .minimal-ui) #panels-container:not(.switcher)) :has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-enable-zen-mode]):not(:has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-disable-zen-mode])) #browser:has(#main > .inner > .tabbar-wrapper:hover,
#panels-container:hover,
> .button-popup,
> #vivaldi-tooltip:not(:empty),
#main .toolbar-mainbar > :hover, #main .toolbar-mainbar:focus-within,
#main .bookmark-bar > :hover, #main .bookmark-bar:focus-within,
#main > .inner > .tabbar-wrapper > :hover, #main > .inner > .tabbar-wrapper:focus-within,
footer:hover .toolbar-statusbar, footer:focus-within .toolbar-statusbar,
#panels-container > :hover, #panels-container:focus-within,
#panels-container:not(.icons, .switcher)):not(:has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-disable-addressfield-extend-on-focus])) footer:has(.toolbar-statusbar):has(.UrlBar-AddressField #urlFieldInput),
:root:has(#browser:is(.tabs-left, .tabs-right):not(.fullscreen, .minimal-ui), #browser.tabs-off:not(.fullscreen, .minimal-ui) #panels-container:not(.switcher)) :has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-enable-zen-mode]):not(:has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-disable-zen-mode])) #browser:not(:has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-enable-titlebar-full-width]):not(:has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-disable-titlebar-full-width]))):has(#titlebar > :hover, #titlebar:focus-within,
#header .topmenu > :hover, #header .topmenu:focus-within):not(:has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-disable-addressfield-extend-on-focus])) #main .toolbar-mainbar:has(.UrlBar-AddressField #urlFieldInput),
:root:has(#browser:is(.tabs-left, .tabs-right):not(.fullscreen, .minimal-ui), #browser.tabs-off:not(.fullscreen, .minimal-ui) #panels-container:not(.switcher)) :has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-enable-zen-mode]):not(:has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-disable-zen-mode])) #browser:not(:has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-enable-titlebar-full-width]):not(:has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-disable-titlebar-full-width]))):has(#titlebar > :hover, #titlebar:focus-within,
#header .topmenu > :hover, #header .topmenu:focus-within):not(:has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-disable-addressfield-extend-on-focus])) footer:has(.toolbar-statusbar):has(.UrlBar-AddressField #urlFieldInput) {
  transition: translate var(--vvh-zen-mode-animation-duration) var(--vvh-zen-mode-animation-timing-function) var(--vvh-zen-mode-fade-in-animation-delay), opacity var(--vvh-zen-mode-animation-duration) var(--vvh-zen-mode-animation-timing-function) var(--vvh-zen-mode-fade-in-animation-delay), z-index 0s 0.2s;
}
:root:has(#browser:is(.tabs-left, .tabs-right):not(.fullscreen, .minimal-ui), #browser.tabs-off:not(.fullscreen, .minimal-ui) #panels-container:not(.switcher)) :has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-enable-zen-mode]):not(:has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-disable-zen-mode])) #browser.toolbar-edit-mode:not(:has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-disable-addressfield-extend-on-focus])) #main .toolbar-mainbar:has(.UrlBar-AddressField #urlFieldInput:focus),
:root:has(#browser:is(.tabs-left, .tabs-right):not(.fullscreen, .minimal-ui), #browser.tabs-off:not(.fullscreen, .minimal-ui) #panels-container:not(.switcher)) :has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-enable-zen-mode]):not(:has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-disable-zen-mode])) #browser.toolbar-edit-mode:not(:has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-disable-addressfield-extend-on-focus])) footer:has(.toolbar-statusbar):has(.UrlBar-AddressField #urlFieldInput:focus),
:root:has(#browser:is(.tabs-left, .tabs-right):not(.fullscreen, .minimal-ui), #browser.tabs-off:not(.fullscreen, .minimal-ui) #panels-container:not(.switcher)) :has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-enable-zen-mode]):not(:has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-disable-zen-mode])) #browser:has(#main > .inner > .tabbar-wrapper:hover,
#panels-container:hover,
> .button-popup,
> #vivaldi-tooltip:not(:empty),
#main .toolbar-mainbar > :hover, #main .toolbar-mainbar:focus-within,
#main .bookmark-bar > :hover, #main .bookmark-bar:focus-within,
#main > .inner > .tabbar-wrapper > :hover, #main > .inner > .tabbar-wrapper:focus-within,
footer:hover .toolbar-statusbar, footer:focus-within .toolbar-statusbar,
#panels-container > :hover, #panels-container:focus-within,
#panels-container:not(.icons, .switcher)):not(:has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-disable-addressfield-extend-on-focus])) #main .toolbar-mainbar:has(.UrlBar-AddressField #urlFieldInput:focus),
:root:has(#browser:is(.tabs-left, .tabs-right):not(.fullscreen, .minimal-ui), #browser.tabs-off:not(.fullscreen, .minimal-ui) #panels-container:not(.switcher)) :has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-enable-zen-mode]):not(:has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-disable-zen-mode])) #browser:has(#main > .inner > .tabbar-wrapper:hover,
#panels-container:hover,
> .button-popup,
> #vivaldi-tooltip:not(:empty),
#main .toolbar-mainbar > :hover, #main .toolbar-mainbar:focus-within,
#main .bookmark-bar > :hover, #main .bookmark-bar:focus-within,
#main > .inner > .tabbar-wrapper > :hover, #main > .inner > .tabbar-wrapper:focus-within,
footer:hover .toolbar-statusbar, footer:focus-within .toolbar-statusbar,
#panels-container > :hover, #panels-container:focus-within,
#panels-container:not(.icons, .switcher)):not(:has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-disable-addressfield-extend-on-focus])) footer:has(.toolbar-statusbar):has(.UrlBar-AddressField #urlFieldInput:focus),
:root:has(#browser:is(.tabs-left, .tabs-right):not(.fullscreen, .minimal-ui), #browser.tabs-off:not(.fullscreen, .minimal-ui) #panels-container:not(.switcher)) :has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-enable-zen-mode]):not(:has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-disable-zen-mode])) #browser:not(:has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-enable-titlebar-full-width]):not(:has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-disable-titlebar-full-width]))):has(#titlebar > :hover, #titlebar:focus-within,
#header .topmenu > :hover, #header .topmenu:focus-within):not(:has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-disable-addressfield-extend-on-focus])) #main .toolbar-mainbar:has(.UrlBar-AddressField #urlFieldInput:focus),
:root:has(#browser:is(.tabs-left, .tabs-right):not(.fullscreen, .minimal-ui), #browser.tabs-off:not(.fullscreen, .minimal-ui) #panels-container:not(.switcher)) :has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-enable-zen-mode]):not(:has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-disable-zen-mode])) #browser:not(:has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-enable-titlebar-full-width]):not(:has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-disable-titlebar-full-width]))):has(#titlebar > :hover, #titlebar:focus-within,
#header .topmenu > :hover, #header .topmenu:focus-within):not(:has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-disable-addressfield-extend-on-focus])) footer:has(.toolbar-statusbar):has(.UrlBar-AddressField #urlFieldInput:focus) {
  transition: translate var(--vvh-zen-mode-animation-duration) var(--vvh-zen-mode-animation-timing-function) var(--vvh-zen-mode-fade-in-animation-delay), opacity var(--vvh-zen-mode-animation-duration) var(--vvh-zen-mode-animation-timing-function) var(--vvh-zen-mode-fade-in-animation-delay), z-index 0s 0s;
}
:root:has(#browser:is(.tabs-left, .tabs-right):not(.fullscreen, .minimal-ui), #browser.tabs-off:not(.fullscreen, .minimal-ui) #panels-container:not(.switcher)) :has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-enable-zen-mode]):not(:has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-disable-zen-mode])) #browser.toolbar-edit-mode:has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-enable-searchfield-extend-on-focus]):not(:has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-disable-searchfield-extend-on-focus])) #main .toolbar-mainbar:has(.UrlBar-SearchField .searchfield-input),
:root:has(#browser:is(.tabs-left, .tabs-right):not(.fullscreen, .minimal-ui), #browser.tabs-off:not(.fullscreen, .minimal-ui) #panels-container:not(.switcher)) :has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-enable-zen-mode]):not(:has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-disable-zen-mode])) #browser.toolbar-edit-mode:has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-enable-searchfield-extend-on-focus]):not(:has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-disable-searchfield-extend-on-focus])) footer:has(.toolbar-statusbar):has(.UrlBar-SearchField .searchfield-input),
:root:has(#browser:is(.tabs-left, .tabs-right):not(.fullscreen, .minimal-ui), #browser.tabs-off:not(.fullscreen, .minimal-ui) #panels-container:not(.switcher)) :has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-enable-zen-mode]):not(:has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-disable-zen-mode])) #browser:has(#main > .inner > .tabbar-wrapper:hover,
#panels-container:hover,
> .button-popup,
> #vivaldi-tooltip:not(:empty),
#main .toolbar-mainbar > :hover, #main .toolbar-mainbar:focus-within,
#main .bookmark-bar > :hover, #main .bookmark-bar:focus-within,
#main > .inner > .tabbar-wrapper > :hover, #main > .inner > .tabbar-wrapper:focus-within,
footer:hover .toolbar-statusbar, footer:focus-within .toolbar-statusbar,
#panels-container > :hover, #panels-container:focus-within,
#panels-container:not(.icons, .switcher)):has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-enable-searchfield-extend-on-focus]):not(:has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-disable-searchfield-extend-on-focus])) #main .toolbar-mainbar:has(.UrlBar-SearchField .searchfield-input),
:root:has(#browser:is(.tabs-left, .tabs-right):not(.fullscreen, .minimal-ui), #browser.tabs-off:not(.fullscreen, .minimal-ui) #panels-container:not(.switcher)) :has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-enable-zen-mode]):not(:has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-disable-zen-mode])) #browser:has(#main > .inner > .tabbar-wrapper:hover,
#panels-container:hover,
> .button-popup,
> #vivaldi-tooltip:not(:empty),
#main .toolbar-mainbar > :hover, #main .toolbar-mainbar:focus-within,
#main .bookmark-bar > :hover, #main .bookmark-bar:focus-within,
#main > .inner > .tabbar-wrapper > :hover, #main > .inner > .tabbar-wrapper:focus-within,
footer:hover .toolbar-statusbar, footer:focus-within .toolbar-statusbar,
#panels-container > :hover, #panels-container:focus-within,
#panels-container:not(.icons, .switcher)):has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-enable-searchfield-extend-on-focus]):not(:has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-disable-searchfield-extend-on-focus])) footer:has(.toolbar-statusbar):has(.UrlBar-SearchField .searchfield-input),
:root:has(#browser:is(.tabs-left, .tabs-right):not(.fullscreen, .minimal-ui), #browser.tabs-off:not(.fullscreen, .minimal-ui) #panels-container:not(.switcher)) :has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-enable-zen-mode]):not(:has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-disable-zen-mode])) #browser:not(:has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-enable-titlebar-full-width]):not(:has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-disable-titlebar-full-width]))):has(#titlebar > :hover, #titlebar:focus-within,
#header .topmenu > :hover, #header .topmenu:focus-within):has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-enable-searchfield-extend-on-focus]):not(:has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-disable-searchfield-extend-on-focus])) #main .toolbar-mainbar:has(.UrlBar-SearchField .searchfield-input),
:root:has(#browser:is(.tabs-left, .tabs-right):not(.fullscreen, .minimal-ui), #browser.tabs-off:not(.fullscreen, .minimal-ui) #panels-container:not(.switcher)) :has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-enable-zen-mode]):not(:has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-disable-zen-mode])) #browser:not(:has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-enable-titlebar-full-width]):not(:has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-disable-titlebar-full-width]))):has(#titlebar > :hover, #titlebar:focus-within,
#header .topmenu > :hover, #header .topmenu:focus-within):has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-enable-searchfield-extend-on-focus]):not(:has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-disable-searchfield-extend-on-focus])) footer:has(.toolbar-statusbar):has(.UrlBar-SearchField .searchfield-input) {
  transition: translate var(--vvh-zen-mode-animation-duration) var(--vvh-zen-mode-animation-timing-function) var(--vvh-zen-mode-fade-out-animation-delay), opacity var(--vvh-zen-mode-animation-duration) var(--vvh-zen-mode-animation-timing-function) var(--vvh-zen-mode-fade-out-animation-delay), z-index 0s 0.2s;
}
:root:has(#browser:is(.tabs-left, .tabs-right):not(.fullscreen, .minimal-ui), #browser.tabs-off:not(.fullscreen, .minimal-ui) #panels-container:not(.switcher)) :has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-enable-zen-mode]):not(:has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-disable-zen-mode])) #browser.toolbar-edit-mode:has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-enable-searchfield-extend-on-focus]):not(:has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-disable-searchfield-extend-on-focus])) #main .toolbar-mainbar:has(.UrlBar-SearchField .searchfield-input:focus),
:root:has(#browser:is(.tabs-left, .tabs-right):not(.fullscreen, .minimal-ui), #browser.tabs-off:not(.fullscreen, .minimal-ui) #panels-container:not(.switcher)) :has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-enable-zen-mode]):not(:has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-disable-zen-mode])) #browser.toolbar-edit-mode:has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-enable-searchfield-extend-on-focus]):not(:has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-disable-searchfield-extend-on-focus])) footer:has(.toolbar-statusbar):has(.UrlBar-SearchField .searchfield-input:focus),
:root:has(#browser:is(.tabs-left, .tabs-right):not(.fullscreen, .minimal-ui), #browser.tabs-off:not(.fullscreen, .minimal-ui) #panels-container:not(.switcher)) :has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-enable-zen-mode]):not(:has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-disable-zen-mode])) #browser:has(#main > .inner > .tabbar-wrapper:hover,
#panels-container:hover,
> .button-popup,
> #vivaldi-tooltip:not(:empty),
#main .toolbar-mainbar > :hover, #main .toolbar-mainbar:focus-within,
#main .bookmark-bar > :hover, #main .bookmark-bar:focus-within,
#main > .inner > .tabbar-wrapper > :hover, #main > .inner > .tabbar-wrapper:focus-within,
footer:hover .toolbar-statusbar, footer:focus-within .toolbar-statusbar,
#panels-container > :hover, #panels-container:focus-within,
#panels-container:not(.icons, .switcher)):has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-enable-searchfield-extend-on-focus]):not(:has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-disable-searchfield-extend-on-focus])) #main .toolbar-mainbar:has(.UrlBar-SearchField .searchfield-input:focus),
:root:has(#browser:is(.tabs-left, .tabs-right):not(.fullscreen, .minimal-ui), #browser.tabs-off:not(.fullscreen, .minimal-ui) #panels-container:not(.switcher)) :has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-enable-zen-mode]):not(:has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-disable-zen-mode])) #browser:has(#main > .inner > .tabbar-wrapper:hover,
#panels-container:hover,
> .button-popup,
> #vivaldi-tooltip:not(:empty),
#main .toolbar-mainbar > :hover, #main .toolbar-mainbar:focus-within,
#main .bookmark-bar > :hover, #main .bookmark-bar:focus-within,
#main > .inner > .tabbar-wrapper > :hover, #main > .inner > .tabbar-wrapper:focus-within,
footer:hover .toolbar-statusbar, footer:focus-within .toolbar-statusbar,
#panels-container > :hover, #panels-container:focus-within,
#panels-container:not(.icons, .switcher)):has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-enable-searchfield-extend-on-focus]):not(:has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-disable-searchfield-extend-on-focus])) footer:has(.toolbar-statusbar):has(.UrlBar-SearchField .searchfield-input:focus),
:root:has(#browser:is(.tabs-left, .tabs-right):not(.fullscreen, .minimal-ui), #browser.tabs-off:not(.fullscreen, .minimal-ui) #panels-container:not(.switcher)) :has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-enable-zen-mode]):not(:has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-disable-zen-mode])) #browser:not(:has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-enable-titlebar-full-width]):not(:has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-disable-titlebar-full-width]))):has(#titlebar > :hover, #titlebar:focus-within,
#header .topmenu > :hover, #header .topmenu:focus-within):has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-enable-searchfield-extend-on-focus]):not(:has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-disable-searchfield-extend-on-focus])) #main .toolbar-mainbar:has(.UrlBar-SearchField .searchfield-input:focus),
:root:has(#browser:is(.tabs-left, .tabs-right):not(.fullscreen, .minimal-ui), #browser.tabs-off:not(.fullscreen, .minimal-ui) #panels-container:not(.switcher)) :has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-enable-zen-mode]):not(:has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-disable-zen-mode])) #browser:not(:has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-enable-titlebar-full-width]):not(:has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-disable-titlebar-full-width]))):has(#titlebar > :hover, #titlebar:focus-within,
#header .topmenu > :hover, #header .topmenu:focus-within):has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-enable-searchfield-extend-on-focus]):not(:has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-disable-searchfield-extend-on-focus])) footer:has(.toolbar-statusbar):has(.UrlBar-SearchField .searchfield-input:focus) {
  transition: translate var(--vvh-zen-mode-animation-duration) var(--vvh-zen-mode-animation-timing-function) var(--vvh-zen-mode-fade-out-animation-delay), opacity var(--vvh-zen-mode-animation-duration) var(--vvh-zen-mode-animation-timing-function) var(--vvh-zen-mode-fade-out-animation-delay), z-index 0s 0s;
}
:root:has(#browser:is(.tabs-left, .tabs-right):not(.fullscreen, .minimal-ui), #browser.tabs-off:not(.fullscreen, .minimal-ui) #panels-container:not(.switcher)) :has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-enable-zen-mode]):not(:has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-disable-zen-mode])) #browser.toolbar-edit-mode #panels-container,
:root:has(#browser:is(.tabs-left, .tabs-right):not(.fullscreen, .minimal-ui), #browser.tabs-off:not(.fullscreen, .minimal-ui) #panels-container:not(.switcher)) :has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-enable-zen-mode]):not(:has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-disable-zen-mode])) #browser:has(#main > .inner > .tabbar-wrapper:hover,
#panels-container:hover,
> .button-popup,
> #vivaldi-tooltip:not(:empty),
#main .toolbar-mainbar > :hover, #main .toolbar-mainbar:focus-within,
#main .bookmark-bar > :hover, #main .bookmark-bar:focus-within,
#main > .inner > .tabbar-wrapper > :hover, #main > .inner > .tabbar-wrapper:focus-within,
footer:hover .toolbar-statusbar, footer:focus-within .toolbar-statusbar,
#panels-container > :hover, #panels-container:focus-within,
#panels-container:not(.icons, .switcher)) #panels-container,
:root:has(#browser:is(.tabs-left, .tabs-right):not(.fullscreen, .minimal-ui), #browser.tabs-off:not(.fullscreen, .minimal-ui) #panels-container:not(.switcher)) :has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-enable-zen-mode]):not(:has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-disable-zen-mode])) #browser:not(:has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-enable-titlebar-full-width]):not(:has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-disable-titlebar-full-width]))):has(#titlebar > :hover, #titlebar:focus-within,
#header .topmenu > :hover, #header .topmenu:focus-within) #panels-container {
  transition: width var(--duration) ease-out, translate var(--vvh-zen-mode-animation-duration) var(--vvh-zen-mode-animation-timing-function) var(--vvh-zen-mode-fade-in-animation-delay), opacity var(--vvh-zen-mode-animation-duration) var(--vvh-zen-mode-animation-timing-function) var(--vvh-zen-mode-fade-in-animation-delay) !important;
}
:root:has(#browser:is(.tabs-left, .tabs-right):not(.fullscreen, .minimal-ui), #browser.tabs-off:not(.fullscreen, .minimal-ui) #panels-container:not(.switcher)) :has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-enable-zen-mode]):not(:has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-disable-zen-mode])) #browser.toolbar-edit-mode:not(.tabs-off) #panels-container,
:root:has(#browser:is(.tabs-left, .tabs-right):not(.fullscreen, .minimal-ui), #browser.tabs-off:not(.fullscreen, .minimal-ui) #panels-container:not(.switcher)) :has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-enable-zen-mode]):not(:has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-disable-zen-mode])) #browser:has(#main > .inner > .tabbar-wrapper:hover,
#panels-container:hover,
> .button-popup,
> #vivaldi-tooltip:not(:empty),
#main .toolbar-mainbar > :hover, #main .toolbar-mainbar:focus-within,
#main .bookmark-bar > :hover, #main .bookmark-bar:focus-within,
#main > .inner > .tabbar-wrapper > :hover, #main > .inner > .tabbar-wrapper:focus-within,
footer:hover .toolbar-statusbar, footer:focus-within .toolbar-statusbar,
#panels-container > :hover, #panels-container:focus-within,
#panels-container:not(.icons, .switcher)):not(.tabs-off) #panels-container,
:root:has(#browser:is(.tabs-left, .tabs-right):not(.fullscreen, .minimal-ui), #browser.tabs-off:not(.fullscreen, .minimal-ui) #panels-container:not(.switcher)) :has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-enable-zen-mode]):not(:has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-disable-zen-mode])) #browser:not(:has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-enable-titlebar-full-width]):not(:has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-disable-titlebar-full-width]))):has(#titlebar > :hover, #titlebar:focus-within,
#header .topmenu > :hover, #header .topmenu:focus-within):not(.tabs-off) #panels-container {
  translate: 0;
  opacity: 1;
  animation: 0s linear var(--vvh-zen-mode-fade-in-animation-delay) enable-pointer-events;
  animation-fill-mode: forwards;
}
:root:has(#browser:is(.tabs-left, .tabs-right):not(.fullscreen, .minimal-ui), #browser.tabs-off:not(.fullscreen, .minimal-ui) #panels-container:not(.switcher)) :has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-enable-zen-mode]):not(:has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-disable-zen-mode])) #browser.toolbar-edit-mode.tabs-left:has(#panels-container.right) #panels-container, :root:has(#browser:is(.tabs-left, .tabs-right):not(.fullscreen, .minimal-ui), #browser.tabs-off:not(.fullscreen, .minimal-ui) #panels-container:not(.switcher)) :has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-enable-zen-mode]):not(:has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-disable-zen-mode])) #browser.toolbar-edit-mode.tabs-right:has(#panels-container.left) #panels-container,
:root:has(#browser:is(.tabs-left, .tabs-right):not(.fullscreen, .minimal-ui), #browser.tabs-off:not(.fullscreen, .minimal-ui) #panels-container:not(.switcher)) :has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-enable-zen-mode]):not(:has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-disable-zen-mode])) #browser:has(#main > .inner > .tabbar-wrapper:hover,
#panels-container:hover,
> .button-popup,
> #vivaldi-tooltip:not(:empty),
#main .toolbar-mainbar > :hover, #main .toolbar-mainbar:focus-within,
#main .bookmark-bar > :hover, #main .bookmark-bar:focus-within,
#main > .inner > .tabbar-wrapper > :hover, #main > .inner > .tabbar-wrapper:focus-within,
footer:hover .toolbar-statusbar, footer:focus-within .toolbar-statusbar,
#panels-container > :hover, #panels-container:focus-within,
#panels-container:not(.icons, .switcher)).tabs-left:has(#panels-container.right) #panels-container,
:root:has(#browser:is(.tabs-left, .tabs-right):not(.fullscreen, .minimal-ui), #browser.tabs-off:not(.fullscreen, .minimal-ui) #panels-container:not(.switcher)) :has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-enable-zen-mode]):not(:has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-disable-zen-mode])) #browser:has(#main > .inner > .tabbar-wrapper:hover,
#panels-container:hover,
> .button-popup,
> #vivaldi-tooltip:not(:empty),
#main .toolbar-mainbar > :hover, #main .toolbar-mainbar:focus-within,
#main .bookmark-bar > :hover, #main .bookmark-bar:focus-within,
#main > .inner > .tabbar-wrapper > :hover, #main > .inner > .tabbar-wrapper:focus-within,
footer:hover .toolbar-statusbar, footer:focus-within .toolbar-statusbar,
#panels-container > :hover, #panels-container:focus-within,
#panels-container:not(.icons, .switcher)).tabs-right:has(#panels-container.left) #panels-container,
:root:has(#browser:is(.tabs-left, .tabs-right):not(.fullscreen, .minimal-ui), #browser.tabs-off:not(.fullscreen, .minimal-ui) #panels-container:not(.switcher)) :has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-enable-zen-mode]):not(:has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-disable-zen-mode])) #browser:not(:has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-enable-titlebar-full-width]):not(:has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-disable-titlebar-full-width]))):has(#titlebar > :hover, #titlebar:focus-within,
#header .topmenu > :hover, #header .topmenu:focus-within).tabs-left:has(#panels-container.right) #panels-container,
:root:has(#browser:is(.tabs-left, .tabs-right):not(.fullscreen, .minimal-ui), #browser.tabs-off:not(.fullscreen, .minimal-ui) #panels-container:not(.switcher)) :has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-enable-zen-mode]):not(:has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-disable-zen-mode])) #browser:not(:has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-enable-titlebar-full-width]):not(:has(:is(#main .toolbar-mainbar, #panels-container, footer .toolbar-statusbar) button[title=vvh-disable-titlebar-full-width]))):has(#titlebar > :hover, #titlebar:focus-within,
#header .topmenu > :hover, #header .topmenu:focus-within).tabs-right:has(#panels-container.left) #panels-container {
  translate: 0;
}

#browser:not(.toolbar-edit-mode) .button-toolbar.toolbar-command:has(button[title=vvh-enable-zen-mode],
button[title=vvh-disable-zen-mode]) {
  display: none;
}

#browser.toolbar-edit-mode .button-toolbar.toolbar-command:has(button[title=vvh-enable-zen-mode], button[title=vvh-disable-zen-mode]) {
  opacity: 0.5;
}
#browser.toolbar-edit-mode .button-toolbar.toolbar-command:has(button[title=vvh-enable-zen-mode], button[title=vvh-disable-zen-mode]) > button::before {
  content: " ";
  pointer-events: none;
  position: absolute;
  inset: 0;
  border: 1px dashed;
  border-radius: var(--radius);
}