:doodle {
@grid: 3 x 1;
}
width: 40vmin;
height: 80vmin;
position: relative;
box-sizing: border-box;
margin: 1vmin;
border-radius: 5vmin;
border:2px solid #666;
box-shadow: 1px 1px 4px 2px #222;
overflow: hidden;
--size: @r(15, 40)%;
--randomDeg: @r(30, 60);
--colorA: rgb(@r(100, 255), @r(100, 255), @r(100, 255));
--colorB: rgb(@r(100, 255), @r(100, 255), @r(100, 255));
--colorC: rgb(@r(100, 255), @r(100, 255), @r(100, 255));
--colorD: rgb(@r(100, 255), @r(100, 255), @r(100, 255));
--colorE: rgb(@r(100, 255), @r(100, 255), @r(100, 255));
--colorF: rgb(@r(100, 255), @r(100, 255), @r(100, 255));
--colorG: rgb(@r(100, 255), @r(100, 255), @r(100, 255));
--colorH: rgb(@r(100, 255), @r(100, 255), @r(100, 255));
background:
repeating-linear-gradient(
calc(var(--randomDeg) * 1deg),
var(--colorA) 0,
var(--colorA) calc(var(--size) * 1),
var(--colorB) calc(var(--size) * 1),
var(--colorB) calc(var(--size) * 2),
var(--colorC) calc(var(--size) * 2),
var(--colorC) calc(var(--size) * 3),
var(--colorD) calc(var(--size) * 3)
),
repeating-linear-gradient(
calc(var(--randomDeg) * -1deg),
var(--colorE) 0,
var(--colorE) calc(var(--size) * 1),
var(--colorF) calc(var(--size) * 1),
var(--colorF) calc(var(--size) * 2),
var(--colorG) calc(var(--size) * 2),
var(--colorG) calc(var(--size) * 3),
var(--colorH) calc(var(--size) * 3)
);
background-blend-mode: @p(multiply, color-burn, screen, lighten, difference);