@layer components{[data-nav=drawer]{position:relative;container-type:inline-size}@container (width<=40rem){[data-nav=drawer][data-nav-js] .bf-nav-toggle{display:inline-flex}[data-nav=drawer][data-nav-js]>ul{align-items:stretch;gap:var(--bf-space-2);width:min(80vw,18rem);padding:var(--bf-space-4);background:var(--bf-surface);border-inline-end:var(--bf-border-width) solid var(--bf-border);box-shadow:var(--bf-shadow-lifted);transition:transform var(--bf-vt-duration,.25s) var(--bf-vt-easing,ease);z-index:var(--bf-z-dialog);flex-direction:column;margin:0;display:block;position:fixed;inset-block:0;inset-inline-start:0;transform:translate(-100%)}[data-nav=drawer][data-nav-js][data-open]>ul{transform:translate(0)}[data-nav=drawer][data-nav-js]>ul a{display:block}}}