.vi-text-input{--vi-input-height:var(--vi-control-height-md,2.75rem);--vi-input-padding-inline:var(--vi-space-3,.75rem);--vi-input-gap:var(--vi-space-2,.5rem);--vi-input-label-gap:var(--vi-space-2,.5rem);--vi-input-message-gap:var(--vi-space-2,.5rem);--vi-input-font-size:var(--vi-ref-font-size-md,.82rem);--vi-input-label-size:var(--vi-ref-font-size-xs,.62rem);--vi-input-message-size:var(--vi-ref-font-size-xs,.62rem);--vi-input-icon-size:var(--vi-ref-control-icon-md,1rem);--vi-input-label-color:var(--vi-standby-text);--vi-input-text-color:var(--vi-standby-text);--vi-input-placeholder-color:color-mix(in srgb, var(--vi-standby-text) 42%, transparent);--vi-input-message-color:color-mix(in srgb, var(--vi-standby-text) 58%, transparent);--vi-input-focus-color:var(--vi-active);--vi-input-error-color:var(--vi-color-danger,#ff8095);--vi-input-disabled-opacity:.42;width:min(100%,20rem);color:var(--vi-input-text-color);gap:0;display:grid}.vi-text-input[data-size=sm]{--vi-input-height:var(--vi-control-height-sm,2rem);--vi-input-padding-inline:var(--vi-space-2,.5rem);--vi-input-font-size:var(--vi-ref-font-size-sm,.72rem);--vi-input-icon-size:var(--vi-ref-control-icon-sm,.875rem)}.vi-text-input[data-size=lg]{--vi-input-height:var(--vi-control-height-lg,3.25rem);--vi-input-padding-inline:var(--vi-space-4,1rem);--vi-input-font-size:var(--vi-ref-font-size-lg,1rem);--vi-input-icon-size:var(--vi-ref-control-icon-lg,1.25rem)}.vi-text-input__label{margin-bottom:var(--vi-input-label-gap);color:var(--vi-input-label-color);font-family:var(--vi-font-code,ui-monospace, monospace);font-size:var(--vi-input-label-size);letter-spacing:var(--vi-ref-letter-spacing-label,.07em);font-weight:700;line-height:var(--vi-ref-line-height-control,1.2);text-transform:uppercase}.vi-text-input__label>span{color:var(--vi-active)}.vi-text-input__surface{width:100%;transition:border-color var(--vi-motion-duration-fast,.12s) var(--vi-motion-ease-out,ease-out), box-shadow var(--vi-motion-duration-fast,.12s) var(--vi-motion-ease-out,ease-out)}.vi-text-input__field{height:var(--vi-input-height);align-items:center;gap:var(--vi-input-gap);padding:0 var(--vi-input-padding-inline);display:flex}.vi-text-input__field input{width:100%;min-width:0;height:100%;color:var(--vi-input-text-color);font-family:var(--vi-font-body,ui-sans-serif, system-ui, sans-serif);font-size:var(--vi-input-font-size);line-height:var(--vi-ref-line-height-control,1.2);background:0 0;border:0;outline:0;padding:0}.vi-text-input__field input::placeholder{color:var(--vi-input-placeholder-color);opacity:1}.vi-text-input__icon{width:var(--vi-input-icon-size);height:var(--vi-input-icon-size);color:var(--vi-input-message-color);transition:color var(--vi-motion-duration-fast,.12s) var(--vi-motion-ease-out,ease-out);flex:none}.vi-text-input__message{margin-top:var(--vi-input-message-gap);color:var(--vi-input-message-color);font-family:var(--vi-font-body,ui-sans-serif, system-ui, sans-serif);font-size:var(--vi-input-message-size);line-height:var(--vi-ref-line-height-body,1.5)}.vi-text-input:focus-within .vi-text-input__surface{border-color:var(--vi-input-focus-color);box-shadow:0 0 0 var(--vi-focus-width,2px) color-mix(in srgb, var(--vi-input-focus-color) 16%, transparent)}.vi-text-input:focus-within .vi-text-input__icon{color:var(--vi-input-focus-color)}.vi-text-input[data-invalid=true] .vi-text-input__surface{border-color:var(--vi-input-error-color)}.vi-text-input[data-invalid=true] .vi-text-input__message,.vi-text-input[data-invalid=true] .vi-text-input__icon{color:var(--vi-input-error-color)}.vi-text-input[data-disabled=true]{cursor:not-allowed;opacity:var(--vi-input-disabled-opacity)}.vi-text-input[data-disabled=true] input{cursor:not-allowed}@media (prefers-reduced-motion:reduce){.vi-text-input__surface,.vi-text-input__icon{transition-duration:.01ms}}