.hold-button{--hb-p:0;--hb-hold:1.8s;--hb-release:.18s;isolation:isolate;border:1px solid color-mix(in oklab, var(--destructive) 58%, transparent);background:color-mix(in oklab, var(--destructive) 12%, var(--background));min-width:12rem;height:3rem;color:var(--destructive);cursor:pointer;-webkit-user-select:none;user-select:none;touch-action:manipulation;border-radius:1rem;place-items:center;font-family:inherit;font-size:.875rem;font-weight:600;line-height:1;transition:background-color .15s ease-out,border-color .15s ease-out,color .15s ease-out;display:inline-grid;position:relative;overflow:hidden}.hold-button[data-phase=holding]{border-color:var(--destructive)}.hold-button:focus-visible{outline:2px solid var(--ring);outline-offset:3px}.hold-button:disabled{cursor:default;opacity:.5;pointer-events:none}.hold-button__label{z-index:2;place-items:center;display:grid;position:relative}.hold-button__label>span{white-space:nowrap;grid-area:1/1;align-items:center;gap:.5rem;transition:opacity .18s;display:inline-flex}.hold-button__icon{flex:none;display:inline-flex}.hold-button__icon>svg{width:1rem;height:1rem}.hold-button__done,.hold-button[data-phase=done] .hold-button__idle{opacity:0}.hold-button[data-phase=done] .hold-button__done{opacity:1}.hold-button__fill{z-index:1;background:var(--destructive);color:var(--destructive-foreground);clip-path:inset(0 calc((1 - var(--hb-p)) * 100%) 0 0);place-items:center;display:grid;position:absolute;inset:0}.hold-button__label--fill{z-index:auto}.hold-button__sr{clip-path:inset(50%);white-space:nowrap;width:1px;height:1px;position:absolute;overflow:hidden}@media (prefers-reduced-motion:reduce){.hold-button{transform:none!important}.hold-button__fill{transition:opacity var(--hb-release) ease;clip-path:inset(0);opacity:0}.hold-button[data-phase=holding] .hold-button__fill,.hold-button[data-phase=done] .hold-button__fill{opacity:1;transition:opacity var(--hb-hold) linear}}