/* Struxure material words — production subset of /lab/materials (v1: salmon).
   <span class="mword material-salmon" data-text="stay human.">stay human.</span> */
.mword{--lx:30%;--ly:14%;--wake:1;position:relative;display:inline-block;isolation:isolate;
  color:transparent;-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text;background-repeat:no-repeat;
  filter:drop-shadow(0 -1px 0 rgba(255,236,224,.3)) drop-shadow(0 1px 0 var(--side-1)) drop-shadow(0 1px 0 var(--side-2))
         drop-shadow(0 2px 2px rgba(0,0,0,.42)) drop-shadow(0 8px 10px rgba(0,0,0,.3)) drop-shadow(0 22px 30px rgba(0,0,0,.22))}
.mword::before{content:attr(data-text);position:absolute;inset:0;pointer-events:none;-webkit-text-fill-color:transparent;-webkit-text-stroke:1px var(--edge-c)}
.mword::after{content:attr(data-text);position:absolute;inset:0;pointer-events:none;-webkit-text-fill-color:transparent;
  -webkit-background-clip:text;background-clip:text;mix-blend-mode:screen;background-repeat:no-repeat;background-size:260% 100%;background-position:175% 0;
  background-image:linear-gradient(104deg,transparent 30%,rgba(255,240,230,0) 40%,rgba(255,236,222,.5) 48%,rgba(255,255,255,.22) 52%,transparent 62%)}
.material-salmon{--side-1:#9c4f3c;--side-2:#6b3326;--edge-c:rgba(96,40,26,.5);
  background-image:
    radial-gradient(48% 120% at var(--lx) var(--ly),rgba(255,246,238,.72),transparent 70%),
    radial-gradient(70% 50% at 50% 100%,rgba(120,170,128,.32),transparent 70%),
    linear-gradient(180deg,transparent 56%,rgba(120,46,30,.3) 100%),
    url(/assets/tex/ivory.webp),
    linear-gradient(180deg,#ffeadf 0%,#f9bfa8 32%,#ef9a80 58%,#e17f67 76%,#ffddcd 100%);
  background-size:100% 100%,100% 100%,100% 100%,520px 260px,100% 100%;
  background-blend-mode:soft-light,soft-light,multiply,multiply,normal}
@keyframes mword-spec{0%{background-position:175% 0}100%{background-position:-60% 0}}
.mword.is-lit::after{animation:mword-spec 4.2s cubic-bezier(.25,.6,.3,1) .6s 1 both}
@media (prefers-reduced-motion:reduce){.mword::after{animation:none!important}}
@media print{.mword{background:none;-webkit-text-fill-color:#111;color:#111;filter:none}.mword::before,.mword::after{display:none}}