:root{--tdm-drawer-width: 300px;--tdm-drawer-speed: .2s;--tdm-drawer-background: #eee;--tdm-backdrop-background: rgba(0,0,0,.5)}[data-drawer-backdrop],drawer-menu{top:0;left:0;position:fixed;display:none;height:100%}[data-drawer] [data-drawer-backdrop],[data-drawer] drawer-menu{display:block}[data-drawer=true] drawer-menu,drawer-menu{transition:margin-left var(--tdm-drawer-speed)}drawer-menu{z-index:99999;margin-left:calc(var(--tdm-drawer-width)*-1);width:var(--tdm-drawer-width);background:var(--tdm-drawer-background)}[data-drawer-backdrop]{z-index:99998;width:100%;visibility:hidden;opacity:0;background:var(--tdm-backdrop-background);transition-property:opacity,visibility;transition-duration:var(--tdm-drawer-speed),0s;transition-delay:0s,var(--tdm-drawer-speed)}[data-drawer=true]{height:100%;width:100%;overflow:hidden}[data-drawer=true] [data-drawer-backdrop]{visibility:visible;opacity:1;transition-property:visibility,opacity;transition-duration:0s,var(--tdm-drawer-speed);transition-delay:0s,0s}[data-drawer=true] drawer-menu{margin-left:0}[data-drawer-backdrop]:before{content:'';height:2rem;width:2rem;background-image:url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' class='feather feather-x'%3E%3Cline x1='18' y1='6' x2='6' y2='18'%3E%3C/line%3E%3Cline x1='6' y1='6' x2='18' y2='18'%3E%3C/line%3E%3C/svg%3E");background-size:2rem;display:block;margin-top:1rem;margin-left:calc(var(--tdm-drawer-width) + 1rem);opacity:.5}