/* Portable source shared with Zerossin by scripts/sync-home-icons.ps1.
   Set --icon-tint to the artwork's edge color. No blur or animated filters. */
.icon-glass {
  --glass-light: color-mix(in srgb, var(--icon-tint, #8d92a2) 45%, white);
  --glass-shade: color-mix(in srgb, var(--icon-tint, #8d92a2) 65%, black);
  position: relative;
  isolation: isolate;
}
.icon-glass::before,
.icon-glass::after {
  content: '';
  position: absolute;
  inset: 0;
  border-radius: inherit;
  pointer-events: none;
}
.icon-glass::before {
  z-index: 1;
  background: linear-gradient(145deg, color-mix(in srgb, var(--glass-light) 8%, transparent), transparent 38%, color-mix(in srgb, var(--glass-shade) 7%, transparent));
  box-shadow: inset 0 2px 3px color-mix(in srgb, var(--glass-light) 22%, transparent), inset 0 -2px 3px color-mix(in srgb, var(--glass-shade) 20%, transparent);
}
.icon-glass::after {
  z-index: 2;
  padding: 1px;
  background: linear-gradient(140deg, color-mix(in srgb, var(--glass-light) 72%, transparent), color-mix(in srgb, var(--glass-light) 12%, transparent) 30%, color-mix(in srgb, var(--glass-shade) 32%, transparent) 65%, color-mix(in srgb, var(--glass-light) 48%, transparent));
  -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
  -webkit-mask-composite: xor;
  mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
  mask-composite: exclude;
}
