@layer components{.ns-hold{--ns-hold-travel:var(--travel,3px);--ns-hold-rise:var(--ns-hold-travel);--ns-hold-face:var(--chrome,#fff);--ns-hold-wall:var(--skirt,#dadada);--ns-hold-line:var(--chrome-line,#00000026);--ns-hold-edge:var(--lightningcss-light,var(--ns-hold-line))var(--lightningcss-dark,transparent);--ns-hold-cast:var(--cast,#0000001a);--ns-hold-ink:var(--text-heading,#111);--ns-hold-tone:var(--error,#cf222e);--ns-hold-mix:var(--chrome-mix,#fff);--ns-hold-fill:linear-gradient(180deg, color-mix(in srgb, var(--ns-hold-tone) 8%, var(--ns-hold-mix)) 0%, color-mix(in srgb, var(--ns-hold-tone) 20%, var(--ns-hold-mix)) 18%, color-mix(in srgb, var(--ns-hold-tone) 36%, var(--ns-hold-mix)) 50%, color-mix(in srgb, var(--ns-hold-tone) 40%, var(--ns-hold-mix)) 80%, color-mix(in srgb, var(--ns-hold-tone) 34%, var(--ns-hold-mix)) 100%);--ns-hold-fill-ink:var(--on-error,#111);--ns-hold-fill-line:var(--lightningcss-light,color-mix(in srgb, var(--ns-hold-tone) 58%, #fff))var(--lightningcss-dark,color-mix(in srgb, var(--ns-hold-tone) 50%, #000));--ns-hold-fill-wall:var(--lightningcss-light,color-mix(in srgb, var(--ns-hold-tone) 52%, #fff))var(--lightningcss-dark,color-mix(in srgb, var(--ns-hold-tone) 36%, #000));appearance:none;box-sizing:border-box;min-height:var(--control,2.25rem);padding:0 var(--space-5,1.25rem);border:1px solid var(--ns-hold-line);border-radius:var(--radius,.625rem);background:var(--ns-hold-face) padding-box;box-shadow:inset 0 1px 0 0 var(--highlight,#ffffffb3), 0 var(--ns-hold-rise) 0 0 var(--ns-hold-wall), 0 calc(var(--ns-hold-rise) + min(var(--ns-hold-rise), 1px)) 0 0 var(--ns-hold-edge), 0 calc(var(--ns-hold-rise) * 1.5 + 1px) calc(var(--ns-hold-rise) * 3 + 2px) calc(var(--ns-hold-rise) * -1) var(--ns-hold-cast);transform:translateY(calc(var(--ns-hold-travel) - var(--ns-hold-rise)));color:var(--ns-hold-ink);font:inherit;font-size:var(--type-sm,.875rem);font-weight:var(--weight-medium,500);line-height:var(--leading-tight,1.25);cursor:pointer;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;touch-action:manipulation;-webkit-tap-highlight-color:transparent;transition:transform var(--duration-spring,.4s) var(--ease-spring,ease-out), box-shadow var(--duration-spring,.4s) var(--ease-spring,ease-out), border-color var(--duration,.2s) var(--ease,ease-out);justify-content:center;align-items:center;margin:0;display:inline-flex;position:relative}@supports (color:lab(0% 0 0)){.ns-hold{--ns-hold-line:var(--chrome-line,lab(0% 0 0/.15));--ns-hold-cast:var(--cast,lab(0% 0 0/.1));box-shadow:inset 0 1px 0 0 var(--highlight,lab(100% 0 0/.7)), 0 var(--ns-hold-rise) 0 0 var(--ns-hold-wall), 0 calc(var(--ns-hold-rise) + min(var(--ns-hold-rise), 1px)) 0 0 var(--ns-hold-edge), 0 calc(var(--ns-hold-rise) * 1.5 + 1px) calc(var(--ns-hold-rise) * 3 + 2px) calc(var(--ns-hold-rise) * -1) var(--ns-hold-cast)}}.ns-hold[data-tone=key]{--ns-hold-fill:var(--key-face,#a2c7ff);--ns-hold-fill-ink:var(--on-key,#111);--ns-hold-fill-line:var(--key-edge,#6f9ce0);--ns-hold-fill-wall:var(--key-skirt,#7ba4e4);--ns-hold-tone:var(--led,#3a7bf0)}.ns-hold[data-tone=ink]{--ns-hold-fill:var(--ink,#111);--ns-hold-fill-ink:var(--on-ink,#fff);--ns-hold-fill-line:var(--ink,#111);--ns-hold-fill-wall:var(--lightningcss-light,#000)var(--lightningcss-dark,#b8b8b8);--ns-hold-tone:var(--ink,#111)}.ns-hold[data-state=holding]{--ns-hold-rise:0px;transition-duration:var(--duration-press,.1s);transition-timing-function:var(--ease,ease-out)}.ns-hold[data-state=done]{--ns-hold-wall:var(--ns-hold-fill-wall);border-color:var(--ns-hold-fill-line);transition:transform var(--duration-bounce,.64s) var(--ease-bounce,ease-out), box-shadow var(--duration-bounce,.64s) var(--ease-bounce,ease-out), border-color var(--duration,.2s) var(--ease,ease-out)}.ns-hold__label{align-items:center;gap:var(--space-2,.5rem);white-space:nowrap;display:inline-flex}.ns-hold__label>svg{flex:none;width:1em;height:1em}.ns-hold__fill{padding:inherit;border:1px solid var(--ns-hold-fill-line);border-radius:inherit;background:var(--ns-hold-fill) padding-box;color:var(--ns-hold-fill-ink);clip-path:inset(0 100% 0 0);pointer-events:none;transition:clip-path calc(var(--duration-spring,.4s) * .75) var(--ease,ease-out);justify-content:center;align-items:center;display:flex;position:absolute;inset:-1px}.ns-hold:is(:lang(ae),:lang(ar),:lang(arc),:lang(bcc),:lang(bqi),:lang(ckb),:lang(dv),:lang(fa),:lang(glk),:lang(he),:lang(ku),:lang(mzn),:lang(nqo),:lang(pnb),:lang(ps),:lang(sd),:lang(ug),:lang(ur),:lang(yi)) .ns-hold__fill{clip-path:inset(0 0 0 100%)}.ns-hold[data-state=holding] .ns-hold__fill{clip-path:inset(0);transition:clip-path var(--ns-hold-duration,1.5s) linear}.ns-hold[data-state=done] .ns-hold__fill{clip-path:inset(0);transition:none}.ns-hold:after{content:"";border-radius:inherit;pointer-events:none;position:absolute;inset:-1px}.ns-hold[data-state=done]:after{animation:ns-hold-ring var(--duration-bounce,.64s) var(--ease,ease-out) both}@keyframes ns-hold-ring{0%{box-shadow:0 0 0 0 color-mix(in srgb, var(--ns-hold-tone) 40%, transparent)}to{box-shadow:0 0 0 10px color-mix(in srgb, var(--ns-hold-tone) 0%, transparent)}}.ns-hold:focus-visible{outline:none}.ns-hold:focus-visible:before{content:"";inset:-1px;border-radius:inherit;outline:2px solid var(--focus,currentColor);outline-offset:2px;pointer-events:none;transition:inset-block-end var(--duration-spring,.4s) var(--ease-spring,ease-out);position:absolute;inset-block-end:calc(-1px - var(--ns-hold-rise) - min(var(--ns-hold-rise), 1px))}.ns-hold:disabled{--ns-hold-cast:transparent;cursor:not-allowed;opacity:.5}@media (hover:hover){.ns-hold:hover:not(:disabled){background:var(--chrome-hover,var(--ns-hold-face)) padding-box}}@media (forced-colors:active){.ns-hold{border-color:buttontext}.ns-hold__fill{forced-color-adjust:none;color:highlighttext;background:highlight}}}