.hold-button{--hb-radius: 14px;--hb-bg: #27272a;--hb-fill: #5227ff;--hb-text: #f5f5f5;--hb-fill-text: #ffffff;--hb-hold: 2s;--hb-release: .2s;--hb-press: .97;--hb-wave: 6px;--hb-w: 0px;--hb-h: 0px;--hb-cycles: 2;--hb-p: 0;--hb-ease-out: cubic-bezier(.23, 1, .32, 1);--hb-shadow: inset 0 1px 0 rgba(255, 255, 255, .06);--hb-glow: inset 0 1px 0 rgba(255, 255, 255, .06), 0 10px 32px -6px color-mix(in srgb, var(--hb-fill) 70%, transparent);position:relative;display:inline-grid;place-items:center;isolation:isolate;margin:0;border:0;border-radius:var(--hb-radius);background:var(--hb-bg);color:var(--hb-text);font-family:inherit;font-weight:500;letter-spacing:.01em;line-height:1;box-shadow:var(--hb-shadow);cursor:pointer;outline:none;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none;-webkit-tap-highlight-color:transparent;touch-action:manipulation;transition:transform .16s var(--hb-ease-out),background-color .16s ease,box-shadow var(--hb-release) var(--hb-ease-out)}.hold-button--sm{height:36px;padding:0 16px;font-size:13px}.hold-button--md{height:44px;padding:0 22px;font-size:15px}.hold-button--lg{height:52px;padding:0 28px;font-size:17px}@media(hover:hover)and (pointer:fine){.hold-button:not(:disabled):hover{background:color-mix(in srgb,var(--hb-bg) 92%,#fff)}}.hold-button[data-phase=holding][data-input=pointer]{transform:scale(var(--hb-press))}.hold-button[data-glow=true][data-phase=holding],.hold-button[data-glow=true][data-phase=done]{box-shadow:var(--hb-glow)}.hold-button[data-glow=true][data-phase=holding]{transition:transform .16s var(--hb-ease-out),background-color .16s ease,box-shadow var(--hb-hold) linear}.hold-button:focus-visible{outline:2px solid var(--hb-fill);outline-offset:3px}.hold-button:disabled{opacity:.5;cursor:default;pointer-events:none}.hold-button__pulse{position:absolute;inset:0;z-index:0;border-radius:var(--hb-radius);pointer-events:none;opacity:0}.hold-button[data-glow=true][data-phase=done] .hold-button__pulse{animation:hb-pulse .6s var(--hb-ease-out) forwards}@keyframes hb-pulse{0%{opacity:1;box-shadow:0 0 color-mix(in srgb,var(--hb-fill) 55%,transparent)}to{opacity:0;box-shadow:0 0 0 14px color-mix(in srgb,var(--hb-fill) 0%,transparent)}}.hold-button__label{position:relative;z-index:2;display:grid;place-items:center}.hold-button__label>span{grid-area:1 / 1;display:inline-flex;align-items:center;gap:8px;white-space:nowrap;transition:opacity .2s ease,filter .2s ease}.hold-button__icon{display:inline-flex;flex:none}.hold-button__icon>svg{display:block}.hold-button__done,.hold-button[data-phase=done] .hold-button__idle{opacity:0;filter:blur(2px)}.hold-button[data-phase=done] .hold-button__done{opacity:1;filter:blur(0)}.hold-button__clip{position:absolute;inset:0;z-index:3;clip-path:inset(0 round var(--hb-radius));pointer-events:none}.hold-button__fill{position:absolute;inset:0;display:grid;place-items:center;background:var(--hb-fill);color:var(--hb-fill-text);clip-path:inset(0 calc((1 - var(--hb-p)) * (100% + .75 * var(--hb-wave)) - var(--hb-p) * .25 * var(--hb-wave)) 0 0)}.hold-button[data-direction=up] .hold-button__fill{clip-path:inset(calc((1 - var(--hb-p)) * (100% + .75 * var(--hb-wave)) - var(--hb-p) * .25 * var(--hb-wave)) 0 0 0)}.hold-button__crest{position:absolute;inset:0;display:grid;place-items:center;background:var(--hb-fill);color:var(--hb-fill-text);-webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='200' viewBox='0 0 20 200' preserveAspectRatio='none'%3E%3Cpath d='M0 0H10C18 8 18 25.3 10 33.3S2 58.7 10 66.7S18 92 10 100S2 125.3 10 133.3S18 158.7 10 166.7S2 192 10 200H0Z'/%3E%3C/svg%3E");mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='200' viewBox='0 0 20 200' preserveAspectRatio='none'%3E%3Cpath d='M0 0H10C18 8 18 25.3 10 33.3S2 58.7 10 66.7S18 92 10 100S2 125.3 10 133.3S18 158.7 10 166.7S2 192 10 200H0Z'/%3E%3C/svg%3E");-webkit-mask-repeat:repeat-y;mask-repeat:repeat-y;-webkit-mask-size:var(--hb-wave) calc(var(--hb-h) * 2);mask-size:var(--hb-wave) calc(var(--hb-h) * 2);-webkit-mask-position-x:calc(-1 * var(--hb-wave) + var(--hb-p) * (var(--hb-w) + var(--hb-wave)));mask-position-x:calc(-1 * var(--hb-wave) + var(--hb-p) * (var(--hb-w) + var(--hb-wave)));-webkit-mask-position-y:calc(-1 * var(--hb-p) * var(--hb-cycles) * var(--hb-h));mask-position-y:calc(-1 * var(--hb-p) * var(--hb-cycles) * var(--hb-h))}.hold-button[data-direction=up] .hold-button__crest{-webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='200' height='20' viewBox='0 0 200 20' preserveAspectRatio='none'%3E%3Cpath d='M0 20V10C12 2 38 2 50 10S88 18 100 10S138 2 150 10S188 18 200 10V20Z'/%3E%3C/svg%3E");mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='200' height='20' viewBox='0 0 200 20' preserveAspectRatio='none'%3E%3Cpath d='M0 20V10C12 2 38 2 50 10S88 18 100 10S138 2 150 10S188 18 200 10V20Z'/%3E%3C/svg%3E");-webkit-mask-repeat:repeat-x;mask-repeat:repeat-x;-webkit-mask-size:calc(var(--hb-w) * 2) var(--hb-wave);mask-size:calc(var(--hb-w) * 2) var(--hb-wave);-webkit-mask-position-x:calc(-1 * var(--hb-p) * var(--hb-cycles) * var(--hb-w));mask-position-x:calc(-1 * var(--hb-p) * var(--hb-cycles) * var(--hb-w));-webkit-mask-position-y:calc(var(--hb-h) - var(--hb-p) * (var(--hb-h) + var(--hb-wave)));mask-position-y:calc(var(--hb-h) - var(--hb-p) * (var(--hb-h) + var(--hb-wave)))}.hold-button__label--fill{z-index:auto}.hold-button__sr{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}@media(prefers-contrast:more){.hold-button{outline:1px solid var(--hb-text)}}@media(prefers-reduced-motion:reduce){.hold-button{transition:background-color .16s ease,box-shadow var(--hb-release) ease;transform:none!important}.hold-button__fill,.hold-button[data-direction=up] .hold-button__fill{clip-path:inset(0);opacity:0;transition:opacity var(--hb-release) ease}.hold-button__crest{display:none}.hold-button[data-phase=holding] .hold-button__fill,.hold-button[data-phase=done] .hold-button__fill{opacity:1;transition:opacity var(--hb-hold) linear}.hold-button__pulse{animation:none!important}.hold-button__label>span{transition:opacity .2s ease;filter:none!important}}