@property --px{syntax:"<number>";inherits:true;initial-value:50}@property --py{syntax:"<number>";inherits:true;initial-value:50}@property --holo-drift-x{syntax:"<number>";inherits:true;initial-value:0}@property --holo-drift-y{syntax:"<number>";inherits:true;initial-value:0}@property --holo-hue{syntax:"<angle>";inherits:true;initial-value:0deg}.card-shine,.card-glare{background-blend-mode:normal;mix-blend-mode:screen;filter:none;opacity:0;background:0 0;transition:opacity .18s;-webkit-mask-image:none;mask-image:none}.material-paper .card-shine,.material-paper .card-glare{display:none}.material-foil .card-shine{border-radius:inherit;background-size:180% 180%;background-position:var(--mx) var(--my);padding:3px;display:block;inset:2px;-webkit-mask-image:linear-gradient(#000 0 0),linear-gradient(#000 0 0);mask-image:linear-gradient(#000 0 0),linear-gradient(#000 0 0);-webkit-mask-position:0 0,0 0;mask-position:0 0,0 0;-webkit-mask-size:auto,auto;mask-size:auto,auto;-webkit-mask-repeat:repeat,repeat;mask-repeat:repeat,repeat;-webkit-mask-clip:content-box,border-box;mask-clip:content-box,border-box;-webkit-mask-origin:content-box,border-box;mask-origin:content-box,border-box;-webkit-mask-composite:xor;mask-composite:exclude;-webkit-mask-source-type:auto,auto;mask-mode:match-source,match-source}.card-shine:before,.card-shine:after{content:none}.material-foil .card-shine{background-image:linear-gradient(calc(125deg + (var(--px,50) - 50) * .65deg), #435367 0%, #c4d1df 23%, #f8fcff 43%, #889aaf 60%, #d5e1eb 78%, #435367 100%);opacity:calc(.28 + var(--active) * .3)}.material-holo .card-shine{border-radius:inherit;background-image:radial-gradient(ellipse 95% 70% at calc(5% + var(--px) * 0.7% + var(--holo-drift-x) * 0.6%) calc(5% + var(--py) * 0.55% + var(--holo-drift-y) * 0.6%), #89cfe4a0 0%, #89cfe43d 35%, #89cfe400 76%), radial-gradient(ellipse 90% 75% at calc(100% - var(--px) * 0.6% - var(--holo-drift-x) * 0.5%) calc(100% - var(--py) * 0.65% - var(--holo-drift-y) * 0.5%), #d0a0db85 0%, #d0a0db26 40%, #d0a0db00 78%), linear-gradient(calc(115deg + (var(--px) - 50) * .5deg + var(--holo-drift-x) * .9deg), #9bcedb50 0%, #d7c29b48 32%, #a0d3b448 66%, #b2acd450 100%);filter:saturate(1.15) hue-rotate(var(--holo-hue));opacity:calc(.27 + var(--active) * .08);background-position:50%;background-size:100% 100%;padding:0;display:block;inset:0;-webkit-mask:none;mask:none}.material-foil .card-glare{background-size:220% 220%;background-position:var(--mx) var(--my);opacity:calc(.08 + var(--active) * .27);-webkit-mask-composite:xor;-webkit-mask-source-type:auto,auto;background-image:linear-gradient(calc(110deg + var(--py,50) * .6deg), transparent 14%, #9bb1c670 36%, #f2faff 49%, #b4c5d780 58%, transparent 79%);border-radius:3px;padding:1px;display:block;inset:17.2619% 5% 19.6429%;-webkit-mask-image:linear-gradient(#000 0 0),linear-gradient(#000 0 0);mask-image:linear-gradient(#000 0 0),linear-gradient(#000 0 0);-webkit-mask-position:0 0,0 0;mask-position:0 0,0 0;-webkit-mask-size:auto,auto;mask-size:auto,auto;-webkit-mask-repeat:repeat,repeat;mask-repeat:repeat,repeat;-webkit-mask-clip:content-box,border-box;mask-clip:content-box,border-box;-webkit-mask-origin:content-box,border-box;mask-origin:content-box,border-box;-webkit-mask-composite:xor;mask-composite:exclude;-webkit-mask-source-type:auto,auto;mask-mode:match-source,match-source}.material-holo .card-glare{border-radius:inherit;background-image:radial-gradient(ellipse 65% 48% at calc(var(--px) * 1% + var(--holo-drift-x) * 0.4%) calc(var(--py) * 1% + var(--holo-drift-y) * 0.4%), #edf6ff52 0%, #e2edff14 38%, #e2edff00 76%);opacity:calc(.025 + var(--active) * .14);background-position:50%;background-size:100% 100%;padding:0;display:block;inset:0;-webkit-mask:none;mask:none}.material-holo{transition:--px .16s ease-out,--py .16s ease-out;animation:14s ease-in-out infinite holo-surface-drift}@keyframes holo-surface-drift{0%,to{--holo-drift-x:-24;--holo-drift-y:-18;--holo-hue:-20deg}33%{--holo-drift-x:28;--holo-drift-y:-6;--holo-hue:18deg}66%{--holo-drift-x:-4;--holo-drift-y:26;--holo-hue:42deg}}.material-holo .card-scene{z-index:3}@media (prefers-reduced-motion:reduce){.material-holo,.card-shine,.card-glare{transition:none}.material-holo{animation:none}}