.img-gen-ph{position:relative;display:block;width:100%;height:100%;min-height:0;overflow:hidden;color:currentColor}.img-gen-ph__canvas{position:absolute;inset:0;border-radius:inherit;background:color-mix(in oklab,currentColor 4%,transparent);overflow:hidden}.img-gen-ph__dots{position:absolute;inset:0;background-image:radial-gradient(circle,color-mix(in oklab,currentColor 55%,transparent) .7px,transparent 1.3px);background-size:11px 11px;background-repeat:space;opacity:.22}.img-gen-ph__glow{position:absolute;inset:0;background-image:radial-gradient(circle,currentColor 1.1px,transparent 1.6px);background-size:11px 11px;background-repeat:space;-webkit-mask-image:radial-gradient(ellipse at center,#000 0%,transparent 60%),radial-gradient(ellipse at center,#000 0%,transparent 62%);mask-image:radial-gradient(ellipse at center,#000 0%,transparent 60%),radial-gradient(ellipse at center,#000 0%,transparent 62%);-webkit-mask-repeat:no-repeat,no-repeat;mask-repeat:no-repeat,no-repeat;-webkit-mask-size:72% 62%,52% 52%;mask-size:72% 62%,52% 52%;-webkit-mask-position:16% 20%,30% 32%;mask-position:16% 20%,30% 32%;animation:img-gen-ph-morph 4.2s cubic-bezier(.35,1.55,.65,1) infinite,img-gen-ph-breathe 1.9s cubic-bezier(.66,0,.34,1) infinite}@keyframes img-gen-ph-morph{0%{-webkit-mask-size:52% 46%,40% 40%;mask-size:52% 46%,40% 40%;-webkit-mask-position:16% 20%,30% 32%;mask-position:16% 20%,30% 32%}25%{-webkit-mask-size:46% 58%,44% 38%;mask-size:46% 58%,44% 38%;-webkit-mask-position:84% 16%,66% 30%;mask-position:84% 16%,66% 30%}50%{-webkit-mask-size:60% 44%,38% 46%;mask-size:60% 44%,38% 46%;-webkit-mask-position:82% 84%,62% 68%;mask-position:82% 84%,62% 68%}75%{-webkit-mask-size:48% 54%,46% 40%;mask-size:48% 54%,46% 40%;-webkit-mask-position:14% 82%,34% 66%;mask-position:14% 82%,34% 66%}to{-webkit-mask-size:52% 46%,40% 40%;mask-size:52% 46%,40% 40%;-webkit-mask-position:16% 20%,30% 32%;mask-position:16% 20%,30% 32%}}@keyframes img-gen-ph-breathe{0%,to{opacity:.55}50%{opacity:1}}.img-gen-ph__overlay{position:absolute;inset:0;z-index:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.25rem;padding:.5rem;pointer-events:none;text-align:center}.img-gen-ph__hud{display:flex;flex-direction:column;align-items:stretch;gap:6px;width:min(78%,9.5rem);padding:8px 10px 7px;border-radius:10px;background:color-mix(in oklab,canvas 72%,transparent);border:1px solid color-mix(in oklab,currentColor 10%,transparent);box-shadow:0 1px 2px color-mix(in oklab,#000 6%,transparent),0 4px 14px color-mix(in oklab,#000 5%,transparent);-webkit-backdrop-filter:blur(10px) saturate(1.15);backdrop-filter:blur(10px) saturate(1.15);color:currentColor}.img-gen-ph__hud-label{font-size:11px;font-weight:600;line-height:1.2;letter-spacing:-.01em;text-align:center;color:color-mix(in oklab,currentColor 88%,transparent)}.img-gen-ph__bar{position:relative;height:4px;width:100%;border-radius:999px;overflow:hidden;background:color-mix(in oklab,currentColor 12%,transparent)}.img-gen-ph__bar-fill{display:block;height:100%;border-radius:inherit;background:color-mix(in oklab,currentColor 78%,transparent);transition:width .28s cubic-bezier(.22,1,.36,1);min-width:0}.img-gen-ph__hud-pct{font-size:10px;font-weight:600;line-height:1;letter-spacing:.02em;text-align:center;font-variant-numeric:tabular-nums;color:color-mix(in oklab,currentColor 62%,transparent)}@media(prefers-reduced-motion:reduce){.img-gen-ph__glow{animation:none;opacity:.7;-webkit-mask-size:55% 50%,42% 42%;mask-size:55% 50%,42% 42%;-webkit-mask-position:30% 30%,70% 70%;mask-position:30% 30%,70% 70%}.img-gen-ph__bar-fill{transition:none}}@supports not ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))){.img-gen-ph__hud{background:color-mix(in oklab,canvas 90%,currentColor 4%)}}