@property --foil-x{syntax:"<number>";inherits:true;initial-value:.28}@property --foil-y{syntax:"<number>";inherits:true;initial-value:.5}.foil,.foil-tokens{--foil-deep:#9d8035;--foil-mid:var(--gold,#c9a84c);--foil-hi:var(--parchment,#f0e6c8);--foil-glint-a:var(--faience,#4e9e9a);--foil-glint-b:var(--lapis,#2e5a94);--foil-solid:var(--gold-bright,#e4c56a);--foil-tint-a:color-mix(in oklab, var(--foil-glint-a) 50%, var(--foil-hi));--foil-tint-b:color-mix(in oklab, var(--foil-glint-b) 50%, var(--foil-hi));--foil-peak:color-mix(in oklab, var(--foil-hi) 60%, #fff);--foil-low:color-mix(in oklab, var(--foil-mid) 70%, var(--foil-hi))}.foil{--foil-rest-x:.28;--foil-rest-y:.5;--foil-x:var(--foil-rest-x);--foil-y:var(--foil-rest-y);white-space:nowrap;color:var(--foil-solid);transition:--foil-x var(--t-slow) var(--ease), --foil-y var(--t-slow) var(--ease);display:inline-block}.foil[data-foil=live]{transition-duration:var(--t-fast)}@supports ((-webkit-background-clip:text) or (background-clip:text)) and (color:color-mix(in oklab, red, blue)){.foil{--foil-angle:calc(100deg + (var(--foil-y) - .5) * 36deg);--foil-image:linear-gradient(var(--foil-angle), var(--foil-low) 0%, var(--foil-mid) 10%, var(--foil-hi) 20%, var(--foil-mid) 30%, var(--foil-low) 39%, var(--foil-mid) 45%, var(--foil-tint-a) 48.5%, var(--foil-peak) 50.5%, var(--foil-tint-b) 52.5%, var(--foil-mid) 56%, var(--foil-low) 63%, var(--foil-mid) 73%, var(--foil-hi) 82%, var(--foil-mid) 91%, var(--foil-low) 100%);background-image:var(--foil-image);background-size:300% 100%;background-position:calc(var(--foil-x) * 100%) 0;-webkit-text-fill-color:transparent;text-shadow:none;filter:drop-shadow(0 1px #0009);background-repeat:no-repeat;-webkit-background-clip:text;background-clip:text;font-weight:700}.foil:has(.roll){background-image:none}.foil .roll__strip,.foil .roll__glyph{background-image:var(--foil-image);background-size:calc(3 * var(--roll-total-w)) var(--roll-h);background-position:calc(var(--roll-total-w) * -2 * var(--foil-x) - var(--roll-cell-x)) 0;-webkit-text-fill-color:transparent;background-repeat:repeat-y;-webkit-background-clip:text;background-clip:text}}@media (prefers-reduced-motion:reduce){.foil{transition:none}}@media (forced-colors:active){.foil,.foil .roll__strip,.foil .roll__glyph{-webkit-text-fill-color:currentColor;filter:none;background-image:none}}
