/* Explicit, native-size tiles keep grain fine on every viewport. */
:root,.texture-sample{--grain-opacity:.055;--detail-opacity:0;--detail-mask:none;--detail-size:512px 512px}
:root[data-theme="dark"],.texture-sample[data-tone="dark"]{--grain-opacity:.085}
:root[data-background="scan"],.texture-sample[data-background="scan"]{--grain-opacity:.025;--detail-opacity:.028;--detail-mask:repeating-linear-gradient(0deg,transparent 0px,transparent 2.5px,#000 2.5px,#000 3px);--detail-size:auto}
:root[data-theme="dark"][data-background="scan"],.texture-sample[data-tone="dark"][data-background="scan"]{--grain-opacity:.04;--detail-opacity:.045}
:root[data-background="fiber"],.texture-sample[data-background="fiber"]{--grain-opacity:.035;--detail-opacity:.20;--detail-mask:url('assets/paper-fibers.svg')}
:root[data-theme="dark"][data-background="fiber"],.texture-sample[data-tone="dark"][data-background="fiber"]{--grain-opacity:.06;--detail-opacity:.24}
:root[data-background="clean"],.texture-sample[data-background="clean"]{--grain-opacity:0;--detail-opacity:0}
body{isolation:isolate;min-height:100vh}.page{position:relative;z-index:1}
body:before,body:after,.texture-sample:before,.texture-sample:after{content:'';position:fixed;inset:0;pointer-events:none;z-index:0}
body:before,.texture-sample:before{background-image:url('assets/paper-grain.svg');background-size:256px 256px;background-repeat:repeat;opacity:var(--grain-opacity)}
body:after,.texture-sample:after{background-color:var(--ink);-webkit-mask-image:var(--detail-mask);mask-image:var(--detail-mask);-webkit-mask-size:var(--detail-size);mask-size:var(--detail-size);-webkit-mask-repeat:repeat;mask-repeat:repeat;opacity:var(--detail-opacity)}
.texture-sample{position:relative;isolation:isolate;overflow:hidden;background:var(--paper);color:var(--ink)}.texture-sample:before,.texture-sample:after{position:absolute}.texture-sample-content{position:relative;z-index:1}
.texture-sample[data-tone="light"]{--paper:#ece8df;--ink:#171816;--red:#e63324}.texture-sample[data-tone="dark"]{--paper:#1b1c19;--ink:#ece8df;--red:#ff634f}