@layer components{.separator{--size:100%;--border:1px solid color-mix(in srgb,var(--col-dark) 15%,transparent);&.separator--horizontal{height:min(100%,var(--size));margin-block:auto;margin-inline:var(--margin);border-right:var(--border)}&.separator--vertical{width:min(100%,var(--size));margin-block:var(--margin);margin-inline:auto;border-bottom:var(--border)}&.separator--margin-xxs{--margin:var(--size-xxs)}&.separator--margin-xs{--margin:var(--size-xs)}&.separator--margin-sm{--margin:var(--size-sm)}&.separator--margin-md{--margin:var(--size-md)}&.separator--margin-lg{--margin:var(--size-lg)}&.separator--margin-xl{--margin:var(--size-xl)}&.separator--margin-xxl{--margin:var(--size-xxl)}}}