@layer components{.halftone-photo{aspect-ratio:1;box-sizing:border-box;border:2px dashed var(--color-cell-empty);border-radius:var(--radius-sm);background:var(--color-surface-sunken);width:100%;display:block;position:relative;overflow:hidden}.halftone-photo__image,.halftone-photo__print{width:100%;height:100%;position:absolute;inset:0}.halftone-photo__image{object-fit:cover;opacity:0;transition:opacity var(--duration-slow) var(--ease-out)}.halftone-photo__print{background:var(--color-surface);display:none}.halftone-photo:after{border:2px solid var(--color-ink);border-radius:inherit;content:"";opacity:0;transition:opacity calc(var(--duration-print)*.7*var(--halftone-photo-pace,1)) var(--ease-out);position:absolute;inset:-2px}.halftone-photo[data-state=printing]:after,.halftone-photo[data-state=shown]:after{opacity:1}.halftone-photo[data-state=printing] .halftone-photo__image{opacity:1;transition:none}.halftone-photo[data-state=printing] .halftone-photo__print{display:block}.halftone-photo[data-state=shown] .halftone-photo__image{opacity:1}}