/**
 * Wedwebs Frame.
 *
 * GENERATED by tools/build-frames.php. Edit the tool and run it again rather
 * than editing this file.
 *
 * The frame is the element's ::after, 9-sliced from one SVG tile with
 * border-image: the corners keep their size and only the straight middles
 * stretch. It has no real border, only border-image-width, so on an element
 * narrower than the frame the browser shrinks the whole frame evenly rather
 * than pushing it off centre. (A real border wider than the element would make
 * the box overflow to the right.)
 *
 * ::after rather than ::before, because Elementor's Container keeps its
 * background overlay on ::before. The frame paints last, above backgrounds,
 * overlays and background video, and lets every click through.
 *
 * Variables, all optional:
 *   --ww-frame-scale   corner size, 1 = natural (Corner Size control)
 *   --ww-frame-inset   distance from the element's edge (Inset control)
 *   --ww-frame-color   line colour for the Line style (Line Colour control)
 *   --ww-frame-light   highlight for Custom Colours (Highlight Colour control)
 *   --ww-frame-shade   shadow for Custom Colours (Shadow Colour control)
 *   --ww-fv, --ww-fh   corner height and width in px, set per shape below
 */

.ww-frame-on::after {
	content: "";
	position: absolute;
	inset: var(--ww-frame-inset, 0px);
	pointer-events: none;
	border: 0 solid transparent;
	border-image-slice: var(--ww-fv, 56) var(--ww-fh, 56);
	border-image-width: calc(var(--ww-fv, 56) * var(--ww-frame-scale, 1) * 1px) calc(var(--ww-fh, 56) * var(--ww-frame-scale, 1) * 1px);
	border-image-repeat: stretch;
	opacity: 0.85;
}

/* Depth, for Emboss and Deboss. */
.ww-frame-on.ww-frame-depth-subtle::after { opacity: 0.55; }
.ww-frame-on.ww-frame-depth-strong::after { opacity: 1; }

/*
 * Line: the tile is a mask over a flat colour, so the colour is a plain CSS
 * value and changes live in the editor. CSS masks only 9-slice in Chromium
 * and Safari (mask-box-image); Firefox keeps the emboss instead.
 */
@supports (-webkit-mask-box-image-source: none) {
	.ww-frame-on.ww-frame-style-line::after {
		border-image-source: none;
		background: var(--ww-frame-color, #b08d57);
		opacity: 1;
		-webkit-mask-box-image-slice: var(--ww-fv, 56) var(--ww-fh, 56);
		-webkit-mask-box-image-width: calc(var(--ww-fv, 56) * var(--ww-frame-scale, 1) * 1px) calc(var(--ww-fh, 56) * var(--ww-frame-scale, 1) * 1px);
		-webkit-mask-box-image-repeat: stretch;
	}
}

/*
 * Custom Colours, for Emboss and Deboss. The emboss tile has its white and
 * black baked in, and a file cannot read a CSS colour. So the light and the
 * shade are drawn as CSS shadows of hairline rules (the core tile), which do
 * take a colour, and a mask then hides the rules themselves (the knock tile).
 * A filter is applied before a mask, which is what lets the shadows survive
 * the rule that cast them.
 *
 * Each colour is used twice: a crisp shadow for the bevelled edge and a soft
 * one for the glow or the cast on the paper. --ww-fo is one tile px, signed:
 * Deboss turns it round, so the shade falls on the upper left instead.
 *
 * The mask needs mask-box-image, as Line does. Firefox keeps the emboss tile.
 */
@supports (-webkit-mask-box-image-source: none) {
	.ww-frame-on.ww-frame-tone-custom:not(.ww-frame-style-line)::after {
		--ww-fs: calc(var(--ww-frame-scale, 1) * 1px);
		--ww-fo: calc(var(--ww-fs) * var(--ww-fd, 1));
		filter:
			drop-shadow(calc(var(--ww-fo) * -1) calc(var(--ww-fo) * -1) calc(var(--ww-fs) * 0.7) var(--ww-frame-light, #fffffffa))
			drop-shadow(var(--ww-fo) var(--ww-fo) calc(var(--ww-fs) * 0.7) var(--ww-frame-shade, #00000059))
			drop-shadow(calc(var(--ww-fo) * -0.9) calc(var(--ww-fo) * -1.1) calc(var(--ww-fs) * 2) var(--ww-frame-light, #fffffffa))
			drop-shadow(var(--ww-fo) calc(var(--ww-fo) * 1.6) calc(var(--ww-fs) * 2) var(--ww-frame-shade, #00000059));
		-webkit-mask-box-image-slice: var(--ww-fv, 56) var(--ww-fh, 56) fill;
		-webkit-mask-box-image-width: calc(var(--ww-fv, 56) * var(--ww-frame-scale, 1) * 1px) calc(var(--ww-fh, 56) * var(--ww-frame-scale, 1) * 1px);
		-webkit-mask-box-image-repeat: stretch;
	}
	.ww-frame-on.ww-frame-tone-custom.ww-frame-style-deboss::after { --ww-fd: -1; }
}

/*
 * Cut Container to Frame: the element is masked to the frame's outline, half a
 * pixel inside the outer rule's outer edge, so its background, overlay and
 * video end under the rule like a die-cut card and never show outside it.
 *
 * The mask is six layers, which every current browser supports: a corner piece
 * in each corner, at the frame's corner size, and two plain bands for the rest.
 * The outer rule sits a few px in from the element's edge, so the bands are
 * inset by the same distance (--ww-cut-edge, in tile px, per style). That
 * inset is drawn with hard colour stops inside a band that spans the element,
 * not by sizing the band: Chrome rounds a gradient layer's size and position to
 * whole pixels, which left the straight edge up to half a pixel off the corner
 * pieces beside it, while a stop lands where it is put. The bands reach
 * 1 px into the corner pieces, which are solid there, so no hairline seam can
 * open where the layers meet. Everything follows Inset and Corner Size.
 */
.ww-frame-on.ww-frame-cut-on {
	--ww-cw: calc(var(--ww-fh, 56) * var(--ww-frame-scale, 1) * 1px);
	--ww-ch: calc(var(--ww-fv, 56) * var(--ww-frame-scale, 1) * 1px);
	--ww-ci: var(--ww-frame-inset, 0px);
	--ww-cb: calc(var(--ww-ci) + var(--ww-cut-edge, 2.7) * var(--ww-frame-scale, 1) * 1px);
	-webkit-mask:
		var(--ww-cut-tl) left var(--ww-ci) top var(--ww-ci) / var(--ww-cw) var(--ww-ch) no-repeat,
		var(--ww-cut-tr) right var(--ww-ci) top var(--ww-ci) / var(--ww-cw) var(--ww-ch) no-repeat,
		var(--ww-cut-bl) left var(--ww-ci) bottom var(--ww-ci) / var(--ww-cw) var(--ww-ch) no-repeat,
		var(--ww-cut-br) right var(--ww-ci) bottom var(--ww-ci) / var(--ww-cw) var(--ww-ch) no-repeat,
		linear-gradient(to bottom, #0000 var(--ww-cb), #000 0 calc(100% - var(--ww-cb)), #0000 0) 50% 0 / calc(100% - 2 * var(--ww-ci) - 2 * var(--ww-cw) + 2px) 100% no-repeat,
		linear-gradient(to right, #0000 var(--ww-cb), #000 0 calc(100% - var(--ww-cb)), #0000 0) 0 50% / 100% calc(100% - 2 * var(--ww-ci) - 2 * var(--ww-ch) + 2px) no-repeat;
	mask:
		var(--ww-cut-tl) left var(--ww-ci) top var(--ww-ci) / var(--ww-cw) var(--ww-ch) no-repeat,
		var(--ww-cut-tr) right var(--ww-ci) top var(--ww-ci) / var(--ww-cw) var(--ww-ch) no-repeat,
		var(--ww-cut-bl) left var(--ww-ci) bottom var(--ww-ci) / var(--ww-cw) var(--ww-ch) no-repeat,
		var(--ww-cut-br) right var(--ww-ci) bottom var(--ww-ci) / var(--ww-cw) var(--ww-ch) no-repeat,
		linear-gradient(to bottom, #0000 var(--ww-cb), #000 0 calc(100% - var(--ww-cb)), #0000 0) 50% 0 / calc(100% - 2 * var(--ww-ci) - 2 * var(--ww-cw) + 2px) 100% no-repeat,
		linear-gradient(to right, #0000 var(--ww-cb), #000 0 calc(100% - var(--ww-cb)), #0000 0) 0 50% / 100% calc(100% - 2 * var(--ww-ci) - 2 * var(--ww-ch) + 2px) no-repeat;
}

/*
 * Shadow for a cut card. A mask also cuts off the element's own shadows, so
 * the shadow is drawn by the Container around the card: a drop-shadow there
 * follows the cut outline. It only shows where that Container has no
 * background of its own, hence the panel note to wrap the card.
 */
.e-con:has(> .ww-frame-shadow-soft, > .e-con-inner > .ww-frame-shadow-soft) {
	filter: drop-shadow(0 1px 2px rgba(40, 32, 20, 0.14)) drop-shadow(0 8px 16px rgba(40, 32, 20, 0.14));
}
.e-con:has(> .ww-frame-shadow-lifted, > .e-con-inner > .ww-frame-shadow-lifted) {
	filter: drop-shadow(0 3px 5px rgba(40, 32, 20, 0.16)) drop-shadow(0 18px 32px rgba(40, 32, 20, 0.22));
}

/* Shapes. */
.ww-frame-shape-notch {
	--ww-fv: 56;
	--ww-fh: 56;
	--ww-cut-tl: url("../frames/notch-cut-emboss-tl.svg");
	--ww-cut-tr: url("../frames/notch-cut-emboss-tr.svg");
	--ww-cut-bl: url("../frames/notch-cut-emboss-bl.svg");
	--ww-cut-br: url("../frames/notch-cut-emboss-br.svg");
}
.ww-frame-shape-notch::after { border-image-source: url("../frames/notch-emboss.svg"); }
.ww-frame-shape-notch.ww-frame-style-deboss::after { border-image-source: url("../frames/notch-deboss.svg"); }
.ww-frame-shape-notch.ww-frame-style-line::after { -webkit-mask-box-image-source: url("../frames/notch-line.svg"); }
.ww-frame-shape-notch.ww-frame-style-line.ww-frame-weight-fine::after { -webkit-mask-box-image-source: url("../frames/notch-line-fine.svg"); }

.ww-frame-shape-pearl {
	--ww-fv: 56;
	--ww-fh: 56;
	--ww-cut-tl: url("../frames/pearl-cut-emboss-tl.svg");
	--ww-cut-tr: url("../frames/pearl-cut-emboss-tr.svg");
	--ww-cut-bl: url("../frames/pearl-cut-emboss-bl.svg");
	--ww-cut-br: url("../frames/pearl-cut-emboss-br.svg");
}
.ww-frame-shape-pearl::after { border-image-source: url("../frames/pearl-emboss.svg"); }
.ww-frame-shape-pearl.ww-frame-style-deboss::after { border-image-source: url("../frames/pearl-deboss.svg"); }
.ww-frame-shape-pearl.ww-frame-style-line::after { -webkit-mask-box-image-source: url("../frames/pearl-line.svg"); }
.ww-frame-shape-pearl.ww-frame-style-line.ww-frame-weight-fine::after { -webkit-mask-box-image-source: url("../frames/pearl-line-fine.svg"); }

.ww-frame-shape-deco {
	--ww-fv: 56;
	--ww-fh: 56;
	--ww-cut-tl: url("../frames/deco-cut-emboss-tl.svg");
	--ww-cut-tr: url("../frames/deco-cut-emboss-tr.svg");
	--ww-cut-bl: url("../frames/deco-cut-emboss-bl.svg");
	--ww-cut-br: url("../frames/deco-cut-emboss-br.svg");
}
.ww-frame-shape-deco::after { border-image-source: url("../frames/deco-emboss.svg"); }
.ww-frame-shape-deco.ww-frame-style-deboss::after { border-image-source: url("../frames/deco-deboss.svg"); }
.ww-frame-shape-deco.ww-frame-style-line::after { -webkit-mask-box-image-source: url("../frames/deco-line.svg"); }
.ww-frame-shape-deco.ww-frame-style-line.ww-frame-weight-fine::after { -webkit-mask-box-image-source: url("../frames/deco-line-fine.svg"); }

.ww-frame-shape-chamfer {
	--ww-fv: 56;
	--ww-fh: 56;
	--ww-cut-tl: url("../frames/chamfer-cut-emboss-tl.svg");
	--ww-cut-tr: url("../frames/chamfer-cut-emboss-tr.svg");
	--ww-cut-bl: url("../frames/chamfer-cut-emboss-bl.svg");
	--ww-cut-br: url("../frames/chamfer-cut-emboss-br.svg");
}
.ww-frame-shape-chamfer::after { border-image-source: url("../frames/chamfer-emboss.svg"); }
.ww-frame-shape-chamfer.ww-frame-style-deboss::after { border-image-source: url("../frames/chamfer-deboss.svg"); }
.ww-frame-shape-chamfer.ww-frame-style-line::after { -webkit-mask-box-image-source: url("../frames/chamfer-line.svg"); }
.ww-frame-shape-chamfer.ww-frame-style-line.ww-frame-weight-fine::after { -webkit-mask-box-image-source: url("../frames/chamfer-line-fine.svg"); }

.ww-frame-shape-rounded {
	--ww-fv: 56;
	--ww-fh: 56;
	--ww-cut-tl: url("../frames/rounded-cut-emboss-tl.svg");
	--ww-cut-tr: url("../frames/rounded-cut-emboss-tr.svg");
	--ww-cut-bl: url("../frames/rounded-cut-emboss-bl.svg");
	--ww-cut-br: url("../frames/rounded-cut-emboss-br.svg");
}
.ww-frame-shape-rounded::after { border-image-source: url("../frames/rounded-emboss.svg"); }
.ww-frame-shape-rounded.ww-frame-style-deboss::after { border-image-source: url("../frames/rounded-deboss.svg"); }
.ww-frame-shape-rounded.ww-frame-style-line::after { -webkit-mask-box-image-source: url("../frames/rounded-line.svg"); }
.ww-frame-shape-rounded.ww-frame-style-line.ww-frame-weight-fine::after { -webkit-mask-box-image-source: url("../frames/rounded-line-fine.svg"); }

.ww-frame-shape-mirror {
	--ww-fv: 128;
	--ww-fh: 146;
	--ww-cut-tl: url("../frames/mirror-cut-emboss-tl.svg");
	--ww-cut-tr: url("../frames/mirror-cut-emboss-tr.svg");
	--ww-cut-bl: url("../frames/mirror-cut-emboss-bl.svg");
	--ww-cut-br: url("../frames/mirror-cut-emboss-br.svg");
}
.ww-frame-shape-mirror::after { border-image-source: url("../frames/mirror-emboss.svg"); }
.ww-frame-shape-mirror.ww-frame-style-deboss::after { border-image-source: url("../frames/mirror-deboss.svg"); }
.ww-frame-shape-mirror.ww-frame-style-line::after { -webkit-mask-box-image-source: url("../frames/mirror-line.svg"); }
.ww-frame-shape-mirror.ww-frame-style-line.ww-frame-weight-fine::after { -webkit-mask-box-image-source: url("../frames/mirror-line-fine.svg"); }

.ww-frame-shape-mixed {
	--ww-fv: 56;
	--ww-fh: 56;
	--ww-cut-tl: url("../frames/mixed-cut-emboss-tl.svg");
	--ww-cut-tr: url("../frames/mixed-cut-emboss-tr.svg");
	--ww-cut-bl: url("../frames/mixed-cut-emboss-bl.svg");
	--ww-cut-br: url("../frames/mixed-cut-emboss-br.svg");
}
.ww-frame-shape-mixed::after { border-image-source: url("../frames/mixed-emboss.svg"); }
.ww-frame-shape-mixed.ww-frame-style-deboss::after { border-image-source: url("../frames/mixed-deboss.svg"); }
.ww-frame-shape-mixed.ww-frame-style-line::after { -webkit-mask-box-image-source: url("../frames/mixed-line.svg"); }
.ww-frame-shape-mixed.ww-frame-style-line.ww-frame-weight-fine::after { -webkit-mask-box-image-source: url("../frames/mixed-line-fine.svg"); }

.ww-frame-shape-lozenge {
	--ww-fv: 56;
	--ww-fh: 56;
	--ww-cut-tl: url("../frames/lozenge-cut-emboss-tl.svg");
	--ww-cut-tr: url("../frames/lozenge-cut-emboss-tr.svg");
	--ww-cut-bl: url("../frames/lozenge-cut-emboss-bl.svg");
	--ww-cut-br: url("../frames/lozenge-cut-emboss-br.svg");
}
.ww-frame-shape-lozenge::after { border-image-source: url("../frames/lozenge-emboss.svg"); }
.ww-frame-shape-lozenge.ww-frame-style-deboss::after { border-image-source: url("../frames/lozenge-deboss.svg"); }
.ww-frame-shape-lozenge.ww-frame-style-line::after { -webkit-mask-box-image-source: url("../frames/lozenge-line.svg"); }
.ww-frame-shape-lozenge.ww-frame-style-line.ww-frame-weight-fine::after { -webkit-mask-box-image-source: url("../frames/lozenge-line-fine.svg"); }

.ww-frame-shape-cartouche {
	--ww-fv: 90;
	--ww-fh: 90;
	--ww-cut-tl: url("../frames/cartouche-cut-emboss-tl.svg");
	--ww-cut-tr: url("../frames/cartouche-cut-emboss-tr.svg");
	--ww-cut-bl: url("../frames/cartouche-cut-emboss-bl.svg");
	--ww-cut-br: url("../frames/cartouche-cut-emboss-br.svg");
}
.ww-frame-shape-cartouche::after { border-image-source: url("../frames/cartouche-emboss.svg"); }
.ww-frame-shape-cartouche.ww-frame-style-deboss::after { border-image-source: url("../frames/cartouche-deboss.svg"); }
.ww-frame-shape-cartouche.ww-frame-style-line::after { -webkit-mask-box-image-source: url("../frames/cartouche-line.svg"); }
.ww-frame-shape-cartouche.ww-frame-style-line.ww-frame-weight-fine::after { -webkit-mask-box-image-source: url("../frames/cartouche-line-fine.svg"); }

.ww-frame-shape-shoulder {
	--ww-fv: 78;
	--ww-fh: 134;
	--ww-cut-tl: url("../frames/shoulder-cut-emboss-tl.svg");
	--ww-cut-tr: url("../frames/shoulder-cut-emboss-tr.svg");
	--ww-cut-bl: url("../frames/shoulder-cut-emboss-bl.svg");
	--ww-cut-br: url("../frames/shoulder-cut-emboss-br.svg");
}
.ww-frame-shape-shoulder::after { border-image-source: url("../frames/shoulder-emboss.svg"); }
.ww-frame-shape-shoulder.ww-frame-style-deboss::after { border-image-source: url("../frames/shoulder-deboss.svg"); }
.ww-frame-shape-shoulder.ww-frame-style-line::after { -webkit-mask-box-image-source: url("../frames/shoulder-line.svg"); }
.ww-frame-shape-shoulder.ww-frame-style-line.ww-frame-weight-fine::after { -webkit-mask-box-image-source: url("../frames/shoulder-line-fine.svg"); }

.ww-frame-shape-crown {
	--ww-fv: 86;
	--ww-fh: 148;
	--ww-cut-tl: url("../frames/crown-cut-emboss-tl.svg");
	--ww-cut-tr: url("../frames/crown-cut-emboss-tr.svg");
	--ww-cut-bl: url("../frames/crown-cut-emboss-bl.svg");
	--ww-cut-br: url("../frames/crown-cut-emboss-br.svg");
}
.ww-frame-shape-crown::after { border-image-source: url("../frames/crown-emboss.svg"); }
.ww-frame-shape-crown.ww-frame-style-deboss::after { border-image-source: url("../frames/crown-deboss.svg"); }
.ww-frame-shape-crown.ww-frame-style-line::after { -webkit-mask-box-image-source: url("../frames/crown-line.svg"); }
.ww-frame-shape-crown.ww-frame-style-line.ww-frame-weight-fine::after { -webkit-mask-box-image-source: url("../frames/crown-line-fine.svg"); }

.ww-frame-shape-crownstep {
	--ww-fv: 92;
	--ww-fh: 140;
	--ww-cut-tl: url("../frames/crownstep-cut-emboss-tl.svg");
	--ww-cut-tr: url("../frames/crownstep-cut-emboss-tr.svg");
	--ww-cut-bl: url("../frames/crownstep-cut-emboss-bl.svg");
	--ww-cut-br: url("../frames/crownstep-cut-emboss-br.svg");
}
.ww-frame-shape-crownstep::after { border-image-source: url("../frames/crownstep-emboss.svg"); }
.ww-frame-shape-crownstep.ww-frame-style-deboss::after { border-image-source: url("../frames/crownstep-deboss.svg"); }
.ww-frame-shape-crownstep.ww-frame-style-line::after { -webkit-mask-box-image-source: url("../frames/crownstep-line.svg"); }
.ww-frame-shape-crownstep.ww-frame-style-line.ww-frame-weight-fine::after { -webkit-mask-box-image-source: url("../frames/crownstep-line-fine.svg"); }

/* Cut for the thinner Line rules, where Line draws as a line. */
@supports (-webkit-mask-box-image-source: none) {
	.ww-frame-on.ww-frame-style-line { --ww-cut-edge: 3.4; }
	.ww-frame-on.ww-frame-style-line.ww-frame-weight-fine { --ww-cut-edge: 3.8; }
	.ww-frame-shape-notch.ww-frame-style-line { --ww-cut-tl: url("../frames/notch-cut-line-tl.svg"); --ww-cut-tr: url("../frames/notch-cut-line-tr.svg"); --ww-cut-bl: url("../frames/notch-cut-line-bl.svg"); --ww-cut-br: url("../frames/notch-cut-line-br.svg"); }
	.ww-frame-shape-notch.ww-frame-style-line.ww-frame-weight-fine { --ww-cut-tl: url("../frames/notch-cut-line-fine-tl.svg"); --ww-cut-tr: url("../frames/notch-cut-line-fine-tr.svg"); --ww-cut-bl: url("../frames/notch-cut-line-fine-bl.svg"); --ww-cut-br: url("../frames/notch-cut-line-fine-br.svg"); }
	.ww-frame-shape-pearl.ww-frame-style-line { --ww-cut-tl: url("../frames/pearl-cut-line-tl.svg"); --ww-cut-tr: url("../frames/pearl-cut-line-tr.svg"); --ww-cut-bl: url("../frames/pearl-cut-line-bl.svg"); --ww-cut-br: url("../frames/pearl-cut-line-br.svg"); }
	.ww-frame-shape-pearl.ww-frame-style-line.ww-frame-weight-fine { --ww-cut-tl: url("../frames/pearl-cut-line-fine-tl.svg"); --ww-cut-tr: url("../frames/pearl-cut-line-fine-tr.svg"); --ww-cut-bl: url("../frames/pearl-cut-line-fine-bl.svg"); --ww-cut-br: url("../frames/pearl-cut-line-fine-br.svg"); }
	.ww-frame-shape-deco.ww-frame-style-line { --ww-cut-tl: url("../frames/deco-cut-line-tl.svg"); --ww-cut-tr: url("../frames/deco-cut-line-tr.svg"); --ww-cut-bl: url("../frames/deco-cut-line-bl.svg"); --ww-cut-br: url("../frames/deco-cut-line-br.svg"); }
	.ww-frame-shape-deco.ww-frame-style-line.ww-frame-weight-fine { --ww-cut-tl: url("../frames/deco-cut-line-fine-tl.svg"); --ww-cut-tr: url("../frames/deco-cut-line-fine-tr.svg"); --ww-cut-bl: url("../frames/deco-cut-line-fine-bl.svg"); --ww-cut-br: url("../frames/deco-cut-line-fine-br.svg"); }
	.ww-frame-shape-chamfer.ww-frame-style-line { --ww-cut-tl: url("../frames/chamfer-cut-line-tl.svg"); --ww-cut-tr: url("../frames/chamfer-cut-line-tr.svg"); --ww-cut-bl: url("../frames/chamfer-cut-line-bl.svg"); --ww-cut-br: url("../frames/chamfer-cut-line-br.svg"); }
	.ww-frame-shape-chamfer.ww-frame-style-line.ww-frame-weight-fine { --ww-cut-tl: url("../frames/chamfer-cut-line-fine-tl.svg"); --ww-cut-tr: url("../frames/chamfer-cut-line-fine-tr.svg"); --ww-cut-bl: url("../frames/chamfer-cut-line-fine-bl.svg"); --ww-cut-br: url("../frames/chamfer-cut-line-fine-br.svg"); }
	.ww-frame-shape-rounded.ww-frame-style-line { --ww-cut-tl: url("../frames/rounded-cut-line-tl.svg"); --ww-cut-tr: url("../frames/rounded-cut-line-tr.svg"); --ww-cut-bl: url("../frames/rounded-cut-line-bl.svg"); --ww-cut-br: url("../frames/rounded-cut-line-br.svg"); }
	.ww-frame-shape-rounded.ww-frame-style-line.ww-frame-weight-fine { --ww-cut-tl: url("../frames/rounded-cut-line-fine-tl.svg"); --ww-cut-tr: url("../frames/rounded-cut-line-fine-tr.svg"); --ww-cut-bl: url("../frames/rounded-cut-line-fine-bl.svg"); --ww-cut-br: url("../frames/rounded-cut-line-fine-br.svg"); }
	.ww-frame-shape-mirror.ww-frame-style-line { --ww-cut-tl: url("../frames/mirror-cut-line-tl.svg"); --ww-cut-tr: url("../frames/mirror-cut-line-tr.svg"); --ww-cut-bl: url("../frames/mirror-cut-line-bl.svg"); --ww-cut-br: url("../frames/mirror-cut-line-br.svg"); }
	.ww-frame-shape-mirror.ww-frame-style-line.ww-frame-weight-fine { --ww-cut-tl: url("../frames/mirror-cut-line-fine-tl.svg"); --ww-cut-tr: url("../frames/mirror-cut-line-fine-tr.svg"); --ww-cut-bl: url("../frames/mirror-cut-line-fine-bl.svg"); --ww-cut-br: url("../frames/mirror-cut-line-fine-br.svg"); }
	.ww-frame-shape-mixed.ww-frame-style-line { --ww-cut-tl: url("../frames/mixed-cut-line-tl.svg"); --ww-cut-tr: url("../frames/mixed-cut-line-tr.svg"); --ww-cut-bl: url("../frames/mixed-cut-line-bl.svg"); --ww-cut-br: url("../frames/mixed-cut-line-br.svg"); }
	.ww-frame-shape-mixed.ww-frame-style-line.ww-frame-weight-fine { --ww-cut-tl: url("../frames/mixed-cut-line-fine-tl.svg"); --ww-cut-tr: url("../frames/mixed-cut-line-fine-tr.svg"); --ww-cut-bl: url("../frames/mixed-cut-line-fine-bl.svg"); --ww-cut-br: url("../frames/mixed-cut-line-fine-br.svg"); }
	.ww-frame-shape-lozenge.ww-frame-style-line { --ww-cut-tl: url("../frames/lozenge-cut-line-tl.svg"); --ww-cut-tr: url("../frames/lozenge-cut-line-tr.svg"); --ww-cut-bl: url("../frames/lozenge-cut-line-bl.svg"); --ww-cut-br: url("../frames/lozenge-cut-line-br.svg"); }
	.ww-frame-shape-lozenge.ww-frame-style-line.ww-frame-weight-fine { --ww-cut-tl: url("../frames/lozenge-cut-line-fine-tl.svg"); --ww-cut-tr: url("../frames/lozenge-cut-line-fine-tr.svg"); --ww-cut-bl: url("../frames/lozenge-cut-line-fine-bl.svg"); --ww-cut-br: url("../frames/lozenge-cut-line-fine-br.svg"); }
	.ww-frame-shape-cartouche.ww-frame-style-line { --ww-cut-tl: url("../frames/cartouche-cut-line-tl.svg"); --ww-cut-tr: url("../frames/cartouche-cut-line-tr.svg"); --ww-cut-bl: url("../frames/cartouche-cut-line-bl.svg"); --ww-cut-br: url("../frames/cartouche-cut-line-br.svg"); }
	.ww-frame-shape-cartouche.ww-frame-style-line.ww-frame-weight-fine { --ww-cut-tl: url("../frames/cartouche-cut-line-fine-tl.svg"); --ww-cut-tr: url("../frames/cartouche-cut-line-fine-tr.svg"); --ww-cut-bl: url("../frames/cartouche-cut-line-fine-bl.svg"); --ww-cut-br: url("../frames/cartouche-cut-line-fine-br.svg"); }
	.ww-frame-shape-shoulder.ww-frame-style-line { --ww-cut-tl: url("../frames/shoulder-cut-line-tl.svg"); --ww-cut-tr: url("../frames/shoulder-cut-line-tr.svg"); --ww-cut-bl: url("../frames/shoulder-cut-line-bl.svg"); --ww-cut-br: url("../frames/shoulder-cut-line-br.svg"); }
	.ww-frame-shape-shoulder.ww-frame-style-line.ww-frame-weight-fine { --ww-cut-tl: url("../frames/shoulder-cut-line-fine-tl.svg"); --ww-cut-tr: url("../frames/shoulder-cut-line-fine-tr.svg"); --ww-cut-bl: url("../frames/shoulder-cut-line-fine-bl.svg"); --ww-cut-br: url("../frames/shoulder-cut-line-fine-br.svg"); }
	.ww-frame-shape-crown.ww-frame-style-line { --ww-cut-tl: url("../frames/crown-cut-line-tl.svg"); --ww-cut-tr: url("../frames/crown-cut-line-tr.svg"); --ww-cut-bl: url("../frames/crown-cut-line-bl.svg"); --ww-cut-br: url("../frames/crown-cut-line-br.svg"); }
	.ww-frame-shape-crown.ww-frame-style-line.ww-frame-weight-fine { --ww-cut-tl: url("../frames/crown-cut-line-fine-tl.svg"); --ww-cut-tr: url("../frames/crown-cut-line-fine-tr.svg"); --ww-cut-bl: url("../frames/crown-cut-line-fine-bl.svg"); --ww-cut-br: url("../frames/crown-cut-line-fine-br.svg"); }
	.ww-frame-shape-crownstep.ww-frame-style-line { --ww-cut-tl: url("../frames/crownstep-cut-line-tl.svg"); --ww-cut-tr: url("../frames/crownstep-cut-line-tr.svg"); --ww-cut-bl: url("../frames/crownstep-cut-line-bl.svg"); --ww-cut-br: url("../frames/crownstep-cut-line-br.svg"); }
	.ww-frame-shape-crownstep.ww-frame-style-line.ww-frame-weight-fine { --ww-cut-tl: url("../frames/crownstep-cut-line-fine-tl.svg"); --ww-cut-tr: url("../frames/crownstep-cut-line-fine-tr.svg"); --ww-cut-bl: url("../frames/crownstep-cut-line-fine-bl.svg"); --ww-cut-br: url("../frames/crownstep-cut-line-fine-br.svg"); }
}

/* Custom Colours: the hairline rules and their mask, per shape. */
@supports (-webkit-mask-box-image-source: none) {
	.ww-frame-shape-notch.ww-frame-tone-custom:not(.ww-frame-style-line)::after { border-image-source: url("../frames/notch-core.svg"); -webkit-mask-box-image-source: url("../frames/notch-knock.svg"); }
	.ww-frame-shape-pearl.ww-frame-tone-custom:not(.ww-frame-style-line)::after { border-image-source: url("../frames/pearl-core.svg"); -webkit-mask-box-image-source: url("../frames/pearl-knock.svg"); }
	.ww-frame-shape-deco.ww-frame-tone-custom:not(.ww-frame-style-line)::after { border-image-source: url("../frames/deco-core.svg"); -webkit-mask-box-image-source: url("../frames/deco-knock.svg"); }
	.ww-frame-shape-chamfer.ww-frame-tone-custom:not(.ww-frame-style-line)::after { border-image-source: url("../frames/chamfer-core.svg"); -webkit-mask-box-image-source: url("../frames/chamfer-knock.svg"); }
	.ww-frame-shape-rounded.ww-frame-tone-custom:not(.ww-frame-style-line)::after { border-image-source: url("../frames/rounded-core.svg"); -webkit-mask-box-image-source: url("../frames/rounded-knock.svg"); }
	.ww-frame-shape-mirror.ww-frame-tone-custom:not(.ww-frame-style-line)::after { border-image-source: url("../frames/mirror-core.svg"); -webkit-mask-box-image-source: url("../frames/mirror-knock.svg"); }
	.ww-frame-shape-mixed.ww-frame-tone-custom:not(.ww-frame-style-line)::after { border-image-source: url("../frames/mixed-core.svg"); -webkit-mask-box-image-source: url("../frames/mixed-knock.svg"); }
	.ww-frame-shape-lozenge.ww-frame-tone-custom:not(.ww-frame-style-line)::after { border-image-source: url("../frames/lozenge-core.svg"); -webkit-mask-box-image-source: url("../frames/lozenge-knock.svg"); }
	.ww-frame-shape-cartouche.ww-frame-tone-custom:not(.ww-frame-style-line)::after { border-image-source: url("../frames/cartouche-core.svg"); -webkit-mask-box-image-source: url("../frames/cartouche-knock.svg"); }
	.ww-frame-shape-shoulder.ww-frame-tone-custom:not(.ww-frame-style-line)::after { border-image-source: url("../frames/shoulder-core.svg"); -webkit-mask-box-image-source: url("../frames/shoulder-knock.svg"); }
	.ww-frame-shape-crown.ww-frame-tone-custom:not(.ww-frame-style-line)::after { border-image-source: url("../frames/crown-core.svg"); -webkit-mask-box-image-source: url("../frames/crown-knock.svg"); }
	.ww-frame-shape-crownstep.ww-frame-tone-custom:not(.ww-frame-style-line)::after { border-image-source: url("../frames/crownstep-core.svg"); -webkit-mask-box-image-source: url("../frames/crownstep-knock.svg"); }
}