[data-vaul-drawer] {
				touch-action: none;
				will-change: transform;
				transition: transform .5s cubic-bezier(.32, .72, 0, 1);
				animation-duration: .5s;
				animation-timing-function: cubic-bezier(0.32, 0.72, 0, 1)
			}

			[data-vaul-drawer][data-vaul-snap-points=false][data-vaul-drawer-direction=bottom][data-state=open] {
				animation-name: slideFromBottom
			}

			[data-vaul-drawer][data-vaul-snap-points=false][data-vaul-drawer-direction=bottom][data-state=closed] {
				animation-name: slideToBottom
			}

			[data-vaul-drawer][data-vaul-snap-points=false][data-vaul-drawer-direction=top][data-state=open] {
				animation-name: slideFromTop
			}

			[data-vaul-drawer][data-vaul-snap-points=false][data-vaul-drawer-direction=top][data-state=closed] {
				animation-name: slideToTop
			}

			[data-vaul-drawer][data-vaul-snap-points=false][data-vaul-drawer-direction=left][data-state=open] {
				animation-name: slideFromLeft
			}

			[data-vaul-drawer][data-vaul-snap-points=false][data-vaul-drawer-direction=left][data-state=closed] {
				animation-name: slideToLeft
			}

			[data-vaul-drawer][data-vaul-snap-points=false][data-vaul-drawer-direction=right][data-state=open] {
				animation-name: slideFromRight
			}

			[data-vaul-drawer][data-vaul-snap-points=false][data-vaul-drawer-direction=right][data-state=closed] {
				animation-name: slideToRight
			}

			[data-vaul-drawer][data-vaul-snap-points=true][data-vaul-drawer-direction=bottom] {
				transform: translate3d(0, var(--initial-transform, 100%), 0)
			}

			[data-vaul-drawer][data-vaul-snap-points=true][data-vaul-drawer-direction=top] {
				transform: translate3d(0, calc(var(--initial-transform, 100%) * -1), 0)
			}

			[data-vaul-drawer][data-vaul-snap-points=true][data-vaul-drawer-direction=left] {
				transform: translate3d(calc(var(--initial-transform, 100%) * -1), 0, 0)
			}

			[data-vaul-drawer][data-vaul-snap-points=true][data-vaul-drawer-direction=right] {
				transform: translate3d(var(--initial-transform, 100%), 0, 0)
			}

			[data-vaul-drawer][data-vaul-delayed-snap-points=true][data-vaul-drawer-direction=top] {
				transform: translate3d(0, var(--snap-point-height, 0), 0)
			}

			[data-vaul-drawer][data-vaul-delayed-snap-points=true][data-vaul-drawer-direction=bottom] {
				transform: translate3d(0, var(--snap-point-height, 0), 0)
			}

			[data-vaul-drawer][data-vaul-delayed-snap-points=true][data-vaul-drawer-direction=left] {
				transform: translate3d(var(--snap-point-height, 0), 0, 0)
			}

			[data-vaul-drawer][data-vaul-delayed-snap-points=true][data-vaul-drawer-direction=right] {
				transform: translate3d(var(--snap-point-height, 0), 0, 0)
			}

			[data-vaul-overlay][data-vaul-snap-points=false] {
				animation-duration: .5s;
				animation-timing-function: cubic-bezier(0.32, 0.72, 0, 1)
			}

			[data-vaul-overlay][data-vaul-snap-points=false][data-state=open] {
				animation-name: fadeIn
			}

			[data-vaul-overlay][data-state=closed] {
				animation-name: fadeOut
			}

			[data-vaul-animate=false] {
				animation: none !important
			}

			[data-vaul-overlay][data-vaul-snap-points=true] {
				opacity: 0;
				transition: opacity .5s cubic-bezier(.32, .72, 0, 1)
			}

			[data-vaul-overlay][data-vaul-snap-points=true] {
				opacity: 1
			}

			[data-vaul-drawer]:not([data-vaul-custom-container=true])::after {
				content: '';
				position: absolute;
				background: inherit;
				background-color: inherit
			}

			[data-vaul-drawer][data-vaul-drawer-direction=top]::after {
				top: initial;
				bottom: 100%;
				left: 0;
				right: 0;
				height: 200%
			}

			[data-vaul-drawer][data-vaul-drawer-direction=bottom]::after {
				top: 100%;
				bottom: initial;
				left: 0;
				right: 0;
				height: 200%
			}

			[data-vaul-drawer][data-vaul-drawer-direction=left]::after {
				left: initial;
				right: 100%;
				top: 0;
				bottom: 0;
				width: 200%
			}

			[data-vaul-drawer][data-vaul-drawer-direction=right]::after {
				left: 100%;
				right: initial;
				top: 0;
				bottom: 0;
				width: 200%
			}

			[data-vaul-overlay][data-vaul-snap-points=true]:not([data-vaul-snap-points-overlay=true]):not([data-state=closed]) {
				opacity: 0
			}

			[data-vaul-overlay][data-vaul-snap-points-overlay=true] {
				opacity: 1
			}

			[data-vaul-handle] {
				display: block;
				position: relative;
				opacity: .7;
				background: #e2e2e4;
				margin-left: auto;
				margin-right: auto;
				height: 5px;
				width: 32px;
				border-radius: 1rem;
				touch-action: pan-y
			}

			[data-vaul-handle]:active,
			[data-vaul-handle]:hover {
				opacity: 1
			}

			[data-vaul-handle-hitarea] {
				position: absolute;
				left: 50%;
				top: 50%;
				transform: translate(-50%, -50%);
				width: max(100%, 2.75rem);
				height: max(100%, 2.75rem);
				touch-action: inherit
			}

			@media (hover:hover) and (pointer:fine) {
				[data-vaul-drawer] {
					user-select: none
				}
			}

			@media (pointer:fine) {
				[data-vaul-handle-hitarea]: {
					width: 100%;
					height: 100%
				}
			}

			@keyframes fadeIn {
				from {
					opacity: 0
				}

				to {
					opacity: 1
				}
			}

			@keyframes fadeOut {
				to {
					opacity: 0
				}
			}

			@keyframes slideFromBottom {
				from {
					transform: translate3d(0, var(--initial-transform, 100%), 0)
				}

				to {
					transform: translate3d(0, 0, 0)
				}
			}

			@keyframes slideToBottom {
				to {
					transform: translate3d(0, var(--initial-transform, 100%), 0)
				}
			}

			@keyframes slideFromTop {
				from {
					transform: translate3d(0, calc(var(--initial-transform, 100%) * -1), 0)
				}

				to {
					transform: translate3d(0, 0, 0)
				}
			}

			@keyframes slideToTop {
				to {
					transform: translate3d(0, calc(var(--initial-transform, 100%) * -1), 0)
				}
			}

			@keyframes slideFromLeft {
				from {
					transform: translate3d(calc(var(--initial-transform, 100%) * -1), 0, 0)
				}

				to {
					transform: translate3d(0, 0, 0)
				}
			}

			@keyframes slideToLeft {
				to {
					transform: translate3d(calc(var(--initial-transform, 100%) * -1), 0, 0)
				}
			}

			@keyframes slideFromRight {
				from {
					transform: translate3d(var(--initial-transform, 100%), 0, 0)
				}

				to {
					transform: translate3d(0, 0, 0)
				}
			}

			@keyframes slideToRight {
				to {
					transform: translate3d(var(--initial-transform, 100%), 0, 0)
				}
			}