/* FUDISE glass icons (partials/glass_icon): a colored copy of the shape peeks
   out from under frosted glass, like the app's tab bar and services. */
.fx-glass {
    position: relative;
    display: inline-block;
    flex: none;
    width: var(--fx-size);
    height: var(--fx-size);
}
.fx-glass__in {
    position: absolute;
    left: 0;
    top: 0;
    width: 28px;
    height: 28px;
    transform-origin: 0 0;
    transform: scale(var(--fx-k));
}
.fx-glass__in > span,
.fx-glass__detail i {
    position: absolute;
    inset: 0;
}
.fx-glass__bg {
    background: radial-gradient(circle, var(--fx-accent) 0%, color-mix(in srgb, var(--fx-accent) 55%, #fff) 100%);
    transform-origin: 100% 100%;
    transform: translate(4px, -4px) rotate(15deg);
    transition: transform .45s cubic-bezier(.38, -.12, .15, 1.65);
}
.fx-glass__glass {
    background: rgba(255, 255, 255, .3);
    -webkit-backdrop-filter: blur(2px);
    backdrop-filter: blur(2px);
}
.fx-glass__tint {
    background: color-mix(in srgb, var(--fx-accent) 50%, transparent);
    filter: blur(4px);
}
.fx-glass__detail {
    filter: drop-shadow(1.5px 1.5px 1.5px rgba(40, 40, 40, .3));
}
.fx-glass__detail i {
    background: linear-gradient(to right, rgba(255, 255, 255, .25) 30%, #fff 70%);
}
@media (prefers-reduced-motion: reduce) {
    .fx-glass__bg { transition: none; }
}