@layer components{html:not([data-motif=none])[data-motif] body:before{content:"";z-index:40;pointer-events:none;background-color:var(--tpl-motif-color);opacity:var(--tpl-motif-opacity);-webkit-mask-image:var(--tpl-motif-mask);-webkit-mask-image:var(--tpl-motif-mask);mask-image:var(--tpl-motif-mask);-webkit-mask-size:var(--tpl-motif-size,auto);-webkit-mask-size:var(--tpl-motif-size,auto);mask-size:var(--tpl-motif-size,auto);position:fixed;inset:0}html[data-motif-strength=marked]{--tpl-motif-opacity:.12}html[data-motif=grain]{--tpl-motif-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 0  0 0 0 0 0  0 0 0 0 0  0 0 0 1.6 -0.3'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");--tpl-motif-size:160px}html[data-motif=paper]{--tpl-motif-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='320' height='320'%3E%3Cfilter id='f'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.012 0.35' numOctaves='3' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 0  0 0 0 0 0  0 0 0 0 0  0 0 0 2.2 -0.9'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23f)'/%3E%3C/svg%3E"), radial-gradient(ellipse at center, transparent 55%, #000 130%);--tpl-motif-size:320px, 100% 100%}html[data-motif=dots]{--tpl-motif-mask:radial-gradient(circle, #000 1.2px, transparent 1.6px);--tpl-motif-size:18px 18px}html[data-motif=grid]{--tpl-motif-mask:linear-gradient(#000 1px, transparent 1px), linear-gradient(90deg, #000 1px, transparent 1px);--tpl-motif-size:32px 32px}html[data-motif=ndop]{--tpl-motif-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='60' height='60'%3E%3Cg fill='none' stroke='%23000'%3E%3Cpath d='M30 0 L60 30 L30 60 L0 30 Z'/%3E%3Cpath stroke-width='0.75' d='M30 9 L51 30 L30 51 L9 30 Z'/%3E%3C/g%3E%3Ccircle cx='30' cy='30' r='4.8'/%3E%3Cpath opacity='0.5' d='M0 0h7.2L0 7.2z M60 0h-7.2L60 7.2z M0 60h7.2L0 52.8z M60 60h-7.2L60 52.8z'/%3E%3C/svg%3E");--tpl-motif-size:110px 110px}html[data-motif=stripes]{--tpl-motif-mask:repeating-linear-gradient(45deg, #000 0 2px, transparent 2px 14px);--tpl-motif-size:auto}html[data-motif=halftone]{--tpl-motif-mask:radial-gradient(circle, #000 1.6px, transparent 2px), radial-gradient(circle, #000 1.6px, transparent 2px);--tpl-motif-size:10px 10px}html[data-motif=halftone] body:before{-webkit-mask-position:0 0,5px 5px;mask-position:0 0,5px 5px}}