.halftone{--halftone-ink:#f5f5f4;width:100%;position:relative}.halftone canvas{aspect-ratio:1;width:100%;color:var(--halftone-ink);display:block}.halftone-cue{--cue-x:-50%;white-space:nowrap;transform:translate(var(--cue-x), calc(-100% - 4px));opacity:0;transition:opacity .42s var(--concept-ease,ease), transform .42s var(--concept-ease,ease);position:absolute}.halftone-cue[data-side=left]{--cue-x:calc(-100% + 18px)}.halftone-cue[data-side=right]{--cue-x:-18px}.halftone-cue[data-shown]{opacity:1;transform:translate(var(--cue-x), calc(-100% - 8px))}.halftone-replay{border:1px solid color-mix(in srgb, currentColor 30%, transparent);min-height:44px;color:inherit;font:500 13px/1 var(--body);cursor:pointer;background:0 0;border-radius:999px;margin:12px 0 0 auto;padding:0 16px;display:block}.halftone-replay[hidden]{display:none}@media (prefers-reduced-motion:reduce){.halftone-cue{transition:none}}