/* Three-colour reading wave. Gradient is clipped INSIDE intact Persian glyphs.
 * Text stays sharp, word shaping and native RTL layout remain browser-owned. */
@property --rvk-wave-energy { syntax:'<percentage>'; inherits:true; initial-value:0%; }
.rvk-wave-live { --rvk-wave-energy:0%;transition:--rvk-wave-energy 260ms ease-out; }
.rvk-wave-word {display:inline;unicode-bidi:isolate;}
/* Uses RIGHT-to-LEFT progression for the Persian reading sequence, including
   embedded Latin words (their glyph direction remains correctly LTR). */
.rvk-wave-live .rvk-wave-word,
.rvk-about-motion.rvk-about-live .rvk-wave-live .rvk-about-wave-word {
 color:transparent;-webkit-text-fill-color:transparent;
 -webkit-background-clip:text;background-clip:text;
 background-image:linear-gradient(to left,
   var(--rvk-wave-final,#f7f5ef) 0%,
   var(--rvk-wave-final,#f7f5ef) var(--rvk-wave-past-a,0%),
   color-mix(in srgb,var(--rvk-wave-active,#ffc32e) var(--rvk-wave-energy,0%),var(--rvk-wave-final,#f7f5ef)) var(--rvk-wave-past-b,0%),
   color-mix(in srgb,var(--rvk-wave-active,#ffc32e) var(--rvk-wave-energy,0%),var(--rvk-wave-muted,#999993)) var(--rvk-wave-cursor-a,0%),
   var(--rvk-wave-muted,#999993) var(--rvk-wave-cursor-b,0%),
   var(--rvk-wave-muted,#999993) 100%);
}
/* At zero progress, no HTML fragment is allowed to inherit an old inline
   highlight; the server-rendered first frame is muted before JS hydration. */
.rvk-about-motion.rvk-about-ready:not(.rvk-about-live) .rvk-about-body {
 color:var(--rvk-wave-muted,#999993);
 -webkit-text-fill-color:var(--rvk-wave-muted,#999993);
}
@media(prefers-reduced-motion:reduce){
 /* Shared text-wave users still honour reduced motion. The homepage About
    mobile scroll scene is an explicit opt-in exception. */
 .rvk-wave-live .rvk-wave-word:not(.rvk-about-wave-word),
 .rvk-about-motion.rvk-about-live:not(.rvk-about-mobile-scroll-enabled) .rvk-about-wave-word{
  background:none!important;color:var(--rvk-wave-final,#f7f5ef)!important;
  -webkit-text-fill-color:currentColor!important;
 }
 .rvk-about-motion.rvk-about-ready:not(.rvk-about-live) .rvk-about-body{
  color:var(--rvk-wave-final,#f7f5ef);-webkit-text-fill-color:currentColor;
 }
}