:is(.mmd-fx-pattern-polka, .mmd-fx-pattern-dots, .mmd-fx-pattern-plus, .mmd-fx-pattern-rings,
    .mmd-fx-pattern-paper, .mmd-fx-pattern-graph, .mmd-fx-pattern-dashed, .mmd-fx-pattern-dotted,
    .mmd-fx-pattern-cross, .mmd-fx-pattern-circuit,
    .mmd-fx-pattern-checker, .mmd-fx-pattern-diamond, .mmd-fx-pattern-zigzag,
    .mmd-fx-pattern-iso, .mmd-fx-pattern-triangle, .mmd-fx-pattern-tartan,
    .mmd-fx-pattern-stripes, .mmd-fx-pattern-pinstripe, .mmd-fx-pattern-candy, .mmd-fx-pattern-notebook,
    .mmd-fx-pattern-scanlines,
    .mmd-fx-pattern-circles, .mmd-fx-pattern-waves, .mmd-fx-pattern-scallop,
    .mmd-fx-pattern-doodle, .mmd-fx-pattern-topo,
    .mmd-fx-pattern-terrazzo, .mmd-fx-pattern-memphis, .mmd-fx-pattern-confetti,
    .mmd-fx-pattern-zen, .mmd-fx-pattern-wood, .mmd-fx-pattern-ridges, .mmd-fx-pattern-cells, .mmd-fx-pattern-swirl) {
    position: relative;
    isolation: isolate;
}
:is(.mmd-fx-pattern-polka, .mmd-fx-pattern-dots, .mmd-fx-pattern-plus, .mmd-fx-pattern-rings,
    .mmd-fx-pattern-paper, .mmd-fx-pattern-graph, .mmd-fx-pattern-dashed, .mmd-fx-pattern-dotted,
    .mmd-fx-pattern-cross, .mmd-fx-pattern-circuit,
    .mmd-fx-pattern-checker, .mmd-fx-pattern-diamond, .mmd-fx-pattern-zigzag,
    .mmd-fx-pattern-iso, .mmd-fx-pattern-triangle, .mmd-fx-pattern-tartan,
    .mmd-fx-pattern-stripes, .mmd-fx-pattern-pinstripe, .mmd-fx-pattern-candy, .mmd-fx-pattern-notebook,
    .mmd-fx-pattern-scanlines,
    .mmd-fx-pattern-circles, .mmd-fx-pattern-waves, .mmd-fx-pattern-scallop,
    .mmd-fx-pattern-doodle, .mmd-fx-pattern-topo,
    .mmd-fx-pattern-terrazzo, .mmd-fx-pattern-memphis, .mmd-fx-pattern-confetti,
    .mmd-fx-pattern-zen, .mmd-fx-pattern-wood, .mmd-fx-pattern-ridges, .mmd-fx-pattern-cells, .mmd-fx-pattern-swirl)::after {
    --mmd-fx-pattern-c: var(--mmd-fx-pattern-color, color-mix(in srgb, var(--mmd-fx-pattern-ink, currentColor) var(--mmd-fx-pattern-mix, 16%), transparent));
    --mmd-fx-pattern-k: var(--mmd-fx-pattern-scale, 1);
    --mmd-fx-pattern-l: var(--mmd-fx-pattern-line, 1px);
    --mmd-fx-pattern-d2: var(--mmd-fx-pattern-color-2, color-mix(in srgb, var(--mmd-fx-pattern-ink-2, color-mix(in srgb, var(--mmd-fx-pattern-ink, currentColor) 50%, #fff)) var(--mmd-fx-pattern-mix, 16%), transparent));
    --mmd-fx-pattern-d3: var(--mmd-fx-pattern-color-3, color-mix(in srgb, var(--mmd-fx-pattern-ink-3, color-mix(in srgb, var(--mmd-fx-pattern-ink, currentColor) 55%, #000)) var(--mmd-fx-pattern-mix, 16%), transparent));
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: -1;
    pointer-events: none;
    border-radius: inherit;
    -webkit-mask-image: var(--mmd-fx-pattern-fade, none);
    mask-image: var(--mmd-fx-pattern-fade, none);
}
.mmd-fx-pattern-polka::after {
    --mmd-fx-pattern-s: calc(24px * var(--mmd-fx-pattern-k));
    background-image:
        radial-gradient(circle, var(--mmd-fx-pattern-c) calc(var(--mmd-fx-pattern-dot, 1.5px) * 1.6), transparent calc(var(--mmd-fx-pattern-dot, 1.5px) * 1.6 + 0.5px)),
        radial-gradient(circle, var(--mmd-fx-pattern-c) calc(var(--mmd-fx-pattern-dot, 1.5px) * 1.6), transparent calc(var(--mmd-fx-pattern-dot, 1.5px) * 1.6 + 0.5px));
    background-size: var(--mmd-fx-pattern-s) var(--mmd-fx-pattern-s);
    background-position: 0 0, calc(var(--mmd-fx-pattern-s) / 2) calc(var(--mmd-fx-pattern-s) / 2);
}
.mmd-fx-pattern-dots::after {
    --mmd-fx-pattern-s: calc(14px * var(--mmd-fx-pattern-k));
    background-image: radial-gradient(circle, var(--mmd-fx-pattern-c) calc(var(--mmd-fx-pattern-dot, 1.5px) * 0.7), transparent calc(var(--mmd-fx-pattern-dot, 1.5px) * 0.7 + 0.5px));
    background-size: var(--mmd-fx-pattern-s) var(--mmd-fx-pattern-s);
}
.mmd-fx-pattern-plus::after {
    --mmd-fx-pattern-s: calc(36px * var(--mmd-fx-pattern-k));
    --mmd-fx-pattern-arm: calc(11px * var(--mmd-fx-pattern-k));
    background-image:
        conic-gradient(from 270deg at var(--mmd-fx-pattern-arm) var(--mmd-fx-pattern-l), var(--mmd-fx-pattern-c) 25%, transparent 0),
        conic-gradient(from 270deg at var(--mmd-fx-pattern-l) var(--mmd-fx-pattern-arm), var(--mmd-fx-pattern-c) 25%, transparent 0);
    background-size: var(--mmd-fx-pattern-s) var(--mmd-fx-pattern-s);
    background-position:
        calc((var(--mmd-fx-pattern-s) - var(--mmd-fx-pattern-arm)) / 2) calc((var(--mmd-fx-pattern-s) - var(--mmd-fx-pattern-l)) / 2),
        calc((var(--mmd-fx-pattern-s) - var(--mmd-fx-pattern-l)) / 2) calc((var(--mmd-fx-pattern-s) - var(--mmd-fx-pattern-arm)) / 2);
}
.mmd-fx-pattern-rings::after {
    --mmd-fx-pattern-s: calc(28px * var(--mmd-fx-pattern-k));
    --mmd-fx-pattern-r: calc(5px * var(--mmd-fx-pattern-k));
    background-image: radial-gradient(circle, transparent var(--mmd-fx-pattern-r), var(--mmd-fx-pattern-c) var(--mmd-fx-pattern-r) calc(var(--mmd-fx-pattern-r) + var(--mmd-fx-pattern-l)), transparent calc(var(--mmd-fx-pattern-r) + var(--mmd-fx-pattern-l) + 0.5px));
    background-size: var(--mmd-fx-pattern-s) var(--mmd-fx-pattern-s);
}
.mmd-fx-pattern-paper::after {
    --mmd-fx-pattern-s: calc(16px * var(--mmd-fx-pattern-k));
    background-image:
        linear-gradient(var(--mmd-fx-pattern-c) var(--mmd-fx-pattern-l), transparent 0),
        linear-gradient(90deg, var(--mmd-fx-pattern-c) var(--mmd-fx-pattern-l), transparent 0);
    background-size: var(--mmd-fx-pattern-s) var(--mmd-fx-pattern-s);
}
.mmd-fx-pattern-graph::after {
    --mmd-fx-pattern-s: calc(10px * var(--mmd-fx-pattern-k));
    background-image:
        linear-gradient(var(--mmd-fx-pattern-c) var(--mmd-fx-pattern-l), transparent 0),
        linear-gradient(90deg, var(--mmd-fx-pattern-c) var(--mmd-fx-pattern-l), transparent 0),
        linear-gradient(color-mix(in srgb, var(--mmd-fx-pattern-c) 50%, transparent) var(--mmd-fx-pattern-l), transparent 0),
        linear-gradient(90deg, color-mix(in srgb, var(--mmd-fx-pattern-c) 50%, transparent) var(--mmd-fx-pattern-l), transparent 0);
    background-size:
        calc(var(--mmd-fx-pattern-s) * 5) calc(var(--mmd-fx-pattern-s) * 5),
        calc(var(--mmd-fx-pattern-s) * 5) calc(var(--mmd-fx-pattern-s) * 5),
        var(--mmd-fx-pattern-s) var(--mmd-fx-pattern-s),
        var(--mmd-fx-pattern-s) var(--mmd-fx-pattern-s);
}
.mmd-fx-pattern-dashed::after {
    --mmd-fx-pattern-s: calc(24px * var(--mmd-fx-pattern-k));
    background-image:
        conic-gradient(from 270deg at 50% var(--mmd-fx-pattern-l), var(--mmd-fx-pattern-c) 25%, transparent 0),
        conic-gradient(from 270deg at var(--mmd-fx-pattern-l) 50%, var(--mmd-fx-pattern-c) 25%, transparent 0);
    background-size: var(--mmd-fx-pattern-s) var(--mmd-fx-pattern-s);
    background-position: calc(var(--mmd-fx-pattern-s) / 4) 0, 0 calc(var(--mmd-fx-pattern-s) / 4);
}
.mmd-fx-pattern-dotted::after {
    --mmd-fx-pattern-s: calc(24px * var(--mmd-fx-pattern-k));
    background-image:
        radial-gradient(circle at var(--mmd-fx-pattern-l) var(--mmd-fx-pattern-l), var(--mmd-fx-pattern-c) var(--mmd-fx-pattern-l), transparent calc(var(--mmd-fx-pattern-l) + 0.5px)),
        radial-gradient(circle at var(--mmd-fx-pattern-l) var(--mmd-fx-pattern-l), var(--mmd-fx-pattern-c) var(--mmd-fx-pattern-l), transparent calc(var(--mmd-fx-pattern-l) + 0.5px));
    background-size:
        calc(var(--mmd-fx-pattern-s) / 4) var(--mmd-fx-pattern-s),
        var(--mmd-fx-pattern-s) calc(var(--mmd-fx-pattern-s) / 4);
}
.mmd-fx-pattern-cross::after {
    --mmd-fx-pattern-s: calc(22px * var(--mmd-fx-pattern-k));
    background-image:
        repeating-linear-gradient(45deg, var(--mmd-fx-pattern-c) 0 var(--mmd-fx-pattern-l), transparent 0 var(--mmd-fx-pattern-s)),
        repeating-linear-gradient(-45deg, var(--mmd-fx-pattern-c) 0 var(--mmd-fx-pattern-l), transparent 0 var(--mmd-fx-pattern-s));
}
.mmd-fx-pattern-circuit::after {
    --mmd-fx-pattern-s: calc(40px * var(--mmd-fx-pattern-k));
    background-image:
        radial-gradient(circle, var(--mmd-fx-pattern-c) calc(var(--mmd-fx-pattern-dot, 1.5px) * 1.8), transparent calc(var(--mmd-fx-pattern-dot, 1.5px) * 1.8 + 0.5px)),
        conic-gradient(from 270deg at 60% var(--mmd-fx-pattern-l), var(--mmd-fx-pattern-c) 25%, transparent 0),
        conic-gradient(from 270deg at var(--mmd-fx-pattern-l) 60%, var(--mmd-fx-pattern-c) 25%, transparent 0);
    background-size: var(--mmd-fx-pattern-s) var(--mmd-fx-pattern-s);
    background-position: calc(var(--mmd-fx-pattern-s) / -2) calc(var(--mmd-fx-pattern-s) / -2), 0 0, 0 0;
}
.mmd-fx-pattern-checker::after {
    --mmd-fx-pattern-s: calc(32px * var(--mmd-fx-pattern-k));
    background-image: conic-gradient(var(--mmd-fx-pattern-c) 25%, transparent 0 50%, var(--mmd-fx-pattern-c) 0 75%, transparent 0);
    background-size: var(--mmd-fx-pattern-s) var(--mmd-fx-pattern-s);
}
.mmd-fx-pattern-diamond::after {
    --mmd-fx-pattern-s: calc(28px * var(--mmd-fx-pattern-k));
    background-image:
        linear-gradient(135deg, var(--mmd-fx-pattern-c) 25%, transparent 25%),
        linear-gradient(225deg, var(--mmd-fx-pattern-c) 25%, transparent 25%),
        linear-gradient(315deg, var(--mmd-fx-pattern-c) 25%, transparent 25%),
        linear-gradient(45deg, var(--mmd-fx-pattern-c) 25%, transparent 25%);
    background-size: var(--mmd-fx-pattern-s) var(--mmd-fx-pattern-s);
}
.mmd-fx-pattern-zigzag::after {
    --mmd-fx-pattern-s: calc(28px * var(--mmd-fx-pattern-k));
    background-image:
        linear-gradient(135deg, var(--mmd-fx-pattern-c) 25%, transparent 25%),
        linear-gradient(225deg, var(--mmd-fx-pattern-c) 25%, transparent 25%),
        linear-gradient(315deg, var(--mmd-fx-pattern-c) 25%, transparent 25%),
        linear-gradient(45deg, var(--mmd-fx-pattern-c) 25%, transparent 25%);
    background-size: var(--mmd-fx-pattern-s) var(--mmd-fx-pattern-s);
    background-position: calc(var(--mmd-fx-pattern-s) / -2) 0, calc(var(--mmd-fx-pattern-s) / -2) 0, 0 0, 0 0;
}
.mmd-fx-pattern-iso::after {
    --mmd-fx-pattern-s: calc(34px * var(--mmd-fx-pattern-k));
    background-image:
        linear-gradient(to top right, transparent calc(50% - var(--mmd-fx-pattern-l) / 2), var(--mmd-fx-pattern-c) 0 calc(50% + var(--mmd-fx-pattern-l) / 2), transparent 0),
        linear-gradient(to top left, transparent calc(50% - var(--mmd-fx-pattern-l) / 2), var(--mmd-fx-pattern-c) 0 calc(50% + var(--mmd-fx-pattern-l) / 2), transparent 0),
        linear-gradient(90deg, var(--mmd-fx-pattern-c) var(--mmd-fx-pattern-l), transparent 0);
    background-size: var(--mmd-fx-pattern-s) calc(var(--mmd-fx-pattern-s) / 1.732);
}
.mmd-fx-pattern-triangle::after {
    --mmd-fx-pattern-s: calc(30px * var(--mmd-fx-pattern-k));
    background-image:
        linear-gradient(45deg, var(--mmd-fx-pattern-c) 50%, transparent 50%),
        linear-gradient(-45deg, color-mix(in srgb, var(--mmd-fx-pattern-c) 50%, transparent) 50%, transparent 50%);
    background-size: var(--mmd-fx-pattern-s) var(--mmd-fx-pattern-s);
}
.mmd-fx-pattern-tartan::after {
    --mmd-fx-pattern-s: calc(48px * var(--mmd-fx-pattern-k));
    background-image:
        repeating-linear-gradient(90deg, var(--mmd-fx-pattern-c) 0 calc(var(--mmd-fx-pattern-s) * 0.25), transparent 0 calc(var(--mmd-fx-pattern-s) * 0.5), var(--mmd-fx-pattern-c) 0 calc(var(--mmd-fx-pattern-s) * 0.5 + var(--mmd-fx-pattern-l) * 2), transparent 0 var(--mmd-fx-pattern-s)),
        repeating-linear-gradient(0deg, var(--mmd-fx-pattern-c) 0 calc(var(--mmd-fx-pattern-s) * 0.25), transparent 0 calc(var(--mmd-fx-pattern-s) * 0.5), var(--mmd-fx-pattern-c) 0 calc(var(--mmd-fx-pattern-s) * 0.5 + var(--mmd-fx-pattern-l) * 2), transparent 0 var(--mmd-fx-pattern-s));
}
.mmd-fx-pattern-stripes::after {
    --mmd-fx-pattern-s: calc(14px * var(--mmd-fx-pattern-k));
    background-image: repeating-linear-gradient(var(--mmd-fx-pattern-angle, 45deg), var(--mmd-fx-pattern-c) 0 calc(var(--mmd-fx-pattern-l) * 2), transparent 0 var(--mmd-fx-pattern-s));
}
.mmd-fx-pattern-pinstripe::after {
    --mmd-fx-pattern-s: calc(12px * var(--mmd-fx-pattern-k));
    background-image: repeating-linear-gradient(var(--mmd-fx-pattern-angle, 90deg), var(--mmd-fx-pattern-c) 0 var(--mmd-fx-pattern-l), transparent 0 var(--mmd-fx-pattern-s));
}
.mmd-fx-pattern-candy::after {
    --mmd-fx-pattern-s: calc(40px * var(--mmd-fx-pattern-k));
    background-image: repeating-linear-gradient(var(--mmd-fx-pattern-angle, -45deg), var(--mmd-fx-pattern-c) 0 calc(var(--mmd-fx-pattern-s) / 2), transparent 0 var(--mmd-fx-pattern-s));
}
.mmd-fx-pattern-notebook::after {
    --mmd-fx-pattern-s: calc(28px * var(--mmd-fx-pattern-k));
    background-image:
        linear-gradient(90deg, transparent calc(var(--mmd-fx-pattern-s) * 2), var(--mmd-fx-pattern-c) 0 calc(var(--mmd-fx-pattern-s) * 2 + var(--mmd-fx-pattern-l) * 2), transparent 0),
        repeating-linear-gradient(transparent 0 calc(var(--mmd-fx-pattern-s) - var(--mmd-fx-pattern-l)), var(--mmd-fx-pattern-c) 0 var(--mmd-fx-pattern-s));
}
.mmd-fx-pattern-scanlines::after {
    --mmd-fx-pattern-s: calc(4px * var(--mmd-fx-pattern-k));
    background-image: repeating-linear-gradient(var(--mmd-fx-pattern-angle, 0deg), var(--mmd-fx-pattern-c) 0 var(--mmd-fx-pattern-l), transparent 0 var(--mmd-fx-pattern-s));
}
.mmd-fx-pattern-circles::after {
    --mmd-fx-pattern-s: calc(26px * var(--mmd-fx-pattern-k));
    background-image: repeating-radial-gradient(circle at var(--mmd-fx-pattern-at, 50% 50%), var(--mmd-fx-pattern-c) 0 var(--mmd-fx-pattern-l), transparent 0 var(--mmd-fx-pattern-s));
}
.mmd-fx-pattern-waves::after {
    --mmd-fx-pattern-r: calc(10px * var(--mmd-fx-pattern-k));
    background-image:
        radial-gradient(circle at 25% 0, transparent calc(var(--mmd-fx-pattern-r) - var(--mmd-fx-pattern-l)), var(--mmd-fx-pattern-c) calc(var(--mmd-fx-pattern-r) - var(--mmd-fx-pattern-l)) var(--mmd-fx-pattern-r), transparent calc(var(--mmd-fx-pattern-r) + 0.5px)),
        radial-gradient(circle at 75% 100%, transparent calc(var(--mmd-fx-pattern-r) - var(--mmd-fx-pattern-l)), var(--mmd-fx-pattern-c) calc(var(--mmd-fx-pattern-r) - var(--mmd-fx-pattern-l)) var(--mmd-fx-pattern-r), transparent calc(var(--mmd-fx-pattern-r) + 0.5px));
    background-size: calc(var(--mmd-fx-pattern-r) * 4) calc(var(--mmd-fx-pattern-r) * 1.6);
}
.mmd-fx-pattern-scallop::after {
    --mmd-fx-pattern-r: calc(14px * var(--mmd-fx-pattern-k));
    background-image:
        radial-gradient(circle at 50% 100%, transparent calc(var(--mmd-fx-pattern-r) - var(--mmd-fx-pattern-l)), var(--mmd-fx-pattern-c) calc(var(--mmd-fx-pattern-r) - var(--mmd-fx-pattern-l)) var(--mmd-fx-pattern-r), transparent calc(var(--mmd-fx-pattern-r) + 0.5px)),
        radial-gradient(circle at 50% 100%, transparent calc(var(--mmd-fx-pattern-r) - var(--mmd-fx-pattern-l)), var(--mmd-fx-pattern-c) calc(var(--mmd-fx-pattern-r) - var(--mmd-fx-pattern-l)) var(--mmd-fx-pattern-r), transparent calc(var(--mmd-fx-pattern-r) + 0.5px));
    background-size: calc(var(--mmd-fx-pattern-r) * 2) var(--mmd-fx-pattern-r);
    background-position: 0 0, var(--mmd-fx-pattern-r) calc(var(--mmd-fx-pattern-r) / 2);
}
.mmd-fx-pattern-doodle::after,
.mmd-fx-pattern-topo::after,
.mmd-fx-pattern-terrazzo::after,
.mmd-fx-pattern-memphis::after,
.mmd-fx-pattern-confetti::after,
.mmd-fx-pattern-zen::after,
.mmd-fx-pattern-wood::after,
.mmd-fx-pattern-ridges::after,
.mmd-fx-pattern-cells::after,
.mmd-fx-pattern-swirl::after {
    -webkit-mask-image: var(--mmd-fx-pattern-tile, linear-gradient(transparent 0 0)), var(--mmd-fx-pattern-fade, linear-gradient(#000 0 0));
    mask-image: var(--mmd-fx-pattern-tile, linear-gradient(transparent 0 0)), var(--mmd-fx-pattern-fade, linear-gradient(#000 0 0));
    -webkit-mask-size: var(--mmd-fx-pattern-s, 100% 100%), 100% 100%;
    mask-size: var(--mmd-fx-pattern-s, 100% 100%), 100% 100%;
    -webkit-mask-repeat: repeat, no-repeat;
    mask-repeat: repeat, no-repeat;
    -webkit-mask-composite: source-in;
    mask-composite: intersect;
}
.mmd-fx-pattern-fade {
    --mmd-fx-pattern-fade: radial-gradient(ellipse 70% 70% at 50% 50%, #000 var(--mmd-fx-pattern-fade-start, 20%), transparent 100%);
}
.mmd-fx-pattern-fade-top {
    --mmd-fx-pattern-fade: linear-gradient(#000 var(--mmd-fx-pattern-fade-start, 20%), transparent);
}
.mmd-fx-pattern-fade-bottom {
    --mmd-fx-pattern-fade: linear-gradient(transparent, #000 calc(100% - var(--mmd-fx-pattern-fade-start, 20%)));
}
.mmd-fx-pattern-fade-sides {
    --mmd-fx-pattern-fade: linear-gradient(90deg, transparent, #000 var(--mmd-fx-pattern-fade-start, 20%), #000 calc(100% - var(--mmd-fx-pattern-fade-start, 20%)), transparent);
}
.mmd-fx-pattern-fade-center {
    --mmd-fx-pattern-fade: radial-gradient(circle at var(--mmd-fx-pattern-hole-at, 50% 50%), transparent var(--mmd-fx-pattern-hole, 9rem), #000 calc(var(--mmd-fx-pattern-hole, 9rem) + var(--mmd-fx-pattern-hole-edge, 2rem)));
}
.mmd-fx-pattern-tint-1 { --mmd-fx-pattern-ink: var(--mmd-fx-palette-1, #1e87f0); }
.mmd-fx-pattern-tint-2 { --mmd-fx-pattern-ink: var(--mmd-fx-palette-2, #32d296); }
.mmd-fx-pattern-tint-3 { --mmd-fx-pattern-ink: var(--mmd-fx-palette-3, #faa05a); }
.mmd-fx-pattern-tint-4 { --mmd-fx-pattern-ink: var(--mmd-fx-palette-4, #f0506e); }
.mmd-fx-pattern-multi-2 {
    --mmd-fx-pattern-ink: var(--mmd-fx-palette-1, #1e87f0);
    --mmd-fx-pattern-ink-2: var(--mmd-fx-palette-2, #32d296);
    --mmd-fx-pattern-ink-3: var(--mmd-fx-palette-2, #32d296);
}
.mmd-fx-pattern-multi-3 {
    --mmd-fx-pattern-ink: var(--mmd-fx-palette-1, #1e87f0);
    --mmd-fx-pattern-ink-2: var(--mmd-fx-palette-2, #32d296);
    --mmd-fx-pattern-ink-3: var(--mmd-fx-palette-3, #faa05a);
}
.mmd-fx-pattern-small { --mmd-fx-pattern-scale: 0.6; }
.mmd-fx-pattern-large { --mmd-fx-pattern-scale: 1.6; }
.mmd-fx-pattern-xlarge { --mmd-fx-pattern-scale: 2.5; }
.mmd-fx-pattern-xxlarge { --mmd-fx-pattern-scale: 4; }
.mmd-fx-pattern-scale-25 { --mmd-fx-pattern-scale: 0.25; }
.mmd-fx-pattern-scale-50 { --mmd-fx-pattern-scale: 0.5; }
.mmd-fx-pattern-scale-75 { --mmd-fx-pattern-scale: 0.75; }
.mmd-fx-pattern-scale-100 { --mmd-fx-pattern-scale: 1; }
.mmd-fx-pattern-scale-125 { --mmd-fx-pattern-scale: 1.25; }
.mmd-fx-pattern-scale-150 { --mmd-fx-pattern-scale: 1.5; }
.mmd-fx-pattern-scale-175 { --mmd-fx-pattern-scale: 1.75; }
.mmd-fx-pattern-scale-200 { --mmd-fx-pattern-scale: 2; }
.mmd-fx-pattern-scale-225 { --mmd-fx-pattern-scale: 2.25; }
.mmd-fx-pattern-scale-250 { --mmd-fx-pattern-scale: 2.5; }
.mmd-fx-pattern-scale-275 { --mmd-fx-pattern-scale: 2.75; }
.mmd-fx-pattern-scale-300 { --mmd-fx-pattern-scale: 3; }
.mmd-fx-pattern-scale-325 { --mmd-fx-pattern-scale: 3.25; }
.mmd-fx-pattern-scale-350 { --mmd-fx-pattern-scale: 3.5; }
.mmd-fx-pattern-scale-375 { --mmd-fx-pattern-scale: 3.75; }
.mmd-fx-pattern-scale-400 { --mmd-fx-pattern-scale: 4; }
.mmd-fx-pattern-scale-425 { --mmd-fx-pattern-scale: 4.25; }
.mmd-fx-pattern-scale-450 { --mmd-fx-pattern-scale: 4.5; }
.mmd-fx-pattern-scale-475 { --mmd-fx-pattern-scale: 4.75; }
.mmd-fx-pattern-scale-500 { --mmd-fx-pattern-scale: 5; }
.mmd-fx-pattern-scale-525 { --mmd-fx-pattern-scale: 5.25; }
.mmd-fx-pattern-scale-550 { --mmd-fx-pattern-scale: 5.5; }
.mmd-fx-pattern-scale-575 { --mmd-fx-pattern-scale: 5.75; }
.mmd-fx-pattern-scale-600 { --mmd-fx-pattern-scale: 6; }
.mmd-fx-pattern-scale-625 { --mmd-fx-pattern-scale: 6.25; }
.mmd-fx-pattern-scale-650 { --mmd-fx-pattern-scale: 6.5; }
.mmd-fx-pattern-scale-675 { --mmd-fx-pattern-scale: 6.75; }
.mmd-fx-pattern-scale-700 { --mmd-fx-pattern-scale: 7; }
.mmd-fx-pattern-scale-725 { --mmd-fx-pattern-scale: 7.25; }
.mmd-fx-pattern-scale-750 { --mmd-fx-pattern-scale: 7.5; }
.mmd-fx-pattern-scale-775 { --mmd-fx-pattern-scale: 7.75; }
.mmd-fx-pattern-scale-800 { --mmd-fx-pattern-scale: 8; }
.mmd-fx-pattern-soft { --mmd-fx-pattern-mix: 8%; }
.mmd-fx-pattern-strong { --mmd-fx-pattern-mix: 30%; }
.mmd-fx-pattern-solid { --mmd-fx-pattern-mix: 100%; }
.mmd-fx-pattern-parallax-soft { --mmd-fx-pattern-shift: calc(var(--mmd-fx-pattern-parallax, 200px) * 0.5); }
.mmd-fx-pattern-parallax { --mmd-fx-pattern-shift: var(--mmd-fx-pattern-parallax, 200px); }
.mmd-fx-pattern-parallax-strong { --mmd-fx-pattern-shift: calc(var(--mmd-fx-pattern-parallax, 200px) * 1.6); }
:host::after {
    display: none;
}
.mmd-pattern-layer {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: -1;
    overflow: hidden;
    pointer-events: none;
    border-radius: inherit;
    -webkit-mask-image: var(--mmd-fx-pattern-fade, none);
    mask-image: var(--mmd-fx-pattern-fade, none);
}
.mmd-pattern-layer > .mmd-pattern-move {
    --mmd-fx-pattern-fade: linear-gradient(#000 0 0);
    position: absolute;
    top: calc(var(--mmd-fx-pattern-shift, 0px) * -1);
    right: 0;
    bottom: calc(var(--mmd-fx-pattern-shift, 0px) * -1);
    left: 0;
    will-change: transform;
}
.mmd-pattern-layer > .mmd-pattern-move::after {
    border-radius: 0;
}
@media (forced-colors: active) {
    :is(.mmd-fx-pattern-polka, .mmd-fx-pattern-dots, .mmd-fx-pattern-plus, .mmd-fx-pattern-rings,
        .mmd-fx-pattern-paper, .mmd-fx-pattern-graph, .mmd-fx-pattern-dashed, .mmd-fx-pattern-dotted,
        .mmd-fx-pattern-cross, .mmd-fx-pattern-circuit,
        .mmd-fx-pattern-checker, .mmd-fx-pattern-diamond, .mmd-fx-pattern-zigzag,
        .mmd-fx-pattern-iso, .mmd-fx-pattern-triangle, .mmd-fx-pattern-tartan,
        .mmd-fx-pattern-stripes, .mmd-fx-pattern-pinstripe, .mmd-fx-pattern-candy, .mmd-fx-pattern-notebook,
        .mmd-fx-pattern-scanlines,
        .mmd-fx-pattern-circles, .mmd-fx-pattern-waves, .mmd-fx-pattern-scallop,
        .mmd-fx-pattern-doodle, .mmd-fx-pattern-topo,
        .mmd-fx-pattern-terrazzo, .mmd-fx-pattern-memphis, .mmd-fx-pattern-confetti,
        .mmd-fx-pattern-zen, .mmd-fx-pattern-wood, .mmd-fx-pattern-ridges, .mmd-fx-pattern-cells, .mmd-fx-pattern-swirl)::after {
        display: none;
    }
}
@media print {
    :is(.mmd-fx-pattern-polka, .mmd-fx-pattern-dots, .mmd-fx-pattern-plus, .mmd-fx-pattern-rings,
        .mmd-fx-pattern-paper, .mmd-fx-pattern-graph, .mmd-fx-pattern-dashed, .mmd-fx-pattern-dotted,
        .mmd-fx-pattern-cross, .mmd-fx-pattern-circuit,
        .mmd-fx-pattern-checker, .mmd-fx-pattern-diamond, .mmd-fx-pattern-zigzag,
        .mmd-fx-pattern-iso, .mmd-fx-pattern-triangle, .mmd-fx-pattern-tartan,
        .mmd-fx-pattern-stripes, .mmd-fx-pattern-pinstripe, .mmd-fx-pattern-candy, .mmd-fx-pattern-notebook,
        .mmd-fx-pattern-scanlines,
        .mmd-fx-pattern-circles, .mmd-fx-pattern-waves, .mmd-fx-pattern-scallop,
        .mmd-fx-pattern-doodle, .mmd-fx-pattern-topo,
        .mmd-fx-pattern-terrazzo, .mmd-fx-pattern-memphis, .mmd-fx-pattern-confetti,
        .mmd-fx-pattern-zen, .mmd-fx-pattern-wood, .mmd-fx-pattern-ridges, .mmd-fx-pattern-cells, .mmd-fx-pattern-swirl)::after {
        display: none;
    }
}
