.drawer{display:none}.drawer[open]{display:flex;justify-content:end;align-items:flex-end;position:fixed;inset:0;padding:0;background-color:rgba(0,0,0,.5);z-index:var(--fixed-z-index)}.drawer--open{transition:fadein var(--transition-time) var(--transition-easing);animation:fadein var(--transition-easing) var(--transition-time)}@keyframes fadein{0%{opacity:0}100%{opacity:1}}.drawer--open .drawer__content{transition:slidein var(--transition-time) var(--transition-easing);animation:slidein var(--transition-easing) var(--transition-time)}@keyframes slidein{0%{transform:translateX(150%)}}@media screen and (max-width: 768px){.drawer--open[animation-direction=up] .drawer__content{transition:slideup var(--transition-time) var(--transition-easing);animation:slideup var(--transition-easing) var(--transition-time)}@keyframes slideup{0%{transform:translateY(150%)}}}.drawer--close{transition:fadeout var(--transition-time) var(--transition-easing);animation:fadeout var(--transition-easing) var(--transition-time)}@keyframes fadeout{0%{opacity:1}100%{opacity:0}}.drawer--close .drawer__content{transition:slideout var(--transition-time) var(--transition-easing);animation:slideout var(--transition-easing) var(--transition-time)}@keyframes slideout{100%{transform:translateX(150%)}}@media screen and (max-width: 768px){.drawer--close[animation-direction=up] .drawer__content{transition:slidedown var(--transition-time) var(--transition-easing);animation:slidedown var(--transition-easing) var(--transition-time)}@keyframes slidedown{100%{transform:translateY(150%)}}}.drawer__content{margin:0;position:relative;background-color:var(--color-white);border-radius:var(--border-radius-large) 0 0 var(--border-radius-large);height:100%}.drawer__content--compact{max-width:600px;padding:var(--spacing-5);gap:var(--spacing-4)}.drawer[animation-direction=up] .drawer__content{height:unset;border-radius:var(--border-radius-large) var(--border-radius-large) 0 0}@media screen and (min-width: 768px){.drawer[animation-direction=up] .drawer__content{height:100%;border-radius:var(--border-radius-large) 0 0 var(--border-radius-large)}}@media screen and (max-width: 768px){.drawer__content{max-width:100%;width:100%}}.drawer *:has(>.drawer__body,>.drawer__header,>self__footer){max-height:100svh;display:flex;flex-direction:column}.drawer__header{margin-right:var(--spacing-5)}.drawer__body{overflow-y:scroll;-ms-overflow-style:none;scrollbar-width:none;-webkit-overflow-scrolling:touch;flex-grow:1}.drawer__body::-webkit-scrollbar{display:none}.drawer__drawer-close{display:block;position:absolute;inset:15px 15px auto auto}.drawer__drawer-close svg{height:15px;width:15px}.drawer__drawer-open--right{display:flex;justify-content:flex-end}.drawer__drawer-open--center{display:flex;justify-content:center}.drawer__footer--compact{border-top:solid 1px var(--color-gray-20);padding-inline:var(--spacing-5);margin-inline:calc(-1*var(--spacing-5))}