.np-field{--_outline-width:1px;--_outline-color:var(--np-color-outline);--_indicator-color:var(--np-color-on-surface-variant);--_indicator-focus-color:var(--_field-focus-indicator,var(--np-color-primary));--_label-color:var(--np-color-on-surface-variant);--_start-color:var(--np-color-on-surface-variant);--_end-color:var(--np-color-on-surface-variant);--_supporting-color:var(--np-color-on-surface-variant);--_floating-label-top:.5rem;--top-space:1.5rem;--bottom-space:.5rem;writing-mode:horizontal-tb;flex-direction:column;flex:1;max-width:100%;display:flex}.np-field:where(.np-field-outlined,.np-field-no-label){--top-space:1rem;--bottom-space:1rem}.np-field-outlined{--_floating-label-top:-.5rem}.np-field:where(:hover){--_outline-color:var(--np-color-on-surface)}.np-field-outlined:where(:hover){--_label-color:var(--np-color-on-surface)}.np-field:where(:focus,.np-field-open,:has(:is(.np-field-input,.np-field-value):focus)){--_outline-width:3px;--_outline-color:var(--_field-focus-outline,var(--np-color-primary));--_label-color:var(--_field-focus-label,var(--np-color-primary))}.np-field:where([aria-invalid=true],:has(:is(.np-field-input,.np-field-value):is(:user-invalid,[aria-invalid=true]))){--_outline-color:var(--np-color-error);--_indicator-color:var(--np-color-error);--_indicator-focus-color:var(--np-color-error);--_label-color:var(--np-color-error);--_end-color:var(--np-color-error);--_supporting-color:var(--np-color-error)}.np-field:where([aria-invalid=true],:has(:is(.np-field-input,.np-field-value):is(:user-invalid,[aria-invalid=true]))):where(:hover){--_outline-color:var(--np-color-on-error-container);--_indicator-focus-color:var(--np-color-on-error-container);--_label-color:var(--np-color-on-error-container);--_end-color:var(--np-color-on-error-container)}.np-field-disabled{--_outline-color:var(--np-color-on-surface);--_indicator-color:var(--np-color-on-surface);--_label-color:var(--np-color-on-surface);--_start-color:var(--np-color-on-surface);--_end-color:var(--np-color-on-surface);--_supporting-color:var(--np-color-on-surface);cursor:default;pointer-events:none}.np-field-box{border-radius:var(--_field-shape) var(--_field-shape) 0 0;height:100%;display:flex;position:relative}.np-field-outlined .np-field-box{border-radius:var(--_field-shape)}.np-field-background,.np-field-state-layer{border-radius:inherit;pointer-events:none;position:absolute;inset:0}.np-field-background{background:var(--_field-container-color)}.np-field-disabled .np-field-background{background:var(--np-color-on-surface);opacity:.04}.np-field:not(.np-field-disabled):hover .np-field-state-layer{background:var(--np-color-on-surface);opacity:.08}.np-field-indicator{pointer-events:none;z-index:1;position:absolute;inset:auto 0 0}.np-field-indicator:before,.np-field-indicator:after{content:"";border-bottom:1px solid var(--_indicator-color);position:absolute;inset:auto 0 0}.np-field-indicator:after{border-bottom:3px solid var(--_indicator-focus-color);opacity:0;transition:opacity var(--np-motion-expressive-fast-effects)}.np-field:where(:focus,.np-field-open,:has(:is(.np-field-input,.np-field-value):focus)) .np-field-indicator:after{opacity:1}.np-field-disabled .np-field-indicator:before{opacity:.38}.np-field-outline{inset:calc(var(--_outline-width) / 2 - .5rem) 0 0;padding:0 calc(.75rem - var(--_outline-width));border:var(--_outline-width) solid var(--_outline-color);border-radius:inherit;pointer-events:none;text-align:start;z-index:1;min-inline-size:0;transition:border-color var(--np-motion-expressive-fast-effects);margin:0;position:absolute}.np-field-outline legend{float:none;height:1rem;white-space:nowrap;visibility:hidden;max-inline-size:.01px;padding:0;font-size:.75rem;line-height:1rem;display:block;overflow:hidden}.np-field-outline legend>span{padding-inline:.25rem}.np-field-disabled .np-field-outline{opacity:.12}.np-field-row{border-radius:inherit;flex:1;align-items:center;min-width:0;min-height:100%;max-height:100%;display:flex;position:relative}.np-field-start,.np-field-middle,.np-field-end{box-sizing:border-box;height:100%;display:flex;position:relative}.np-field-start,.np-field-end{justify-content:center;align-items:center}.np-field-start{color:var(--_start-color);margin-inline:.75rem 1rem}.np-field-end{color:var(--_end-color);margin-inline:1rem .75rem}.np-field-start:has(.np-icon-button){margin-inline:.25rem .5rem}.np-field-end:has(.np-icon-button){margin-inline:.5rem .25rem}.np-field-disabled :is(.np-field-start,.np-field-end){opacity:.38}.np-field-icon{fill:currentColor;justify-content:center;align-items:center;display:flex;position:relative}.np-field-icon svg{fill:currentColor}.np-field-middle{flex:1;align-self:baseline;align-items:stretch;min-width:0}.np-field-content{min-width:0;color:var(--np-color-on-surface);opacity:0;flex:1;transition:opacity 83ms cubic-bezier(.2,0,0,1);display:flex}.np-field-label-wrapper{pointer-events:none;-webkit-user-select:none;user-select:none;text-align:initial;margin-inline:1rem;position:absolute;inset:0}.np-field-with-start:not(.np-field-outlined) .np-field-label-wrapper{margin-inline-start:0}.np-field-with-end:not(.np-field-outlined) .np-field-label-wrapper{margin-inline-end:0}.np-field-label{top:1rem;z-index:1;box-sizing:border-box;width:min-content;max-width:100%;color:var(--_label-color);text-overflow:ellipsis;white-space:nowrap;transition:color var(--np-motion-expressive-fast-effects);font-size:1rem;line-height:1.5rem;position:absolute;inset-inline-start:0;overflow:hidden}.np-field-disabled .np-field-label{opacity:.38}.np-field-required:after{content:"*"}.np-field-outlined.np-field-with-start .np-field-label-wrapper{margin-inline-start:3.25rem}.np-field-outlined.np-field-with-end .np-field-label-wrapper{margin-inline-end:3.25rem}.np-field:is(.np-field-populated,:focus,.np-field-open,:has(.np-field-input:is(:focus,:not(:placeholder-shown),:autofill)),:has(.np-field-value:focus)) .np-field-content{opacity:1}.np-field:is(.np-field-populated,:focus,.np-field-open,:has(.np-field-input:is(:focus,:not(:placeholder-shown),:autofill)),:has(.np-field-value:focus)) .np-field-label{top:var(--_floating-label-top);font-size:.75rem;line-height:1rem}.np-field:is(.np-field-populated,:focus,.np-field-open,:has(.np-field-input:is(:focus,:not(:placeholder-shown),:autofill)),:has(.np-field-value:focus)).np-field-outlined .np-field-label-wrapper{margin-inline:1rem}.np-field:is(.np-field-populated,:focus,.np-field-open,:has(.np-field-input:is(:focus,:not(:placeholder-shown),:autofill)),:has(.np-field-value:focus)) .np-field-outline legend{max-inline-size:100%}.np-field-no-label .np-field-content{opacity:1}.np-field-disabled:is(.np-field-no-label,.np-field-populated,:has(.np-field-input:is(:not(:placeholder-shown),:autofill))) .np-field-content{opacity:.38}.np-field-supporting-text{color:var(--_supporting-color);justify-content:space-between;gap:1rem;padding:.25rem 1rem 0;font-size:.75rem;line-height:1rem;display:flex}.np-field-disabled .np-field-supporting-text{opacity:.38}@media (prefers-reduced-motion:no-preference){.np-field-label{transition:color var(--np-motion-expressive-fast-effects), top var(--np-motion-expressive-fast-effects), font-size var(--np-motion-expressive-fast-effects), line-height var(--np-motion-expressive-fast-effects)}.np-field-label-wrapper{transition:margin var(--np-motion-expressive-fast-effects)}.np-field-outline{transition:border-color var(--np-motion-expressive-fast-effects), border-width var(--np-motion-expressive-fast-effects), inset var(--np-motion-expressive-fast-effects), padding var(--np-motion-expressive-fast-effects)}.np-field-outline legend{transition:max-inline-size var(--np-motion-expressive-fast-effects)}}