.label-input{--label-input-ink:var(--brand-navigation-text);--label-input-accent:var(--brand-focus);--label-input-fill:color-mix(in srgb, var(--label-input-ink) 6%, var(--brand-surface));--label-input-border:color-mix(in srgb, var(--label-input-ink) 8%, var(--brand-surface));width:100%;min-width:0;font:inherit;padding-top:12px;display:grid;position:relative}.label-input[data-focus=true]{--label-input-fill:color-mix(in srgb, var(--label-input-ink) 10%, var(--brand-surface))}.label-input:has(input[aria-invalid=true]){--label-input-border:var(--destructive);--label-input-accent:var(--destructive)}.label-input-box{cursor:text;background:0 0;width:100%;height:52px;position:relative}.label-input-box:before{content:"";z-index:2;border:1px solid var(--label-input-border);border-radius:inherit;pointer-events:none;position:absolute;inset:.25px}.label-input[data-measured=true] .label-input-box:before{visibility:hidden}.label-input-ring{z-index:2;pointer-events:none;visibility:hidden;position:absolute;inset:0;overflow:visible}.label-input[data-measured=true] .label-input-ring{visibility:visible}.label-input-ring path{fill:none;stroke:var(--label-input-border);stroke-width:1px;stroke-linecap:butt;transition:stroke .22s,stroke-width .22s}.label-input[data-focus=true] .label-input-ring path{stroke:var(--label-input-accent);stroke-width:1.5px}.label-input-ring .label-input-gap{stroke-dasharray:1 2;stroke-dashoffset:0;transition:stroke .22s,stroke-width .22s,stroke-dashoffset .42s cubic-bezier(.22,1,.36,1)}.label-input:-webkit-any([data-up=true],:has(input:autofill),:has(input:-webkit-autofill)) .label-input-gap{stroke-dashoffset:-1px}.label-input:is([data-up=true],:has(input:autofill),:has(input:autofill)) .label-input-gap{stroke-dashoffset:-1px}.label-input .label-input-label{z-index:3;left:var(--label-input-x);letter-spacing:-.01em;white-space:pre;width:fit-content;color:var(--brand-muted);transform-origin:0;cursor:text;-webkit-user-select:none;user-select:none;pointer-events:none;font-size:16px;font-weight:500;line-height:1;transition:transform .42s cubic-bezier(.22,1,.36,1),color .22s;position:absolute;top:50%;transform:translateY(-50%)}.label-input:-webkit-any([data-up=true],:has(input:autofill),:has(input:-webkit-autofill)) .label-input-label{transform:translateY(-50%)translateY(-26px)scale(.78)}.label-input:is([data-up=true],:has(input:autofill),:has(input:autofill)) .label-input-label{transform:translateY(-50%)translateY(-26px)scale(.78)}.label-input[data-focus=true] .label-input-label{color:var(--label-input-accent)}.label-input .label-input-label:before{content:"";z-index:-1;background:var(--label-input-fill);opacity:0;border-radius:4px;transition:opacity .22s;position:absolute;inset:-3px -6px}.label-input:-webkit-any([data-up=true],:has(input:autofill),:has(input:-webkit-autofill)) .label-input-label:before{opacity:1}.label-input:is([data-up=true],:has(input:autofill),:has(input:autofill)) .label-input-label:before{opacity:1}.label-input-letters>span{display:inline-block}.label-input[data-focus=true] .label-input-letters>span{animation:.46s cubic-bezier(.3,.7,.3,1) both label-input-hop;animation-delay:calc(var(--i) * 24ms)}.label-input-clip{border-radius:max(0px, calc(var(--label-input-radius) - 1px));background:var(--label-input-fill);position:absolute;inset:1px;overflow:hidden}.label-input-field{width:100%;min-width:0;height:100%;padding:0 calc(var(--label-input-x) - 1px);border-radius:inherit;box-shadow:inset 0 0 0 1000px var(--label-input-fill);font:inherit;letter-spacing:-.01em;color:var(--label-input-ink);caret-color:var(--label-input-ink);background:0 0;border:0;outline:none;font-size:16px;position:absolute;inset:0}.label-input-field:-webkit-autofill{-webkit-text-fill-color:var(--label-input-ink)}.label-input[data-suffix=true] .label-input-field{padding-right:48px}.label-input-suffix{z-index:1;color:var(--brand-muted);pointer-events:none;position:absolute;top:50%;right:16px;transform:translateY(-50%)}.label-input[data-disabled=true] .label-input-box,.label-input[data-disabled=true] .label-input-label{cursor:default}@keyframes label-input-hop{0%{transform:translateY(0)}38%{transform:translateY(-3px)}to{transform:translateY(0)}}@media (prefers-reduced-motion:reduce){.label-input-ring path,.label-input-ring .label-input-gap,.label-input .label-input-label,.label-input .label-input-label:before{transition:none}.label-input-letters>span{animation:none!important}}@media (forced-colors:active){.label-input[data-focus=true] .label-input-box{outline-offset:2px;outline:2px solid highlight}}
