.pi-frame{isolation:isolate;background:color-mix(in srgb, currentColor 6%, transparent);display:block;position:relative;overflow:hidden}.pi-frame__placeholder{object-fit:cover;filter:blur(18px)saturate(1.1);width:100%;height:100%;position:absolute;inset:0;transform:scale(1.15)}.pi-frame__shimmer{background:linear-gradient(100deg, color-mix(in srgb, currentColor 5%, transparent) 30%, color-mix(in srgb, currentColor 12%, transparent) 50%, color-mix(in srgb, currentColor 5%, transparent) 70%);background-size:220% 100%;position:absolute;inset:0}.pi-pulsing{animation:1.6s ease-in-out infinite pi-sweep}.pi-frame__image{opacity:0;width:100%;height:100%;transition:opacity .26s ease-out;display:block;position:relative}.pi-frame__image--shown{opacity:1}.pi-frame__badge{pointer-events:none;place-items:center;display:grid;position:absolute;inset:0}.pi-frame__badge--plain{pointer-events:auto}.pi-ring{color:#fff;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);background:#00000073;border-radius:999px;place-items:center;display:grid}.pi-ring__svg{display:block}.pi-ring__arc{transform-origin:50%;transition:stroke-dashoffset .18s linear;transform:rotate(-90deg)}.pi-ring--spinning .pi-ring__svg{animation:.9s linear infinite pi-spin}.pi-frame__retry{color:#fff;cursor:pointer;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);background:#00000073;border:0;border-radius:999px;place-items:center;width:44px;height:44px;font-size:20px;line-height:1;display:grid}@keyframes pi-spin{to{transform:rotate(360deg)}}@keyframes pi-sweep{0%{background-position:160% 0}to{background-position:-60% 0}}@media (prefers-reduced-motion:reduce){.pi-pulsing,.pi-ring--spinning .pi-ring__svg{animation:none}.pi-frame__image{transition:none}}