/* Глюк-эффект сайта: холст поверх страницы, сетка крестиков, выделение текста. */

:root {
    --gx-cell: 28px;
    --gx-accent: #ea4a15;
}

/* Слабая сетка из крестиков на фоне, привязана к той же сетке, что и блоки */
body {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 112 112'%3E%3Cpath d='M56 52v8M52 56h8' stroke='%23323232' stroke-width='1' fill='none'/%3E%3C/svg%3E");
    background-size: calc(var(--gx-cell) * 4) calc(var(--gx-cell) * 4);
    background-position: calc(var(--gx-cell) * -2) calc(var(--gx-cell) * -2);
}

/* Выделение текста и картинок — фирменный синий */
::selection {
    background: #3353c4;
    color: #fff;
}

img::selection {
    background: rgba(51, 83, 196, 0.6);
}

.gx-canvas {
    position: absolute;   /* лежит в странице и прокручивается вместе с ней */
    will-change: transform;
    left: 0;
    top: 0;
    pointer-events: none;
    z-index: 260;   /* выше меню и шапки сайта */
}

.gx-hidden {
    opacity: 0 !important;
}