@supports (color: hsl(from white h s l)) {
    .canvas-node:has(.tag[href="#node-crime-scene-tape"], .node-crime-scene-tape):not(.is-editing)
        .canvas-node-container {
        background-color: hsl(from rgb(var(--canvas-color)) h 100% 50%);
    }
}

@supports not (color: hsl(from white h s l)) {
    .canvas-node:has(.tag[href="#node-crime-scene-tape"], .node-crime-scene-tape):not(.is-editing)
        .canvas-node-container {
        background-color: rgb(var(--canvas-color));
    }
}

.canvas-node:has(.tag[href="#node-crime-scene-tape"], .node-crime-scene-tape):not(.is-editing) {
    .canvas-node-container {
        border: none;
        box-shadow: none;
        border-radius: 0;
        box-shadow: 0px 0px 10px black;
        background-image: url("data:image/svg+xml;utf-8,<svg viewBox='0 0 90 8' xmlns='http://www.w3.org/2000/svg'><text style='font-style:normal;font-variant:normal;font-weight:900;font-stretch:normal;font-size:10px;line-height:1;font-family:Arial;letter-spacing:-0.661458px;word-spacing:0px;stroke-width:0' x='5' y='7.5px'><tspan dx='0 0 0 0 0 0'>CRIME SCENE</tspan></text></svg>");
        background-size: auto 60%;
        background-repeat: repeat-x;
        background-position: left center;
    }

    &.mod-canvas-color-custom .canvas-node-container {
        background-color: rgb(var(--canvas-color));
    }

    .canvas-node-content {
        background: none;
    }
}

.canvas-node:not(.is-editing) :is(.tag[href="#node-crime-scene-tape"], .node-crime-scene-tape) {
    display: none;
}
