show-cols()
    background-image: linear-gradient(to right,
        rgba(255,0,0,0) 0,
        rgba(255,0,0,0) var(--grid-gutter-width),
        rgba(255,0,0,0.1) var(--grid-gutter-width)
    )
    background-repeat: repeat-x
    $grid-columns-gaps = $grid-columns - 1
    background-size: s('calc((100% - %s * var(--grid-gutter-width)) / %s + var(--grid-gutter-width)) 100%', $grid-columns-gaps, $grid-columns)
    background-position: calc(var(--grid-gutter-width) * -1)

show-grid-bg()
    background-image: linear-gradient(to bottom, #0ff 0, rgba(255,255,255,0) 1px)
    background-repeat: repeat-y
    background-size: 100% gu(1)

show-grid()
    position: relative
    &:after
        content: ''
        display: block
        position: absolute
        top: 0
        left: 0
        right: 0
        bottom: 0
        z-index: 9999
        pointer-events: none
        background-image: linear-gradient(to bottom, #0ff 0, rgba(255,255,255,0) 1px)
        background-repeat: repeat-y
        background-size: 100% gu(1)


// Make styles for grids painting
setka-debug()

    // Show grid columns
    .show-cols
        show-cols()

    // Show baseline grid in background
    .show-grid-bg
        show-grid-bg()

    // Show baseline grid as overlay
    .show-grid
        show-grid()