@layer components{.ui-input{width:100%;min-height:var(--touch-target);padding:0 var(--space-3);background-color:var(--color-surface-2);border:1px solid var(--color-border-strong);border-radius:var(--radius-md);color:var(--color-text);font-size:var(--text-base);transition:border-color var(--dur-2) var(--ease-out),box-shadow var(--dur-2) var(--ease-out)}.ui-input::placeholder{color:var(--color-text-3)}.ui-input:focus{outline:none;border-color:var(--color-accent);box-shadow:0 0 0 3px rgb(var(--rgb-accent) / .2)}.ui-input--invalid{border-color:var(--color-error)}.ui-input--invalid:focus{border-color:var(--color-error);box-shadow:0 0 0 3px var(--color-error-tint)}.ui-input-wrap{position:relative;width:100%}.ui-input-wrap__icon{position:absolute;left:var(--space-3);top:50%;transform:translateY(-50%);color:var(--color-text-3);pointer-events:none;font-size:var(--text-sm)}.ui-input--with-icon{padding-left:var(--space-8)}.ui-input[type=date]{-moz-appearance:none;appearance:none;-webkit-appearance:none}.ui-input--date-empty::-webkit-datetime-edit{color:var(--color-text-3)}.ui-input[type=date]::-webkit-calendar-picker-indicator{-moz-appearance:none;appearance:none;-webkit-appearance:none;width:1.1em;height:1.1em;cursor:pointer;background:transparent url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23b4b4bb' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='4' width='18' height='18' rx='2'/%3E%3Cline x1='16' y1='2' x2='16' y2='6'/%3E%3Cline x1='8' y1='2' x2='8' y2='6'/%3E%3Cline x1='3' y1='10' x2='21' y2='10'/%3E%3C/svg%3E") center / contain no-repeat}.ui-input[type=date]::-webkit-calendar-picker-indicator:hover{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23c8ff00' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='4' width='18' height='18' rx='2'/%3E%3Cline x1='16' y1='2' x2='16' y2='6'/%3E%3Cline x1='8' y1='2' x2='8' y2='6'/%3E%3Cline x1='3' y1='10' x2='21' y2='10'/%3E%3C/svg%3E")}.ui-field{display:flex;flex-direction:column;gap:var(--space-2)}.ui-field__label{font-size:var(--text-sm);font-weight:var(--weight-semibold);color:var(--color-text-2)}.ui-field__hint{font-size:var(--text-xs);color:var(--color-text-3)}.ui-field__error{font-size:var(--text-xs);color:var(--color-error)}}