<div class="discount"></div>
<div class="blossom"></div>
<div class="ladybird"></div>
<div class="peep-holes"></div>
<div class="skulls"></div>
<div class="grannys-armchair"></div>
<div class="duchess"></div>
<div class="lawn"></div>
<div class="nightclub"></div>
<div class="chinese-lanterns"></div>
<div class="pumpkin-spice"></div>
<div class="feline"></div>
<div class="propeller"></div>
<div class="origami"></div>
<div class="shortbread-shake"></div>
<div class="fall"></div>
<div class="sea-wall"></div>
<div class="whispers"></div>
<div class="low-pressure"></div>
<div class="cyclone"></div>
<div class="water-trail"></div>
<div class="fishing-net"></div>
<div class="instrument-panel"></div>
<div class="spider-weave"></div>
<div class="echo-owl"></div>
<div class="sugar-lattice"></div>
<div class="copper-clasp"></div>
<div class="circulation"></div>
<div class="money-zoom"></div>
<div class="headstone"></div>
<div class="moth-bot"></div>
<div class="motor-warp"></div>
<div class="neon-mesh"></div>
<div class="ninja-star"></div>
<div class="braid"></div>
<div class="the-pond"></div>
<div class="segments"></div>
<div class="biohazard"></div>
<div class="phone-alert-system"></div>
<div class="life-buoy"></div>
<div class="lobby"></div>
<div class="target"></div>
<div class="confetti2"></div>
<div class="jam-sandwich"></div>
<div class="tennis"></div>
<div class="cobbles"></div>
<div class="bed-springs"></div>
<div class="linked"></div>
<div class="overlapping-shields"></div>
<div class="mystic-eye"></div>
<div class="lace"></div>
<div class="plant-cells"></div>
<div class="slashes"></div>
<div class="hollow-lemon"></div>
<div class="blood-cells"></div>
<div class="avocado"></div>
<div class="snag"></div>
<div class="bling-chunk"></div>
<div class="ocean"></div>
<div class="star-pips"></div>
<div class="bamboo"></div>
<div class="goldwork"></div>
<div class="interlock"></div>
<div class="knot-work"></div>
<div class="port-hole"></div>
<div class="terracotta-trace"></div>
<div class="purple-quartz"></div>
<div class="sort"></div>
<div class="nope"></div>
<div class="mermaid"></div>
<div class="rainbows"></div>
<div class="bones"></div>
<div class="villain-underpants"></div>
<div class="cumulus"></div>
<div class="quatrefoil"></div>
<div class="leaf"></div>
<div class="kitchen-tiles"></div>
<div class="medpack"></div>
<div class="lazy-triangle"></div>
<div class="isometric"></div>
<div class="googly-eyes"></div>
<div class="circles"></div>
<div class="fake-luggage"></div>
<div class="circle-grid"></div>
<div class="squares"></div>
<div class="blood-moon"></div>
<div class="pyramids"></div>
<div class="sharp-stars"></div>
<div class="stars"></div>
<div class="confetti"></div>
<div class="dots"></div>
<div class="cat-toes"></div>
<div class="diamonds"></div>
<div class="trellis"></div>
<div class="orange-buzz"></div>
<div class="lemon-lime-gingham"></div>
<div class="lavender-lumberjack"></div>
<div class="vertical-stripes"></div>
<div class="diagonal-stripes"></div>
<div class="stripes"></div>
:root {
--ambrosia: #FCDBBA;
--apricot: #FF8652;
--aubergine: #6A2352;
--auburn: #A12F2F;
--asparagus: #A0C259;
--beetroot: #7F0421;
--blue-tack: #82BFE0;
--bloom: #363A57;
--blush: #D67B71;
--bronze: #C27940;
--bud: #94C15C;
--burnt-orange: #FF5F00;
--butter: #F2C94C;
--strawberry-yogurt: #E4BCAD;
--carmine: #9A133E;
--chocolate: #8F5D38;
--chestnut: #81291F;
--clay: #7D6050;
--conker: #6F3131;
--coral: #EB4444;
--dusty-purple: #7D6391;
--dusty-pink: #E4ADAD;
--emerald: #55B95F;
--fern: #4F8D08;
--forest: #2E644A;
--fudge: #C28742;
--grassy: #A8D363;
--green: #62B90A;
--hazelnut: #D08E5A;
--ink: #292C31;
--ivory: #F2EFE3;
--lapis: #2B4D8D;
--leafy: #318553;
--lemon: #EAFC7E;
--lime: #73D645;
--limestone: #C9C5B5;
--magenta: #BC2767;
--meadow: #7A9A3E;
--melon: #F2994A;
--midnight: #1B3955;
--mink: #E8C9A1;
--mint: #C4EA70;
--moss: #7DB21C;
--mushroom: #EDE8D5;
--navy: #363A57;
--orange: #FD8A04;
--pale-lemon: #F4FFDC;
--peach: #FFB190;
--pond-bottom: #264A46;
--powder-blue: #B5D0E0;
--powder-pink: #FBD1D1;
--primrose: #E1F7B0;
--purple: #A95AF3;
--purple-slate: #545375;
--rainforest: #25422E;
--raspberry-jam: #3C0D2B;
--robins-egg: #B8DEE0;
--rouge: #CC3737;
--royal: #4169E1;
--ruby: #D1314B;
--sage: #87A376;
--sakura: #FFE4E4;
--sea-glass: #7FD1AE;
--sea-foam: #5D998B;
--sea-fog: #758C92;
--slate: #7184A5;
--spearmint: #94E0CF;
--spring: #5ACB65;
--succulent: #83A944;
--twilight: #203763;
--vavavoom: #BF0D0D;
--white: #FFFFFF;
--yellow: #FFE03D;
--trans: transparent;
--trans05: rgba(255,255,255,0.05);
--trans1: rgba(255,255,255,0.1);
--trans2: rgba(255,255,255,0.2);
--trans4: rgba(255,255,255,0.4);
}
* { margin: 0; padding: 0; font-size: 1em; }
body { background: #334; margin: 1em; max-width: 90em; }
div { height: 2em; width: 2em; display: inline-block; float: left;
margin: 0.1em; border-radius: 0.12em; font-size: 4em; position: relative; transform-style: preserve-3d; }
div::before,
div::after {
border-radius: 0.12em;
content: '';
display: block;
position: absolute;
height: 100%;
width: 100%; }
.current { border-radius: 0; font-size: 5.5em; height: 5em; width: 5em; }
.current::before,
.current::after { border-radius: 0; }
.discount {
background-color: var(--magenta);
background-image:
repeating-radial-gradient(
circle at 0 0.95em,
var(--butter),
var(--butter) 0.22em,
var(--trans) 0.23em,
var(--trans) 2em),
repeating-radial-gradient(
circle at 1em -0.05em,
var(--butter),
var(--butter) 0.22em,
var(--trans) 0.23em,
var(--trans) 2em),
repeating-radial-gradient(
circle at 0 -0.05em,
var(--butter),
var(--butter) 0.22em,
var(--trans) 0.23em,
var(--trans) 2em),
repeating-radial-gradient(
circle at 1em 0.95em,
var(--butter),
var(--butter) 0.22em,
var(--trans) 0.23em,
var(--trans) 2em),
repeating-radial-gradient(
circle at 0 0.3em,
var(--butter),
var(--butter) 0.22em,
var(--trans) 0.23em,
var(--trans) 2em),
repeating-radial-gradient(
circle at 0 0.7em,
var(--butter),
var(--butter) 0.22em,
var(--trans) 0.23em,
var(--trans) 2em),
repeating-radial-gradient(
circle at 1em 0.3em,
var(--butter),
var(--butter) 0.22em,
var(--trans) 0.23em,
var(--trans) 2em),
repeating-radial-gradient(
circle at 1em 0.7em,
var(--butter),
var(--butter) 0.22em,
var(--trans) 0.23em,
var(--trans) 2em),
repeating-radial-gradient(
circle at 0.3em 0em,
var(--butter),
var(--butter) 0.22em,
var(--trans) 0.23em,
var(--trans) 2em),
repeating-radial-gradient(
circle at 0.7em 0em,
var(--butter),
var(--butter) 0.22em,
var(--trans) 0.23em,
var(--trans) 2em),
repeating-radial-gradient(
circle at 0.3em 1em,
var(--butter),
var(--butter) 0.22em,
var(--trans) 0.23em,
var(--trans) 2em),
repeating-radial-gradient(
circle at 0.7em 1em,
var(--butter),
var(--butter) 0.22em,
var(--trans) 0.23em,
var(--trans) 2em);
background-size: 1em 1em;
}
.blossom {
background-color: var(--twilight);
background-image:
repeating-radial-gradient(
circle at -0.2em 0.1em,
var(--trans),
var(--trans) 0.18em,
var(--mushroom) 0.19em,
var(--mushroom) 0.39em,
var(--trans) 0.4em,
var(--trans) 2em),
repeating-radial-gradient(
circle at 0.1em 1.2em,
var(--trans),
var(--trans) 0.18em,
var(--mushroom) 0.19em,
var(--mushroom) 0.39em,
var(--trans) 0.4em,
var(--trans) 2em),
repeating-radial-gradient(
circle at 1.2em 0.9em,
var(--trans),
var(--trans) 0.18em,
var(--mushroom) 0.19em,
var(--mushroom) 0.39em,
var(--trans) 0.4em,
var(--trans) 2em),
repeating-radial-gradient(
circle at 0.9em 1.2em,
var(--trans),
var(--trans) 0.18em,
var(--mink) 0.19em,
var(--mink) 0.39em,
var(--trans) 0.4em,
var(--trans) 2em),
repeating-radial-gradient(
circle at 0.9em -0.2em,
var(--trans),
var(--trans) 0.18em,
var(--mushroom) 0.19em,
var(--mushroom) 0.39em,
var(--trans) 0.4em,
var(--trans) 2em),
repeating-radial-gradient(
circle at -0.2em 0.9em,
var(--trans),
var(--trans) 0.18em,
var(--mink) 0.19em,
var(--mink) 0.39em,
var(--trans) 0.4em,
var(--trans) 2em),
repeating-radial-gradient(
circle at 1.2em 0.1em,
var(--trans),
var(--trans) 0.18em,
var(--mink) 0.19em,
var(--mink) 0.39em,
var(--trans) 0.4em,
var(--trans) 2em),
repeating-radial-gradient(
circle at 0.1em -0.2em,
var(--trans),
var(--trans) 0.18em,
var(--mink) 0.19em,
var(--mink) 0.39em,
var(--trans) 0.4em,
var(--trans) 2em);
background-size: 1em 1em;
}
.ladybird {
background-color: var(--sage);
background-image:
repeating-radial-gradient(
circle at 0.4em 0.17em,
var(--mushroom),
var(--mushroom) 0.04em,
var(--ink) 0.04em,
var(--ink) 0.07em,
var(--trans) 0.07em,
var(--trans) 2em),
repeating-radial-gradient(
circle at 0.6em 0.17em,
var(--mushroom),
var(--mushroom) 0.04em,
var(--ink) 0.04em,
var(--ink) 0.07em,
var(--trans) 0.07em,
var(--trans) 2em),
repeating-radial-gradient(
circle at 0.5em 0.25em,
var(--ink),
var(--ink) 0.15em,
var(--trans) 0.16em,
var(--trans) 1em),
repeating-radial-gradient(
circle at 0.5em 0.555em,
var(--ink),
var(--ink) 0.34em,
var(--trans) 0.35em,
var(--trans) 1em);
background-size: 1em 1em;
background-position: 0 0.4em;
}
.ladybird::before {
background-image:
repeating-radial-gradient(
circle at 1em 0.54em,
var(--rouge),
var(--rouge) 0.32em,
var(--ink) 0.32em,
var(--ink) 0.33em,
var(--trans) 0.34em,
var(--trans) 2em);
background-size: 1em 1em;
background-position: 0.49em 0.42em;
}
.ladybird::after {
background-image:
repeating-radial-gradient(
circle at 0.145em 0.52em,
var(--ink),
var(--ink) 0.07em,
var(--trans) 0.08em,
var(--trans) 2em),
repeating-radial-gradient(
circle at 0.84em 0.52em,
var(--ink),
var(--ink) 0.07em,
var(--trans) 0.08em,
var(--trans) 2em),
repeating-radial-gradient(
circle at 0 0.54em,
var(--rouge),
var(--rouge) 0.32em,
var(--ink) 0.32em,
var(--ink) 0.33em,
var(--trans) 0.34em,
var(--trans) 2em);
background-size: 1em 1em;
background-position: 0.51em 0.42em;
}
.peep-holes {
background-image:
repeating-linear-gradient(
-25deg,
var(--apricot),
var(--apricot) 0.1em,
var(--coral) 0.1em,
var(--coral) 0.2em,
var(--blush) 0.2em,
var(--blush) 0.3em,
var(--peach) 0.3em,
var(--peach) 0.4em,
var(--melon) 0.4em,
var(--melon) 0.5em);
}
.peep-holes::after {
background-image:
repeating-radial-gradient(
circle at 0.5em 0.5em,
var(--trans),
var(--trans) 0.2em,
var(--ivory) 0.21em,
var(--ivory) 0.50em,
var(--trans) 0.51em,
var(--trans) 1em),
repeating-radial-gradient(
circle at 0 0,
var(--trans),
var(--trans) 0.2em,
var(--ivory) 0.21em,
var(--ivory) 0.50em,
var(--trans) 0.51em,
var(--trans) 2em),
repeating-radial-gradient(
circle at 1em 0,
var(--trans),
var(--trans) 0.2em,
var(--ivory) 0.21em,
var(--ivory) 0.50em,
var(--trans) 0.51em,
var(--trans) 2em),
repeating-radial-gradient(
circle at 1em 1em,
var(--trans),
var(--trans) 0.2em,
var(--ivory) 0.21em,
var(--ivory) 0.50em,
var(--trans) 0.51em,
var(--trans) 2em),
repeating-radial-gradient(
circle at 0 1em,
var(--trans),
var(--trans) 0.2em,
var(--ivory) 0.21em,
var(--ivory) 0.50em,
var(--trans) 0.51em,
var(--trans) 2em),
repeating-radial-gradient(
circle at 0.5em 0.55em,
var(--trans),
var(--trans) 0.2em,
var(--limestone) 0.21em,
var(--limestone) 0.50em,
var(--trans) 0.51em,
var(--trans) 1em),
repeating-radial-gradient(
circle at 0 0.05em,
var(--trans),
var(--trans) 0.2em,
var(--limestone) 0.21em,
var(--limestone) 0.50em,
var(--trans) 0.51em,
var(--trans) 2em),
repeating-radial-gradient(
circle at 1em 0.05em,
var(--trans),
var(--trans) 0.2em,
var(--limestone) 0.21em,
var(--limestone) 0.50em,
var(--trans) 0.51em,
var(--trans) 2em),
repeating-radial-gradient(
circle at 1em 1.05em,
var(--trans),
var(--trans) 0.2em,
var(--limestone) 0.21em,
var(--limestone) 0.50em,
var(--trans) 0.51em,
var(--trans) 2em),
repeating-radial-gradient(
circle at 0 1.05em,
var(--trans),
var(--trans) 0.2em,
var(--limestone) 0.21em,
var(--limestone) 0.50em,
var(--trans) 0.51em,
var(--trans) 2em);
background-size: 1em 1em;
}
.skulls {
background-color: var(--apricot);
background-image:
repeating-radial-gradient(
circle at 0.5em 0.48em,
var(--mushroom),
var(--mushroom) 0.1em,
var(--trans) 0.11em,
var(--trans) 1em),
repeating-radial-gradient(
circle at 0.4em 0.46em,
var(--mushroom),
var(--mushroom) 0.1em,
var(--trans) 0.11em,
var(--trans) 1em),
repeating-radial-gradient(
circle at 0.6em 0.46em,
var(--mushroom),
var(--mushroom) 0.1em,
var(--trans) 0.11em,
var(--trans) 1em),
repeating-radial-gradient(
circle at 0.5em 0.68em,
var(--trans),
var(--trans) 0.24em,
var(--mushroom) 0.25em,
var(--mushroom) 0.37em,
var(--trans) 0.38em,
var(--trans) 1em),
repeating-radial-gradient(
circle at 0.35em 0.7em,
var(--trans),
var(--trans) 0.1em,
var(--mushroom) 0.11em,
var(--mushroom) 0.18em,
var(--trans) 0.19em,
var(--trans) 1em),
repeating-radial-gradient(
circle at 0.65em 0.7em,
var(--trans),
var(--trans) 0.1em,
var(--mushroom) 0.11em,
var(--mushroom) 0.18em,
var(--trans) 0.19em,
var(--trans) 1em),
repeating-radial-gradient(
circle at 0.42em 0.87em,
var(--trans),
var(--trans) 0.05em,
var(--mushroom) 0.06em,
var(--mushroom) 0.1em,
var(--trans) 0.11em,
var(--trans) 1em),
repeating-radial-gradient(
circle at 0.58em 0.87em,
var(--trans),
var(--trans) 0.05em,
var(--mushroom) 0.06em,
var(--mushroom) 0.1em,
var(--trans) 0.11em,
var(--trans) 1em),
repeating-radial-gradient(
circle at 0.5em 0.9em,
var(--trans),
var(--trans) 0.07em,
var(--mushroom) 0.08em,
var(--mushroom) 0.15em,
var(--trans) 0.16em,
var(--trans) 1em),
repeating-radial-gradient(
circle at 0.5em 1em,
var(--trans),
var(--trans) 0.14em,
var(--mushroom) 0.15em,
var(--mushroom) 0.23em,
var(--trans) 0.24em,
var(--trans) 1em),
repeating-radial-gradient(
circle at 0.5em 1.17em,
var(--trans),
var(--trans) 0.14em,
var(--mushroom) 0.15em,
var(--mushroom) 0.23em,
var(--trans) 0.24em,
var(--trans) 2em),
repeating-radial-gradient(
circle at 0.69em 0.01em,
var(--mushroom),
var(--mushroom) 0.04em,
var(--trans) 0.05em,
var(--trans) 2em),
repeating-radial-gradient(
circle at 0.57em 0.01em,
var(--mushroom),
var(--mushroom) 0.04em,
var(--trans) 0.05em,
var(--trans) 2em),
repeating-radial-gradient(
circle at 0.45em 0.01em,
var(--mushroom),
var(--mushroom) 0.04em,
var(--trans) 0.05em,
var(--trans) 2em),
repeating-radial-gradient(
circle at 0.32em 0.01em,
var(--mushroom),
var(--mushroom) 0.04em,
var(--trans) 0.05em,
var(--trans) 2em);
background-size: 1em 1em;
background-position: 0 0.8em;
}
.grannys-armchair {
background-color: var(--blush);
background-image:
repeating-radial-gradient(
circle at 1.34em 1.15em,
var(--trans),
var(--trans) 0.24em,
var(--peach) 0.25em,
var(--peach) 0.4em,
var(--trans) 0.41em,
var(--trans) 0.64em),
repeating-radial-gradient(
circle at -0.34em 1.15em,
var(--trans),
var(--trans) 0.24em,
var(--peach) 0.25em,
var(--peach) 0.4em,
var(--trans) 0.41em,
var(--trans) 0.64em),
repeating-radial-gradient(
circle at 1.34em -0.15em,
var(--trans),
var(--trans) 0.24em,
var(--peach) 0.25em,
var(--peach) 0.4em,
var(--trans) 0.41em,
var(--trans) 0.64em),
repeating-radial-gradient(
circle at -0.34em -0.15em,
var(--trans),
var(--trans) 0.24em,
var(--peach) 0.25em,
var(--peach) 0.4em,
var(--trans) 0.41em,
var(--trans) 0.64em);
background-size: 1em 1em;
}
.duchess {
background-color: var(--slate);
background-image:
repeating-radial-gradient(
circle at 1.34em 1.12em,
var(--trans),
var(--trans) 0.34em,
var(--butter) 0.35em,
var(--butter) 0.4em,
var(--trans) 0.41em,
var(--trans) 0.74em),
repeating-radial-gradient(
circle at -0.34em 1.12em,
var(--trans),
var(--trans) 0.34em,
var(--butter) 0.35em,
var(--butter) 0.4em,
var(--trans) 0.41em,
var(--trans) 0.74em),
repeating-radial-gradient(
circle at 1.34em -0.12em,
var(--trans),
var(--trans) 0.34em,
var(--butter) 0.35em,
var(--butter) 0.4em,
var(--trans) 0.41em,
var(--trans) 0.74em),
repeating-radial-gradient(
circle at -0.34em -0.12em,
var(--trans),
var(--trans) 0.34em,
var(--butter) 0.35em,
var(--butter) 0.4em,
var(--trans) 0.41em,
var(--trans) 0.74em),
repeating-radial-gradient(
circle at 0em 0.5em,
var(--trans),
var(--trans) 0.24em,
var(--robins-egg) 0.25em,
var(--robins-egg) 0.31em,
var(--trans) 0.32em,
var(--trans) 0.77em),
repeating-radial-gradient(
circle at 1em 0.5em,
var(--trans),
var(--trans) 0.24em,
var(--robins-egg) 0.25em,
var(--robins-egg) 0.31em,
var(--trans) 0.32em,
var(--trans) 0.77em);
background-size: 1em 1em;
}
.lawn {
background-color: var(--clay);
background-image:repeating-radial-gradient(
circle at -0.7em 1.02em,
var(--trans),
var(--trans) 0.45em,
var(--robins-egg) 0.46em,
var(--robins-egg) 0.54em,
var(--trans) 0.55em,
var(--trans) 0.92em),
repeating-radial-gradient(
circle at 1.7em 1.02em,
var(--trans),
var(--trans) 0.45em,
var(--robins-egg) 0.46em,
var(--robins-egg) 0.54em,
var(--trans) 0.55em,
var(--trans) 0.92em),
repeating-radial-gradient(
circle at 1.34em 1.1em,
var(--trans),
var(--trans) 0.34em,
var(--spring) 0.35em,
var(--spring) 0.44em,
var(--trans) 0.45em,
var(--trans) 0.9em),
repeating-radial-gradient(
circle at -0.34em 1.1em,
var(--trans),
var(--trans) 0.34em,
var(--spring) 0.35em,
var(--spring) 0.44em,
var(--trans) 0.45em,
var(--trans) 0.9em),
repeating-radial-gradient(
circle at 0em 0.98em,
var(--trans),
var(--trans) 0.34em,
var(--sea-glass) 0.35em,
var(--sea-glass) 0.44em,
var(--trans) 0.45em,
var(--trans) 0.72em),
repeating-radial-gradient(
circle at 1em 0.98em,
var(--trans),
var(--trans) 0.34em,
var(--sea-glass) 0.35em,
var(--sea-glass) 0.44em,
var(--trans) 0.45em,
var(--trans) 0.72em);
background-size: 1em 1em;
}
.nightclub {
background-color: var(--navy);
background-image:repeating-radial-gradient(
circle at -0.3em 1.02em,
var(--trans),
var(--trans) 0.5em,
var(--peach) 0.51em,
var(--peach) 0.54em,
var(--trans) 0.55em,
var(--trans) 0.953em),
repeating-radial-gradient(
circle at 1.3em 1.02em,
var(--trans),
var(--trans) 0.5em,
var(--peach) 0.51em,
var(--peach) 0.54em,
var(--trans) 0.55em,
var(--trans) 0.953em),
repeating-radial-gradient(
circle at 1.04em 1em,
var(--trans),
var(--trans) 0.4em,
var(--orange) 0.41em,
var(--orange) 0.44em,
var(--trans) 0.45em,
var(--trans) 0.775em),
repeating-radial-gradient(
circle at -0.04em 1em,
var(--trans),
var(--trans) 0.4em,
var(--orange) 0.41em,
var(--orange) 0.44em,
var(--trans) 0.45em,
var(--trans) 0.775em),
repeating-radial-gradient(
circle at 0.06em 0.98em,
var(--trans),
var(--trans) 0.4em,
var(--coral) 0.41em,
var(--coral) 0.44em,
var(--trans) 0.45em,
var(--trans) 0.64em),
repeating-radial-gradient(
circle at 0.94em 0.98em,
var(--trans),
var(--trans) 0.4em,
var(--coral) 0.41em,
var(--coral) 0.44em,
var(--trans) 0.45em,
var(--trans) 0.64em);
background-size: 1em 1em;
}
.chinese-lanterns {
background-color: var(--carmine);
background-image:repeating-radial-gradient(
circle at -0.3em 0.5em,
var(--trans),
var(--trans) 0.5em,
var(--peach) 0.51em,
var(--peach) 0.54em,
var(--trans) 0.55em,
var(--trans) 0.7em),
repeating-radial-gradient(
circle at 1.3em 0.5em,
var(--trans),
var(--trans) 0.5em,
var(--peach) 0.51em,
var(--peach) 0.54em,
var(--trans) 0.55em,
var(--trans) 0.7em),
repeating-radial-gradient(
circle at 1.04em 0.5em,
var(--trans),
var(--trans) 0.4em,
var(--orange) 0.41em,
var(--orange) 0.44em,
var(--trans) 0.45em,
var(--trans) 0.7em),
repeating-radial-gradient(
circle at 0.06em 0.5em,
var(--trans),
var(--trans) 0.4em,
var(--coral) 0.41em,
var(--coral) 0.44em,
var(--trans) 0.45em,
var(--trans) 0.55em),
repeating-radial-gradient(
circle at 0.94em 0.5em,
var(--trans),
var(--trans) 0.4em,
var(--coral) 0.41em,
var(--coral) 0.44em,
var(--trans) 0.45em,
var(--trans) 0.55em),
repeating-radial-gradient(
circle at -0.04em 0.5em,
var(--trans),
var(--trans) 0.4em,
var(--orange) 0.41em,
var(--orange) 0.44em,
var(--trans) 0.45em,
var(--trans) 0.7em);
background-size: 1em 1em;
}
.pumpkin-spice {
background-color: var(--apricot);
background-image:repeating-radial-gradient(
circle at -0.3em 0.5em,
var(--trans),
var(--trans) 0.5em,
var(--peach) 0.51em,
var(--peach) 0.55em,
var(--trans) 0.56em,
var(--trans) 0.8em),
repeating-radial-gradient(
circle at 1.3em 0.5em,
var(--trans),
var(--trans) 0.5em,
var(--peach) 0.51em,
var(--peach) 0.55em,
var(--trans) 0.56em,
var(--trans) 0.8em),
repeating-radial-gradient(
circle at 1.05em 0.5em,
var(--trans),
var(--trans) 0.4em,
var(--peach) 0.41em,
var(--peach) 0.45em,
var(--trans) 0.46em,
var(--trans) 0.8em),
repeating-radial-gradient(
circle at 0.05em 0.5em,
var(--trans),
var(--trans) 0.4em,
var(--peach) 0.41em,
var(--peach) 0.45em,
var(--trans) 0.46em,
var(--trans) 0.8em),
repeating-radial-gradient(
circle at 0.95em 0.5em,
var(--trans),
var(--trans) 0.4em,
var(--peach) 0.41em,
var(--peach) 0.45em,
var(--trans) 0.46em,
var(--trans) 0.8em),
repeating-radial-gradient(
circle at -0.05em 0.5em,
var(--trans),
var(--trans) 0.4em,
var(--peach) 0.41em,
var(--peach) 0.45em,
var(--trans) 0.46em,
var(--trans) 0.8em);
background-size: 1em 1em;
}
.feline {
background-color: var(--purple-slate);
background-image:repeating-radial-gradient(
circle at -0.3em 0.5em,
var(--ink),
var(--ink) 0.4em,
var(--trans) 0.415em,
var(--trans) 2em),
repeating-radial-gradient(
circle at 1.3em 0.5em,
var(--ink),
var(--ink) 0.4em,
var(--trans) 0.415em,
var(--trans) 2em),
repeating-radial-gradient(
circle at 1em 0.5em,
var(--spearmint),
var(--emerald) 0.3em,
var(--trans) 0.315em,
var(--trans) 2em),
repeating-radial-gradient(
circle at 0em 0.5em,
var(--spearmint),
var(--emerald) 0.3em,
var(--trans) 0.315em,
var(--trans) 2em);
background-size: 1em 1em;
}
.propeller {
background-color: var(--pond-bottom);
background-image:repeating-radial-gradient(
circle at 0em 1em,
var(--trans),
var(--trans) 0.14em,
var(--ivory) 0.154em,
var(--ivory) 0.26em,
var(--trans) 0.27em,
var(--trans) 0.6em),
repeating-radial-gradient(
circle at 1em 0em,
var(--trans),
var(--trans) 0.14em,
var(--ivory) 0.15em,
var(--ivory) 0.26em,
var(--trans) 0.27em,
var(--trans) 0.6em),
repeating-radial-gradient(
circle at 1em 1em,
var(--trans),
var(--trans) 0.14em,
var(--spearmint) 0.15em,
var(--spearmint) 0.26em,
var(--trans) 0.27em,
var(--trans) 0.6em),
repeating-radial-gradient(
circle at 0em 0em,
var(--trans),
var(--trans) 0.14em,
var(--spearmint) 0.15em,
var(--spearmint) 0.26em,
var(--trans) 0.27em,
var(--trans) 0.6em);
background-size: 1em 1em;
}
.origami {
background-color: var(--ink);
background-image:repeating-radial-gradient(
circle at 0em 1em,
var(--trans),
var(--trans) 0.14em,
var(--mushroom) 0.154em,
var(--mushroom) 0.29em,
var(--trans) 0.31em,
var(--trans) 1.01em),
repeating-radial-gradient(
circle at 1em 0em,
var(--trans),
var(--trans) 0.14em,
var(--mushroom) 0.15em,
var(--mushroom) 0.29em,
var(--trans) 0.31em,
var(--trans) 1.01em),
repeating-radial-gradient(
circle at 1em 1em,
var(--trans),
var(--trans) 0.14em,
var(--limestone) 0.15em,
var(--limestone) 0.29em,
var(--trans) 0.31em,
var(--trans) 1.01em),
repeating-radial-gradient(
circle at 0em 0em,
var(--trans),
var(--trans) 0.14em,
var(--limestone) 0.15em,
var(--limestone) 0.29em,
var(--trans) 0.31em,
var(--trans) 1.01em);
background-size: 1em 1em;
}
.shortbread-shake {
background-color: var(--twilight);
background-image:repeating-radial-gradient(
circle at -0.1em 0.71em,
var(--trans),
var(--trans) 0.16em,
var(--hazelnut) 0.17em,
var(--butter) 0.29em,
var(--trans) 0.31em,
var(--trans) 1.01em),
repeating-radial-gradient(
circle at 1.1em 0.29em,
var(--trans),
var(--trans) 0.16em,
var(--butter) 0.17em,
var(--hazelnut) 0.29em,
var(--trans) 0.31em,
var(--trans) 1.01em),
repeating-radial-gradient(
circle at 0.71em 1.1em,
var(--trans),
var(--trans) 0.16em,
var(--butter) 0.17em,
var(--hazelnut) 0.29em,
var(--trans) 0.31em,
var(--trans) 1.01em),
repeating-radial-gradient(
circle at 0.29em -0.1em,
var(--trans),
var(--trans) 0.16em,
var(--hazelnut) 0.17em,
var(--butter) 0.29em,
var(--trans) 0.31em,
var(--trans) 1.01em);
background-size: 1em 1em;
}
.fall {
background-color: var(--ruby);
background-image:repeating-radial-gradient(
circle at -0.19em 0.52em,
var(--trans),
var(--trans) 0.18em,
var(--burnt-orange) 0.19em,
var(--apricot) 0.29em,
var(--trans) 0.31em,
var(--trans) 2em),
repeating-radial-gradient(
circle at 1.19em 0.48em,
var(--trans),
var(--trans) 0.18em,
var(--apricot) 0.19em,
var(--apricot) 0.29em,
var(--trans) 0.31em,
var(--trans) 2em),
repeating-radial-gradient(
circle at 0.52em 1.19em,
var(--trans),
var(--trans) 0.18em,
var(--burnt-orange) 0.19em,
var(--apricot) 0.29em,
var(--trans) 0.31em,
var(--trans) 2em),
repeating-radial-gradient(
circle at 0.48em -0.19em,
var(--trans),
var(--trans) 0.18em,
var(--apricot) 0.19em,
var(--apricot) 0.29em,
var(--trans) 0.31em,
var(--trans) 2em);
background-size: 1em 1em;
}
.sea-wall {
background-color: var(--sage);
background-image:
repeating-radial-gradient(
circle at 0.5em 0.5em,
var(--trans),
var(--trans) 0.16em,
var(--apricot) 0.17em,
var(--apricot) 0.27em,
var(--trans) 0.28em,
var(--trans) 0.4em),
repeating-radial-gradient(
circle at -0.32em -0.32em,
var(--clay),
var(--clay) 0.15em,
var(--apricot) 0.16em,
var(--apricot) 0.27em,
var(--trans) 0.28em,
var(--trans) 0.58em);
background-size: 1em 1em;
}
.whispers {
background-color: var(--beetroot);
background-image:
repeating-radial-gradient(
circle at 0.88em 1.07em,
var(--trans),
var(--trans) 0.16em,
var(--purple-slate) 0.17em,
var(--purple-slate) 0.23em,
var(--trans) 0.24em,
var(--trans) 0.38em),
repeating-radial-gradient(
circle at 0.12em -0.055em,
var(--trans),
var(--trans) 0.16em,
var(--purple-slate) 0.17em,
var(--purple-slate) 0.23em,
var(--trans) 0.24em,
var(--trans) 0.38em);
background-size: 1em 1em;
}
.low-pressure {
background-color: var(--lapis);
background-image:
repeating-radial-gradient(
circle at 0.82em 0.82em,
var(--trans),
var(--trans) 0.16em,
var(--blue-tack) 0.17em,
var(--blue-tack) 0.21em,
var(--trans) 0.22em,
var(--trans) 0.26em),
repeating-radial-gradient(
var(--trans) 0.16em,
var(--blue-tack) 0.17em,
var(--blue-tack) 0.21em,
var(--trans) 0.22em,
var(--trans) 0.24em);
background-size: 1em 1em;
}
.cyclone {
background-color: var(--lapis);
background-image:repeating-radial-gradient(
circle at -0.19em 0.55em,
var(--trans),
var(--trans) 0.25em,
var(--blue-tack) 0.26em,
var(--blue-tack) 0.29em,
var(--trans) 0.3em,
var(--trans) 2em),
repeating-radial-gradient(
circle at 1.19em 0.46em,
var(--trans),
var(--trans) 0.25em,
var(--blue-tack) 0.26em,
var(--blue-tack) 0.29em,
var(--trans) 0.3em,
var(--trans) 2em),
repeating-radial-gradient(
circle at 0.6em 1em,
var(--trans),
var(--trans) 0.14em,
var(--blue-tack) 0.15em,
var(--blue-tack) 0.18em,
var(--trans) 0.19em,
var(--trans) 0.2em),
repeating-radial-gradient(
circle at 0.4em 0em,
var(--trans),
var(--trans) 0.14em,
var(--blue-tack) 0.15em,
var(--blue-tack) 0.18em,
var(--trans) 0.19em,
var(--trans) 0.2em);
background-size: 1em 1em;
}
.water-trail {
background-color: var(--lapis);
background-image:repeating-radial-gradient(
circle at 0em 0.5em,
var(--trans),
var(--trans) 0.14em,
var(--blue-tack) 0.15em,
var(--blue-tack) 0.18em,
var(--trans) 0.19em,
var(--trans) 0.54em),
repeating-radial-gradient(
circle at 1em 0.5em,
var(--trans),
var(--trans) 0.14em,
var(--blue-tack) 0.15em,
var(--blue-tack) 0.18em,
var(--trans) 0.19em,
var(--trans) 0.54em),
repeating-radial-gradient(
circle at 0.5em 1em,
var(--trans),
var(--trans) 0.14em,
var(--blue-tack) 0.15em,
var(--blue-tack) 0.18em,
var(--trans) 0.19em,
var(--trans) 0.54em),
repeating-radial-gradient(
circle at 0.5em 0em,
var(--trans),
var(--trans) 0.14em,
var(--blue-tack) 0.15em,
var(--blue-tack) 0.18em,
var(--trans) 0.19em,
var(--trans) 0.54em),
repeating-radial-gradient(
circle at 0em 0.5em,
var(--trans),
var(--trans) 0.12em,
var(--royal) 0.13em,
var(--royal) 0.23em,
var(--trans) 0.24em,
var(--trans) 0.56em),
repeating-radial-gradient(
circle at 1em 0.5em,
var(--trans),
var(--trans) 0.12em,
var(--royal) 0.13em,
var(--royal) 0.23em,
var(--trans) 0.24em,
var(--trans) 0.56em),
repeating-radial-gradient(
circle at 0.5em 1em,
var(--trans),
var(--trans) 0.12em,
var(--royal) 0.13em,
var(--royal) 0.23em,
var(--trans) 0.24em,
var(--trans) 0.56em),
repeating-radial-gradient(
circle at 0.5em 0em,
var(--trans),
var(--trans) 0.12em,
var(--royal) 0.13em,
var(--royal) 0.23em,
var(--trans) 0.24em,
var(--trans) 0.56em);
background-size: 1em 1em;
}
.fishing-net {
background-color: var(--sea-foam);
background-image:
repeating-radial-gradient(
circle at 0em 0.5em,
var(--trans),
var(--trans) 0.12em,
var(--mink) 0.13em,
var(--mink) 0.21em,
var(--trans) 0.22em,
var(--trans) 0.5em),
repeating-radial-gradient(
circle at 1em 0.5em,
var(--trans),
var(--trans) 0.12em,
var(--limestone) 0.13em,
var(--limestone) 0.21em,
var(--trans) 0.22em,
var(--trans) 0.5em),
repeating-radial-gradient(
circle at 0.5em 1em,
var(--trans),
var(--trans) 0.12em,
var(--mink) 0.13em,
var(--mink) 0.21em,
var(--trans) 0.22em,
var(--trans) 0.5em),
repeating-radial-gradient(
circle at 0.5em 0em,
var(--trans),
var(--trans) 0.12em,
var(--limestone) 0.13em,
var(--limestone) 0.21em,
var(--trans) 0.22em,
var(--trans) 0.5em);
background-size: 1em 1em;
}
.instrument-panel {
background-color: var(--mint);
background-image:
repeating-radial-gradient(
circle at 0em 0.5em,
var(--trans),
var(--trans) 0.12em,
var(--mint) 0.13em,
var(--mint) 0.22em,
var(--trans) 0.23em,
var(--trans) 0.5em),
repeating-radial-gradient(
circle at 1em 0.5em,
var(--trans),
var(--trans) 0.12em,
var(--mint) 0.13em,
var(--mint) 0.22em,
var(--trans) 0.23em,
var(--trans) 0.5em),
repeating-radial-gradient(
circle at 0.5em 1em,
var(--trans),
var(--trans) 0.12em,
var(--pale-lemon) 0.13em,
var(--pale-lemon) 0.17em,
var(--trans) 0.18em,
var(--trans) 0.29em),
repeating-radial-gradient(
circle at 0.5em 0em,
var(--trans),
var(--trans) 0.12em,
var(--lemon) 0.13em,
var(--lemon) 0.17em,
var(--trans) 0.18em,
var(--trans) 0.29em);
background-size: 1em 1em;
}
.spider-weave {
background-color: var(--purple-slate);
background-image:
repeating-radial-gradient(
circle at 0em 0.5em,
var(--trans),
var(--trans) 0.12em,
var(--hazelnut) 0.13em,
var(--hazelnut) 0.20em,
var(--trans) 0.21em,
var(--trans) 0.29em),
repeating-radial-gradient(
circle at 1em 0.5em,
var(--trans),
var(--trans) 0.12em,
var(--hazelnut) 0.13em,
var(--hazelnut) 0.20em,
var(--trans) 0.21em,
var(--trans) 0.29em),
repeating-radial-gradient(
circle at 0.5em 1em,
var(--trans),
var(--trans) 0.12em,
var(--bronze) 0.13em,
var(--bronze) 0.20em,
var(--trans) 0.21em,
var(--trans) 0.29em),
repeating-radial-gradient(
circle at 0.5em 0em,
var(--trans),
var(--trans) 0.12em,
var(--bronze) 0.13em,
var(--bronze) 0.20em,
var(--trans) 0.21em,
var(--trans) 0.29em);
background-size: 1em 1em;
}
.echo-owl {
background-color: var(--clay);
background-image:
repeating-radial-gradient(
circle at 0.2em 0.5em,
var(--trans),
var(--trans) 0.1em,
var(--mink) 0.11em,
var(--mink) 0.14em,
var(--trans) 0.15em,
var(--trans) 0.26em),
repeating-radial-gradient(
circle at 0.8em 0.5em,
var(--trans),
var(--trans) 0.1em,
var(--mink) 0.11em,
var(--mink) 0.14em,
var(--trans) 0.15em,
var(--trans) 0.26em);
background-size: 1em 1em;
}
.sugar-lattice {
background-image:
linear-gradient(
45deg,
var(--sakura),
var(--dusty-pink));
}
.sugar-lattice::after {
background-image:
repeating-radial-gradient(
circle at 0.2em 0.5em,
var(--trans),
var(--trans) 0.1em,
var(--ivory) 0.11em,
var(--ivory) 0.14em,
var(--trans) 0.15em,
var(--trans) 0.26em),
repeating-radial-gradient(
circle at 0.8em 0.5em,
var(--trans),
var(--trans) 0.1em,
var(--ivory) 0.11em,
var(--ivory) 0.14em,
var(--trans) 0.15em,
var(--trans) 0.26em),
repeating-radial-gradient(
circle at 0.5em 0.8em,
var(--trans),
var(--trans) 0.1em,
var(--ivory) 0.11em,
var(--ivory) 0.14em,
var(--trans) 0.15em,
var(--trans) 0.26em),
repeating-radial-gradient(
circle at 0.5em 0.2em,
var(--trans),
var(--trans) 0.1em,
var(--ivory) 0.11em,
var(--ivory) 0.14em,
var(--trans) 0.15em,
var(--trans) 0.26em);
background-size: 1em 1em;
}
.copper-clasp {
background-image:
linear-gradient(
var(--sakura),
var(--apricot),
var(--chestnut));
}
.copper-clasp::after {
background-image:
repeating-radial-gradient(
circle at 0.15em 0.5em,
var(--trans),
var(--trans) 0.17em,
var(--sage) 0.18em,
var(--sage) 0.20em,
var(--trans) 0.21em,
var(--trans) 0.26em),
repeating-radial-gradient(
circle at 0.85em 0.5em,
var(--trans),
var(--trans) 0.17em,
var(--sage) 0.18em,
var(--sage) 0.20em,
var(--trans) 0.21em,
var(--trans) 0.26em),
repeating-radial-gradient(
circle at 0.5em 0.85em,
var(--trans),
var(--trans) 0.17em,
var(--sage) 0.18em,
var(--sage) 0.20em,
var(--trans) 0.21em,
var(--trans) 0.26em),
repeating-radial-gradient(
circle at 0.5em 0.15em,
var(--trans),
var(--trans) 0.17em,
var(--sage) 0.18em,
var(--sage) 0.20em,
var(--trans) 0.21em,
var(--trans) 0.26em);
background-size: 1em 1em;
}
.circulation {
background-color: var(--lapis);
background-image:
repeating-radial-gradient(
circle at 0.02em 0.5em,
var(--trans),
var(--trans) 0.17em,
var(--apricot) 0.18em,
var(--apricot) 0.20em,
var(--trans) 0.21em,
var(--trans) 0.24em),
repeating-radial-gradient(
circle at 0.98em 0.5em,
var(--trans),
var(--trans) 0.17em,
var(--apricot) 0.18em,
var(--apricot) 0.20em,
var(--trans) 0.21em,
var(--trans) 0.24em),
repeating-radial-gradient(
circle at 0.5em 0.98em,
var(--trans),
var(--trans) 0.17em,
var(--peach) 0.18em,
var(--peach) 0.20em,
var(--trans) 0.21em,
var(--trans) 0.24em),
repeating-radial-gradient(
circle at 0.5em 0.02em,
var(--trans),
var(--trans) 0.17em,
var(--peach) 0.18em,
var(--peach) 0.20em,
var(--trans) 0.21em,
var(--trans) 0.24em);
background-size: 1em 1em;
}
.money-zoom {
background-color: var(--sea-foam);
background-image:
repeating-radial-gradient(
circle at 0.02em 0.5em,
var(--trans),
var(--trans) 0.16em,
var(--pond-bottom) 0.17em,
var(--pond-bottom) 0.23em,
var(--trans) 0.24em,
var(--trans) 0.25em),
repeating-radial-gradient(
circle at 0.98em 0.5em,
var(--trans),
var(--trans) 0.16em,
var(--pond-bottom) 0.17em,
var(--pond-bottom) 0.23em,
var(--trans) 0.24em,
var(--trans) 0.25em),
repeating-radial-gradient(
circle at 0.5em 0.98em,
var(--trans),
var(--trans) 0.16em,
var(--succulent) 0.17em,
var(--succulent) 0.23em,
var(--trans) 0.24em,
var(--trans) 0.25em),
repeating-radial-gradient(
circle at 0.5em 0.02em,
var(--trans),
var(--trans) 0.16em,
var(--succulent) 0.17em,
var(--succulent) 0.23em,
var(--trans) 0.24em,
var(--trans) 0.25em);
background-size: 1em 1em;
}
.headstone {
background-color: var(--sakura);
background-image:
repeating-radial-gradient(
circle at 0.12em 0.5em,
var(--trans),
var(--trans) 0.16em,
var(--limestone) 0.17em,
var(--limestone) 0.23em,
var(--trans) 0.24em,
var(--trans) 0.25em),
repeating-radial-gradient(
circle at 0.88em 0.5em,
var(--trans),
var(--trans) 0.16em,
var(--limestone) 0.17em,
var(--limestone) 0.23em,
var(--trans) 0.24em,
var(--trans) 0.25em),
repeating-radial-gradient(
circle at 0.5em 0.88em,
var(--trans),
var(--trans) 0.16em,
var(--limestone) 0.17em,
var(--limestone) 0.23em,
var(--trans) 0.24em,
var(--trans) 0.25em),
repeating-radial-gradient(
circle at 0.5em 0.12em,
var(--trans),
var(--trans) 0.16em,
var(--limestone) 0.17em,
var(--limestone) 0.23em,
var(--trans) 0.24em,
var(--trans) 0.25em);
background-size: 1em 1em;
}
.moth-bot {
background-color: var(--chestnut);
background-image:
repeating-radial-gradient(
circle at 0.22em 0.5em,
var(--trans),
var(--trans) 0.16em,
var(--coral) 0.17em,
var(--coral) 0.23em,
var(--trans) 0.24em,
var(--trans) 0.55em),
repeating-radial-gradient(
circle at 0.78em 0.5em,
var(--trans),
var(--trans) 0.16em,
var(--coral) 0.17em,
var(--coral) 0.23em,
var(--trans) 0.24em,
var(--trans) 0.55em),
repeating-radial-gradient(
circle at 0.5em 0.68em,
var(--trans),
var(--trans) 0.16em,
var(--coral) 0.17em,
var(--coral) 0.23em,
var(--trans) 0.24em,
var(--trans) 0.55em),
repeating-radial-gradient(
circle at 0.5em 0.32em,
var(--trans),
var(--trans) 0.16em,
var(--coral) 0.17em,
var(--coral) 0.23em,
var(--trans) 0.24em,
var(--trans) 0.55em);
background-size: 1em 1em;
}
.motor-warp {
background-color: var(--limestone);
background-image:
repeating-radial-gradient(
circle at 0.22em 0.5em,
var(--trans),
var(--trans) 0.16em,
var(--ink) 0.17em,
var(--ink) 0.23em,
var(--trans) 0.24em,
var(--trans) 0.25em),
repeating-radial-gradient(
circle at 0.78em 0.5em,
var(--trans),
var(--trans) 0.16em,
var(--ink) 0.17em,
var(--ink) 0.23em,
var(--trans) 0.24em,
var(--trans) 0.25em),
repeating-radial-gradient(
circle at 0.5em 0.78em,
var(--trans),
var(--trans) 0.16em,
var(--ink) 0.17em,
var(--ink) 0.23em,
var(--trans) 0.24em,
var(--trans) 0.25em),
repeating-radial-gradient(
circle at 0.5em 0.22em,
var(--trans),
var(--trans) 0.16em,
var(--ink) 0.17em,
var(--ink) 0.23em,
var(--trans) 0.24em,
var(--trans) 0.25em);
background-size: 1em 1em;
}
.neon-mesh {
background-color: var(--sea-fog);
background-image:
repeating-radial-gradient(
circle at 0.22em 0.5em,
var(--trans),
var(--trans) 0.16em,
var(--orange) 0.17em,
var(--orange) 0.23em,
var(--trans) 0.24em,
var(--trans) 0.5em),
repeating-radial-gradient(
circle at 0.78em 0.5em,
var(--trans),
var(--trans) 0.16em,
var(--orange) 0.17em,
var(--orange) 0.23em,
var(--trans) 0.24em,
var(--trans) 0.5em),
repeating-radial-gradient(
circle at 0.5em 0.78em,
var(--trans),
var(--trans) 0.16em,
var(--orange) 0.17em,
var(--orange) 0.23em,
var(--trans) 0.24em,
var(--trans) 0.5em),
repeating-radial-gradient(
circle at 0.5em 0.22em,
var(--trans),
var(--trans) 0.16em,
var(--orange) 0.17em,
var(--orange) 0.23em,
var(--trans) 0.24em,
var(--trans) 0.5em);
background-size: 1em 1em;
}
.ninja-star {
background-color: var(--purple-slate);
background-image:
repeating-radial-gradient(
circle at 0.22em 0.5em,
var(--trans),
var(--trans) 0.16em,
var(--magenta) 0.17em,
var(--magenta) 0.22em,
var(--trans) 0.23em,
var(--trans) 0.65em),
repeating-radial-gradient(
circle at 0.78em 0.5em,
var(--trans),
var(--trans) 0.16em,
var(--magenta) 0.17em,
var(--magenta) 0.22em,
var(--trans) 0.23em,
var(--trans) 0.65em),
repeating-radial-gradient(
circle at 0.5em 0.78em,
var(--trans),
var(--trans) 0.16em,
var(--magenta) 0.17em,
var(--magenta) 0.22em,
var(--trans) 0.23em,
var(--trans) 0.65em),
repeating-radial-gradient(
circle at 0.5em 0.22em,
var(--trans),
var(--trans) 0.16em,
var(--magenta) 0.17em,
var(--magenta) 0.22em,
var(--trans) 0.23em,
var(--trans) 0.65em);
background-size: 1em 1em;
}
.braid {
background-color: var(--purple-slate);
background-image:
repeating-radial-gradient(
circle at 0.24em 0.5em,
var(--trans),
var(--trans) 0.2em,
var(--lemon) 0.215em,
var(--lemon) 0.26em,
var(--trans) 0.285em,
var(--trans) 0.9em),
repeating-radial-gradient(
circle at 0.76em 0.5em,
var(--trans),
var(--trans) 0.2em,
var(--lemon) 0.215em,
var(--lemon) 0.26em,
var(--trans) 0.285em,
var(--trans) 0.9em),
repeating-radial-gradient(
circle at 0.5em 0.76em,
var(--trans),
var(--trans) 0.2em,
var(--lemon) 0.215em,
var(--lemon) 0.26em,
var(--trans) 0.285em,
var(--trans) 0.9em),
repeating-radial-gradient(
circle at 0.5em 0.24em,
var(--trans),
var(--trans) 0.2em,
var(--lemon) 0.215em,
var(--lemon) 0.26em,
var(--trans) 0.285em,
var(--trans) 0.9em),
repeating-radial-gradient(
circle at 0.24em 0.5em,
var(--trans),
var(--trans) 0.12em,
var(--butter) 0.135em,
var(--butter) 0.32em,
var(--trans) 0.335em,
var(--trans) 0.9em),
repeating-radial-gradient(
circle at 0.76em 0.5em,
var(--trans),
var(--trans) 0.12em,
var(--butter) 0.135em,
var(--butter) 0.32em,
var(--trans) 0.335em,
var(--trans) 0.9em),
repeating-radial-gradient(
circle at 0.5em 0.76em,
var(--trans),
var(--trans) 0.12em,
var(--butter) 0.135em,
var(--butter) 0.32em,
var(--trans) 0.335em,
var(--trans) 0.9em),
repeating-radial-gradient(
circle at 0.5em 0.24em,
var(--trans),
var(--trans) 0.12em,
var(--butter) 0.135em,
var(--butter) 0.32em,
var(--trans) 0.335em,
var(--trans) 0.9em);
background-size: 1em 1em;
}
.the-pond {
background-color: var(--pond-bottom);
background-image:
repeating-radial-gradient(
circle at 0.24em 0.5em,
var(--trans),
var(--trans) 0.12em,
var(--sage) 0.13em,
var(--sage) 0.22em,
var(--trans) 0.23em,
var(--trans) 0.9em),
repeating-radial-gradient(
circle at 0.76em 0.5em,
var(--trans),
var(--trans) 0.12em,
var(--sage) 0.13em,
var(--sage) 0.22em,
var(--trans) 0.23em,
var(--trans) 0.9em),
repeating-radial-gradient(
circle at 0.5em 0.76em,
var(--trans),
var(--trans) 0.12em,
var(--sage) 0.13em,
var(--sage) 0.22em,
var(--trans) 0.23em,
var(--trans) 0.9em),
repeating-radial-gradient(
circle at 0.5em 0.24em,
var(--trans),
var(--trans) 0.12em,
var(--sage) 0.13em,
var(--sage) 0.22em,
var(--trans) 0.23em,
var(--trans) 0.9em);
background-size: 1em 1em;
}
.segments {
background-color: var(--apricot);
background-image:
repeating-radial-gradient(
circle at 0.48em 1em,
var(--trans),
var(--trans) 0.1em,
var(--twilight) 0.11em,
var(--twilight) 0.2em,
var(--trans) 0.21em,
var(--trans) 0.9em),
repeating-radial-gradient(
circle at 1.52em 1em,
var(--trans),
var(--trans) 0.1em,
var(--lapis) 0.11em,
var(--lapis) 0.2em,
var(--trans) 0.21em,
var(--trans) 0.9em),
repeating-radial-gradient(
circle at 1em 1.52em,
var(--trans),
var(--trans) 0.1em,
var(--navy) 0.11em,
var(--navy) 0.2em,
var(--trans) 0.21em,
var(--trans) 0.9em),
repeating-radial-gradient(
circle at 1em 0.48em,
var(--trans),
var(--trans) 0.1em,
var(--slate) 0.11em,
var(--slate) 0.2em,
var(--trans) 0.21em,
var(--trans) 0.9em);
background-size: 2em 2em;
}
.biohazard {
background-color: var(--butter);
background-image:
repeating-radial-gradient(
circle at 1.01em 1.07em,
var(--butter),
var(--butter) 0.07em,
var(--trans) 0.085em,
var(--trans) 2em),
repeating-radial-gradient(
circle at 1.45em 1.3em,
var(--trans),
var(--trans) 0.3em,
var(--butter) 0.315em,
var(--butter) 0.34em,
var(--trans) 0.355em,
var(--trans) 2em),
repeating-radial-gradient(
circle at 0.57em 1.3em,
var(--trans),
var(--trans) 0.3em,
var(--butter) 0.315em,
var(--butter) 0.34em,
var(--trans) 0.355em,
var(--trans) 2em),
repeating-radial-gradient(
circle at 1em 0.58em,
var(--trans),
var(--trans) 0.3em,
var(--butter) 0.315em,
var(--butter) 0.34em,
var(--trans) 0.355em,
var(--trans) 2em),
repeating-radial-gradient(
circle at 1.01em 1.06em,
var(--trans),
var(--trans) 0.3em,
var(--raspberry-jam) 0.315em,
var(--raspberry-jam) 0.4em,
var(--trans) 0.415em,
var(--trans) 2em),
repeating-radial-gradient(
circle at 1em 0.58em,
var(--butter),
var(--butter) 0.34em,
var(--trans) 0.355em,
var(--trans) 2em),
repeating-radial-gradient(
circle at 1em 0.65em,
var(--raspberry-jam),
var(--raspberry-jam) 0.4em,
var(--trans) 0.415em,
var(--trans) 2em),
repeating-radial-gradient(
circle at 0.57em 1.3em,
var(--butter),
var(--butter) 0.34em,
var(--trans) 0.355em,
var(--trans) 2em),
repeating-radial-gradient(
circle at 0.65em 1.25em,
var(--raspberry-jam),
var(--raspberry-jam) 0.4em,
var(--trans) 0.415em,
var(--trans) 2em),
repeating-radial-gradient(
circle at 1.45em 1.3em,
var(--butter),
var(--butter) 0.34em,
var(--trans) 0.355em,
var(--trans) 2em),
repeating-radial-gradient(
circle at 1.35em 1.25em,
var(--raspberry-jam),
var(--raspberry-jam) 0.4em,
var(--trans) 0.415em,
var(--trans) 2em);
background-size: 2em 2em;
}
.phone-alert-system {
background-color: var(--coral);
background-image:
repeating-linear-gradient(
-45deg,
var(--sea-foam),
var(--sea-foam) 0.2em,
var(--trans) 0.2em,
var(--trans) 1.22em,
var(--sea-foam) 1.22em,
var(--sea-foam) 2em),
repeating-linear-gradient(
45deg,
var(--sea-foam),
var(--sea-foam) 0.47em,
var(--trans) 0.47em,
var(--trans) 0.93em,
var(--sea-foam) 0.93em,
var(--sea-foam) 2em),
repeating-linear-gradient(
-45deg,
var(--ink),
var(--ink) 0.3em,
var(--trans) 0.3em,
var(--trans) 1.16em,
var(--ink) 1.16em,
var(--ink) 1.1em),
repeating-linear-gradient(
45deg,
var(--ink),
var(--ink) 0.52em,
var(--trans) 0.52em,
var(--trans) 0.88em,
var(--ink) 0.88em,
var(--ink) 1.1em);
background-size: 1em 1em;
}
.life-buoy {
background-color: var(--coral);
background-image:
repeating-linear-gradient(
45deg,
var(--trans),
var(--trans) 0.64em,
var(--white) 0.64em,
var(--white) 0.76em,
var(--trans) 0.76em,
var(--trans) 1em),
repeating-linear-gradient(
-45deg,
var(--trans),
var(--trans) 0.64em,
var(--white) 0.64em,
var(--white) 0.76em,
var(--trans) 0.76em,
var(--trans) 1em);
background-size: 1em 1em;
}
.life-buoy::after {
background-image:
repeating-radial-gradient(
circle at 0.5em 0.5em,
var(--sea-glass),
var(--sea-glass) 0.22em,
var(--trans) 0.23em,
var(--trans) 0.38em,
var(--sea-glass) 0.39em,
var(--sea-glass) 0.5em);
background-size: 1em 1em;
}
.lobby {
background-color: var(--ink);
background-image:
repeating-linear-gradient(
-45deg,
var(--ivory),
var(--ivory) 0.42em,
var(--trans) 0.42em,
var(--trans) 0.98em,
var(--ivory) 0.98em,
var(--ivory) 1em),
repeating-linear-gradient(
45deg,
var(--ivory),
var(--ivory) 0.42em,
var(--trans) 0.42em,
var(--trans) 0.98em,
var(--ivory) 0.98em,
var(--ivory) 1em);
background-size: 1em 1em;
}
.target {
background-color: var(--coral);
background-image:
repeating-radial-gradient(
circle at 0.5em 0.5em,
var(--trans),
var(--trans) 0.14em,
var(--ivory) 0.15em,
var(--ivory) 0.28em,
var(--trans) 0.29em);
background-size: 1em 1em;
}
.confetti2 {
background-color: var(--coral);
background-image:
repeating-radial-gradient(
circle at 0.4em 0.4em,
var(--coral),
var(--coral) 0.05em,
var(--orange) 0.13em,
var(--peach) 0.34em,
var(--peach) 0.6em);
background-size: 0.8em 0.8em;
}
.confetti2::after {
background-image:
repeating-radial-gradient(
circle at -0.9em 0.6em,
var(--trans),
var(--trans) 0.14em,
var(--ink) 0.15em,
var(--ink) 0.33em,
var(--trans) 0.34em),
repeating-radial-gradient(
circle at 0.5em 1.8em,
var(--trans),
var(--trans) 0.12em,
var(--ink) 0.13em,
var(--ink) 0.33em,
var(--trans) 0.34em);
background-size: 1em 1em;
}
.jam-sandwich {
background-color: var(--coral);
background-image:
repeating-radial-gradient(
circle at 0.5em -1.83em,
var(--trans),
var(--peach) 0.08em,
var(--mushroom) 0.09em,
var(--mushroom) 0.33em,
var(--trans) 0.34em);
background-size: 1em 1em;
}
.tennis {
background-color: var(--succulent);
background-image:
repeating-radial-gradient(
circle at -0.83em 0.5em,
var(--trans),
var(--trans) 0.28em,
var(--mushroom) 0.29em,
var(--mushroom) 0.33em,
var(--trans) 0.34em),
repeating-radial-gradient(
circle at 0.5em 1.83em,
var(--trans),
var(--trans) 0.28em,
var(--mushroom) 0.29em,
var(--mushroom) 0.33em,
var(--trans) 0.34em);
background-size: 1em 1em;
}
.cobbles {
background-color: var(--slate);
background-image:
repeating-radial-gradient(
circle at 0.5em -0.65em,
var(--trans),
var(--trans) 0.24em,
var(--clay) 0.25em,
var(--clay) 0.33em,
var(--trans) 0.34em),
repeating-radial-gradient(
circle at 0.5em 1.65em,
var(--trans),
var(--trans) 0.24em,
var(--clay) 0.25em,
var(--clay) 0.33em,
var(--trans) 0.34em);
background-size: 1em 1em;
}
.bed-springs {
background-color: var(--slate);
background-image:
repeating-radial-gradient(
circle at 0.5em -0.3em,
var(--trans),
var(--trans) 0.24em,
var(--spearmint) 0.25em,
var(--spearmint) 0.3em,
var(--trans) 0.31em),
repeating-radial-gradient(
circle at 0.5em 1.3em,
var(--trans),
var(--trans) 0.24em,
var(--spearmint) 0.25em,
var(--spearmint) 0.3em,
var(--trans) 0.31em);
background-size: 1em 1em;
}
.linked {
background-color: var(--apricot);
background-image:
repeating-radial-gradient(
circle at 0.5em 0.4em,
var(--trans),
var(--trans) 0.2em,
var(--coral) 0.21em,
var(--coral) 0.3em,
var(--trans) 0.31em),
repeating-radial-gradient(
circle at 0.5em 0.6em,
var(--trans),
var(--trans) 0.2em,
var(--coral) 0.21em,
var(--coral) 0.3em,
var(--trans) 0.31em);
background-size: 1em 1em;
}
.overlapping-shields {
background-color: var(--clay);
background-image:
repeating-radial-gradient(
circle at 0.5em -0.1em,
var(--trans),
var(--trans) 0.2em,
var(--melon) 0.21em,
var(--melon) 0.3em,
var(--trans) 0.31em),
repeating-radial-gradient(
circle at 0.5em 1.1em,
var(--trans),
var(--trans) 0.2em,
var(--melon) 0.21em,
var(--melon) 0.3em,
var(--trans) 0.31em);
background-size: 1em 1em;
}
.mystic-eye {
background-color: var(--purple-slate);
background-image:
repeating-radial-gradient(
circle at 0.5em 0.24em,
var(--trans),
var(--trans) 0.2em,
var(--purple) 0.21em,
var(--purple) 0.3em,
var(--trans) 0.31em),
repeating-radial-gradient(
circle at 0.5em 0.74em,
var(--trans),
var(--trans) 0.2em,
var(--purple) 0.21em,
var(--purple) 0.3em,
var(--trans) 0.31em),
repeating-radial-gradient(
circle at 0.5em 0.34em,
var(--trans),
var(--trans) 0.2em,
var(--midnight) 0.21em,
var(--midnight) 0.3em,
var(--trans) 0.31em),
repeating-radial-gradient(
circle at 0.5em 0.8em,
var(--trans),
var(--trans) 0.2em,
var(--midnight) 0.21em,
var(--midnight) 0.3em,
var(--trans) 0.31em);
background-size: 1em 1em;
}
.lace {
background-color: var(--white);
background-image:
repeating-radial-gradient(
circle at 0.5em 0.05em,
var(--trans),
var(--trans) 0.2em,
var(--mushroom) 0.21em,
var(--mushroom) 0.3em,
var(--trans) 0.31em),
repeating-radial-gradient(
circle at 0.5em 0.95em,
var(--trans),
var(--trans) 0.2em,
var(--mushroom) 0.21em,
var(--mushroom) 0.3em,
var(--trans) 0.31em);
background-size: 1em 1em;
}
.plant-cells {
background-color: var(--sage);
background-image:
repeating-radial-gradient(
circle at -0.12em -0.12em,
var(--trans),
var(--trans) 0.2em,
var(--grassy) 0.21em,
var(--grassy) 0.3em,
var(--trans) 0.31em),
repeating-radial-gradient(
circle at 1.12em 1.12em,
var(--trans),
var(--trans) 0.2em,
var(--grassy) 0.21em,
var(--grassy) 0.3em,
var(--trans) 0.31em);
background-size: 1em 1em;
}
.slashes {
background-color: var(--peach);
background-image:
repeating-radial-gradient(
circle at -0.35em -0.35em,
var(--trans),
var(--trans) 0.4em,
var(--powder-blue) 0.41em,
var(--powder-blue) 0.9em,
var(--trans) 0.91em),
repeating-radial-gradient(
circle at 1.35em 1.35em,
var(--trans),
var(--trans) 0.4em,
var(--powder-blue) 0.41em,
var(--powder-blue) 0.9em,
var(--trans) 0.91em);
background-size: 1em 1em;
}
.hollow-lemon {
background-color: var(--lemon);
background-image:
repeating-radial-gradient(
circle at 0.25em 0.25em,
var(--trans),
var(--trans) 0.45em,
var(--yellow) 0.46em,
var(--yellow) 0.75em,
var(--trans) 0.76em),
repeating-radial-gradient(
circle at 0.75em 0.75em,
var(--trans),
var(--trans) 0.45em,
var(--yellow) 0.46em,
var(--yellow) 0.75em,
var(--trans) 0.76em);
background-size: 1em 1em;
}
.blood-cells {
background-color: var(--midnight);
background-image:
repeating-radial-gradient(
circle at -0.55em -0.55em,
var(--trans),
var(--trans) 0.6em,
var(--beetroot) 0.61em,
var(--beetroot) 0.9em,
var(--trans) 0.91em),
repeating-radial-gradient(
circle at 1.55em 1.55em,
var(--trans),
var(--trans) 0.6em,
var(--beetroot) 0.61em,
var(--beetroot) 0.9em,
var(--trans) 0.91em);
background-size: 1em 1em;
}
.avocado {
background-color: var(--clay);
background-image:
repeating-radial-gradient(
circle at -0.15em -0.15em,
var(--trans),
var(--trans) 0.4em,
var(--grassy) 0.41em,
var(--succulent) 0.6em,
var(--trans) 0.61em),
repeating-radial-gradient(
circle at 1.15em 1.15em,
var(--trans),
var(--trans) 0.4em,
var(--grassy) 0.41em,
var(--succulent) 0.6em,
var(--trans) 0.61em);
background-size: 1em 1em;
}
.snag {
background-color: var(--sea-fog);
background-image:
repeating-radial-gradient(
circle at -0.75em -0.75em,
var(--trans),
var(--trans) 0.4em,
var(--powder-blue) 0.41em,
var(--powder-blue) 0.6em,
var(--trans) 0.61em),
repeating-radial-gradient(
circle at 1.75em 1.75em,
var(--trans),
var(--trans) 0.4em,
var(--powder-blue) 0.41em,
var(--powder-blue) 0.6em,
var(--trans) 0.61em);
background-size: 1em 1em;
}
.bling-chunk {
background-color: var(--butter);
background-image:
repeating-radial-gradient(
circle at -0.1em -0.1em,
var(--butter),
var(--lemon) 0.6em,
var(--trans) 0.61em,
var(--trans) 2em),
repeating-radial-gradient(
circle at 1.1em 1.1em,
var(--butter),
var(--lemon) 0.6em,
var(--trans) 0.61em,
var(--trans) 2em);
background-size: 1em 1em;
}
.ocean {
background-color: var(--lapis);
background-image:
repeating-radial-gradient(
circle at 0em 0em,
var(--trans),
var(--trans) 0.32em,
var(--royal) 0.33em,
var(--royal) 0.6em,
var(--trans) 0.61em,
var(--trans) 2em),
repeating-radial-gradient(
circle at 0.93em 0.93em,
var(--trans),
var(--trans) 0.32em,
var(--royal) 0.33em,
var(--royal) 0.6em,
var(--trans) 0.61em,
var(--trans) 2em);
background-size: 1em 1em;
}
.star-pips {
background-color: var(--aubergine);
background-image:
repeating-radial-gradient(
circle at 0.26em 0.26em,
var(--trans),
var(--trans) 0.4em,
var(--magenta) 0.41em,
var(--magenta) 0.52em,
var(--trans) 0.53em,
var(--trans) 1em),
repeating-radial-gradient(
circle at 0.74em 0.26em,
var(--trans),
var(--trans) 0.4em,
var(--magenta) 0.41em,
var(--magenta) 0.52em,
var(--trans) 0.53em,
var(--trans) 1em),
repeating-radial-gradient(
circle at 0.26em 0.74em,
var(--trans),
var(--trans) 0.4em,
var(--magenta) 0.41em,
var(--magenta) 0.52em,
var(--trans) 0.53em,
var(--trans) 1em),
repeating-radial-gradient(
circle at 0.74em 0.74em,
var(--trans),
var(--trans) 0.4em,
var(--magenta) 0.41em,
var(--magenta) 0.52em,
var(--trans) 0.53em,
var(--trans) 1em);
background-size: 1em 1em;
}
.star-pips::after {
background-image:
repeating-radial-gradient(
circle at 0.26em 0.26em,
var(--trans),
var(--trans) 0.4em,
var(--magenta) 0.41em,
var(--magenta) 0.52em,
var(--trans) 0.53em,
var(--trans) 1em),
repeating-radial-gradient(
circle at 0.74em 0.26em,
var(--trans),
var(--trans) 0.4em,
var(--magenta) 0.41em,
var(--magenta) 0.52em,
var(--trans) 0.53em,
var(--trans) 1em),
repeating-radial-gradient(
circle at 0.26em 0.74em,
var(--trans),
var(--trans) 0.4em,
var(--magenta) 0.41em,
var(--magenta) 0.52em,
var(--trans) 0.53em,
var(--trans) 1em),
repeating-radial-gradient(
circle at 0.74em 0.74em,
var(--trans),
var(--trans) 0.4em,
var(--magenta) 0.41em,
var(--magenta) 0.52em,
var(--trans) 0.53em,
var(--trans) 1em);
background-size: 1em 1em;
background-position: 0.5em 0.5em;
}
.bamboo {
background-color: var(--sage);
background-image:
repeating-radial-gradient(
circle at 0.16em 0.16em,
var(--trans),
var(--trans) 0.8em,
var(--forest) 0.81em,
var(--forest) 0.87em,
var(--trans) 0.88em,
var(--trans) 3em),
repeating-radial-gradient(
circle at 0.84em 0.16em,
var(--trans),
var(--trans) 0.8em,
var(--forest) 0.81em,
var(--forest) 0.87em,
var(--trans) 0.88em,
var(--trans) 3em),
repeating-radial-gradient(
circle at 0.16em 0.84em,
var(--trans),
var(--trans) 0.8em,
var(--forest) 0.81em,
var(--forest) 0.87em,
var(--trans) 0.88em,
var(--trans) 3em),
repeating-radial-gradient(
circle at 0.84em 0.84em,
var(--trans),
var(--trans) 0.8em,
var(--forest) 0.81em,
var(--forest) 0.87em,
var(--trans) 0.88em,
var(--trans) 3em);
background-size: 1em 1em;
background-position: 0em 0.12em;
}
.bamboo::after {
background-image:
repeating-radial-gradient(
circle at 0.16em 0.16em,
var(--trans),
var(--trans) 0.8em,
var(--butter) 0.81em,
var(--peach) 0.87em,
var(--trans) 0.88em,
var(--trans) 3em),
repeating-radial-gradient(
circle at 0.84em 0.16em,
var(--trans),
var(--trans) 0.8em,
var(--butter) 0.81em,
var(--peach) 0.87em,
var(--trans) 0.88em,
var(--trans) 3em),
repeating-radial-gradient(
circle at 0.16em 0.84em,
var(--trans),
var(--trans) 0.8em,
var(--butter) 0.81em,
var(--peach) 0.87em,
var(--trans) 0.88em,
var(--trans) 3em),
repeating-radial-gradient(
circle at 0.84em 0.84em,
var(--trans),
var(--trans) 0.8em,
var(--butter) 0.81em,
var(--peach) 0.87em,
var(--trans) 0.88em,
var(--trans) 3em);
background-size: 1em 1em;
}
.goldwork {
background-color: var(--lapis);
background-image:
repeating-radial-gradient(
circle at 0.06em 0.06em,
var(--trans),
var(--trans) 0.8em,
var(--primrose) 0.81em,
var(--peach) 0.87em,
var(--trans) 0.88em,
var(--trans) 3em),
repeating-radial-gradient(
circle at 0.94em 0.06em,
var(--trans),
var(--trans) 0.8em,
var(--lemon) 0.81em,
var(--peach) 0.87em,
var(--trans) 0.88em,
var(--trans) 3em),
repeating-radial-gradient(
circle at 0.06em 0.94em,
var(--trans),
var(--trans) 0.8em,
var(--lemon) 0.81em,
var(--peach) 0.87em,
var(--trans) 0.88em,
var(--trans) 3em),
repeating-radial-gradient(
circle at 0.94em 0.94em,
var(--trans),
var(--trans) 0.8em,
var(--lemon) 0.81em,
var(--peach) 0.87em,
var(--trans) 0.88em,
var(--trans) 3em);
background-size: 1em 1em;
}
.interlock {
background-color: var(--coral);
background-image:
repeating-radial-gradient(
circle at 0.06em 0.06em,
var(--trans),
var(--trans) 0.5em,
var(--peach) 0.51em,
var(--peach) 0.57em,
var(--trans) 0.58em,
var(--trans) 3em),
repeating-radial-gradient(
circle at 0.94em 0.06em,
var(--trans),
var(--trans) 0.5em,
var(--sakura) 0.51em,
var(--sakura) 0.57em,
var(--trans) 0.58em,
var(--trans) 3em),
repeating-radial-gradient(
circle at 0.06em 0.94em,
var(--trans),
var(--trans) 0.5em,
var(--sakura) 0.51em,
var(--sakura) 0.57em,
var(--trans) 0.58em,
var(--trans) 3em),
repeating-radial-gradient(
circle at 0.94em 0.94em,
var(--trans),
var(--trans) 0.5em,
var(--white) 0.51em,
var(--white) 0.57em,
var(--trans) 0.58em,
var(--trans) 3em);
background-size: 1em 1em;
}
.knot-work {
background-color: var(--hazelnut);
background-image:
repeating-radial-gradient(
circle at 0.25em 0.25em,
var(--trans),
var(--trans) 0.5em,
var(--spearmint) 0.5em,
var(--spearmint) 0.55em,
var(--trans) 0.56em,
var(--trans) 3em),
repeating-radial-gradient(
circle at 0.75em 0.25em,
var(--trans),
var(--trans) 0.5em,
var(--spearmint) 0.5em,
var(--spearmint) 0.55em,
var(--trans) 0.56em,
var(--trans) 3em),
repeating-radial-gradient(
circle at 0.25em 0.75em,
var(--trans),
var(--trans) 0.5em,
var(--spearmint) 0.5em,
var(--spearmint) 0.55em,
var(--trans) 0.56em,
var(--trans) 3em),
repeating-radial-gradient(
circle at 0.75em 0.75em,
var(--trans),
var(--trans) 0.5em,
var(--spearmint) 0.5em,
var(--spearmint) 0.55em,
var(--trans) 0.56em,
var(--trans) 3em);
background-size: 1em 1em;
}
.port-hole {
background-color: var(--sea-foam);
background-image:
repeating-radial-gradient(
circle at 0.45em 0.45em,
var(--trans),
var(--trans) 0.46em,
var(--white) 0.47em,
var(--white) 0.5em,
var(--trans) 0.51em,
var(--trans) 3em),
repeating-radial-gradient(
circle at 0.55em 0.45em,
var(--trans),
var(--trans) 0.46em,
var(--white) 0.47em,
var(--white) 0.5em,
var(--trans) 0.51em,
var(--trans) 3em),
repeating-radial-gradient(
circle at 0.45em 0.55em,
var(--trans),
var(--trans) 0.46em,
var(--white) 0.47em,
var(--white) 0.5em,
var(--trans) 0.51em,
var(--trans) 3em),
repeating-radial-gradient(
circle at 0.55em 0.55em,
var(--trans),
var(--trans) 0.46em,
var(--white) 0.47em,
var(--white) 0.5em,
var(--trans) 0.51em,
var(--trans) 3em);
background-size: 1em 1em;
}
.terracotta-trace {
background-color: var(--sakura);
background-image:
repeating-radial-gradient(
circle at 0.35em 0.35em,
var(--trans),
var(--trans) 0.46em,
var(--melon) 0.47em,
var(--melon) 0.5em,
var(--trans) 0.51em,
var(--trans) 3em),
repeating-radial-gradient(
circle at 0.65em 0.35em,
var(--trans),
var(--trans) 0.46em,
var(--melon) 0.47em,
var(--melon) 0.5em,
var(--trans) 0.51em,
var(--trans) 3em),
repeating-radial-gradient(
circle at 0.35em 0.65em,
var(--trans),
var(--trans) 0.46em,
var(--melon) 0.47em,
var(--melon) 0.5em,
var(--trans) 0.51em,
var(--trans) 3em),
repeating-radial-gradient(
circle at 0.65em 0.65em,
var(--trans),
var(--trans) 0.46em,
var(--melon) 0.47em,
var(--melon) 0.5em,
var(--trans) 0.51em,
var(--trans) 3em),
repeating-radial-gradient(
circle at 0.35em 0.35em,
var(--trans),
var(--trans) 0.42em,
var(--peach) 0.43em,
var(--peach) 0.5em,
var(--trans) 0.51em,
var(--trans) 3em),
repeating-radial-gradient(
circle at 0.65em 0.35em,
var(--trans),
var(--trans) 0.42em,
var(--peach) 0.43em,
var(--peach) 0.5em,
var(--trans) 0.51em,
var(--trans) 3em),
repeating-radial-gradient(
circle at 0.35em 0.65em,
var(--trans),
var(--trans) 0.42em,
var(--peach) 0.43em,
var(--peach) 0.5em,
var(--trans) 0.51em,
var(--trans) 3em),
repeating-radial-gradient(
circle at 0.65em 0.65em,
var(--trans),
var(--trans) 0.42em,
var(--peach) 0.43em,
var(--peach) 0.5em,
var(--trans) 0.51em,
var(--trans) 3em);
background-size: 1em 1em;
}
.purple-quartz {
background-color: var(--bloom);
background-image:
repeating-linear-gradient(
-45deg,
var(--trans) 0%,
var(--trans) 35%,
var(--dusty-purple) 35%,
var(--dusty-purple) 48%,
var(--purple) 48%,
var(--purple) 55%,
var(--sakura) 55%,
var(--sakura) 65%,
var(--trans) 65%,
var(--trans) 100%);
background-size: 1em 1em;
}
.sort {
background-color: var(--melon);
background-image:
repeating-linear-gradient(
-45deg,
var(--butter),
var(--butter) 0.45em,
var(--trans) 0.45em,
var(--trans) 0.95em,
var(--butter) 0.95em,
var(--butter) 1em),
repeating-linear-gradient(
45deg,
var(--butter),
var(--butter) 0.45em,
var(--trans) 0.45em,
var(--trans) 0.95em,
var(--butter) 0.95em,
var(--butter) 1em),
repeating-linear-gradient(
0deg,
var(--trans),
var(--trans) 0.4em,
var(--butter) 0.4em,
var(--butter) 0.6em,
var(--trans) 0.6em,
var(--trans) 2em);
background-size: 1em 1em;
}
.nope {
background-color: var(--rouge);
background-image:
repeating-linear-gradient(
-45deg,
var(--rouge),
var(--rouge) 0.42em,
var(--trans) 0.42em,
var(--trans) 0.98em,
var(--rouge) 0.98em,
var(--rouge) 1em),
repeating-linear-gradient(
45deg,
var(--rouge),
var(--rouge) 0.42em,
var(--trans) 0.42em,
var(--trans) 0.98em,
var(--rouge) 0.98em,
var(--rouge) 1em),
repeating-linear-gradient(
45deg,
var(--trans),
var(--trans) 0.62em,
var(--white) 0.62em,
var(--white) 0.78em,
var(--trans) 0.78em,
var(--trans) 1em),
repeating-linear-gradient(
-45deg,
var(--trans),
var(--trans) 0.62em,
var(--white) 0.62em,
var(--white) 0.78em,
var(--trans) 0.78em,
var(--trans) 1em);
background-size: 1em 1em;
}
.mermaid {
background-color: var(--spearmint);
background-image:
repeating-radial-gradient(
circle at 0.5em 0,
var(--robins-egg),
var(--spearmint) 0.4em,
var(--sea-foam) 0.45em,
var(--sea-glass) 0.5em,
var(--trans) 0.51em,
var(--trans) 3em);
background-size: 1em 0.5em;
}
.mermaid::before {
background-image:
repeating-radial-gradient(
circle at 0.5em 0,
var(--robins-egg),
var(--spearmint) 0.4em,
var(--sea-foam) 0.45em,
var(--sea-foam) 0.5em,
var(--trans) 0.51em,
var(--trans) 3em);
background-size: 1em 0.5em;
background-position: 0.5em 0.75em;
}
.mermaid::after {
background-image:
repeating-radial-gradient(
circle at 0.5em -0.25em,
var(--robins-egg),
var(--spearmint) 0.4em,
var(--sea-foam) 0.45em,
var(--sea-foam) 0.5em,
var(--trans) 0.51em,
var(--trans) 3em);
background-size: 1em 0.5em;
background-position: 0.0em 0.25em;
}
.rainbows {
background-color: var(--spearmint);
background-image:
repeating-radial-gradient(
circle at 0.5em 0.5em,
var(--trans),
var(--trans) 0.2em,
var(--purple) 0.21em,
var(--purple) 0.24em,
var(--royal) 0.25em,
var(--royal) 0.3em,
var(--emerald) 0.31em,
var(--emerald) 0.35em,
var(--butter) 0.36em,
var(--butter) 0.4em,
var(--orange) 0.41em,
var(--orange) 0.45em,
var(--rouge) 0.46em,
var(--rouge) 0.5em,
var(--trans) 0.51em,
var(--trans) 2em);
background-size: 1em 0.5em;
}
.rainbows::before {
background-image:
repeating-radial-gradient(
circle at 0.5em 0.5em,
var(--trans),
var(--trans) 0.2em,
var(--purple) 0.21em,
var(--purple) 0.24em,
var(--royal) 0.25em,
var(--royal) 0.3em,
var(--emerald) 0.31em,
var(--emerald) 0.35em,
var(--butter) 0.36em,
var(--butter) 0.4em,
var(--orange) 0.41em,
var(--orange) 0.45em,
var(--rouge) 0.46em,
var(--rouge) 0.5em,
var(--trans) 0.51em,
var(--trans) 2em);
background-size: 1em 0.5em;
background-position: 0.5em 0.75em;
}
.rainbows::after {
background-image:
repeating-radial-gradient(
circle at 0.5em 0.75em,
var(--trans),
var(--trans) 0.2em,
var(--purple) 0.21em,
var(--purple) 0.24em,
var(--royal) 0.25em,
var(--royal) 0.3em,
var(--emerald) 0.31em,
var(--emerald) 0.35em,
var(--butter) 0.36em,
var(--butter) 0.4em,
var(--orange) 0.41em,
var(--orange) 0.45em,
var(--rouge) 0.46em,
var(--rouge) 0.5em,
var(--trans) 0.51em,
var(--trans) 2em);
background-size: 1em 0.5em;
background-position: 0.0em 0.25em;
}
.bones {
background-color: var(--aubergine);
background-image:
repeating-radial-gradient(
circle at 0.2em 0.3em,
var(--trans),
var(--trans) 0.49em,
var(--aubergine) 0.5em,
var(--aubergine) 3em),
repeating-radial-gradient(
circle at 1.1em -1.4em,
var(--trans),
var(--trans) 1.99em,
var(--mushroom) 2em,
var(--mushroom) 2.15em,
var(--trans) 2.16em,
var(--trans) 3em);
background-size: 1em 1em;
}
.bones::before{
background-size: 1em 1em;
background-position: 0em 0.1em;
background-image:
repeating-radial-gradient(
circle at -0.7em -0.5em,
var(--trans),
var(--trans) 1.99em,
var(--mushroom) 2em,
var(--mushroom) 2.15em,
var(--trans) 2.16em,
var(--trans) 3em);
}
.bones::after {
background-size: 1em 1em;
background-position: 0.2em 0.2em;
background-image:
repeating-radial-gradient(
circle at 0.44em 0.35em,
var(--mushroom),
var(--mushroom) 0.1em,
var(--trans) 0.11em,
var(--trans) 3em),
repeating-radial-gradient(
circle at 0.4em 0.44em,
var(--mushroom),
var(--mushroom) 0.1em,
var(--trans) 0.11em,
var(--trans) 3em),
repeating-radial-gradient(
circle at 0.89em 0.13em,
var(--mushroom),
var(--mushroom) 0.1em,
var(--trans) 0.11em,
var(--trans) 3em),
repeating-radial-gradient(
circle at 0.84em 0.23em,
var(--mushroom),
var(--mushroom) 0.1em,
var(--trans) 0.11em,
var(--trans) 3em),
repeating-radial-gradient(
circle at 0.78em 0.54em,
var(--mushroom),
var(--mushroom) 0.1em,
var(--trans) 0.11em,
var(--trans) 3em),
repeating-radial-gradient(
circle at 0.86em 0.62em,
var(--mushroom),
var(--mushroom) 0.1em,
var(--trans) 0.11em,
var(--trans) 3em),
repeating-radial-gradient(
circle at 0.47em 0.88em,
var(--mushroom),
var(--mushroom) 0.1em,
var(--trans) 0.11em,
var(--trans) 3em),
repeating-radial-gradient(
circle at 0.56em 0.95em,
var(--mushroom),
var(--mushroom) 0.1em,
var(--trans) 0.11em,
var(--trans) 3em),
repeating-radial-gradient(
circle at 0.56em -0.05em,
var(--mushroom),
var(--mushroom) 0.1em,
var(--trans) 0.11em,
var(--trans) 3em);
}
.villain-underpants {
background-color: var(--carmine);
background-image:
repeating-radial-gradient(
circle at 1.2em -0.2em,
var(--ruby),
var(--ruby) 0.5em,
var(--trans) 0.51em,
var(--trans) 3em),
repeating-radial-gradient(
circle at -0.2em -0.2em,
var(--ruby),
var(--ruby) 0.5em,
var(--trans) 0.51em,
var(--trans) 3em);
background-size: 1em 1em;
background-position: 0 0;
}
.villain-underpants::before {
background-image:
repeating-radial-gradient(
circle at 1.2em -0.2em,
var(--ruby),
var(--ruby) 0.5em,
var(--trans) 0.51em,
var(--trans) 3em),
repeating-radial-gradient(
circle at -0.2em -0.2em,
var(--ruby),
var(--ruby) 0.5em,
var(--trans) 0.51em,
var(--trans) 3em);
background-size: 1em 1em;
background-position: 0.5em 0.5em;
}
.villain-underpants::after {
background-image:
repeating-radial-gradient(
circle at 0.385em 0.64em,
var(--ruby),
var(--ruby) 0.14em,
var(--trans) 0.15em,
var(--trans) 2em),
repeating-radial-gradient(
circle at 0.615em 0.64em,
var(--ruby),
var(--ruby) 0.14em,
var(--trans) 0.15em,
var(--trans) 2em),
repeating-radial-gradient(
circle at 0.885em 0.14em,
var(--ruby),
var(--ruby) 0.14em,
var(--trans) 0.15em,
var(--trans) 2em),
repeating-radial-gradient(
circle at 0.115em 0.14em,
var(--ruby),
var(--ruby) 0.14em,
var(--trans) 0.15em,
var(--trans) 2em);
background-size: 1em 1em;
background-position: 0.5em 0.32em;
}
.cumulus {
background-color: var(--blue-tack);
background-image:
repeating-radial-gradient(
circle at 0.77em 0.87em,
var(--white),
var(--white) 0.12em,
var(--trans) 0.121em,
var(--trans) 3em),
repeating-radial-gradient(
circle at 0.94em 1.05em,
var(--white),
var(--white) 0.16em,
var(--trans) 0.161em,
var(--trans) 3em),
repeating-radial-gradient(
circle at 0.24em 1.05em,
var(--white),
var(--white) 0.16em,
var(--trans) 0.161em,
var(--trans) 3em),
repeating-radial-gradient(
circle at 0.5em 0.92em,
var(--white),
var(--white) 0.26em,
var(--trans) 0.261em,
var(--trans) 3em),
repeating-radial-gradient(
circle at 0.58em 1.1em,
var(--white),
var(--white) 0.35em,
var(--trans) 0.351em,
var(--trans) 3em);
background-size: 2em 1.21em;
background-position: -0.3em -0.2em;
}
.cumulus::after {
background-image:
repeating-radial-gradient(
circle at 0.74em 1.08em,
var(--white),
var(--white) 0.13em,
var(--trans) 0.131em,
var(--trans) 3em),
repeating-radial-gradient(
circle at 0.22em 1.05em,
var(--white),
var(--white) 0.16em,
var(--trans) 0.161em,
var(--trans) 3em),
repeating-radial-gradient(
circle at 0.45em 1.02em,
var(--white),
var(--white) 0.28em,
var(--trans) 0.281em,
var(--trans) 3em),
repeating-radial-gradient(
circle at 0.45em 1.2em,
var(--white),
var(--white) 0.28em,
var(--trans) 0.281em,
var(--trans) 3em);
background-size: 2em 1.21em;
background-position: -1.2em 0.4em;
}
.quatrefoil {
background-color: var(--mushroom);
background-image:
repeating-radial-gradient(
circle at 0.5em 0.5em,
var(--mushroom),
var(--mushroom) 0.26em,
var(--trans) 0.275em,
var(--trans) 2em),
repeating-radial-gradient(
circle at 0.59em 0.31em,
var(--mushroom),
var(--mushroom) 0.26em,
var(--trans) 0.275em,
var(--trans) 2em),
repeating-radial-gradient(
circle at 0.59em 0.87em,
var(--mushroom),
var(--mushroom) 0.26em,
var(--trans) 0.275em,
var(--trans) 2em),
repeating-radial-gradient(
circle at 0.31em 0.59em,
var(--mushroom),
var(--mushroom) 0.26em,
var(--trans) 0.275em,
var(--trans) 2em),
repeating-radial-gradient(
circle at 0.87em 0.59em,
var(--mushroom),
var(--mushroom) 0.26em,
var(--trans) 0.275em,
var(--trans) 2em),
repeating-radial-gradient(
circle at 0.59em 0.31em,
var(--slate),
var(--slate) 0.35em,
var(--trans) 0.351em,
var(--trans) 2em),
repeating-radial-gradient(
circle at 0.59em 0.87em,
var(--slate),
var(--slate) 0.35em,
var(--trans) 0.351em,
var(--trans) 2em),
repeating-radial-gradient(
circle at 0.31em 0.59em,
var(--slate),
var(--slate) 0.35em,
var(--trans) 0.351em,
var(--trans) 2em),
repeating-radial-gradient(
circle at 0.87em 0.59em,
var(--slate),
var(--slate) 0.35em,
var(--trans) 0.351em,
var(--trans) 2em);
background-size: 1.2em 1.2em;
background-position: 0.42em 0.42em;
}
.leaf {
background-color: var(--forest);
background-image:
repeating-radial-gradient(
circle at 1.4em 0.49em,
var(--spring),
var(--spring) 0.54em,
var(--trans) 0.555em,
var(--trans) 2em),
repeating-radial-gradient(
circle at -0.4em 0.49em,
var(--lime),
var(--lime) 0.54em,
var(--trans) 0.555em,
var(--trans) 2em);
background-size: 1em 1.25em;
background-position: 0.5em 0.15em;
}
.leaf::after {
background-image:
repeating-radial-gradient(
circle at 1.4em 0.49em,
var(--spring),
var(--spring) 0.54em,
var(--trans) 0.555em,
var(--trans) 2em),
repeating-radial-gradient(
circle at -0.4em 0.49em,
var(--lime),
var(--lime) 0.54em,
var(--trans) 0.555em,
var(--trans) 2em);
background-size: 1em 1.25em;
background-position: 0 0.75em;
}
.kitchen-tiles {
background-color: var(--mushroom);
background-image:
repeating-radial-gradient(
circle at 0.5em 0.5em,
var(--butter),
var(--melon) 0.5em,
var(--trans) 0.22em,
var(--trans) 2em),
repeating-radial-gradient(
circle at 0.26em 0.26em,
var(--melon),
var(--melon) 0.2em,
var(--trans) 0.22em,
var(--trans) 2em),
repeating-radial-gradient(
circle at 0.74em 0.26em,
var(--melon),
var(--melon) 0.2em,
var(--trans) 0.22em,
var(--trans) 2em),
repeating-radial-gradient(
circle at 0.26em 0.74em,
var(--melon),
var(--melon) 0.2em,
var(--trans) 0.21em,
var(--trans) 2em),
repeating-radial-gradient(
circle at 0.74em 0.74em,
var(--melon),
var(--melon) 0.2em,
var(--trans) 0.21em,
var(--trans) 2em);
background-size: 1em 1em;
}
.kitchen-tiles::before {
background-image:
repeating-linear-gradient(
90deg,
var(--trans),
var(--trans) 0.44em,
var(--mushroom) 0.44em,
var(--mushroom) 0.56em,
var(--trans) 0.56em,
var(--trans) 1em),
repeating-linear-gradient(
0deg,
var(--trans),
var(--trans) 0.44em,
var(--mushroom) 0.44em,
var(--mushroom) 0.56em,
var(--trans) 0.56em,
var(--trans) 1em);
background-size: 1em 1em;
background-position: 0.5em 0.5em;
}
.medpack {
background-color: var(--emerald);
background-image:
repeating-linear-gradient(
90deg,
var(--emerald),
var(--emerald) 0.22em,
var(--trans) 0.22em,
var(--trans) 0.78em,
var(--emerald) 0.78em,
var(--emerald) 1em),
repeating-linear-gradient(
0deg,
var(--emerald),
var(--emerald) 0.22em,
var(--trans) 0.22em,
var(--trans) 0.78em,
var(--emerald) 0.78em,
var(--emerald) 1em),
repeating-linear-gradient(
90deg,
var(--trans),
var(--trans) 0.42em,
var(--white) 0.42em,
var(--white) 0.58em,
var(--trans) 0.58em,
var(--trans) 1em),
repeating-linear-gradient(
0deg,
var(--trans),
var(--trans) 0.42em,
var(--white) 0.42em,
var(--white) 0.58em,
var(--trans) 0.58em,
var(--trans) 1em);
background-size: 1em 1em;
}
.lazy-triangle {
background-color: var(--hazelnut);
background-image:
repeating-linear-gradient(
45deg,
var(--trans),
var(--trans) 0.36em,
var(--orange) 0.37em,
var(--orange) 1em);
background-size: 0.5em 0.5em;
}
.isometric {
background-color: var(--blue-tack);
background-image:
repeating-linear-gradient(
30deg,
var(--trans),
var(--trans) 0.32em,
var(--robins-egg) 0.33em,
var(--robins-egg) 0.6em,
var(--trans) 0.61em,
var(--trans) 1em),
repeating-linear-gradient(
-30deg,
var(--trans),
var(--trans) 0.32em,
var(--robins-egg) 0.33em,
var(--robins-egg) 0.6em,
var(--trans) 0.61em,
var(--trans) 1em);
background-size: 1em 0.5em;
}
.googly-eyes {
background-color: var(--bud);
background-image:
repeating-radial-gradient(
circle at 0.5em 0.5em,
var(--white),
var(--white) 0.42em,
var(--trans) 0.43em,
var(--trans) 2em),
repeating-radial-gradient(
circle at 0.5em 0.57em,
var(--sage),
var(--sage) 0.42em,
var(--trans) 0.43em,
var(--trans) 2em);
background-size: 1em 1em;
background-position: 0.5em 0.5em;
}
.googly-eyes::before {
background-image:
repeating-radial-gradient(
circle at 0.56em 0.64em,
var(--ink),
var(--ink) 0.2em,
var(--trans) 0.22em,
var(--trans) 4em,
var(--ink) 5em),
repeating-radial-gradient(
circle at 1.4em 0.4em,
var(--ink),
var(--ink) 0.2em,
var(--trans) 0.22em,
var(--trans) 4em,
var(--ink) 5em),
repeating-radial-gradient(
circle at 2.6em 0.45em,
var(--ink),
var(--ink) 0.2em,
var(--trans) 0.22em,
var(--trans) 4em,
var(--ink) 5em),
repeating-radial-gradient(
circle at 0.42em 1.45em,
var(--ink),
var(--ink) 0.2em,
var(--trans) 0.22em,
var(--trans) 4em,
var(--ink) 5em),
repeating-radial-gradient(
circle at 1.4em 1.55em,
var(--ink),
var(--ink) 0.2em,
var(--trans) 0.22em,
var(--trans) 4em,
var(--ink) 5em),
repeating-radial-gradient(
circle at 2.4em 1.4em,
var(--ink),
var(--ink) 0.2em,
var(--trans) 0.22em,
var(--trans) 4em,
var(--ink) 5em),
repeating-radial-gradient(
circle at 0.6em 2.55em,
var(--ink),
var(--ink) 0.2em,
var(--trans) 0.22em,
var(--trans) 4em,
var(--ink) 5em),
repeating-radial-gradient(
circle at 1.55em 2.4em,
var(--ink),
var(--ink) 0.2em,
var(--trans) 0.22em,
var(--trans) 4em,
var(--ink) 5em),
repeating-radial-gradient(
circle at 2.5em 2.6em,
var(--ink),
var(--ink) 0.2em,
var(--trans) 0.22em,
var(--trans) 4em,
var(--ink) 5em);
background-size: 3em 3em;
background-position: 0.5em 0.5em;
}
.googly-eyes::after {
background-image:
repeating-radial-gradient(
circle at 0.5em 0.5em,
var(--white),
var(--trans) 0.22em,
var(--trans) 3em);
background-size: 1em 1em;
background-position: 0.65em 0.35em;
opacity: 0.5;
}
.circles {
background-color: var(--peach);
background-image:
repeating-radial-gradient(
circle at 0.5em 0.5em,
var(--trans),
var(--trans) 0.46em,
var(--robins-egg) 0.47em,
var(--robins-egg) 0.54em,
var(--trans) 0.55em);
background-size: 1em 1em;
background-position: 0.5em 0.5em;
}
.circles::before {
background-image:
repeating-radial-gradient(
circle at 0.5em 0.5em,
var(--trans),
var(--trans) 0.46em,
var(--robins-egg) 0.47em,
var(--robins-egg) 0.54em,
var(--trans) 0.55em);
background-size: 1em 1em;
background-position: 0em 0em;
}
.fake-luggage {
background-color: var(--hazelnut);
background-image:
repeating-radial-gradient(
circle at 0.4em 0.4em,
var(--trans),
var(--trans) 0.03em,
var(--butter) 0.03em,
var(--butter) 0.08em,
var(--trans) 0.09em,
var(--trans) 0.45em,
var(--butter) 0.46em,
var(--butter) 0.6em);
background-size: 0.8em 0.8em;
background-position: 0.6em 0.6em;
}
.circle-grid {
background-color: var(--forest);
background-image:
repeating-radial-gradient(
circle at 0.5em 0.5em,
var(--sage),
var(--sage) 0.1em,
var(--trans) 0.11em,
var(--trans) 0.45em,
var(--sage) 0.46em);
background-size: 1em 1em;
background-position: 0.5em 0.5em;
}
.squares {
background-color: var(--vavavoom);
background-image:
repeating-linear-gradient(
-90deg,
var(--coral),
var(--coral) 0.4em,
var(--trans) 0.4em,
var(--trans) 0.8em),
repeating-linear-gradient(
0deg,
var(--coral),
var(--coral) 0.4em,
var(--trans) 0.4em,
var(--trans) 0.8em);
}
.blood-moon {
background: var(--bloom);
background-image:
repeating-radial-gradient(
circle at 0.35em 0.15em,
var(--bloom),
var(--bloom) 0.2em,
var(--trans) 0.21em,
var(--trans) 3em),
repeating-radial-gradient(
circle at 0.25em 0.25em,
var(--rouge),
var(--rouge) 0.2em,
var(--trans) 0.21em,
var(--trans) 3em),
repeating-radial-gradient(
circle at 0.22em 0.28em,
var(--ink),
var(--ink) 0.2em,
var(--trans) 0.21em,
var(--trans) 3em),
repeating-radial-gradient(
circle at 1.15em 0.95em,
var(--bloom),
var(--bloom) 0.2em,
var(--trans) 0.21em,
var(--trans) 3em),
repeating-radial-gradient(
circle at 1.05em 1.05em,
var(--rouge),
var(--rouge) 0.2em,
var(--trans) 0.21em,
var(--trans) 3em),
repeating-radial-gradient(
circle at 1.02em 1.08em,
var(--ink),
var(--ink) 0.2em,
var(--trans) 0.21em,
var(--trans) 3em);
background-size: 1.6em 1.6em;
background-position: 1.17em 1.12em;
}
.pyramids {
background: var(--mink);
background-image:
repeating-linear-gradient(
-65deg,
var(--trans),
var(--trans) 0.5em,
var(--mink) 0.5em,
var(--mink) 0.74em,
var(--trans) 0.74em,
var(--trans) 3em),
repeating-linear-gradient(
-55deg,
var(--fudge),
var(--fudge) 0.3em,
var(--trans) 0.31em,
var(--trans) 3em),
repeating-linear-gradient(
55deg,
var(--fudge),
var(--fudge) 0.3em,
var(--trans) 0.31em,
var(--trans) 3em),
repeating-linear-gradient(
45deg,
var(--chocolate),
var(--chocolate) 0.38em,
var(--trans) 0.37em,
var(--trans) 3em);
background-size: 1.2em 1em;
background-position: 0.35em 0.8em;
}
.sharp-stars {
background: var(--yellow);
background-image:
repeating-radial-gradient(
circle at 0.4em 0.4em,
var(--slate),
var(--slate) 0.4em,
var(--purple-slate) 0.41em,
var(--purple-slate) 0.46em,
var(--trans) 0.47em,
var(--trans) 3em);
background-size: 0.8em 0.8em;
background-position: 1em 1em;
}
.stars {
background: var(--mushroom);
background-image:
repeating-radial-gradient(
circle at 0.8em 0.8em,
var(--twilight),
var(--twilight) 0.85em,
var(--trans) 0.86em,
var(--trans) 3em);
background-size: 1.6em 1.6em;
background-position: 1em 1em;
}
.confetti {
background: var(--peach);
background-image:
repeating-radial-gradient(
circle at 0.2em 0.2em,
var(--lemon),
var(--lemon) 0.16em,
var(--trans) 0.161em,
var(--trans) 3em),
repeating-radial-gradient(
circle at 0.7em 0.7em,
var(--yellow),
var(--yellow) 0.16em,
var(--trans) 0.161em,
var(--trans) 3em);
background-size: 1em 1em;
background-position: 0.05em 0.05em;
}
.dots {
background: var(--clay);
background-image:
repeating-radial-gradient(
circle at 0.2em 0.2em,
var(--succulent),
var(--succulent) 0.08em,
var(--trans) 0.081em,
var(--trans) 3em),
repeating-radial-gradient(
circle at 0.6em 0.6em,
var(--sage),
var(--sage) 0.08em,
var(--trans) 0.081em,
var(--trans) 3em);
background-size: 0.8em 0.8em;
}
.cat-toes {
background: var(--powder-pink);
background-image:
repeating-radial-gradient(
circle at 0.5em 0.55em,
var(--dusty-pink),
var(--dusty-pink) 0.24em,
var(--trans) 0.241em,
var(--trans) 4em),
repeating-radial-gradient(
circle at 0.25em 0.24em,
var(--dusty-pink),
var(--dusty-pink) 0.1em,
var(--trans) 0.11em,
var(--trans) 4em),
repeating-radial-gradient(
circle at 0.5em 0.15em,
var(--dusty-pink),
var(--dusty-pink) 0.1em,
var(--trans) 0.11em,
var(--trans) 4em),
repeating-radial-gradient(
circle at 0.75em 0.24em,
var(--dusty-pink),
var(--dusty-pink) 0.1em,
var(--trans) 0.11em,
var(--trans) 4em);
background-position: 0.2em 0.3em;
background-size: 1.2em 1.2em;
}
.diamonds {
background: var(--sakura);
background-image:
repeating-linear-gradient(
60deg,
var(--slate),
var(--slate) 0.6em,
var(--trans) 0.61em,
var(--trans) 0.9em,
var(--slate) 0.91em),
repeating-linear-gradient(
-60deg,
var(--slate),
var(--slate) 0.6em,
var(--trans) 0.61em,
var(--trans) 0.9em,
var(--slate) 0.91em),
repeating-linear-gradient(
90deg,
var(--white),
var(--white) 0.3em,
var(--trans) 0.31em,
var(--trans) 0.52em,
var(--white) 0.525em);
background-position: 0.48em 0;
background-size: 21em;
}
.trellis {
background: var(--purple-slate);
background-image:
repeating-linear-gradient(
-60deg,
var(--dusty-pink),
var(--dusty-pink) 0.1em,
var(--trans) 0.11em,
var(--trans) 0.4em,
var(--dusty-pink) 0.41em),
repeating-linear-gradient(
60deg,
var(--hazelnut),
var(--hazelnut) 0.1em,
var(--trans) 0.11em,
var(--trans) 0.4em,
var(--hazelnut) 0.41em);
background-size: 10em;
}
.orange-buzz {
background: var(--orange);
background-image:
repeating-linear-gradient(
45deg,
var(--peach),
var(--peach) 0.2em,
var(--trans) 0.2em,
var(--trans) 0.4em);
background-size: 0.2em 20em;
}
.lemon-lime-gingham {
background: var(--pale-lemon);
}
.lemon-lime-gingham::before {
background-image:
repeating-linear-gradient(
0deg,
var(--yellow),
var(--yellow) 0.2em,
var(--trans) 0.2em,
var(--trans) 0.4em,
var(--emerald) 0.4em,
var(--emerald) 0.6em,
var(--trans) 0.6em,
var(--trans) 0.8em);
opacity: 0.4;
}
.lemon-lime-gingham::after {
background-image:
repeating-linear-gradient(
90deg,
var(--yellow),
var(--yellow) 0.2em,
var(--trans) 0.2em,
var(--trans) 0.4em,
var(--emerald) 0.4em,
var(--emerald) 0.6em,
var(--trans) 0.6em,
var(--trans) 0.8em);
opacity: 0.4;
}
.lavender-lumberjack {
background-image:
repeating-linear-gradient(
0deg,
var(--trans2),
var(--trans2) 0.4em,
var(--trans) 0.4em,
var(--trans) 0.8em),
repeating-linear-gradient(
-90deg,
var(--dusty-purple),
var(--dusty-purple) 0.4em,
var(--aubergine) 0.4em,
var(--aubergine) 0.8em);
}
.vertical-stripes {
background-image:
repeating-linear-gradient(
-90deg,
var(--powder-blue),
var(--powder-blue) 0.56em,
var(--blue-tack) 0.56em,
var(--blue-tack) 0.64em);
}
.diagonal-stripes {
background-image:
repeating-linear-gradient(
-45deg,
var(--sea-foam),
var(--sea-foam) 0.3em,
var(--spearmint) 0.3em,
var(--spearmint) 0.4em);
}
.stripes {
background-image:
repeating-linear-gradient(
var(--strawberry-yogurt),
var(--strawberry-yogurt) 0.2em,
var(--sakura) 0.2em,
var(--sakura) 0.4em);
}
This Pen doesn't use any external CSS resources.
This Pen doesn't use any external JavaScript resources.