CSS to autohide the vertical tab bar in Vivaldi

hide-tab-bar.css

/* Auto hide vertical tab bar */

#browser:not(.fullscreen) .inner > .tabbar-wrapper:not(:hover),
#browser:not(.fullscreen) .inner > .tabbar-wrapper:not(:hover) * {
	pointer-events: none;
}

#browser:not(.fullscreen):has(
		.ToolbarButtonPopup-DefaultStyles:not([aria-label='Accounts']):hover
	)
	.inner
	> .tabbar-wrapper,
#browser:not(.fullscreen):has(
		.ToolbarButtonPopup-DefaultStyles:not([aria-label='Accounts']):hover
	)
	.inner
	> .tabbar-wrapper
	* {
	pointer-events: all;
}

#browser:not(.fullscreen) .inner > .tabbar-wrapper::before {
	--width: var(--window-border);
	left: calc(var(--window-border) * -1);
	content: '';
	position: absolute;
	width: var(--width);
	height: 100%;
	top: 0;
	pointer-events: all;
}

#browser:not(.fullscreen) .inner > .tabbar-wrapper:hover::before {
	margin-left: -1rem;
	width: calc(var(--width) + 2rem);
}

#browser:not(.fullscreen) .inner {
	display: grid;
	grid-template-columns: auto 1fr;
	grid-template-rows: 1fr;
	padding-left: var(--window-border);
}

#browser:not(.fullscreen) .inner > .tabbar-wrapper {
	interpolate-size: allow-keywords;
	grid-column: 1;
	grid-row: 1;
	z-index: 2;
	background-color: var(--colorWindowBg);
	width: 0px !important;
	transition: width 0.25s, padding 0.25s;
}
#browser:not(.fullscreen) .inner > .tabbar-wrapper:hover,
#browser:not(.fullscreen):has(
		.ToolbarButtonPopup-DefaultStyles:not([aria-label='Accounts']):hover
	)
	.inner
	> .tabbar-wrapper {
	width: fit-content !important;
	transition: width 0.25s;
	padding: 1rem;
}
#browser:not(.fullscreen) .inner > .tabbar-wrapper > * {
	opacity: 0;
	transition: opacity 0;
}
#browser:not(.fullscreen) .inner > .tabbar-wrapper:hover > *,
#browser:not(.fullscreen):has(
		.ToolbarButtonPopup-DefaultStyles:not([aria-label='Accounts']):hover
	)
	.inner
	> .tabbar-wrapper
	> * {
	opacity: 1;
	transition: opacity 0.25s 0.25s;
}

#browser:not(.fullscreen) .inner > #webview-container {
	grid-column: 1 / -1;
	grid-row: 1;
	z-index: 1;
}